Главная » 2012 » Март » 16 » JavaScript's: Интересное слайдшоу на jQuery
18:18 JavaScript's: Интересное слайдшоу на jQuery | ||||||||||||
Интересное слайдшоу на jQueryСоветуем посмотреть: src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> ДЕМО МАТЕРИАЛА Для начала в head на нужных вам страницах вставьте: Code <script type="text/javascript" src="/js/jquery.infinitecarousel.js"></script> <script type="text/javascript"> $(function(){ $('#carousel').infiniteCarousel({ displayTime: 6000, textholderHeight : .25 }); }); </script> <style type="text/css"> body { padding-top: 50px; } #carousel { margin: 0 auto; width: 400px; height: 390px; padding: 0; overflow: scroll; border: 2px solid #999; } #carousel ul { list-style: none; width: 1500px; margin: 0; padding: 0; position: relative; } #carousel li { display: inline; float: left; } .textholder { text-align: left; font-size: small; padding: 6px; -moz-border-radius: 6px 6px 0 0; -webkit-border-top-left-radius: 6px; -webkit-border-top-right-radius: 6px; } </style> Далее прописывайте в то место, где будет располагаться ваша галерея: Code <div id="carousel"> <ul> <li> <img alt="" src="Ссылка на картинку 1" width="500" height="213" /> ОПИСАНИЕ КАРТИНКИ 1</p> </li> <li> <img alt="" src="Ссылка на картинку 2" width="500" height="213" /> ОПИСАНИЕ КАРТИНКИ 2</p> </li> <li> <img alt="" src="Ссылка на картинку 3" width="500" height="213" /> ОПИСАНИЕ КАРТИНКИ 3</p> </li> </ul> </div> Далее в файловый менеджер в папку js (Если такой у вас нет - создайте) залейте скрипт из прикреплённого архива Всё! Пользуйтесь на здоровье Материал взят с сайта infoscript.ru Теги: Скачать Интересное слайдшоу на jQuery
|