PgwSlider- бесплатный адаптивный слайдер для Ucoz

PgwSlider- бесплатный адаптивный слайдер для Ucoz

PgwSlider- бесплатный адаптивный слайдер для Ucoz-подойдет любым сайтам так как основой этого слайдер являются изображения которые вы укажете в скрипте,состоит этот слайдер из большого центрального слайдера и четырех маленьких которые расположились справа,также на картинке снизу находится прозрачная черная полоска где выводится название,которое тоже зависит от того что вы напишите

Установка:Первым делом скачиваем архив с файлами слайдера с нашего сайта
Папки "js" и "css" из скачанного архива переносим в корень сайта
В < head > прописываем следующее:

Код
<link rel="stylesheet" href="/css/pgwslider.css" type="text/css">  
<link rel="stylesheet" href="/css/pgwslider.min.css" type="text/css">


Это сам слайдер ставим там где желаем видеть

Код
<script type="text/javascript" src="/js/pgwslider.js"></script> <script type="text/javascript" src="/js/pgwslider.min.js"></script> <script> $(document).ready(function() { $('.pgwSlider').pgwSlider(); }); </script>


Это ставим перед закрывающимся тегом

Код
<ul class="pgwSlider"> <li><img src="paris.jpg" alt="Paris, France" data-description="Eiffel Tower and Champ de Mars"></li> <li><img src="montreal_mini.jpg" alt="Montréal, QC, Canada" data-large-src="montreal.jpg"></li> <li> <img src="shanghai.jpg"> <span>Shanghai, China</span> </li> <li> <a href="http://www.nyc.gov" target="_blank"> <img src="new-york.jpg"> <span>New York, NY, USA</span> </a> </li> </ul>


Примечание:кто не знает все эти коды вставляются в одну страницу модуля,например если вы желаете слайдер на главной странице расположить,то все эти три кода должны быть там
PgwSlider- бесплатный адаптивный слайдер для Ucoz
Файлы для скачивания отсутствуют.
Поблагодарить автора Автор: Turbo
Комментарии (0)
Добавить комментарий
class="add-comm-form clearfix add-shadow2" id="add-comm-form">
avatar