如果我单击右箭头,我的横幅会旋转正常,但当我点击左箭头时,我会遇到一些问题。在我的萤火虫中,活动变为非活动状态,并保持这种状态。
我的js
$(".nav_arrows").click(function(){
$direction = ($(this).hasClass("left-arrow") ? "left" : "right");
var activeBanner = 100;
if($direction == "right"){
$(".inactive-banner-copy").css("left","100%").show();
activeBanner = -100;
if($(".active-banner-copy").next().length < 1){
$(".banner-copy-wrapper").eq(0).animate({"left":0+"%","opacity":1}, 500,function(){
$(this).addClass("active-banner-copy").removeClass("inactive-banner-copy");
});
}else{
$(".active-banner-copy").next().animate({"left":0+"%","opacity":1}, 500,function(){
$(this).addClass("active-banner-copy").removeClass("inactive-banner-copy");
});
}
}else{ //left
$(".inactive-banner-copy").css("left","-100%").show().fadeTo(250, 0);
if($(".active-banner-copy").prev().length < 1){
$(".banner-copy-wrapper").eq($(".banner-copy-wrapper").length-1).animate({"left":0+"%","opacity":1}, 500,function(){
$(this).addClass("active-banner-copy").removeClass("inactive-banner-copy");
});
}else{
$(".active-banner-copy").prev().animate({"left":0+"%","opacity":1}, 500,function(){
$(this).addClass("inactive-banner-copy").removeClass("active-banner-copy");
});
}
}
$(".active-banner-copy").animate({"left":activeBanner+"%","opacity":0}, 500,function(){
$(this).addClass("inactive-banner-copy").removeClass("active-banner-copy");
});
});
我的jsfiddle:JSFIDDLE