对为什么我的 JQuery 图像滑块在 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 滑块，我会注意到它在 Firefox 中有效：
http://brenelz.com/blog/build-a-content-slider-with-jquery/
该滑块和我的主要区别在于：
- 我正在使用较旧的 JQuery 库-由于遗留问题等原因，客户端需要。我使用的是 1.3.2。
- 我在 JQuery 的 ul 规则中添加了一个 .gallery_wrap 选择器，这样 JQuery 就不会用母 div 包装页面上的每个列表。
- 因为我知道图像的大小，所以我将 var theWidth 的大小设置为 790px，这解决了这个画廊没有显示在灯箱内的问题（没有静态宽度，大小计算都不适用于设置为显示：无）。
假设 1：由于旧的 JQuery 版本，负边距行为在 Firefox 中没有触发。假设 2：添加静态宽度与 Firefox 对负边距的计算相混淆。
任何更好的假设，有关它无法运行的其他浏览器/其他失败方式的信息，或有关如何修复它的建议将不胜感激。