1

我编写了一个运行良好的 jquery 插件，但我遇到了一些跨浏览器问题，特别是在尝试获取图像元素的高度和宽度时。

以下代码没有在 Chrome 中提取正确的 imgHeight，它返回 0。 

 (function($){
        $.fn.sideLoad = function(data){
            //some variables we will need
            var imgHeight = $(this).children('img').height();
            var imgWidth = $(this).children('img').width();
            var loaderHeight = (imgHeight/2)-16 ;
            var loaderWidth = (imgWidth/2)-16;
            var $target = $(this);

            //do some other processing    
        };//end function    
    })(jQuery);

所以，我知道最有可能发生的事情是我需要等待 DOM 准备好提取正确的高度和宽度数字。因此，如果我将代码更改为下面的代码，它将起作用：

$(document).ready(function(){
    $.fn.sideLoad = function(data){
            //some variables we will need
            var imgHeight = $(this).children('img').height();
            var imgWidth = $(this).children('img').width();
            var loaderHeight = (imgHeight/2)-16 ;
            var loaderWidth = (imgWidth/2)-16;
            var $target = $(this);

            //do some other processing    
        };//end function    
 });

但是，我从未见过将文档作为其一部分编写的插件，我只是认为这不是最好的方法。有人可以在这里解释我的两个代码片段之间的区别以及实现我的目标的最佳方法是什么？基本上我需要适当的图像尺寸，以便在触发事件时加载器图形正确居中。

4

0 回答 0