Просто слайдер с увиличением картинки при клике
Добрый день!
Помогите, плиз! Есть слайдер, который прокручивает массив картинок. Вот код <script type="text/javascript"> /*** Simple jQuery Slideshow Script Released by Jon Raasch (jonraasch.com) under FreeBSD license: free to use or modify, not responsible for anything, etc. Please link out to me if you like it :) ***/ function switchNext(){ var $active = $('#slideshow IMG.active'); if ( $active.length == 0 ) $active = $('#slideshow IMG:last'); // use this to pull the images in the order they appear in the markup var $next = $active.next().length ? $active.next() : $('#slideshow IMG:first'); // uncomment the 3 lines below to pull the images in random order // var $sibs = $active.siblings(); // var rndNum = Math.floor(Math.random() * $sibs.length ); // var $next = $( $sibs[ rndNum ] ); $active.addClass('last-active'); $next.css({opacity: 0.0}) .addClass('active') .animate({opacity: 1.0}, 1000, function() { $active.removeClass('active last-active'); }); } function switchPrev(){ var $active = $('#slideshow IMG.active'); if ( $active.length == 0 ) $active = $('#slideshow IMG:first'); // use this to pull the images in the order they appear in the markup var $next = $active.prev().length ? $active.prev() : $('#slideshow IMG:last'); // uncomment the 3 lines below to pull the images in random order // var $sibs = $active.siblings(); // var rndNum = Math.floor(Math.random() * $sibs.length ); // var $next = $( $sibs[ rndNum ] ); $active.addClass('last-active'); $next.css({opacity: 0.0}) .addClass('active') .animate({opacity: 1.0}, 1000, function() { $active.removeClass('active last-active'); }); } $(function() { //setInterval( "switchNext()", 5000 ); }); $(document).ready(function(){ $('#img_btn_left').click(function(){switchPrev();}); $('#img_btn_right').click(function(){switchNext();}); $('#slideshow img').click(function(event){ var url = $(this).attr("src"); var windowName = "popUp";//$(this).attr("name"); window.open(url); event.preventDefault(); }); $('#i-gallery-header').css('cursor', 'pointer'); $('#i-gallery-header').click(function(){ document.location.href = '/index.php?option=com_content&view=article&id=72&Itemid=306'; }); }); </script> <div id="slideshow"> <img class="active" src="/images/slider/15.png" border="0" alt="" /> <img src="/images/slider/01.png" border="0" alt="" /> ............ </div> Я прикрутил к этому слайдеру плагин FancyBox, следовательно, html код мой изменился до след .вида <div id="slideshow"> <a id="single_image" rel="group" href="images/slider/15.png"><img src="images/slider/15.png" border="0" alt="" title="картинка 2" /> </a> <a id="single_image" rel="group" href="images/slider/01.png"><img src="images/slider/01.png" border="0" alt="" /> </a> .... </div> Картинки в окне открываются, но теперь не работает листалка на слайдере, помогите поправить скрипт, пожалуйста. |
Часовой пояс GMT +3, время: 03:05. |