jquery - 为什么这个 Jquery 内容 slider 在 Chrome 和 Safari 中有效，但在 Firefox 中无效？

Question

对为什么我的 JQuery 图像 slider 在 Firefox 中不起作用感到困惑。在 Safari 和 Chrome 中工作正常，尚未在 IE 中测试。这是基本的点击按钮和下一张图片幻灯片，请在此处查看实际操作:

http://www.alihaberfield.com/test/carouseltest/carouseltest.html

这是 JQuery:

$(window).load(function() {


var theImage = $('.gallery_wrap ul li img');
var theWidth = 790;  
//wrap into mother div
$('.gallery_wrap ul').wrap('<div id="mother" />');                  
//assign height width and overflow hidden to mother
$('#mother').css({
    width: 790,
    height: 780,
    position: 'relative',
    overflow: 'hidden'      
});
    //get total of image sizes and set as width for ul 
var totalWidth = theImage.length * theWidth;
$('.gallery_wrap ul').css({
    width: function(){
    return totalWidth;  
}               
});     
$(theImage).each(       
    function(intIndex){             
            $(this).nextAll('a')
            .bind("click", function(){
                if($(this).is(".next")) {

                    $(this).parent('li').parent('ul').animate({
                        "margin-left": (-(intIndex + 1) * theWidth)             
                    }, 1000)                    

                } else if($(this).is(".previous")){

                    $(this).parent('li').parent('ul').animate({
                        "margin-left": (-(intIndex - 1) * theWidth)             
                    }, 1000)    


                } else if($(this).is(".startover")){

                    $(this).parent('li').parent('ul').animate({
                        "margin-left": (0)              
                    }, 1000)

                }
            });//close .bind()                                   
});//close .each()                      
});//doc ready

它基于这个简单的 jquery slider ，我会注意到它在 Firefox 中有效:

http://brenelz.com/blog/build-a-content-slider-with-jquery/

那个 slider 和我的 slider 之间的主要区别在于:

1. 我使用的是较旧的 JQuery 库 - 由于遗留问题等原因，客户需要它。我使用的是 1.3.2。
2. 我在 JQuery 的 ul 规则中添加了一个 .gallery_wrap 选择器，这样 JQuery 就不会用母 div 包装页面上的每个列表。
3. 因为我知道图像的大小，所以我将 var theWidth 的大小设置为 790px 静态，这解决了这个画廊不显示在灯箱内部的问题(没有静态宽度，所有大小计算都不起作用设置为显示的内容:无)。

假设 1:由于旧的 JQuery 版本，负边距行为不会在 Firefox 中触发。假设 2:添加静态宽度扰乱了 Firefox 对负边距的计算。

如果有任何更好的假设、有关它无法在其他浏览器上工作/它失败的其他方式的信息，或有关如何修复它的建议，我们将不胜感激。

Answer 1

正确答案:脚本无法与旧版本的 JQuery 一起正常工作。

在使用 Jquery 1.3 的 Firefox(或 IE，碰巧)中无法工作。在使用 JQuery 1.4 及更高版本的所有浏览器中完美运行。

通过加载两个库并使用本页优秀答案中提供的 JQuery noconflict 结构解决了问题:

jQuery No Conflict Still Conflicts with Other Version of jQuery