惆个小怅 2015-05-30 13:53 采纳率: 0%
浏览 1987

两个轮播的js相互干扰,请高手帮忙,谢谢!

 var i = 0;
jummper();
function jummper() {
    $(".car ul li").eq(i).find("img").css("left", "-100%");
    $(".car ul li").eq(i).find("p").css("width", "0%");
    $(".car ul li").eq(i).find("img").animate({
        left: "0"
    },
    500, 
    function() {
        $(".car ul li").eq(i).find("p").animate({
            width: "1260px"
        },
        5000, 
        function() {
            $(".car ul li").eq(i).find("img").animate({
                left: "100%"
            },
            500, 
            function() {
                i++;
                if (i > 2) i = 0;
                $(".car ul li").eq(i).fadeIn(500).siblings().fadeOut(500)
            })
        })
    })
}
setInterval("jummper()", 6500);
/*--------------------------------------------------------------------------*/
$(".picimglink").css("text-decoration", "none");
$(".picimglink").bind({
    mouseenter: function() {
        $(this).children("span").animate({
            bottom: "0px"
        },
        500)
    },
    mouseleave: function() {
        $(this).children("span").clearQueue().animate({
            bottom: "-30px"
        },
        500)
    }
});
var biZhiDelayLoadImg = $("#bigUl img");
var biZhiDelayLoadImgLength = biZhiDelayLoadImg.length;
for (var i = 3; i < biZhiDelayLoadImgLength; i++) {
    var curDelayImg = biZhiDelayLoadImg.eq(i);
    if (curDelayImg.attr("srch")) {
        curDelayImg.attr("src", curDelayImg.attr("srch"));
        curDelayImg.removeAttr("srch")
    }
}
var _focus_num = $("#smallUl > li").length;
var _focus_direction = true;
var _focus_pos = 0;
var _focus_max_length = _focus_num * 720;
var _focus_li_length = 720;
var _focus_dsq = null;
var _focus_lock = true;
function autoExecAnimate() {
    $("#mypic" + _focus_pos).addClass("info-cur").siblings("li.info-cur").removeClass("info-cur");
    var moveLen = _focus_pos * _focus_li_length;
    $("#bigUl").animate({
        left: "-" + moveLen + "px"
    },
    600);
    if (_focus_pos == (_focus_num - 1)) {
        _focus_direction = false
    }
    if (_focus_pos == 0) {
        _focus_direction = true
    }
    if (_focus_direction) {
        _focus_pos++
    } else {
        _focus_pos--
    }
}
_focus_dsq = setInterval("autoExecAnimate()", 6000);
$("#smallUl > li").hover(function() {
    _focus_pos = parseInt($(this).attr("sid"));
    if (_focus_lock) {
        clearInterval(_focus_dsq);
        _focus_lock = false
    }
    $("#mypic" + _focus_pos).addClass("info-cur").siblings("li.info-cur").removeClass("info-cur");
    var moveLen = _focus_pos * _focus_li_length;
    $("#bigUl").stop(true, true).animate({
        left: "-" + moveLen + "px"
    },
    600)
},
function() {
    if (_focus_lock == false) {
        _focus_dsq = setInterval("autoExecAnimate()", 6000);
        _focus_lock = true
    }
});
$("#bigUl").hover(function() {
    if (_focus_lock) {
        clearInterval(_focus_dsq);
        _focus_lock = false
    }
},
function() {
    if (_focus_lock == false) {
        _focus_dsq = setInterval("autoExecAnimate()", 6000);
        _focus_lock = true
    }
});
$(".pic-list2 li").hover(function() {
    $(this).addClass("hover").siblings().removeClass("hover")
},
function() {
    $(this).removeClass("hover")
});
  • 写回答

2条回答

  • danielinbiti 2015-05-30 14:57
    关注
     一个页面内两个轮播的话,那下面这些写法都是会冲突的
     $(".car ul li")
    $(".picimglink")
    $("#bigUl img")
    重代码看,要实现一个页面两个不冲突,要不把上面类似的这些都改了,两个改成不一样,要不就是重新封装成完善的组件。
    如果都懒的弄,找个轮播组件
    http://www.cnblogs.com/lhb25/archive/2013/01/06/jquery-image-carousel-effect.html
    
    评论

报告相同问题?

悬赏问题

  • ¥30 这是哪个作者做的宝宝起名网站
  • ¥60 版本过低apk如何修改可以兼容新的安卓系统
  • ¥25 由IPR导致的DRIVER_POWER_STATE_FAILURE蓝屏
  • ¥50 有数据,怎么建立模型求影响全要素生产率的因素
  • ¥50 有数据,怎么用matlab求全要素生产率
  • ¥15 TI的insta-spin例程
  • ¥15 完成下列问题完成下列问题
  • ¥15 C#算法问题, 不知道怎么处理这个数据的转换
  • ¥15 YoloV5 第三方库的版本对照问题
  • ¥15 请完成下列相关问题!