javascript - 在页面高度更改时绑定事件

Question

每次页面高度发生变化时，我都需要执行一些 javascript。

到目前为止，我正在做一些非常丑陋的事情：每次我做一些可能改变页面高度的事情时，我都会使用回调。

// initial 
positionFooter();
$(window).resize(positionFooter);

...
// some code in some function 
$(this).hide(0, positionFooter);
...

...
// some code in some function 
$(this).show(0, positionFooter);
...

...
// some code in some function 
toggle(i,p.speed, positionFooter);
...

我想找到一种在页面高度发生变化时自动调用我的函数的方法。你有什么想法 ？

编辑：似乎我的问题尚不清楚：某些事件（选项卡更改、ajax 加载新内容、切换事件……）不会触发调整大小功能。为了解决这个问题，我选择在每个事件之后手动调用该函数。它工作正常，但我认为该解决方案并不令人满意。如果有一种方法可以在一个地方捕捉任何页面的高度变化，那会更干净。

Answer 1

使用 Jquery，$(window).resize(function) 将在每次调整窗口大小时调用函数。

$(window).resize(function() {
   //Do something when the window is resized
}

如果你想改变 CSS，你可以像这样在你的 CSS 中直接使用媒体查询

@media only screen 
and (max-device-width : 1023px) {
/* Styles */
}

@media only screen 
and (min-device-width : 1024px) {
/* Styles */
}

Jquery.resize() 媒体查询

如果这不能回答您的问题，请改写或向我们提供有关您正在调用的功能/您正在测试的浏览器的更多信息。