Пятница, 19.04.2024, 16:38
Главная Регистрация RSS
Приветствую Вас, Гость
НОВЫЕ КОМЕНТАРИИ
Коментарий:Невероятно....это полезный веб-сайты.
Добавил:Stevensleed

Коментарий:Сколько лет прошло, старина?) зарегался, просто вспомнить те времена,
Добавил:Vj PitBulvjpitbul94

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

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

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

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

Статистика

Онлайн всего: 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
Просмотров: 1173 | Загрузок: 0 | Комментарии: 11 | Рейтинг: 0.0/0
Всего комментариев: 111 2 »
1   [Материал]
smile  biggrin  cool

2   [Материал]
сорри за оффтоп

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

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

5   [Материал]
ЗЫ: кто-то на форуме задавал вопрос

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

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

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

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

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

1-10 11-11