jquery滚动到指定元素，模仿锚点

最新推荐文章于 2023-03-07 18:43:04 发布

转载最新推荐文章于 2023-03-07 18:43:04 发布 · 148 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/bestsamcn/p/4935621.html

文章标签：

#javascript #ViewUI

本文介绍了一个简单的jQuery脚本，用于实现点击导航项时页面平滑滚动到指定位置的效果。通过获取元素距离页面顶部的距离，并利用jQuery的animate方法来完成动画效果。

html

 1 <div class="pd-nav">
 2     <div class="n-item active">
 3         保险服务 <i></i>
 4     </div>
 5     <div class="n-item " id="bzjh1">
 6         保障计划
 7         <i></i>
 8     </div>
 9         <div class="n-item"        onclick="window.location.href='http://fortune.jmc999.cn/finance.html'">
10                         理财策划
11         <i></i>
12     </div>
13 </div>

jquery

<script type="text/javascript">
    //获取元素距离html顶部距离
	var _scrolltop = $('#bzjh2').offset().top;
	$('#bzjh1').click(function(){
		$('html, body').animate({
			scrollTop: _scrolltop},1000
		);
	})
</script>

转载于:https://www.cnblogs.com/bestsamcn/p/4935621.html