Главная » Файлы » Прочие скрипты » jQuery |
Движущаяся шапка эффект 3D by jquery.com для uCoz
24.06.14, 10:14:07 | |
На мой взгляд данная технология не требует сверх естественного описания. Движущаяся шапка, эффект 3D (jQuery Smart3D) - и не более того.. Предлагаю взглянуть на ДЕМО Как пример, взял фон старого apo, для креативности Установка: Шаг-1 JS: Давайте установим после тега следующие скрипты: Код <script type="text/javascript" src="/Smart3D/jquery.smart3d.js"></script> <script type="text/javascript"> $(function() { $('#mindscape').smart3d(500); $('#monsteck_variketch').smart3d(500); }); </script> Многие могли догадаться, что значение 500 - это ширина нашей с вами шапки, поэтому не забываем их менять, когда будете устанавливать свою шапку для блога. Шаг-2 HTML: Тут всё просто, мы будем использовать списки в которые поместим ссылку на графическое изображение шапки, основного фона и фона с движущимся персонажем в моём случае: Код <ul id="mindscape"> <li><img src="fon_1.jpg" /></li> <li><img src="fon_2.png" /></li> </ul> Шаг-3 CSS: в css стилях, мы прописываем размер фона нашей шапки, обратите внимание, что размер ширины меньше на 100 пикселей, делается это для того, чтобы наши с вами изображения реагировали на движения стрелки мыши и прописываем overflow: hidden; Код #mindscape { width: 400px; height: 225px; overflow: hidden; } #monsteck_variketch { width: 400px; height: 225px; overflow: hidden; } На этом всё.. Материал подготовлен: GrandDooM Источник: http://jquery.com/ | |
Просмотров: 523 | Загрузок: 0 | Комментарии: 8 | |
Всего комментариев: 0 | |
| |