Heim >Web-Frontend >js-Tutorial >Implementierung der proportionalen Skalierung von Bildern basierend auf jquery_jquery

Implementierung der proportionalen Skalierung von Bildern basierend auf jquery_jquery

WBOY
WBOYOriginal
2016-05-16 16:29:211737Durchsuche

基于jquery的图片尺寸调整

resize.js

复制代码 代码如下:

$(window).bind("load", function() {
    // BILDGRÖSSE ÄNDERN
    $('#product_list img').each(function() {
        var maxWidth = 120;
        var maxHeight = 120;
        Var-Verhältnis = 0;
        var width = $(this).width();
        var height = $(this).height();
    
        if(width > maxWidth){
            Verhältnis = maxWidth / width;
            $(this).css("width", maxWidth);
            $(this).css("height", height * ratio);
            Höhe = Höhe * Verhältnis;
        }
        var width = $(this).width();
        var height = $(this).height();
        if(height > maxHeight){
            Verhältnis = maxHeight / Höhe;
            $(this).css("height", maxHeight);
            $(this).css("width", width * ratio);
            Breite = Breite * Verhältnis;
        }
    });
    //$("#contentpage img").show();
    // BILDGRÖSSE ÄNDERN
});

代码很简洁,使用起来也很简单,小伙伴们直接使用即可

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn