Вторник, 08.07.2025, 19:12
Главная Регистрация RSS
Приветствую Вас, Гость
НОВЫЕ КОМЕНТАРИИ
Коментарий:Сколько лет прошло, старина?) зарегался, просто вспомнить те времена,
Добавил:Vj PitBulvjpitbul94

Коментарий:Всё исправил, проверил , скачивайте
Добавил:Modred

Коментарий:Классный скрипт , но на PHP
Добавил:ZemHU

Коментарий:Отличный движок Добавил:DexonEdutt

Коментарий:Легко установить Добавил:Mixhoarm

Коментарий:Среди Московских фирм, G - group самая надёжная и ответственная компан
Добавил:Михаил

Статистика

Онлайн всего: 1
Гостей: 1
Пользователей: 0

Нас сегодня посетили :
Поиск
Главная » Файлы » Скрипты для UCOZ » Скрипт вид материалов для UCOZ

Всплывающая подсказка внутри картинок при наведении

Всплывающая подсказка внутри картинок при наведении
Простой легко настраиваемый плагин для отображения всплывающих подсказок внутри картинки при наведении.

Установка подсказок для картинок:

1.После /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://mega.ucoz.ua/demo/podsk_v_kart/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>


Всё, скрипт подключен.
2. Теперь достаточно присвоить картинке класс captify и прописать подсказку (alt="Текст подсказки), чтобы плагин обработал изображение :

Код
<img src="Ссылка на картинку" alt="Текст подсказки" width="Ширина" border="0" class="captify" >

ПОСМОТРЕТЬ ДЭМО ВЕРСИЮ

К материалу оставили ссылку на демоверсию, по которой вы можете оценить функционал данного материала. При обнаружении ссылки, не содержашей демоверсии, сообщите об этом Администратору.

Похожие материалы:

Категория: Скрипт вид материалов для UCOZ | Добавил: Sofacker | Теги: вид материалов ucoz
Просмотров: 1241 | Загрузок: 0 | Комментарии: 9 | Рейтинг: 0.0/0
Всего комментариев: 9
1   [Материал]
smile  biggrin  cool

2   [Материал]
smile  biggrin  cool

3   [Материал]
P.S. кто то справшивал про восстановление

4   [Материал]
smile  biggrin  cool

5   [Материал]
smile  biggrin  cool

6   [Материал]
smile  biggrin  cool

7   [Материал]
smile  biggrin  cool

8   [Материал]
smile  biggrin  cool

9   [Материал]
smile  biggrin  cool