网页效果达到页面滚动（锚点跳转）

编程入门行业动态更新时间:2024-10-26 09:28:59

网页效果达到页面滚动（锚点<a href=https://www.elefans.com/category/jswz/34/1769274.html style= 跳转）"/>

问题：在学习a元素的时候通过指定id可以将页面跳转到指定的位置，但是这个过程是瞬间跳转并没有一个滚动的效果，用户体验不是很好，能不能达到滚动效果

解决：

a标签的直接用法，也就是瞬间跳转：<a href="#id">跳转</a>

在JQ动画中，有一个animate()方法，这个方法是动画效果，使用这个方法可以达到滚动效果，具体示例是：

 $("#id1").on("click",function () {$("html,body").animate({scrollTop:$("#id2").offset().top},1000);});

通过点击id1,滚动到id2的位置，这里使用了animate方法，计算了id2距离顶部的距离，并且在1000毫秒内滚动到。

更多推荐

网页效果达到页面滚动（锚点跳转）

本文发布于:2024-02-11 23:40:15，感谢您对本站的认可！

跳转效果页面网页

评论列表（有 0 条评论）