Javascript实现上传的图片按比例缩放和原样显示-深圳便民网-电脑知识专栏

电脑网络频道 >>>

首页 | 网络安全 | 搜索引擎 | 网络应用 | 建站常识 | 网络编程 | 硬件课堂 | 操作系统

首页>>>电脑网络>>>网络编程>>>正文

Javascript实现上传的图片按比例缩放和原样显示

上一篇:动态效果DHTML

收录日期:2005-9-22 8:29:04

我们经常会遇到在页面中的图片按照我们自己的大小来显示，这样可以让页面看起来更规范一些。

　　比如我们要在页面种显示130×160的图片，相当于我们将图片放入这样的一个相框那，超过的就缩放到这个框的大小，小的就原样显示。

我们这里有2种解决办法，

1，不按照比例的缩放

      <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)">

2，按照比例的缩放

<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)">

2，按照比例的缩放

<script language="javascript">
function changeImg1(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)">

下一篇：VB6.0初学者的10个编程小技巧

收录日期:2005-9-22 8:29:04

相关新闻：

特别申明:本站绝大部分文章与作品均收集于互联网或网友自行上传,如有侵权,请主动与我们联系,如属实,我们会及时删除。同时深圳生活网不对文章及作品使用后果负任何连带责任。谢谢合作!

	热点排行

·Google纪录你的一言一行

·搜集的Sql一些常用的语句

·挽救烧坏金手指的显卡实录

·电脑死机故障分析

·QQ使用技术后续版之QQ搞怪十

·QQ使用技术后续版之QQ搞怪十

·Google新鲜技巧玩法

·电脑保护误区面面观

·使用xmldom在服务器端生成静

·音箱挑选过程中的7个注意事项

·实例演练ASP+XML编程

·非常不错的Javascript脚本

·动态效果DHTML

·Javascript实现上传的图片按

·怎样才能把我的网站加入Goog

·为什么在Google上搜不到我的

·Google的网站收录和排名

·体验Windows XP中超强syskey

·Linux程序应用开发环境和工具

·windows xp 家庭用户内存优化