web-dev-qa-db-ja.com

$（document）.scrollTop（）は常に0を返します

ページのスクロール位置が特定の高さに達したら、私は単に何かをしようとしています。しかし、scrollTop()は0またはnullを返しますが、どれだけ下にスクロールしても関係ありません。これは、scrollTop()値を確認するために使用しているヘルプ関数です。

_$('body').click(function(){
    var scrollPost = $(document).scrollTop();
    alert(scrollPost);
});
_

scrollTop()、$('body')、そしてもちろん$('html')に$(window)を付けてみましたが、何も変わりません。

何か案は？

javascriptjqueryscrolltop
66
jetlej

何らかの理由で、HTMLおよびbodyタグから「高さ：100％」を削除すると、この問題が修正されました。

これが他の誰かに役立つことを願っています！

108
jetlej

スクロール= 0で同じ問題が発生しました：

document.body.scrollTop

次回使用

document.scrollingElement.scrollTop

編集01.06.2018

eventを使用している場合、documentまたはtargetにsrcElement要素を持つオブジェクトがあります。 Example これは、さまざまなブラウザーでのスクロール操作を示す表です。

enter image description here

ご覧のとおり、FirefoxとIEにはsrcElementがなく、IE 11はscrollingElementをサポートしていません。

40
Verri

上記のいくつかを試した後、CSSを変更する必要がない私の解決策：

var scroll_top = Math.max( $("html").scrollTop(), $("body").scrollTop() )

これは、Chrome、Firefox、IEおよびEdgeの最新バージョンで動作します。

6
Steve Lockwood

私と同じ間違いをするかもしれない人のためのアドオンがあります。私のコードは次のとおりでした：

var p = $('html,body');
$( ".info" ).text( "scrollTop:" + p.scrollTop() );

<html>タグには常にscrollTop値がゼロまたはnullであるため、このコードはchromeおよびsafariなどのWebkitブラウザーを除くすべてのブラウザーで機能します。

他のブラウザは無視しますが、Webkitのブラウザは無視しません。

最も簡単な解決策は、HTMLタグをコードから削除することです。

var p = $('body');
$( ".info" ).text( "scrollTop:" + p.scrollTop() );
5
Kamba-Bilola Ted

Htmlタグとbodyタグからheight: 100%;を削除すると、問題を解決できます。

その理由は、html要素とbody要素のheightプロパティの値として100％を設定した可能性があるためです。 html要素とbody要素のheightプロパティを100％に設定すると、ドキュメントの高さと同じ高さになります。

3
Dawood Najam

同じ問題があった。 scrollTop（）は、ドキュメントでも本文でもない一部のブロックで機能します。このメソッドを機能させるには、ブロックの高さとオーバーフロースタイルを追加する必要があります。

#scrollParag {
    height: 500px;
    overflow-y: auto;
}

その後：

var scrolParag = document.getElementById('scrollParag');
 alert(scrolParag.scrollTop); // works!
1
Vasyl Gutnyk

ちなみに、使用する必要があるようです

$("body").scrollTop()

の代わりに

$(".some-class").scrollTop

これが私が立ち往生している理由です。

0
fzyzcjy

Scroll Topも常に0を返していました。ページ上の特定の要素に焦点を当てるために使用していました。別のアプローチを使用してそうしました。

document.getElementById（ "elementID"）。scrollIntoView（）;

モバイル、タブレット、デスクトップで私のためによく働いています。

0
Hiral Patel