要实现两个内容:
1、从A页面跳转到B页面任何地方
方法:用id对要跳转的地方进行标记。
首先,在A页面可以设一个链接
<a href = "b.html#pos" target = "_blank">点击跳转</a>
然后在B页面要跳转的地方
<div id = "pos"></div>
这样就成功实现跳转。
2、从B页面某处跳转到该页面任何地方
方法:与上述思路一样,但如果是按钮的话需要添加onclick事件。
<a href = "#pos">点击跳转</a> ...... <div id = "pos">跳转到这里</div>
如果是点击按钮跳转的话。。。
<script type = "text/javascript">
function on_scroll() {
document.getElementById("anchor_scroll").click();
}
</script> <button onclick = on_scroll();>点击跳转</button> <a href = "#pos" id = "anchor_scroll" style = "display:none">点击跳转</a> ...... <div id = "pos">跳转到这里</div>
还有个方法是用jQuery的animate动画方法,这个使用的还不是很熟练。
<script type="text/javascript">
function click_scroll() {
var scroll_offset = $("#pos").offset(); //得到pos这个div层的offset,包含两个值,top和left
$("body,html").animate({
scrollTop:scroll_offset.top //让body的scrollTop等于pos的top,就实现了滚动
},0);
}
</script>
<button onclick="click_scroll();" >点击button跳转</button>...
这里是很多文字,把页面撑开,撑出滚动条
...
<div id="pos">跳转到这里</div>
这样有个好处就是可以控制跳转的时间,其中的0代表跳转时间,调成1000则跳转时间会变长。。。
总之,通过网上的学习,我深刻地了解到,id是个好东西。。。