前端设计师在设计网页的时候,常会遇到因图片尺寸超过模板网页的宽度影响整体美观的情况,这篇文章就为大家分享一下解决办法,顺便还加上了图片可以新窗口打开(即使你没有加上超链接。)
$(document).ready(function(e) {
$.each($("#content img"),function(){//把“content”修改为内容页显示内容的DIV的ID属性值
var image=new Image();
image.src=$(this).attr('src');
if(image.width>0 && image.height>0){
if(image.width>=620){//三处“620”修改为需要等比例缩小的最大图片宽度
$(this).attr('width',620);
$(this).attr('height',(image.height*620)/image.width);
}
}});
var ImgsTObj = $('#content img');
if(ImgsTObj){
$.each(ImgsTObj,function(){
$(this).click(function(){
window.open("https://www.22ba.com"+$(this).attr('src'),"_blank");
});
});
}
});