Как получить фактическую ширину и высоту изображения после загрузки в плагине colorbox?

Я открываю представление MVC в colorbox. Это представление загружает изображение, к которому я разрешаю пользователю добавлять аннотации. Прежде чем мой плагин аннотаций заработает и отобразит холст, мне нужно знать ширину и высоту загруженного изображения. Это устанавливает размер холста.

Я могу получить ширину и высоту изображения в FF, Chrome, Opera. Но в IE8 я всегда получаю ширину и высоту изображения равными 0.

Есть ли кто-нибудь, кто может помочь мне получить размер изображения после загрузки изображения?

Вот как я вызываю colorbox, чтобы открыть представление MVC:

<a href="site/photos/album/1234" class="notes colorbox"></a>

Это вид:

<div id="dvImg">
    <img id="imgAnnotate" src="path/abc.jpg" />
</div>

$(function () {
    $("#imgAnnotate").load(function () {
        Width = this.width;
        Height = this.height;
        alert('W=' + Width + ' H=' + Height); <-- IE shows as W=0 H=0
    });
});

Я также попробовал плагин imagesLoaded, но не работает с colorbox:

$(function () {
    var $dvImg = $('#dvImg');
    function loopImages($images) {
        $images.each(function () {
            alert('h6=' + $(this).height() + ' w6=' + $(this).width()); //FF says 0
            alert('h7=' + this.height + ' w7=' + this.width); //FF OK!!! not IE
        });
    }

    $dvImg.imagesLoaded(function ($images) {
        loopImages($images);
    });
});

Еще момент: $(window).load() в обзоре вообще не стреляет. Может быть потому, что он загружен в colorbox?

Во всяком случае, это кажется очень очень трудно сделать!!


person kheya    schedule 09.01.2012    source источник
comment
Ваш код, кажется, отлично работает для меня в IE. Проверьте эту скрипту (в IE): jsfiddle.net/gERZe   -  person techfoobar    schedule 09.01.2012
comment
Код должен работать с jquery-плагином COLORBOX.   -  person kheya    schedule 09.01.2012
comment
techfoobar: можете ли вы попробовать это с плагином colorbox и посмотреть, будет ли ваш код вести себя так же? Просто загрузите то же изображение во всплывающем окне colorbox. Большое спасибо.   -  person kheya    schedule 09.01.2012
comment
Конечно. я попробую это с colorbox и вернусь к вам.   -  person techfoobar    schedule 09.01.2012


Ответы (1)


попробуй это

var Width = $(this).css("width");
var Height = $(this).css("height");
person pwittke    schedule 13.01.2012
comment
Чем это отличается от $(this).width() и $(this).height()? - person kheya; 14.01.2012
comment
он читает фактический css, может быть, он так работает? это просто предложение, которое вы могли бы попробовать :) оба делают то же самое по-разному... должен быть тот же результат... Я бы попробовал оба, может быть, это решит вашу проблему... с уважением - person pwittke; 16.01.2012