jquery 根据屏幕宽度改变图片宽度

投稿人: 海涛

var clientWidth = parseInt(document.body.clientWidth);
    $('.detail_content img').each(function(i,n){
        $(this).on('load',function(){
            var width = parseInt(this.width);          //图片实际宽度
            var height = parseInt(this.height);
            var outwidth = width;                       //图片输出宽度
            var outheight = height;

            var rateWidth = (clientWidth-20) / width;
            
            if(width > clientWidth){
                outwidth = clientWidth-20;
                outheight = height * rateWidth;
            }
            $(this).attr("width",outwidth);
            $(this).attr("height",outheight);
        })        
    });

上面代码实现的功能就是根据屏幕宽度调节图片宽度,给用户最好的浏览体验.