横幅无法正常工作

时间:2014-11-03 11:55:08

标签: jquery banner

如果我单击右箭头,我的横幅会旋转正常,但当我点击左箭头时,我会遇到一些问题。在我的萤火虫中,活动变为非活动状态,并保持这种状态。

我的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

0 个答案:

没有答案
相关问题