From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/ja/web/api/scrolltooptions/index.html | 79 +++++++++++++++++++++++++++++ 1 file changed, 79 insertions(+) create mode 100644 files/ja/web/api/scrolltooptions/index.html (limited to 'files/ja/web/api/scrolltooptions/index.html') diff --git a/files/ja/web/api/scrolltooptions/index.html b/files/ja/web/api/scrolltooptions/index.html new file mode 100644 index 0000000000..9db579d5b1 --- /dev/null +++ b/files/ja/web/api/scrolltooptions/index.html @@ -0,0 +1,79 @@ +--- +title: ScrollToOptions +slug: Web/API/ScrollToOptions +tags: + - API + - CSSOM View + - Dictionary + - Reference + - ScrollToOptions + - 辞書 +translation_of: Web/API/ScrollToOptions +--- +

{{APIRef("CSSOM")}}

+ +

The ScrollToOptions は CSSOM View 仕様の辞書で、ある要素がスクロールする位置、およびスクロールがスムーズに行われるかどうかを指定するプロパティを指定します。

+ +

ScrollToOptions 辞書は以下のメソッドの引数として提供することができます。

+ + + +

プロパティ

+ +
+
{{domxref("ScrollToOptions.top")}}
+
ウィンドウまたは要素をスクロールするための Y 軸に沿ったピクセル数を指定します。
+
{{domxref("ScrollToOptions.left")}}
+
ウィンドウまたは要素をスクロールするための X 軸に沿ったピクセル数を指定します。
+
{{domxref("ScrollToOptions.behavior")}}
+
スクロールするのに滑らかにアニメーションするのか、一回のジャンプで瞬時に行うのかを指定します。これは実際には ScrollToOptions で実装されている ScrollOptions 辞書で定義されています。
+
+ +

+ +

scrolltooptions の例 (ライブでご覧ください) では、3 つの値を入力するフォームを用意しました。左と上のプロパティ (X 軸と Y 軸に沿ってスクロールする位置) を表す 2 つの数値と、滑らかなスクロールを有効にするかどうかを示すチェックボックスです。

+ +

フォームが送信されると、入力された値を ScrollToOptions 辞書に格納し、辞書を引数として渡して {{domxref("Window.ScrollTo()")}} メソッドを呼び出すイベントハンドラーが実行されます。

+ +
form.addEventListener('submit', (e) => {
+  e.preventDefault();
+  var scrollOptions = {
+    left: leftInput.value,
+    top: topInput.value,
+    behavior: scrollInput.checked ? 'smooth' : 'auto'
+  }
+
+  window.scrollTo(scrollOptions);
+});
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('CSSOM View', '#dictdef-scrolltooptions', 'ScrollToOptions')}}{{Spec2('CSSOM View')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.ScrollToOptions", 10)}}

-- cgit v1.2.3-54-g00ecf