`

图片按比例缩放函数

阅读更多
<script language="JavaScript">
<!--
//图片按比例缩放
var flag=false;
function DrawImage(ImgD,iwidth,iheight){
//参数(图片,允许的宽度,允许的高度)
var image=new Image();
image.src=ImgD.src;
if(image.width>0 && image.height>0){
flag=true;
if(image.width/image.height>= iwidth/iheight){
if(image.width>iwidth){ 
ImgD.width=iwidth;
ImgD.height=(image.height*iwidth)/image.width;
}else{
ImgD.width=image.width; 
ImgD.height=image.height;
}
ImgD.alt=image.width+"×"+image.height;
}
else{
if(image.height>iheight){ 
ImgD.height=iheight;
ImgD.width=(image.width*iheight)/image.height; 
}else{
ImgD.width=image.width; 
ImgD.height=image.height;
}
ImgD.alt=image.width+"×"+image.height;
}
}
} 
//-->
</script>
调用:<img src="images/toplogo.gif" onload="javascript:DrawImage(this,100,100)">

详细出处参考:http://www.jb51.net/article/175.htm
分享到:
评论

相关推荐

    js实现图片的按比例缩放

    为了解决这个问题,我们可以使用JavaScript来实现图片的按比例缩放,确保图片始终保持其原始比例,避免变形。下面将详细介绍如何使用JavaScript来实现这一功能,并结合提供的文件进行解析。 首先,我们需要理解图片...

    PB按比例缩放图片.rar_PB 缩放图片_PB图片框缩放_feet4lg_pb 图片_pb 自适应

    标题中的“PB按比例缩放图片.rar”表明这是一个关于PowerBuilder(简称PB)的应用示例,主要用于图片的按比例缩放。在编程中,尤其是在GUI应用程序开发中,图像的缩放是一个常见的需求,用于适应不同的屏幕尺寸或者...

    图片等比例缩放个人最优化版(IE6,IE7,FF)

    以下是一个简单的等比例缩放函数示例: ```javascript function ImgAuto(i, MaxW, MaxH) { var o = new Image(); o.src = i.src; var w = o.width; var h = o.height; var t; if (w &gt; MaxW) { t = MaxW; } ...

    图片按比例缩放示例 内含详细代码

    图片按比例缩放是其中的关键步骤,它可以确保图片在不同设备和屏幕尺寸上展示时保持合适的大小和比例,避免失真。本示例将详细介绍如何进行图片的按比例缩放,并提供详细的代码实现。 首先,我们需要理解比例缩放的...

    JS图片等比例缩放方法完整示例

    通过在`&lt;img&gt;`标签的`onload`事件中调用`AutoResizeImage`,并在传递参数中指定最大宽度和最大高度,我们可以确保图片在加载完成后自动按比例缩放。 ```html (100, 0, this)" /&gt; ``` 在这个例子中,第一张图片限制...

    jquery图片等比例缩放

    当图片的原始宽高比例与容器的宽高比例不一致时,图片会自动按比例缩放。 ### 使用jQuery实现等比例缩放 #### 1. 基本步骤 首先,确保你的页面已经引入了jQuery库。如果没有,可以通过以下代码引入CDN版本: ```...

    图片等比例缩放代码,图片等比例缩放JS代码,图片缩放代码

    在网页设计和开发中,图片的处理是一项非常重要的工作,特别是在响应式布局中,确保图片能够根据屏幕尺寸等比例缩放是必要的。本篇将详细讲解如何使用JavaScript实现图片等比例缩放,以及相关的编程知识。 一、图片...

    js按比例缩放图片,不变形,不失真

    "js按比例缩放图片,不变形,不失真"是一个常见的需求,特别是在用户上传图片或者在页面中显示不同尺寸的图片时。传统的做法是直接设定图片的高度或宽度,但这往往会导致图片比例失衡,产生变形和失真的现象。本篇...

    图片等比例缩放,网页图片处理方法

    ### 图片等比例缩放——网页图片处理方法 在网页设计与开发中,为了确保页面布局的美观性和响应性,经常需要对图片进行等比例缩放处理。这不仅可以提高用户体验,还能有效减少页面加载时间。本文将详细介绍如何利用...

    PHP等比例缩放图片计算以及上传函数

    接下来是第二个函数,用于处理上传图片并按指定尺寸进行等比例缩放。我们可以创建一个名为`uploadAndResizeImage($file, $targetDir, $width, $height)`的函数,它接受上传的文件对象、目标保存目录、目标宽度和高度...

    JavaScript实现网页图片等比例缩放 图片等比例缩放

    在这段代码中,我们通过 `&lt;img&gt;` 标签加载一张图片,并在图片加载完成后调用 `DrawImage` 函数进行等比例缩放处理。`onload` 事件确保了图片在被显示之前已经完成了加载,从而可以正确地获取到图片的尺寸信息并进行...

    图片等比例缩放问题

    ### 图片等比例缩放问题解析 在处理图像时,经常需要对图片进行等比例缩放,以适应不同的显示需求或优化存储空间。本篇文章将详细介绍如何实现图片的等比例缩放,包括缩放的基本原理、实现方法以及注意事项。 ####...

    图像类_labview图像_labview_图像按比例缩放_

    "图像类_labview图像_labview_图像按比例缩放_"这个主题聚焦于如何使用LabVIEW来处理图像,特别是如何实现图像的按比例缩放。下面我们将深入探讨这个知识点。 首先,理解图像缩放的概念是必要的。在数字图像处理中...

    图片等比例缩放.txt 图片等比例缩放.txt

    ### 图片等比例缩放知识点解析 #### 一、知识点概述 在网页设计与开发过程中,经常需要处理图片的大小调整问题。为了保持图片的视觉效果不失真,等比例缩放成为了常用的一种处理方式。本篇文章将从一个具体的...

    图片等比例缩放,动态加载

    图片等比例缩放和动态加载是两种常见的优化技术,它们可以提高页面加载速度,节省用户流量,同时保持图片的视觉一致性。以下将详细介绍这两种技术及其实现方法。 一、图片等比例缩放 等比例缩放是指在不改变图片宽...

    Python代码批处理图片,按照宽度等比例缩放

    要按宽度等比例缩放图片,我们首先需要打开图片,获取其当前尺寸,然后根据新的宽度计算出相应的高度,最后使用resize()方法进行缩放。以下是一个基本的Python代码示例: ```python from PIL import Image def ...

    图像等比例缩放 等比例缩放图片

    1. **网页设计**:为了适应不同分辨率和屏幕尺寸的设备(如手机、平板电脑、台式机等),网页设计师经常需要对页面中的图片进行等比例缩放。 2. **移动应用开发**:在移动应用中,根据用户的设备屏幕尺寸自动调整...

    等比例缩放图片

    在网页设计和开发中,等比例缩放图片是一项常见的任务,尤其在响应式设计中尤为重要。等比例缩放可以确保图片在不同尺寸的设备上显示时保持其原始比例,防止图像失真。本文将深入探讨如何使用jQuery实现这一功能。 ...

    python实现批量按比例缩放图片效果

    在本文中,我们将探讨如何使用Python实现批量按比例缩放图片的效果。这在处理大量图片时非常有用,例如在网站开发、移动应用图标制作或者数据分析等场景。 首先,让我们看一下提供的代码`resizeImg.py`。这个脚本...

Global site tag (gtag.js) - Google Analytics