Описание при наведении курсора на изображение
 | |
| Отличный скрипт по своей функциональности, так как его можно поставить хоть на сам сайт или в материал, это появление описание, когда вы наводите курсор на изображение. Вы ставите тематическую картинку и пишите статью или простою заметку и все в скрипт, который ниже представлен. Пользователь просто наводит и изображение поднимается вверх и остается один текст. Первый идет под жирным шрифтом, а вот второй уже стандартный. При создание сайта или когда он уже у вас есть, можно просто в добавление материала поставить все и выставить только не забудьте "Панель 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 | |
Поделиться в социальных сетях
Материал разместил
| Комментарии: 5 | |
|
| |
