最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

指定区域的图片自动按比例缩小的js代码(防止页面被图片撑破)_javascript技巧

来源:动视网 责编:小采 时间:2020-11-27 21:19:54
文档

指定区域的图片自动按比例缩小的js代码(防止页面被图片撑破)_javascript技巧

指定区域的图片自动按比例缩小的js代码(防止页面被图片撑破)_javascript技巧: 代码如下://缩放图片到合适大小function ResizeImages(){ var myimg,oldwidth,oldheight; var maxwidth=550; var maxheight=880 var imgs = document.getElementById('article').getElementsByTagNam
推荐度:
导读指定区域的图片自动按比例缩小的js代码(防止页面被图片撑破)_javascript技巧: 代码如下://缩放图片到合适大小function ResizeImages(){ var myimg,oldwidth,oldheight; var maxwidth=550; var maxheight=880 var imgs = document.getElementById('article').getElementsByTagNam
 代码如下:


//缩放图片到合适大小
function ResizeImages()
{
var myimg,oldwidth,oldheight;
var maxwidth=550;
var maxheight=880
var imgs = document.getElementById('article').getElementsByTagName('img'); //如果你定义的id不是article,请修改此处

for(i=0;i myimg = imgs[i];

if(myimg.width > myimg.height)
{
if(myimg.width > maxwidth)
{
oldwidth = myimg.width;
myimg.height = myimg.height * (maxwidth/oldwidth);
myimg.width = maxwidth;
}
}else{
if(myimg.height > maxheight)
{
oldheight = myimg.height;
myimg.width = myimg.width * (maxheight/oldheight);
myimg.height = maxheight;
}
}
}
}
//缩放图片到合适大小
ResizeImages();

意思就是控制指定区域的的图片大小,要不一些大点的广告图片也会变形。

脚本之家用的图片控制代码:

代码如下:
function controlImg(ele,w,h){
var c=ele.getElementsByTagName("img");
for(var i=0;i var w0=c[i].clientWidth,h0=c[i].clientHeight;
var t1=w0/w,t2=h0/h;
if(t1>1||t2>1||w0>=600){
c[i].width=Math.floor(w0/(t1>t2?t1:t2));
c[i].height=Math.floor(h0/(t1>t2?t1:t2));
if(document.all){
c[i].outerHTML=''+c[i].outerHTML+''
}
else{
c[i].title="在新窗口打开图片";
c[i].onclick=function(e){window.open(this.src)}
}
}
}
}

ele就是指定的区域,w是最大的宽度,大于这个就会缩小。h是最大的高度。

文档

指定区域的图片自动按比例缩小的js代码(防止页面被图片撑破)_javascript技巧

指定区域的图片自动按比例缩小的js代码(防止页面被图片撑破)_javascript技巧: 代码如下://缩放图片到合适大小function ResizeImages(){ var myimg,oldwidth,oldheight; var maxwidth=550; var maxheight=880 var imgs = document.getElementById('article').getElementsByTagNam
推荐度:
标签: 自动 js 代码
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top