当在Facebook上“放大”时，聊天边栏被隐藏了，但是如何？

Question

我不确定是否有人注意到Facebook可以在达到某个级别时检测用户放大级别，它会动态地将 .hidden_​​elem 类名添加到 .fbChatSidebar 把它藏起来。 （检查下面的附件）

我已经搜索了很多关于这个功能的内容，并在github中找到了名为detect-zoom的repo，但似乎还存在一些问题，特别是在最新版本的FF＆amp;铬。

所以我很好奇Facebook如何通过JavaScript检测到这一点，我已经尝试了最新的FF＆amp; Chrome和Facebook似乎可以正确检测到它并将侧边栏隐藏在正确的放大级别。

有谁知道他们如何实现此功能？或者甚至可能的解决方案。

感谢。

Answer 1

我不确定Facebook正在使用的确切解决方案，但我发现他们在两个窗口上隐藏侧边栏调整大小和缩放。

我的研究表明，所有浏览器（包括IE8及更高版本）也会在缩放时触发window.resize事件。因此，当您希望隐藏某些内容时，通过设置一些断点，您应该能够实现一些类似的功能。

快速而肮脏的例子：http://jsbin.com/ofufer/1/