Question

$('.photoRow a[id^=clickPhoto]').click(function()
    {
        $('#layerBg').show();
        $(this).show();
        var id = parseInt($(this).attr('id').substr(10));

        var img = new Image();
        img.src = '/p/' + id + '.jpg';

        $('.photoWindow').fadeIn().html(img);        
        var pWidth = $(window).width();
        var pTop = $(window).scrollTop();
        var eWidth = $('.photoWindow').width();
        alert(eWidth);
        $('.photoWindow').css('top', pTop + 10 + 'px');
        $('.photoWindow').css('left', parseInt((pWidth / 2) - (eWidth / 2)) + 'px');
        $('.photoWindow').show();
    });

eWidth = 600（css中的默认值）; 我需要在图像（img）加载到类中后才考虑eWidth .photoWindow

如果我在缓存中的picrute表示eWidth是正确的。

如果我的图片宽度为912，则值eWidth应为912，但不是600 ..

我希望你理解我..抱歉英语不好！

Answer 1

如果我理解了您的问题，您只想在加载图像后评估eWidth。首先加载图像的位置以及使用类photoWindow的元素是什么？

假设它在img元素上。如果是这样你就可以使用：

$('.photoWindow').load(function() {
        eWidth = $('.photoWindow').width();
        $('.photoWindow').css('top', pTop + 10 + 'px');
        $('.photoWindow').css('left', parseInt((pWidth / 2) - (eWidth / 2)) + 'px');
        $('.photoWindow').show();
});

因此，无论何时加载<img>元素，您都可以计算并将图像放在任何位置。

Answer 2

从您的代码中，您看起来好像是在尝试从photoWindow元素的宽度拉出eWidth。为什么不从图像中抓取它呢？

eWidth = $('.photoWindow img').width();

我可能也会遗漏一些东西，但我不清楚为什么你要在photoWindow上执行fadeIn（）和show（） - fadeIn（）会在完成触发后显示该元素。

你也可以像这样重构在photoWindow上运行的最后一段代码：

$('.photoWindow').css({
  top: pTop + 10 + 'px',
  left: parseInt((pWidth / 2) - (eWidth / 2)) + 'px')
});

jQuery图片加载

2 个答案: