设为首页
加为收藏
联系我们
  • 电子商务
  • 软件网络
  • 看天下
  • 营销财经
  • 关闭导航
  • 网络编程
  • 数据库类
  • 关闭导航
  • 网络编程
  • 社交礼仪
  • 数据库类
  • 人文地理
  • 关闭导航
  • 编程工具
  • 电子书籍
  • 关闭导航
  • 生活休闲
  • 演讲讲座
  • 视频教程
  • 经典影视
  • 关闭导航
    • 推荐文章：
  • 控制图片大小 避免图片撑大页面
    • 图文资讯:
    热门文章:
  • JavaScript定义类和对象
  • 控制图片大小 避免图片撑大页面
    • 您的位置: 首页 > 文章中心 > 网络编程 > JavaScript

    控制图片大小 避免图片撑大页面
    时间: 2008-09-10  信息来源: 博客园  作者: 编辑整理  点击数:
    内容提示：很多人都有这样的尴尬,在编辑页面时,由图片太大,把页面给撑大了,造成整个页面严重变形.本文将介绍利用JavaScript控制图片大小 避免图片撑大页面.

    以下介绍两种实现方法

    不按照比例的缩放 

     <script language="javascript">
    function changeImg(mypic){
        var xw=130;
        var xl=160;

        var width = mypic.width;
        var height = mypic.height;
                        
        if (width > xw ) mypic.width = xw;
        if (height > xl ) mypic.height = xl;
    }
    </script>
    <img src="sh180.jpg" onload="changeImg(this)">      


    按照比例的缩放

    <script language="javascript">
    function changeImg(mypic){
        var xw=160;
        var xl=180;
            
        var width = mypic.width;
        var height = mypic.height;
        var bili = width/height;        
            
        var A=xw/width;
        var B=xl/height;
            
        if(!(A>1&&B>1))
        {
            if(A<B)
            {
                mypic.width=xw;
                mypic.height=xw/bili;
            }
            if(A>B)
            {
                mypic.width=xl*bili;
                mypic.height=xl;
            }
        }
    }
    </script>
    <img src="sh180.jpg" onload="changeImg(this)">

     
    Tags: 控制,图片,大小 责任编辑：aboutstudy
     
      关于我们 友情链接 网站地图 广告服务 联系我们 管理登陆  
      鄂ICP备07014143号  
      Powered by EmpireCMS 5.0  
      Template designed by 直来直往.
      联系信息: QQ 365931563 Email:jiangtian001@sina.com  
      ©CopyRight 2007-2008, SKDE.CN, Inc. All Rights Reserved