使用 jQuery 更改背景卡住或无法更新 img 的 src 属性

Question

我现在花了几个小时试图弄清楚这个。

我有一个循环显示属性的商店展示，并且我已经敲定了一个简单的画廊类型的脚本。在过去的一周里，它运行良好。

我今天去修补一些不相关的 JavaScript（但在同一页面上），现在出现了问题。

为了使图像相互淡出，我更新了img 的src，然后在img 元素的包含元素背景的下一张图像上淡出。

现在似乎发生的事情是 #main-image 的背景偶尔会卡在以前的图像上，尽管我使用 jQuery 的 css() 方法设置它。

可以在这里查看

http://vanquish.websitewelcome.com/~utopia66/store-display

我必须强调这发生在 Google Chrome 中，我只针对那个浏览器。

为了您的方便，我还加快了浏览图片的速度以节省您的时间。

那么，为什么图像卡住了，我该如何解决？ update 仔细检查可能是img 元素卡住了，即它无法更新src 属性。 再次更新其实我很确定这是背景。

JavaScript 来了

http://vanquish.websitewelcome.com/~utopia66/assets/js/display.js

非常感谢任何帮助！

非常感谢。

Answer 1

我非常确定我通过用这样的双引号将backgroundImage 值括起来解决了这个问题。

$('#something').css({ backgroundImage: 'url("' + pathToImage + '")' });

一些较新的图像在其文件名中带有括号。

其中一个更令人沮丧的！

如果有人帮我调查过，谢谢 :)

Answer 2

我发现图像和淡入/淡出是在图像加载后执行。这将修复刷新后首次加载图像时的闪烁类型效果：

$('#something').attr('src', 'pathToImage').load(function(){$(#something).fadeOut('slow')});