在项目需求中需要实现一个滚轴联动锚点的功能
效果图如下:
功能代码demo如下:
export default {
data(){
return {
scroll: '',
list: [{
name: "第一条",
backgroundcolor: "#90B2A3"
}, {
name: "第二条",
backgroundcolor: "#A593B2"
}, {
name: "第三条",
backgroundcolor: "#A7B293"
}, {
name: "第四条",
backgroundcolor: "#0F2798"
}, {
name: "第五条",
backgroundcolor: "#0A464D"
}],
navList: [1, 2, 3, 4, 5]
}
},
methods: {
dataScroll: function () {
this.scroll = document.documentElement.scrollTop || document.body.scrollTop;
},
jump(index) {
let jump = document.getElementsByClassName('section');
// 获取需要滚动的距离
let total = jump[index].offsetTop;
// Chrome
document.body.scrollTop = total;
// Firefox
document.documentElement.scrollTop = total;
// Safari
window.pageYOffset = total;
// $('
以上这篇开发者。