笔者根据业务场景实现一个鼠标滚动级联导航到指定楼层,用JavaScript实现,大家可以把他封装成vue组件在项目中可以复用,如大家有更好的实现欢迎多多交流。
github地址: demo
页面首屏效果
滚动条到一定距离导航XI顶
Ps:用到的技术点
1、在mounted里监听滚动事件
window.addEventListener('scroll', this.navScroll,true);
2、获取滚动条的位置
let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
3、滚动到指定dom位置
floor[index].scrollIntoView(true)
Ps:具体实现
1、dom结构
2、data里声明
3、设置滚动scroll监听
4、监听触发函数
4、导航点击事件触发函数














网友评论