How to detect DIV's dimension changed?

后端 未结 25 2907
抹茶落季
抹茶落季 2020-11-22 06:14

I\'ve the following sample html, there is a DIV which has 100% width. It contains some elements. While performing windows re-sizing, the inner elements may be re-positioned,

25条回答
  •  天命终不由人
    2020-11-22 06:51

    There is a very efficient method to determine if a element's size has been changed.

    http://marcj.github.io/css-element-queries/

    This library has a class ResizeSensor which can be used for resize detection.
    It uses an event-based approach, so it's damn fast and doesn't waste CPU time.

    Example:

    new ResizeSensor(jQuery('#divId'), function(){ 
        console.log('content dimension changed');
    });
    

    Please do not use the jQuery onresize plugin as it uses setTimeout() in combination with reading the DOM clientHeight/clientWidth properties in a loop to check for changes.
    This is incredible slow and inaccurate since it causes layout thrashing.

    Disclosure: I am directly associated with this library.

提交回复
热议问题