Добрый день! У меня есть галерея с функцией слайдшоу через заданный интервал времени и перелистывание картинок по клику на превьюшку. Там вроде используется jquery
вставляется прямо в head.
<script type="text/javascript">
var theInt = null;
var $crosslink, $navthumb;
var curclicked = 0;
theInterval = function(cur){
clearInterval(theInt);
if( typeof cur != 'undefined' )
curclicked = cur;
$crosslink.removeClass("active-thumb");
$navthumb.eq(curclicked).parent().addClass("active-thumb");
$(".stripNav ul li a").eq(curclicked).trigger('click');
theInt = setInterval(function(){
$crosslink.removeClass("active-thumb");
$navthumb.eq(curclicked).parent().addClass("active-thumb");
$(".stripNav ul li a").eq(curclicked).trigger('click');
curclicked++;
if( 6 == curclicked )
curclicked = 0;
}, 9000);
};
$(function(){
$("#main-photo-slider").codaSlider();
$navthumb = $(".nav-thumb");
$crosslink = $(".cross-link");
$navthumb
.click(function() {
var $this = $(this);
theInterval($this.parent().attr('href').slice(1) - 1);
return false;
});
theInterval();
});
</script>
проблема в том, что если на странице не одна, а 2 галереи, то скрипт перестает работать.
Как сделать, чтобы он работал при любом количестве галерей на странице.
подозреваю, что функцию надо упрятать во внешний js файл и вызывать по к-л событию, но не знаю как это технически реализовать
вот как это примерно выглядит: