» »

Описание при наведении курсора на изображение


Описание при наведении курсора на изображение

Отличный скрипт по своей функциональности, так как его можно поставить хоть на сам сайт или в материал, это появление описание, когда вы наводите курсор на изображение. Вы ставите тематическую картинку и пишите статью или простою заметку и все в скрипт, который ниже представлен. Пользователь просто наводит и изображение поднимается вверх и остается один текст.

Первый идет под жирным шрифтом, а вот второй уже стандартный. При создание сайта или когда он уже у вас есть, можно просто в добавление материала поставить все и выставить только не забудьте "Панель HTML кодов" и можете писать что вам нужно, вообщем вы поняли суть работы.

Установка:

Ставим там, где вы хотите видеть, можно в самом материале любого модуля, кроме форума.

Код
<style type="text/css" rel="stylesheet">  
  #bo1xe {margin:10px; font-size:15px; color:#f9f9f9;}  
  #bo2xe {margin:5px; font-size:17px; color:#f1f1f1;}  
  #bonxe {position:relative; width:325px; height:325px; z-index:1; overflow:hidden; margin:5px; border:5px solid #cdcdcd; background:#131313;}  
  #bonxe img {position:absolute; width:325px; height:325px; z-index:2;}  
  </style>  

  <script type="text/javascript">$(function(){$("#bonxe").hover(function(){$(this).find("img").stop().animate({top:-325},500);},function(){$(this).find("img").stop().animate({top:0},500);});});</script>  

  <div id="bonxe">  
  <img src="http://zornet.ru/Ajaxoskrip/Aster/02f3-5.jpg">  
  <div id="bo1xe">  
  <b id="bo2xe">Заголовок в жирном описание</b>  
  <p>Здесь вы пишите, по вашему материалу, или вообще правила сайта, что вам нужно и что придумаете, зачем вам.</p>  
  </div></div>


Источник: Еn.do.am
15.08.2016 Просмотров: 498 Комментарий: (5)

Поделиться в социальных сетях

Материал разместил

Комментарий: 5
Brung
Brung 15.08.2016 03:271
0
Интересно, куда можно пристроить этот скрипт, нужно было DEMO сделать. Просто на другие есть, а здесь не чего почти не нужно, если на тестовом проверяли, то и демонстрация нормально была.
Kosten
Kosten 15.08.2016 03:292
0
Да можно потом сделать, главное правильно сказано. что он проверен и работает. Просто что в жирном шрифте, там должен быть заголовок, а пришлось по ошибке описание сделать.
Сафрон
Сафрон 15.08.2016 03:313
0
Вот вы спрашиваете куда можно установить его, как говорил давно, если скрипт или материал рабочий, то он всегда место найдет, что по одному шаблону делать, что то нужно свое привносить на сайт.
feliksteg
feliksteg 16.08.2016 16:514
0
Не скажу что скрипт такой оригинальный, он мне давно знаком и правильно на такой сайт не поставить, но разве что в сам материал, что по дизайн, то нужен оригинальный сайт.
Kosten
Kosten 16.08.2016 17:475
0
Но не думаю, что так сильно под дизайн его нужно настраивать. можно и в статье применить.
avatar