Это поведение, уникальное для хрома, странное или правильный результат? - PullRequest
0 голосов
/ 14 февраля 2011

Найдены странности, связанные с jquery и хромом. Кажется, attr ('width') для элемента img возвращает 0, если для отображения окружающего div установлено значение "none". Это прекрасно работает в Firefox и Opera, хотя.

Итак, это ошибка или chrome утверждает правильное поведение jquery?

Вот пример:

<html>
<head>
<script type="text/javascript" src="../jquery-1.4.min.js"></script>
<script type="text/javascript" src="return.js"></script>
</head>

<body>

<div class="foot">
  <img src="images/ref.png" width="500px" height="500px"  />
  <img src="images/ref1.png" width="300px" height="300px"  />
</div>

</body>
</html>

$(document).ready(function(){

$('div.foot').css('display','none');

var imageWidth = $('div.foot img').eq(0).attr('width');

alert(imageWidth); // returns 0 in chrome.

});

Ответы [ 2 ]

2 голосов
/ 14 февраля 2011

Я думаю, что это может быть ошибка Chrome.

Сначала я запустил ваш код, как указано выше.Он отображал «0», как вы описали.

Затем я поэкспериментировал с приведенным выше кодом и смог отобразить ширину (500) в консоли разработчика со следующим кодом:

$('div.foot img').eq(0).attr('width');

Итак, я переписал исходный код, который вам нужно, к чему-то немного меньшему.Это выглядело как «500», как и ожидалось:

$(document).ready(function(){
    $('div.foot').css('display','none');
    alert($('div.foot img').eq(0).attr('width'));
});

После этого я смог запустить ваш исходный код и выдать ему предупреждение «500».

$(document).ready(function(){
    $('div.foot').css('display','none');
    var imageWidth = $('div.foot img').eq(0).attr('width');
    alert(imageWidth); // returns 0 in chrome.
});

Краткий ответ: I 'Я уверен, что это ошибка из-за ее нестабильного поведения.

Примечание: Я пробовал это с помощью jQuery 1.4.4.

1 голос
/ 14 февраля 2011

Изображения отображаются как inline и не дают ширину / высоту, когда родитель скрыт (в Chrome).

Установите изображения на display:block;, и Chrome определит вашу ширину / высоту.Проверьте это: http://jsfiddle.net/c4jdv/

...