From ae378c0aab28bc8ab71168c1ef3e33e4ea3845af Mon Sep 17 00:00:00 2001 From: MDN Date: Tue, 21 Sep 2021 00:49:44 +0000 Subject: [CRON] sync translated content --- .../conflicting/web/api/window/scroll/index.html | 78 ++++++++++++++++++++++ 1 file changed, 78 insertions(+) create mode 100644 files/ja/conflicting/web/api/window/scroll/index.html (limited to 'files/ja/conflicting/web') diff --git a/files/ja/conflicting/web/api/window/scroll/index.html b/files/ja/conflicting/web/api/window/scroll/index.html new file mode 100644 index 0000000000..72958622fa --- /dev/null +++ b/files/ja/conflicting/web/api/window/scroll/index.html @@ -0,0 +1,78 @@ +--- +title: ScrollToOptions +slug: conflicting/Web/API/Window/scroll +tags: + - API + - CSSOM View + - Dictionary + - Reference + - ScrollToOptions + - 辞書 +translation_of: Web/API/ScrollToOptions +original_slug: 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