vue中的锚点跳转实现当前位置跳转到指定div
phoneRegex: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,然后使用test做校验,例如:this.phoneRegex.test(做验证的参数)
·
let jump = document.querySelector("#map");//定义起跳点div
let total = jump.offsetTop;
let distance =
document.documentElement.scrollTop || document.body.scrollTop;
// 平滑滚动,时长500ms,每10ms一跳,共50跳
let step = total / 80;
if (total > distance) {
smoothDown();
} else {
let newTotal = distance - total;
step = newTotal / 80;
smoothUp();
}
function smoothDown() {
if (distance < total) {
distance += step;
document.body.scrollTop = distance;
document.documentElement.scrollTop = distance;
setTimeout(smoothDown, 10);
} else {
document.body.scrollTop = total;
document.documentElement.scrollTop = total;
}
}
function smoothUp() {
if (distance > total) {
distance -= step;
document.body.scrollTop = distance;
document.documentElement.scrollTop = distance;
setTimeout(smoothUp, 10);
} else {
document.body.scrollTop = total;
document.documentElement.scrollTop = total;
}
}
},
步骤如下:
# 给元素绑定点击事件
## 给跳转至哪个元素设置id名
### 在methods:中定义点击事件 function(){ document.querySelector("#header").scrollIntoView(true);}
更多推荐
已为社区贡献8条内容
所有评论(0)