html中设置锚点定位的几种常见方法
在html中设置锚点定位我知道的有几种方法,使用id定位、使用name定位、使用js定位,这些方法大家可以参考下
1、使用id定位:
<a href="#1F" name="1F">锚点1</a>
<div name="1F">
<p>
11111111111
</br>
11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>
</p>
</div>
这样的定位可以针对任何标签来定位。
2、使用name定位:
<a href="#5F">锚点5</a>
</br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br>
<a name="5F">1111111</href>
使用name属性只能针对a标签来定位,而对div等其他标签就不能起到定位作用。
3、使用js定位
<li class="" onclick="javascript:document.getElementById('here').scrollIntoView()"></li>
通过jQuery实现页面内锚点平滑跳转的方法很多,可以通过插件实现,也可以简单的通过animate方法实现,下面介绍比较简单的方法。
代码只有一句话
$("html,body").animate({scrollTop: $("#elementid").offset().top}, 1000);
$("#back-to-top").click(function () {
$('body,html').animate({ scrollTop: 0 }, 0);
return false;
});