在firefox中使用jquery更改img src

时间:2012-08-22 20:59:36

标签: javascript jquery html firefox

我创建了一个简单的图片库,我在中间有一张大图片,下面是缩略图:

<img class="primary-image" src="example.jpeg">
<div class="thumbnails"> 
    <img class="thumbnail" src="red.jpeg">
    <img class="thumbnail" src="blue.jpeg">
    <img class="thumbnail" src="green.jpeg">
</div>

我在缩略图上有以下点击处理程序:

$('.thumbnail').click(function() {
    var src = $(this).attr('src');
    $('.primary-image').attr('src', src);
});

这在chrome中运行良好,但在Firefox中,图像从上到下缓慢加载,给出了一个丑陋的“过渡”,并不意味着存在。

发生了什么事?

更新

我现在注意到发生的事情是浏览器不显示新图像。而且它只发生在特定的图片上:

  • 如果我快速向下滚动,图片会发生变化。 (点击缩略图后)
  • 如果整个图片画布可见,而我什么都不做,则前一张图片仍然存在,并且不会显示新图片。 (点击缩略图后)
  • 如果我切换应用程序并回到firefox,新的图片就在那里。 (点击缩略图后)
  • 如果我双击缩略图,图片会完美变化。

1 个答案:

答案 0 :(得分:1)

您是否尝试预装图片?也许图像在Chrome中缓存,但在FireFox中没有。

StackOverflow上有人发布了一些代码来轻松预装图像。请查看Preloading images with jQuery