jQuery Image / Hover Preview, вызывающий изменчивое поведение в IE7 - PullRequest
Новая
       27

jQuery Image / Hover Preview, вызывающий изменчивое поведение в IE7

1 голос
/ 02 февраля 2010

Кажется, у меня возникли некоторые проблемы с использованием jQuery для создания простого масштабирования в IE.В Firefox все хорошо, но большинство пользователей сообщают, что IE нестабилен.

Я отключил код в IE (используя jQuery.browser.msie), но буду рад любой помощи, если это возможно.

Мой исходный код jquery находится ниже (игнорируйте функцию поддержки).

 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/CategoryDetail.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>

Любая помощь будет очень признательна.Рад отправить кому-нибудь код для нескольких бесплатных карточек!

Спасибо, Адам

1 Ответ

1 голос
/ 12 февраля 2010

Проблема закончилась тем, что повторялось изображение PNG с прозрачным фоном. Это было 1x1 и заполнение 755x600 квадратных холстов. При увеличении этого значения до 25x25 все проблемы были решены. Было сумасшествием то, как эта проблема проявлялась, воздействуя на jQuery, когда в конечном итоге именно сумасшедший рендеринг IE вызывал проблему все время!

Надеюсь, это поможет кому-то в будущем.

...