Главная » Файлы » Прочие скрипты » jQuery |
Слайдер изображений на jQuery для uCoz
22.06.14, 19:52:37 | |
Установка: Все необходимые файлы для правильной работы скрипта в архиве. Всё, что находится в папке залить в файловый менеджер (Не меняя структуры). Далее в head на страницах, где будет отображаться слайдер вставьте: Код <link rel="stylesheet" href="/style.css" type="text/css" media="screen" /> <script type="text/javascript" src="/js/scripts.js"></script> <script type="text/javascript"> if(!window.slider) var slider={};slider.data=[{"id":"slide-img-1","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-2","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-3","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-4","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-5","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-6","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-7","client":"nature beauty","desc":"add your description here"}]; </script> Css и скрипт можете переписать под себя (Если хватает знаний) В то место, где будет располагаться сам слайдер, вставьте: Код <div class="wrap"> <div id="slide-holder"> <div id="slide-runner"> <a href=""><img id="slide-img-1" src="/images/nature-photo.png" class="slide" alt="" /></a> <a href=""><img id="slide-img-2" src="/images/nature-photo1.png" class="slide" alt="" /></a> <a href=""><img id="slide-img-3" src="/images/nature-photo2.png" class="slide" alt="" /></a> <a href=""><img id="slide-img-4" src="/images/nature-photo3.png" class="slide" alt="" /></a> <a href=""><img id="slide-img-5" src="/images/nature-photo4.png" class="slide" alt="" /></a> <a href=""><img id="slide-img-6" src="/images/nature-photo4.png" class="slide" alt="" /></a> <a href=""><img id="slide-img-7" src="/images/nature-photo6.png" class="slide" alt="" /></a> <div id="slide-controls"> <p id="slide-client" class="text"><strong>post: </strong><span></span></p> <p id="slide-desc" class="text"></p> <p id="slide-nav"></p> </div> </div> </div> </div> Всё. Слайдер сложноват в настройке для неопытных пользователей, однако, я думаю, что с уровнем знаний выше среднего можно адаптировать данный скрипт и для Фотоальбома | |
Просмотров: 454 | Загрузок: 0 | |
Всего комментариев: 0 | |
| |