读书人

js/jquery 能否在图片加载完成之前获得

发布时间: 2012-04-22 18:34:46 作者: rapoo

js/jquery 能否在图片加载完成之前获得修改图片的大小
这是一个等比例缩放图片的js,图片为本地路径问题不明显,图片为网络路径时,狂按ctrl+F5刷新页面会出现整个大图,然后才缩放成小图的现象。该怎么避免。

HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><script language="javascript">$(window).load(function(){    resize($("img"))        function resize($obj,a,b){        $obj.each(function(){            var $this=$(this)            $objx=$this.width()            $objy=$this.height()            if(a){$parentW=a}            else{            $parentW=$this.parent().width()            }            if(b){$parentH=b}else{                $parentH=$this.parent().height()                }                        k=$objy/$objx            k1=$parentH/$parentW        if(k1>k){                    $this.width($parentW)            $this.height(k*$parentW)            margin=($parentH-$this.height())/2            $this.css({"margin-top":margin})            }            else{                $this.height($parentH)                $this.width($parentH/k)                margin=($parentW-$this.width())/2                $this.css({"margin-left":margin})                }                                            })        }                    })</script><style type="text/css">.outside {    border:1px solid #999;    position:absolute;    width:80px;    height:112px;}</style></head><body><div class="outside"><img src="http://www.promo-wholesale.com/Upfiles/Prod_o/Die-Cast-Graduation-Clock_20090661927.jpg" /></div></body></html>


[解决办法]
js的堵塞问题 页面都是要等js 加载完毕才会显现 , 为了解决堵塞问题 在window.onload里 加载 或者放在最后

读书人网 >JavaScript

热点推荐