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

Question

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

我已经搜索了很多关于此功能的信息，并在 github 中找到了名为detect-zoom的 repo ，但似乎仍然存在一些问题，尤其是在最新版本的 FF 和 Chrome 中。

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

有谁知道他们是如何实现这个功能的？甚至欢迎可能的解决方案。

谢谢。

Answer 1

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

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

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