然后图像在chrome中消失

Question

在我的网站中，我使用jQuery更改包含图像的div：

 <div class='bar1' >
    <div class='blocks'> <a href='#' >Home</a></div>
    <div class='blocks'> <a href='#'>About</a></div>
    <div class='blocks'><a href='#'>Zones</a></div>
    <div class='blocks'><a href='#'>Players</a></div>
 </div>
<div class='block-top-container'>
   <div class='scroll-block'>
      <img src='ban1/1.jpg' alt ='' />
   </div>
   <div class='scroll-block'>
     <img src='ban1/2.jpg' alt ='' />
   </div>
   <div class='scroll-block'>
      <img src='ban1/10.jpg' alt ='' />
    </div>
</div>

jQuery代码向左移动链接点击的图像

$(window).load(function() {

    $(".bar1  a").click(function(e){

    var $this = $(this);
    var index = $this.parent().index();
    var left = (index * $(" .scroll-block ").width());

    $(" .block-top-container ").animate({ marginLeft: -(left) }, 500);


    });

 });

Chrome（版本23）中发生错误。图像加载但页面加载完成后图像消失，我们看到图像图标已损坏。

当网页加载图片时，我检查了Chrome开发者工具中的“网络”标签，但在页面加载完成后图像消失，在网络标签中显示“图像获取失败”错误。