Главная » Файлы » Прочие скрипты » jQuery |
Оригинальная галерея через плагин slidesjs на jQuery для uCoz
23.06.14, 14:54:24 | |
Отличная галерея, которая занимает мало места и в то же время является вполне функциональной Для начала посмотрите ДЕМО Установка: После /head на нужных страницах вставляйте: Код <script src="/js/slides.min.jquery.js"></script> <script> $(function(){ $('#products').slides({ preload: true, preloadImage: '/images/loading.gif', effect: 'slide, fade', crossfade: true, slideSpeed: 200, fadeSpeed: 500, generateNextPrev: true, generatePagination: false }); }); </script> <link rel="stylesheet" href="/css/global.css"> Следующий код в то место, где будет галерея: Код <div id="products_example"> <div id="products"> <div class="slides_container"> <a href="Ссылка" target="_blank"><img src="Ссылка на большое изображение" width="366"></a> <a href="Ссылка" target="_blank"><img src="Ссылка на большое изображение" width="366"></a> <a href="Ссылка" target="_blank"><img src="Ссылка на большое изображение" width="366"></a> <a href="Ссылка" target="_blank"><img src="Ссылка на большое изображение" width="366"></a> <a href="Ссылка" target="_blank"><img src="Ссылка на большое изображение" width="366"></a> </div> <ul class="pagination"> <li><a href="#"><img src="Ссылка на маленькое изображение" width="55"></a></li> <li><a href="#"><img src="Ссылка на маленькое изображение" width="55"></a></li> <li><a href="#"><img src="Ссылка на маленькое изображение" width="55"></a></li> <li><a href="#"><img src="Ссылка на маленькое изображение" width="55"></a></li> <li><a href="#"><img src="Ссылка на маленькое изображение" width="55"></a></li> </ul> </div> </div> Осталось лишь залить скрипт из прикреплённого архива в папку js, стиль в папку css и все картинки в папку images Материал подготовлен Apocalypse | |
Просмотров: 422 | Загрузок: 0 | |
Всего комментариев: 0 | |
| |