我有一個關於交換滑塊的問題。我從codepen創建了這個DEMO。jquery swap slider not working width鏈接
演示大圖片左側部分的問題鏈接不會自動更改。所以,如果我改變:
這
<li class="active"><a href=""><img src="sss.jpg" alt="" /></a></li>
<li><a href=""><img src="fff.jpg" alt="" /></a></li>
這樣:
<li class="active"><img src="abc.jpg" alt="" /></li>
<li><img src="ddd.jpg" alt="" /></li>
然後圖像自動改變。我需要做的改變鏈接與圖片?
我使用這個jQuery功能:
var autoScrollerTimer = null;
var autoScrollerTimerTwo = null;
function autoChangeImage() {
autoScrollerTimer = setTimeout(function(){
$("#magazin_sldwr li.active")
.removeClass('active')
.nextThumb()
.addClass('active')
.children('img')
.trigger('mouseenter');
autoChangeImage();
}, 2000);
}
function autoChangeImageTwo() {
autoScrollerTimerTwo = setTimeout(function(){
$("#magazin_sldwr2 li.active")
.removeClass('active')
.nextThumb()
.addClass('active')
.children('img')
.trigger('mouseenter');
autoChangeImageTwo();
}, 3000);
}
$(document).ready(function() {
var c;
$("#magazin_sldwr li img").hover(function(){
c = $(this).attr('alt');
clearTimeout(autoScrollerTimer);
$(".title").remove(); $(this).parent('li').addClass('active').siblings().removeClass('active');
$('#mainm-img').attr('src',$(this).attr('src').replace('thumb/', '')).parent().attr('href',$(this).parent().attr('href'),$("#mainm-img").parent().append('<div class="title">' + c + '</div>'));
}, function(){
autoChangeImage();
});
var imgSwap = [];
$("#magazin_sldwr li img").each(function(){
imgUrl = this.src.replace('thumb/', '');
imgSwap.push(imgUrl);
});
autoChangeImage();
$("#magazin_sldwr2 li img").hover(function(){
clearTimeout(autoScrollerTimerTwo);
$(this).parent('li').addClass('active').siblings().removeClass('active');
$('#mainm-img2').attr('src',$(this).attr('src').replace('thumb/', ''));
}, function(){
autoChangeImageTwo();
});
var imgSwap = [];
$("#magazin_sldwr2 li img").each(function(){
imgUrl = this.src.replace('thumb/', '');
imgSwap.push(imgUrl);
});
autoChangeImageTwo();
});
$.fn.nextThumb = function(){
var next = $(this).next('li');
if (next.length) {
return next;
} else {
return $(this).parent().find('li:first');
}
};
$.fn.preload = function() {
this.each(function(){
$('<img/>')[0].src = this;
});
};
@MasreD我仍然斯特雷這一點,但不工作 – innovation 2014-10-20 14:45:23