需要立即调整大小功能

Question

我制作了一个快速函数，可以在 window 调整大小时按比例调整我的文本大小，但我也需要它在加载时检测大小。我是 jQuery 的新手，我想我在这里遗漏了一些非常简单的东西。

$('.smash').each(function () {

    var font = $(this),
        maxFont = parseFloat(font.css('font-size')), 
        minFont = '16px';

    $(window).on('resize', function() {

        var curWid = $(window).width(),
            ratio = (curWid / 1920),
            newFont = (maxFont * ratio);

        if (curWid <= 320) {
            font.css('font-size', minFont);
        } else {
            font.css('font-size', newFont + 'px');
        }
    });
});

Answer 1

在文档就绪时手动触发 jQuery 的 .resize() 方法：

$('.smash').each(function () {

    var font = $(this),
        maxFont = parseFloat(font.css('font-size')), 
        minFont = '16px';

    $(window).on('resize', function() {

        var curWid = $(window).width(),
            ratio = (curWid / 1920),
            newFont = (maxFont * ratio);

        if (curWid <= 320) {
            font.css('font-size', minFont);
        } else {
            font.css('font-size', newFont + 'px');
        }
    });
});

$(document).ready( function() {
    $(window).resize();
});

Answer 2

创建调整大小的函数，并在页面加载时调用它。

$('.smash').each(function () {

    var font = $(this),
        maxFont = parseFloat(font.css('font-size')), 
        minFont = '16px';

     resizeME = function() {

        var curWid = $(window).width(),
            ratio = (curWid / 1920),
            newFont = (maxFont * ratio);

        if (curWid <= 320) {
            font.css('font-size', minFont);
        } else {
            font.css('font-size', newFont + 'px');
        }
    };
    $(window).on('resize', resizeME());
    resizeME ();
});

需要立即调整大小功能

Need to get resize function to work immediately

jquery

fonts

resize