调整浏览器大小后重新计算宽度 [英] Re-Calculate width after browser resize

问题描述

我正在运行第三方脚本，它会在加载时计算元素的宽度.效果很好，但我有一个响应迅速的网站，当我调整浏览器大小时，该元素不再正确显示.

I am running a third party script and it calculates an element's width upon loading. It works great but I have a responsive website and when I re-size the browser the element is no longer displayed correctly.

以下是用于计算宽度的代码:

Here is the code that is used to calculate the width:

var w = ticker.width();
if (label.length) w -= label.outerWidth() + parseFloat(label.css("margin-right"));
if (controls.length) w -= controls.outerWidth() + parseFloat(controls.css("margin-left"));
news.css("width", w);

调整浏览器大小后，如何修改脚本的这一部分以重新计算宽度?

How do I modify this part of the script to re-calculate the width when the browser is resized?

推荐答案

这是最有效的方法

$(window).resize(function() {
if(this.resizeTO) clearTimeout(this.resizeTO);
    this.resizeTO = setTimeout(function() {
      $(this).trigger('windowResize');
    }, 500); 
});
$(window).on('windowResize', function() {
   console.log($(window).width()); // calculating here
});

发生超时的原因是，窗口需要一些时间来获取settel的宽度，但是经典的window.resize事件会在其setteled下来之前获取触发器

reason for having timeout is that window takes some time to get settel the width but classic window.resize event get triggers before it setteled down

这篇关于调整浏览器大小后重新计算宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！