时间:2021-05-25
JS代码(随便放哪里):
<scriptlanguage="JavaScript">
<!--
varflag=false;
functionDrawImage(ImgD){
varimage=newImage();
image.src=https://www.jb51.net/htmldata/2006-01-08/ImgD.src;
if(image.width>0&&image.height>0){
flag=true;
if(image.width/image.height>=180/110){
if(image.width>180){
ImgD.width=180;
ImgD.height=(image.height*110)/image.width;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
}
else{
if(image.height>110){
ImgD.height=110;
ImgD.width=(image.width*110)/image.height;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
}
}
}
//-->
</script>
图片使用的地方:
<imgsrc="https://www.jb51.net/htmldata/2006-01-08/图片"border=0width="180"height="110"onload="javascriptrawImage(this);">
width="180"height="110"注意这里最好限定,如果不限定加载图时会成原大,然后再缩小,这个过程如果图大了很难看的.这里是宽度和高度,在前面的JS里改,这里也作相应的改.
图不会变形,只会按比列缩,放心
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
为了防止图片撑破布局,最常见的仍然是通过onload后获取图片尺寸再进行调整,所以加载过程中仍然会撑破。而Qzone日志的图片在此进行了改进,onload完毕后
本文实例为大家分享了JS实现按比例缩小图片宽高的具体代码,供大家参考,具体内容如下JS按比例缩小图片宽高varupd=document.getElementBy
复制代码代码如下:图片自动等比例缩小且垂直居中-www.jb51.net
复制代码代码如下:jQuery(document).ready(function(){$(window).load(functi
在布局页面时,有时会遇到大图片将页面容器“撑破”的情况,尤其是加载外链图片(通常是通过采集的外站的图片)。那么本文将为您讲述使用jQuery如何按比例缩放大图片