js实现页面滚动至指定位置
实现思路:
1、通过判断链接是否有某参数,来决定是否展示第二屏页面
2、用offset 来获取第二屏与文档顶部距离
3、用scrollTop 将滚动条 滚动至第二屏位置
if(location.href.indexOf('part') != -1){
$('html,body').animate({scrollTop:$('.bg2').offset().top}, 800);
}
一、offset()
offset() 返回或设置匹配元素相对于文档的偏移(位置)。
该方法返回的对象包含两个整型属性:top 和 left,以像素计。此方法只对可见元素有效。
x=$("p").offset().left; y=$("p").offset().top; $("p").offset({top:100,left:0}); //设置所有匹配元素的偏移坐标。 $("p").offset(function(n,c){ //使用函数来设置所有匹配元素的偏移坐标。 newPos = new Object(); newPos.left= c.left+100; newPos.top = c.top+100; return newPos; });
二、关于scroll
1、scrollLeft() 返回或设置匹配元素的滚动条的水平位置【滚动条的水平位置指的是从其左侧滚动过的像素数】
当滚动条位于最左侧时,位置是 0。
2、scrollTop() 返回或设置匹配元素的滚动条的垂直位置【滚动条相对于其顶部以像素计的偏移】。
延伸:
彻底搞懂clientHeight、offsetHeight、scrollHeight的区别
clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop