img.width и img.height внутри $ (img) .load () и / или img.onload = ... возвращают рубиновые значения в IE8 - PullRequest
Новая
       18

img.width и img.height внутри $ (img) .load () и / или img.onload = ... возвращают рубиновые значения в IE8

2 голосов
/ 26 августа 2011

Я знаю, что эта тема много обсуждалась, но я не мог найти какие-либо решения, которые бы работали для меня.Итак, мой код примерно такой: 

 var img =me.images[curID]
 var f = function() {
      var i = $(img);
      img.onload = null;
      $(img).unbind('load');
      var iH = img.height; /*works for Firefox, Safari, Opera, Chrome*/
      var iW = img.width;
      if (jQuery.browser.msie) {
          /*nothing works*/
          iH = i.width(); /* returns 0*/
          iH = i.attr('height'); /*returns undefined*/
          iH = img.height; /*returns wrong 120:30 px instead of 1000:410 */
          /*once page is reloaded - everything is fine */
      }
 }

 src = img.src;
 if ( (!img.complete) ||  
       (typeof img.naturalWidth != 'undefined' && img.naturalWidth == 0)
     ) {  /*WAIT FOR LOAD*/
        img.src = "";
        $(img).load(f);
        img.onload = f;
        img.src = src;  
 } else { /*SHOW */
        f.apply(img);
 }

Что я делаю не так?

p / s / изображение внутри div, которое блекло, поэтому я в основном хочу изменить размер изображения доfadeIn.

EDIT1: некоторая информация о моих массивах: 

....
this.slides = this.slidesContainer.children();
this.n = this.slides.length;
for (var i=0;i<this.n;i++) {
    var im = this.slides.eq(i).find('img:first')[0];    
    var sr = im.src;
    this.images[i]    = im;
    this.imagesSrc[i] = sr; 
}
...

EDIT2: я немного переписал код (добавлен onload), так что теперь он запускается везде (IE / FF /Opera / Safari / ...) И поток программы (IE8) выглядит следующим образом:

  1. ожидание загрузки
  2. срабатывание загрузки (если я это прокомментирую - jQuery ().нагрузка запущена).
  3. внутри f (): img.width = 120, img.height = 30 (кажется, он не загружен. правильная ширина / высота 1000x410)

Трудно сказать, что это вызывает, потому что это происходит не всегда, даже не всегда, когда изображения не обналичиваются.Но время от времени я вижу эти странные ширину / высоту.

EDIT3: есть какое-то решение о том, как загрузить изображение ( здесь и здесь ),в одном .onload используется, в другом - .load, я использую оба, так что должно быть хорошо, хотя код может быть неоптимальным и очень аккуратным.

1 Ответ

0 голосов
/ 26 августа 2011

Если вы используете jQuery, попробуйте использовать способ jQuery для получения изображения.

Вместо var img =me.images[curID] Просто сделайте: 

var img = $('img#imageID');

//get height:  
img.height()
//get width:
img.width();
...