今天下午给用户在做一个简单的单页面网站的时候,用户要求实现这样的一个功能,打开网站页面或者域名,能自动跳转到其中一个在中间位置的锚点。
这样的情况很少有朋友会遇到,但是也不能因为用得少就不去处理,下面是361模板网想的2种处理办法,我们最终选择的是第二种方法,大家可以一起来看下。
第一种方法、使用onLoad属性实现
<body onLoad="scrollTo(0,10)"> //10代表离顶端的距离
这种方法简单,就是打开页面的时候滚动到距离顶部10px的位置停下来,是可以实现定位到锚点的,只需要计算好顶部到锚点的具体的距离就可以了,但是这样的方法有一个小问题,就是如果该页面是自适应移动端就会很麻烦,甚至可以说实现不了。我们再看看第二种方法。
第二种方法、使用JS打开页面跳转定位到锚点位置
<script>window.onload=function(){location.hash='show'; }</script>
上面JS里的show就是我们的锚点的ID。
这样在页面被打开的时候就会直接跳转定位到锚地名称id="show"位置了,大家可以尝试看下具体效果。
以上就是HTML中JS实现打开页面直接跳转到锚点位置的全部内容,希望对大家的学习和解决疑问有所帮助,也希望大家多多支持武林网。新闻热点
疑难解答