jQuery实现页内锚点平滑跳转

当页面内容长多，导致页面高度过高或过宽是，浏览起来就有点费劲，不过使用了锚点平滑跳转效果可以实现页面的跳转，从而加快速浏览想要浏览的模块。具体做法如下：

首先是菜单（锚点）的写法

<a href="#div1" id="adiv1">菜单1</a>

<a href="#div1" id="adiv2">菜单2</a>

<a href="#div1" id="adiv3">菜单3</a>

其次是内容（锚点指向的模块）的写法

<div id="div1">内容1</div>

<div id="div2">内容2</div>

<div id="div3">内容3</div>

最后是jquery的脚本调用方法

 <script src="js/jquery-1.8.0.min.js" type="text/javascript"></script>

 <script language="javascript" type="text/javascript">

    $(function(){

       $("#adiv1").anchorGoWhere({target:1});

       $("#adiv2").anchorGoWhere({target:1});

       $("#adiv3").anchorGoWhere({target:1});

    });

 </script>

$("#adiv...") 是根据id找到锚点（也可以用别的方法找到锚点，这里为了方便采用的id），anchorGoWhere就是锚点跳转的实现方法，里面的target参数为跳转的类型，如果是1，则是纵向的跳转；如果是2，则是横向跳转

巴特西

jQuery实现页内锚点平滑跳转

最新文章

热门文章