Главная » Файлы » Прочие скрипты » jQuery

Простой приятный слайдер через плагин Easy gallery и библиотеку эффектов jQuery Easing на jQuery
23.06.14, 09:34:14

Скачать файл




Очень простой, но приятный в своём исполнении плагин. Приятно удивляет качественная анимация переходов

Для начала посмотрите ДЕМО

Установка:

После /head на нужных страницах вставляйте:
Код
<style type="text/css">
  #gallery{  
border:#000 solid 5px;  
  }  
  .tclass{  
cursor:pointer;  
display:inline;  
float:left;  
min-width:8px;  
min-height:6px;  
padding:5px;  
margin-right:10px;  
  }  
  .ac{  
border-bottom:#333 solid 1px;  
  }  
  </style>
  <script type="text/javascript" src="/js/jquery.easing.1.3.js"></script>
  <script type="text/javascript" src="/js/easy-gallery.js"></script>
  <script type="text/javascript">
  $(document).ready(function (){  
$("#gallery").egallery({  
width:500,  
height:230,  
speed: 1000,  
delay:4000,  
easing:'easeInOutBack',  
thumbs:'numbers',  
thumbClass:'tclass',  
aClass:'ac'  
});  
  });  
  </script>


В то место, где будет сам слайдер, вставляйте следующий код:
Код
<div id="gallery">
<ul>
<li><img src="Ссылка на картинку 1" border="0" alt="" /></li>
<li><img src="Ссылка на картинку 2" border="0" alt="" /></li>
<li><img src="Ссылка на картинку 3" border="0" alt="" /></li>
<li><img src="Ссылка на картинку 4" border="0" alt="" /></li>
<li><img src="Ссылка на картинку 5" border="0" alt="" /></li>
</ul>
  </div>
  <div id="ssgThumbs"></div>  
  <br clear="all" />


Остаётся лишь залить два скрипта из прикреплённого архива в папку js

Материал подготовлен Apocalypse
Категория: jQuery | Добавил: Apocalypse | Теги: Эффектов, Через, плагин, JQuery, easy, приятный, простой, gallery, библиотеку, слайдер
Просмотров: 363 | Загрузок: 0 | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email: