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

Простой слайдер изображений на CSS и jQuery для вашего сайта на uCoz
24.06.14, 16:56:15

Скачать файл




Абсолютно случайно набрёл на вот такой простой слайдер изображений. Уверен, что найдётся много желающих установить его на свой сайт

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

Моё тестирование в фидле: ДЕМО

Установка:

После < /head > на нужных страницах вставляйте:
Код
<link rel="stylesheet" href="/css/jQuery.isc.css">  
  <script src="/js/jquery-image-scale-carousel-condensed.js"></script>

В самый низ вашего css:
Код
#nav_container {  
  width: 960px;  
  margin: auto;  
  }  

  #photo_container {  
  width: 960px;  
  height: 400px;  
  margin: auto;  
  background-color: #000;  
  }  

  .clear {  
  clear: both;  
  }

В то место, где будет слайдер:
Код
<div id="ph">  
  <div id="photo_container"></div>  
  </div>  

  <script>  
  var carousel_images = [  
  "Ссылка на картинку",  
  "Ссылка на картинку",  
  "Ссылка на картинку",  
  "Ссылка на картинку"  
  ];  

  $(window).load(function () {  
  $("#photo_container").isc({  
  imgArray: carousel_images  
  });  
  });  

  function resize(w, h) {  
  $("#photo_container").remove();  
  $("#count_container").remove();  
  $("#ph").html('<div id="photo_container"></div>');  
  $("#photo_container").css({  
  "width": w + "px",  
  "height": h + "px"  
  });  
  $("#photo_container").isc({  
  imgArray: carousel_images  
  });  
  };  
  </script>


Скрипт из прикреплённого архива залейте в папку js, стиль в папку css и картинки в папку img

Материал подготовлен Apocalypse
Категория: jQuery | Добавил: Apocalypse | Теги: CSS, изображений, на, JQuery, Вашего, простой, сайта, для, слайдер
Просмотров: 569 | Загрузок: 0 | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email: