» »

Слайдер для изображений на JS сайта uCoz


Слайдер для изображений на JS сайта uCoz

Это небольшой слайдер под изображение, который можно поставить в блок. Он имеет красивый эффект перелистывание и ссылки на переход. Сам он сделан компактно и по умолчанию он автоматически проматывает картинки, которые сам администратор установил и прописал на их название и также можно кратко в низу описать, но здесь уже сами решаете, как вам удобнее.

При наведение клика, появляются по правую и по левую сторону функций ручного переключателя. Что по материалу, то можно поставить сколько угодно, но думаю от 5 до 7 будет в самый раз, чтоб пользователь увидев материал, не стал долго переключать, чтоб найти его. Он создан как на CSS так и на JS, что и придает ему такую стилистику и как уже упоминал, это красивый и стильный переход.

Здесь мы видим, как он будет работать в автоматическом режиме.

Адаптивный слайдер сайта

Это уже в ручном, и наведение клика и под него функций с названием на полупрозрачной платформе появляются.

Красивый слайдер для темного сайта

Приступаем к установке:

Проверяя его и выставлял в блок сайта на темный шаблон, что он отлично подошел, только оставалось поставить по центру. Здесь же его компактность может сыграть на многое, это если у вас шапка широкая на сайте, то там его можно разместить и не забываем про низ.

Код
<div align="center">
<div><div class="box_content_menu">  
<div id="coin-slider">  
  <a href="http://zornet.ru/load/temnyj_shablon_kinogo_dlja_sajta_ucoz/142-1-0-7808"><img border="0" src="http://zornet.ru/zorner_ru_1/aves/4cd6a7a0d1af4fcaae321ae1b9733fe8.png" style="max-width:200px;"/> <span><b>Скрипты на zornet</b><div style="margin-right:15px;float: right;"></div>
Здесь дизайн на ваш сайт</span></a>  
  <a href="http://zornet.ru/load/ikonki_v_stile_google_dlja_socialnykh_setej/144-1-0-7806"><img border="0" src="http://zornet.ru/zorner_ru_1/aves/dfdaac8050ca480d840f8e1acdd3cbc3.png" style="max-width:200px;"/> <span><b>Шаблоны на сайте zornet</b><div style="margin-right:15px;float: right;"></div>
Слайдер широкий на ресурс </span></a>  

<a href="http://zornet.ru/load/temnye_ikonki_grupp_na_igru_stalker/24-1-0-7804"><img border="0" src="http://zornet.ru/zorner_ru_1/aves/c9f62c18496a4204b684612631584811.png" style="max-width:200px;"/> <span><b>Дизайн на портале zornet</b><div style="margin-right:15px;float: right;"></div>
Скрипт для блокировки рекламы</span></a>  
</div>  
<script type="text/javascript" src="http://zornet.ru/zorner_ru_1/aves/slider.js"></script>  
<script type="text/javascript" src="http://zornet.ru/zorner_ru_1/aves/slide_options.js"></script>  
  <link type="text/css" rel="StyleSheet" href="http://zornet.ru/zorner_ru_1/aves/novosti_saite.css" />  
</div></div>
</div>

Он изначально был разработан для актуальной информации, это может быть как новости или что то другое, что как можно донести для тех, кто зашел на сайт.
31.05.2017 Просмотров: 355 Комментарий: (0)

Поделиться в социальных сетях

Материал разместил

Комментарий: 0
avatar