免费的网站如何建设,史志网站建设,iis网站属性在哪,网站欢迎页源码需求
点击页面上的 文字 滑动到页面指定位置
三种方法 document.getElementById(show).scrollIntoView() // 默认滚动至节点置顶document.getElementById(show).scrollIntoView(false) // 默认滚动至节点显示document.getElementById(show).scrollIntoView({ behavior: show).scrollIntoView() // 默认滚动至节点置顶document.getElementById(show).scrollIntoView(false) // 默认滚动至节点显示document.getElementById(show).scrollIntoView({ behavior: smooth, block: end, inline: nearest }); // 见下文scrollIntoView() 方法的使用 scrollIntoView([alignToTop,scrollIntoViewOptions ]) 方法可以携带最多两个参数 alignToTop 可选 如果为 true元素的顶端将和其所在滚动区的可视区域的顶端对齐。这是这个参数的默认值。如果为 false元素的底端将和其所在滚动区的可视区域的底端对齐。scrollIntoViewOptions 可选 behavior 可选定义动画过渡效果auto 或 smooth 之一。默认为 auto。block 可选定义垂直方向的对齐start、center、end 或 nearest 之一。默认为 start。inline 可选定义水平方向的对齐start、center、end 或 nearest 之一。默认为 nearest。示例
div clickswitchMenu1产品服务/div
div idshow refview展示/div1、利用scrollIntoView()方法该方法将调用它的元素滚动到浏览器窗口的可见区域根据其他元素的布局元素可能无法完全滚动到顶部或底部 ps页面可滚动时才有用可通过设置css实现
document.getElementById(show).scrollIntoView() 直接跳转到指定位置效果比较生硬methods: {switchMenu(index) {console.log(111, index)switch (index) {case 0:breakcase 1:document.getElementById(show).scrollIntoView();breakcase 2:this.$message.success(敬请期待)breakcase 3:breakdefault:break}}},缓慢移动至目标 function switchMenu () {document.getElementById(kinds).scrollIntoView({ behavior: smooth })}
scrollIntoView提供了scrollIntoViewOptions对象参数
