2

我正在尝试使用带有 jquery 的 javascript 在 div 中创建一个无限滚动的图像。我正在使用的代码可以在小提琴HERE中看到。

这在当前浏览器中有效，但在 IE7 中失败。我的猜测是它与分配负 css 值有关，但我还没有找到解决方案。有谁知道如何在 ie7 的 chrome 中看到行为？

谢谢你的帮助。

编辑：如果我垂直向下滚动图像，我已经获得了跨浏览器的效果。可以在这里看到。

编辑2：我让它水平工作，但只向右移动。它似乎不喜欢负方向值。可以在这里看到。

4

4 回答 4

2

我认为 IE7 只支持“左”属性的整数值！

将您的功能更改为：

$(function(){
reelDivs($('.reel div'), 'left', 500, -500, -1, 30);
});
于 2012-08-06T14:36:09.860 回答
0

将您的 CSS 更改为此并试一试：

.reel
{
    position: relative;
    top: 50px;
    left: 50px;
    width: 250px;
    height: 500px;
    overflow: hidden;
}

.reel div
{
    position: absolute;
    left: 0px;
    height: 362px;
    width: 500px;
    background: url("http://www.deviantart.com/download/258376230/husky_puppy_by_blackdelive-d49twdi.png") no-repeat 0px top;
}

.reel div.b
{
    left: 500px;
}

jsFiddle：http: //jsfiddle.net/eGnMX/

神速！

于 2012-08-06T14:37:05.757 回答
0

在卷轴 div 上放置一个 ID，而不是$('.reel div')使用该 ID。我很确定 IE7 不支持getElementsByClassName.

当您使用时，$('.reel div')您是在告诉 jQuery 使用 getElementsByClassName。

于 2012-08-06T14:38:19.033 回答
0

考虑到像素是您的显示器可以渲染的最小尺寸，您如何将图像移动 0.1 像素？

据我所知，IE7 将不支持浮点测量（或至少不支持像素，尚未测试其他单元）。控制台记录返回的 CSS 左侧位置，您将看到 IE7 不返回浮点数。

使用 1 像素移动并降低重绘率以使其在 IE7 中工作。或者甚至更好地使用像素移动与速率来获得所需的结果。像素移动越高越好。

在访问者机器上重绘图像可能会很昂贵。即使您专门为游戏社区（通常拥有快速、高端系统）创建东西，我也不建议将其作为绝对要求。仅您的图像滚动条就可能严重落后于某些系统。

也不要忘记大多数显示器的刷新率不会低于 5 毫秒。所以期待它比这更快地重新绘制是没有意义的

于 2012-08-06T14:45:04.833 回答