关于网页图片缩放问题

Question

用css设定图片的width height就能缩放吧？

Answer 1

但我想做到根据屏幕大小按需来缩放图片先取屏幕宽高 在用js控制css就好了

Answer 2

但我想做到根据屏幕大小按需来缩放图片先取屏幕宽高 在用js控制css就好了
我是初学者，请不要见怪。如果纯粹使用JQUERY来控制CSS改变图片尺寸，那样我也懂，使用
$("img").css({ "height": 128px, "width": 128px });
大概这样就行
只是我也看过网上很多JQUERY缩放图片的插件，代码比想象中的要复杂很多，例如下面这个，很大一部分我搞不懂有什么区别：
; (function ($) {    $.fn.aeImageResize = function (params) {        var aspectRatio = 0;        // We cannot do much unless we have one of these
        if (!params.height && !params.width) {
            return this;
        }        // Calculate aspect ratio now, if possible
        if (params.height && params.width) {
            aspectRatio = params.width / params.height;
        }        // Attach handler to load
        // Handler is executed just once per element
        // Load event required for Webkit browsers
        return this.one("load", function () {            // Remove all attributes and CSS rules
            this.removeAttribute("height");
            this.removeAttribute("width");
            this.style.height = this.style.width = "";            var imgHeight = this.height
, imgWidth = this.width
, imgAspectRatio = imgWidth / imgHeight
, bxHeight = params.height
, bxWidth = params.width
, bxAspectRatio = aspectRatio;            // Work the magic!
            // If one parameter is missing, we just force calculate it
            if (!bxAspectRatio) {
                if (bxHeight) {
                    bxAspectRatio = imgAspectRatio + 1;
                } else {
                    bxAspectRatio = imgAspectRatio - 1;
                }
            }            // Only resize the images that need resizing
            if ((bxHeight && imgHeight > bxHeight) || (bxWidth && imgWidth > bxWidth)) {                if (imgAspectRatio > bxAspectRatio) {
                    bxHeight = ~~(imgHeight / imgWidth * bxWidth);
                } else {
                    bxWidth = ~~(imgWidth / imgHeight * bxHeight);
                }                this.height = bxHeight;
                this.width = bxWidth;
            }
        })
.each(function () {     // Trigger load event (for Gecko and MSIE)
    if (this.complete) {
        $(this).trigger("load");
    }     // This fixes IE9 issue
    this.src = this.src;
});
    };
})(jQuery);

Answer 3

    //窗口改变大小图片自动适应
    $(window).resize(function(){
        var w = $(document).width();//获取窗口的宽度
        $("img").each(function(){ //循环所有图片
            var _this = $(this),img = new Image();
            img.src = _this.attr("src");
            if (img.complete) {
                img.width > w ? _this.attr({width:w,height:~~(w*img.height/img.width)}) : _this.attr({width:img.width,height:img.height});
            } else {
                img.onload = function () {
                    img.width > w ? _this.attr({width:w,height:~~(w*img.height/img.width)}) : _this.attr({width:img.width,height:img.height});
                    img.onload = null;
                }
            }
        });
    }).resize();

Answer 4

直接设img的width: 100%不就行了么？屏幕多大，图片就多大~~但我想做到根据屏幕大小按需来缩放图片