Главная » Файлы » Для uCoz » Скрипты Разное Ucoz |
Всплывающая подсказка внутри картинок при наведении
[ Скачать с сервера (1.1 Kb) ] | 13.01.2013, 16:32 |
Установка подсказок для картинок: После /head на всех нужных вам страницах вставляйте: Код <style> .caption-top, .caption-bottom { color: #ffffff; padding: 1.2em; font-weight: bold; font-size: 13px; font-family: arial; cursor: default; border: 0px solid #334143; background: #000000; text-shadow: 1px 1px 0 #202020; } .caption-top { border-width: 0px 0px 8px 0px; } .caption-bottom { border-width: 8px 0px 0px 0px; } .caption a, .caption a { border: 0 none; text-decoration: none; background: #000000; padding: 0.3em; } .caption a:hover, .caption a:hover { background: #202020; } </style> <script type="text/javascript" src="http://shablon-for.ucoz.net/js/captify.tiny.js"></script> <script type="text/javascript"> $(function(){ $('img.captify').captify({ // Скорость при наведении курсора speedOver: 'fast', // Скорость при отведении курсора speedOut: 'normal', // Задержка hideDelay: 500, // Эффект анимации: 'fade', 'slide', 'always-on' animation: 'slide', // Прозрачность подложки подсказки opacity: '0.30', // css класс подсказки className: 'caption-bottom', // Позиция подсказки (top или bottom) position: 'bottom' }); }); </script> Всё, скрипт подключен. Теперь достаточно присвоить картинке класс captify и прописать подсказку (alt="Текст подсказки), чтобы плагин обработал изображение : Код <img src="Ссылка на картинку" alt="Текст подсказки" width="Ширина" border="0" class="captify" > | |
Просмотров: 1463 | Загрузок: 77
| Жаловаться на материал
| Рейтинг: 5.0/13 |