前言
我们平时在逛一些电商网站时,无论是首页还是详情页,通常会有一个导航菜单石红跟随着页面,无论是页面滚动到中间还是底部
这是为了方便用户查看商品的各类信息或提交订单购物
也就是吸顶盒效果,那这个效果是怎么实现的...scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
// 当超过150像素时,把顶部的导航菜单设置固定...class="wrap">
总结
要想实现一个层始终固定在屏幕的顶部或底部...因为当网页内容的浏览没有滑出导航菜单的可见范围时,是没有必要把导航菜单置顶的,因此,在代码中就需要监听网页的滚动跳滑动事件
当超过一定的范围以后,才有必要为导航菜单设置固定的position样式
其实也有另外一种解决办法...,就是导航栏始终是固定在顶部,当拉动滚动条时到一定的范围,就改变背景色,也是一种解决办法
