Question

我正在寻找一个身体调整大小的听众。我需要类似于$(window).resize()但与身体类似的东西。

为什么我需要身体？我使用ajax添加内容，它可能会改变主体大小（取决于用户的分辨率）。

如何让身体调整大小的侦听器/我在哪里可以找到？

修改
除了ajax，我有手风琴每个物品都有不同的高度，因此可以使身体调整大小...

感谢。

Answer 1

没有可靠的方法来侦听身体调整大小，但你可以听听手风琴中出现的动画。有两种方法可以做到这一点，但其中一种方法更酷。

在您的手风琴脚本的某处，您有一个jQuery .animate语句。如果您没有并使用.show(200)或.fadeIn之类的快捷方式，则需要将其转换为.animate语句。所有这些命令实际上只是.animate的快捷方式。如果您使用的是slideUp和slideDown。当滑块初始化以供以后使用时，你必须保存元素的高度（这是jQuery在幕后做的事情）。

接下来，您将需要使用.animate的step属性来侦听滚动条的存在：

  $(accordionSlideToShow).animate({
        height : 200
        step : function(){
            //scrollbar checking and css control script here
        }
  }, 2000);

但是如果你想要更酷，你可以添加自定义事件到你的小部件。这样，未来的开发可以作为免费功能与这些事件联系起来。

  $(accordionSlideToShow).trigger('ron-accordion-slideWillShow').animate({
        height : 200
        step : function(){
             $(accordionParentElement).trigger('ron-accordion-animationOccurring');
        }
  }, 2000, function(){
      $(this).trigger('ron-accordion-slideDidShow');
  });

现在，您可以绑定到窗口小部件的新事件模型，并像这样监听动画和滚动条：

  $(accordionInstance).on('ron-accordion-animationOccurring', function(){
       //test for scroll bars and add css if needed
  });

Answer 2

当body元素更改大小时，不会触发此类resize事件 - 您可以分配resize事件处理程序，但这只会在窗口调整大小时触发。有几种方法来近似元素调整大小事件，但正如Fresheyeball所说，尝试从不同角度处理问题可能更好。话虽这么说你可以：

创建一个经常通过setInterval调用的函数，该函数会关注width / height或scrollWitdth / scrollHeight身体的，如果有变化，就开火。
在支持此功能的浏览器中，您可以查看使用DOMAttrModified事件或可能使用MutationObserver。但是，这些只有一小部分用户代理支持。
- https://developer.mozilla.org/en-US/docs/DOM/Mutation_events
- https://developer.mozilla.org/en-US/docs/DOM/MutationObserver

jQuery body调整大小监听器

2 个答案: