jQuery 图像/悬停预览导致 IE7 中的行为不稳定

Question

我在使用 jQuery 在 IE 中创建简单的缩放时似乎遇到了一些问题。 Firefox 一切正常，但大多数用户报告 IE 不稳定。

我已经禁用了 IE 中的代码（使用 jQuery.browser.msie），但如果可能的话，希望得到任何人的帮助。

我的jquery源代码如下（忽略upport函数）。

 this.imagePreview = function(){ 
 /* CONFIG */

  xOffset = 10;
  yOffset = 20;

  // these 2 variable determine popup's distance from the cursor
  // you might want to adjust to get the right result

 /* END CONFIG */
 $("a.preview").hover(function(e){
  this.t = this.title;
  this.title = "";
  this.inside = $(this).attr('inside')
  this.outside = $(this).attr('outside')
  var c = (this.t != "") ? "<br/>" + this.t : "";
  $("body").append("<p id='preview'><img width='260' src='"+ this.inside +"' />"+ c +"</p>");         
  $("#preview")
   .css("top",(e.pageY - xOffset) + "px")
   .css("left",(e.pageX + yOffset) + "px")
   .fadeIn("fast");      
    },
 function(){
  this.title = this.t; 
  $("#preview").remove();
    }); 
 $("a.preview").mousemove(function(e){
  $("#preview")
   .css("top",(e.pageY - xOffset) + "px")
   .css("left",(e.pageX + yOffset) + "px");
 });   
};
$(window).load(function(){imagePreview();});

以下是相关网页之一的示例： http://www.engreet .com/CategoryDe​​tail.aspx?cid=17。如果您滚动到源代码，您将看到缩略图具有内部的滚动/悬停预览，使用如下代码：

<a href="/CardDetailFull.aspx?cid=670" outside="http://static.engreet.com/ArtistFiles/51/Happy_Bela_Front_633998103802577482.jpg" inside="http://static.engreet.com/ArtistFiles/51/Happy_Bela_InsideRight_633998103832264982.jpg" title="Inside Preview" class="preview">
 <img src='http://static.engreet.com/ArtistFiles/51/_128X178_Happy_Bela_Front_633998103802577482.jpg' alt="" width="128" />
</a>

任何帮助将不胜感激。很高兴向某人发送一些免费卡片的代码！

谢谢， 亚当

Answer 1

问题最终是透明背景 PNG 图像重复出现。它的尺寸为 1x1，填充了 755x600 的方形画布。通过将其增加到 25x25，所有问题都得到解决。令人疯狂的是，这个问题如何通过影响 jQuery 来表现出来，而最终是 IE 的疯狂渲染导致了这个问题！

希望这对将来的人有帮助。