关于层的智能浮动效果早在几年前我就在国外的一些个人网站的垂直导航上见到了，现在似乎在国内一些商业网站上也屡见此效果

一、应用展示 关于层的智能浮动效果早在几年前我就在国外的一些个人网站的垂直导航上见到了，现在似乎在国内一些商业网站上也屡见此效果，例如淘宝网的搜索结果页的排序水平条，在默认状态下，滚动条跟随页面滚动，如下： 随着页面向下滚动，当此水平条接触浏览器的上边缘时，水平条独立出来，不跟随滚动条滚动了，如下图所示： 类似的效果在新浪微博上也有： 当页面滚动，新动态提示开始要淡出浏览器窗口的时候，其浮动于浏览器窗口的最上沿显示，如下图所示： 此效果实现原理其实很简单，本文就将展示其实现。 二、实现原理