當我最大化窗口或返回窗口模式時，$（window）.resize（）事件在Chrome中不起作用

Question

以下函數，包含“調整大小”事件，通過使用鼠標刪除邊框來調整窗口大小時工作正常，但是當我最大化瀏覽器或我恢復窗口時腳本不起作用。 它在其他瀏覽器中工作正常。

可能是什么原因？

(function ( $ ) {
    jQuery.fn.font_resizer = function () {
        var self = jQuery(this);
        var fontSize = self.css('fontSize').slice(0, -2);
        var lineH = self.css('lineHeight').slice(0, -2);
        jQuery(self).resize_font(self, fontSize, lineH);

        jQuery(window).on('resize', function() {
           jQuery(self).resize_font(self, fontSize, lineH);
        });
    };
    } (jQuery));

Answer 1

這適用於Chrome版本42.0.2311.90 m。

jQuery(window).on('resize', function() {...}適用於窗口最大化以及調整窗口邊框大小。它不適用於窗口最小化/恢復，因為大小不會改變，所以這不應該影響你。

JSFiddle： https ：//jsfiddle.net/seadonk/jafdoex8/

我沒有看到你的font_resize事件的聲明，所以我自己做了，只根據窗口寬度和高度設置字體大小和行高。

(function ($) {
    jQuery.fn.font_resizer = function () {
        var self = $(this);
        var fontSize = self.css('fontSize').slice(0, -2);
        var lineH = self.css('lineHeight').slice(0, -2);
        jQuery(self).resize_font(fontSize, lineH);
        jQuery(window).on('resize', function () {
            jQuery(self).resize_font(fontSize, lineH);
        });
    };

    //on window resize set the font and line height
    jQuery.fn.resize_font = function (fontSize, lineH) {        
        var self = $(this);
        self.css('fontSize',$(window).width()/1920*36+'pt');
        self.css('line-Height',$(window).height()/1080*36+'px');
        $('#fontSize').text(self.css('fontSize').slice(0, -2));
        $('#lineHeight').text(self.css('lineHeight').slice(0, -2));
        $('#fontTimeStamp').text(getTime());
    };
}(jQuery));

(function () {
    $("body").font_resizer();
});