Diz*_*zzi 5 jquery scroll offset
我只是为滚动页面写了这个,它工作得很好,并做它应该做的事情..
$('#nav a').click(function(){
var sid = $(this).attr('id');
$('html,body').animate({
scrollTop: $('#'+ sid +'-content').offset().top - 200}, 1000);
return false;
});
Run Code Online (Sandbox Code Playgroud)
..但我希望偏移量按%而不是px计算
即而不是
top - 200
Run Code Online (Sandbox Code Playgroud)
它可能是
top - 30%
Run Code Online (Sandbox Code Playgroud)
任何想法如何实现这一目标?
一如既往地提供任何帮助,并提前感谢.
快速编辑:
当前3个答案(谢谢)似乎每次都不会增加,这不是我想要的,我希望每次都有30%窗口高度的恒定间隙,所以每次#id-content都滚动到顶部线条时我有一个固定的侧边栏.
我当前的代码留下了200px的差距,但这导致了不同的监视器/浏览器大小的问题,其中%将对其进行排序.
以下将从顶部将盒子定位为60%:
var offset = parseInt($('#example').offset().top);
var bheight = $(window).height();
var percent = 0.6;
var hpercent = bheight * percent;
$('html,body').animate({scrollTop: offset - hpercent}, 1000);
Run Code Online (Sandbox Code Playgroud)
不确定你到底想要什么 30%,但你能做的就是将你想要的百分比乘以 0.3,然后从顶部减去它。
如果它是顶部偏移本身,您需要 30%:
$('html,body').animate({
scrollTop: $('#'+ sid +'-content').offset().top - $('#'+ sid +'-content').offset().top * 0.3 }, 1000);
return false;
});
Run Code Online (Sandbox Code Playgroud)
当然,这看起来有点愚蠢,因为它相当于$('#'+ sid +'-content').offset().top * 0.7,但您可以将其替换为您想要的任何内容。