JS技法-页面悬浮导航
J
S
技
法
页面悬浮导航
在很多长页面中，为了让导航条总是显示在可视范围内，需要让导航条悬浮。
HTML：
页面悬浮导航
导航1导航2导航3
欢迎来到张小帅日常！
CSS：
JS：
温馨
提醒
css样式中，最核心的就是动态添加类，先写出".fix"样式，通过后面的JS进行触发。
◊JS代码13行，通过判断导航条距顶部大小与滚动距离的关系，进行固定类的触发。当前者小于后者，不触发固定操作；反之，触发固定".fix"样式生效。
代码链接：https://pan.baidu.com/s/1cnvXYcKPjT-CJo_EjzjRXQ 密码：9sjc
敬
请
关
注
- 发表于:
- 原文链接：http://kuaibao.qq.com/s/20180427G0UM9X00?refer=cp_1026
- 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号（企鹅号）传播渠道之一，根据《腾讯内容开放平台服务协议》转载发布内容。
- 如有侵权，请联系 cloudcommunity@tencent.com 删除。
相关快讯
扫码
添加站长 进交流群
领取专属 10元无门槛券
私享最新 技术干货
腾讯云开发者
