Главная » Файлы » Прочие скрипты » jQuery |
Красивое увеличение картинки с эффектом вращения при наведении курсора на jQuery
23.06.14, 13:48:31 | |
Интересный, качественно реализованный эффект увеличения картинки при наведении курсора мышки Для начала посмотрите ДЕМО Установка: После /head на нужных страницах вставляйте: Код <script src="/js/init.js" type="text/javascript"></script> <script src="/js/raphael.js" type="text/javascript"></script> <style>ul.reset, ul.reset li { display:block; list-style:none; padding:0; margin:0; } .gallery ul li { width:200px; /* a half of image width */ height:200px; /* a half of image height */ margin:0 10px 10px 0; float:left; position:relative; } .holder { position:absolute; top:0; left:0; margin:-100px 0 0 -100px; /* margin-left: a half of 'li' width and margin-top: a half of 'li' height */ } </style> Следующий код в то место, где будет сама картинка: Код <div class="gallery"> <ul class="reset"> <li><img src="Ссылка на картинку" border="0" /></li> </ul> </div> При желании и знании css вы легко сможете отредактировать все параметры скрипта под себя Осталось лишь залить два скрипта из прикреплённого архива в папку js Источник материала: http://u1.do.am Материал подготовлен Apocalypse | |
Просмотров: 296 | Загрузок: 0 | |
Всего комментариев: 0 | |
| |