0

で上にスクロールし、下にスクロールしましたjquery。その中で、パーセンテージと同じようにスクロールします。例: 上から下へのスクロールが である場合、既に機能50%しているため、上から下へスクロールします。50%しかし、もう一度クリックすると50%をスクロールしたいので、残りの50%をページの一番下までスクロールします。jqueryでこれを行う方法がわかりません。

ここにフィドルがありますどんな提案でも素晴らしいでしょう。 http://jsfiddle.net/TkYpY/

ありがとう、ヴィッキー

4

4 に答える 4

1
$('#spnTop').on("click", function () {
var percentageToScroll = 50;
var percentage = percentageToScroll / 100;
var height = $(document).height() - $(window).height();
if(scrollAmount > 0 )
{
scrollAmount = scrollAmount - (height * percentage);
}

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

});

var scrollAmount = 0;
$('#spnbottom').on("click", function () {
var percentageToScroll = 50;
var percentage = percentageToScroll / 100;
var height = $(document).height() - $(window).height();

 if(   scrollAmount < height)
 {
scrollAmount = scrollAmount + height * percentage;
 }
console.log('scrollAmount: ' + scrollAmount);
jQuery("html, body").animate({
    scrollTop: scrollAmount
}, 900);
});
于 2013-10-25T12:42:29.893 に答える
1

私はあなたのフィドルを少し修正しました。私にはいくつかの計算の問題のようです。これがあなたのフィドルです。これはあなたが必要としていたものですか?

まずheight、デフォルト値でグローバル変数を宣言します。

トップスクロールコードで、次のように置き換え var height = $(document).scrollTop(); ます height -= $(document).height() - $(window).height();

var height = $(document).height() - $(window).height();下のスクロールで、これを に置き換えheight += $(document).height() - $(window).height();ます。

于 2013-10-25T09:37:31.273 に答える