你的位置:首页 > Java教程

[Java教程]如何跳转到另一个页面的指定位置


如何跳转到另一个页面的指定位置:
在同一个页面中,点击一个地方跳转到指定的位置这个很简单,就是使用的锚点,例如:

 

<a href="#thediv">蚂蚁部落</a>

 

以上代码,当点击a元素的时候能够跳转到id属性值为thediv的元素。
上面介绍的是在同一个页面的情况,如果是不同的页面当然也是可以进行这样的定位的,只要在前面加上链接即可:

 

<a href="mytest.aspx#thediv">蚂蚁部落</a>

 

以上代码,点击链接可以定位到mytest.aspx页面中id属性值为thediv的元素。
但是上面的定位都是点击以后,瞬间到达指定位置,可能感觉不够优美,如果能够平滑的滚动到那个位置就再好不过了,下面就做一下简单的介绍,代码如下:

 

function getParam() {  var params=location.search.substr(1) var ArrParam=params.split('#');  if(ArrParam.length>1)  {  return ArrParam[1]; } } $(function(){  var mao=$("#"+getParam()); if(mao.length>0)  {  var pos=mao.offset().top;   var poshigh=mao.height();   $("html,body").animate({scrollTop:pos-poshigh-30},3000);  } }); 

 

以上代码非常的简单,这里就不多介绍了。
相关阅读:
1.location.search可以参阅Location对象的search属性一章节。
2.substr()函数可以参阅javascript的String对象的substr()方法一章节。
3.split()函数可以参阅JavaScript的String对象的split()方法一章节。
4.offset可以参阅jQuery的offset()方法一章节。
5.height()函数可以参阅jQuery的height()方法一章节。
6.animate()函数可以参阅jQuery的animate()方法一章节。

原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=9331

更多内容可以参阅:http://www.softwhy.com/jquery/