我有一个运行 malsup 的很棒的 jQuery 循环的页面。我使用的是最新版本 (2.99) 和 Safari 5.0.5。之前没遇到过下面的问题,感觉有点奇怪。
问题
有时当页面加载时,.slides
元素只有 654 像素宽。我在 css 文件中将其设置为 960px。但是当我使用 JavaScript 来获取.slides
元素的宽度时,它说它是 1271px 宽。嗯?这个问题偶尔也会发生在 Firefox (3.6.16) 上,但没有 Safari 那么多。奇怪的是,我似乎无法在 IE8 中复制此错误。
我的代码都是 W3C 有效的(除了对边界半径的 3 次调用)。也许使用表单元素作为循环容器有限制?是 Safari 行为不端吗?
JS:
$(document).ready(function(){
var sw = $('.slides').width();
$('.slides').cycle({
fx: 'scrollHorz',
nowrap: 0,
fit: 1,
timeout: 0,
next: '.next',
prev: '.prev',
speed: 250
});
if (sw != 960){
$('.slides').css('width','960px');//to set the width to 960, so it doesn't clip the form
$('.slides').css('background-color','#ff00ff');//so i know when the problem is occuring
}
});
CSS:
#content{
float:left;
width:100%;
}
.wrapme{
width:960px;
height:auto;
margin:0 auto;
}
.slides{
float:left;
width:960px;
height:auto;
overflow:auto;
}
您可以(希望)在此处查看实际的“错误” 。我很想知道其他人是否没有发生这种情况(可能必须按 F5 几次)。
我很想修复这个烦人的小错误。在循环后设置容器宽度的解决方法已经调整了它(毫无疑问是错误的宽度)只解决了一半的问题。移至下一张幻灯片后,宽度将减半。下一张幻灯片,它再次减半。所以在幻灯片 3 之后,它将所有内容压缩到 240 像素宽。
我想解决这个问题的方法是强迫每个人都使用 Firefox/IE(它将驻留在公司内部网上)。
感谢您提前提供任何帮助和见解!
担