<SCRIPT LANGUAGE="JavaScript">
<!--
//图片等比例缩放
var FitWidth = 250; //图片宽度
var FitHeight = 176; //图片高度
function ResizePic(ImgTag)
{
var image = new Image();
image.src = ImgTag.src;
if(image.width>0 && image.height>0){
if(image.width/image.height >= FitWidth/FitHeight){
if(image.width > FitWidth){
ImgTag.width = FitWidth;
ImgTag.height = (image.height*FitWidth)/image.width;
}
else{
ImgTag.width = image.width;
ImgTag.height = image.height;
}
}
else{
if(image.height > FitHeight){
ImgTag.height = FitHeight;
ImgTag.width = (image.width*FitHeight)/image.height;
}
else{
ImgTag.width = image.width;
ImgTag.height = image.height;
}
}
}
}
-->
</script>
为了避免加载时图片暂时没有缩小,可以将图片设置一个默认的大小。
<img width="30" height="30" src="../honor/1.jpg" onload="javascript:ResizePic(this)">
<img width="30" height="30" src="../honor/2.jpg" onload="javascript:ResizePic(this)">
<img width="30" height="30" src="../honor/3.jpg" onload="javascript:ResizePic(this)">
分享到:
相关推荐
JavaScript实现网页图片等比例缩放 JS效果 JS效果特效 图片等比例缩放
主要介绍了JS图片等比例缩放方法,结合完整实例形式分析了javascript针对页面图片元素属性操作的相关技巧,需要的朋友可以参考下
jquery图片插件设置图片等比例缩放.rarjquery图片插件设置图片等比例缩放.rarjquery图片插件设置图片等比例缩放.rarjquery图片插件设置图片等比例缩放.rarjquery图片插件设置图片等比例缩放.rarjquery图片插件设置...
按比例缩放图片,JavaScript代码.rar按比例缩放图片,JavaScript代码.rar按比例缩放图片,JavaScript代码.rar按比例缩放图片,JavaScript代码.rar按比例缩放图片,JavaScript代码.rar按比例缩放图片,JavaScript代码...
javascript实现图片按比例缩放
原生JavaScript制作网页div里面大图片按比例缩放排列
js等比例缩放图片,这个功能非常实用,当网页加载一个尺寸比较大的图片时,往往会把一个网页撑的变形,页面变得很难看,于是我们就想到了用JS去控制超出一定范围的图片,软件开发网以稳定页面布局,本代码段就是完成...
好使的图片等比例缩放js 应用方法<img src"img" onload="javascript:resizeimg(this,width,height)" />
1--控制一张图片等比例缩放容易 ,不失真 2--控制多张图片切换时每张图片保持等比例缩放,不失真
在处理网页图片时,特别是一些图片列表的应用里面,...– // 说明:用 JavaScript 实现网页图片等比例缩放 // 整理:http://www.CodeBit.cn function DrawImage(ImgD,FitWidth,FitHeight) { var image=new Image(); imag
使用一个方法可以等比例缩小你的,让图片不失去原本的效果。
用了vue - echarts - datav-elementul大屏数据可视化方案,包含屏幕适配方案等比例缩放, 等比例缩放的屏幕适配方法。可以让你不需要大量使用百分比或者转换之类的方法去写屏幕自适应大小,而是可以用部分px直接写...
原生JS实现大图片按比例缩放是一款原生JavaScript制作网页div里面大图片按比例缩放排列。
按比例缩放图片,JavaScript代码! 值得下载看看!资源免费,大家分享!! 更多免费资源 http://ynsky.download.csdn.net/
js等比例缩放页面图片大小 // JavaScript Document function handle_img(tagimg_name,tagimg_width,tagimg_height){ var img_object=new Image(); var get_imgs=document.getElementsByName(tagimg_name); for...
原生JS实现大图片按比例缩放是一款原生JavaScript制作网页div里面大图片按比例缩放排列。
javascript 区域内 图片等比例缩放实现代码 脚本之家整合版,兼容ie跟firefox。
主要介绍了JS实现按比例缩放图片的方法,结合实例形式较为详细的分析了JavaScript实现等比例缩放图片的原理与具体实现技巧,并附上C#版的图片缩放代码做对比参考,需要的朋友可以参考下