Всем доброе время суток.
И так сегодня к вашему вниманию представить хочу - "jQuery Slider v0.7"
И так что от вас требуется а собственно не чего сложного.
И так давайте приступим к самой установке
И так скачиваем "АРХИВ" распаковываем и видим там такие "ПАПКИ"
css >>> images >>> js
Загружаем их в свой "Файловый менеджер"
После заходим на нужную страницу сайта и между тегами - <head> и </head> ставим:
Код
<link rel="stylesheet" type="text/css" href="css/style.css" media="screen">
<link rel="stylesheet" type="text/css" href="css/slider.css" media="screen">
<link rel="stylesheet" type="text/css" id="skin" href="css/skins/sky-blue.css" media="screen">
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="css/ie.css" media="all">
<![endif]-->
<!-- Javascripts -->
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.nivoslider.pack.js"></script>
<script type="text/javascript">
// Nivo Slider Опции
$(document).ready(function(){
$("#slider").nivoSlider({
effect: 'random', //Укажите наборы, как: «fold, fade, sliceDown"
slices: 20,
pauseTime: 5000,
directionNavHide: false,
pauseOnHover: true, //Остановить анимацию при наведении указателя
manualAdvance: false, //Силы ручной переходы
captionOpacity: 0.8 //Универсальная подпись непрозрачность
});
});
</script>
И там где хотим видеть данный - "jQuery Slider v0.7" ставим между <body> и </body> ставим код:
Код
<div id="wrapper">
<div id="header_container">
<div id="header">
<div id="slider_container">
<div id="slider">
<a href="ссылка" target="_blank">
<img src="images/slider/slide1.jpg" width="940" height="350" alt="">
</a>
<a href="ссылка" target="_blank">
<img src="images/slider/slide2.jpg" width="940" height="350" alt="">
</a>
<a href="ссылка" target="_blank">
<img src="images/slider/slide5.jpg" width="940" height="350" alt="">
</a>
<a href="ссылка" target="_blank">
<img src="images/slider/slide4.jpg" width="940" height="350" alt="">
</a>
</div>
</div>
</div>
</div>
Собственно данные ссылки меняем на свои ( или своих партнеров )
Если вы желаете добавить количество картинок в данной разработке делаем следующие :
Код
<a href="http://www.ваша ссылка.ru/" target="_blank">
<img src="images/slider/путь картинки.jpg" width="940" height="350" alt="">
</a>
Вот собственно и все, нет не чего сложного вовсе!
Желаю успехов....
Спасибо за ваше внимание с уважением.
jQuery, Slider, v0.7
|