ホームページ  >  記事  >  ウェブフロントエンド  >  scrollIntoViewの使用例

scrollIntoViewの使用例

零下一度
零下一度オリジナル
2017-06-29 14:49:342194ブラウズ

DOM のスクロール

DOM 仕様では、各ブラウザーがどのような種類のスクロール ページ領域を実装する必要があるかは規定されておらず、各ブラウザーは対応するメソッドを実装しており、ページ領域のスクロールを制御するためにさまざまなメソッドを使用できます。これらのメソッドは HTMLElement タイプの拡張として存在するため、すべての要素で使用できます。

1.scrollIntoView(alignWithTop) 現在の要素が現在のウィンドウの表示範囲に表示されるように、ブラウザ ウィンドウまたはコンテナ要素をスクロールします。 alignWithTop が true の場合、または省略された場合、ウィンドウは可能な限りスクロールして、ウィンドウ自体の上部が要素の上部と同じ高さになるようにします。 -------現在、すべてのブラウザが

2 をサポートしています。scrollIntoViewIfNeeded(alignCenter) 現在の要素がウィンドウの表示範囲内に表示されていない場合にのみ、ブラウザ ウィンドウまたはコンテナ要素がスクロールされ、現在の要素が表示されます。やがて見えるようになる。現在の要素がビューポートに表示されている場合、このメソッドは何も行いません。オプションのパラメータ alignCenter が true に設定されている場合、要素をウィンドウの中央 (垂直方向) に表示しようとすることを意味します。-----Safari と Chrome はこのメソッドを実装します

3。指定する要素の内容 行数の高さ、lineCount の値は正または負の値です。 ---Safari と Chrome はこのメソッドを実装します

4.scrollByPages(pageCount)は、要素のコンテンツを指定されたページの高さまでスクロールします。具体的な高さは要素の高さによって決まります。 ---Safari と Chrome はこのメソッドを実装しています

scrollIntoView() とscrollIntoVIewIfNeeded() は要素のウィンドウに影響しますが、scrollByLines() とscrollByPages() は要素自体に影響します。いくつかの例を示します。

ルレエレーエ

以上がscrollIntoViewの使用例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。