字体:  

[页面加载事件控制]图片大小

李志东 发表于: 2007-9-03 10:32 来源: 我爱洪江

CODE:

<script type="text/javascript">
//<![CDATA[
window.onload=function(){
    fResizeImg(500, 500, 'TopicContent');
    //fResizeImg(500, 500);
}
    /*------------------------------------------------------*\
     * Subject: 使用 javascript 函数 完美控制页面图片显示大小
     * 使用:
     * --------------------------------------
     * 1. Javascript 脚本块
     *    window.onload=function(){
     *        fResizeImg(500, 500, 'img');
     *        //fResizeImg(500, 500);
     *    }
     *
     * 2. html body 标签
     * <body onload="fResizeImg(500, 500, 'textMain');" >
     * --------------------------------------
     * 注: 必须在页面加载完毕后使用本函数(这是基本的客户端应用概念)
    \*-------------------------------------------------------*/
    //---------------------------------begin function fResizeImg();
    function fResizeImg(w, h, id){
        var img='';
        var obj;
        if(id==undefined)obj=document.images;
        else obj=document.getElementById(id).getElementsByTagName('img');
         
        for(var i=0; i<obj.length; i++){
            img=obj[i];
            
        if(img.src.indexOf('smilies') != -1)
        {
        
        }
        else
        {
            if(img.width>w&&(img.height<img.width)){
                img.style.height=img.height-(img.height/(img.width/(img.width-w)))  + "px";
                img.style.width= w + "px";
            }else if(img.height>h&&(img.height>img.width)){
                img.style.width= img.width-(img.width/(img.height/(img.height-h))) + "px";
                img.style.height= h + "px";
            }
            
            img.onclick=function(){
                try{ imgPopup.close();} catch(e){}
                imgPopup=open('#', 'imgurl', 'width=500, height=500, left='+(screen.availWidth-500)/2+
                ', top='+(screen.availHeight-500)/2)
                imgPopup.document.write('<script>document.onclick=function(){ close();} /* 单击关闭窗口 */ <\/script>');
                 
                imgPopup.document.write('<img src="'+this.src+'"/>'+
                    '<script>'+
                        'var w, h;'+
                        'var img=document.images[0];'+
                        'if(navigator.appName=="Opera"){w=img.width+10; h=img.height+40} else {w=img.width+10; h=img.height+25};'+
                        'self.resizeTo(w, h);'+
                        'self.moveTo((screen.availWidth-img.width)/2,(screen.availHeight-img.height)/2)'+
                    '<\/script>'+
                    '<style>body{margin:0; padding:0;} .hd{visibility:hidden;}<\/style>');
                imgPopup.document.write('<p class="hd">ok</p>');
                imgPopup.document.close();
                imgPopup.focus();
            }
            }
        } // shawl.qiu script
    }
    //---------------------------------end function fResizeImg();
//]]>
</script>


<div id="TopicContent" class="text"><P><STRONG><EM><U><FONT face=楷体_GB2312 color=blue size=6>几家欢乐,几家悲阿!动力大过预期,防噪小于预期</FONT></U></EM></STRONG></P>
<P><IMG src="http://weihu.top86.com/TrafficP/UploadPhotos/200409/20040903171809869.jpg"></P>
<P> </P>
<P><EMBED src=http://ft134zbook.nhpop.cn/blog/UploadFiles/2006-11/115644534.wma  type='audio/mpeg' loop='false' autostart='false' height=40 ></EMBED></P>
<P> </P>
<P><IMG alt="" src="http://review.baa.com.cn/Common/editor/images/smilies/smile.gif" border=0 smilieid="1"> <IMG alt="" src="http://review.baa.com.cn/Common/editor/images/smilies/titter.gif" border=0 smilieid="9"> <IMG alt="" src="http://review.baa.com.cn/Common/editor/images/smilies/shy.gif" border=0 smilieid="8"> <IMG alt="" src="http://review.baa.com.cn/Common/editor/images/smilies/lol.gif" border=0 smilieid="12"> <IMG alt="" src="http://review.baa.com.cn/Common/editor/images/smilies/mad.gif" border=0 smilieid="11"> <IMG alt="" src="http://review.baa.com.cn/Common/editor/images/smilies/sweat.gif" border=0 smilieid="10"> <IMG alt="" src="http://review.baa.com.cn/Common/editor/images/smilies/tongue.gif" border=0 smilieid="7"> <IMG alt="" src="http://review.baa.com.cn/Common/editor/images/smilies/cry.gif" border=0 smilieid="4"> <IMG alt="" src="http://review.baa.com.cn/Common/editor/images/smilies/shocked.gif" border=0 smilieid="6"> <IMG alt="" src="http://review.baa.com.cn/Common/editor/images/smilies/biggrin.gif" border=0 smilieid="3"> <IMG alt="" src="http://review.baa.com.cn/Common/editor/images/smilies/huffy.gif" border=0 smilieid="5"> <IMG alt="" src="http://review.baa.com.cn/Common/editor/images/smilies/sad.gif" border=0 smilieid="2"> <IMG alt="" src="http://review.baa.com.cn/Common/editor/images/smilies/kiss.gif" border=0 smilieid="16"> <IMG alt="" src="http://review.baa.com.cn/Common/editor/images/smilies/handshake.gif" border=0 smilieid="17"> </P></div>