如何制作Facebook剧场观

时间:2013-04-04 02:18:39

标签: javascript css facebook

当你点击Facebook上显示的照片弹出时,它看起来可以用灯箱或类似的东西,查看地址栏,更改网址,可以用pushState javascript方法完成

但是你看看浏览器垂直滚动条了吗?就像在页面没有溢出时打开新页面一样 我确定它不使用

body{
        overflow:hidden
} 

因为当您打开开发人员工具(在Chrome中)时,滚动条处于活动状态

就像一个全新的页面,我希望你理解我的问题,抱歉英语不好

1 个答案:

答案 0 :(得分:1)

当照片打开灯箱样式的查看器时,你是正确的,因为URL是通过pushState更改的。

滚动条通过一个简单的技巧呈现为非活动状态,其中整个页面的内容(相册,订阅源或之前的任何页面)被分配了类_31e(这似乎是动态生成的,所以并不总是这样命名。)

_31e将以下CSS样式分配给容器:

position: fixed;
top: 0px;

在打开div标记后,您会看到它应用于第二个 body