需要調整大小功能立即工作

Question

我已經做了一個快速的功能，將調整窗口大小時，我的文本按比例調整大小，但我需要它來檢測大小時，它加載太多。我是jQuery的新手，並且認爲我錯過了一些非常簡單的東西。

https://jsfiddle.net/ctyapt2h/

$('.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(); 
});