0

所以我已经为带有 .fadeIn() 回调的图像设置了这个 .load 设置，效果很好。问题是，如果我在同一张图像上连续两次触发 .load，它不会到达回调！

这是代码片段：

$('#thumbs a').click( function() {
  imageSrc = $(this).attr('href').substring(1)+'.jpg';   // grab src, remove hash, add jpeg extension
  $('#viewer img').fadeOut('fast', function() {     // fade old image out fast, wait until finished before changing src
   $('#viewer img').attr('src', (mediumPath+imageSrc));  // change src to new image
   $('#viewer a').attr('href', imageSrc);
  });
  $('#viewer img').load(function(){        // once image is loaded, fade the img back in
         $('#viewer img').fadeIn('slow');
        });
  return false;
 });

您可以在我的网站（正在进行中）上试用。只需连续两次单击左侧的缩略图，loader.gif 就不会消失，即不会进入 .fadeIn()。

注意：我相信这只会影响 WebKit 浏览器（？）

4

1 回答 1

0

我已经在 Chrome 中测试了您的网站http://www.benjibee.com/（据我所知，基于 Webkit 的浏览器），并且无法复制该问题。虽然它确实比 Firefox 需要更长的时间（但这可能只是我的电脑）。

一些建议/意见。

通过基于您.click()的交互，使用以下格式：

.click( function( e ) {
  e.preventDefault();
  // Rest of your Javascript Code here...
} );

将停止执行锚/链接，并且可以在 jQuery 处理开始时调用，而不是等待结束使用return false.

您可能还希望将当前图像/链接的详细信息存储在 javascript 变量中，然后在随后单击缩略图时对其进行检查 - 如果img1.jpg显示，并且单击该图像的缩略图，则当前较大的图像淡出，然后再次淡入，没有任何变化。只是一件小事。

于 2010-07-26T07:47:35.210 回答