什么时候的DOM完全呈现在window.resize事件后,如何钩到那个事件? [英] When is the DOM fully rendered after a window.resize event and how can I hook into that event?

查看:258
本文介绍了什么时候的DOM完全呈现在window.resize事件后,如何钩到那个事件?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用Bootstrap 3.2,它的媒体查询策略允许它重写DOM的各种视口大小(在Bootstrap,这些是lg,md,sm和xs的大,中,小和超小视口)。但是,当我使用Bootstrap或者不使用Bootstrap时,我需要确保DOM在浏览器窗口调整大小之前完全重新渲染,之后我的JavaScript代码运行。



我有一个JavaScript函数触发作为一个windows.resize事件的结果:

  $(window).resize ){
ActivateControls();
});但是这个事件有时会在DOM被完全重新渲染之前触发(似乎Bootstrap处理调整大小的操作)事件与我自己的JS代码异步 - 这不工作 - 我需要我的代码运行后,引导完全重新渲染DOM响应调整大小)。



有一个回调事件,我可以连线,以便一旦DOM通过浏览器调整大小的动作完全更新后会收到通知。



谢谢。

解决方案

除非有人相反,我认为答案是使用相同的逻辑Bootstrap本身使用,指出 - 也就是说,在CSS中使用媒体查询,而不是等待Bootstrap在调整大小事件后完全呈现DOM。使用媒体查询将使我的特殊样式在视口大小更改时触发,而不必等待Bootstrap。



我可以发布另一个问题,因为我仍然认为可能有一个类型的$(document).ready()函数,在resize事件之后触发,而不是postback后。如果任何人知道这样的事情,请让我知道。



谢谢。


I'm using Bootstrap 3.2 and its media query strategy allows it to rewrite the DOM for various viewport sizes (in Bootstrap, these are lg, md, sm, and xs for large, medium, small, and extra-small viewports). But when I use Bootstrap or not, I need to make sure that the DOM is completely re-rendered after a browser-window resize before my JavaScript code runs.

Currently, I have a JavaScript function that fires as a result of a windows.resize event:

$(window).resize(function () {
   ActivateControls();
});

But this event sometimes fires before the DOM is fully re-rendered (it seems that Bootstrap processes the resize event asynchronously along with my own JS code--and that's not going to work--I need my code to run AFTER bootstrap fully re-renders the DOM in response to a resize).

Is there a callback event I can wire-up to so that I get notified once the DOM is fully updated by the browser-resize action?

Thank you.

解决方案

Unless someone chimes in to the contrary, I think the answer is to use the same logic Bootstrap itself uses, which Shai pointed out--that is, use media queries in CSS rather than wait for Bootstrap to completely render the DOM after a resize event. Using media queries will let my special-case styling fire upon a viewport-size change rather than have to wait for Bootstrap.

I may post another question because I still think it might be useful to have a sort of $(document).ready() function that fires after a resize event versus after a postback. If anyone knows of anything like that, please let me know.

Thanks.

这篇关于什么时候的DOM完全呈现在window.resize事件后,如何钩到那个事件?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆