在jQuery中滚动到顶部和滚动到底部

Vignesh Pichamani 发表于 Dev

维格涅什·皮卡玛尼

我尝试用jquery从上到下和从下到上实现滚动器。我最近尝试了百分比。从顶部到底部的像素似乎还可以。（意味着它有效）从底部到顶部只有当我提到百分比为100时，滚动才能完全完成

$('#spnTop').on("click",function(){
    var percentageToScroll = 100;
    var percentage = percentageToScroll/100;
    var height = jQuery(document).height();
    var documentHeight = $(document).height();
    var scroll = $(window).scrollTop();
    alert(scroll);
    var scrollAmount = Math.round((height) * percentageToScroll/ 100)-scroll;

    //alert(point);
    alert(scrollAmount);
    $('html,body').animate({ scrollTop: scrollAmount }, 'slow', function () {
                          alert("reached top");    });

});

这是小提琴。例如：percentToScroll现在为100，但是滚动的结尾尚未完全结束。（从底部到顶部）对于顶部到底部为100，则它完全滚动到页面底部。

我不确定如何使其可行。

谢谢。

维琪

雅克·斯曼（Jacques Snyman）

那这个呢？

$('#spnTop').on("click",function(){
    var percentageToScroll = 100;
    var percentage = percentageToScroll/100;
    var height = $(document).scrollTop();
    var scrollAmount = height * (1 - percentage);

    alert(scrollAmount);
    $('html,body').animate({ scrollTop: scrollAmount }, 'slow', function () {
                          alert("reached top");    });

});
$('#spnbottom').on("click",function() {
    var percentageToScroll = 100;
    var height = $(document).innerHeight();
    var scrollAmount = height * percentageToScroll/ 100;
    alert(scrollAmount);
     var overheight = jQuery(document).height() - jQuery(window).height();
    //alert(overheight);
jQuery("html, body").animate({scrollTop: scrollAmount}, 900);    
});