Блог про верстку и CSS. Примеры html кода и интересные приемы.
Простой jQuery Tooltip Plugin
Наткнулся на очень простой и удобный плагин для подсказок... jQuery Tooltip Plugin...
Часто бывает необходимость выводить подсказку... стандартные способы не так хороши как хотелось бы... выход есть:
<link rel="stylesheet" type="text/css" href="colortip-1.0/colortip-1.0-jquery.css"/> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript" src="colortip-1.0/colortip-1.0-jquery.js"></script> <script type="text/javascript" src="script.js"></script>
Готово.
Источник: http://tutorialzine.com/2010/07/colortips-jquery-tooltip-plugin/
| Print article | This entry was posted by pulev on 19.07.2010 at 10:16, and is filed under css, hints, js. Follow any responses to this post through RSS 2.0. Вы можете оставить комментарий или трэкбэк с вашего сайта. |
Пока нет комментариев.
Нет трэкбэков.
Красивый эффект наведения с помощью CSS и jQuery
1 месяц назад - Нет комментариев
Очень красивый эффект при наведении на картинку... Все очень легко и просто! Верстка: <ul> <li><img src="images/77335_4871.jpg" title="Autumn Leaves" /></li> <li><img src="images/107023_5283.jpg" title="Cloudy Skies" /></li> <li><img src="images/1282015_12556521.jpg" title="Nice Horsy" /></li> <li><img src="images/1262387_19591724.jpg" title="Grassy Meadows" /></li> <li><img src="images/220121_3233.jpg" title="Jigsaw Pieces" /></li> <li><img src="images/1282209_96954111.jpg" title="Retro Groove" /></li> </ul> Стили css: div.wrapper{width:218px; height:218px; overflow:hidden; position:relative; } div.caption {position:relative; text-align:center; padding:55px 15px} Javascript:
Закругленные уголки у картинок с помощью jQuery
1 месяц назад - Нет комментариев
Недавно была необходимость сделать круглые уголки у картинки... повозился... отказался от идеи не найдя хорошего решения... Случайно нашел оч. хороший способ... Хочется вот такой красоты после применения border-radius и box-shadow: А получаем: Есть небольшой трюк для фикса: <span class="rounded-img" style="background: url(img/thumb1.jpg) no-repeat center center; width: 70px; height: 70px;"> <img src="img/thumb1.jpg" style="opacity: 0;" /> </span> Вокруг картинки добавляем и на него вешаем
