From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- .../ja/web/api/window/afterprint_event/index.html | 78 +++ files/ja/web/api/window/alert/index.html | 70 ++ .../api/window/animationcancel_event/index.html | 92 +++ .../web/api/window/animationend_event/index.html | 92 +++ .../api/window/animationiteration_event/index.html | 98 +++ .../web/api/window/animationstart_event/index.html | 94 +++ .../web/api/window/appinstalled_event/index.html | 85 +++ .../ja/web/api/window/applicationcache/index.html | 44 ++ files/ja/web/api/window/arguments/index.html | 6 + files/ja/web/api/window/back/index.html | 57 ++ .../ja/web/api/window/beforeprint_event/index.html | 75 +++ .../web/api/window/beforeunload_event/index.html | 103 +++ files/ja/web/api/window/blur/index.html | 23 + files/ja/web/api/window/blur_event/index.html | 126 ++++ .../web/api/window/cancelanimationframe/index.html | 122 ++++ files/ja/web/api/window/captureevents/index.html | 53 ++ files/ja/web/api/window/close/index.html | 76 +++ files/ja/web/api/window/closed/index.html | 57 ++ files/ja/web/api/window/confirm/index.html | 69 ++ files/ja/web/api/window/console/index.html | 48 ++ files/ja/web/api/window/content/index.html | 33 + files/ja/web/api/window/controllers/index.html | 42 ++ files/ja/web/api/window/copy_event/index.html | 77 +++ files/ja/web/api/window/crypto/index.html | 74 +++ files/ja/web/api/window/customelements/index.html | 73 +++ files/ja/web/api/window/cut_event/index.html | 77 +++ files/ja/web/api/window/defaultstatus/index.html | 38 ++ .../web/api/window/devicemotion_event/index.html | 78 +++ .../api/window/deviceorientation_event/index.html | 86 +++ .../ja/web/api/window/devicepixelratio/index.html | 191 ++++++ files/ja/web/api/window/dialogarguments/index.html | 19 + files/ja/web/api/window/directories/index.html | 33 + files/ja/web/api/window/document/index.html | 49 ++ .../api/window/domcontentloaded_event/index.html | 78 +++ files/ja/web/api/window/dump/index.html | 54 ++ files/ja/web/api/window/error_event/index.html | 140 ++++ files/ja/web/api/window/escape/index.html | 33 + files/ja/web/api/window/event/index.html | 50 ++ files/ja/web/api/window/find/index.html | 80 +++ files/ja/web/api/window/focus/index.html | 24 + files/ja/web/api/window/focus_event/index.html | 124 ++++ files/ja/web/api/window/forward/index.html | 56 ++ files/ja/web/api/window/frameelement/index.html | 112 ++++ files/ja/web/api/window/frames/index.html | 69 ++ files/ja/web/api/window/fullscreen/index.html | 58 ++ .../api/window/gamepadconnected_event/index.html | 85 +++ .../window/gamepaddisconnected_event/index.html | 74 +++ files/ja/web/api/window/getattention/index.html | 25 + .../ja/web/api/window/getcomputedstyle/index.html | 157 +++++ files/ja/web/api/window/getselection/index.html | 101 +++ .../ja/web/api/window/hashchange_event/index.html | 86 +++ files/ja/web/api/window/history/index.html | 65 ++ files/ja/web/api/window/home/index.html | 46 ++ files/ja/web/api/window/index.html | 707 +++++++++++++++++++++ files/ja/web/api/window/innerheight/index.html | 99 +++ files/ja/web/api/window/innerwidth/index.html | 83 +++ files/ja/web/api/window/issecurecontext/index.html | 126 ++++ .../web/api/window/languagechange_event/index.html | 82 +++ files/ja/web/api/window/length/index.html | 54 ++ files/ja/web/api/window/load_event/index.html | 162 +++++ files/ja/web/api/window/localstorage/index.html | 148 +++++ files/ja/web/api/window/location/index.html | 212 ++++++ files/ja/web/api/window/locationbar/index.html | 76 +++ files/ja/web/api/window/matchmedia/index.html | 68 ++ files/ja/web/api/window/menubar/index.html | 72 +++ .../web/api/window/messageerror_event/index.html | 80 +++ files/ja/web/api/window/moveby/index.html | 55 ++ files/ja/web/api/window/moveto/index.html | 50 ++ files/ja/web/api/window/mozinnerscreenx/index.html | 31 + files/ja/web/api/window/mozinnerscreeny/index.html | 31 + files/ja/web/api/window/mozpaintcount/index.html | 36 ++ files/ja/web/api/window/name/index.html | 56 ++ files/ja/web/api/window/navigator/index.html | 116 ++++ files/ja/web/api/window/onafterprint/index.html | 55 ++ files/ja/web/api/window/onclick/index.html | 44 ++ files/ja/web/api/window/ondevicelight/index.html | 57 ++ files/ja/web/api/window/ondevicemotion/index.html | 61 ++ .../ja/web/api/window/ondeviceproximity/index.html | 101 +++ .../web/api/window/ongamepadconnected/index.html | 65 ++ .../api/window/ongamepaddisconnected/index.html | 60 ++ files/ja/web/api/window/oninstall/index.html | 57 ++ files/ja/web/api/window/onmousedown/index.html | 47 ++ files/ja/web/api/window/onmouseup/index.html | 56 ++ files/ja/web/api/window/onreset/index.html | 57 ++ files/ja/web/api/window/onresize/index.html | 78 +++ files/ja/web/api/window/open/index.html | 540 ++++++++++++++++ .../api/window/orientationchange_event/index.html | 75 +++ files/ja/web/api/window/outerheight/index.html | 62 ++ files/ja/web/api/window/outerwidth/index.html | 53 ++ files/ja/web/api/window/pagehide_event/index.html | 96 +++ files/ja/web/api/window/pageshow_event/index.html | 132 ++++ files/ja/web/api/window/parent/index.html | 44 ++ files/ja/web/api/window/paste_event/index.html | 76 +++ files/ja/web/api/window/performance/index.html | 39 ++ files/ja/web/api/window/personalbar/index.html | 77 +++ files/ja/web/api/window/pkcs11/index.html | 29 + files/ja/web/api/window/postmessage/index.html | 191 ++++++ files/ja/web/api/window/print/index.html | 24 + files/ja/web/api/window/prompt/index.html | 61 ++ .../api/window/rejectionhandled_event/index.html | 86 +++ files/ja/web/api/window/releaseevents/index.html | 42 ++ .../api/window/requestanimationframe/index.html | 112 ++++ .../web/api/window/requestidlecallback/index.html | 74 +++ files/ja/web/api/window/resizeby/index.html | 38 ++ files/ja/web/api/window/resizeto/index.html | 42 ++ files/ja/web/api/window/restore/index.html | 10 + files/ja/web/api/window/screen/index.html | 52 ++ files/ja/web/api/window/screenx/index.html | 29 + files/ja/web/api/window/screeny/index.html | 29 + files/ja/web/api/window/scroll/index.html | 82 +++ files/ja/web/api/window/scrollbars/index.html | 70 ++ files/ja/web/api/window/scrollby/index.html | 66 ++ files/ja/web/api/window/scrollbylines/index.html | 38 ++ files/ja/web/api/window/scrollbypages/index.html | 38 ++ files/ja/web/api/window/scrollmaxx/index.html | 37 ++ files/ja/web/api/window/scrollmaxy/index.html | 38 ++ files/ja/web/api/window/scrollto/index.html | 77 +++ files/ja/web/api/window/scrollx/index.html | 157 +++++ files/ja/web/api/window/scrolly/index.html | 87 +++ files/ja/web/api/window/self/index.html | 123 ++++ files/ja/web/api/window/sessionstorage/index.html | 154 +++++ files/ja/web/api/window/setcursor/index.html | 23 + files/ja/web/api/window/showmodaldialog/index.html | 99 +++ files/ja/web/api/window/sidebar/index.html | 46 ++ files/ja/web/api/window/sizetocontent/index.html | 24 + files/ja/web/api/window/speechsynthesis/index.html | 102 +++ files/ja/web/api/window/status/index.html | 23 + files/ja/web/api/window/statusbar/index.html | 80 +++ files/ja/web/api/window/storage_event/index.html | 82 +++ files/ja/web/api/window/toolbar/index.html | 74 +++ files/ja/web/api/window/top/index.html | 54 ++ .../api/window/transitioncancel_event/index.html | 94 +++ .../web/api/window/transitionend_event/index.html | 92 +++ .../web/api/window/transitionrun_event/index.html | 90 +++ .../api/window/transitionstart_event/index.html | 91 +++ files/ja/web/api/window/unescape/index.html | 33 + .../api/window/unhandledrejection_event/index.html | 125 ++++ files/ja/web/api/window/unload_event/index.html | 121 ++++ files/ja/web/api/window/updatecommands/index.html | 26 + files/ja/web/api/window/url/index.html | 100 +++ files/ja/web/api/window/visualviewport/index.html | 39 ++ .../api/window/vrdisplayconnect_event/index.html | 69 ++ .../window/vrdisplaydisconnect_event/index.html | 77 +++ .../web/api/window/vrdisplayfocus_event/index.html | 83 +++ .../window/vrdisplaypresentchange_event/index.html | 69 ++ files/ja/web/api/window/window/index.html | 78 +++ 146 files changed, 11711 insertions(+) create mode 100644 files/ja/web/api/window/afterprint_event/index.html create mode 100644 files/ja/web/api/window/alert/index.html create mode 100644 files/ja/web/api/window/animationcancel_event/index.html create mode 100644 files/ja/web/api/window/animationend_event/index.html create mode 100644 files/ja/web/api/window/animationiteration_event/index.html create mode 100644 files/ja/web/api/window/animationstart_event/index.html create mode 100644 files/ja/web/api/window/appinstalled_event/index.html create mode 100644 files/ja/web/api/window/applicationcache/index.html create mode 100644 files/ja/web/api/window/arguments/index.html create mode 100644 files/ja/web/api/window/back/index.html create mode 100644 files/ja/web/api/window/beforeprint_event/index.html create mode 100644 files/ja/web/api/window/beforeunload_event/index.html create mode 100644 files/ja/web/api/window/blur/index.html create mode 100644 files/ja/web/api/window/blur_event/index.html create mode 100644 files/ja/web/api/window/cancelanimationframe/index.html create mode 100644 files/ja/web/api/window/captureevents/index.html create mode 100644 files/ja/web/api/window/close/index.html create mode 100644 files/ja/web/api/window/closed/index.html create mode 100644 files/ja/web/api/window/confirm/index.html create mode 100644 files/ja/web/api/window/console/index.html create mode 100644 files/ja/web/api/window/content/index.html create mode 100644 files/ja/web/api/window/controllers/index.html create mode 100644 files/ja/web/api/window/copy_event/index.html create mode 100644 files/ja/web/api/window/crypto/index.html create mode 100644 files/ja/web/api/window/customelements/index.html create mode 100644 files/ja/web/api/window/cut_event/index.html create mode 100644 files/ja/web/api/window/defaultstatus/index.html create mode 100644 files/ja/web/api/window/devicemotion_event/index.html create mode 100644 files/ja/web/api/window/deviceorientation_event/index.html create mode 100644 files/ja/web/api/window/devicepixelratio/index.html create mode 100644 files/ja/web/api/window/dialogarguments/index.html create mode 100644 files/ja/web/api/window/directories/index.html create mode 100644 files/ja/web/api/window/document/index.html create mode 100644 files/ja/web/api/window/domcontentloaded_event/index.html create mode 100644 files/ja/web/api/window/dump/index.html create mode 100644 files/ja/web/api/window/error_event/index.html create mode 100644 files/ja/web/api/window/escape/index.html create mode 100644 files/ja/web/api/window/event/index.html create mode 100644 files/ja/web/api/window/find/index.html create mode 100644 files/ja/web/api/window/focus/index.html create mode 100644 files/ja/web/api/window/focus_event/index.html create mode 100644 files/ja/web/api/window/forward/index.html create mode 100644 files/ja/web/api/window/frameelement/index.html create mode 100644 files/ja/web/api/window/frames/index.html create mode 100644 files/ja/web/api/window/fullscreen/index.html create mode 100644 files/ja/web/api/window/gamepadconnected_event/index.html create mode 100644 files/ja/web/api/window/gamepaddisconnected_event/index.html create mode 100644 files/ja/web/api/window/getattention/index.html create mode 100644 files/ja/web/api/window/getcomputedstyle/index.html create mode 100644 files/ja/web/api/window/getselection/index.html create mode 100644 files/ja/web/api/window/hashchange_event/index.html create mode 100644 files/ja/web/api/window/history/index.html create mode 100644 files/ja/web/api/window/home/index.html create mode 100644 files/ja/web/api/window/index.html create mode 100644 files/ja/web/api/window/innerheight/index.html create mode 100644 files/ja/web/api/window/innerwidth/index.html create mode 100644 files/ja/web/api/window/issecurecontext/index.html create mode 100644 files/ja/web/api/window/languagechange_event/index.html create mode 100644 files/ja/web/api/window/length/index.html create mode 100644 files/ja/web/api/window/load_event/index.html create mode 100644 files/ja/web/api/window/localstorage/index.html create mode 100644 files/ja/web/api/window/location/index.html create mode 100644 files/ja/web/api/window/locationbar/index.html create mode 100644 files/ja/web/api/window/matchmedia/index.html create mode 100644 files/ja/web/api/window/menubar/index.html create mode 100644 files/ja/web/api/window/messageerror_event/index.html create mode 100644 files/ja/web/api/window/moveby/index.html create mode 100644 files/ja/web/api/window/moveto/index.html create mode 100644 files/ja/web/api/window/mozinnerscreenx/index.html create mode 100644 files/ja/web/api/window/mozinnerscreeny/index.html create mode 100644 files/ja/web/api/window/mozpaintcount/index.html create mode 100644 files/ja/web/api/window/name/index.html create mode 100644 files/ja/web/api/window/navigator/index.html create mode 100644 files/ja/web/api/window/onafterprint/index.html create mode 100644 files/ja/web/api/window/onclick/index.html create mode 100644 files/ja/web/api/window/ondevicelight/index.html create mode 100644 files/ja/web/api/window/ondevicemotion/index.html create mode 100644 files/ja/web/api/window/ondeviceproximity/index.html create mode 100644 files/ja/web/api/window/ongamepadconnected/index.html create mode 100644 files/ja/web/api/window/ongamepaddisconnected/index.html create mode 100644 files/ja/web/api/window/oninstall/index.html create mode 100644 files/ja/web/api/window/onmousedown/index.html create mode 100644 files/ja/web/api/window/onmouseup/index.html create mode 100644 files/ja/web/api/window/onreset/index.html create mode 100644 files/ja/web/api/window/onresize/index.html create mode 100644 files/ja/web/api/window/open/index.html create mode 100644 files/ja/web/api/window/orientationchange_event/index.html create mode 100644 files/ja/web/api/window/outerheight/index.html create mode 100644 files/ja/web/api/window/outerwidth/index.html create mode 100644 files/ja/web/api/window/pagehide_event/index.html create mode 100644 files/ja/web/api/window/pageshow_event/index.html create mode 100644 files/ja/web/api/window/parent/index.html create mode 100644 files/ja/web/api/window/paste_event/index.html create mode 100644 files/ja/web/api/window/performance/index.html create mode 100644 files/ja/web/api/window/personalbar/index.html create mode 100644 files/ja/web/api/window/pkcs11/index.html create mode 100644 files/ja/web/api/window/postmessage/index.html create mode 100644 files/ja/web/api/window/print/index.html create mode 100644 files/ja/web/api/window/prompt/index.html create mode 100644 files/ja/web/api/window/rejectionhandled_event/index.html create mode 100644 files/ja/web/api/window/releaseevents/index.html create mode 100644 files/ja/web/api/window/requestanimationframe/index.html create mode 100644 files/ja/web/api/window/requestidlecallback/index.html create mode 100644 files/ja/web/api/window/resizeby/index.html create mode 100644 files/ja/web/api/window/resizeto/index.html create mode 100644 files/ja/web/api/window/restore/index.html create mode 100644 files/ja/web/api/window/screen/index.html create mode 100644 files/ja/web/api/window/screenx/index.html create mode 100644 files/ja/web/api/window/screeny/index.html create mode 100644 files/ja/web/api/window/scroll/index.html create mode 100644 files/ja/web/api/window/scrollbars/index.html create mode 100644 files/ja/web/api/window/scrollby/index.html create mode 100644 files/ja/web/api/window/scrollbylines/index.html create mode 100644 files/ja/web/api/window/scrollbypages/index.html create mode 100644 files/ja/web/api/window/scrollmaxx/index.html create mode 100644 files/ja/web/api/window/scrollmaxy/index.html create mode 100644 files/ja/web/api/window/scrollto/index.html create mode 100644 files/ja/web/api/window/scrollx/index.html create mode 100644 files/ja/web/api/window/scrolly/index.html create mode 100644 files/ja/web/api/window/self/index.html create mode 100644 files/ja/web/api/window/sessionstorage/index.html create mode 100644 files/ja/web/api/window/setcursor/index.html create mode 100644 files/ja/web/api/window/showmodaldialog/index.html create mode 100644 files/ja/web/api/window/sidebar/index.html create mode 100644 files/ja/web/api/window/sizetocontent/index.html create mode 100644 files/ja/web/api/window/speechsynthesis/index.html create mode 100644 files/ja/web/api/window/status/index.html create mode 100644 files/ja/web/api/window/statusbar/index.html create mode 100644 files/ja/web/api/window/storage_event/index.html create mode 100644 files/ja/web/api/window/toolbar/index.html create mode 100644 files/ja/web/api/window/top/index.html create mode 100644 files/ja/web/api/window/transitioncancel_event/index.html create mode 100644 files/ja/web/api/window/transitionend_event/index.html create mode 100644 files/ja/web/api/window/transitionrun_event/index.html create mode 100644 files/ja/web/api/window/transitionstart_event/index.html create mode 100644 files/ja/web/api/window/unescape/index.html create mode 100644 files/ja/web/api/window/unhandledrejection_event/index.html create mode 100644 files/ja/web/api/window/unload_event/index.html create mode 100644 files/ja/web/api/window/updatecommands/index.html create mode 100644 files/ja/web/api/window/url/index.html create mode 100644 files/ja/web/api/window/visualviewport/index.html create mode 100644 files/ja/web/api/window/vrdisplayconnect_event/index.html create mode 100644 files/ja/web/api/window/vrdisplaydisconnect_event/index.html create mode 100644 files/ja/web/api/window/vrdisplayfocus_event/index.html create mode 100644 files/ja/web/api/window/vrdisplaypresentchange_event/index.html create mode 100644 files/ja/web/api/window/window/index.html (limited to 'files/ja/web/api/window') diff --git a/files/ja/web/api/window/afterprint_event/index.html b/files/ja/web/api/window/afterprint_event/index.html new file mode 100644 index 0000000000..fae7e4e434 --- /dev/null +++ b/files/ja/web/api/window/afterprint_event/index.html @@ -0,0 +1,78 @@ +--- +title: 'Window: afterprint イベント' +slug: Web/API/Window/afterprint_event +tags: + - Event + - Reference + - イベント +translation_of: Web/API/Window/afterprint_event +--- +
{{APIRef}}
+ +

afterprint イベントは、関連する文書の印刷が開始されたか、印刷プレビューが閉じた後に発生します。

+ + + + + + + + + + + + + + + + + + + + +
バブリングいいえ
キャンセル不可
インターフェイス{{domxref("Event")}}
イベントハンドラープロパティ{{domxref("WindowEventHandlers/onafterprint", "onafterprint")}}
+ +

例

+ +

addEventListener() の使用例:

+ +
window.addEventListener('afterprint', (event) => {
+  console.log('After print');
+});
+ +

onafterprint イベントハンドラープロパティの使用例:

+ +
window.onafterprint = (event) => {
+  console.log('After print');
+};
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態
{{SpecName('HTML WHATWG', '#event-afterprint')}}{{Spec2('HTML WHATWG')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.afterprint_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/alert/index.html b/files/ja/web/api/window/alert/index.html new file mode 100644 index 0000000000..d9b54c9c44 --- /dev/null +++ b/files/ja/web/api/window/alert/index.html @@ -0,0 +1,70 @@ +--- +title: window.alert +slug: Web/API/Window/alert +tags: + - API + - DOM + - Gecko + - Method + - Reference + - Window + - alert +translation_of: Web/API/Window/alert +--- +
{{ApiRef}}
+ +

Window.alert() メソッドは、オプションの指定されたコンテンツと OK ボタンを持つ警告ダイアログを表示します。

+ +

構文

+ +
window.alert(message);
+ + + +

例

+ +
window.alert("Hello world!");
+
+ +

以下のように表示されます。

+ +

Image:AlertHelloWorld.png

+ +

注記

+ +

警告ダイアログは、メッセージの確認応答以外の、ユーザ側で応答を必要としないメッセージのために使われるべきです。

+ +

ダイアログボックスはモーダルウィンドウです。つまりユーザーは、これを閉じないとプログラムの他のインターフェイス部分にアクセスする事ができません。ですから、ダイアログボックス (もしくは、モーダルウィンドウ) を生成する関数を過度に使用すべきではありません。

+ +

Mozilla Chrome ユーザー (Firefox 拡張など) は、nsIPromptService メソッドを代わりに使うべきです。

+ +

{{CompatChrome(46.0)}} 以降、このメソッドは、sandbox 属性の値が allow-modal でない限り、{{htmlelement("iframe")}} 内でブロックされます。

+ +

{{gecko_minversion_inline("23.0")}} この引数は、仕様により必要に応じてオプションになりました。

+ +

仕様

+ + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('HTML WHATWG', 'timers-and-user-prompts.html#dom-alert', 'alert()')}}{{Spec2('HTML WHATWG')}} 
+ +

関連情報

+ + diff --git a/files/ja/web/api/window/animationcancel_event/index.html b/files/ja/web/api/window/animationcancel_event/index.html new file mode 100644 index 0000000000..f0a218fbe5 --- /dev/null +++ b/files/ja/web/api/window/animationcancel_event/index.html @@ -0,0 +1,92 @@ +--- +title: 'Window: animationcancel イベント' +slug: Web/API/Window/animationcancel_event +tags: + - API + - Animation + - CSS Animations + - CSS アニメーション + - Event + - Reference + - Window + - イベント +translation_of: Web/API/Window/animationcancel_event +--- +
{{APIRef}}{{SeeCompatTable}}
+ +

animationcancel イベントは、 CSS アニメーションが予期せず中断されたときに発生します。言い換えれば、 {{domxref("Window/animationend_event", "animationend")}} イベントを送出せずに実行が停止するときはいつでもです。これは {{cssxref("animation-name")}} が変更されてアニメーションが削除されたり、動いているノードが CSS を使用して非表示にされた場合などに起こることがあります。したがって、直接または原因として、その包含ノードのいずれかが隠されています。

+ + + + + + + + + + + + + + + + + + + + +
バブリングあり
キャンセル不可
インターフェイス{{domxref("AnimationEvent")}}
イベントハンドラープロパティ{{domxref("GlobalEventHandlers/onanimationcancel","onanimationcancel")}}
+ +

このイベントの本来の対象は、トランジションが適用された {{domxref("Element")}} です。このイベントを {{domxref("Window")}} インターフェイス上で待ち受けし、キャプチャやバブリングの局面で処理することができます。このイベントについて完全な詳細は、 HTMLElement: animationcancel イベントを参照してください。

+ +

例

+ +

このコードはリスナーに animationcancel イベントを追加します。

+ +
window.addEventListener('animationcancel', () => {
+  console.log('アニメーションが取り消されました');
+});
+ +

同様に、 {{domxref("GlobalEventHandlers/onanimationcancel", "onanimationcancel")}} プロパティを addEventListener() の代わりに使用するとこうなります。

+ +
document.onanimationcancel = () => {
+  console.log('アニメーションが取り消されました');
+};
+ +

このイベントのライブデモを参照してください。

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("CSS3 Animations", "#eventdef-animationevent-animationcancel")}}{{Spec2("CSS3 Animations")}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.animationcancel_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/animationend_event/index.html b/files/ja/web/api/window/animationend_event/index.html new file mode 100644 index 0000000000..01f5153dcc --- /dev/null +++ b/files/ja/web/api/window/animationend_event/index.html @@ -0,0 +1,92 @@ +--- +title: 'Window: animationend event' +slug: Web/API/Window/animationend_event +tags: + - API + - Animation + - CSS Animations + - CSS アニメーション + - Event + - Reference + - Window + - イベント +translation_of: Web/API/Window/animationend_event +--- +
{{APIRef}}
+ +

animationend イベントは、 CSS アニメーションが完了したときに発生します。アニメーションが完了前に中止された場合、例えば要素が DOM から削除されたりアニメーションがヨウ素から削除されたりした場合、 animationend イベントは発生しません。

+ + + + + + + + + + + + + + + + + + + + +
バブリングあり
キャンセル不可
インターフェイス{{domxref("AnimationEvent")}}
イベントハンドラープロパティ{{domxref("GlobalEventHandlers/onanimationend","onanimationend")}}
+ +

このイベントの本来の対象は、トランジションが適用された {{domxref("Element")}} です。このイベントを {{domxref("Window")}} インターフェイス上で待ち受けし、キャプチャやバブリングの局面で処理することができます。このイベントについて完全な詳細は、 HTMLElement: animationend イベントを参照してください。

+ +

例

+ +

この例は animationend イベントを待ち受けます。

+ +
window.addEventListener('animationend', () => {
+  console.log('アニメーション終了');
+});
+ +

同様に、 onanimationend イベントハンドラープロパティを使用するとこうなります。

+ +
window.onanimationend = () => {
+  console.log('アニメーション終了');
+};
+ +

このイベントのライブデモを参照してください。

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("CSS3 Animations", "#eventdef-animationevent-animationend")}}{{Spec2("CSS3 Animations")}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.animationend_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/animationiteration_event/index.html b/files/ja/web/api/window/animationiteration_event/index.html new file mode 100644 index 0000000000..b49bcb73da --- /dev/null +++ b/files/ja/web/api/window/animationiteration_event/index.html @@ -0,0 +1,98 @@ +--- +title: 'Window: animationiteration event' +slug: Web/API/Window/animationiteration_event +tags: + - API + - Animation + - CSS Animations + - CSS アニメーション + - Event + - Reference + - Window + - イベント +translation_of: Web/API/Window/animationiteration_event +--- +
{{APIRef}}
+ +

animationiteration イベントは、 CSS アニメーションの反復が1回分終了し、次の回が始まったときに発生します。このイベントは {{domxref("Window/animationend_event", "animationend")}} イベントと同時には発生せず、従って animation-iteration-count が1のアニメーションでは発生しません。

+ + + + + + + + + + + + + + + + + + + + +
バブリングあり
キャンセル不可
インターフェイス{{domxref("AnimationEvent")}}
イベントハンドラープロパティ{{domxref("GlobalEventHandlers/onanimationiteration","onanimationiteration")}}
+ +

このイベントの本来の対象は、トランジションが適用された {{domxref("Element")}} です。このイベントを {{domxref("Window")}} インターフェイス上で待ち受けし、キャプチャやバブリングの局面で処理することができます。このイベントについて完全な詳細は、 HTMLElement: animationiteration イベントを参照してください。

+ +

例

+ +

このコードは animationiteration を使用して、アニメーションの反復が終了した回数を追跡します。

+ +
let iterationCount = 0;
+
+window.addEventListener('animationiteration', () => {
+  iterationCount++;
+  console.log(`アニメーション反復回数: ${iterationCount}`);
+});
+ +

同様に、 onanimationiteration イベントハンドラープロパティを使用するとこうなります。

+ +
let iterationCount = 0;
+
+window.onanimationiteration = () => {
+  iterationCount++;
+  console.log(`アニメーション反復回数: ${iterationCount}`);
+};
+ +

このイベントのライブデモを参照してください。

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("CSS3 Animations", "#eventdef-animationevent-animationiteration")}}{{Spec2("CSS3 Animations")}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.animationiteration_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/animationstart_event/index.html b/files/ja/web/api/window/animationstart_event/index.html new file mode 100644 index 0000000000..49e106249b --- /dev/null +++ b/files/ja/web/api/window/animationstart_event/index.html @@ -0,0 +1,94 @@ +--- +title: 'Window: animationstart イベント' +slug: Web/API/Window/animationstart_event +tags: + - API + - Animation + - CSS animation + - CSS アニメーション + - Reference + - Web + - Window + - イベント +translation_of: Web/API/Window/animationstart_event +--- +
{{APIRef}}
+ +

animationstart イベントは、 CSS アニメーションが開始したときに発生します。 {{cssxref("animation-delay")}} がある場合、このイベントは待ち時間が経過したときに一度発生します。待ち時間が負の数の場合、イベントは {{domxref("AnimationEvent/elapsedTime", "elapsedTime")}} が待ち時間の絶対値と等しくなったときに発生します (および、関連して、アニメーションはシーケンスの中でそのタイムインデックスに再生が始まります)。

+ + + + + + + + + + + + + + + + + + + + +
バブリングあり
キャンセル不可
インターフェイス{{domxref("AnimationEvent")}}
イベントハンドラープロパティ{{domxref("GlobalEventHandlers/onanimationstart","onanimationstart")}}
+ +

このイベントの本来の対象は、トランジションが適用された {{domxref("Element")}} です。このイベントを {{domxref("Window")}} インターフェイス上で待ち受けし、キャプチャやバブリングの局面で処理することができます。このイベントについて完全な詳細は、 HTMLElement: animationstart イベントを参照してください。

+ +

例

+ +

このコードは animationstart イベントを待ち受けし、イベント発生時にメッセージを記録します。

+ +
window.addEventListener('animationstart', () => {
+  console.log('Animation started');
+});
+
+ +

同様に、 onanimationstart を使用するとこうなります。

+ +
window.onanimationstart = () => {
+  console.log('Animation started');
+};
+
+ +

このイベントのライブデモを参照してください。

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("CSS3 Animations", "#eventdef-animationevent-animationstart")}}{{Spec2("CSS3 Animations")}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.animationstart_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/appinstalled_event/index.html b/files/ja/web/api/window/appinstalled_event/index.html new file mode 100644 index 0000000000..3a47b5c67e --- /dev/null +++ b/files/ja/web/api/window/appinstalled_event/index.html @@ -0,0 +1,85 @@ +--- +title: 'Window: appinstalled イベント' +slug: Web/API/Window/appinstalled_event +tags: + - API + - Event + - Manifest + - Reference + - Web + - appinstalled + - events + - web manifest + - ウェブマニフェスト + - マニフェスト +translation_of: Web/API/Window/appinstalled_event +--- +
{{APIRef}}
+ +
+

appinstalled は Web Manifest API のイベントで、ブラウザーがあるページをアプリケーションとして成功裏にインストールしたとき発行されます。

+
+ + + + + + + + + + + + + + + + + + + + +
バブリングなし
キャンセル不可
インターフェイス{{domxref("Event")}}
イベントハンドラー{{domxref("Window/onappinstalled", "onappinstalled")}}
+ +

例

+ +

appinstalled イベントは {{domxref("EventTarget/addEventListener", "addEventListener")}} メソッドで使用することができます。

+ +
window.addEventListener('appinstalled', function() {
+  console.log('アプリをインストールしてくれてありがとう！');
+});
+ +

または {{domxref("Window/onappinstalled", "onappinstalled")}} イベントハンドラープロパティを使用してください。

+ +
window.onappinstalled = function() {
+  console.log('アプリをインストールしてくれてありがとう！');
+};
+ +

仕様書

+ + + + + + + + + + + + +
仕様書状態
{{SpecName('Manifest', '#dfn-appinstalled', 'appinstalled')}}{{Spec2('Manifest')}}
+ +

ブラウザーの対応

+ + + +

{{Compat("api.Window.onappinstalled")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/applicationcache/index.html b/files/ja/web/api/window/applicationcache/index.html new file mode 100644 index 0000000000..1acc4a641f --- /dev/null +++ b/files/ja/web/api/window/applicationcache/index.html @@ -0,0 +1,44 @@ +--- +title: window.applicationCache +slug: Web/API/Window/applicationCache +tags: + - API + - Deprecated + - HTML DOM + - Property + - Reference + - Window +translation_of: Web/API/Window/applicationCache +--- +
+

重要: アプリケーションキャッシュは Firefox 44 で非推奨となり、 Firefox 60 以降では安全ではないコンテキストでは利用できなくなりました ({{bug(1354175)}}、現在は Nightly/Beta のみ)。ウェブサイトをオフラインで利用するために使用しないでください。 — 代わりにサービスワーカーの利用を検討してください。

+
+ +

{{APIRef}}

+ +

概要

+ +

ウィンドウのアプリケーションキャッシュオブジェクトへの参照を返します。

+ +

構文

+ +
cache = window.applicationCache
+
+ +

引数

+ + + +

仕様書

+ + + +

関連情報

+ + diff --git a/files/ja/web/api/window/arguments/index.html b/files/ja/web/api/window/arguments/index.html new file mode 100644 index 0000000000..d964eb9cc1 --- /dev/null +++ b/files/ja/web/api/window/arguments/index.html @@ -0,0 +1,6 @@ +--- +title: window.arguments +slug: Web/API/Window/arguments +translation_of: Working_with_windows_in_chrome_code#Passing_data_between_windows +--- +

『chrome コードでウィンドウを取り扱う』の頁の『ウィンドウ間でのデータのやり取り』の章をご覧下さい。

diff --git a/files/ja/web/api/window/back/index.html b/files/ja/web/api/window/back/index.html new file mode 100644 index 0000000000..d4fa1c7947 --- /dev/null +++ b/files/ja/web/api/window/back/index.html @@ -0,0 +1,57 @@ +--- +title: window.back +slug: Web/API/Window/back +tags: + - API + - DOM + - Firefox + - Gecko + - Method + - Non-standard + - Obsolete + - Window + - back +translation_of: Web/API/Window/back +--- +
{{ApiRef}}{{Non-standard_header}}{{obsolete_header}}
+ +

概要

+ +

{{domxref("Window")}} インターフェイスの廃止済みで非標準の back() メソッドは、履歴で前のアイテムの window を返します。これは Firefox 固有のメソッドであり、Firefox 31 で削除しました。代わりに、標準の {{domxref("History.back", "history.back()")}} メソッドを使用してください。

+ +

構文

+ +
window.back();
+ +

引数

+ +

ありません。

+ +

戻り値

+ +

undefined です。

+ +

例

+ +

この例は、back() を呼び出して "戻る" ボタンのクリックを制御します。

+ +
function handleMyBackButton() {
+  if (canGoBack) {
+    window.back();
+  }
+}
+ +

仕様

+ +

どの仕様にも属していません。

+ +

ブラウザー実装状況

+ +

この非標準メソッドは Firefox だけが実装しており、Firefox 31 で削除しました。

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/beforeprint_event/index.html b/files/ja/web/api/window/beforeprint_event/index.html new file mode 100644 index 0000000000..eb17e08e4f --- /dev/null +++ b/files/ja/web/api/window/beforeprint_event/index.html @@ -0,0 +1,75 @@ +--- +title: 'Window: beforeprint イベント' +slug: Web/API/Window/beforeprint_event +tags: + - Event + - Reference +translation_of: Web/API/Window/beforeprint_event +--- +
{{APIRef}}
+ +

beforeprint イベントは、関連する文書が印刷される直前や、印刷プレビューが開く直前に発生します。

+ + + + + + + + + + + + + + + + + + + + +
バブリングいいえ
キャンセル不可
インターフェイス{{domxref("Event")}}
イベントハンドラープロパティ{{domxref("WindowEventHandlers/onbeforeprint", "onbeforeprint")}}
+ +

例

+ +

addEventListener() の使用例:

+ +
window.addEventListener('beforeprint', (event) => {
+  console.log('Before print');
+});
+ +

onbeforeprint イベントハンドラープロパティの使用例:

+ +
window.onbeforeprint = (event) => {
+  console.log('Before print');
+};
+ +

仕様書

+ + + + + + + + + + + + + + +
仕様書状態
{{SpecName('HTML WHATWG', '#event-beforeprint')}}{{Spec2('HTML WHATWG')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.beforeprint_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/beforeunload_event/index.html b/files/ja/web/api/window/beforeunload_event/index.html new file mode 100644 index 0000000000..1a06ceb59e --- /dev/null +++ b/files/ja/web/api/window/beforeunload_event/index.html @@ -0,0 +1,103 @@ +--- +title: 'Window: beforeunload イベント' +slug: Web/API/Window/beforeunload_event +tags: + - Event + - Reference + - Window + - イベント +translation_of: Web/API/Window/beforeunload_event +--- +
{{APIRef}}
+ +

beforeunload イベントは、ウィンドウ、文書、およびそのリソースがアンロードされる直前に発生します。文書はまだ表示されており、この時点ではイベントはキャンセル可能です。

+ + + + + + + + + + + + + + + + + + + + +
バブリングなし
キャンセル可
インターフェイス{{domxref("Event")}}
イベントハンドラー{{domxref("WindowEventHandlers/onbeforeunload", "onbeforeunload")}}
+ +

このイベントによって、ウェブページがダイアログボックスを表示し、ユーザーにページを終了するかどうかの確認が求めることができます。ユーザーが確認すれば、ブラウザーは新しいページへ遷移し、そうでなければ遷移をキャンセルします。

+ +

仕様書によれば、確認ダイアログを表示するためにはイベントハンドラーでイベントの {{domxref("Event.preventDefault()", "preventDefault()")}} を呼び出すことになっています。

+ +

しかし、すべてのブラウザーがこのメソッドに対応しているわけではなく、一部はイベントハンドラーに古い方法二つのうちの一つを実装するよう求めていることに注意してください。

+ + + +

一部のブラウザーでは返された文字列を確認ダイアログで表示するために使用し、イベントハンドラーがユーザーに独自のメッセージを表示できるようにしていました。しかし、これは非推奨であり、すでに多くのブラウザーが対応していません。

+ +

望ましくないポップアップに対処するために、ブラウザーはページが操作されていない限り、 beforeunload のイベントハンドラーで生成したプロンプトを表示しなかったり、全くプロンプトを表示しなかったりする可能性があります。

+ +

イベントハンドラー/リスナーを window またはdocument の beforeunload イベントに割り当てると、ブラウザーはメモリ内のページナビゲーションキャッシュ、例えば Firefox の Back-Forward キャッシュや WebKit のページキャッシュなどを使用することを防ぎます。

+ +

HTML 仕様書は {{domxref("window.alert()")}}, {{domxref("window.confirm()")}}, {{domxref("window.prompt()")}} などのメソッドが、このイベントの実行中には無視されることがあることを示しています。詳しくは、 HTML 仕様書をご覧ください。

+ +

例

+ +

HTML の仕様では、 {{domxref("Event.returnValue")}} を使用する代わりに {{domxref("Event.preventDefault()")}} メソッドを使用する必要があります。ただし、これはすべてのブラウザーで対応しているわけではありません。

+ +
window.addEventListener('beforeunload', (event) => {
+  // Cancel the event as stated by the standard.
+  event.preventDefault();
+  // Chrome requires returnValue to be set.
+  event.returnValue = '';
+});
+
+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("HTML WHATWG", "indices.html#event-beforeunload", "beforeunload")}}{{Spec2("HTML WHATWG")}}
{{SpecName("HTML5 W3C", "browsers.html#unloading-documents", "beforeunload")}}{{Spec2("HTML5 W3C")}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.beforeunload_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/blur/index.html b/files/ja/web/api/window/blur/index.html new file mode 100644 index 0000000000..d2cd6d6362 --- /dev/null +++ b/files/ja/web/api/window/blur/index.html @@ -0,0 +1,23 @@ +--- +title: window.blur +slug: Web/API/Window/blur +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/Window/blur +--- +
+ {{ApiRef}}
+

概要

+

ウィンドウからフォーカスをはずします。

+

構文

+
window.blur()
+

例

+
window.blur();
+

注記

+

window.blur() メソッドは、ユーザが現在のウィンドウからフォーカスをはずす動作と同じです。

+

仕様

+

{{DOM0}}

diff --git a/files/ja/web/api/window/blur_event/index.html b/files/ja/web/api/window/blur_event/index.html new file mode 100644 index 0000000000..cc0be2e055 --- /dev/null +++ b/files/ja/web/api/window/blur_event/index.html @@ -0,0 +1,126 @@ +--- +title: 'Window: blur イベント' +slug: Web/API/Window/blur_event +tags: + - API + - Event + - FocusEvent + - Reference + - Web + - Window + - blur + - onblur + - イベント +translation_of: Web/API/Window/blur_event +--- +
{{APIRef}}
+ +

blur イベントは、要素がフォーカスを失ったときに発生します。

+ +

blur の反対は {{domxref("Window/focus_event", "focus")}} です。

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
バブリングなし
キャンセル不可
インターフェイス{{DOMxRef("FocusEvent")}}
イベントハンドラープロパティ{{domxref("GlobalEventHandlers/onblur", "onblur")}}
同期 / 非同期同期
Composedはい
+ +

例

+ +

ライブデモ

+ +

この例ではフォーカスを失ったときに文書の外見を変更します。 {{domxref("EventTarget.addEventListener()", "addEventListener()")}} を使用して {{domxref("Window/focus_event", "focus")}} および blur イベントを監視します。

+ +

HTML

+ +
<p id="log">Click on this document to give it focus.</p>
+ +

CSS

+ +
.paused {
+  background: #ddd;
+  color: #555;
+}
+ +

JavaScript

+ +
function pause() {
+  document.body.classList.add('paused');
+  log.textContent = 'FOCUS LOST!';
+}
+
+function play() {
+  document.body.classList.remove('paused');
+  log.textContent = 'This document has focus. Click outside the document to lose focus.';
+}
+
+const log = document.getElementById('log');
+
+window.addEventListener('blur', pause);
+window.addEventListener('focus', play);
+ +

結果

+ +

{{EmbedLiveSample("Live_example")}}

+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("UI Events", "#event-type-blur")}}{{Spec2("UI Events")}}Added info that this event is composed.
{{SpecName("DOM3 Events", "#event-type-blur")}}{{Spec2("DOM3 Events")}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.blur_event")}}

+ +

このイベントが処理されている間の {{DOMxRef("Document.activeElement")}} の値はブラウザーによって異なります ({{bug(452307)}})。 IE10 はフォーカスが移動する先の要素を設定しますが、 Firefox および Chrome はふつう、文書の body を設定します。

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/cancelanimationframe/index.html b/files/ja/web/api/window/cancelanimationframe/index.html new file mode 100644 index 0000000000..98bea1681c --- /dev/null +++ b/files/ja/web/api/window/cancelanimationframe/index.html @@ -0,0 +1,122 @@ +--- +title: window.cancelAnimationFrame +slug: Web/API/Window/cancelAnimationFrame +tags: + - API + - DOM + - Method +translation_of: Web/API/Window/cancelAnimationFrame +--- +
{{APIRef}}
+ +

概要

+ +

{{domxref("window.requestAnimationFrame()")}} の呼び出しによりスケジュールされたフレームアニメーションのリクエストをキャンセルします。

+ +

構文

+ +
window.cancelAnimationFrame(requestID);
+
+ +

引数

+ +
+
requestID
+
コールバックがリクエストした {{domxref("window.requestAnimationFrame()")}} の呼び出しにより返された ID 値。
+
+ +

例

+ +
var requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame ||
+                            window.webkitRequestAnimationFrame || window.msRequestAnimationFrame;
+
+var cancelAnimationFrame = window.cancelAnimationFrame || window.mozCancelAnimationFrame;
+
+var start = window.mozAnimationStartTime;  // Firefox のみでサポート。他のブラウザーでは代わりに Date.now() などを使用してください。
+
+var myReq;
+
+function step(timestamp) {
+  var progress = timestamp - start;
+  d.style.left = Math.min(progress / 10, 200) + 'px';
+  if (progress < 2000) {
+    myReq = requestAnimationFrame(step);
+  }
+}
+myReq = requestAnimationFrame(step);
+
+cancelAnimationFrame(myReq);
+
+ +

ブラウザーの実装状況

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + +
機能ChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
基本サポート21.0 {{property_prefix("webkit")}}
+ 24.0		{{CompatVersionUnknown}}{{CompatGeckoDesktop("11.0")}} {{property_prefix("moz")}}
+ 23.0		1015.06.0 {{property_prefix("webkit")}}
+ 6.1
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
機能AndroidChrome for AndroidEdgeFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
基本サポート4.433{{CompatVersionUnknown}}{{CompatGeckoMobile("11.0")}} {{property_prefix("moz")}}
+ 23.0		10337.1
+
+ +

仕様

+ + + +

関連情報

+ + diff --git a/files/ja/web/api/window/captureevents/index.html b/files/ja/web/api/window/captureevents/index.html new file mode 100644 index 0000000000..6a38e6eb62 --- /dev/null +++ b/files/ja/web/api/window/captureevents/index.html @@ -0,0 +1,53 @@ +--- +title: window.captureEvents +slug: Web/API/Window/captureEvents +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - 要更新 +translation_of: Web/API/Window/captureEvents +--- +

 

+

{{ ApiRef() }} {{ 英語版章題("Summary") }}

+

概要

+

{{ Obsolete_header() }} window に指定したタイプの全てのイベントをキャプチャさせるようにします。

+

{{ 英語版章題("Syntax") }}

+

構文

+
window.captureEvents(eventType)
+
+

eventType は、次の値の組み合わせを取ります。: Event.ABORT, Event.BLUR, Event.CLICK, Event.CHANGE, Event.DBLCLICK, Event.DRAGDDROP, Event.ERROR, Event.FOCUS, Event.KEYDOWN, Event.KEYPRESS, Event.KEYUP, Event.LOAD, Event.MOUSEDOWN, Event.MOUSEMOVE, Event.MOUSEOUT, Event.MOUSEOVER, Event.MOUSEUP, Event.MOVE, Event.RESET, Event.RESIZE, Event.SELECT, Event.SUBMIT, Event.UNLOAD.

+

{{ 英語版章題("Example") }}

+

例

+
<html>
+ <script>
+  function reg() {
+   window.captureEvents(Event.CLICK);
+   window.onclick = page_click;
+  }
+
+  function page_click() {
+   alert('ページクリックイベントが検出されました！');
+  }
+ </script>
+
+ <body onload="reg();">
+ <p>このページの任意の場所をクリックしてください。</p>
+ </body>
+</html>
+
+

{{ 英語版章題("Notes") }}

+

注記

+
+

W3C DOM Events メソッドを支持するにあたり、このメソッドは Gecko 1.9 では廃止されました（addEventListener を参照してください）。このメソッドのサポートは Gecko 1.9 で 削除されました。

+
+

（ボタンのクリックや現在のドキュメントからフォーカスを移動させたりするような）ユーザの行動によって DOM 内で発生したイベントは、イベントを発生させたオブジェクトに到達する前に、通常、上方向の window や document オブジェクトを最初に通ります。

+

window 上で captureEvents() メソッドを呼び出すとき、指定するタイプのイベント（例えば、Event.CLICK）が階層の「より低い」オブジェクトを通ることはありません。通常のようにイベントを「バブルアップさせる」ためには、イベントを補足している window 上で window.releaseEvents() メソッド（{{ Obsolete_inline() }}）を使わなければなりません。

+

注：次の構文を使用することでこのメソッドにイベントのリストを渡すことができます。: window.captureEvents(Event.KEYPRESS | Event.KEYDOWN | Event.KEYUP).

+

{{ 英語版章題("Specification") }}

+

仕様

+

{{ DOM0() }}

+
+  
+

{{ languages( { "en": "en/DOM/window.captureEvents", "pl": "pl/DOM/window.captureEvents" } ) }}

diff --git a/files/ja/web/api/window/close/index.html b/files/ja/web/api/window/close/index.html new file mode 100644 index 0000000000..4a9b02757c --- /dev/null +++ b/files/ja/web/api/window/close/index.html @@ -0,0 +1,76 @@ +--- +title: window.close +slug: Web/API/Window/close +tags: + - API + - DOM + - Gecko + - Method + - Reference + - Window +translation_of: Web/API/Window/close +--- +

{{APIRef}}

+ +

Window.close() メソッドは、現在のウィンドウ、またはそのページ上で呼び出されたウィンドウを閉じます。

+ +

このメソッドが許可されるのは、{{domxref("window.open()")}} メソッドを用いたスクリプトにより開かれたウィンドウに対する呼び出しのみです。ウィンドウがスクリプトにより開かれたものでない場合、次のようなエラーがコンソールに表示されます: スクリプトはスクリプトによって開かれたウィンドウ以外を閉じることができません。

+ +

構文

+ +
window.close();
+ +

例

+ +

window.open() で開かれたウィンドウを閉じる

+ +

この例は、ウィンドウを開くメソッドと、そのウィンドウを閉じるメソッドです。これは、{{domxref("window.open()")}} の呼び出しにより開かれたウィンドウを閉じる Window.close() の使い方を実演します。

+ +
//開いたウィンドウへの参照を保持するグローバル変数
+var openedWindow;
+
+function openWindow() {
+  openedWindow = window.open('moreinfo.htm');
+}
+
+function closeOpenedWindow() {
+  openedWindow.close();
+}
+
+ +

現在のウィンドウを閉じる

+ +

以前は、window インスタンスの close() を呼び出す代わりに window オブジェクトの close() メソッドを直接呼び出した場合、ブラウザは、スクリプトで開いたウィンドウであるかどうかに関わらず、最前面のウィンドウを閉じていました。セキュリティ上の理由により、スクリプトにより開いたものでないウィンドウを閉じることは許可されなくなりました (Firefox 46.0.1: スクリプトは、そのスクリプトが開いたものでないウィンドウを閉じることができません)。

+ +
function closeCurrentWindow() {
+  window.close();
+}
+
+ +

仕様

+ + + + + + + + + + + + + + + + + + + +
仕様書策定状況備考
{{SpecName('HTML WHATWG', '#dom-window-close', 'window.close()')}}{{Spec2('HTML WHATWG')}} 
{{SpecName('HTML5 W3C', "browsers.html#dom-window-close", "Window.close()")}}{{Spec2('HTML5 W3C')}} 
+ +

ブラウザーの実装状況

+ + + +

{{Compat("api.Window.close")}}

diff --git a/files/ja/web/api/window/closed/index.html b/files/ja/web/api/window/closed/index.html new file mode 100644 index 0000000000..78d9140858 --- /dev/null +++ b/files/ja/web/api/window/closed/index.html @@ -0,0 +1,57 @@ +--- +title: window.closed +slug: Web/API/Window/closed +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/Window/closed +--- +
+ {{ApiRef}}
+

概要

+

この読取専用プロパティは、対象ウィンドウが閉じられているかどうかを示します。

+

構文

+
var isClosed = windowRef.closed;
+
+
+
+ isClosed
+
+ 真偽値。次の何れかの値を取り得ます : +
    +
  • true: ウィンドウが閉じられている事を示す
    • +
  • false: ウィンドウが開いている事を示す
    • +
+
+
+

例

+

ポップアップからウィンドウの URL を変化させる

+

次の例は、どのようにポップアップウィンドウでそれを開いたウィンドウの URL を変化させるかというデモです。URL を変化させる前に、 {{domxref("window.opener")}} プロパティを用いて、現在のウィンドウがそのポップアップを開いたウィンドウであるどうか、そして、その開いた側のウィンドウが閉じられていないかをチェックします。:

+
// 開いた側のウィンドウが存在するか、かつ、閉じられていないかを調べます。
+if (window.opener && !window.opener.closed) {
+  window.opener.location.href = "http://www.mozilla.org";
+}
+

ポップアップはそれを開いたウィンドウにしかアクセスできないことに注意してください。

+

以前に開いたポップアップを更新する

+

この例では、関数 refreshPopupWindow() が ポップアップのデータを更新するために ポップアップの location オブジェクト中の reload メソッドを呼び出します。ポップアップがまだ開かれていない場合、または、ユーザがそれを閉じてしまっている場合は、新しいウィンドウが開かれます。

+
var popupWindow = null;
+
+function refreshPopupWindow() {
+  if (popupWindow && !popupWindow.closed) {
+    // popupWindow が開いている場合、それを更新します
+    popupWindow.location.reload(true);
+  } else {
+    // 新しいウィンドウを開きます。
+    popupWindow = window.open("popup.html","dataWindow");
+  }
+}
+
+

仕様

+

DOM Level 0。 window.closed は、W3C の仕様や技術勧告に含まれるものではありません。

+

関連情報

+ diff --git a/files/ja/web/api/window/confirm/index.html b/files/ja/web/api/window/confirm/index.html new file mode 100644 index 0000000000..7cb34167be --- /dev/null +++ b/files/ja/web/api/window/confirm/index.html @@ -0,0 +1,69 @@ +--- +title: window.confirm +slug: Web/API/Window/confirm +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference +translation_of: Web/API/Window/confirm +--- +
{{ApiRef("Window")}}
+ +

Window.confirm() メソッドは、メッセージと、OK, キャンセルの 2 つのボタンを持つモーダルダイアログを表示します。

+ +

構文

+ +
result = window.confirm(message);
+
+ + + +

例

+ +
if (window.confirm("Do you really want to leave?")) {
+  window.open("exit.html", "Thanks for Visiting!");
+}
+
+ +

結果

+ +

firefox confirm
+  

+ +

注記

+ +

The following text is shared between this article, DOM:window.prompt and DOM:window.alert ダイアログボックスはモーダルウィンドウです。つまり閲覧者は、これを閉じないとプログラムの他のインタフェース部分にアクセスする事ができません。したがって、ダイアログボックス（もしくは、モーダルウィンドウ）を生成する関数を乱用するべきではありません。何にせよ、確認を目的としたダイアログボックスの使用を避けるべきそれ相応の理由があります。

+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('HTML WHATWG', 'timers-and-user-prompts.html#dom-confirm', 'confirm()')}}{{Spec2('HTML WHATWG')}}
+ +

Browser compatibility

+ + + +

{{Compat("api.Window.confirm")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/console/index.html b/files/ja/web/api/window/console/index.html new file mode 100644 index 0000000000..4e37459fed --- /dev/null +++ b/files/ja/web/api/window/console/index.html @@ -0,0 +1,48 @@ +--- +title: Window.console +slug: Web/API/Window/console +translation_of: Web/API/Window/console +--- +

{{ APIRef }}

+ +

読み取り専用プロパティのWindow.consoleは、ブラウザのコンソールへ情報を出力するメソッドを提供する{{domxref("Console")}}オブジェクトへの参照を返します。これらのメソッドで出力される情報はデバッグ目的のものであり、ユーザーへ情報を提示するために使われるべきではありません。

+ +

Syntax

+ +
var consoleObj = window.console;
+
+ +

Examples

+ +

Logging to console

+ +

一つ目の例はテキストをコンソールに出力します。

+ +
console.log("An error occurred while loading the content");
+ +

次の例では開閉ウィジェットによって要素が展開可能な状態でオブジェクトをコンソールに出力します。

+ +
console.dir(someObject);
+ +

より詳細な例については{{SectionOnPage("/en-US/docs/Web/API/Console", "Usage")}}をご参照下さい。

+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Console API')}}{{Spec2('Console API')}}Initial definition.
+ +
+

Currently there are many implementation differences among browsers, but work is being done to bring them together and make them more consistent with one another.

+
diff --git a/files/ja/web/api/window/content/index.html b/files/ja/web/api/window/content/index.html new file mode 100644 index 0000000000..ab3098dd36 --- /dev/null +++ b/files/ja/web/api/window/content/index.html @@ -0,0 +1,33 @@ +--- +title: window.content +slug: Web/API/Window/content +tags: + - DOM + - Gecko + - Gecko DOM Reference + - 要更新 +translation_of: Web/API/Window/content +--- +

{{ ApiRef() }} {{ 英語版章題("Summary") }}

+

概要

+

主となるコンテンツウィンドウを表す Window オブジェクトを返します。これは、type="content-primary" 属性を持つ <browser> (もしくは tabbrowser や <iframe>) 要素のある XUL ウィンドウにおいて役立ちます。最も有名な例は、Firefox のメインウィンドウである browser.xul です。このような場合、content はブラウザに現在表示されているドキュメントを表す Window オブジェクトへの参照を返します。これは、browserRef.contentWindow のショートカットです。

+

特権のないコンテンツ (Web ページ) では、content は通常 top と同じです。ただし、Web ページがサイドバーに読み込まれた場合を除きます。このときの content は、現在選択しているタブの Window を参照しています。

+

いくつかの例では、content の代わりに _content を使用しています。しかし、後者は長い間非推奨とされています。ですから、新しいコードでは content を使うべきです。

+

{{ 英語版章題("Syntax") }}

+

構文

+
var windowObject = window.content;
+
+

{{ 英語版章題("Example") }}

+

例

+

以下のコードを <browser type="content-primary"/> 要素を持つ chrome XUL ウィンドウで実行すると、ブラウザで現在表示されているページの最初の div 要素の周囲に赤い枠が描画されます。

+
content.document.getElementsByTagName("div")[0].style.border = "solid red 1px";
+
+

{{ 英語版章題("Specification") }}

+

仕様

+

W3C の仕様の一部ではありません。

+

{{ 英語版章題("See also") }}

+

参照

+ diff --git a/files/ja/web/api/window/controllers/index.html b/files/ja/web/api/window/controllers/index.html new file mode 100644 index 0000000000..1dc286147a --- /dev/null +++ b/files/ja/web/api/window/controllers/index.html @@ -0,0 +1,42 @@ +--- +title: window.controllers +slug: Web/API/Window/controllers +tags: + - DOM + - Gecko + - 要更新 +translation_of: Web/API/Window/controllers +--- +
{{ApiRef}}
+ +

概要

+ +

Returns the XUL controllers of the chrome window.

+ +

構文

+ +
controllers = window.controllers
+
+ + + +

仕様

+ +

XUL-specific. Not part of specification.

+ +
+

By default, a window's controller contains the code that supports the global window commands.

+ +

Chrome code can add controllers (to be used in conjunction with the goDoCommand and goUpdateCommand functions in globalOverlay.js).

+ +

However, the added controllers must be explicitly removed when the window is unloaded, as this is not done automatically.

+ +

Each missing removal can cause

+bug 415775: + +
ASSERTION: XPConnect is being called on a scope without a 'Components' property!
+
+ +

 

diff --git a/files/ja/web/api/window/copy_event/index.html b/files/ja/web/api/window/copy_event/index.html new file mode 100644 index 0000000000..9c31741043 --- /dev/null +++ b/files/ja/web/api/window/copy_event/index.html @@ -0,0 +1,77 @@ +--- +title: 'Window: copy イベント' +slug: Web/API/Window/copy_event +tags: + - API + - Clippboard API + - Event + - Reference + - Web + - Window + - copy + - イベント +translation_of: Web/API/Window/copy_event +--- +
{{APIRef}}
+ +

copy イベントは、ユーザーがブラウザーのユーザーインターフェイスからコピー操作を実行したときに発生します。

+ + + + + + + + + + + + + + + + + + + + +
バブリングあり
キャンセル可
インターフェイス{{domxref("ClipboardEvent")}}
イベントハンドラープロパティ{{domxref("HTMLElement/oncopy", "oncopy")}}
+ +

このイベントの本来の対象は、コピー操作の意図の対象である {{domxref("Element")}} です。このイベントを {{domxref("Window")}} インターフェイス上で待ち受けし、キャプチャやバブリングの局面で処理することができます。このイベントの局面について完全な詳細は、 Element: copy イベントを参照してください。

+ +

例

+ +
window.addEventListener('copy', (event) => {
+    console.log('copy action initiated')
+});
+ +

仕様書

+ + + + + + + + + + + + + + +
仕様書状態
{{SpecName('Clipboard API', '#clipboard-event-copy')}}{{Spec2('Clipboard API')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.copy_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/crypto/index.html b/files/ja/web/api/window/crypto/index.html new file mode 100644 index 0000000000..daa31c46d2 --- /dev/null +++ b/files/ja/web/api/window/crypto/index.html @@ -0,0 +1,74 @@ +--- +title: window.crypto +slug: Web/API/Window/crypto +tags: + - API + - HTML DOM + - Property + - Reference + - Window +translation_of: Web/API/Window/crypto +--- +
{{APIRef}}
+ +

Window.crypto 読み取り専用プロパティは、グローバルオブジェクトに関連付けられた {{domxref("Crypto")}} オブジェクトを返します。このオブジェクトは、ウェブページが暗号に関連したサービスにアクセスできるようにします。 {{domxref("Window.crypto")}} プロパティ自体は読み取り専用ですが、そのメソッドすべて(加えて子オブジェクトのメソッドと {{domxref("SubtleCrypto")}} )は読み取り専用では有りません。故に polyfill による攻撃に対し脆弱です。

+ +

構文

+ +
var cryptoObj = window.crypto || window.msCrypto; // for IE 11
+
+ +

例

+ +

{{domxref("Window.crypto")}} プロパティを使用して getRandomValues() メソッドにアクセスする

+ +

JavaScript

+ +
genRandomNumbers = function getRandomNumbers() {
+  var array = new Uint32Array(10);
+  window.crypto.getRandomValues(array);
+
+  var randText = document.getElementById("myRandText");
+  randText.innerHTML = "The random numbers are: "
+  for (var i = 0; i < array.length; i++) {
+    randText.innerHTML += array[i] + " ";
+  }
+}
+ +

HTML

+ +
<p id="myRandText">The random numbers are: </p>
+<button type="button" onClick='genRandomNumbers()'>Generate 10 random numbers</button>
+ +

実行結果

+ +

{{ EmbedLiveSample('Example') }}

+ +

仕様

+ + + + + + + + + + + + + + +
仕様書策定状況備考
{{SpecName("Web Crypto API", "#dfn-GlobalCrypto", "Window.crypto")}}{{Spec2("Web Crypto API")}}初期定義
+ +

ブラウザーの実装状況

+ + + +

{{Compat("api.Window.crypto")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/customelements/index.html b/files/ja/web/api/window/customelements/index.html new file mode 100644 index 0000000000..68440b9170 --- /dev/null +++ b/files/ja/web/api/window/customelements/index.html @@ -0,0 +1,73 @@ +--- +title: Window.customElements +slug: Web/API/Window/customElements +tags: + - API + - CustomElementRegistry + - Webコンポーネント + - Window + - custom elements + - customElements + - プロパティ + - リファレンス +translation_of: Web/API/Window/customElements +--- +
{{APIRef}}
+ +

{{domxref("Window")}} インターフェイスの読み取り専用 customElements プロパティは、 新しいカスタムエレメントを登録し、かつ以前に登録したカスタムエレメントに関する情報を取得する事ができる {{domxref("CustomElementRegistry")}} オブジェクトへのリファレンスを返します。

+ +

構文

+ +
let customElementRegistry = window.customElements;
+ +

戻り値

+ +

{{domxref("CustomElementRegistry")}} オブジェクトは現在の window の カスタムエレメントレジストリ を表すインスタンスです。

+ +

例

+ +

このプロパティが使われている最も一般的な例は、新しいカスタムエレメントを定義・登録するために {{domxref("CustomElementRegistry.define()")}} メソッドにアクセスすることです, 例えば:

+ +
let customElementRegistry = window.customElements;
+customElementRegistry.define('my-custom-element', MyCustomElement);
+ +

しかし、通常は以下のように短縮されます:

+ +
customElements.define('element-details',
+  class extends HTMLElement {
+    constructor() {
+      super();
+      const template = document
+        .getElementById('element-details-template')
+        .content;
+      const shadowRoot = this.attachShadow({mode: 'open'})
+        .appendChild(template.cloneNode(true));
+  }
+});
+ +

我々の web-components-examples リポジトリにより多くの使用例がありますのでご参照ください。

+ +

仕様

+ + + + + + + + + + + + + + +
仕様ステータスコメント
{{SpecName("HTML WHATWG", "custom-elements.html#dom-window-customelements", "window.customElements")}}{{Spec2("HTML WHATWG")}}初期定義。
+ +

ブラウザ互換性

+ +
+ + +

{{Compat("api.Window.customElements")}}

+
diff --git a/files/ja/web/api/window/cut_event/index.html b/files/ja/web/api/window/cut_event/index.html new file mode 100644 index 0000000000..729b3fe069 --- /dev/null +++ b/files/ja/web/api/window/cut_event/index.html @@ -0,0 +1,77 @@ +--- +title: 'Window: cut イベント' +slug: Web/API/Window/cut_event +tags: + - API + - Clippboard API + - Cut + - Event + - Reference + - Web + - Window + - イベント +translation_of: Web/API/Window/cut_event +--- +
{{APIRef}}
+ +

cut イベントは、ユーザーがブラウザーのユーザーインターフェイスから切り取り操作を実行したときに発生します。

+ + + + + + + + + + + + + + + + + + + + +
バブリングあり
キャンセル可
インターフェイス{{domxref("ClipboardEvent")}}
イベントハンドラープロパティ{{domxref("HTMLElement/oncut", "oncut")}}
+ +

このイベントの本来の対象は、切り取り操作の意図の対象である {{domxref("Element")}} です。このイベントを {{domxref("Window")}} インターフェイス上で待ち受けし、キャプチャやバブリングの局面で処理することができます。このイベントの局面について完全な詳細は、 Element: cut イベントを参照してください。

+ +

例

+ +
window.addEventListener('cut', (event) => {
+    console.log('cut action initiated')
+});
+ +

仕様書

+ + + + + + + + + + + + + + +
仕様書状態
{{SpecName('Clipboard API', '#clipboard-event-cut')}}{{Spec2('Clipboard API')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.cut_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/defaultstatus/index.html b/files/ja/web/api/window/defaultstatus/index.html new file mode 100644 index 0000000000..b1bf126298 --- /dev/null +++ b/files/ja/web/api/window/defaultstatus/index.html @@ -0,0 +1,38 @@ +--- +title: defaultStatus +slug: Web/API/Window/defaultStatus +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - 要更新 +translation_of: Web/API/Window/defaultStatus +--- +

{{ ApiRef() }} {{ 英語版章題("Summary") }}

+

概要

+

与えられたウィンドウのステータスバーのテキストを取得/設定します。

+

{{ 英語版章題("Syntax") }}

+

構文

+
sMsg = window.defaultStatus
+window.defaultStatus =sMsg
+
+

{{ 英語版章題("Parameters") }}

+

引数

+ +

{{ 英語版章題("Example") }}

+

例

+
<html>
+ <body onload="window.defaultStatus='hello!';"/>
+  <button onclick="window.confirm('Are you sure you want to quit?');">confirm</button>
+ </body>
+</htm>
+
+

{{ 英語版章題("Notes") }}

+

注記

+

一度開いたウィンドウのステータスバーのテキストを設定するには、window.status を使用してください。

+

{{ 英語版章題("Specification") }}

+

仕様

+

{{ DOM0() }}

diff --git a/files/ja/web/api/window/devicemotion_event/index.html b/files/ja/web/api/window/devicemotion_event/index.html new file mode 100644 index 0000000000..e17af6d8b2 --- /dev/null +++ b/files/ja/web/api/window/devicemotion_event/index.html @@ -0,0 +1,78 @@ +--- +title: 'Window: devicemotion イベント' +slug: Web/API/Window/devicemotion_event +tags: + - API + - Device Orientation API + - Sensors + - events +translation_of: Web/API/Window/devicemotion_event +--- +

{{APIRef}}

+ +

devicemotion イベントは、一定の間隔で発行され、その時点で端末が受けている加速度の物理的な力の量を示します。また、利用可能であれば、回転率に関する情報も提供します。

+ + + + + + + + + + + + + + + + + + + + +
バブリングいいえ
キャンセル不可
インターフェイス{{domxref("DeviceMotionEvent")}}
イベントハンドラープロパティ{{domxref("Window.ondevicemotion")}}
+ +

例

+ +
function handleMotionEvent(event) {
+
+    var x = event.accelerationIncludingGravity.x;
+    var y = event.accelerationIncludingGravity.y;
+    var z = event.accelerationIncludingGravity.z;
+
+    // Do something awesome.
+}
+
+window.addEventListener("devicemotion", handleMotionEvent, true);
+
+ +

仕様書

+ + + + + + + + + + + + + + +
仕様書状態
{{SpecName("Device Orientation", "#devicemotion", "DeviceMotion event")}}{{Spec2("Device Orientation")}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.devicemotion_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/deviceorientation_event/index.html b/files/ja/web/api/window/deviceorientation_event/index.html new file mode 100644 index 0000000000..7f54466091 --- /dev/null +++ b/files/ja/web/api/window/deviceorientation_event/index.html @@ -0,0 +1,86 @@ +--- +title: 'Window: deviceorientation イベント' +slug: Web/API/Window/deviceorientation_event +tags: + - Device Orientation API + - Sensors + - Window Event + - events +translation_of: Web/API/Window/deviceorientation_event +--- +

{{APIRef}}

+ +

deviceorientation イベントは、端末の現在の向きを地球座標フレームと比較した場合に、方角センサーから最新のデータが得られた場合に発生します。このデータは端末内部の磁力計から収集されます。詳細については、向きと動きのデータの説明を参照してください。

+ + + + + + + + + + + + + + + + + + + + +
バブリングいいえ
キャンセル不可
インターフェイス{{domxref("DeviceOrientationEvent")}}
イベントハンドラープロパティ{{domxref("window.ondeviceorientation")}}
+ +

例

+ +
if (window.DeviceOrientationEvent) {
+    window.addEventListener("deviceorientation", function(event) {
+        // alpha: rotation around z-axis
+        var rotateDegrees = event.alpha;
+        // gamma: left to right
+        var leftToRight = event.gamma;
+        // beta: front back motion
+        var frontToBack = event.beta;
+
+        handleOrientationEvent(frontToBack, leftToRight, rotateDegrees);
+    }, true);
+}
+
+var handleOrientationEvent = function(frontToBack, leftToRight, rotateDegrees) {
+    // do something amazing
+};
+
+ +

仕様書

+ + + + + + + + + + + + + + +
仕様書状態
{{SpecName("Device Orientation", "#deviceorientation", "DeviceOrientation event")}}{{Spec2("Device Orientation")}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.deviceorientation_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/devicepixelratio/index.html b/files/ja/web/api/window/devicepixelratio/index.html new file mode 100644 index 0000000000..f1bd7c045b --- /dev/null +++ b/files/ja/web/api/window/devicepixelratio/index.html @@ -0,0 +1,191 @@ +--- +title: Window.devicePixelRatio +slug: Web/API/Window/devicePixelRatio +tags: + - API + - Adaptive Design + - Property + - Read-only + - Reference + - Window + - devicePixelRatio + - pixel + - ratio + - resolution +translation_of: Web/API/Window/devicePixelRatio +--- +

{{APIRef}}

+ +

{{domxref("Window")}}プロパティのdevicePixelRatioは現在のディスプレイにおけるCSS解像度と物理解像度の比を返します。 これは物理1ピクセルの大きさに対するCSS1ピクセルの大きさの比率と考えることもできます。もっと簡単に言うと、CSS上の1pxが物理ピクセルいくつで表示されているかという値です。

+ +

これは一般的なディスプレイと、HiDPI(高DPI)やRetinaのように同じ大きさのオブジェクトを描画するのにより多くのピクセルを使って鮮明さを得ているディスプレイとの差異を扱うのに便利です。

+ +

{{domxref("Window.matchMedia", "window.matchMedia()")}} を使うと、devicePixelRatio の値の変化（例えば、ユーザーが異なるピクセル解像度の画面へウィンドウをドラッグした時など）を検知することができます。{{anch("Monitoring screen resolution or zoom level changes", "後述の例")}}を参照して下さい。

+ +

構文

+ +
value = window.devicePixelRatio;
+
+ +

値

+ +

倍精度浮動小数点の値であり、CSS ピクセル解像度に対するディスプレイの物理的なピクセル解像度の比率を表します。この値が 1 であることは、それが伝統的な 96 DPI (プラットフォームによっては 76 DPI) であることを意味し、2 であることは、HiDPI やレティナのディスプレイであると考えられます。それ以外の値が返されることもあり、それは一般的でない低解像度のディスプレイの場合や、より考えられるのはスクリーンが標準的な 96 または 76 DPI の解像度の単純な 2 倍よりも高いピクセル密度を持つ場合です。

+ +

使用例

+ +

<canvas> の解像度を補正する

+ +

レティナでは canvas がぼやけて見えることがあるでしょう。window.devicePixelRatioを使うことで、鮮明に表示するために必要なピクセル密度を調べます。

+ +

HTML

+ +
<canvas id="canvas"></canvas>
+
+ +

JavaScript

+ +
var canvas = document.getElementById('canvas');
+var ctx = canvas.getContext('2d');
+
+// 表示サイズを設定(CSSにおけるピクセル数です)。
+var size = 200;
+canvas.style.width = size + "px";
+canvas.style.height = size + "px";
+
+// メモリ上における実際のサイズを設定(ピクセル密度の分だけ倍増させます)。
+var scale = window.devicePixelRatio; // レティナでこの値を1にするとぼやけたcanvasになります
+canvas.width = size * scale;
+canvas.height = size * scale;
+
+// CSS上のピクセル数を前提としているシステムに合わせます。
+ctx.scale(scale, scale);
+
+ctx.fillStyle = "#bada55";
+ctx.fillRect(10, 10, 300, 300);
+ctx.fillStyle = "#ffffff";
+ctx.font = '18px Arial';
+ctx.textAlign = 'center';
+ctx.textBaseline = 'middle';
+
+var x = size / 2;
+var y = size / 2;
+
+var textString = "I love MDN";
+ctx.fillText(textString, x, y);
+
+ +

この画像は、レティナディスプレイにおける異なる値の影響を表すものです。

+ +

画面解像度やズームレベルの変化を監視する

+ +

この例では、devicePixelRatio の値をチェックして必要な変化に対処できるよう、メディアクエリを設定してデバイス解像度がいつ変化するかを監視します。

+ +

JavaScript

+ +

この JavaScript のコードは、デバイス解像度を監視するメディアクエリを作り、devicePixelRatio の値が変化したときはいつでもそれをチェックします。

+ +
let pixelRatioBox = document.querySelector(".pixel-ratio");
+let mqString = `(resolution: ${window.devicePixelRatio}dppx)`;
+
+const updatePixelRatio = () => {
+  let pr = window.devicePixelRatio;
+  let prString = (pr * 100).toFixed(0);
+  pixelRatioBox.innerText = `${prString}% (${pr.toFixed(2)})`;
+}
+
+updatePixelRatio();
+
+matchMedia(mqString).addEventListener("change", updatePixelRatio);
+ +

文字列 mqString は、メディアクエリそのものになるように作ります。このメディアクエリは、(resolution: 1dppx) (標準的なディスプレイの場合)、または (resolution: 2dppx) (HiDPI / レティナディスプレイの場合) のような内容で始まり、現在のディスプレイ解像度のピクセルあたりのドット数が特定の数であるかをチェックします。

+ +

関数 updatePixelRatio() は、現在の devicePixelRatio の値を取得し、pixelRatioBox 要素の {{domxref("HTMLElement.innerText", "innerText")}} に、その比率を百分率と小数第 2 位までの未加工の 10 進数の値の両方で表示する文字列を設定します。

+ +

そして、関数 updatePixelRatio() が最初の値を表示するために一回実行され、その後メディアクエリが作られて updatePixelRatio() を change イベントのハンドラーとして登録するために {{domxref("EventTarget.addEventListener", "addEventListener()")}} が実行されます。

+ +

HTML

+ +

この HTML は、説明文を含むボックスと、現在のピクセル比率情報を表示する pixel-ratio ボックスを作成します。

+ +
<div class="container">
+  <div class="inner-container">
+    <p>この使用例により、ページをズームまたはズームアウトすること
+       (または異なる表示倍率の画面にページを移動させること) の
+       <code>Window.devicePixelRatio</code> プロパティに与える影響がわかります。
+       どのようなことが起こるか、試してみましょう！</p>
+  </div>
+    <div class="pixel-ratio"></div>
+</div>
+ +
+

CSS

+ + +
body {
+  font: 22px arial, sans-serif;
+}
+
+.container {
+  top: 2em;
+  width: 22em;
+  height: 14em;
+  border: 2px solid #22d;
+  margin: 0 auto;
+  padding: 0;
+  background-color: #a9f;
+}
+
+.inner-container {
+  padding: 1em 2em;
+  text-align: justify;
+  text-justify: auto;
+}
+
+.pixel-ratio {
+  position: relative;
+  margin: auto;
+  height: 1.2em;
+  text-align: right;
+  bottom: 0;
+  right: 1em;
+  font-weight: bold;
+}
+
+ +

結果

+ +

{{EmbedLiveSample("Example_2_Monitoring_screen_resolution_or_zoom_level_changes", "100%", 500)}}

+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様状況コメント
{{SpecName("CSSOM View", "#dom-window-devicepixelratio", "Window.devicePixelRatio")}}{{Spec2("CSSOM View")}}初期定義
+ +

ブラウザ実装状況

+ + + +

{{Compat("api.Window.devicePixelRatio")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/dialogarguments/index.html b/files/ja/web/api/window/dialogarguments/index.html new file mode 100644 index 0000000000..11a5f9b302 --- /dev/null +++ b/files/ja/web/api/window/dialogarguments/index.html @@ -0,0 +1,19 @@ +--- +title: window.dialogArguments +slug: Web/API/Window/dialogArguments +tags: + - DOM + - Dialogs + - Reference + - Window +translation_of: Web/API/Window/dialogArguments +--- +

{{APIRef}}

+ +

概要

+ +

dialogArguments プロパティは、 {{domxref("window.showModalDialog()")}} メソッドに渡されたパラメータを返します。モーダルダイアログボックスの作成時に、引数にどのようなパラメータが指定されたを判断することができます。

+ +

構文

+ +
value = window.dialogArguments;
diff --git a/files/ja/web/api/window/directories/index.html b/files/ja/web/api/window/directories/index.html new file mode 100644 index 0000000000..b893d4443c --- /dev/null +++ b/files/ja/web/api/window/directories/index.html @@ -0,0 +1,33 @@ +--- +title: window.directories +slug: Web/API/Window/directories +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - 要更新 +translation_of: Web/API/Window/directories +--- +

{{ ApiRef() }} {{ 英語版章題("Summary") }}

+

概要

+

ウィンドウディレクトリのツールバーオブジェクトを返します。 {{ 英語版章題("Syntax") }}

+

構文

+
dirBar = window.directories
+
+

{{ 英語版章題("Parameters") }}

+

引数

+

+ + dirBar + は、barProp 型のオブジェクトです。 {{ 英語版章題("Example") }}

+

例

+
<script>
+ function dirs() {
+  alert(window.directories);
+ }
+</script>
+
+

{{ 英語版章題("Specification") }}

+

仕様

+

{{ DOM0() }}

diff --git a/files/ja/web/api/window/document/index.html b/files/ja/web/api/window/document/index.html new file mode 100644 index 0000000000..2693e09cee --- /dev/null +++ b/files/ja/web/api/window/document/index.html @@ -0,0 +1,49 @@ +--- +title: Window.document +slug: Web/API/Window/document +tags: + - API + - HTML DOM + - Property + - Reference + - Window +translation_of: Web/API/Window/document +--- +
{{APIRef}}
+ +

window.document は、ウィンドウに含まれている文書への参照を返します。

+ +

例

+ +
console.log(window.document.title);
+
+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('HTML WHATWG', '#dom-document-2', 'Window.document')}}{{Spec2('HTML WHATWG')}}
{{SpecName('HTML5 W3C', 'browsers.html#dom-document-0', 'Window.document')}}{{Spec2('HTML5 W3C')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.document")}}

diff --git a/files/ja/web/api/window/domcontentloaded_event/index.html b/files/ja/web/api/window/domcontentloaded_event/index.html new file mode 100644 index 0000000000..f97cd2e9a0 --- /dev/null +++ b/files/ja/web/api/window/domcontentloaded_event/index.html @@ -0,0 +1,78 @@ +--- +title: 'Window: DOMContentLoaded イベント' +slug: Web/API/Window/DOMContentLoaded_event +tags: + - Event + - Reference + - Web + - Window + - events +translation_of: Web/API/Window/DOMContentLoaded_event +--- +
{{APIRef}}
+ +

DOMContentLoaded イベントは、最初の HTML 文書の読み込みと解析が完了したとき、スタイルシート、画像、サブフレームの読み込みが完了するのを待たずに発生します。

+ + + + + + + + + + + + + + + + + + + + +
バブリングあり
キャンセル可 (ただしキャンセル不可の単純イベントとして定義されている)
インターフェイス{{domxref("Event")}}
イベントハンドラープロパティなし
+ +

このイベントの本来の対象は、読み込まれた {{domxref("Document")}} です。このイベントを Window からキャプチャやバブリングの過程で待ち受けすることができます。このイベントについての全般的な詳細は、 Document: {{domxref("Document/DOMContentLoaded_event", "DOMContentLoaded")}} イベントのページをご覧ください。

+ +

別なイベントである {{domxref("Window/load_event", "load")}} は、ページ全体が読み込まれたことを検出するためにのみ使用してください。 load を、 DOMContentLoaded がより適切である場面に使用する間違いがよくあります。

+ +

例

+ +

基本的な使用

+ +
window.addEventListener('DOMContentLoaded', (event) => {
+    console.log('DOM fully loaded and parsed');
+});
+
+ +

仕様書

+ + + + + + + + + + + + + + +
仕様書状態
{{SpecName('HTML WHATWG', 'indices.html#event-domcontentloaded')}}{{Spec2('HTML WHATWG')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.DOMContentLoaded_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/dump/index.html b/files/ja/web/api/window/dump/index.html new file mode 100644 index 0000000000..44c2365fb0 --- /dev/null +++ b/files/ja/web/api/window/dump/index.html @@ -0,0 +1,54 @@ +--- +title: window.dump() +slug: Web/API/Window/dump +tags: + - API + - DOM + - DOM_0 + - Method + - Non-standard +translation_of: Web/API/Window/dump +--- +
{{ ApiRef() }}
+ +
+

{{Non-standard_header}}

+
+ +

概要

+ +

(システムの) コンソールにメッセージを表示します。

+ +

構文

+ +
window.dump(message);
+
+dump(message);
+
+ + + +

注記

+ +

dump() の一般的な使い方は、JavaScript のデバッグです。Firefox のプロセスが -console オプション付きで開始された場合、dump() に渡されたメッセージは、システムコンソール (ネイティブのコンソール) に送信されます。-console オプションが指定されていない場合、stderr に出力されます。dump() からの出力は ブラウザコンソール に送信されません。ブラウザコンソール への出力は、console.log() を使用してください。特権コードは、Components.utils.reportError と nsIConsoleService を使用してメッセージを エラーコンソール / ブラウザコンソール にログ出力することもできます。

+ +

dump() は、JavaScript で実装された XPCOM コンポーネントでも使用できます。これは、{{domxref("window")}} がコンポーネント内のグローバルオブジェクトでなくても使えます。また、sandboxes 内で明示的に使用可能にすることもできます。しかし、この dump の使用は、後述の設定に影響せず、常に表示されます。この設定を自分で確認するか、独自のデバッグ設定で、多くのデバッグコンテンツを、これらに興味のないユーザのコンソールに送信されないようにすることをおすすめします。ただし、XPCOM コンポーネントからの dump 出力は stderr へ送られますが、別の場所から呼び出された dump は stdout へ出力されるので注意してください。

+ +

Gecko の dump() は 既定で無効 です。実行しても何も起こらず、エラーも発生しません。dump 出力を見るには、about:config ページか user.js ファイル で、browser.dom.window.dump.enabled 設定の値を true にしなければなりません。注記: この設定は既定では about:config のリストに表示されないので、新たに作成してください (about:config ページのコンテンツ領域を右クリックし、"新規作成" から "真偽値" を選択します)。

+ +

Windows では、dump の出力を見るにはコンソールを開く必要があります。まだコンソールを開いていなければ、一旦アプリケーションを閉じ、コマンドライン引数に -console を追加して再度開いてください。アプリケーションと同時にコンソールが開きます。または、-attach-console を追加すると既存のコンソールを使用します。他のオペレーティングシステムでは、ターミナルからプリケーションを開くだけです。

+ +

コンソール出力をファイルへリダイレクトするには、Firefox を -console オプション無しで起動し、次のコマンドで stderr と stdout の出力をファイルへリダイレクトしてください:

+ +
firefox > console.txt 2>&1
+
+ +
+

コンソールメッセージを、アプリケーションを起動したコンソールに表示させたいときは、Gecko Console Redirector を使用してください。プリコンパイルされたバイナリが https://github.com/matthewkastor/Redirector/archive/master.zip の ZIP アーカイブ内の Redirector-master\Gecko\Console Redirector\bin\Release に含まれています。すべての dll ファイルと exe ファイルをお好みの場所にコピーしてください。次に、Console Redirector.exe /? を実行します。

+
+ +

仕様

+ +

これは、どの仕様にも含まれません。

diff --git a/files/ja/web/api/window/error_event/index.html b/files/ja/web/api/window/error_event/index.html new file mode 100644 index 0000000000..5d2ba8b0e3 --- /dev/null +++ b/files/ja/web/api/window/error_event/index.html @@ -0,0 +1,140 @@ +--- +title: 'Window: error イベント' +slug: Web/API/Window/error_event +tags: + - API + - Event + - UI Events + - Window +translation_of: Web/API/Window/error_event +--- +
{{APIRef}}
+ +

error イベントは、リソースの読み取りに失敗したり、使用できなかったりした場合 — 例えば、スクリプトに実行エラーがあった場合に {{domxref("Window")}} オブジェクトに発生します。

+ + + + + + + + + + + + + + + + + + + + +
バブリングなし
キャンセル不可
インターフェイス{{domxref("Event")}} または {{domxref("UIEvent")}}
イベントハンドラープロパティ{{domxref("GlobalEventHandlers/onerror", "onerror")}}
+ +

イベントオブジェクトは、ユーザーインターフェイス要素から生成された場合は {{domxref("UIEvent")}} のインスタンスとなり、それ以外の場合は {{domxref("Event")}} となります。

+ +

例

+ +

ライブデモ

+ +

HTML

+ +
<div class="controls">
+  <button id="script-error" type="button">Generate script error</button>
+  <img class="bad-img" />
+</div>
+
+<div class="event-log">
+  <label>Event log:</label>
+  <textarea readonly class="event-log-contents" rows="8" cols="30"></textarea>
+</div>
+ + + +

JS

+ +
const log = document.querySelector('.event-log-contents');
+
+window.addEventListener('error', (event) => {
+    log.textContent = log.textContent + `${event.type}: ${event.message}\n`;
+    console.log(event)
+});
+
+const scriptError = document.querySelector('#script-error');
+scriptError.addEventListener('click', () => {
+    const badCode = 'const s;';
+    eval(badCode);
+});
+
+ +

結果

+ +

{{ EmbedLiveSample('Live_example', '100%', '150px') }}

+ +

仕様書

+ + + + + + + + + + + + + + +
仕様書状態
{{SpecName('UI Events', '#event-type-error')}}{{Spec2('UI Events')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.error_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/escape/index.html b/files/ja/web/api/window/escape/index.html new file mode 100644 index 0000000000..0d16e08e31 --- /dev/null +++ b/files/ja/web/api/window/escape/index.html @@ -0,0 +1,33 @@ +--- +title: window.escape +slug: Web/API/Window/escape +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/JavaScript/Reference/Global_Objects/escape +--- +
+ {{ApiRef}}
+

概要

+

文字列をエンコードし、16 進エスケープシーケンスで表された特定の文字に置換します。

+

構文

+
escaped = escape(regular);
+
+ +

例

+
alert( escape("http://www.cnn.com") ); // 表示結果: http%3A//www.cnn.com
+
+

注記

+

escape() メソッドは、特別な文字（通常のテキストや数字ではない文字）を 16 進文字にエンコードします。これは、特に、クッキーの値を設定するために必要となります。また、GET リクエストや AJAX GET/POST リクエストの URL で + + name=value + のような組のデータを渡すときにも役立ちます。

+

{{domxref("window.unescape")}} 、encodeURIComponent も参照してください。

+

仕様

+

{{DOM0}} 但し、ECMA-262 の非標準化セクションで言及されています。

diff --git a/files/ja/web/api/window/event/index.html b/files/ja/web/api/window/event/index.html new file mode 100644 index 0000000000..68bb551b5f --- /dev/null +++ b/files/ja/web/api/window/event/index.html @@ -0,0 +1,50 @@ +--- +title: Window.event +slug: Web/API/Window/event +tags: + - API + - DOM + - Event + - Event Handler + - Read-only + - Window +translation_of: Web/API/Window/event +--- +
{{APIRef("DOM")}}
+ +

{{domxref("Window")}} の読み取り専用プロパティである event は、現在サイトのコードが処理している {{domxref("Event")}} を返します。イベントハンドラーのコンテキスト外では、値が常に undefined になります。

+ +

新しいコードではこのプロパティの使用を避けるべきであり、代わりにイベントハンドラー関数になる {{domxref("Event")}} を使用してください。このプロパティは広くサポートされておらず、またサポートされていてもコードが壊れやすくなるおそれがあります。

+ +
+

注記: このプロパティは、返された Event が期待する値ではない状況になる場合があり、壊れやすい可能性があります。加えて Window.event は、{{Glossary("shadow tree", "shadow trees")}} で発生したイベントに対して不適格です。

+
+ +

仕様

+ + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName('DOM WHATWG', "#ref-for-dom-window-event", "Window.event")}}{{Spec2('DOM WHATWG')}}初期定義
+ +

ブラウザー実装状況

+ + + +

{{Compat("api.Window.event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/find/index.html b/files/ja/web/api/window/find/index.html new file mode 100644 index 0000000000..ad99bebbf7 --- /dev/null +++ b/files/ja/web/api/window/find/index.html @@ -0,0 +1,80 @@ +--- +title: window.find +slug: Web/API/Window/find +tags: + - API + - DOM + - DOM_0 + - Gecko + - Non-standard + - Window +translation_of: Web/API/Window/find +--- +
{{ApiRef}}
+ +
+

{{Non-standard_header}}

+
+ +
{{noteStart}} window.find() のサポートは、Gecko の将来のバージョンで変更される可能性があります（※参照 : {{Bug("672395")}}） {{noteEnd}}
+ +

概要

+ +

ウィンドウ内の文字列を検索します。

+ +

構文

+ +
window.find(aString, aCaseSensitive, aBackwards, aWrapAround,
+            aWholeWord, aSearchInFrames);
+ +
+
aString
+
検索するテキスト文字列
+
aCaseSensitive
+
真偽値。 true の場合、大文字と小文字を区別して検索します。
+
aBackwards
+
真偽値。 true の場合、後方検索を行います。
+
aWrapAround
+
真偽値。 true の場合、折り返し検索を行います。
+
aWholeWord {{unimplemented_inline}}
+
真偽値。 true の場合、完全一致検索を行います（{{bug("481513")}}）
+
aSearchInFrames
+
真偽値。 true の場合、フレーム内の検索を行います。
+
+ +

戻り値

+ +

真偽値。

+ + + +

例

+ +

JavaScript

+ +
findString = function findText(text) {
+  alert("String \x22" + text + "\x22 found? " + window.find(text));
+}
+ +

HTML

+ +
<p>Apples, Bananas, and Oranges.</p>
+<button type="button" onClick='findString("Apples")'>Search for Apples</button>
+<button type="button" onClick='findString("Banana")'>Search for Banana</button>
+<button type="button" onClick='findString("Orange")'>Search for Orange</button>
+
+ +

表示結果

+ +

{{EmbedLiveSample('Example')}}

+ +

注記

+ +

Window.find() は、サイト上で発見したコンテンツを選択します。

+ +

仕様

+ +

どの標準にも属しません。

diff --git a/files/ja/web/api/window/focus/index.html b/files/ja/web/api/window/focus/index.html new file mode 100644 index 0000000000..6008544ef7 --- /dev/null +++ b/files/ja/web/api/window/focus/index.html @@ -0,0 +1,24 @@ +--- +title: window.focus +slug: Web/API/Window/focus +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/Window/focus +--- +
+ {{ApiRef}}
+

概要

+

ウィンドウにフォーカスを合わせます。

+

構文

+
window.focus()
+
+

例

+
if ( clicked ) {
+  window.focus();
+}
+

仕様

+

{{DOM0}}

diff --git a/files/ja/web/api/window/focus_event/index.html b/files/ja/web/api/window/focus_event/index.html new file mode 100644 index 0000000000..31fcdbf73c --- /dev/null +++ b/files/ja/web/api/window/focus_event/index.html @@ -0,0 +1,124 @@ +--- +title: 'Window: focus イベント' +slug: Web/API/Window/focus_event +tags: + - API + - Event + - Focus + - FocusEvent + - Reference + - Web + - Window + - onfocus + - イベント +translation_of: Web/API/Window/focus_event +--- +
{{APIRef}}
+ +

focus イベントは、要素がフォーカスを取得したときに発生します。

+ +

focus の反対は {{domxref("Window/blur_event", "blur")}} です。

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
バブリングなし
キャンセル不可
インターフェイス{{DOMxRef("FocusEvent")}}
イベントハンドラープロパティ{{domxref("GlobalEventHandlers/onfocus", "onfocus")}}
同期 / 非同期同期
Composedはい
+ +

例

+ +

ライブデモ

+ +

この例ではフォーカスを失ったときに文書の外見を変更します。 {{domxref("EventTarget.addEventListener()", "addEventListener()")}} を使用して focus および {{domxref("Window/blur_event", "blur")}} イベントを監視します。

+ +

HTML

+ +
<p id="log">Click on this document to give it focus.</p>
+ +

CSS

+ +
.paused {
+  background: #ddd;
+  color: #555;
+}
+ +

JavaScript

+ +
function pause() {
+  document.body.classList.add('paused');
+  log.textContent = 'FOCUS LOST!';
+}
+
+function play() {
+  document.body.classList.remove('paused');
+  log.textContent = 'This document has focus. Click outside the document to lose focus.';
+}
+
+const log = document.getElementById('log');
+
+window.addEventListener('blur', pause);
+window.addEventListener('focus', play);
+ +

結果

+ +

{{EmbedLiveSample("Live_example")}}

+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("UI Events", "#event-type-focus")}}{{Spec2("UI Events")}}Added info that this event is composed.
{{SpecName("DOM3 Events", "#event-type-focus")}}{{Spec2("DOM3 Events")}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.focus_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/forward/index.html b/files/ja/web/api/window/forward/index.html new file mode 100644 index 0000000000..8c223f2d18 --- /dev/null +++ b/files/ja/web/api/window/forward/index.html @@ -0,0 +1,56 @@ +--- +title: window.forward +slug: Web/API/Window/forward +tags: + - API + - DOM + - Firefox + - Gecko + - Method + - Non-standard + - Obsolete + - Window + - forward +translation_of: Web/API/Window/forward +--- +
{{ApiRef}}{{Non-standard_header}} {{deprecated_header}}
+ +

概要

+ +

ウィンドウの文書の履歴のひとつ分だけ前へ進めます。これは Firefox 固有のメソッドであり、Firefox 31 で削除しました。代わりに、標準の {{domxref("History.forward", "window.history.forward()")}} メソッドを使用してください。

+ +

構文

+ +
window.forward();
+ +

引数

+ +

ありません。

+ +

戻り値

+ +

undefined です。

+ +

例

+ +
function goForward() {
+  if (canGoForward) {
+    window.forward();
+  }
+}
+
+ +

仕様

+ +

どの仕様にも属していません。

+ +

ブラウザー実装状況

+ +

この非標準メソッドは Firefox だけが実装しており、Firefox 31 で削除しました。

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/frameelement/index.html b/files/ja/web/api/window/frameelement/index.html new file mode 100644 index 0000000000..ab266fa993 --- /dev/null +++ b/files/ja/web/api/window/frameelement/index.html @@ -0,0 +1,112 @@ +--- +title: window.frameElement +slug: Web/API/Window/frameElement +tags: + - API + - DOM + - Gecko + - HTML DOM + - Window +translation_of: Web/API/Window/frameElement +--- +
{{ ApiRef }}
+ +

（{{HTMLElement("iframe")}} や {{HTMLElement("object")}} のような）ウィンドウが埋め込まれた要素を返します。要素がトップレベルであるか異なるスクリプト生成元をもつ文書に埋め込まれるかのいずれかの場合は、 null を返します。

+ +

構文

+ +
frameEl = window.frameElement;
+
+ + + +
+

このプロパティの名前にもかかわらず、これは{{HTMLElement("object")}}、{{HTMLElement("iframe")}}、または <embed>を含むすべての埋め込みポイント内に埋め込まれた文書の役に立ちます。

+
+ +

例

+ +
var frameEl = window.frameElement;
+// 埋め込みの場合、要素の URL が 'http://mozilla.org/' に変わります。
+if (frameEl) {
+  frameEl.src = 'http://mozilla.org/';
+}
+
+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様状態コメント
{{ SpecName('HTML WHATWG', '#dom-frameelement', 'Window.frameElement') }}{{ Spec2('WebRTC 1.0') }}初期の仕様
+ +

ブラウザー互換性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本サポート4?{{CompatGeckoDesktop("1")}}5.5?12.1?4?
+
+ +
+ + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本サポート{{CompatUnknown}}{{CompatGeckoDesktop("1")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

関連項目

+ + diff --git a/files/ja/web/api/window/frames/index.html b/files/ja/web/api/window/frames/index.html new file mode 100644 index 0000000000..22a1c45883 --- /dev/null +++ b/files/ja/web/api/window/frames/index.html @@ -0,0 +1,69 @@ +--- +title: Window.frames +slug: Web/API/Window/frames +tags: + - API + - Gecko + - HTML DOM + - NeedsContent + - NeedsUpdate + - Property + - Reference + - Window + - プロパティ +translation_of: Web/API/Window/frames +--- +
{{APIRef("DOM")}}
+ +

ウィンドウ自体を、現在のウィンドウの直接のサブフレームを列挙した配列風オブジェクトとして返します。

+ +

構文

+ +
frameList = window.frames;
+
+ + + +

例

+ +
var frames = window.frames; // or // var frames = window.parent.frames;
+for (var i = 0; i < frames.length; i++) {
+  // frames[i] で各サブフレームに何らかの処理をします
+  frames[i].document.body.style.background = "red";
+}
+
+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("HTML WHATWG", "browsers.html#dom-frames", "Window.frames")}}{{Spec2("HTML WHATWG")}}
{{SpecName("HTML5 W3C", "browsers.html#dom-frames", "Window.frames")}}{{Spec2("HTML5 W3C")}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.frames")}}

diff --git a/files/ja/web/api/window/fullscreen/index.html b/files/ja/web/api/window/fullscreen/index.html new file mode 100644 index 0000000000..3a565b6007 --- /dev/null +++ b/files/ja/web/api/window/fullscreen/index.html @@ -0,0 +1,58 @@ +--- +title: Window.fullScreen +slug: Web/API/Window/fullScreen +tags: + - API + - HTML DOM + - NeedsMarkupWork + - Non-standard + - Property + - Reference + - Window + - プロパティ + - 標準外 +translation_of: Web/API/Window/fullScreen +--- +
{{APIRef}}{{Non-standard_Header}}
+ +

fullScreen は Window インターフェイスのプロパティで、そのウィンドウが全画面モードで表示されているかどうかを示します。

+ +

構文

+ +
isInFullScreen = windowRef.fullScreen;
+
+ +

クローム特権があればこのプロパティは読み書き可能で、それ以外では読み取り専用です。クローム特権なしでこのプロパティを設定しようとすると、例外は発生せず、ただ暗黙に失敗することに注意してください。これは、 Internet Explorer でこのプロパティを設定するように設計されたスクリプトが壊れるのを防ぐためです。

+ +

返値

+ +
+
isInFullScreen
+
論理値。取り得る値は次の通りです。
+
+ + + +

注

+ + + +

例

+ +
if (window.fullScreen) {
+  // 全画面モード
+}
+else {
+  // 全画面モードではない
+}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.fullScreen")}}

diff --git a/files/ja/web/api/window/gamepadconnected_event/index.html b/files/ja/web/api/window/gamepadconnected_event/index.html new file mode 100644 index 0000000000..0aeeaa4b2a --- /dev/null +++ b/files/ja/web/api/window/gamepadconnected_event/index.html @@ -0,0 +1,85 @@ +--- +title: gamepadconnected +slug: Web/API/Window/gamepadconnected_event +translation_of: Web/API/Window/gamepadconnected_event +--- +

gamepadconnected イベントは、ゲームパッドが接続されたことをブラウザが検出したとき、またはゲームパッドのボタン/軸が初めて使用されたときに発生します。

+ +

一般的な情報

+ +
+
仕様
+
Gamepad
+
インターフェース
+
Event
+
バブリング
+
No
+
キャンセル可能
+
No
+
対象
+
DefaultView (<window>)
+
標準の動作
+
None
+
+ +

属性

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
PropertyTypeDescription
target {{readonlyInline}}{{domxref("EventTarget")}}The event target (the topmost target in the DOM tree).
type {{readonlyInline}}{{domxref("DOMString")}}The type of event.
bubbles {{readonlyInline}}{{jsxref("Boolean")}}Whether the event normally bubbles or not.
cancelable {{readonlyInline}}{{jsxref("Boolean")}}Whether the event is cancellable or not.
gamepad {{readonlyInline}}{{domxref("Gamepad")}}The single gamepad attribute provides access to the associated gamepad data for this event.
+ +

例

+ +
// Note that the API is still vendor-prefixed in browsers implementing it
+window.addEventListener("gamepadconnected", function( event ) {
+
+    // All buttons and axes values can be accessed through
+    event.gamepad;
+
+});
+
+ +

関連するイベント

+ + + +

参照

+ + diff --git a/files/ja/web/api/window/gamepaddisconnected_event/index.html b/files/ja/web/api/window/gamepaddisconnected_event/index.html new file mode 100644 index 0000000000..e6c138a353 --- /dev/null +++ b/files/ja/web/api/window/gamepaddisconnected_event/index.html @@ -0,0 +1,74 @@ +--- +title: gamepaddisconnected +slug: Web/API/Window/gamepaddisconnected_event +translation_of: Web/API/Window/gamepaddisconnected_event +--- +

ゲームパッドが切断されたことをブラウザが検出すると、gampaddisconnected イベントが発生します。

+ +

一般的な情報

+ +
+
仕様
+
Gamepad
+
インターフェース
+
Event
+
バブリング
+
No
+
キャンセル可能
+
No
+
対象
+
DefaultView (<window>)
+
標準の動作
+
None
+
+ +

属性

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
PropertyTypeDescription
target {{readonlyInline}}{{domxref("EventTarget")}}The event target (the topmost target in the DOM tree).
type {{readonlyInline}}{{domxref("DOMString")}}The type of event.
bubbles {{readonlyInline}}{{jsxref("Boolean")}}Whether the event normally bubbles or not.
cancelable {{readonlyInline}}{{jsxref("Boolean")}}Whether the event is cancellable or not.
gamepad {{readonlyInline}}{{domxref("Gamepad")}}The single gamepad attribute provides access to the associated gamepad data for this event.
+ +

関連するイベント

+ + + +

参照

+ + diff --git a/files/ja/web/api/window/getattention/index.html b/files/ja/web/api/window/getattention/index.html new file mode 100644 index 0000000000..4376715018 --- /dev/null +++ b/files/ja/web/api/window/getattention/index.html @@ -0,0 +1,25 @@ +--- +title: window.getAttention +slug: Web/API/Window/getAttention +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/Window/getAttention +--- +
+ {{ApiRef}}
+

概要

+

ユーザの注意を引きつける動作をします。これがどのような動作になるかは、OS と ウィンドウマネージャー次第で変化します。

+

構文

+
window.getAttention();
+
+

注記

+

Windows では、ウィンドウのタスクバーのボタンが点滅します（ユーザがこれを無効化していない場合）。

+

Linux では、挙動はウィンドウマネージャーによって変化します。タスクバーボタンが点滅するのもあれば、直ちにウィンドウにフォーカスするものもあります。これは調整可能であるかもしれません。

+

Macintosh では、デスクトップの右上端のアイコンが点滅します。

+

この関数は、Web コンテンツでは、無効化されています。Gecko も Internet Explorer も、現在はこの機能を Web コンテンツに対してはサポートしていません。getAttention は、Gecko アプリケーションでの chrome から利用したときには、いまだに動作します。

+

仕様

+

{{DOM0}}

diff --git a/files/ja/web/api/window/getcomputedstyle/index.html b/files/ja/web/api/window/getcomputedstyle/index.html new file mode 100644 index 0000000000..6330951eff --- /dev/null +++ b/files/ja/web/api/window/getcomputedstyle/index.html @@ -0,0 +1,157 @@ +--- +title: Window.getComputedStyle() +slug: Web/API/Window/getComputedStyle +tags: + - API + - CSSOM View + - Method + - Reference + - Window + - getComputedStyle +translation_of: Web/API/Window/getComputedStyle +--- +

{{APIRef("CSSOM")}}

+ +

Window.getComputedStyle() メソッドは、アクティブなスタイルシートを適用し、それらの値に含まれる可能性のある基本的な計算を解決した後、要素のすべての CSS プロパティの値を含むオブジェクトを返します。個々の CSS プロパティの値は、オブジェクトによって提供される API を介してアクセスするか、CSS プロパティ名でインデックスを作成することでアクセスすることができます。

+ +

構文

+ +
var style = window.getComputedStyle(element [, pseudoElt]);
+ +
+
element
+
この {{DOMxRef("Element")}} の計算したスタイルを取得します。
+
pseudoElt{{Optional_Inline}}
+
一致させる擬似要素を指定する文字列。実在する要素の場合は省略 (または null)。
+
+ +

返値の style は、生きた {{DOMxRef("CSSStyleDeclaration")}} オブジェクトで、要素のスタイルが変わると自動で更新されます。

+ +

例外

+ +
+
{{JSxRef("TypeError")}}
+
渡されたオブジェクトが {{DOMxRef("Element")}} ではないか、 pseudoElt が妥当な擬似要素セレクターではないか、 {{CSSxRef("::part", "::part()")}} または {{CSSxRef("::slotted", "::slotted()")}} である場合。
+
+
+

注: 妥当な擬似要素とは構文的に適切であることを指します。例えば ::unsupported は擬似要素として対応はありませんが、妥当と判断されます。

+
+
+
+ +

例

+ +

この例では、 {{HTMLElement("p")}} の要素のスタイルを設定してから、getComputedStyle() を使用してそれらのスタイルを取得し、それらを <p> のテキストコンテンツに出力します。

+ +

HTML

+ +
<p>Hello</p>
+ +

CSS

+ +
p {
+  width: 400px;
+  margin: 0 auto;
+  padding: 20px;
+  font: 2rem/2 sans-serif;
+  text-align: center;
+  background: purple;
+  color: white;
+}
+ +

JavaScript

+ +
let para = document.querySelector('p');
+let compStyles = window.getComputedStyle(para);
+para.textContent = 'My computed font-size is ' +
+    compStyles.getPropertyValue('font-size') +
+    ',\nand my computed line-height is ' +
+    compStyles.getPropertyValue('line-height') +
+    '.';
+ +

結果

+ +

{{EmbedLiveSample('Examples', '100%', '240px')}}

+ +

解説

+ +

返されるオブジェクトは {{DOMxRef("CSSStyleDeclaration")}} 型で、これは要素の {{DOMxRef("HTMLElement.style", "style")}} プロパティから返されるオブジェクトと同じです。しかし、2つのオブジェクトは異なる目的を持っています。

+ + + +

最初の引数は {{domxref("Element")}} でなければなりません。要素以外、例えば {{DOMxRef("Text")}} ノードであった場合はエラーが発生します。

+ +

defaultView

+ +

多くのコードサンプルでは、 getComputedStyle は {{DOMxRef("document.defaultView")}} オブジェクトから使用されています。ほとんどの場合、 getComputedStyle は window オブジェクト上に存在するので、これは必要ありません。 defaultView パターンは、 window のテスト仕様を書きたくない人たちと、 Java でも使える API を作りたくない人たちの組み合わせだったのかもしれません。

+ +

擬似要素の使用

+ +

getComputedStyle は擬似要素 (例えば ::after, ::before, ::marker, ::line-marker — the pseudo-element spec を参照してください) からスタイル情報を取得することができます。

+ +
<style>
+  h3::after {
+    content: ' rocks!';
+  }
+</style>
+
+<h3>Generated content</h3>
+
+<script>
+  var h3 = document.querySelector('h3');
+  var result = getComputedStyle(h3, ':after').content;
+
+  console.log('the generated content is: ', result); // returns ' rocks!'
+</script>
+
+ +

注

+ + + +

仕様書

+ + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("CSSOM", "#dom-window-getcomputedstyle", "getComputedStyle()")}}{{Spec2("CSSOM")}}
{{SpecName("DOM2 Style", "#CSS-CSSview-getComputedStyle", "getComputedStyle()")}}{{Spec2("DOM2 Style")}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.getComputedStyle")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/getselection/index.html b/files/ja/web/api/window/getselection/index.html new file mode 100644 index 0000000000..13b908a7e5 --- /dev/null +++ b/files/ja/web/api/window/getselection/index.html @@ -0,0 +1,101 @@ +--- +title: window.getSelection +slug: Web/API/Window/getSelection +tags: + - API + - DOM + - Method + - NeedsMobileBrowserCompatibility + - Reference + - Selection + - Selection API + - Window +translation_of: Web/API/Window/getSelection +--- +
{{ ApiRef() }}
+ +

概要

+ +

ユーザーが選択した文字列の範囲やキャレットの現在位置を示す {{domxref("Selection")}} オブジェクトを返します。

+ +

構文

+ +
selection = window.getSelection();
+ +

値

+ +

A {{domxref("Selection")}} オブジェクト。

+ +

文字列へ型変換すると、空の文字列("")を追加するか {{domxref("Selection.toString()")}} を使って、選択された文字列を返します。

+ +

例

+ +
function foo() {
+    var selObj = window.getSelection();
+    alert(selObj);
+    var selRange = selObj.getRangeAt(0);
+    // 以下、取得した選択文字列に対して何らかの処理を行う
+}
+ +

注記

+ +

Selection オブジェクトの文字列表現

+ +

JavaScript では、文字列が渡されることを前提としている関数 ({{ Domxref("window.alert()") }} や {{ Domxref("document.write()") }}) にオブジェクトが渡されると、そのオブジェクトの {{jsxref("Object.toString", "toString()")}} メソッドが呼び出され、その結果が関数へ渡されます。このため、実際はプロパティとメソッドを持つオブジェクトなのに、文字列であるかのように見えてしまいます。

+ +

上の例では、{{domxref("window.alert()")}} へ渡されるときに自動的に selObj.toString() が呼び出されます。しかし、{{domxref("Selection")}} オブジェクトで JavaScript の String プロパティや length、substr などのメソッドを直に使おうとすると、オブジェクトにその名前のプロパティやメソッドが存在しないはエラーとなり、存在する場合は予期せぬ結果を返すでしょう。Selection オブジェクトを文字列として使うなら、下記のように toString() メソッドを呼び出してください。

+ +
var selectedText = selObj.toString();
+ + + + + +

同じように機能する {{domxref("Document.getSelection()")}} を呼び出すことができます。

+ +

HTML input 要素は selection を扱うための簡単な支援 API を提供しています。 (詳細: {{domxref("HTMLInputElement.setSelectionRange()")}})

+ +

selection と focus の違いに注意してください。{{domxref("Document.activeElement")}} はフォーカスされた要素を返します。

+ +

仕様

+ + + + + + + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Selection API", "#extensions-to-window-interface", "Window.getSelection()")}}{{Spec2("Selection API")}}新仕様
{{SpecName("HTML Editing", "#dom-window-getselection", "Window.getSelection()")}}{{Spec2("HTML Editing")}}初期定義
+ +

ブラウザー実装状況

+ + + +

{{Compat("api.Window.getSelection")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/hashchange_event/index.html b/files/ja/web/api/window/hashchange_event/index.html new file mode 100644 index 0000000000..5af90df187 --- /dev/null +++ b/files/ja/web/api/window/hashchange_event/index.html @@ -0,0 +1,86 @@ +--- +title: 'Window: hashchange イベント' +slug: Web/API/Window/hashchange_event +tags: + - API + - Event + - HTML DOM + - Reference + - Window + - イベント +translation_of: Web/API/Window/hashchange_event +--- +
{{APIRef}}
+ +

hashchange イベントは、 URL のフラグメント識別子 (URL の # 記号で始まり続く部分) が変化したときに発生します。

+ + + + + + + + + + + + + + + + + + + + +
バブリングあり
キャンセル不可
インターフェイス{{domxref("HashChangeEvent")}}
イベントハンドラープロパティ{{domxref("WindowEventHandlers/onhashchange", "onhashchange")}}
+ +

例

+ +

hashchange イベントは {{domxref("EventTarget/addEventListener", "addEventListener")}} メソッドの中で使用することができます。

+ +
window.addEventListener('hashchange', function() {
+  console.log('The hash has changed!')
+}, false);
+ +

または onhashchange イベントハンドラープロパティを使用して、

+ +
function locationHashChanged() {
+  if (location.hash === '#cool-feature') {
+    console.log("You're visiting a cool feature!");
+  }
+}
+
+window.onhashchange = locationHashChanged;
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('HTML WHATWG', 'indices.html#event-hashchange', 'hashchange')}}{{Spec2('HTML WHATWG')}}Initial definition
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.hashchange_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/history/index.html b/files/ja/web/api/window/history/index.html new file mode 100644 index 0000000000..e7a7e8ebc7 --- /dev/null +++ b/files/ja/web/api/window/history/index.html @@ -0,0 +1,65 @@ +--- +title: window.history +slug: Web/API/Window/history +tags: + - Gecko + - HTML DOM + - History API + - Window + - 要更新 +translation_of: Web/API/Window/history +--- +

{{ ApiRef }}

+ +

読み取り専用プロパティWindow.historyは、{{domxref("History")}}オブジェクトへの参照を返します。{{domxref("History")}}はブラウザのセッション(今開いているタブやそのページが読み込まれているウィンドウで過去に訪れたページの履歴)を操作するインターフェースを提供します。

+ +

詳細や使用例については Manipulating the browser history をご覧ください。このページでは特にpushState()メソッドや replaceState()メソッドについてセキュリティの観点から詳しく解説がなされています。これらのメソッドは注意して使う必要があります。

+ +

{{ 英語版章題("Syntax") }}

+ +

構文

+ +
var historyObj = window.history;
+
+ +

{{ 英語版章題("Example") }}

+ +

例

+ +
history.back();     // 戻るボタンを押したのと同じ効果
+history.go(-1);     // history.back();と同等の効果が得られます
+
+ +

{{ 英語版章題("Notes") }}

+ +

注記

+ +

For top-level pages you can see the list of pages in the session history, accessible via the History object, in the browser's dropdowns next to the back and forward buttons.

+ +

Historyオブジェクトはセッション履歴の他のページのURLへアクセスしようとする許可なきコードはセキュリティ上の理由から禁止しています。ただ、セッション履歴のあいだを行き来することは許可されています。

+ +

権限のないコードでセッション履歴を消去したり、戻る/進む操作を無効にしたりする方法はありません。このような機能をどうしても実現したいのならlocation.replace() メソッドを使うのがよいでしょう。このメソッドは現在のセッションを引数のURLに置き換えることができます。

+ +

{{ 英語版章題("Specification") }}

+ +

仕様

+ + + + + + + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('HTML WHATWG', 'browsers.html#the-history-interface', 'The History interface')}}{{Spec2('HTML WHATWG')}}
{{SpecName('HTML5 W3C', 'browsers.html#the-history-interface', 'The History interface')}}{{Spec2('HTML5 W3C')}}
diff --git a/files/ja/web/api/window/home/index.html b/files/ja/web/api/window/home/index.html new file mode 100644 index 0000000000..6fda8bcfbe --- /dev/null +++ b/files/ja/web/api/window/home/index.html @@ -0,0 +1,46 @@ +--- +title: window.home +slug: Web/API/Window/home +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/Window/home +--- +
{{ApiRef}}
+ +

概要

+ +

ウィンドウをホームページに移動させます。

+ +

構文

+ +
window.home()
+
+ +

例

+ +
function goHome() {
+  window.home();
+}
+
+ +

仕様

+ +

{{dom0}}

+ +

ブラウザ実装状況

+ +
+ + +

{{Compat("api.Window.home")}}

+
+ +

関連情報

+ + diff --git a/files/ja/web/api/window/index.html b/files/ja/web/api/window/index.html new file mode 100644 index 0000000000..bf5e880706 --- /dev/null +++ b/files/ja/web/api/window/index.html @@ -0,0 +1,707 @@ +--- +title: Window +slug: Web/API/Window +tags: + - API + - Browser + - DOM + - Interface + - Reference + - Tab + - Window + - global + - global scope + - scope + - インターフェイス +translation_of: Web/API/Window +--- +
{{APIRef("DOM")}}
+ +

Window インターフェイスは、 {{glossary("DOM")}} 文書を収めるウィンドウを表します。 document プロパティは、そのウィンドウに読み込まれた DOM の document オブジェクト を指します。特定の文書が属するウィンドウは、 {{domxref("document.defaultView")}} プロパティを使用して取得できます。

+ +

グローバル変数の window は、スクリプトを実行しているウィンドウを表しており、JavaScript コードに公開されます。

+ +

Window インターフェイスは、ユーザーインターフェースのウィンドウの概念とは必ずしも直接関連づかない、さまざまな関数、名前空間、オブジェクト、コンストラクターのホームです。一方、 Window インターフェイスはグローバルで使用可能であることが必要な、さまざまなアイテムを含むのに適した場所です。これらの多くは JavaScript リファレンス や DOM リファレンス で文書化しています。

+ +

タブブラウザーでは、それぞれのタブが個々の Window オブジェクトで表されます。タブ内で実行している JavaScript から見えるグローバルの window は、常にコードを実行しているタブを表します。しかし、タブブラウザーであっても {{Domxref("Window.resizeTo", "resizeTo()")}} や {{Domxref("Window.innerHeight", "innerHeight")}} のように、タブを含むウィンドウ全体に適用されるプロパティやメソッドがあります。一般に、タブに所属することができない合理的な理由があるものは、代わりにウィンドウに属します。

+ +

{{InheritanceDiagram}}

+ +

コンストラクター

+ +

DOM インターフェイスもご覧ください。

+ +
+
{{domxref("DOMParser")}}
+
DOMParser は文字列で保存された XML や HTML ソースを解析して、 DOM Document に変換できます。 DOMParser は DOM Parsing and Serialization で定められています。
+
{{domxref("Image")}}
+
{{domxref("HTMLImageElement")}} を生成します。
+
{{domxref("Option")}}
+
{{domxref("HTMLOptionElement")}} を生成します。
+
{{domxref("StaticRange")}} {{experimental_inline}} {{readonlyinline}}
+
{{domxref('StaticRange')}} オブジェクトを作成する {{domxref('StaticRange.StaticRange','StaticRange()')}} コンストラクターを返します。
+
{{domxref("Worker")}}
+
Web worker を生成します。
+
{{domxref("XMLSerializer")}}
+
{{todo("NeedsContents")}}
+
+ +

プロパティ

+ +

このインターフェイスは、 {{domxref("EventTarget")}} インターフェイスからプロパティを継承しています。また {{domxref("WindowOrWorkerGlobalScope")}} および {{domxref("WindowEventHandlers")}} ミックスインのプロパティを実装しています。

+ +

オブジェクトであるプロパティ (例えば、ビルトイン要素のプロトタイプをオーバーライドするためのもの) は、後述の個別セクションに記載しています。

+ +
+
{{domxref("Window.closed")}} {{Non-standard_inline}} {{readOnlyInline}}
+
このプロパティは、現在のウィンドウが閉じているかどうかを示します。
+
{{domxref("Window.console")}} {{ReadOnlyInline}}
+
ブラウザーのデバッグコンソールへアクセスするための console オブジェクトへの参照を返します。
+
{{domxref("Window.controllers")}} {{non-standard_inline}} {{ReadOnlyInline}}
+
現在の chrome ウィンドウの XUL controller オブジェクトを返します。
+
{{domxref("Window.customElements")}} {{ReadOnlyInline}}
+
{{domxref("CustomElementRegistry")}} オブジェクトへの参照を返します。これは新しいカスタム要素の登録や、以前に登録したカスタム要素の情報を取得するために使用できます。
+
{{domxref("Window.crypto")}} {{readOnlyInline}}
+
ブラウザーの crypto オブジェクトを返します。
+
{{domxref("Window.devicePixelRatio")}} {{non-standard_inline}} {{ReadOnlyInline}}
+
現在のディスプレイの、物理ピクセルと端末非依存ピクセルの比率を返します。
+
{{domxref("Window.dialogArguments")}} {{ReadOnlyInline}}
+
{{domxref("window.showModalDialog()")}} メソッドが呼び出されたときにウィンドウ (それがダイアログボックスである場合) に渡された引数を取得。これは {{Interface("nsIArray")}} インタフェースです。
+
{{domxref("Window.document")}} {{ReadOnlyInline}}
+
指定ウィンドウが含む文書への参照を返す
+
{{domxref("Window.DOMMatrix")}} {{readOnlyInline}} {{experimental_inline}}
+
{{domxref("DOMMatrix")}} オブジェクトへの参照を返します。これは 4x4 のマトリックスを表し、 2D や 3D の操作に適しています。
+
{{domxref("Window.DOMMatrixReadOnly")}} {{readOnlyInline}} {{experimental_inline}}
+
{{domxref("DOMMatrixReadOnly")}} オブジェクトへの参照を返します。これは 4x4 のマトリックスを表し、2D や 3D の操作に適しています。
+
{{domxref("Window.DOMPoint")}} {{readOnlyInline}} {{experimental_inline}}
+
{{domxref("DOMPoint")}} オブジェクトへの参照を返します。これはある座標系での 2D や 3D の点を表します。
+
{{domxref("Window.DOMPointReadOnly")}} {{readOnlyInline}} {{experimental_inline}}
+
{{domxref("DOMPointReadOnly")}} オブジェクトへの参照を返します。これは座標系で 2D や 3D の点を表します。
+
{{domxref("Window.DOMQuad")}} {{readOnlyInline}} {{experimental_inline}}
+
{{domxref("DOMQuad")}} オブジェクトへの参照を返します。これは 4 つの角と辺からなる四角形オブジェクトを表します。
+
{{domxref("Window.DOMRect")}} {{readOnlyInline}} {{experimental_inline}}
+
{{domxref("DOMRect")}} オブジェクトへの参照を返します。これは長方形を表します。
+
{{domxref("Window.DOMRectReadOnly")}} {{readOnlyInline}} {{experimental_inline}}
+
{{domxref("DOMRectReadOnly")}} オブジェクトへの参照を返します。これは長方形を表します。
+
{{domxref("Window.event")}} {{ReadOnlyInline}}
+
現在のイベント を返します。これは現在 JavaScript のコードのコンテキストが処理しているイベントです。また、現在処理しているイベントがない場合は undefined を返します。イベントハンドラーに直接渡した {{domxref("Event")}} オブジェクトは、可能な限り代わりに使用するべきです。
+
{{domxref("Window.frameElement")}} {{readOnlyInline}}
+
ウィンドウが埋め込まれた要素を返す。ウィンドウが埋め込まれていない場合は、 null を返す。
+
{{domxref("Window.frames")}} {{readOnlyInline}}
+
現在のウィンドウでのサブフレームの配列を返します。
+
{{domxref("Window.fullScreen")}}
+
このプロパティはウィンドウが全画面で表示されているかどうかを示します。
+
{{domxref("Window.history")}} {{ReadOnlyInline}}
+
history オブジェクトへの参照を返す
+
{{domxref("Window.innerHeight")}} {{readOnlyInline}}
+
ブラウザーウィンドウのコンテンツ領域の高さを取得し、もしあれば、水平スクロールバーを含みます。
+
{{domxref("Window.innerWidth")}} {{readOnlyInline}}
+
ブラウザーウィンドウのコンテンツ領域の幅を取得し、もしあれば、垂直スクロールバーを含みます。
+
{{domxref("Window.isSecureContext")}} {{experimental_inline}} {{readOnlyInline}}
+
コンテキストが、安全なコンテキストを必要とする機能を使用することができるかどうかを表します。
+
{{domxref("Window.length")}} {{readOnlyInline}}
+
ウィンドウ内のフレームの数を返します。 {{domxref("window.frames")}} も参照してください。
+
{{domxref("Window.location")}}
+
window オブジェクトのロケーション、または現在の URL を取得 / 設定します。
+
{{domxref("Window.locationbar")}} {{ReadOnlyInline}}
+
ウィンドウ内で表示 / 非表示の切り替え (トグル) が可能な locationbar オブジェクトを返す
+
{{domxref("Window.localStorage")}} {{readOnlyInline}}
+
生成元のオリジンからのみアクセスが可能なデータを保存するために使用する、ローカルストレージオブジェクトへの参照を返します。
+
{{domxref("Window.menubar")}} {{ReadOnlyInline}}
+
ウィンドウ内で表示 / 非表示の切り替え (トグル) が可能な menubar オブジェクトを返す
+
{{domxref("Window.messageManager")}}
+
このウィンドウの message manager オブジェクトを返します。
+
{{domxref("Window.mozInnerScreenX")}} {{ReadOnlyInline}} {{non-standard_inline}}
+
スクリーン座標系でウィンドウのビューポートの左上隅の水平 (X) 座標を返します。この値は CSS ピクセルで表します。必要に応じて画面のピクセルに換算するための係数については、{{interface("nsIDOMWindowUtils")}} の mozScreenPixelsPerCSSPixel をご覧ください。
+
{{domxref("Window.mozInnerScreenY")}} {{ReadOnlyInline}} {{non-standard_inline}}
+
スクリーン座標系で、ウィンドウビューポートの左上隅の垂直 (Y) 座標を返します。この値は CSS ピクセルで表します。必要に応じて画面のピクセルに換算するための係数については mozScreenPixelsPerCSSPixel をご覧ください。
+
{{domxref("Window.name")}}
+
ウィンドウ名を取得 / 設定します。
+
{{domxref("Window.navigator")}} {{readOnlyInline}}
+
navigator オブジェクトへの参照を返します。
+
{{domxref("Window.opener")}}
+
現在のウィンドウを開いたウィンドウへの参照を返します。
+
{{domxref("Window.orientation")}} {{non-standard_inline}} {{deprecated_inline}} {{readOnlyInline}}
+
端末の本来の向きに対して相対的なビューポートの向きを角度 (90 度単位) で返します。
+
{{domxref("Window.outerHeight")}} {{readOnlyInline}}
+
ブラウザーウィンドウの外側の高さを取得します。
+
{{domxref("Window.outerWidth")}} {{readOnlyInline}}
+
ブラウザーウィンドウの外側の幅を取得します。
+
{{domxref("Window.scrollX","Window.pageXOffset")}} {{readOnlyInline}}
+
{{domxref("window.scrollX")}} のエイリアスです。
+
{{domxref("Window.scrollY","Window.pageYOffset")}} {{readOnlyInline}}
+
{{domxref("window.scrollY")}} のエイリアスです。
+
{{domxref("Window.parent")}} {{readOnlyInline}}
+
現在のウィンドウまたはサブフレームの親ウィンドウへの参照を返します。
+
{{domxref("Window.performance")}} {{readOnlyInline}}
+
{{domxref("Performance")}} オブジェクトを返します。これは {{domxref("Performance.timing", "timing")}} や {{domxref("Performance.navigation", "navigation")}} 属性が含まれており、それぞれが パフォーマンス関連 のデータを提供するオブジェクトです。詳細情報や使用例は Using Navigation Timing をご覧ください。
+
{{domxref("Window.personalbar")}} {{readOnlyInline}}
+
ウィンドウ内で表示/非表示の切り替え (トグル) が可能な、 personalbar オブジェクトを返す
+
{{domxref("Window.screen")}} {{readOnlyInline}}
+
ウィンドウに関連付けられた screen オブジェクトへの参照を返す
+
{{domxref("Window.screenX")}} および {{domxref("Window.screenLeft")}} {{readOnlyInline}}
+
どちらのプロパティも、ユーザーのブラウザーのビューポートの左端から画面の左端までの水平方向の距離を返します。
+
{{domxref("Window.screenY")}} および {{domxref("Window.screenTop")}} {{readOnlyInline}}
+
どちらのプロパティも、ユーザーのブラウザーのビューポートの上端から画面の上端までの垂直方向の距離を返します。
+
{{domxref("Window.scrollbars")}} {{readOnlyInline}}
+
ウィンドウ内で表示 / 非表示の切り替え (トグル) が可能な、 scrollbars オブジェクトを返す
+
{{domxref("Window.scrollMaxX")}} {{non-standard_inline}} {{ReadOnlyInline}}
+
ウィンドウが水平スクロールされ得る最大オフセット、すなわち、文書の幅からビューポートの幅を引いたものです。
+
{{domxref("Window.scrollMaxY")}} {{non-standard_inline}} {{ReadOnlyInline}}
+
ウィンドウが垂直スクロールされ得る最大オフセット (すなわち、文書の高さからビューポートの高さを引いたもの) です。
+
{{domxref("Window.scrollX")}} {{readOnlyInline}}
+
文書が現在水平にスクロールされているピクセル数を返します。
+
{{domxref("Window.scrollY")}} {{readOnlyInline}}
+
文書が現在垂直にスクロールされているピクセル数を返します。
+
{{domxref("Window.self")}} {{ReadOnlyInline}}
+
window オブジェクト自身へのオブジェクト参照を返す
+
{{domxref("Window.sessionStorage")}}
+
生成元のオリジンからのみアクセスが可能なデータを保存するために使用する、セッションストレージへの参照を返します。
+
{{domxref("Window.sidebar")}} {{non-standard_inline}} {{ReadOnlyInline}}
+
サイドバーの window オブジェクトへの参照を返します。
+
{{domxref("Window.speechSynthesis")}} {{ReadOnlyInline}}
+
{{domxref("SpeechSynthesis")}} オブジェクトを返します。これは、Web Speech API の音声合成機能を使用するためのエントリーポイントです。
+
{{domxref("Window.status")}}
+
ブラウザー下部のステータスバーのテキストを取得 / 設定します。
+
{{domxref("Window.statusbar")}} {{readOnlyInline}}
+
ウィンドウ内で表示 / 非表示の切り替え (トグル) が可能な statusbar オブジェクトを返します。
+
{{domxref("Window.toolbar")}} {{readOnlyInline}}
+
ウィンドウ内で表示 / 非表示の切り替え (トグル) が可能な toolbar オブジェクトを返します。
+
{{domxref("Window.top")}} {{readOnlyInline}}
+
ウィンドウ階層における最上位のウィンドウへの参照を返します。このプロパティは読み取り専用です。
+
{{domxref("Window.visualViewport")}} {{readOnlyInline}}
+
指定したウィンドウの視覚的なビューポートを表す {{domxref("VisualViewport")}} オブジェクトを返します。
+
{{domxref("Window.window")}} {{ReadOnlyInline}}
+
現在のウィンドウへの参照を返します。
+
window[0]、window[1] など
+
フレーム内の window オブジェクトへの参照を返します。詳しくは {{domxref("Window.frames")}} をご覧ください。
+
+ +

他のところで実装されているプロパティ

+ +
+
{{domxref("WindowOrWorkerGlobalScope.caches")}} {{readOnlyinline}}
+
現在のコンテキストに関連付けられた {{domxref("CacheStorage")}} オブジェクトを返します。このオブジェクトはオフラインで使用する資産を格納したり、リクエストに対して独自のレスポンスを生成したりするような機能が利用できます。
+
{{domxref("WindowOrWorkerGlobalScope.indexedDB")}} {{readonlyInline}}
+
Indexed データベースにアプリケーションが非同期にアクセスできる仕組みを提供します。このプロパティは {{domxref("IDBFactory")}} オブジェクトを返します。
+
{{domxref("WindowOrWorkerGlobalScope.isSecureContext")}} {{readOnlyinline}}
+
現在のコンテキストが安全である (true) か否か (false) を示す論理値を返します。
+
{{domxref("WindowOrWorkerGlobalScope.origin")}} {{readOnlyinline}}
+
グローバルオブジェクトのオリジンを、文字列としてシリアライズして返します。 (これはまだどのブラウザーでも実装されていません。)
+
+ +

廃止されたプロパティ

+ +
+
{{domxref("Window.content")}} および Window._content {{Non-standard_inline}} {{obsolete_inline}} {{ReadOnlyInline}}
+
現在のウィンドウでのコンテンツ要素への参照を返します。 Firefox 57 より (当初は Nightly のみ) どちらも chrome (特権付き) コードに限り使用でき、ウェブでは使用できません。
+
{{domxref("Window.defaultStatus")}} {{obsolete_inline}}
+
指定ウィンドウのステータスバーのテキストを取得 / 設定
+
{{domxref("Window.directories")}} {{obsolete_inline}}
+
{{domxref("window.personalbar")}} と同義
+
{{domxref("Window.globalStorage")}} {{Non-standard_inline}} {{obsolete_inline}}
+
複数のページに渡ってデータを保存するために使用する、複数のストレージオブジェクトを表していました。
+
{{domxref("Window.mozAnimationStartTime")}} {{Non-standard_inline}} {{obsolete_inline}}
+
現在のアニメーションサイクルが開始したときから経過した時間をミリ秒単位で表します。代わりに {{domxref("Animation.startTime")}} を使用してください。
+
{{domxref("Window.mozPaintCount")}} {{non-standard_inline}} {{obsolete_inline}}
+
当該ウィンドウで、現在の文書を画面に描画した回数を返します。これは、描画パフォーマンスの算定に使用できます。
+
{{domxref("Window.pkcs11")}} {{obsolete_inline}}
+
PKCS11 モジュールのインストールや削除を行う機能を提供していました。
+
{{domxref("Window.returnValue")}} {{obsolete_inline}}
+
ウィンドウをモーダルダイアログとして表示する {{domxref("window.showModalDialog()")}} メソッドを呼び出した関数へ返却される返値です。
+
+ +

メソッド

+ +

このインターフェイスは {{domxref("EventTarget")}} インターフェイスからメソッドを継承します。また {{domxref("WindowOrWorkerGlobalScope")}} および {{domxref("EventTarget")}} のプロパティを実装します。

+ +
+
{{domxref("Window.alert()")}}
+
警告ダイアログを表示します。
+
{{domxref("Window.blur()")}}
+
ウィンドウからフォーカスを外します。
+
{{domxref("Window.cancelAnimationFrame()")}} {{experimental_inline}}
+
{{domxref("Window.requestAnimationFrame")}} によって過去にスケジューリングされたコールバックをキャンセルできます。
+
{{domxref("Window.cancelIdleCallback()")}} {{experimental_inline}}
+
{{domxref("Window.requestIdleCallback")}} によって過去にスケジューリングされたコールバックをキャンセルできます。
+
{{domxref("Window.clearImmediate()")}}
+
setImmediate で設定した繰り返し処理をキャンセルします。
+
{{domxref("Window.close()")}}
+
現在のウィンドウを閉じます。
+
{{domxref("Window.confirm()")}}
+
ユーザーの応答が必要なメッセージを持つダイアログを表示します。
+
{{domxref("Window.dump()")}} {{Non-standard_inline}}
+
コンソールにメッセージを出力します。
+
{{domxref("Window.find()")}}
+
ウィンドウ内で指定された文字列を検索します。
+
{{domxref("Window.focus()")}}
+
現在のウィンドウにフォーカスを当てます。
+
{{domxref("Window.getComputedStyle()")}}
+
特定の要素の計算済みスタイルを取得します。計算済みスタイルは、要素のすべての CSS プロパティの計算値を示します。
+
{{domxref("Window.getDefaultComputedStyle()")}} {{Non-standard_inline}}
+
特定の要素について、作者のスタイルシートを無視したデフォルトの計算済みスタイルを取得します。
+
{{domxref("Window.getSelection()")}}
+
選択されたアイテムを表す、セレクションオブジェクトを返します。
+
{{domxref("Window.matchMedia()")}}
+
指定したメディアクエリ文字列を表す {{domxref("MediaQueryList")}} オブジェクトを返します。
+
{{domxref("Window.maximize()")}}
+
{{todo("NeedsContents")}}
+
{{domxref("Window.minimize()")}} (最上位の XUL ウィンドウに限る)
+
ウィンドウを最小化します。
+
{{domxref("Window.moveBy()")}}
+
現在のウィンドウを指定した距離移動します。
+
{{domxref("Window.moveTo()")}}
+
ウィンドウを指定した位置に移動します。
+
{{domxref("Window.open()")}}
+
新しいウィンドウを開きます。
+
{{domxref("Window.postMessage()")}}
+
あるウィンドウから別のウィンドウへ、安全にデータ文字列を送信する手段を提供します。送信先ウィンドウは、送信元と同じドメインでなくてもかまいません。
+
{{domxref("Window.print()")}}
+
現在の文書を印刷するためのダイアログを開きます。
+
{{domxref("Window.prompt()")}}
+
ユーザーが入力ダイアログに入力したテキストを返します。
+
{{domxref("Window.requestAnimationFrame()")}}
+
アニメーションが進行中であることをブラウザーに伝えて、次のアニメーションフレームのためにウィンドウの再描画を予定するよう要求します。
+
{{domxref("Window.requestIdleCallback()")}} {{experimental_inline}}
+
ブラウザーがアイドル状態であるときに実行するタスクをスケジューリングします。
+
{{domxref("Window.resizeBy()")}}
+
現在のウィンドウを、指定した大きさの分だけ変更します。
+
{{domxref("Window.resizeTo()")}}
+
ウィンドウを動的にリサイズします。
+
{{domxref("Window.scroll()")}}
+
ウィンドウを文書内の特定の位置にスクロールします。
+
{{domxref("Window.scrollBy()")}}
+
ウィンドウ内の文書を、指定した距離の分だけスクロールします。
+
{{domxref("Window.scrollByLines()")}} {{Non-standard_inline}}
+
文書を指定した行数分、スクロールします。
+
{{domxref("Window.scrollByPages()")}} {{Non-standard_inline}}
+
文書を指定したページ数分、スクロールします。
+
{{domxref("Window.scrollTo()")}}
+
文書内の特定の位置に、ウィンドウをスクロールします。
+
{{domxref("Window.setCursor()")}} {{Non-standard_inline}} (トップレベルの XUL ウィンドウに限る)
+
現在のウィンドウのカーソルを変更します。
+
{{domxref("Window.setImmediate()")}}
+
ブラウザーで他の高負荷なタスクが完了した後に、関数を実行します。
+
{{domxref("Window.setResizable()")}} {{Non-standard_inline}}
+
ユーザーがウィンドウをリサイズできるかを切り替えます。
+
{{domxref("Window.sizeToContent()")}} {{Non-standard_inline}}
+
コンテンツに応じてウィンドウのサイズを調整します。
+
{{domxref("Window.stop()")}}
+
ウィンドウの読み込み処理を停止します。
+
{{domxref("Window.updateCommands()")}} {{Non-standard_inline}}
+
現在の chrome ウィンドウ (UI) のコマンドの状態を更新します。
+
+ +

他のところで実装されているメソッド

+ +
+
{{domxref("EventTarget.addEventListener()")}}
+
ウィンドウの特定の種類のイベントにイベントハンドラーを登録します。
+
{{domxref("EventTarget.dispatchEvent()")}}
+
イベントを動作させるために使用します。
+
{{domxref("WindowOrWorkerGlobalScope.atob()")}}
+
Base64 エンコーディングを使用してエンコードされたデータの文字列をデコードします。
+
{{domxref("WindowOrWorkerGlobalScope.btoa()")}}
+
バイナリデータを Base64 でエンコードした ASCII 文字列を生成します。
+
{{domxref("WindowOrWorkerGlobalScope.clearInterval()")}}
+
{{domxref("WindowOrWorkerGlobalScope.setInterval()")}} で繰り返し実行されるよう設定された命令をキャンセルします。
+
{{domxref("WindowOrWorkerGlobalScope.clearTimeout()")}}
+
{{domxref("WindowOrWorkerGlobalScope.setTimeout()")}} で遅延実行するよう設定した命令をキャンセルします。
+
{{domxref("WindowOrWorkerGlobalScope.createImageBitmap()")}}
+
さまざまな画像ソースを受け入れて、{{domxref("ImageBitmap")}} に解決される {{domxref("Promise")}} を返します。任意で、始点 (sx, sy) から幅 sw、高さ sh の長方形でソースを切り抜くことができます。
+
{{domxref("WindowOrWorkerGlobalScope.fetch()")}}
+
ネットワークからリソースを取り込む処理を開始します。
+
{{domxref("EventTarget.removeEventListener")}}
+
window からイベントリスナーを削除します。
+
{{domxref("WindowOrWorkerGlobalScope.setInterval()")}}
+
ミリ秒単位で指定した時間が経過するたびに関数を実行するようスケジューリングします。
+
{{domxref("WindowOrWorkerGlobalScope.setTimeout()")}}
+
指定した時間が経過したら関数を実行するようスケジューリングします。
+
+ +

廃止されたメソッド

+ +
+
{{domxref("Window.back()")}} {{Non-standard_inline}} {{obsolete_inline}}
+
ウィンドウの履歴をひとつ戻ります。このメソッドは廃止されました。代わりに {{domxref("History.back", "window.history.back()")}} を使用してください。
+
{{domxref("Window.captureEvents()")}} {{Non-standard_inline}} {{obsolete_inline}}
+
特定のタイプのイベントをすべてキャプチャするよう、ウィンドウに登録します。
+
{{domxref("Window.forward()")}} {{Non-standard_inline}} {{obsolete_inline}}
+
履歴でひとつ先の文書に移動します。このメソッドは廃止されました。代わりに {{domxref("History.forward", "window.history.forward()")}} を使用してください。
+
{{domxref("Window.getAttention()")}} {{Non-standard_inline}} {{obsolete_inline}}
+
アプリケーションアイコンをフラッシュさせます。
+
{{domxref("Window.home()")}} {{Non-standard_inline}} {{obsolete_inline}}
+
ブラウザーのホームページに戻ります。
+
{{domxref("Window.openDialog()")}} {{Non-standard_inline}} {{obsolete_inline}}
+
新しいダイアログウィンドウを開きます。
+
{{domxref("Window.releaseEvents()")}} {{Non-standard_inline}} {{obsolete_inline}}
+
特定のタイプのイベントのキャプチャを解放します。
+
{{domxref("Window.showModalDialog()")}} {{Non-standard_inline}} {{obsolete_inline}}
+
モーダルダイアログを表示します。
+
+ +

イベントハンドラー

+ +

これらは window オブジェクトのプロパティで、ウィンドウで発生する可能性がある、関心事となる可能性がある様々な出来事に対するイベントハンドラーを設定して有効にすることができます。

+ +

このインターフェイスは、 {{domxref("EventTarget")}} インターフェイスからイベントハンドラーを継承しています。また {{domxref("WindowEventHandlers")}} のイベントハンドラーを実装ていします。

+ +
+

メモ: {{Gecko("9.0")}} より、あるイベントハンドラープロパティが存在するかを調べるために if ("onabort" in window) という構文を使用できます。これは、 web IDL インターフェイスを適正にするためにイベントハンドラーインターフェイスが更新されたためです。詳しくは DOM のイベントハンドラーをご覧ください。

+
+ +
+
{{domxref("Window.onappinstalled")}}
+
ページがウェブアプリとしてインストールされたときに呼び出されます。 {{domxref("Window/appinstalled_event", "appinstalled")}} イベントをご覧ください。
+
{{domxref("Window.onbeforeinstallprompt")}}
+
モバイル環境でウェブサイトをホーム画面に保存するかどうかをユーザーに尋ねる前に呼び出されるイベントハンドラープロパティです。
+
{{domxref("Window.ondevicelight")}}
+
環境光のレベルが変化したイベントのイベントハンドラープロパティです。
+
{{domxref("Window.ondevicemotion")}}
+
加速度センサーが変化を検知した場合に呼び出されます (モバイル端末向け)
+
{{domxref("Window.ondeviceorientation")}}
+
向きが変化したときに呼び出されます (モバイル端末向け)
+
{{domxref("Window.ondeviceorientationabsolute")}} {{non-standard_inline}}
+
端末の向きが変化したイベントのイベントハンドラープロパティです。
+
{{domxref("Window.ondeviceproximity")}}
+
端末の proximity イベントのイベントハンドラープロパティです。
+
{{domxref("Window.ongamepadconnected")}}
+
ゲームパッドがコンピューターに接続された ({{event('gamepadconnected')}} イベントが発生した) ときに実行するイベントハンドラーを表します。
+
{{domxref("Window.ongamepaddisconnected")}}
+
ゲームパッドがコンピューターから取り外された ({{event('gamepaddisconnected')}} イベントが発生した) ときに実行するイベントハンドラーを表します。
+
{{domxref("Window.onmozbeforepaint")}}
+
MozBeforePaint イベントのイベントハンドラープロパティです。 {{domxref("Window.mozRequestAnimationFrame()")}} メソッドの呼び出しによってイベントが要求された場合に、ウィンドウを再描画する前に送信されます。
+
{{domxref("Window.onpaint")}}
+
ウィンドウの描画イベントのイベントハンドラーです。
+
{{domxref("Window.onrejectionhandled")}} {{experimental_inline}}
+
{{jsxref("Promise")}} の失敗イベントを扱うためのイベントハンドラープロパティです。
+
{{domxref("Window.onuserproximity")}}
+
ユーザーの近接イベントのためのイベントハンドラープロパティです。
+
{{domxref("Window.onvrdisplayconnect")}}
+
互換性がある VR 端末がコンピューターに接続された ({{event("vrdisplayconnected")}} イベントが発生した) ときに実行するイベントハンドラーを表します。
+
{{domxref("Window.onvrdisplaydisconnect")}}
+
互換性がある VR 端末がコンピューターから取り外された ({{event("vrdisplaydisconnected")}} イベントが発生した) ときに実行するイベントハンドラーを表します。
+
{{domxref("Window.onvrdisplayactivate")}}
+
HMD がスタンバイ状態から復帰した、あるいは装着によって起動したなどにより、ディスプレイが実行可能になった ({{event("vrdisplayactivate")}} イベントが発生) ときに実行するイベントハンドラーを表します。
+
{{domxref("Window.onvrdisplaydeactivate")}}
+
HMD が未使用時間によってスタンバイ状態やスリープ状態に移行したなど、ディスプレイが実行可能状態ではなくなった ({{event("vrdisplaydeactivate")}} イベントが発生) ときに実行するイベントハンドラーを表します。
+
{{domxref("Window.onvrdisplayblur")}}
+
ユーザーがシステムメニューやブラウザーを操作している間に追跡を妨げたり体験が失われたりするなど、ブラウザー、OS、VR ハードウェアによるなんらかの理由でディスプレーの表示が一時停止した ({{event("vrdisplayblur")}} イベントが発生) ときに実行するイベントハンドラーを表します。
+
{{domxref("Window.onvrdisplayfocus")}}
+
ディスプレイの表示が blur 状態から復帰した ({{event("vrdisplayfocus")}} イベントが発生) ときに実行するイベントハンドラーを表します。
+
{{domxref("Window.onvrdisplaypresentchange")}}
+
表示状態から非表示状態に変化した、あるいはその逆の変化など、VR 端末の表示状態が変化した ({{event("vrdisplaypresentchange")}} イベントが発生) ときに実行するイベントハンドラーを表します。
+
+ +

他で実装されているイベントハンドラー

+ +
+
{{domxref("GlobalEventHandlers.onabort")}}
+
ユーザーが読み込み処理中にキャンセルしたなど、リソースの読み込みが異常終了した際に呼び出されます。
+
{{domxref("WindowEventHandlers.onafterprint")}}
+
印刷ダイアログボックスを閉じたときに呼び出されます。{{event("afterprint")}} イベントをご覧ください。
+
{{domxref("WindowEventHandlers.onbeforeprint")}}
+
印刷ダイアログボックスを開いたときに呼び出されます。{{event("beforeprint")}} イベントをご覧ください。
+
{{domxref("WindowEventHandlers.onbeforeunload")}}
+
window でイベントをアンロードする前のイベントハンドラープロパティです。
+
{{domxref("GlobalEventHandlers.onblur")}}
+
ポップアップなどにより、ウィンドウがフォーカスを失った後に呼び出されます。
+
{{domxref("GlobalEventHandlers.onchange")}}
+
window の change イベントのイベントハンドラープロパティです。
+
{{domxref("GlobalEventHandlers.onclick")}}
+
いずれかのマウスボタンを押した後および離した後に呼び出されます。
+
{{domxref("GlobalEventHandlers.ondblclick")}}
+
いずれかのマウスボタンをダブルクリックしたときに呼び出されます。
+
{{domxref("GlobalEventHandlers.onclose")}}
+
ウィンドウを閉じた後に呼び出されます。
+
{{domxref("GlobalEventHandlers.oncontextmenu")}}
+
右マウスボタンを押したときに呼び出されます。
+
{{domxref("GlobalEventHandlers.onerror")}}
+
リソースの読み込みが失敗したとき、あるいは実行時にエラーが発生したときに呼び出されます。{{event("error")}} イベントをご覧ください。
+
{{domxref("GlobalEventHandlers.onfocus")}}
+
ウィンドウがフォーカスを得た、あるいは取り戻した後に呼び出されます。{{event("focus")}} イベントをご覧ください。
+
{{domxref("WindowEventHandlers.onhashchange")}} {{gecko_minversion_inline("1.9.2")}}
+
window の {{event('hashchange')}} イベントのイベントハンドラープロパティです。URL のハッシュ記号 ("#") の後の部分が変化したときに呼び出されます。
+
{{domxref("GlobalEventHandlers.oninput")}}
+
<input> 要素の値が変化したときに呼び出されます。
+
{{domxref("GlobalEventHandlers.onkeydown")}}
+
なんらかのキーを押下し始めたときに呼び出されます。{{event("keydown")}} イベントをご覧ください。
+
{{domxref("GlobalEventHandlers.onkeypress")}}
+
キー (Shift、Fn、CapsLock を除く) を押下した状態であるときに呼び出されます。{{event("keypress")}} をご覧ください。
+
{{domxref("GlobalEventHandlers.onkeyup")}}
+
なんらかのキーを押し終えたときに呼び出されます。{{event("keyup")}} イベントをご覧ください。
+
{{domxref("WindowEventHandlers.onlanguagechange")}}
+
window の {{event("languagechange")}} イベントのイベントハンドラープロパティです。
+
{{domxref("GlobalEventHandlers.onload")}}
+
すべてのリソースおよび DOM が完全に読み込まれた後に呼び出されます。戻るボタンなどで、キャッシュからページが読み込まれたときは呼び出されません。
+
{{domxref("WindowEventHandlers.onmessage")}}
+
{{event("message")}} イベントが発生したときに呼び出すコードを表す {{domxref("EventHandler")}} です。
+
{{domxref("GlobalEventHandlers.onmousedown")}}
+
いずれかのマウスボタンを押したときに呼び出されます。
+
{{domxref("GlobalEventHandlers.onmousemove")}}
+
マウスをウィンドウ内で動かすときに、連続的に呼び出されます。
+
{{domxref("GlobalEventHandlers.onmouseout")}}
+
マウスポインターがウィンドウから外れたときに呼び出されます。
+
{{domxref("GlobalEventHandlers.onmouseover")}}
+
マウスポインターがウィンドウ内に入ったときに呼び出されます。
+
{{domxref("GlobalEventHandlers.onmouseup")}}
+
いずれかのマウスボタンを離したときに呼び出されます。
+
{{domxref("WindowEventHandlers.onoffline")}}
+
ネットワーク接続が失われたときに呼び出されます。{{event("offline")}} イベントをご覧ください。
+
{{domxref("WindowEventHandlers.ononline")}}
+
ネットワーク接続が確立されたときに呼び出されます。{{event("online")}} イベントをご覧ください。
+
{{domxref("WindowEventHandlers.onpagehide")}}
+
ユーザーがあるページから去ったとき、onunload イベントの前に呼び出されます。{{event("pagehide")}} イベントをご覧ください。
+
{{domxref("WindowEventHandlers.onpageshow")}}
+
すべてのリソースおよび DOM が完全に読み込まれた後に呼び出されます。{{event("pageshow")}} イベントをご覧ください。
+
{{domxref("WindowEventHandlers.onpopstate")}}
+
戻るボタンが押されたときに呼び出されます。
+
{{domxref("GlobalEventHandlers.onreset")}}
+
フォームがリセットされたときに呼び出されます。
+
{{domxref("GlobalEventHandlers.onresize")}}
+
ウィンドウのリサイズに応じて、連続的に呼び出されます。
+
{{domxref("GlobalEventHandlers.onscroll")}}
+
なんらかの方法でスクロールバーが動かされたときに呼び出されます。リソースがウィンドウ内に完全に収まっている場合は、このイベントを発生させられません。
+
{{domxref("GlobalEventHandlers.onwheel")}}
+
マウスホイールがいずれかの軸に沿って回されたときに呼び出されます。
+
{{domxref("GlobalEventHandlers.onselect")}}
+
入力フィールド内のテキストが選択された後に呼び出されます。
+
{{domxref("GlobalEventHandlers.onselectionchange")}}
+
{{event("selectionchange")}} イベントが発生したときに呼び出すコードを表す {{domxref("EventHandler")}} です。
+
{{domxref("WindowEventHandlers.onstorage")}}
+
セッションストレージまたはローカルストレージが変化したときに呼び出されます。 {{event("storage")}} イベントをご覧ください。
+
{{domxref("GlobalEventHandlers.onsubmit")}}
+
フォームが送信されたときに呼び出されます。
+
{{domxref("WindowEventHandlers.onunhandledrejection")}} {{experimental_inline}}
+
処理されていない {{jsxref("Promise")}} の失敗イベントを扱うためのイベントハンドラープロパティです。
+
{{domxref("WindowEventHandlers.onunload")}}
+
ユーザーがページから去ったときに呼び出されます。
+
+ +

イベント

+ +

これらのイベントを待ち受けするには、 {{domxref("EventTarget/addEventListener", "addEventListener()")}} を使用するか、イベントリスナーをこのインターフェイスの onイベント名 プロパティに代入するかしてください。

+ +
+
{{domxref("Window/error_event", "error")}}
+
リソースの読み込みに失敗したか、利用できないときに発生します。例えば、スクリプトに実行エラーがあった場合や、画像が見つからなかったり、向こうであったりした場合です。
+ {{domxref("GlobalEventHandlers/onerror", "onerror")}} プロパティからも利用できます。
+
{{domxref("Window/languagechange_event", "languagechange")}}
+
ユーザーの推奨される言語が変更されたときに、グローバルスコープオブジェクトに発生します。
+ {{domxref("WindowEventHandlers/onlanguagechange", "onlanguagechange")}} プロパティからも利用できます。
+
{{domxref("Window/orientationchange_event", "orientationchange")}}
+
端末の向きが変化したときに発生します。
+ {{domxref("Window/onorientationchange", "onorientationchange")}} プロパティからも利用できます。
+
{{domxref("Window/devicemotion_event", "devicemotion")}}
+
定期的に発生し、利用できる場合は、端末にかかっている物理的な加速度の量と傾きを示します。
+
{{domxref("Window/deviceorientation_event", "deviceorientation")}}
+
現在の端末の向きを地球の座標軸と比較する時期包囲センサーから新しいデータが利用できるようになったときに発生します。
+
{{domxref("Document/defaultView/resize_event", "resize")}}
+
Fired when the window has been resized.
+ {{domxref("GlobalEventHandlers/onresize", "onresize")}} プロパティからも利用できます。
+
{{domxref("Document/defaultView/storage_event", "storage")}}
+
ストレージ領域 (localStorage または sessionStorage) が他の文書のコンテキストから変更されたときに発生します。
+ {{domxref("WindowEventHandlers/onstorage", "onstorage")}} プロパティからも利用できます。
+
+ +

アニメーションイベント

+ +
+
{{domxref("Window/animationcancel_event", "animationcancel")}}
+
アニメーションが予期せず中断されたときに発生します。
+ {{domxref("GlobalEventHandlers/onanimationcancel", "onanimationcancel")}} プロパティからも利用できます。
+
{{domxref("Window/animationend_event", "animationend")}}
+
アニメーションが正常に終了したときに発生します。
+ {{domxref("GlobalEventHandlers/onanimationend", "onanimationend")}} プロパティからも利用できます。
+
{{domxref("Window/animationiteration_event", "animationiteration")}}
+
アニメーションが一巡したときに発生します。
+ {{domxref("GlobalEventHandlers/onanimationiteration", "onanimationiteration")}} プロパティからも利用できます。
+
{{domxref("Window/animationstart_event", "animationstart")}}
+
アニメーションが開始されたときに発生します。
+ {{domxref("GlobalEventHandlers/onanimationstart", "onanimationstart")}} プロパティからも利用できます。
+
+ +

クリップボードイベント

+ +
+
{{domxref("Window/clipboardchange_event", "clipboardchange")}}
+
システムクリップボードの内容が変化したときに発生します。
+
{{domxref("Window/copy_event", "copy")}}
+
ブラウザーのユーザーインターフェイスからユーザーがコピー操作を行ったときに発生します。
+ {{domxref("HTMLElement/oncopy", "oncopy")}} プロパティからも利用できます。
+
{{domxref("Window/cut_event", "cut")}}
+
ブラウザーのユーザーインターフェイスからユーザーが切り取り操作を行ったときに発生します。
+ {{domxref("HTMLElement/oncut", "oncut")}} プロパティからも利用できます。
+
{{domxref("Window/paste_event", "paste")}}
+
ブラウザーのユーザーインターフェイスからユーザーが貼り付け操作を行ったときに発生します。
+ {{domxref("HTMLElement/onpaste", "onpaste")}} プロパティからも利用できます。
+
+ +

接続イベント

+ +
+
{{domxref("Window/offline_event", "offline")}}
+
ブラウザーがネットワークへのアクセスから切断され、 navigator.onLine の値が false に変わったときに発生します。
+ {{domxref("WindowEventHandlers.onoffline", "onoffline")}} プロパティからも利用できます。
+
{{domxref("Window/online_event", "online ")}}
+
ブラウザーがネットワークへのアクセスに接続され、 navigator.onLine の値が true に変わったときに発生します。
+ {{domxref("WindowEventHandlers.ononline", "ononline")}} プロパティからも利用できます。
+
+ +

フォーカスイベント

+ +
+
{{domxref("Window/blur_event", "blur")}}
+
要素がフォーカスを失ったときに発生します。
+ {{domxref("GlobalEventHandlers/onblur", "onblur")}} プロパティからも利用できます。
+
{{domxref("Window/focus_event", "focus")}}
+
要素がフォーカスを得たときに発生します。
+ {{domxref("GlobalEventHandlers/onfocus", "onfocus")}} プロパティからも利用できます。/dd>
+
+ +

ゲームパッドイベント

+ +
+
{{domxref("Window/gamepadconnected_event", "gamepadconnected")}}
+
ゲームパッドが接続された、またはゲームパッドのボタンや軸が初めて使用されたことをブラウザーが検出したときに発生します。
+ {{domxref("Window/ongamepadconnected", "ongamepadconnected")}} プロパティからも利用できます。
+
{{domxref("Window/gamepaddisconnected_event", "gamepaddisconnected")}}
+
ゲームパッドが切断されたことをブラウザーが検出したときに発生します。
+ {{domxref("Window/ongamepaddisconnected", "ongamepaddisconnected")}} プロパティからも利用できます。/dd>
+
+ +

履歴イベント

+ +
+
{{domxref("Window/hashchange_event", "hashchange")}}
+
URL のフラグメント識別子 (URL の中で # 記号で始まり、それに続く部分) が変化したときに発生します。
+ {{domxref("WindowEventHandlers/onhashchange", "onhashchange")}} プロパティからも利用できます。
+
{{domxref("Window/pagehide_event", "pagehide")}}
+
ブラウザーが現在の文書を非表示にして、その場所にセッションの履歴とは異なる文書を表示するよう切り替えているときに送信されます。これはたとえば、ユーザーが「戻る」ボタンをクリックしたとき、または「進む」ボタンをクリックしてセッション履歴を先に進めたときに発生します。
+ onpagehide イベントハンドラープロパティからも利用できます。
+
{{domxref("Window/pageshow_event", "pageshow")}}
+
ページが最初に読み込まれたときだけでなく、ユーザーが同じタブ内で別のページに移動した後にページに戻ったときなど、ナビゲーションタスクのためにブラウザーが文書を表示するときに送信されます。
+ onpageshow イベントハンドラープロパティからも利用できます。
+
{{domxref("Document/defaultView/popstate_event", "popstate")}}
+
アクティブな履歴項目が変化したときに発生します。
+ {{domxref("WindowEventHandlers/onpopstate", "onpopstate")}} イベントハンドラープロパティからも利用できます。
+
+ +

ロード・アンロードイベント

+ +
+
{{domxref("Window/beforeunload_event", "beforeunload")}}
+
ウィンドウ、文書、そのリソースがアンロードされるときに発生します。
+ {{domxref("WindowEventHandlers/onbeforeunload", "onbeforeunload")}} プロパティからも利用できます。
+
{{domxref("Window/DOMContentLoaded_event", "DOMContentLoaded")}}
+
文書が完全に読み込まれて解析されたときに、スタイルシート、画像、サブフレームの読み込みが完了するのを待たずに発生します。
+
{{domxref("Window/load_event", "load")}}
+
スタイルシートや画像などの依存するすべてのリソースを含め、ページ全体の読み込みが完了したときに発生します。
+ {{domxref("GlobalEventHandlers/onload", "onload")}} プロパティからも利用できます。
+
{{domxref("Window/unload_event", "unload")}}
+
文書や子リソースがアンロードされるときに発生します。
+ {{domxref("WindowEventHandlers/onunload", "onunload")}} プロパティからも利用できます。
+
+ +

マニフェストイベント

+ +
+
{{domxref("Window/appinstalled_event", "appinstalled")}}
+
ブラウザーがページをアプリケーションとしてインストールすることに成功したときに発生します。
+ {{domxref("Window/onappinstalled", "onappinstalled")}} プロパティからも利用できます。
+
{{domxref("Window/beforeinstallprompt_event", "beforeinstallprompt")}}
+
ウェブアプリケーションをインストールすることをユーザーに問い合わせようとするときに発生します。
+ {{domxref("Window/onbeforeinstallprompt", "onbeforeinstallprompt")}} プロパティからも利用できます。
+
+ +

メッセージイベント

+ +
+
{{domxref("Window/message_event", "message")}}
+
ウィンドウがメッセージを受け取ったとき、例えば他のブラウザーのコンテキストから {{domxref("Window/postMessage", "Window.postMessage()")}} が呼び出された時に発生します。
+ {{domxref("WindowEventHandlers/onmessage", "onmessage")}} プロパティからも利用できます。
+
{{domxref("Window/messageerror_event", "messageerror")}}
+
Window オブジェクトが復元できないメッセージを受信したときに発生します。
+ {{domxref("WindowEventHandlers/onmessageerror", "onmessageerror")}} プロパティからも利用できます。
+
+ + + +
+
{{domxref("Window/afterprint_event", "afterprint")}}
+
関連づけられた文書の印刷が始まったか、印刷プレビューが閉じた後に発生します。
+ {{domxref("WindowEventHandlers/onafterprint", "onafterprint")}} プロパティからも利用できます。
+
{{domxref("Window/beforeprint_event", "beforeprint")}}
+
関連づけられた文書の印刷が始まるか、印刷プレビューが表示されるときに発生します。
+ {{domxref("WindowEventHandlers/onbeforeprint", "onbeforeprint")}} プロパティからも利用できます。
+
+ +

Promise 拒否イベント

+ +
+
{{domxref("Window/rejectionhandled_event", "rejectionhandled")}}
+
拒否を処理するハンドラーがあるかどうかにかかわらず、 JavaScript の {{jsxref("Promise")}} が拒否されるたびに送られます。
+ {{domxref("WindowEventHandlers/onrejectionhandled", "onrejectionhandled")}} イベントハンドラープロパティからも利用できます。
+
{{domxref("Window/unhandledrejection_event", "unhandledrejection")}}
+
JavaScript の {{jsxref("Promise")}} が拒否されたものの、拒否を処理するハンドラーがないときに送られます。
+ {{domxref("WindowEventHandlers/onunhandledrejection", "onunhandledrejection")}} イベントハンドラープロパティからも利用できます。
+
+ +

トランジションイベント

+ +
+
{{domxref("Window/transitioncancel_event", "transitioncancel")}}
+
CSS トランジションが中止されたときに発生します。
+ {{domxref("GlobalEventHandlers/ontransitioncancel", "ontransitioncancel")}} プロパティからも利用できます。
+
{{domxref("Window/transitionend_event", "transitionend")}}
+
CSS トランジションが完了したときに発生します。
+ {{domxref("GlobalEventHandlers/ontransitionend", "ontransitionend")}} プロパティからも利用できます。
+
{{domxref("Window/transitionrun_event", "transitionrun")}}
+
CSS トランジションが初めて作成されたときに発生します。
+ {{domxref("GlobalEventHandlers/ontransitionrun", "ontransitionrun")}} プロパティからも利用できます。
+
{{domxref("Window/transitionstart_event", "transitionstart")}}
+
CSS トランジションが実際に開始されたときに発生します。
+ {{domxref("GlobalEventHandlers/ontransitionstart", "ontransitionstart")}} プロパティからも利用できます。
+
+ +

WebVR イベント

+ +
+
{{domxref("Window/vrdisplayactivate_event", "vrdisplayactivate")}}
+
VR ディスプレイが表示する準備ができたとき、例えば HMD がスタンバイ状態に移行したり、装着して準備ができたときに発生します。
+ {{domxref("Window/onvrdisplayactivate", "onvrdisplayactivate")}} プロパティからも利用できます。
+
{{domxref("Window/vrdisplayblur_event", "vrdisplayblur")}}
+
ブラウザー、 OS、 VR ハードウェアの何れかが原因で、 VR ディスプレイの表示が停止したときに発生します。
+ {{domxref("Window/onvrdisplayblur", "onvrdisplayblur")}} プロパティからも利用できます。
+
{{domxref("Window/vrdisplayconnect_event", "vrdisplayconnect")}}
+
互換性のある VR ディスプレイがコンピューターに接続されたときに発生します。
+ {{domxref("Window/onvrdisplayconnect", "onvrdisplayconnect")}} プロパティからも利用できます。
+
{{domxref("Window/vrdisplaydeactivate_event", "vrdisplaydeactivate")}}
+
VR ディスプレイが表示をやめる可能性があるとき、例えば HMD が一定時間使用されなかったためにスタンバイまたはスリープモードに入ったときなどに発生します。
+ {{domxref("Window/onvrdisplaydeactivate", "onvrdisplaydeactivate")}} プロパティからも利用できます。
+
{{domxref("Window/vrdisplaydisconnect_event", "vrdisplaydisconnect")}}
+
互換性のある VR ディスプレイがコンピュータから切り離されたときに発生します。
+ {{domxref("Window/onvrdisplaydisconnect", "onvrdisplaydisconnect")}} プロパティからも利用できます。
+
{{domxref("Window/vrdisplayfocus_event", "vrdisplayfocus")}}
+
VR ディスプレイへの表示を休んだ後で復帰したときに発生します。
+ {{domxref("Window/onvrdisplayfocus", "onvrdisplayfocus")}} プロパティからも利用できます。
+
{{domxref("Window/vrdisplaypresentchange_event", "vrdisplaypresentchange")}}
+
VR ディスプレイの表示状態が変化したときに発生します。 — すなわち、表示を始めたり、表示を消したり、などです。
+ {{domxref("Window/onvrdisplaypresentchange", "onvrdisplaypresentchange")}} プロパティからも利用できます。
+
{{domxref("Window/vrdisplaypointerrestricted_event", "vrdisplaypointerrestricted")}}
+
VR ディスプレイのポインター入力の消費が pointerlocked 要素によって抑止されたときに発生します。
+ {{domxref("Window/onvrdisplaypointerrestricted", "onvrdisplaypointerrestricted")}} プロパティからも利用できます。
+
{{domxref("Window/vrdisplaypointerunrestricted_event", "vrdisplaypointerunrestricted")}}
+
VR ディスプレイのポインター入力の消費が pointerlocked 要素によって抑止が解除されたときに発生します。
+ {{domxref("Window/onvrdisplaypointerunrestricted", "onvrdisplaypointerunrestricted")}} プロパティからも利用できます。
+
+ +

インターフェイス

+ +

DOM リファレンス をご覧ください。

+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window")}}

diff --git a/files/ja/web/api/window/innerheight/index.html b/files/ja/web/api/window/innerheight/index.html new file mode 100644 index 0000000000..2b1a4d2ac1 --- /dev/null +++ b/files/ja/web/api/window/innerheight/index.html @@ -0,0 +1,99 @@ +--- +title: Window.innerHeight +slug: Web/API/Window/innerHeight +tags: + - API + - CSSOM + - CSSOM View + - HTML DOM + - NeedsInteractiveExample + - Property + - Reference + - View + - Window + - height + - innerHeight +translation_of: Web/API/Window/innerHeight +--- +
{{APIRef}}
+ +

innerHeight は {{domxref("Window")}} インターフェイスの読み取り専用プロパティで、ウィンドウの内部の高さをピクセル単位で返します。水平スクロールバーがあれば、その高さを含みます。

+ +

innerHeight の値はウィンドウの{{Glossary("layout viewport", "レイアウトビューポート")}}の高さから取られます。幅は {{domxref("Window.innerWidth", "innerWidth")}} プロパティを使用して取ることができます。

+ +

構文

+ +
let intViewportHeight = window.innerHeight;
+ +

値

+ +

整数値で、ウィンドウのレイアウトビューポートの高さをピクセル単位で示します。このプロパティは読み取り専用で、既定値はありません。

+ +

ウィンドウの幅を変更するには、 {{domxref("Window.resizeTo", "resizeTo()")}} や {{domxref("Window.resizeBy", "resizeBy()")}} などの寸法変更メソッドの一つを呼び出してください。

+ +

使用上の注意

+ +

ウィンドウから水平スクロールバーや境界を引いた高さを取得するには、ルートの {{HTMLElement("html")}} 要素の {{domxref("Element.clientHeight", "clientHeight()")}} プロパティを代わりに使用してください。

+ +

innerHeight および innerWidth はすべてのウィンドウと、ウィンドウのように動作するすべてのオブジェクト、例えばタブやフレームで利用できます。

+ +

例

+ +

フレームセットの想定

+ +
var intFrameHeight = window.innerHeight; // or
+
+var intFrameHeight = self.innerHeight;
+// フレームセット内にあるフレームのビューポートの高さを返します
+
+var intFramesetHeight = parent.innerHeight;
+// 最も近いフレームセットのビューポートの高さを返します
+
+var intOuterFramesetHeight = top.innerHeight;
+// もっとも外側のフレームセットのビューポートの高さを返します
+
+ +

{{todo("link to an interactive demo here")}}

+ +

ウィンドウの寸法を変更するには、 {{domxref("window.resizeBy()")}} と {{domxref("window.resizeTo()")}} を参照してください。

+ +

ウィンドウの外形の高さ、すなわちブラウザーウィンドウ全体の高さを取得するには、 {{domxref("window.outerHeight")}} を参照してください。

+ +

図

+ +

以下の図は outerHeight と innerHeight の違いを示しています。

+ +

innerHeight vs outerHeight illustration

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('CSSOM View', '#dom-window-innerheight', 'window.innerHeight')}}{{Spec2('CSSOM View')}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.innerHeight")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/innerwidth/index.html b/files/ja/web/api/window/innerwidth/index.html new file mode 100644 index 0000000000..dd390a3561 --- /dev/null +++ b/files/ja/web/api/window/innerwidth/index.html @@ -0,0 +1,83 @@ +--- +title: Window.innerWidth +slug: Web/API/Window/innerWidth +tags: + - API + - CSSOM View + - HTML DOM + - Layout + - Property + - Reference + - Window + - innerWidth + - width +translation_of: Web/API/Window/innerWidth +--- +
{{APIRef}}
+ +

{{domxref("Window")}} の innerWidth プロパティは読み取り専用で、ウィンドウの内部の幅をピクセル単位で返します。これには垂直スクロールバーがある場合、その幅を含みます。

+ +

もっと詳細に言えば、innerWidth の値はウィンドウの{{Glossary("layout viewport", "レイアウトビューポート")}}の幅から取られます。ウィンドウの内部の高さは {{domxref("Window.innerHeight", "innerHeight")}} プロパティを使用して取ることができます。

+ +

構文

+ +
let intViewportWidth = window.innerWidth;
+ +

値

+ +

整数値で、ウィンドウのレイアウトビューポートの幅をピクセル単位で示します。このプロパティは読み取り専用で、既定値はありません。

+ +

ウィンドウの幅を変更するには、 {{domxref("Window")}} の寸法の変更メソッドのうちの一つ、例えば {{domxref("Window.resizeBy", "resizeBy()")}} や {{domxref("Window.resizeTo", "resizeTo()")}} などを呼び出してください。

+ +

使用上の注意

+ +

ウィンドウからスクロールバーや境界を引いた幅を取得するには、ルートの {{HTMLElement("html")}} 要素の {{domxref("Element.clientWidth", "clientWidth")}} プロパティを代わりに使用してください。

+ +

innerWidth はすべてのウィンドウと、ウィンドウのように動作するすべてのオブジェクト、例えばタブやフレームで利用できます。

+ +

例

+ +
// これはビューポートの幅を返す
+var intFrameWidth = window.innerWidth;
+
+// これはフレームセット内のフレームビューポートの幅を返す
+var intFrameWidth = self.innerWidth;
+
+// これは直近のフレームセットのビューポートの幅を返す
+var intFramesetWidth = parent.innerWidth;
+
+// これはもっとも外側のフレームセットのビューポートの幅を返す
+var intOuterFramesetWidth = top.innerWidth;
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('CSSOM View', '#dom-window-innerwidth', 'window.innerWidth')}}{{Spec2('CSSOM View')}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.innerWidth")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/issecurecontext/index.html b/files/ja/web/api/window/issecurecontext/index.html new file mode 100644 index 0000000000..cafa0e3300 --- /dev/null +++ b/files/ja/web/api/window/issecurecontext/index.html @@ -0,0 +1,126 @@ +--- +title: Window.isSecureContext +slug: Web/API/Window/isSecureContext +tags: + - API + - Property + - Reference + - Security + - Window +translation_of: Web/API/Window/isSecureContext +--- +

{{APIRef}}{{SeeCompatTable}}

+ +

window.isSecureContext 読み取り専用プロパティは、コンテキストが 安全なコンテキスト を必要とする機能を使用できるかどうかを示します。

+ +

構文

+ +
var isSecure = window.isSecureContext
+ +

例

+ +

機能検出

+ +

グローバルスコープの isSecureContext の真偽値を用いることで、安全なコンテクストかどうかをチェックすることで機能検出できます。

+ +
if (window.isSecureContext) {
+  // Page is a secure context so service workers are now available
+  navigator.serviceWorker.register("/offline-worker.js").then(function () {
+    ...
+  });
+}
+ +

仕様

+ + + + + + + + + + + + + + +
仕様ステータスコメント
{{SpecName('Secure Contexts')}}{{Spec2('Secure Contexts','#monkey-patching-global-object','isSecureContext')}}初期定義。
+ +

ブラウザー実装状況

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
基本サポート{{CompatVersionUnknown}}{{CompatGeckoDesktop(49)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
window.opener の考慮{{CompatNo}}{{CompatGeckoDesktop(49)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能AndroidAndroid WebviewFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
基本サポート{{CompatNo}}{{CompatVersionUnknown}}{{CompatGeckoMobile(49)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}
window.opener の考慮{{CompatNo}}{{CompatVersionUnknown}}{{CompatGeckoMobile(49)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

関連項目

+ + diff --git a/files/ja/web/api/window/languagechange_event/index.html b/files/ja/web/api/window/languagechange_event/index.html new file mode 100644 index 0000000000..9addb7cb55 --- /dev/null +++ b/files/ja/web/api/window/languagechange_event/index.html @@ -0,0 +1,82 @@ +--- +title: 'Window: languagechange イベント' +slug: Web/API/Window/languagechange_event +tags: + - Event + - Experimental + - HTML DOM + - Reference + - Window + - イベント +translation_of: Web/API/Window/languagechange_event +--- +
{{APIRef}}
+ +

languagechange イベントはグローバルスコープオブジェクトで、ユーザーの推奨言語が変更されたときに発生します。

+ + + + + + + + + + + + + + + + + + + + +
バブリングいいえ
キャンセル不可
インターフェイス{{domxref("Event")}}
イベントハンドラー{{domxref("WindowEventHandlers/onlanguagechange", "onlanguagechange")}}
+ +

例

+ +

languagechange は {{domxref("EventTarget/addEventListener", "addEventListener")}} メソッドで使用することができます。

+ +
window.addEventListener('languagechange', function() {
+  console.log('languagechange event detected!');
+});
+ +

または、 {{domxref("WindowEventHandlers/onlanguagechange", "onlanguagechange")}} イベントハンドラープロパティを使用することもできます。

+ +
window.onlanguagechange = function(event) {
+  console.log('languagechange event detected!');
+};
+ +

仕様書

+ + + + + + + + + + + + + + +
仕様書状態
{{ SpecName('HTML WHATWG', 'indices.html#event-languagechange', 'languagechange') }}{{ Spec2('HTML WHATWG') }}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.languagechange_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/length/index.html b/files/ja/web/api/window/length/index.html new file mode 100644 index 0000000000..2cf903eeae --- /dev/null +++ b/files/ja/web/api/window/length/index.html @@ -0,0 +1,54 @@ +--- +title: window.length +slug: Web/API/Window/length +tags: + - API + - Gecko + - HTML DOM + - Property + - Reference + - Window +translation_of: Web/API/Window/length +--- +
{{ApiRef}}
+ +

概要

+ +

ウィンドウにおけるフレーム（{{HTMLElement("frame")}} か {{HTMLElement("iframe")}} 要素のいずれか）の数を返します。

+ +

構文

+ +
framesCount = window.length;
+
+ + + +

例

+ +
if (window.length) {
+  // サブフレーム数が 0 でない場合の処理をここに記述
+}
+ +

仕様

+ + + + + + + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('HTML WHATWG','browsers.html#dom-length','Window.length')}}{{Spec2('HTML WHATWG')}}
{{SpecName('HTML5 W3C', 'browsers.html#dom-length', 'Window.length')}}{{Spec2('HTML5 W3C')}}
diff --git a/files/ja/web/api/window/load_event/index.html b/files/ja/web/api/window/load_event/index.html new file mode 100644 index 0000000000..c0070a8f9a --- /dev/null +++ b/files/ja/web/api/window/load_event/index.html @@ -0,0 +1,162 @@ +--- +title: 'Window: load イベント' +slug: Web/API/Window/load_event +tags: + - DOM + - Event + - Reference + - Window + - load +translation_of: Web/API/Window/load_event +--- +
{{APIRef}}
+ +

load イベントは、ページ全体が、スタイルシートや画像などのすべての依存するリソースを含めて読み込まれたときに発生します。これは {{domxref("Document/DOMContentLoaded_event", "DOMContentLoaded")}} が、ページの DOM の読み込みが完了すれば、リソースの読み込みが完了するのを待たずに発生するのと対照的です。

+ + + + + + + + + + + + + + + + + + + + +
バブリングなし
キャンセル不可
インターフェイス{{domxref("Event")}}
イベントハンドラープロパティ{{domxref("GlobalEventHandlers/onload", "onload")}}
+ +

例

+ +

ページが完全に読み込まれたときに、メッセージを記録します。

+ +
window.addEventListener('load', (event) => {
+  console.log('ページが完全に読み込まれました');
+});
+ +

同じですが、 onload イベントハンドラープロパティの場合です。

+ +
window.onload = (event) => {
+  console.log('page is fully loaded');
+};
+
+ +

ライブデモ

+ +

HTML

+ +
<div class="controls">
+  <button id="reload" type="button">Reload</button>
+</div>
+
+<div class="event-log">
+  <label>Event log:</label>
+  <textarea readonly class="event-log-contents" rows="8" cols="30"></textarea>
+</div>
+ + + +

JS

+ +
const log = document.querySelector('.event-log-contents');
+const reload = document.querySelector('#reload');
+
+reload.addEventListener('click', () => {
+  log.textContent ='';
+  window.setTimeout(() => {
+      window.location.reload(true);
+  }, 200);
+});
+
+window.addEventListener('load', (event) => {
+    log.textContent = log.textContent + 'load\n';
+});
+
+document.addEventListener('readystatechange', (event) => {
+    log.textContent = log.textContent + `readystate: ${document.readyState}\n`;
+});
+
+document.addEventListener('DOMContentLoaded', (event) => {
+    log.textContent = log.textContent + `DOMContentLoaded\n`;
+});
+
+
+ +

結果

+ +

{{ EmbedLiveSample('Live_example', '100%', '160px') }}

+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('UI Events', '#event-type-load', 'load')}}{{Spec2('UI Events')}}
{{SpecName('HTML WHATWG', 'parsing.html#the-end:event-load', 'Load event')}}{{Spec2('HTML WHATWG')}}このリンクは文書の読み込みの最後に実行されるステップの章へのリンクです。 load イベントは他の多くの要素でも発生します。そして、load イベントを遅延させる ものに言及している箇所が仕様書の中に多く存在することに注意してください。
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.load_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/localstorage/index.html b/files/ja/web/api/window/localstorage/index.html new file mode 100644 index 0000000000..5fc78d7ba2 --- /dev/null +++ b/files/ja/web/api/window/localstorage/index.html @@ -0,0 +1,148 @@ +--- +title: Window.localStorage +slug: Web/API/Window/localStorage +tags: + - API + - Property + - Read-only + - Reference + - Storage + - Web Storage + - Window + - WindowLocalStorage + - localStorage +translation_of: Web/API/Window/localStorage +--- +

{{APIRef()}}

+ +

localStorage プロパティはローカルの {{domxref("Storage")}} オブジェクトにアクセスすることができます。 localStorage は sessionStorage によく似ています。唯一の違いは、localStorage に保存されたデータには保持期間の制限はなく、sessionStorage に保存されたデータはセッションが終わると同時に（ブラウザが閉じられたときに）クリアされてしまうことです。

+ +

localStorageまたはsessionStorageに保存されるデータはそのページのプロトコル固有であることに注意する必要があります。

+ +

構文

+ +
myStorage = localStorage;
+ +

値

+ +

現在のオリジンの local storageスペースにアクセスするのに使用できる {{domxref("Storage")}} オブジェクトを返します。

+ +

例外

+ +
+
SecurityError
+
リクエストがポリシーの決定に反している、またはオリジンが妥当な scheme/host/port tupleでない (これは例えば、オリジンが file: や data: スキームを使うときに起こります)。例えば、ユーザーがブラウザー設定で特定オリジンへのデータ永続化のパーミッションを拒否していることもあります。
+
+ +

例

+ +

以下のスニペットでは現在のドメインのローカル {{domxref("Storage")}} オブジェクトにアクセスし、{{domxref("Storage.setItem()")}} を利用してデータを追加しています。

+ +
localStorage.setItem('myCat', 'Tom');
+ +

localStorage 項目の読み込みの文法は以下の通り:

+ +
var cat = localStorage.getItem("myCat");
+ +

localStorage 項目の削除の文法は以下の通り:

+ +
localStorage.removeItem("myCat");
+ +
+

注: 詳細な使用例は Using the Web Storage API の記事を参照してください。

+
+ +

仕様

+ + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName('HTML WHATWG', 'webstorage.html#dom-localstorage', 'localStorage')}}{{Spec2('HTML WHATWG')}}
+ +

ブラウザ実装状況

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
localStorage4{{CompatVersionUnknown}}3.5810.504
sessionStorage5{{CompatVersionUnknown}}2810.504
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
機能AndroidEdgeFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
基本サポート2.1{{CompatVersionUnknown}}{{ CompatUnknown }}811iOS 3.2
+
+ +

すべてのブラウザは localStorage と {{domxref("sessionStorage")}} に対する容量変更ができるようになっています。詳しくはこちらを参照してください。

+ +
+

注: iOS 5.1 からは、Safari Mobile は localStorage データをキャッシュフォルダーに保存し、そこは時々 OS の指示で (よくあるのはスペースが少ない場合) 掃除されがちです。Safari Mobile のプライベートブラウジングモードでも、まったく localStorage が使用できません。

+
+ +

関連情報

+ + diff --git a/files/ja/web/api/window/location/index.html b/files/ja/web/api/window/location/index.html new file mode 100644 index 0000000000..ef245d5503 --- /dev/null +++ b/files/ja/web/api/window/location/index.html @@ -0,0 +1,212 @@ +--- +title: Window.location +slug: Web/API/Window/location +tags: + - API + - HTML + - Reference + - Window + - プロパティ +translation_of: Web/API/Window/location +--- +

{{APIRef}}

+ +

Window.location 読み取り専用プロパティは、document の現在位置についての情報を持つ {{domxref("Location")}} オブジェクトを返します。

+ +

Window.location は read-only の Location オブジェクトであるにも関わらず、これに {{domxref("DOMString")}} を代入することもできます。これはつまり、多くの場合 location を文字列として扱えることを意味します。例えば location = 'http://www.example.com' は location.href = 'http://www.example.com' と同義です。

+ +

すべての利用可能なプロパティについては、 {{domxref("Location")}} を参照してください。

+ +

構文

+ +
var oldLocation = location;
+location = newLocation;
+
+ +

例

+ +

基本的な例

+ +
alert(location); // alerts "https://developer.mozilla.org/ja/docs/Web/API/Window/location"
+ +

例 #1: 新しいページへ移動する

+ +

location オブジェクトに新しい値が代入されるたびに、 location.assign() が変更された URL で呼び出され、その URL の文書が読み込まれます。ただし、 CORS などのセキュリティ設定により、この動作が妨げられる可能性があるので注意してください。

+ +
location.assign("http://www.mozilla.org"); // または
+location = "http://www.mozilla.org";
+
+ +

例 #2: 現在のページのサーバーからの強制的な再読み込み

+ +
location.reload(true);
+ +

例 #3

+ +

次の例を見てみましょう。これは、 location.pathname の値をハッシュに挿入するため、 replace() メソッドを使用してページを再読み込みします。

+ +
function reloadPageWithHash() {
+  var initialPage = location.pathname;
+  location.replace('http://example.com/#' + initialPage);
+}
+
+ +

例 #4: 現在の URL のプロパティを alert ダイアログに表示する

+ +
function showLoc() {
+  var oLocation = location, aLog = ["Property (Typeof): Value", "location (" + (typeof oLocation) + "): " + oLocation ];
+  for (var sProp in oLocation){
+  aLog.push(sProp + " (" + (typeof oLocation[sProp]) + "): " + (oLocation[sProp] || "n/a"));
+  }
+  alert(aLog.join("\n"));
+}
+
+// html では: <button onclick="showLoc();">location プロパティを表示</button>
+
+ +

例 #5: search プロパティを変更してデータの文字列をサーバーへ送信する

+ +
function sendData (sData) {
+  location.search = sData;
+}
+
+// html では: <button onclick="sendData('Some data');">データを送信</button>
+
+ +

現在の URL に "?Some%20data" が追加されてサーバーへ送信されます (サーバー側で何も起こらない場合、現在の文書が、変更された search 文字列で再読み込みされます)。

+ +

例 #6: hash プロパティを変更せずにブックマークを使用

+ +
<!doctype html>
+<html>
+<head>
+<meta charset="UTF-8"/>
+<title>MDN Example</title>
+<script>
+function showNode (oNode) {
+  document.documentElement.scrollTop = oNode.offsetTop;
+  document.documentElement.scrollLeft = oNode.offsetLeft;
+}
+
+function showBookmark (sBookmark, bUseHash) {
+  if (arguments.length === 1 || bUseHash) { location.hash = sBookmark; return; }
+  var oBookmark = document.querySelector(sBookmark);
+  if (oBookmark) { showNode(oBookmark); }
+}
+</script>
+<style>
+span.intLink {
+    cursor: pointer;
+    color: #0000ff;
+    text-decoration: underline;
+}
+</style>
+</head>
+
+<body>
+<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ultrices dolor ac dolor imperdiet ullamcorper. Suspendisse quam libero, luctus auctor mollis sed, malesuada condimentum magna. Quisque in ante tellus, in placerat est. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec a mi magna, quis mattis dolor. Etiam sit amet ligula quis urna auctor imperdiet nec faucibus ante. Mauris vel consectetur dolor. Nunc eget elit eget velit pulvinar fringilla consectetur aliquam purus. Curabitur convallis, justo posuere porta egestas, velit erat ornare tortor, non viverra justo diam eget arcu. Phasellus adipiscing fermentum nibh ac commodo. Nam turpis nunc, suscipit a hendrerit vitae, volutpat non ipsum.</p>
+<p>Duis lobortis sapien quis nisl luctus porttitor. In tempor semper libero, eu tincidunt dolor eleifend sit amet. Ut nec velit in dolor tincidunt rhoncus non non diam. Morbi auctor ornare orci, non euismod felis gravida nec. Curabitur elementum nisi a eros rutrum nec blandit diam placerat. Aenean tincidunt risus ut nisi consectetur cursus. Ut vitae quam elit. Donec dignissim est in quam tempor consequat. Aliquam aliquam diam non felis convallis suscipit. Nulla facilisi. Donec lacus risus, dignissim et fringilla et, egestas vel eros. Duis malesuada accumsan dui, at fringilla mauris bibendum quis. Cras adipiscing ultricies fermentum. Praesent bibendum condimentum feugiat.</p>
+<p id="myBookmark1">[&nbsp;<span class="intLink" onclick="showBookmark('#myBookmark2');">Go to bookmark #2</span>&nbsp;]</p>
+<p>Vivamus blandit massa ut metus mattis in fringilla lectus imperdiet. Proin ac ante a felis ornare vehicula. Fusce pellentesque lacus vitae eros convallis ut mollis magna pellentesque. Pellentesque placerat enim at lacus ultricies vitae facilisis nisi fringilla. In tincidunt tincidunt tincidunt. Nulla vitae tempor nisl. Etiam congue, elit vitae egestas mollis, ipsum nisi malesuada turpis, a volutpat arcu arcu id risus.</p>
+<p>Nam faucibus, ligula eu fringilla pulvinar, lectus tellus iaculis nunc, vitae scelerisque metus leo non metus. Proin mattis lobortis lobortis. Quisque accumsan faucibus erat, vel varius tortor ultricies ac. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nec libero nunc. Nullam tortor nunc, elementum a consectetur et, ultrices eu orci. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque a nisl eu sem vehicula egestas.</p>
+<p>Aenean viverra varius mauris, sed elementum lacus interdum non. Phasellus sit amet lectus vitae eros egestas pellentesque fermentum eget magna. Quisque mauris nisl, gravida vitae placerat et, condimentum id metus. Nulla eu est dictum dolor pulvinar volutpat. Pellentesque vitae sollicitudin nunc. Donec neque magna, lobortis id egestas nec, sodales quis lectus. Fusce cursus sollicitudin porta. Suspendisse ut tortor in mauris tincidunt rhoncus. Maecenas tincidunt fermentum facilisis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
+<p>Suspendisse turpis nisl, consectetur in lacinia ut, ornare vel mi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin non lectus eu turpis vulputate cursus. Mauris interdum tincidunt erat id pharetra. Nullam in libero elit, sed consequat lectus. Morbi odio nisi, porta vitae molestie ut, gravida ut nunc. Ut non est dui, id ullamcorper orci. Praesent vel elementum felis. Maecenas ornare, dui quis auctor hendrerit, turpis sem ullamcorper odio, in auctor magna metus quis leo. Morbi at odio ante.</p>
+<p>Curabitur est ipsum, porta ac viverra faucibus, eleifend sed eros. In sit amet vehicula tortor. Vestibulum viverra pellentesque erat a elementum. Integer commodo ultricies lorem, eget tincidunt risus viverra et. In enim turpis, porttitor ac ornare et, suscipit sit amet nisl. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque vel ultrices nibh. Sed commodo aliquam aliquam. Nulla euismod, odio ut eleifend mollis, nisi dui gravida nibh, vitae laoreet turpis purus id ipsum. Donec convallis, velit non scelerisque bibendum, diam nulla auctor nunc, vel dictum risus ipsum sit amet est. Praesent ut nibh sit amet nibh congue pulvinar. Suspendisse dictum porttitor tempor.</p>
+<p>Vestibulum dignissim erat vitae lectus auctor ac bibendum eros semper. Integer aliquet, leo non ornare faucibus, risus arcu tristique dolor, a aliquet massa mauris quis arcu. In porttitor, lectus ac semper egestas, ligula magna laoreet libero, eu commodo mauris odio id ante. In hac habitasse platea dictumst. In pretium erat diam, nec consequat eros. Praesent augue mi, consequat sed porttitor at, volutpat vitae eros. Sed pretium pharetra dapibus. Donec auctor interdum erat, lacinia molestie nibh commodo ut. Maecenas vestibulum vulputate felis, ut ullamcorper arcu faucibus in. Curabitur id arcu est. In semper mollis lorem at pellentesque. Sed lectus nisl, vestibulum id scelerisque eu, feugiat et tortor. Pellentesque porttitor facilisis ultricies.</p>
+<p id="myBookmark2">[&nbsp;<span class="intLink" onclick="showBookmark('#myBookmark1');">Go to bookmark #1</span> | <span class="intLink" onclick="showBookmark('#myBookmark1', false);">Go to bookmark #1 without using location.hash</span> | <span class="intLink" onclick="showBookmark('#myBookmark3');">Go to bookmark #3</span>&nbsp;]</p>
+<p>Phasellus tempus fringilla nunc, eget sagittis orci molestie vel. Nulla sollicitudin diam non quam iaculis ac porta justo venenatis. Quisque tellus urna, molestie vitae egestas sit amet, suscipit sed sem. Quisque nec lorem eu velit faucibus tristique ut ut dolor. Cras eu tortor ut libero placerat venenatis ut ut massa. Sed quis libero augue, et consequat libero. Morbi rutrum augue sed turpis elementum sed luctus nisl molestie. Aenean vitae purus risus, a semper nisl. Pellentesque malesuada, est id sagittis consequat, libero mauris tincidunt tellus, eu sagittis arcu purus rutrum eros. Quisque eget eleifend mi. Duis pharetra mi ac eros mattis lacinia rutrum ipsum varius.</p>
+<p>Fusce cursus pulvinar aliquam. Duis justo enim, ornare vitae elementum sed, porta a quam. Aliquam eu enim eu libero mollis tempus. Morbi ornare aliquam posuere. Proin faucibus luctus libero, sed ultrices lorem sagittis et. Vestibulum malesuada, ante nec molestie vehicula, quam diam mollis ipsum, rhoncus posuere mauris lectus in eros. Nullam feugiat ultrices augue, ac sodales sem mollis in.</p>
+<p id="myBookmark3"><em>Here is the bookmark #3</em></p>
+<p>Proin vitae sem non lorem pellentesque molestie. Nam tempus massa et turpis placerat sit amet sollicitudin orci sodales. Pellentesque enim enim, sagittis a lobortis ut, tempus sed arcu. Aliquam augue turpis, varius vel bibendum ut, aliquam at diam. Nam lobortis, dui eu hendrerit pellentesque, sem neque porttitor erat, non dapibus velit lectus in metus. Vestibulum sit amet felis enim. In quis est vitae nunc malesuada consequat nec nec sapien. Suspendisse aliquam massa placerat dui lacinia luctus sed vitae risus. Fusce tempus, neque id ultrices volutpat, mi urna auctor arcu, viverra semper libero sem vel enim. Mauris dictum, elit non placerat malesuada, libero elit euismod nibh, nec posuere massa arcu eu risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer urna velit, dapibus eget varius feugiat, pellentesque sit amet ligula. Maecenas nulla nisl, facilisis eu egestas scelerisque, mollis eget metus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Morbi sed congue mi.</p>
+<p>Fusce metus velit, pharetra at vestibulum nec, facilisis porttitor mi. Curabitur ligula sapien, fermentum vel porttitor id, rutrum sit amet magna. Sed sit amet sollicitudin turpis. Aenean luctus rhoncus dolor, et pulvinar ante egestas et. Donec ac massa orci, quis dapibus augue. Vivamus consectetur auctor pellentesque. Praesent vestibulum tincidunt ante sed consectetur. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Fusce purus metus, imperdiet vitae iaculis convallis, bibendum vitae turpis.</p>
+<p>Fusce aliquet molestie dolor, in ornare dui sodales nec. In molestie sollicitudin felis a porta. Mauris nec orci sit amet orci blandit tristique congue nec nunc. Praesent et tellus sollicitudin mauris accumsan fringilla. Morbi sodales, justo eu sollicitudin lacinia, lectus sapien ullamcorper eros, quis molestie urna elit bibendum risus. Proin eget tincidunt quam. Nam luctus commodo mauris, eu posuere nunc luctus non. Nulla facilisi. Vivamus eget leo rhoncus quam accumsan fringilla. Aliquam sit amet lorem est. Nullam vel tellus nibh, id imperdiet orci. Integer egestas leo eu turpis blandit scelerisque.</p>
+<p>Etiam in blandit tellus. Integer sed varius quam. Vestibulum dapibus mi gravida arcu viverra blandit. Praesent tristique augue id sem adipiscing pellentesque. Sed sollicitudin, leo sed interdum elementum, nisi ante condimentum leo, eget ornare libero diam semper quam. Vivamus augue urna, porta eget ultrices et, dapibus ut ligula. Ut laoreet consequat faucibus. Praesent at lectus ut lectus malesuada mollis. Nam interdum adipiscing eros, nec sodales mi porta nec. Proin et quam vitae sem interdum aliquet. Proin vel odio at lacus vehicula aliquet.</p>
+<p>Etiam placerat dui ut sem ornare vel vestibulum augue mattis. Sed semper malesuada mi, eu bibendum lacus lobortis nec. Etiam fringilla elementum risus, eget consequat urna laoreet nec. Etiam mollis quam non sem convallis vel consectetur lectus ullamcorper. Aenean mattis lacus quis ligula mattis eget vestibulum diam hendrerit. In non placerat mauris. Praesent faucibus nunc quis eros sagittis viverra. In hac habitasse platea dictumst. Suspendisse eget nisl erat, ac molestie massa. Praesent mollis vestibulum tincidunt. Fusce suscipit laoreet malesuada. Aliquam erat volutpat. Aliquam dictum elementum rhoncus. Praesent in est massa, pulvinar sodales nunc. Pellentesque gravida euismod mi ac convallis.</p>
+<p>Mauris vel odio vel nulla facilisis lacinia. Aliquam ultrices est at leo blandit tincidunt. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Suspendisse porttitor adipiscing facilisis. Duis cursus quam iaculis augue interdum porttitor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Duis vulputate magna ac metus pretium condimentum. In tempus, est eget vestibulum blandit, velit massa dignissim nisl, ut scelerisque lorem neque vel velit. Maecenas fermentum commodo viverra. Curabitur a nibh non velit aliquam cursus. Integer semper condimentum tortor a pellentesque. Pellentesque semper, nisl id porttitor vehicula, sem dui feugiat lacus, vitae consequat augue urna vel odio.</p>
+<p>Vestibulum id neque nec turpis iaculis pulvinar et a massa. Vestibulum sed nibh vitae arcu eleifend egestas. Mauris fermentum ultrices blandit. Suspendisse vitae lorem libero. Aenean et pellentesque tellus. Morbi quis neque orci, eu dignissim dui. Fusce sollicitudin mauris ac arcu vestibulum imperdiet. Proin ultricies nisl sit amet enim imperdiet eu ornare dui tempus. Maecenas lobortis nisi a tortor vestibulum vel eleifend tellus vestibulum. Donec metus sapien, hendrerit a fermentum id, dictum quis libero.</p>
+<p>Pellentesque a lorem nulla, in tempor justo. Duis odio nisl, dignissim sed consequat sit amet, hendrerit ac neque. Nunc ac augue nec massa tempor rhoncus. Nam feugiat, tellus a varius euismod, justo nisl faucibus velit, ut vulputate justo massa eu nibh. Sed bibendum urna quis magna facilisis in accumsan dolor malesuada. Morbi sit amet nunc risus, in faucibus sem. Nullam sollicitudin magna sed sem mollis id commodo libero condimentum. Duis eu massa et lacus semper molestie ut adipiscing sem.</p>
+<p>Sed id nulla mi, eget suscipit eros. Aliquam tempus molestie rutrum. In quis varius elit. Nullam dignissim neque nec velit vulputate porttitor. Mauris ac ligula sit amet elit fermentum rhoncus. In tellus urna, pulvinar quis condimentum ut, porta nec justo. In hac habitasse platea dictumst. Proin volutpat elit id quam molestie ac commodo lacus sagittis. Quisque placerat, augue tempor placerat pulvinar, nisi nisi venenatis urna, eget convallis eros velit quis magna. Suspendisse volutpat iaculis quam, ut tristique lacus luctus quis.</p>
+<p>Nullam commodo suscipit lacus non aliquet. Phasellus ac nisl lorem, sed facilisis ligula. Nam cursus lobortis placerat. Sed dui nisi, elementum eu sodales ac, placerat sit amet mauris. Pellentesque dapibus tellus ut ipsum aliquam eu auctor dui vehicula. Quisque ultrices laoreet erat, at ultrices tortor sodales non. Sed venenatis luctus magna, ultricies ultricies nunc fringilla eget. Praesent scelerisque urna vitae nibh tristique varius consequat neque luctus. Integer ornare, erat a porta tempus, velit justo fermentum elit, a fermentum metus nisi eu ipsum. Vivamus eget augue vel dui viverra adipiscing congue ut massa. Praesent vitae eros erat, pulvinar laoreet magna. Maecenas vestibulum mollis nunc in posuere. Pellentesque sit amet metus a turpis lobortis tempor eu vel tortor. Cras sodales eleifend interdum.</p>
+</body>
+</html>
+
+ +

... 同じことをアニメーションするページスクロールで行うと:

+ +
var showBookmark = (function () {
+  var  _useHash, _scrollX, _scrollY, _nodeX, _nodeY, _itFrame, _scrollId = -1, _bookMark,
+   /*
+   * nDuration: the duration in milliseconds of each frame
+   * nFrames: number of frames for each scroll
+   */
+   nDuration = 200, nFrames = 10;
+
+  function _next () {
+  if (_itFrame > nFrames) { clearInterval(_scrollId); _scrollId = -1; return; }
+  _isBot = true;
+  document.documentElement.scrollTop = Math.round(_scrollY + (_nodeY - _scrollY) * _itFrame / nFrames);
+  document.documentElement.scrollLeft = Math.round(_scrollX + (_nodeX - _scrollX) * _itFrame / nFrames);
+  if (_useHash && _itFrame === nFrames) { location.hash = _bookMark; }
+  _itFrame++;
+  }
+
+  function _chkOwner () {
+  if (_isBot) { _isBot = false; return; }
+  if (_scrollId > -1) { clearInterval(_scrollId); _scrollId = -1; }
+  }
+
+  if (window.addEventListener) { window.addEventListener("scroll", _chkOwner, false); }
+  else if (window.attachEvent) { window.attachEvent("onscroll", _chkOwner); }
+
+  return function (sBookmark, bUseHash) {
+    var oNode = document.querySelector(sBookmark);
+  _scrollY = document.documentElement.scrollTop;
+  _scrollX = document.documentElement.scrollLeft;
+  _bookMark = sBookmark;
+  _useHash = bUseHash === true;
+  _nodeX = oNode.offsetLeft;
+    _nodeY = oNode.offsetTop;
+    _itFrame = 1;
+  if (_scrollId === -1) { _scrollId = setInterval(_next, Math.round(nDuration / nFrames)); }
+  };
+})();
+
+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('HTML WHATWG', "history.html#the-location-interface", "Window.location")}}{{Spec2('HTML WHATWG')}}{{SpecName("HTML5 W3C")}} からの変更なし。
{{SpecName('HTML5 W3C', "browsers.html#the-location-interface", "Window.location")}}{{Spec2('HTML5 W3C')}}初回定義
+ +

ブラウザーの対応

+ + + +

{{Compat("api.Window.location")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/locationbar/index.html b/files/ja/web/api/window/locationbar/index.html new file mode 100644 index 0000000000..4f6343026c --- /dev/null +++ b/files/ja/web/api/window/locationbar/index.html @@ -0,0 +1,76 @@ +--- +title: window.locationbar +slug: Web/API/Window/locationbar +tags: + - Gecko + - HTML DOM + - Property + - Reference + - Window + - 要更新 +translation_of: Web/API/Window/locationbar +--- +

{{ ApiRef() }} {{ 英語版章題("Summary") }}

+ +

概要

+ +

locationbar オブジェクトを返します。このバーの表示は、ウィンドウ内でトグル（表示/非表示の状態を切り替える）ことができます。

+ +

{{ 英語版章題("Syntax") }}

+ +

構文

+ +
objRef = window.locationbar
+
+ +

{{ 英語版章題("Example") }}

+ +

例

+ +

次の完全な HTML の例は、様々な "bar" オブジェクトの visible プロパティで利用可能な方法を示しています。

+ +
<!DOCTYPE html>
+<html>
+<head>
+  <title>様々な DOM テスト</title>
+  <script>
+    // 存在するウィンドウのバーの状態を変更します
+    netscape.security.PrivilegeManager.
+        enablePrivilege("UniversalBrowserWrite");
+    window.locationbar.visible=
+        !window.locationbar.visible;
+  </script>
+</head>
+<body>
+  <p>様々な DOM テスト</p>
+</body>
+</html>
+
+ +

仕様

+ + + + + + + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('HTML WHATWG', 'browsers.html#dom-window-locationbar', 'Window.locationbar')}}{{Spec2('HTML WHATWG')}}
{{SpecName('HTML5 W3C', 'browsers.html#dom-window-locationbar', 'Window.locationbar')}}{{Spec2('HTML5 W3C')}}
+ +

関連項目

+ + diff --git a/files/ja/web/api/window/matchmedia/index.html b/files/ja/web/api/window/matchmedia/index.html new file mode 100644 index 0000000000..a29368376d --- /dev/null +++ b/files/ja/web/api/window/matchmedia/index.html @@ -0,0 +1,68 @@ +--- +title: window.matchMedia +slug: Web/API/Window/matchMedia +tags: + - API + - CSSOM View + - Method + - NeedsMarkupWork + - NeedsSpecTable + - Reference +translation_of: Web/API/Window/matchMedia +--- +
{{ApiRef}}
+ +

概要

+ +

指定された メディアクエリ文字列のパース結果を表す、新しい {{domxref("MediaQueryList")}} オブジェクトを返します。

+ +

構文

+ +
mql = window.matchMedia(mediaQueryString)
+ +

mediaQueryString は、新しい {{domxref("MediaQueryList")}} オブジェクトを返すための、メディアクエリ文字列です。

+ +

例

+ +
if (window.matchMedia( "(min-width: 400px)" ).matches) {
+  /* ビューポートの幅が 400 ピクセル以上の場合のコードをここに */
+} else {
+  /* ビューポートの幅は 400 ピクセル未満の場合のコードをここに */
+}
+
+ +

このコードでは、ウィンドウが非常に狭いときに、何か別の処理を行うことができます。

+ +

他にも『コード内でのメディアクエリの使用』にいくつか例があります。

+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("CSSOM View", "#dom-window-matchmedia", "Window.matchMedia()")}}{{Spec2("CSSOM View")}}初期定義
+ +

ブラウザ互換性

+ +
{{Compat("api.Window.matchMedia")}}
+ +

関連記事

+ + diff --git a/files/ja/web/api/window/menubar/index.html b/files/ja/web/api/window/menubar/index.html new file mode 100644 index 0000000000..afeebbfaa6 --- /dev/null +++ b/files/ja/web/api/window/menubar/index.html @@ -0,0 +1,72 @@ +--- +title: window.menubar +slug: Web/API/Window/menubar +tags: + - API + - Gecko + - HTML DOM + - Property + - Reference + - Window +translation_of: Web/API/Window/menubar +--- +

{{ ApiRef() }} {{ 英語版章題("Summary") }}

+ +

概要

+ +

menubar オブジェクトを返します。このバーの表示は、ウィンドウ内でトグル（表示/非表示の状態を切り替える）ことができます。

+ +

{{ 英語版章題("Syntax") }}

+ +

構文

+ +
objRef = window.menubar
+
+ +

{{ 英語版章題("Example") }}

+ +

例

+ +

以下の完全な HTML の例は、様々な "bar" オブジェクトの visible プロパティで利用可能な方法を示しています。

+ +
<html>
+<head>
+  <title>様々な DOM テスト</title>
+  <script>
+    // 存在するウィンドウのバーの状態を変更します
+    netscape.security.PrivilegeManager.
+        enablePrivilege("UniversalBrowserWrite");
+    window.menubar.visible=!window.menubar.visible;
+  </script>
+</head>
+<body>
+  <p>様々な DOM テスト</p>
+</body>
+</html>
+
+ +

仕様

+ + + + + + + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('HTML WHATWG', 'browsers.html#dom-window-menubar', 'Window.menubar')}}{{Spec2('HTML WHATWG')}}
{{SpecName('HTML5 W3C', 'browsers.html#dom-window-menubar', 'Window.menubar')}}{{Spec2('HTML5 W3C')}}
+ +

関連項目

+ +

window.locationbar, window.personalbar, window.scrollbars, window.statusbar, window.toolbar

diff --git a/files/ja/web/api/window/messageerror_event/index.html b/files/ja/web/api/window/messageerror_event/index.html new file mode 100644 index 0000000000..e5ed139ae9 --- /dev/null +++ b/files/ja/web/api/window/messageerror_event/index.html @@ -0,0 +1,80 @@ +--- +title: 'Window: messageerror イベント' +slug: Web/API/Window/messageerror_event +tags: + - API + - Event + - MessageEvent + - Reference + - Window + - イベント +translation_of: Web/API/Window/messageerror_event +--- +
{{APIRef}}
+ +

messageerror イベントは、解読できないメッセージを受け取った時に {{domxref('Window')}} オブジェクトに発生します。

+ + + + + + + + + + + + + + + + + + + + +
バブリングなし
キャンセル不可
インターフェイス{{domxref("MessageEvent")}}
イベントハンドラープロパティ{{domxref("WindowEventHandlers/onmessageerror", "onmessageerror")}}
+ +

例

+ +

messageerror は {{domxref("EventTarget/addEventListener", "addEventListener()")}} を使用して待ち受けします。

+ +
window.addEventListener('messageerror', (event) => {
+    console.error(event);
+});
+ +

同じですが、 {{domxref("WindowEventHandlers/onmessageerror", "onmessageerror")}} イベントハンドラープロパティを使用する場合です。

+ +
window.onmessageerror = (event) => {
+    console.error(event);
+};
+ +

仕様書

+ + + + + + + + + + + + + + +
仕様書状態
{{SpecName('HTML WHATWG', 'indices.html#event-messageerror')}}{{Spec2('HTML WHATWG')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.messageerror_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/moveby/index.html b/files/ja/web/api/window/moveby/index.html new file mode 100644 index 0000000000..7e5ebbc4c3 --- /dev/null +++ b/files/ja/web/api/window/moveby/index.html @@ -0,0 +1,55 @@ +--- +title: window.moveBy +slug: Web/API/Window/moveBy +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/Window/moveBy +--- +
{{ApiRef}}
+ +

概要

+ +

指定された量だけ現在のウィンドウを移動します。

+ +

構文

+ +
window.moveBy(deltaX, deltaY)
+
+ +

引数

+ + + +

例

+ +
function budge() {
+  moveBy(10, -10);
+}
+ +

注記

+ +

この関数に対して、負の数を引数に使うことができます。このメソッドは相対移動を、{{domxref("window.moveTo")}} は、絶対移動を行います。

+ +

Firefox 7 より、以下の規則 に従い、 Web サイトからのブラウザのウィンドウの移動はできなくなっています。

+ +
    +
  1. {{domxref("window.open")}} によって作成されたものでないタブやウィンドウを移動することはできません。
    2. +
  2. ウィンドウに 1 つよりも多くのタブがある場合、タブやウィンドウを移動することはできません。
    3. +
+ +

仕様

+ +

{{DOM0}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/moveto/index.html b/files/ja/web/api/window/moveto/index.html new file mode 100644 index 0000000000..698f6ea010 --- /dev/null +++ b/files/ja/web/api/window/moveto/index.html @@ -0,0 +1,50 @@ +--- +title: window.moveTo +slug: Web/API/Window/moveTo +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/Window/moveTo +--- +
{{ApiRef}}
+ +

概要

+ +

ウィンドウを指定座標に移動します。

+ +

構文

+ +
window.moveTo(x, y)
+
+ +

引数

+ + + +

例

+ +
function origin() {
+  // ウィンドウを画面の左上端に移動します
+  window.moveTo(0, 0);
+}
+ +

注記

+ +

この関数は、ウィンドウを絶対的な位置に移動するものです。相対的な移動には {{domxref("window.moveBy")}} を用います。

+ +

Firefox 7 より、以下の規則 に従い、 Web サイトからのブラウザのウィンドウの移動はできなくなっています。

+ +
    +
  1. {{domxref("window.open")}} によって作成されたものでないタブやウィンドウを移動することはできません。
    2. +
  2. ウィンドウに 1 つよりも多くのタブがある場合、タブやウィンドウを移動することはできません。
    3. +
+ +

仕様

+ +

{{dom0}}

diff --git a/files/ja/web/api/window/mozinnerscreenx/index.html b/files/ja/web/api/window/mozinnerscreenx/index.html new file mode 100644 index 0000000000..c2499e3247 --- /dev/null +++ b/files/ja/web/api/window/mozinnerscreenx/index.html @@ -0,0 +1,31 @@ +--- +title: window.mozInnerScreenX +slug: Web/API/Window/mozInnerScreenX +tags: + - DOM + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/Window/mozInnerScreenX +--- +
+ {{ApiRef}} {{gecko_minversion_header("1.9.2")}}
+

概要

+ +

ウィンドウのビューポートの左上隅のスクリーン上の X 座標を取得します。

+
+ 注記: この座標はハードウェアピクセルではなく、CSS のピクセル単位で報告されます。つまり、ズームレベルによる影響を受けるということです。実際の物理的な画面のピクセル数を計算するには、 nsIDOMWindowUtils.screenPixelsPerCSSPixel プロパティを使用する必要があります。
+

構文

+
screenX = window.mozInnerScreenX;
+

値

+ +

仕様書

+

W3C の技術仕様書や勧告に含まれるものではありません。

+

関連情報

+ diff --git a/files/ja/web/api/window/mozinnerscreeny/index.html b/files/ja/web/api/window/mozinnerscreeny/index.html new file mode 100644 index 0000000000..c7442d877d --- /dev/null +++ b/files/ja/web/api/window/mozinnerscreeny/index.html @@ -0,0 +1,31 @@ +--- +title: window.mozInnerScreenY +slug: Web/API/Window/mozInnerScreenY +tags: + - DOM + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/Window/mozInnerScreenY +--- +
+ {{ApiRef}} {{gecko_minversion_header("1.9.2")}}
+

概要

+ +

ウィンドウのビューポートの左上隅のスクリーン上の Y 座標を取得します。

+
+ 注記: この座標はハードウェアピクセルではなく、CSS のピクセル単位で報告されます。つまり、ズームレベルによる影響を受けるということです。実際の物理的な画面のピクセル数を計算するには、 nsIDOMWindowUtils.screenPixelsPerCSSPixel プロパティを使用する必要があります。
+

構文

+
screenY = window.mozInnerScreenY;
+

値

+ +

仕様書

+

W3C の技術仕様書や勧告に含まれるものではありません。

+

関連情報

+ diff --git a/files/ja/web/api/window/mozpaintcount/index.html b/files/ja/web/api/window/mozpaintcount/index.html new file mode 100644 index 0000000000..9be1225d17 --- /dev/null +++ b/files/ja/web/api/window/mozpaintcount/index.html @@ -0,0 +1,36 @@ +--- +title: Window.mozPaintCount +slug: Web/API/Window/mozPaintCount +tags: + - API + - HTML DOM + - NeedsExample + - NeedsMarkupWork + - NeedsSpecTable + - Window + - プロパティ + - リファレンス +translation_of: Web/API/Window/mozPaintCount +--- +
{{APIRef}} {{gecko_minversion_header("2.0")}}
+ +

この window で現在の document が画面に描画された回数を返します。

+ +

 構文

+ +
var paintCount = window.mozPaintCount;
+ + + +

仕様

+ +

W3C の技術仕様、または勧告の一部ではありません。

+ +

ブラウザ互換性

+ + + +

{{Compat("api.Window.mozPaintCount")}}

diff --git a/files/ja/web/api/window/name/index.html b/files/ja/web/api/window/name/index.html new file mode 100644 index 0000000000..0dbd1ab6c9 --- /dev/null +++ b/files/ja/web/api/window/name/index.html @@ -0,0 +1,56 @@ +--- +title: window.name +slug: Web/API/Window/name +tags: + - API + - HTML DOM + - Property + - Reference + - Window +translation_of: Web/API/Window/name +--- +
{{ApiRef}}
+ +

ウィンドウ名を取得 / 設定します。

+ +

構文

+ +
string = window.name;
+window.name = string;
+
+ +

例

+ +
window.name = "lab_view";
+
+ +

注記

+ +

ウィンドウ名は、主にハイパーリンクとフォームのターゲットを設定するために使われます。ウィンドウは必ずしもウィンドウ名を持つ必要はありません。

+ +

It has also been used in some frameworks for providing cross-domain messaging (e.g., SessionVars and Dojo's dojox.io.windowName) as a more secure alternative to JSONP. Modern web applications hosting sensitive data should however not rely on window.name for cross-domain messaging but instead rather utilize the postMessage API.

+ + +

Don't set the value to something unstring since its get method will call the toString method.

+ +

仕様

+ + + + + + + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('HTML WHATWG', 'browsers.html#dom-name', 'Window.name')}}{{Spec2('HTML WHATWG')}} 
{{SpecName('HTML5 W3C', 'browsers.html#dom-name', 'Window.name')}}{{Spec2('HTML5 W3C')}} 
diff --git a/files/ja/web/api/window/navigator/index.html b/files/ja/web/api/window/navigator/index.html new file mode 100644 index 0000000000..d5bee820cd --- /dev/null +++ b/files/ja/web/api/window/navigator/index.html @@ -0,0 +1,116 @@ +--- +title: window.navigator +slug: Web/API/Window/navigator +tags: + - DOM + - DOM_0 + - Gecko + - Navigator + - 要更新 +translation_of: Web/API/Window/navigator +--- +
{{outdated}}{{ApiRef}}
+ +

概要

+ +

navigator オブジェクトへの参照を返します。 navigator オブジェクトを用いることで、スクリプトを実行しているアプリケーションについての情報を得ることができます。

+ +

例

+ +
+
alert("あなたは " + navigator.appName + " を使用しています。");
+
+
+ +

プロパティ

+ +
+
{{domxref("window.navigator.appCodeName", "navigator.appCodeName")}} {{non-standard_inline}}
+
現在のブラウザの内部 "コード" ネームを返す（※このプロパティは正確な値を返すとは限りません）
+
{{domxref("window.navigator.appName", "navigator.appName")}}
+
ブラウザの正式名称を返す（※このプロパティは正確な値を返すとは限りません）
+
{{domxref("window.navigator.appVersion", "navigator.appVersion")}}
+
ブラウザのバージョンを表す文字列を返す（※このプロパティは正確な値を返すとは限りません）
+
{{domxref("window.navigator.buildID", "navigator.buildID")}} {{non-standard_inline}}
+
ブラウザのビルド識別子を返す（※例： "2006090803"）
+
{{domxref("window.navigator.connection", "navigator.connection")}}
+
Provides information about the network connection of a device.
+
{{domxref("window.navigator.cookieEnabled", "navigator.cookieEnabled")}}
+
ブラウザのクッキーが有効かどうかを示す真偽値を返す
+
{{domxref("navigator.doNotTrack")}} {{non-standard_inline}}
+
Reports the value of the user's do-not-track preference. When this value is "yes", your web site or application should not track the user.
+
{{domxref("navigator.id")}} {{non-standard_inline}}
+
Returns the {{domxref("window.navigator.id", "id")}} object which you can use to add support for BrowserID to your web site.
+
{{domxref("window.navigator.language", "navigator.language")}}
+
ブラウザの言語バージョンを表す文字列を返す
+
{{domxref("window.navigator.mimeTypes", "navigator.mimeTypes")}}
+
ブラウザがサポートしている MIME タイプの一覧を返す
+
{{domxref("window.navigator.mozApps", "navigator.mozApps")}} {{non-standard_inline}}
+
Returns an {{domxref("window.navigator.mozApps", "Apps")}} object you can use to install, manage, and control Open Web apps.
+
{{domxref("window.navigator.battery", "navigator.battery")}} {{gecko_minversion_inline("10.0")}} {{non-standard_inline}}
+
Returns a {{domxref("window.navigator.battery", "battery")}} object you can use to get information about the battery charging status.
+
{{domxref("navigator.mozNotification")}} {{non-standard_inline}}
+ {{domxref("navigator.webkitNotification")}}
+
Returns a {{domxref("navigator.mozNotification", "notification")}} object you can use to deliver notifications to the user from your web application.
+
{{domxref("window.navigator.mozSms", "navigator.mozSms")}} {{gecko_minversion_inline("12.0")}} {{non-standard_inline}}
+
Returns a {{domxref("SmsManager")}} object you can use to manage SMS messaging in your web application.
+
{{domxref("navigator.mozSocial")}} {{non-standard_inline}}
+
{{todo}}
+
{{domxref("window.navigator.mozTelephony", "navigator.mozTelephony")}} {{non-standard_inline}}
+
Returns a {{domxref("Telephony")}} object you can use to create and manage telephone calls.
+
{{domxref("window.navigator.onLine", "navigator.onLine")}}
+
ブラウザがオンラインで動作しているかどうかを示す真偽値を返す
+
{{domxref("window.navigator.oscpu", "navigator.oscpu")}}
+
現在のオペレーティングシステムを表す文字列を返す
+
{{domxref("window.navigator.platform", "navigator.platform")}}
+
ブラウザのプラットフォームを表す文字列を返す
+
{{domxref("window.navigator.plugins", "navigator.plugins")}}
+
ブラウザにインストールされているプラグインの一覧を配列で返す
+
{{domxref("window.navigator.product", "navigator.product")}} {{non-standard_inline}}
+
現在のブラウザの製品名を返す（※例："Gecko"）
+
{{domxref("window.navigator.productSub", "navigator.productSub")}} {{non-standard_inline}}
+
現在のブラウザのビルド番号を返します（※例："20060909"）
+
{{domxref("window.navigator.securitypolicy", "navigator.securitypolicy")}} {{non-standard_inline}}
+
空文字列を返す（※Netscape 4.7x のみ "US & CA domestic policy" または、 "Export policy" という文字列を返す）
+
{{domxref("window.navigator.standalone", "navigator.standalone")}} {{non-standard_inline}}
+
Returns a boolean indicating whether the browser is running in standalone mode. Available on Apple's iOS Safari only.
+
{{domxref("window.navigator.userAgent", "navigator.userAgent")}}
+
現在のブラウザのユーザエージェントを表す文字列を返す
+
{{domxref("window.navigator.vendor", "navigator.vendor")}} {{non-standard_inline}}
+
現在のブラウザのベンダー名を返す（※例："Netscape6"）
+
{{domxref("window.navigator.vendorSub", "navigator.vendorSub")}} {{non-standard_inline}}
+
ベンダーバージョン番号を返す（※例："6.1"）
+
navigator.webkitPointer {{non-standard_inline}}
+
Returns a PointerLock object for the Mouse Lock API.
+
+ +

メソッド

+ +
+
{{domxref("window.navigator.javaEnabled", "navigator.javaEnabled")}}
+
ホストブラウザで Java が有効かどうかを示す
+
{{domxref("window.navigator.mozIsLocallyAvailable", "navigator.mozIsLocallyAvailable")}} {{non-standard_inline}}
+
指定 URI の文書がネットワークを利用しなくても閲覧可能かどうかをチェックする
+
{{domxref("window.navigator.preference", "navigator.preference")}} {{obsolete_inline("2.0")}} {{non-standard_inline}}
+
ユーザ設定を設定する。このメソッドは、特権を持つコードでのみ使用可能です。現在は廃止されているため、代わりに XPCOM の Preferences API を用います。
+
{{domxref("window.navigator.registerContentHandler", "navigator.registerContentHandler")}}
+
Web サイトを指定した MIME タイプに関連付ける
+
{{domxref("navigator.registerProtocolHandler", "navigator.registerProtocolHandler")}}
+
Web サイト を指定したプロトコルに関連付ける
+
{{domxref("window.navigator.taintEnabled", "navigator.taintEnabled")}} {{deprecated_inline("1.7.8")}} {{obsolete_inline("9.0")}} {{non-standard_inline}}
+
false を返す。JavaScript の taint/untaint 関数は、JavaScript 1.2 で削除されています（※）
+
{{domxref("window.navigator.vibrate", "navigator.vibrate()")}} {{gecko_minversion_inline("11.0")}}
+
Causes vibration on devices with support for it. Does nothing if vibration support isn't available.
+
+ +

仕様

+ + + +

関連情報

+ + diff --git a/files/ja/web/api/window/onafterprint/index.html b/files/ja/web/api/window/onafterprint/index.html new file mode 100644 index 0000000000..162c81e8c6 --- /dev/null +++ b/files/ja/web/api/window/onafterprint/index.html @@ -0,0 +1,55 @@ +--- +title: WindowEventHandlers.onafterprint +slug: Web/API/Window/onafterprint +tags: + - API + - DOM + - Event Handler + - HTML DOM + - Property + - Reference + - WindowEventHandlers + - printing +translation_of: Web/API/WindowEventHandlers/onafterprint +--- +
{{ApiRef}}
+ +

{{domxref("WindowEventHandlers")}} ミックスインの onafterprint プロパティは、現在のウィンドウの {{event("afterprint")}} イベントを処理するための {{domxref("EventHandler")}} です。 このイベントは、ユーザーが印刷した後や、ユーザーが印刷ダイアログで中止した場合に発生します。

+ +

{{event("beforeprint")}} イベントと afterprint イベントを使用すると、印刷を開始する前にページでコンテンツを変更し（例えば、バナーを削除するなど）、印刷の完了後にそれらの変更を元に戻すことができます。 一般に、@media print CSS @-規則の使用を好むはずですが、場合によってはこれらのイベントを使用する必要があるかもしれません。

+ +

構文

+ +
window.addEventListener("afterprint", function(event) { ... });
+window.onafterprint = function(event) { ... };
+ +

仕様

+ + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('HTML WHATWG', '#handler-window-onafterprint', 'onafterprint')}}{{Spec2('HTML WHATWG')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.WindowEventHandlers.onafterprint")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/onclick/index.html b/files/ja/web/api/window/onclick/index.html new file mode 100644 index 0000000000..b620c103a2 --- /dev/null +++ b/files/ja/web/api/window/onclick/index.html @@ -0,0 +1,44 @@ +--- +title: window.onclick +slug: Web/API/Window/onclick +tags: + - DOM + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/GlobalEventHandlers/onclick +--- +
+ {{ApiRef}}
+

概要

+

カーソルがウィンドウ内にある時にユーザがマウスボタンをクリックした場合に呼び出されます。このイベントはどのマウスボタンを押下した場合でも発生します。イベントが発生した地点はイベントのプロパティから取得する事が出来ます。

+

構文

+
window.onclick =funcRef;
+
+ +

例

+
<!DOCTYPE html>
+<html>
+<head>
+<meta charset="UTF-8" />
+<title>onclick のテスト</title>
+<script>
+function clickPage () {
+  alert("click event detected!");
+}
+
+window.onclick = clickPage;
+</script>
+</head>
+
+<body>
+
+<p>このページ上でマウスボタンをクリックしてみてください。</p>
+
+</body>
+</html>
+

ユーザが Window 内をクリックすると click イベントが発生します。

+

仕様

+

どの仕様書にも含まれていません。

diff --git a/files/ja/web/api/window/ondevicelight/index.html b/files/ja/web/api/window/ondevicelight/index.html new file mode 100644 index 0000000000..e0a19b3ccb --- /dev/null +++ b/files/ja/web/api/window/ondevicelight/index.html @@ -0,0 +1,57 @@ +--- +title: window.ondevicelight +slug: Web/API/Window/ondevicelight +tags: + - Ambient Light + - B2G + - Firefox OS + - WebAPI + - Window +translation_of: Web/API/Window/ondevicelight +--- +

{{ApiRef}} {{obsolete_header}} 

+ +

デバイスの環境光センサが光の強度の変化を検出した際に発生する {{event("devicelight")}} イベントを受け取るイベントリスナーを指定します。

+ +

構文

+ +
window.ondevicelight = funcRef
+ + + +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName('AmbientLight', '#event-handlers', 'Ambient Light Events')}}{{Spec2('AmbientLight')}}最初期の定義
+ +

ブラウザ実装状況

+ +
+ + +

{{Compat("api.Window.ondevicelight")}}

+
+ +

関連情報

+ + diff --git a/files/ja/web/api/window/ondevicemotion/index.html b/files/ja/web/api/window/ondevicemotion/index.html new file mode 100644 index 0000000000..6384ba73e7 --- /dev/null +++ b/files/ja/web/api/window/ondevicemotion/index.html @@ -0,0 +1,61 @@ +--- +title: Window.ondevicemotion +slug: Web/API/Window/ondevicemotion +tags: + - API + - Device Orientation + - Event Handler + - Mobile + - Motion + - Orientation + - Property + - Reference + - イベントハンドラー + - プロパティ + - モバイル + - 向き + - 端末の向き +translation_of: Web/API/Window/ondevicemotion +--- +
{{APIRef("Device Orientation Events")}}
+ +

Windows に対して送信される {{domxref("Window/devicemotion_event", "devicemotion")}} イベントのためのイベントハンドラーです。

+ +

構文

+ +
window.ondevicemotion = funcRef;
+ +

funcRef のところは関数への参照です。この関数は発生した動きを説明する {{DOMxRef("DeviceMotionEvent")}} オブジェクトを受け取ります。

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("Device Orientation")}}{{Spec2("Device Orientation")}}Initial definition.
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.ondevicemotion")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/ondeviceproximity/index.html b/files/ja/web/api/window/ondeviceproximity/index.html new file mode 100644 index 0000000000..48551acc69 --- /dev/null +++ b/files/ja/web/api/window/ondeviceproximity/index.html @@ -0,0 +1,101 @@ +--- +title: Window.ondeviceproximity +slug: Web/API/Window/ondeviceproximity +tags: + - API + - Event Handler + - Experimental + - Property + - Proximitiy Event + - Reference + - Window +translation_of: Web/API/Window/ondeviceproximity +--- +

{{ ApiRef() }}

+ +

{{event("deviceproximity")}} イベントを受け取るイベントリスナーを指定します。これらのイベントは、デバイスセンサーが、物がデバイスに近づいたこと、または離れたことを検知したときに発生します。

+ +

構文

+ +
window.onuserproximity = funcRef
+ +

funcRef は、{{event("deviceproximity")}} イベントが発生したときに呼び出される関数です。これらは {{domxref("DeviceProximityEvent")}} 型のイベントです。

+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様ステータスコメント
{{ SpecName('Proximity Events', '#device-proximity', 'Proximity Events') }}{{ Spec2('Proximity Events') }}初期定義。
+ +

ブラウザー実装状況

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本サポート{{ CompatNo() }}{{ CompatVersionUnknown() }}{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
機能AndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本サポート{{ CompatNo() }}{{ CompatNo() }}{{ CompatGeckoMobile("15.0") }}{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
+
+ +

関連項目

+ + diff --git a/files/ja/web/api/window/ongamepadconnected/index.html b/files/ja/web/api/window/ongamepadconnected/index.html new file mode 100644 index 0000000000..ce2246c3cd --- /dev/null +++ b/files/ja/web/api/window/ongamepadconnected/index.html @@ -0,0 +1,65 @@ +--- +title: Window.ongamepadconnected +slug: Web/API/Window/ongamepadconnected +tags: + - API + - Event Handler + - Experimental + - Gamepad API + - Property + - Reference + - Window + - ongamepadconnected +translation_of: Web/API/Window/ongamepadconnected +--- +
+
{{DefaultAPISidebar("Gamepad API")}}{{SeeCompatTable}}
+
+ +
{{domxref("Window")}}  インターフェイスの ongamepadconnected プロパティは、ゲームパッドが接続されたとき ({{event('gamepadconnected')}}イベントが発生したとき) に実行されるイベントハンドラを表します。
+ +
 
+ +

イベントのオブジェクトの型は {{domxref("GamepadEvent")}} です。

+ +

構文

+ +
window.ongamepadconnected = function() { ... };
+
+ +

例

+ +
window.ongamepadconnected = function(event) {
+  // All buttons and axes values can be accessed through
+  event.gamepad;
+};
+ +

仕様

+ + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('Gamepad ', '#event-gamepadconnected', 'gamepadconnected event')}}{{Spec2('Gamepad')}}初版
+ +

ブラウザの互換性

+ + + +

{{Compat("api.Window.ongamepadconnected")}}

+ +

参照

+ + diff --git a/files/ja/web/api/window/ongamepaddisconnected/index.html b/files/ja/web/api/window/ongamepaddisconnected/index.html new file mode 100644 index 0000000000..f9b33bb033 --- /dev/null +++ b/files/ja/web/api/window/ongamepaddisconnected/index.html @@ -0,0 +1,60 @@ +--- +title: Window.ongamepaddisconnected +slug: Web/API/Window/ongamepaddisconnected +tags: + - API + - Event Handler + - Experimental + - Gamepad API + - Property + - Reference + - Window + - ongamepaddisconnected +translation_of: Web/API/Window/ongamepaddisconnected +--- +
{{DefaultAPISidebar("Gamepad API")}}{{SeeCompatTable}}
+ +

{{domxref("Window")}} インターフェースの ongamepaddisconnected プロパティはゲームパッドが切断した時 ({{event('gamepaddisconnected')}} イベントが発生したとき) に実行されるイベントハンドラーを表します。

+ +

イベントのオブジェクトの型は {{domxref("GamepadEvent")}} です。

+ +

構文

+ +
window.ongamepaddisconnected = function() { ... };
+
+ +

例

+ +
window.ongamepaddisconnected = function() {
+  // A gamepad has been disconnected
+};
+ +

仕様

+ + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('Gamepad ', '#event-gamepaddisconnected', 'gamepaddisconnected event')}}{{Spec2('Gamepad')}}初版
+ +

ブラウザの互換性

+ + + +

{{Compat("api.Window.ongamepaddisconnected")}}

+ +

参照

+ + diff --git a/files/ja/web/api/window/oninstall/index.html b/files/ja/web/api/window/oninstall/index.html new file mode 100644 index 0000000000..40c22b7cec --- /dev/null +++ b/files/ja/web/api/window/oninstall/index.html @@ -0,0 +1,57 @@ +--- +title: Window.onappinstalled +slug: Web/API/Window/oninstall +tags: + - API + - Event Handler + - Property + - Reference + - Window + - web manifest +translation_of: Web/API/Window/onappinstalled +--- +
{{APIRef}}
+ +

{{domxref("Window")}} オブジェクトの onappinstalled プロパティは、appinstalled イベントのイベントハンドラーとして扱われます。これは、ウェブアプリケーションが プログレッシブウェブアプリ (PWA) としてインストールに成功すると発行されます。この発生したイベントは、{{domxref("Event")}} インターフェイスを実装する「単純なイベント」です。

+ +

構文

+ +
window.onappinstalled = function(event) { ... };
+
+ +

例

+ +
window.onappinstalled = function(ev) {
+  console.log('アプリケーションがインストールされました。');
+};
+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況備考
{{SpecName('Manifest', '#onappinstalled-attribute', 'Window.onappinstalled')}}{{Spec2('Manifest')}}初期定義
+ +

ブラウザー実装状況

+ + + +

{{Compat("api.Window.onappinstalled")}}

+ +

関連項目

+ + diff --git a/files/ja/web/api/window/onmousedown/index.html b/files/ja/web/api/window/onmousedown/index.html new file mode 100644 index 0000000000..72c51f34c8 --- /dev/null +++ b/files/ja/web/api/window/onmousedown/index.html @@ -0,0 +1,47 @@ +--- +title: window.onmousedown +slug: Web/API/Window/onmousedown +tags: + - DOM + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/GlobalEventHandlers/onmousedown +--- +
+ {{ApiRef}}
+

概要

+

{{domxref("window")}} 上での mousedown イベントに対応するイベントハンドラです。

+

構文

+
window.onmousedown = funcRef;
+
+ +

例

+
window.onmousedown = doFunc;
+
+
<!DOCTYPE html>
+<html lang="ja">
+<head>
+<meta charset="UTF-8" />
+<title>onmousedown のテスト</title>
+
+<script>
+window.onmousedown = mousedown;
+
+function mousedown() {
+  alert("mousedown イベントが発生しました。");
+}
+</script>
+
+</head>
+<body>
+<p>ページ上でのマウスクリック（右クリック、左クリック、中ボタン）で  mousedown イベントが発生します。</p>
+</body>
+</html>
+
+

注記

+

ページ上の任意の場所でマウスボタンをクリックすると mousedown イベントが発生し、アラートを表示する関数が呼び出されます。

+

仕様

+

標準仕様書には含まれていません。

diff --git a/files/ja/web/api/window/onmouseup/index.html b/files/ja/web/api/window/onmouseup/index.html new file mode 100644 index 0000000000..5598cd78c4 --- /dev/null +++ b/files/ja/web/api/window/onmouseup/index.html @@ -0,0 +1,56 @@ +--- +title: window.onmouseup +slug: Web/API/Window/onmouseup +tags: + - DOM + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/GlobalEventHandlers/onmouseup +--- +
+ {{ApiRef}}
+

概要

+

{{domxref("window")}} 上の mouseup イベントに対応するイベントハンドラです。

+

構文

+
window.onmouseup = funcRef;
+
+ +

例

+
function doFunc() {
+  alert("こんにちは！");
+}
+
+window.onmouseup = doFunc;
+
+
window.onmouseup = function() {
+  alert("こんばんは！");
+};
+
+
<!DOCTYPE html>
+<html lang="ja">
+<head>
+<meta charset="UTF-8" />
+<title>onmouseup のテスト</title>
+
+<script>
+window.onmouseup = mouseup;
+
+function mouseup() {
+  alert("mouseup イベントを検出!");
+}
+</script>
+
+</head>
+<body>
+<p>ページ上をマウスのボタンでクリックし、数秒押し続け、ボタンを放します。
+マウスのボタンを放すことで、 mouseup イベントが発生します。</p>
+</body>
+</html>
+
+

注記

+

mouseup イベントは、ドキュメント内のどこででも、ユーザがマウスの左ボタンを放すことによって発生します。

+

仕様

+

標準仕様書には含まれていません。

diff --git a/files/ja/web/api/window/onreset/index.html b/files/ja/web/api/window/onreset/index.html new file mode 100644 index 0000000000..c9862667e8 --- /dev/null +++ b/files/ja/web/api/window/onreset/index.html @@ -0,0 +1,57 @@ +--- +title: window.onreset +slug: Web/API/Window/onreset +tags: + - DOM + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/GlobalEventHandlers/onreset +--- +
+ {{ApiRef}}
+

概要

+

フォームの reset イベントに対応するイベントハンドラです。

+

構文

+
window.onreset = funcRef;
+
+

引数

+ +

例

+
<!DOCTYPE html>
+<html lang="ja">
+<head>
+<meta charset="UTF-8" />
+<title>onreset のテスト</title>
+
+<script>
+function reg() {
+  window.onreset = hit;
+}
+
+function hit() {
+ alert('リセットイベントが発生しました。');
+}
+</script>
+
+</head>
+<body onload="reg();">
+
+<form>
+  <div>
+    <textarea></textarea>
+  </div>
+  <div>
+    <input type="reset" value="reset" />
+  </div>
+</form>
+
+</body>
+</html>
+
+

注記

+

reset イベントは、ユーザがフォーム内のリセットボタン (<input type="reset"/>) をクリックした際に発生します。

+

仕様

+

標準仕様書には含まれていません。

diff --git a/files/ja/web/api/window/onresize/index.html b/files/ja/web/api/window/onresize/index.html new file mode 100644 index 0000000000..db2b2bbae9 --- /dev/null +++ b/files/ja/web/api/window/onresize/index.html @@ -0,0 +1,78 @@ +--- +title: window.onresize +slug: Web/API/Window/onresize +tags: + - DOM + - Gecko + - Property + - Window +translation_of: Web/API/GlobalEventHandlers/onresize +--- +

{{ ApiRef() }}

+ +

GlobalEventHandlers.onresize プロパティは、{{event("resize")}} イベントを受信するとトリガーされる {{domxref("EventHandler")}} を含みます。

+ +

構文

+ +
window.onresize = funcRef;
+
+ +

引数

+ + + +

例

+ +
window.onresize = doFunc;
+
+ +
<html>
+<head>
+
+<title>onresize test</title>
+
+</head>
+
+<body>
+<p>Resize the browser window to fire the resize event.</p>
+
+<p>Window height: <span id="height"></span></p>
+<p>Window width: <span id="width"></span></p>
+
+<script type="text/javascript">
+  var heightOutput = document.querySelector('#height');
+  var widthOutput = document.querySelector('#width');
+
+  function resize() {
+    heightOutput.textContent = window.innerHeight;
+    widthOutput.textContent = window.innerWidth;
+  }
+
+  window.onresize = resize;
+</script>
+</body>
+</html>
+
+ +

注記

+ +

ブラウザウィンドウのサイズが変更された後に resize イベントが発生します。

+ +

仕様

+ + + + + + + + + + + + + + +
使用ステータスコメント
{{SpecName('HTML WHATWG','webappapis.html#handler-onresize','onresize')}}{{Spec2('HTML WHATWG')}} 
diff --git a/files/ja/web/api/window/open/index.html b/files/ja/web/api/window/open/index.html new file mode 100644 index 0000000000..b6487db738 --- /dev/null +++ b/files/ja/web/api/window/open/index.html @@ -0,0 +1,540 @@ +--- +title: Window.open() +slug: Web/API/Window/open +tags: + - API + - DOM + - Method + - NeedsMarkupWork + - NeedsUpdate + - Reference + - Window + - open +translation_of: Web/API/Window/open +--- +
{{APIRef}}
+ +

{{domxref("Window")}} インターフェイスの open() メソッドは、指定されたリソースを、新しい、または既存の指定された名前を持った閲覧コンテキスト (ウィンドウ、 {{HTMLElement("iframe")}}、タブ) に読み込みます。その名前が存在しない場合は、新しい閲覧コンテキストが新しいタブまたは新しいウィンドウに開かれ、指定されたリソースがそこに読み込まれます。

+ +

構文

+ +
var window = window.open(url, windowName, [windowFeatures]);
+ +

引数

+ +
+
url
+
{{domxref("DOMString")}} で、読み込むリソースの URL を示します。これは HTML ページ、画像ファイル、その他のブラウザーが対応しているリソースのパスまたは URL にすることができます。空文字列 ("") が url として指定されると、対象の閲覧コンテキストに空のページが開きます。
+
windowName {{optional_inline}}
+
{{domxref("DOMString")}} で、指定したリソースを読み込むための閲覧コンテキスト (ウィンドウ、 {{HTMLElement("iframe")}}、タブ) の名前を指定します。名前が既存のコンテキストを示していない場合は、新しいウィンドウが作成され、 windowName で指定した名前が与えられます。
+
+ この名前は {{HTMLElement("a", "", "#attr-target")}} や {{HTMLElement("form", "", "#attr-target")}} 要素の target 属性のターゲットとして使うことができます。この名前はホワイトスペースを含んではいけません。これはウィンドウのタイトルとしては使用されないことに注意してください。
+
windowFeatures {{optional_inline}}
+
{{domxref("DOMString")}} で、ウィンドウ特性とそれに対応する値を "name=value" の形式で指定したもののカンマで区切りのリストです。これらの機能には、ウィンドウの既定のサイズや位置、ツールバーを含めるかどうかなどのオプションが含まれます。文字列にはホワイトスペースを入れてはいけません。指定できる各機能については、下記の{{anch("Window features", "ウィンドウ特性")}}を参照してください。
+
+ +

返値

+ +

WindowProxy オブジェクトで、基本的には新しく作成されたウィンドウを表す {{domxref("Window")}} オブジェクトの薄いラッパーであり、すべての機能が利用可能なものです。ウィンドウを開くことができなかった場合、返される値は代わりに null となります。返された参照は、同一オリジンポリシのセキュリティ要件に準拠している限り、新しいウィンドウのプロパティやメソッドにアクセスするために使用することができます。

+ +

解説

+ +

open() メソッドは、新しい副ブラウザウィンドウを生成します。それは、ファイルメニューから新しいウィンドウを選ぶのに似ています。引数 url は、新しいウィンドウにおいて読み取り読み込む URL を指定します。 url が空文字列の場合は、メインウィンドウの既定のツールバーを持った新しい空のウィンドウ (URL は about:blank) が生成されます。

+ +

リモートの URL は、すぐには読み込まれないことに注意してください。 window.open() から返ったとき、ウィンドウは常に about:blank を含んでいます。 URL が実際に読み込まれるまでには猶予期間があり、現在のスクリプトブロックが実行を終えた後に開始されます。ウィンドウの生成と参照されるリソースの読み込みは、非同期に行われます。

+ +

例

+ +
var windowObjectReference;
+var windowFeatures = "menubar=yes,location=yes,resizable=yes,scrollbars=yes,status=yes";
+
+function openRequestedPopup() {
+  windowObjectReference = window.open("http://www.cnn.com/", "CNN_WindowName", windowFeatures);
+}
+ +
var windowObjectReference;
+
+function openRequestedPopup() {
+  windowObjectReference = window.open(
+    "http://www.domainname.ext/path/ImageFile.png",
+    "DescriptiveWindowName",
+    "resizable,scrollbars,status"
+  );
+}
+ +

その名前を持っているウィンドウがすでに存在する場合は、 url は既存のウィンドウに読み込まれます。この場合、メソッドの返値は既存のウィンドウであり、 windowFeatures は無視されます。 url に空の文字列を指定すると、開いているウィンドウの場所を変更せずにその名前で参照を取得することができます。 Firefox と Chrome (少なくとも) では、これは同じ親からしか動作しません。つまり、現在のウィンドウは走査しようとしているウィンドウを開いた者になります。そうでない場合は、 window.open() を呼び出すと新しいウィンドウが作成されるだけです。

+ +

新しいウィンドウを window.open() の呼び出すたびに開きたい場合は、特殊な値 _blank を windowName に使用してください。

+ +
+

window.open() を使用して既存のウィンドウを windowName という名前で再オープンする場合の注意点: この機能はすべてのブラウザーで有効であるわけではなく、もっと様々な条件になります。Firefox (50.0.0.1) の機能は説明した通りです。同じドメイン＋ポート番号から同じ名前で再オープンすると、以前に作成されたウィンドウにアクセスできます。一方、 Google Chrome (55.0.2883.87 m ) は、同じ親からのみそれを行います (あたかもウィンドウが依存的に作成されたかのように、これが「オープナー」です)。これは広い制限であり、信じられないほどの開発の複雑さを生み出しています。 Firefox (51.) はハンドルを取得しますが、 Element.focus() は実行できません。一方、 Chrome はオープナーから子への focus() は実行できますが、兄弟間や逆に子からオープナーへのは実行できません。この関数は、その名前 (名前はクッキーやローカルストレージで保存できますが、ウィンドウオブジェクトのハンドルはできません) にしかアクセスできない場合、ウィンドウ上のハンドルを取り戻すためのたった一つの鍵となります。 2017/10/01 時点で、最近発見された動作の違いは、他のブラウザーではまだテストされていません。

+
+ +

ウィンドウ特性

+ +

windowFeatures はオプションの文字列で、新しいウィンドウに指定する特性をコンマで分割したリストを指定します。ウィンドウが開かれた後、ウィンドウの機能やウィンドウのツールバーを変えるために JavaScript を用いることはできません。 windowName が既存のウィンドウを指定せず、かつ、引数 windowFeatures を与えなかった場合 (もしくは、引数 windowFeatures が空文字列だった場合) は、新しい副ウィンドウにはメインウィンドウの既定のツールバーが表示されます。

+ +
+

豆知識: ブラウザーによっては、ユーザーが windowFeatures の設定を上書きして機能を有効にする (または無効にすることを防ぐ) ことができます。

+
+ +

位置と大きさの特性

+ +

引数 windowFeatures で、新しいウィンドウの位置と大きさを指定することができます。

+ +

位置と大きさのエラーの修正における注意

+ +

位置

+ +
+

どちらか一方だけが指定されている場合は、動作は実装に依存しており、ウェブの作者はそれに依存してはいけません。

+
+ +
+
left または screenX
+
ユーザーのオペレーティングシステムのアプリケーションの作業領域の左端から、ブラウザーウィンドウの左端の境界線 (リサイズハンドル) までの距離を指定します。新しいウィンドウを最初に画面外に配置することはできません。
+
top または screenY
+
ユーザーのオペレーティング システムのアプリケーションの作業領域の上端から、ブラウザーウィンドウの上端の境界線 (リサイズハンドル) までの新しいウィンドウの配置距離を指定します。新しいウィンドウを最初に画面外に配置することはできません。
+
+ +

引数 windowFeatures 空でなく、位置の特性が定義されなかった場合は、新しいウィンドウの左上の座標は、最も新しく表示されたウィンドウがあった位置から 22 ピクセル離れた位置になります。オフセットはブラウザーの製造者によって全般的に実装されており (IE6 SP2 で既定のテーマの場合は 29 ピクセルです)、これは新しいウィンドウが開いたことをユーザーが気付きやすくするためのものです。最も新しく使用されたウィンドウが最大化された状態である場合は、オフセットはありません。新しい副ウィンドウも同様に最大化されます。

+ +

大きさ

+ +
+

どちらか一方だけが指定されている場合は、動作は実装に依存しており、ウェブの作者はそれに依存してはいけません。

+
+ +
+
width または innerWidth
+
コンテンツ領域、新しい副ウィンドウの表示領域の幅をピクセル単位で指定します。幅の値は、垂直スクロールバーが存在すれば、その高さを含みます。幅の値は、サイドバーが展開されていても、その幅を含みません。最小の要求値は 100 です。
+
height または innerHeight
+
コンテンツ領域、新しい副ウィンドウの表示領域の高さをピクセル単位で指定します。高さの値は、水平スクロールバーが存在するならば、その高さを含めます。最小の要求値は 100 です。
+
+ +

引数 windowFeatures 空でなく、位置の特性が定義されなかった場合は、新しいウィンドウの大きさは最も新しく表示されたウィンドウと同じ大きさになります。

+ +

ブラウザー固有の大きさの特性

+ +
+

使用しないでください。

+
+ +
+
outerWidth (only on Firefox)
+
ブラウザーウィンドウ全体の高さをピクセル単位で指定します。この outerWidth の値は、ウィンドウの垂直スクロールバー (存在する場合)、左と右のウィンドウリサイズ枠を含みます。
+
outerHeight (only on Firefox)
+
ブラウザーウィンドウ全体の高さをピクセル単位で指定します。この outerHeightの値は、すべての存在するツールバー、ウィンドウの水平スクロールバー (存在する場合)、上と下のウィンドウリサイズ枠を含みます。
+
+ +

ツールバーと UI 部品の特性

+ +
+

最近のブラウザー (Firefox 76 (2020年5月5日リリース予定) 以降のブラウザー、Google Chrome、Safari、Chromium Edge) では、以下の機能はあくまでもポップアップを開くかどうかの条件です。ポップアップの条件の項を参照してください。

+
+ +

以下の機能は、各UIパーツの表示を制御します。すべての機能は yes または 1 に設定するか、単に存在していればオンになります。設定できます。それらを no または 0 に設定するか、多くの場合はそれらを省略すればオフにすることができます。

+ +

例: status=yes, status=1, status は同じ結果になります。

+ +
+
menubar
+
この特性がオンに設定されている場合、新しい副ウィンドウにメニューバーが表示されます。
+
+ windowFeatures が空でない場合、 menubar の既定値はオフです。
+
toolbar
+
この特性がオンに設定されている場合、新しい副ウィンドウにツールバーボタン (戻る、進む、更新、中止ボタン) が表示されます。
+
+ ツールバーボタンに加えて、 Firefox (before 76) は親ウィンドウにタブバーが存在し、表示されていればタブバーが表示されます。 (この機能がオフに設定されている場合、ウィンドウ内のすべてのツールバーが非表示になります)。
+
+ windowFeatures が空でない場合、 toolbar の既定値はオフです。
+
location
+
この特性がオンに設定されている場合、新しい副ウィンドウにロケーションバーまたはアドレスバーが表示されます。
+
+ windowFeatures が空でない場合、 location の既定値はオフです。
+
status
+
この特性がオンに設定されている場合、新しい副ウィンドウにステータスバーが表示されます。
+
+ windowFeatures が空でない場合、 status の既定値はオフです。
+
resizable
+
この特性がオンに設定されている場合、新しい副ウィンドウの大きさが変更可能になります。
+
+ windowFeatures が空でない場合、 resizable の既定値はオンです。 +
+

豆知識: アクセシビリティ上の理由から、この特性は常にオンにするよう強く推奨します。

+
+
+
scrollbars
+
この特性がオンに設定されている場合、新しい副ウィンドウで文書がウィンドウのビューポートに収まりきらない場合、水平・垂直スクロールバーが表示されます。
+
+ windowFeatures が空でない場合、 scrollbars の既定値はオフです。
+
+ スクロールバーの注意を参照してください。 +
+

豆知識: アクセシビリティ上の理由から、この特性は常にオンにするよう強く推奨します。

+
+
+
+ +

ウィンドウ機能の特性

+ +
+
noopener
+
この機能が設定されている場合、新しく開いたウィンドウは通常通りに開きますが、元のウィンドウには ({{domxref("Window.opener")}} からは — null を返すため) アクセスできなくなります。さらに、 window.open() の呼び出しも null を返すので、元のウィンドウも新しいウィンドウにアクセスできなくなります。これは、信頼されていないサイトが window.open() で開かれたサイトが元のウィンドウを改ざんしないようにするために便利ですし、その逆も同様です。
+
noopener が使用されている場合、 _top, _self, _parent 以外の空でないターゲット名は、新しいウィンドウやタブを開くかどうかを決定する際に、すべて _blank と同じように扱われることに注意してください。
+
+ これはChrome, や Firefox 52 以降など、最近のブラウザーで対応しています。詳しくは rel="noopener" およびブラウザーの互換性の紹介、補助的な効果の情報を含めて参照してください。
+
noreferrer
+
この特性が設定されている場合、指定された URL のコンテンツを読み込むリクエストは、リクエストの referrer を noreferrer に設定して読み込まれます。これにより、リクエストを開始したページの URL を、リクエストを送信するサーバーに送信することを防ぎます。さらに、この機能を設定すると自動的に noopener も設定されます。詳細や互換性については rel="noreferrer" を参照してください。 Firefox では Firefox 68 で noreferrer の対応が導入されました。
+
+ +

ベストプラクティス

+ +
<script type="text/javascript">
+var windowObjectReference = null; // グローバル変数
+
+function openFFPromotionPopup() {
+  if(windowObjectReference == null || windowObjectReference.closed)
+  /* メモリ内のウィンドウオブジェクトへのポインターが存在しないか、
+     そのようなポインターが存在するが、そのウィンドウが閉じられている場合 */
+
+  {
+    windowObjectReference = window.open("http://www.spreadfirefox.com/",
+   "PromoteFirefoxWindowName", "resizable,scrollbars,status");
+    /* 真であれば、ウィンドウを生成。新しいウィンドウが生成され、
+       他のウィンドウの最前面に移動します。*/
+  }
+  else
+  {
+    windowObjectReference.focus();
+    /* 偽であれば、ウィンドウへの参照は存在しなればならず、ウィンドウは
+       閉じられていません。それゆえ、 focus() メソッドで他のウィンドウの
+       最前面にそのウィンドウを移動させることができます。ウィンドウを再生成し、
+       参照されているリソースを更新させる必要はありません。 */
+  };
+}
+</script>
+
+(...)
+
+<p><a
+ href="http://www.spreadfirefox.com/"
+ target="PromoteFirefoxWindowName"
+ onclick="openFFPromotionPopup(); return false;"
+ title="このリンクは、新しいウィンドウを生成するか、すでに開かれているウィンドウを再利用します。"
+>Firefox 採用の宣伝</a></p>
+
+ +

上記のコードは、副ウィンドウを開くリンクに関する、わずかなユーザービリティの問題を解決します。コード内の return false の目的は、リンクのデフォルトアクションをキャンセルすることです。: onclick イベントハンドラが実行される場合、リンクのデフォルトアクションを実行する必要はありません。しかし、ユーザのブラウザで javascript サポートが無効、もしくは、存在しない場合、onclick イベントハンドラは無視され、ブラウザは、target の "PromoteFirefoxWindowName" という名前のフレーム、もしくは、ウィンドウ内の参照されたリソースを読みこみます。"PromoteFirefoxWindowName" という名前のフレームもウィンドウも存在しない場合は、ブラウザは新しいウィンドウを生成し、そのウィンドウに "PromoteFirefoxWindowName" という名前を付けます。

+ +

target 属性の使い方の参考ページ:

+ +

HTML 4.01 Target attribute specifications（日本語訳）

+ +

How do I create a link that opens a new window?

+ +

また、この関数をパラメータ化して、より多くの状況に対応できるようにし、スクリプトやウェブページで再利用できるようにすることもできます。

+ +
<script type="text/javascript">
+var windowObjectReference = null; // グローバル変数
+
+function openRequestedPopup(url, windowName) {
+  if(windowObjectReference == null || windowObjectReference.closed) {
+    windowObjectReference = window.open(url, windowName,
+           "resizable,scrollbars,status");
+  } else {
+    windowObjectReference.focus();
+  };
+}
+</script>
+
+(...)
+
+<p><a
+ href="http://www.spreadfirefox.com/"
+ target="PromoteFirefoxWindow"
+ onclick="openRequestedPopup(this.href, this.target); return false;"
+ title="このリンクは、新しいウィンドウを生成するか、すでに開かれているウィンドウを再利用します。"
+>Firefox 採用の宣伝</a></p>
+
+ +

この関数を、 副ウィンドウを 1 つだけ開くようにし、その単一の副ウィンドウをこの関数で開く他のリンクで再利用するようにすることもできます。:

+ +
<script type="text/javascript">
+var windowObjectReference = null; // グローバル変数
+var PreviousUrl; /* 副ウィンドウ内の現在の URL を
+                    保存しているであろうグローバル変数 */
+
+function openRequestedSinglePopup(url) {
+  if(windowObjectReference == null || windowObjectReference.closed) {
+    windowObjectReference = window.open(url, "SingleSecondaryWindowName",
+         "resizable,scrollbars,status");
+  } else if(PreviousUrl != url) {
+    windowObjectReference = window.open(url, "SingleSecondaryWindowName",
+      "resizable=yes,scrollbars=yes,status=yes");
+    /* 読み込まれるリソースが異なる場合、
+       それをすでに開かれている副ウィンドウに読み込み、
+       そのウィンドウをその親ウィンドウの最前面に再移動します。 */
+    windowObjectReference.focus();
+  } else {
+    windowObjectReference.focus();
+  };
+
+  PreviousUrl = url;
+  /* 説明: 現在の URL を保存し、この関数が再度呼び出されたときの
+     URL と比較できるようにします。 */
+}
+</script>
+
+(...)
+
+<p><a
+ href="http://www.spreadfirefox.com/"
+ target="SingleSecondaryWindowName"
+ onclick="openRequestedSinglePopup(this.href); return false;"
+ title="このリンクは、新しいウィンドウを生成するか、すでに開かれているウィンドウを再利用します。"
+>Firefox 採用の宣伝</a></p>
+
+<p><a
+ href="http://www.mozilla.org/support/firefox/faq"
+ target="SingleSecondaryWindowName"
+ onclick="openRequestedSinglePopup(this.href); return false;"
+title="このリンクは、新しいウィンドウを生成するか、すでに開かれているウィンドウを再利用します。"
+>Firefox FAQ</a></p>
+
+ +

FAQ

+ +
+
どのようにすれば、ユーザーにウィンドウを閉じるかどうか確認するメッセージを出さないようにすることができますか？
+
できません。 JavaScript によって開かれていない新しいウィンドウは、JavaScript によって閉じることは原則としてできません。 Mozilla ベースブラウザの JavaScript コンソールは、次の警告メッセージを出すでしょう。: "スクリプトはスクリプトによって開かれたウィンドウ以外を閉じることができません。" そうしなければ、ブラウザセッション中の訪問した URL の履歴が失われるでしょう。
+
詳細は、{{domxref("window.close()")}} メソッドを参照
+
どのようにすれば、ウィンドウを、最小化状態、あるいは、他のウィンドウの背後にある状態から復帰することができますか？
+
まず、対象ウィンドウのウィンドウオブジェクトへの参照が存在するかどうかを調べてください。それが存在し、かつ、閉じてしまっていない場合は、focus() メソッドを使用してください。他に確実な方法はありません。focus() メソッドの使用方法を説明している例 でテストすることができます。
+
ウィンドウを強制的に最大化するにはどうすればいいのですか？
+
できません。全てのブラウザーの作者は、新しい副ウィンドウが開くことを、ユーザーを混乱させずに、ユーザーに気づかせることができるように努力しています。
+
どのようにすれば、ウィンドウのリサイズを無効にしたり、ツールバーを非表示にできますか？
+
これを強制することはできません。Mozilla ベースのブラウザーのユーザーは、about:config における ユーザ設定で、リサイズ、スクロール、ツールバーの表示を自らコントロールできます。ユーザーはそのウィンドウを使うであろう一人に過ぎない (ウェブ制作者であるあなたではありません) ので、最も良いのは、彼らの習慣や設定に干渉することを避けることです。推奨する方法は、コンテンツへのアクセシビリティとウィンドウのユーザービリティを保証するために、リサイズとスクロールバーの表示を（必要ならば） 常に yes に設定することです。これは、ウェブ制作者とそのユーザーの両者のとって最も有益な方法です。
+
どのようにすれば、ウィンドウをコンテンツに合うようにリサイズできますか。
+
確実にはできません。 about:config で dom.disable_window_move_resize を true に設定するか、ユーザーの user.js file ファイルを編集することで、ユーザーがウィンドウのサイズを変更できないようにすることができるためです。
+
一般に、ユーザは、たいてい、ウィンドウの移動またはリサイズを無効にしています。その理由は、過去に、制作者のそのようなスクリプトを許可することで、大変な弊害を受けており、この特性を濫用しない、めったにないスクリプトでも、ウィンドウをリサイズするときに、間違ったリサイズをしばしば行うからです。これらのスクリプトの 99% は、ウィンドウのリサイズを不可能にしたり、スクロールバーを非表示にします。そのような場合、本来は、それらのスクリプトの計算が間違っている場合のための、用心深く、分別のある代替の仕組みとして、それらの特性の両方が有効であるべきです。
+
window オブジェクトのメソッドである、sizeToContent() メソッドもまた、ユーザが、設定の ウィンドウの移動または大きさの変更 のチェックボックスをチェックしないことにより、無効化されます。スクリプトによるユーザ画面上における遠隔操作的なウィンドウの移動または大きさの変更は、大変非常にユーザをいらいらさせるでしょうし、ユーザの頭を混乱させるでしょうし、最も間違っていることでしょう。そのようなウェブ制作者は、架空のユーザのブラウザウィンドウのあらゆる位置とサイズのアスペクトの完全なコントロールを期待しています（し、決めつけています）。
+
どのようにして、リンク先の参照リソースを新しいタブ、あるいは、指定したタブに開くのですか？
+
新しいタブでリソースを開くには、タブ付きブラウザーを参照してください。いくつかのコードスニペットが用意されています。 SDK を使用している場合は、タブの扱いが少し異なります。
+
Mozilla ベースのブラウザーである K-meleon 1.1 は、どのようにリンクを開くかに関する完全な管理と選択肢をユーザに与えています。いくつかの高度な拡張も、Mozilla と Firefox にどのように参照リソースをロードするかに関する多くの選択肢を与えます。
+
ここ数年の間に、CSS3 ハイパーリンクモジュールの target プロパティ（日本語訳） が実装されるかもしれません（CSS3 ハイパーリンクモジュールが承認された場合）。そうなった場合、タブブラウザ制作者がユーザにどのようにリンクからウェブページを開くことができるかに関する完全に拒否する権利と完全な管理を与えることを期待できます。どのようにリンクを開くかは、常に、完全にユーザの管理下にあるべきです。
+
どのようにして、開いたウィンドウがまだ開かれているかどうかを知るのですか？
+
ウィンドウオブジェクトへの参照が存在するかどうかをテストできます。それは、window.open() メソッドの呼び出しが成功した場合の戻り値です。また、windowObjectReference.closed プロパティの値の戻り値が false であるかどうかを調べることでもできます。
+
どのようにすれば、ウィンドウがポップアップブロッカーによってブロックされていることを知ることができますか？
+
Mozilla/Firefox と Internet Explorer 6 SP2 の組み込みポップアップブロッカーでは、window.open() の返値を調べる必要があります。ウィンドウが開くことが許可されなかった場合の返値は、 null です。しかし、他の多くのポップアップブロッカーに対しては、そのような方法はありません。
+
主ウィンドウと副ウィンドウの JavaScript の関係は？
+
window.open() メソッドと opener プロパティの戻り値です。WindowObjectReference は、opener キーワードが副ウィンドウをそれの主ウィンドウ（{{ 原語併記("開く側", "opener", "") }}）へつなげている間、主ウィンドウ（開く側）を副ウィンドウ（サブウィンドウ）へつなげています。
+
新しい副ウィンドウのプロパティにアクセスできません。JavaScript コンソールに、"Error: uncaught exception: Permission denied to get property <プロパティ名 or メソッド名>." というエラーが常に出ます。なぜそのようになるのですか？
+
それは、クロスドメインスクリプトセキュリティの制限（"同一生成元ポリシー"とも）のためです。異なった生成元（ドメイン名）からウィンドウ（あるいは、フレーム）にロードされるスクリプトは、別ウィンドウ（あるいは、フレーム）のプロパティ、または、別の異なった生成元（ドメイン名）由来の HTML オブジェクトの取得も設定もできません。それゆえ、主ウィンドウのブラウザは、副ウィンドウをターゲットとしたスクリプトを実行する前に、副ウィンドウが同じドメイン名を持っているかどうかを調べるでしょう。
+
クロスドメインスクリプトセキュリティ制限については、以下で詳細を参照してください。: http://www.mozilla.org/projects/secu...me-origin.html（日本語版）
+
+ +

ユーザビリティの問題

+ +

window.open() への依存の回避

+ +

一般的に言えば、いくつかの理由で、window.open() への依存を回避することを選択するべきです。:

+ + + + + +

リンクを新しいウィンドウで開くことを提供したい場合、テストされ、推奨できる、ユーザビリティとアクセシビリティのガイドラインに従うべきです。:

+ + + +

"javascript:" 形式のリンクは、すべてのブラウザーにおいて、ウェブページのアクセシビリティとユーザビリティを損ねます。

+ + + +

参考 URL:

+ + + +

決して <a href="#" onclick="window.open(...);"> を使わない

+ +

そのような擬似リンクもリンクのアクセシビリティを損ねます。常に href 属性値を持つ本来の URL を使ってください。 そうすれば、JavaScript サポートが無効にされていたり、存在しない場合や、 MS-Web TV や、テキストブラウザなどのようなユーザエージェントが副ウィンドウを開くことをサポートしていない場合でも、そのようなユーザエージェントが、それらがサポートするデフォルトの方法に従って参照されるリソースを読みこむことができます。また、この形式のコードは、タブ機能を持つブラウザの高度な機能を妨害します。例えば、リンクのミドルクリック、リンクの Ctrl + クリック、リンクの Ctrl + Enter、"マウスジェスチャ" 機能です。

+ + + +

リンクの title 属性を記述したり、リンクの最後にアイコンを追加したり、反応するカーソルを記述することによってユーザに情報を与え、新しいウィンドウを開くことになるリンクを識別できるようにしてください。

+ +

ユーザに警告をする目的は、コンテキストが変化するときに、ユーザの混乱を最小限にするためです。現在のウィンドウが変化したり、新しいウィンドウがポップアップすることは、ユーザを混乱させます（ツールバーボタンの戻るは使えません）。

+ +
+

"ユーザが新しいウィンドウが開いたことに気づかないことはけっこうあります。特に、小さなモニターを使用していて、ウィンドウが最大化されている場合です。元のページに戻ろうとするユーザは、Back ボタンがグレーアウトしているので、混乱してしまいます。"
+ 引用元：The Top TenNew Mistakes of Web Design: 2. Opening New Browser Windows, Jakob Nielsen, May 1999（日本語版）

+
+ +

コンテキストにおける急激な変化が発生する前にそれらが明確に示唆されるとき、ユーザは、そのまま進みたいかどうかを決めることができ、変化に対して準備することができます。ユーザを混乱させないだけでなく、より経験豊富なユーザは、そのようなリンクをどのように開くかに対するより良い決定を下すこともできます（新しいウィンドウとして開くかどうか、同じウインドウに読み込むか、新しいタブに開くどうか、"バックグラウンド" で開くかどうか）。

+ +

リファレンス

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
"新しいウィンドウ" を示すアイコンとカーソルの例
yahoo.com の新しいウィンドウアイコンmicrosoft.com の新しいウィンドウアイコンwebaim.org の新しいウィンドウアイコンsun.com の新しいウィンドウアイコン
bbc.co.uk の新しいウィンドウアイコンAccessible Internet Solutions の新しいウィンドウアイコンaccessify.com の新しいウィンドウアイコンwebstyleguide.com の新しいウィンドウアイコン
ソース不明の新しいウィンドウアイコンソース不明の新しいウィンドウアイコンソース不明の新しいウィンドウアイコンgtalbot.org の新しいウィンドウアイコン
draig.de の新しいウィンドウカーソルmithgol.ru の新しいウィンドウカーソル
+ +

常に target 属性を使う

+ +

JavaScript サポートが無効化されている、もしくは、存在しない場合、ユーザエージェントは、自身の target 属性の扱い方に従って、副ウィンドウを生成するか、参照されるリソースを表示するでしょう。例えば、MS Web TV のような、新しいウィンドウを生成できないいくつかのユーザエージェントは、参照されたリソースを取りだしてから、それを現在のウィンドウの最後に追加します。その最終目的と考え方は、ユーザに参照されるリソースを開く方法、つまり、リンクを開く形式を提供しようとすることであり、 - 強制することではありません。 - あなたのコードはユーザが自由に選択できるブラウザの機能を妨害すべきではありませんし、ユーザに与えられる最終決定権を妨害すべきではありません。

+ +

target="_blank" を使わない

+ +

target 属性には常に意味のある名前を指定し、あなたのページでそのような target 属性を再利用するようにしてください。そうすれば、別のリンクをクリックしても、参照されるリソースがすでに生成され、表示されているウィンドウに読みこまれることになるでしょう（そうすることで、ユーザ側の処理がスピードアップします）。また、そうすることで、副ウィンドウを最初の場所に生成する理由（とユーザのシステムリソース、時間消費）が正当化されるでしょう。単一の target 属性値を使用し、それをリンクで再利用することは、再利用される単一の副ウィンドウを生成するよりも、非常にユーザリソースに優しいことです。一方、target 属性の値として、"_blank" を使用すると、いくつかの新しい、名前のないウィンドウをユーザにデスクトップに生成することになり、それらは、再利用も、再使用もできません。どんな場合でも、あなたのコードが上手く動作する場合でも、ユーザの最終選択を妨害するべきではありません。そうではなく、より多くの選択肢、リンクを開くためのより多くの方法、ユーザが使用しているツール（ブラウザ）へのより多くの機能をユーザに提供するようにしてください。

+ +

用語集

+ +
+
オープナーウィンドウ、親ウィンドウ、メインウィンドウ、最初のウィンドウ
+
これらの語は、同じウィンドウのことを記述、または、指し示すために使われています。これは、新しいウィンドウが生成される元ウィンドウのことです。つまり、これは、ユーザが別の新しいウィンドウを生成するためのリンクをクリックした際の元ウィンドウのことです。
+
サブウィンドウ、子ウィンドウ、副ウィンドウ、第2ウィンドウ
+
これらの語は、同じウィンドウのことを記述、または、指し示すために使われています。これは、生成された新しいウィンドウのことです。
+
リクエストのないポップアップウィンドウ
+
スクリプトで初期化されたウィンドウで、ユーザーの了承無しに、自動的に開くウィンドウのことです。
+
+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('HTML WHATWG', 'window-object.html#dom-open', 'Window.open()')}}{{Spec2('HTML WHATWG')}}
{{ SpecName('CSSOM View', '#the-features-argument-to-the-open()-method', 'The features argument to the open() method') }}{{ Spec2('CSSOM View') }}features 引数の効果を定義します
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.open")}}

+ +

注意事項

+ + + +

ほとんどの最新ブラウザー (以下に記載) では、ウェブコンテンツが UI パーツの表示・非表示を個別に制御することはできません。

+ + + +

ポップアップを開くか新規タブを開くか、新規ウィンドウを開くかの条件として windowFeatures の UI 関連項目を使用し、それぞれの UI パーツの表示状態を固定しています。

+ +

この条件は実装上のものであり、安定性を保証するものではありません。

+ +

スクロールバーに関する注意

+ +

コンテンツがビューポートの範囲からはみ出すときは、ユーザがコンテンツにアクセスできることを保証するために、スクロールバー（あるいは、スクロールする仕組み）が必要です。ウェブ制作者のコントロール外となるいくつかの理由でコンテンツがウィンドウの範囲をはみ出すことがあります。:

+ + + +

位置と大きさのエラー修正に関する注意

+ +

features のリストで指定された位置と寸法の値でブラウザウィンドウ全体がユーザのオペレーティングシステムにおけるアプリケーションのための作業領域内に表示し切れない場合、それらの値は、優先されず、修正されません。新しいウィンドウのどの部分も最初からスクリーン外に配置されることはありません。これは、Mozilla ベースのブラウザのリリース版の全てでデフォルトです。

+ +

MSIE 6 SP2 にも同じようなエラー修正の仕組みがあります。（日本語版）

+ +

チュートリアル

+ + + +

リファレンス

+ + + +

その他

+ + diff --git a/files/ja/web/api/window/orientationchange_event/index.html b/files/ja/web/api/window/orientationchange_event/index.html new file mode 100644 index 0000000000..0302015078 --- /dev/null +++ b/files/ja/web/api/window/orientationchange_event/index.html @@ -0,0 +1,75 @@ +--- +title: 'Window: orientationchange イベント' +slug: Web/API/Window/orientationchange_event +tags: + - API + - Event + - Reference + - Sensors + - Window + - onorientationchange + - イベント +translation_of: Web/API/Window/orientationchange_event +--- +
{{APIRef}}
+ +

orientationchange イベントは、端末の向きが変化した時に発生します。

+ + + + + + + + + + + + + + + + + + + + +
バブリングなし
キャンセル不可
インターフェイス{{domxref("Event")}}
イベントハンドラー{{domxref("Window/onorientationchange", "onorientationchange")}}
+ +

例

+ +

orientationchange イベントは {{domxref("EventTarget/addEventListener", "addEventListener")}} メソッドで使用することができます。

+ +
window.addEventListener("orientationchange", function() {
+  console.log("端末の向きが " + screen.orientation.angle + "になりました。");
+});
+
+ +

または、 {{domxref("Window/onorientationchange", "onorientationchange")}} イベントハンドラープロパティを使用します。

+ +
window.onorientationchange = function() {
+  console.log("端末の向きが " + screen.orientation.angle + "になりました。");
+};
+ +

仕様書

+ + + + + + + + + + + + + + +
SpecificationStatus
{{SpecName('Compat', '#event-orientationchange', 'orientationchange')}}{{Spec2('Compat')}}
+ +

ブラウザーの対応

+ + + +

{{Compat("api.Window.orientationchange_event")}}

diff --git a/files/ja/web/api/window/outerheight/index.html b/files/ja/web/api/window/outerheight/index.html new file mode 100644 index 0000000000..095f1aeb54 --- /dev/null +++ b/files/ja/web/api/window/outerheight/index.html @@ -0,0 +1,62 @@ +--- +title: Window.outerHeight +slug: Web/API/Window/outerHeight +tags: + - API + - CSSOM View + - NeedsContent + - Property + - Reference + - outerHeight +translation_of: Web/API/Window/outerHeight +--- +
{{APIRef}}
+ +

Window.outerHeight は読み取り専用のプロパティで、サイドバー、ウィンドウの操作部分、ウィンドウをリサイズする境界やハンドルを含む、ブラウザーウィンドウ全体の高さをピクセル単位で表します。

+ +

メモ

+ +

ウィンドウの大きさを変更するには、 {{domxref("window.resizeBy()")}} および {{domxref("window.resizeTo()")}} を使用してください。

+ +

ウィンドウの内側の高さ、つまりページが表示される高さを取得するには、 {{domxref("window.innerHeight")}} を使用してください。

+ +

図による例示

+ +

以下の図は、 outerHeight と innerHeight の違いを示しています。

+ +

innerHeight vs outerHeight illustration

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{ SpecName('CSSOM View', '#dom-window-outerwidth', 'Window.outerWidth') }}{{ Spec2('CSSOM View') }} 
+ +

ブラウザーの対応

+ + + +

{{Compat("api.Window.outerHeight")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/outerwidth/index.html b/files/ja/web/api/window/outerwidth/index.html new file mode 100644 index 0000000000..553f717689 --- /dev/null +++ b/files/ja/web/api/window/outerwidth/index.html @@ -0,0 +1,53 @@ +--- +title: Window.outerWidth +slug: Web/API/Window/outerWidth +tags: + - API + - CSSOM View + - NeedsContent + - Property + - Reference + - outerWidth +translation_of: Web/API/Window/outerWidth +--- +
{{APIRef}}
+ +

Window.outerWidth は読み取り専用のプロパティで、ブラウザーウィンドウの外側の幅を返します。これはサイドバー (展開されている場合)、ウィンドウの操作部分、ウィンドウをリサイズする境界やハンドルを含む、ブラウザーウィンドウ全体の幅を表します。

+ +

メモ

+ +

ウィンドウの大きさを変更するには、 {{domxref("window.resizeBy()")}} および {{domxref("window.resizeTo()")}} を参照してください。

+ +

ウィンドウの内側の幅、つまりページが表示される幅を取得するには、 {{domxref("window.innerWidth")}} を参照してください。

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{ SpecName('CSSOM View', '#dom-window-outerwidth', 'Window.outerWidth') }}{{ Spec2('CSSOM View') }}初回定義
+ +

ブラウザーの対応

+ + + +

{{Compat("api.Window.outerWidth")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/pagehide_event/index.html b/files/ja/web/api/window/pagehide_event/index.html new file mode 100644 index 0000000000..305a0d38de --- /dev/null +++ b/files/ja/web/api/window/pagehide_event/index.html @@ -0,0 +1,96 @@ +--- +title: 'Window: pagehide イベント' +slug: Web/API/Window/pagehide_event +tags: + - API + - Event + - History + - Navigation + - Reference + - Window + - pagehide + - イベント + - 履歴 +translation_of: Web/API/Window/pagehide_event +--- +
{{APIRef("HTML DOM")}}
+ +

pagehide イベントは、ブラウザーがセッションの履歴から他のページを表示する過程において、現在のページを非表示にしたときに {{domxref("Window")}} へ送られます。例えば、ユーザーがブラウザーの戻るボタンをクリックしたとき、現在のページはひとつ前のページが表示される前に pagehide イベントを受け取ります。

+ + + + + + + + + + + + + + + + + + + + +
バブリングなし
キャンセル不可
インターフェイス{{domxref("PageTransitionEvent")}}
イベントハンドラープロパティ{{domxref("Window.onpagehide", "onpagehide")}}
+ +

例

+ +

この例では、イベントハンドラーが pagehide イベントを監視するために確立され、ページが再利用できるように保存されようとするときに特殊な扱いを行います。

+ +
window.addEventListener("pagehide", event => {
+  if (event.persisted) {
+    /* このページは破棄されないので、後で再利用することができます */
+  }
+}, false);
+
+ +

これは {{domxref("Window.onpagehide", "onpagehide")}} イベントハンドラープロパティを {{domxref("Window")}} 上で利用することで書くこともできます。

+ +
window.onpagehide = event => {
+  if (event.persisted) {
+    /* このページは破棄されないので、後で再利用することができます */
+  }
+}
+
+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('HTML WHATWG', 'browsing-the-web.html#event-pagehide', 'pagehide')}}{{Spec2('HTML WHATWG')}}初回定義
{{SpecName('HTML5 W3C', 'browsers.html#event-pagehide', 'pagehide')}}{{Spec2('HTML5 W3C')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.pagehide_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/pageshow_event/index.html b/files/ja/web/api/window/pageshow_event/index.html new file mode 100644 index 0000000000..efc3554441 --- /dev/null +++ b/files/ja/web/api/window/pageshow_event/index.html @@ -0,0 +1,132 @@ +--- +title: 'Window: pageshow イベント' +slug: Web/API/Window/pageshow_event +tags: + - API + - Document + - Event + - History + - Navigation + - Page + - PageTransitionEvent + - Reference + - Window + - pageshow + - show + - イベント + - ナビゲーション + - ページ + - 履歴 +translation_of: Web/API/Window/pageshow_event +--- +
{{APIRef("HTML DOM")}}
+ +

pageshow イベントは、操作によってブラウザーがウィンドウの文書を表示したときに {{domxref("Window")}} へ送られます。これには以下のようなものがあります。

+ + + +
+

最初にページを読み込んでいる間、 pageshow イベントは {{domxref("Window/load_event", "load")}} イベントの後で発生します。

+
+ + + + + + + + + + + + + + + + + + + + +
バブリングなし
キャンセル不可
インターフェイス{{domxref("PageTransitionEvent")}}
イベントハンドラープロパティ{{domxref("Window.onpageshow", "onpageshow")}}
+ +

例

+ +

この例は配列 events の中に列挙されたイベントのイベントハンドラーを設定します。ハンドラーである eventLogger() は、発生したイベントの種類と、 {{domxref("PageTransitionEvent.persisted", "persisted")}} フラグの値を pageshow および pagehide イベントの場合に含めてコンソールに出力します。

+ +

JavaScript

+ +
const events = [
+  "pagehide", "pageshow",
+  "unload", "load"
+];
+
+const eventLogger = event => {
+  switch (event.type) {
+    case "pagehide":
+    case "pageshow":
+      let isPersisted = event.persisted ? "persisted" : "not persisted";
+      console.log('Event:', event.type, '-', isPersisted);
+      break;
+    default:
+      console.log('Event:', event.type);
+      break;
+  }
+};
+
+events.forEach(eventName =>
+  window.addEventListener(eventName, eventLogger)
+);
+ +

HTML

+ +
<p>コンソールを開き、このページに出入りしたときの出力を見てください。
+このタブに新しいページを読み込んだり、履歴で前後に移動したりして、
+イベントのログへの出力を見てください。</p>
+
+ +

結果

+ +

{{EmbedLiveSample("Example", 640, 250)}}

+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('HTML WHATWG', 'browsing-the-web.html#event-pageshow', 'pageshow')}}{{Spec2('HTML WHATWG')}}初回定義
{{SpecName('HTML5 W3C', 'browsers.html#event-pageshow', 'pageshow')}}{{Spec2('HTML5 W3C')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.pageshow_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/parent/index.html b/files/ja/web/api/window/parent/index.html new file mode 100644 index 0000000000..6e8f1e986d --- /dev/null +++ b/files/ja/web/api/window/parent/index.html @@ -0,0 +1,44 @@ +--- +title: window.parent +slug: Web/API/Window/parent +tags: + - API + - Gecko + - HTML DOM + - Window +translation_of: Web/API/Window/parent +--- +

{{ APIRef() }}

+ +

概要

+ +

現在のウィンドウ、または、サブフレームの親ウィンドウへの参照を返します。

+ +

ウィンドウが親を持たない場合、parent プロパティは、それ自身への参照となります。

+ +

ウィンドウが {{htmlelement("iframe")}} 、{{htmlelement("object")}} 、あるいは、{{htmlelement("frame")}} で読み込まれた場合、その親ウィンドウは、ウィンドウを埋め込んだ要素が存在するウィンドウとなります。

+ +

構文

+ +
parentWindow = window.parent
+
+ +

例

+ +
if (window.parent !== window.top) {
+  // 1 段下より深いところ
+}
+
+ +

仕様

+ + + +

関連情報

+ + diff --git a/files/ja/web/api/window/paste_event/index.html b/files/ja/web/api/window/paste_event/index.html new file mode 100644 index 0000000000..0697458a24 --- /dev/null +++ b/files/ja/web/api/window/paste_event/index.html @@ -0,0 +1,76 @@ +--- +title: 'Window: paste イベント' +slug: Web/API/Window/paste_event +tags: + - API + - Event + - Reference + - Web + - Window + - paste + - イベント +translation_of: Web/API/Window/paste_event +--- +
{{APIRef}}
+ +

paste イベントは、ユーザーがブラウザーのユーザーインターフェイスから「貼り付け」操作を実行したときに発生します。

+ + + + + + + + + + + + + + + + + + + + +
バブリングあり
キャンセル可
インターフェイス{{domxref("ClipboardEvent")}}
イベントハンドラープロパティ{{domxref("HTMLElement/onpaste", "onpaste")}}
+ +

このイベントの本来の対象は、貼り付け操作を意図する対象である {{domxref("Element")}} です。このイベントを {{domxref("Window")}} インターフェイス上で待ち受けし、キャプチャやバブリングの局面で処理することができます。このイベントの局面について完全な詳細は、 Element: paste イベントを参照してください。

+ +

例

+ +
document.addEventListener('paste', (event) => {
+    console.log('paste action initiated')
+});
+ +

仕様書

+ + + + + + + + + + + + + + +
仕様書状態
{{SpecName('Clipboard API', '#clipboard-event-paste')}}{{Spec2('Clipboard API')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.paste_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/performance/index.html b/files/ja/web/api/window/performance/index.html new file mode 100644 index 0000000000..bc9d03412f --- /dev/null +++ b/files/ja/web/api/window/performance/index.html @@ -0,0 +1,39 @@ +--- +title: Window.performance +slug: Web/API/Window/performance +translation_of: Web/API/Window/performance +--- +

{{APIRef("High Resolution Time")}}

+ +

{{domxref("Window")}} インタフェースのパフォーマンスプロパティは、現在のドキュメントに関するパフォーマンス情報を収集するために使用できる {{domxref("Performance")}} オブジェクトを返します。これはパフォーマンスタイムライン API、高解像度時間 API、ナビゲーションタイミング API、ユーザータイミング API およびリソースタイミング API の公開ポイントとして機能します。

+ +

構文

+ +
performanceData = window.performance;
+ +

値

+ +

それが公開する API によって提供されるパフォーマンスおよびタイミング関連情報へのアクセスを提供する {{domxref("Performance")}} オブジェクト。

+ +

仕様

+ + + + + + + + + + + + + + +
仕様ステータスコメント
{{SpecName('Highres Time', '#the-performance-interface', 'window.performance')}}{{Spec2('Highres Time')}}Defines now() method.
+ +

ブラウザの互換性

+ + + +

{{Compat("api.Window.performance")}}

diff --git a/files/ja/web/api/window/personalbar/index.html b/files/ja/web/api/window/personalbar/index.html new file mode 100644 index 0000000000..150a9b5784 --- /dev/null +++ b/files/ja/web/api/window/personalbar/index.html @@ -0,0 +1,77 @@ +--- +title: window.personalbar +slug: Web/API/Window/personalbar +tags: + - Gecko + - HTML DOM + - Window +translation_of: Web/API/Window/personalbar +--- +
{{ApiRef}}
+ +

概要

+ +

personalbar オブジェクトを返します。このバーの表示は、ウィンドウ内でトグル（表示/非表示の状態を切り替える）ことができます。

+ +

構文

+ +
objRef =window.personalbar
+
+ +

例

+ +

以下の完全な HTML の例は、様々な "bar" オブジェクトの visible プロパティで利用可能な方法を示しています。存在するウィンドウのあらゆるバーの visible プロパティ を書き換えるには、特権が必要です。

+ +
<!DOCTYPE html>
+<html lang="ja">
+<head>
+<meta charset="UTF-8" />
+<title>様々な DOM テスト</title>
+
+<script>
+// 存在するウィンドウのバーの状態を変更します
+netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserWrite");
+window.personalbar.visible = !window.personalbar.visible;
+</script>
+
+</head>
+<body>
+  <p>様々な DOM テスト</p>
+</body>
+</html>
+
+ +

注記

+ +

上記の例のページを読み込んだとき、ブラウザは、以下のダイアログを表示するでしょう。
+

+ +

バーの表示を切り替えるには、上記の例のように、スクリプトの実行と特権要求を許可しなければなりません。また、様々なツールバーの表示の動的な変更は、ウィンドウのサイズをかなり劇的に変化させることがあり、ページのレイアウトに影響する可能性があることに注意してください。

+ +

仕様

+ + + + + + + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('HTML WHATWG', 'browsers.html#dom-window-personalbar', 'Window.personalbar')}}{{Spec2('HTML WHATWG')}}
{{SpecName('HTML5 W3C', 'browsers.html#dom-window-personalbar', 'Window.personalbar')}}{{Spec2('HTML5 W3C')}}
+ +

関連情報

+ + diff --git a/files/ja/web/api/window/pkcs11/index.html b/files/ja/web/api/window/pkcs11/index.html new file mode 100644 index 0000000000..faa851a9d3 --- /dev/null +++ b/files/ja/web/api/window/pkcs11/index.html @@ -0,0 +1,29 @@ +--- +title: window.pkcs11 +slug: Web/API/Window/pkcs11 +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - Window + - 要更新 +translation_of: Web/API/Window/pkcs11 +--- +

{{ ApiRef() }} {{ 英語版章題("Summary") }}

+

概要

+

pcks11 プロトコル に関連するドライバや他のソフトウェアをインストールするために用いられる pkcs11 オブジェクトを返します。

+

{{ 英語版章題("Syntax") }}

+

構文

+
objRef = window.pkcs11
+
+

{{ 英語版章題("Example") }}

+

例

+
 window.pkcs11.addModule(sMod, secPath, 0, 0);
+
+

{{ 英語版章題("Notes") }}

+

注記

+

pcks11 オブジェクトの扱い方についてのさらなる情報は、nsIDOMPkcs11 を参照してください。

+

{{ 英語版章題("Specification") }}

+

仕様

+

{{ DOM0() }}

diff --git a/files/ja/web/api/window/postmessage/index.html b/files/ja/web/api/window/postmessage/index.html new file mode 100644 index 0000000000..a20570a66f --- /dev/null +++ b/files/ja/web/api/window/postmessage/index.html @@ -0,0 +1,191 @@ +--- +title: window.postMessage +slug: Web/API/Window/postMessage +tags: + - API + - Cross-origin Communication + - DOM + - HTML DOM + - Method + - Reference + - Window + - postMessage + - メソッド +translation_of: Web/API/Window/postMessage +--- +
{{ApiRef("HTML DOM")}}
+ +

window.postMessage() は、 {{domxref("Window")}} オブジェクト間で安全にクロスドメイン通信を可能にするためのメソッドです。例えば、ポップアップとそれを表示したページの間や、iframe とそれが埋め込まれたページの間での通信に使うことができます。

+ +

通常、異なった複数のページでのスクリプトはそれらが実行されたページが同じプロトコル、ポート番号、ホストである場合に限りお互いにアクセスすることが可能です ("同一オリジンポリシー" とも呼ばれます)。正しく使用した window.postMessage はこの制限を安全に回避するための制御された仕組みを提供します。

+ +

大まかには、ウィンドウが他のウィンドウへの参照を取得できる場合 ( targetWindow = window.opener など)、targetWindow.postMessage() を使って {{domxref("MessageEvent")}} をそのウィンドウ上で配信することができます。受け取ったウィンドウでは必要に応じて自由にイベントを処理することができます。window.postMessage() に渡された引数 (“message”) はイベントオブジェクトを通して対象のウィンドウに公開されます。

+ +

構文

+ +
targetWindow.postMessage(message, targetOrigin, [transfer]);
+ +
+
targetWindow
+
メッセージを受信するウィンドウへの参照。参照を取得する方法には以下のようなものがあります: +
    +
  • {{domxref("window.open")}} (新しいウィンドウを開き、それを参照する場合)
    • +
  • {{domxref("window.opener")}} (現在のウィンドウを開いたウィンドウを参照する場合)
    • +
  • {{domxref("HTMLIFrameElement.contentWindow")}} (埋め込んだ {{HTMLElement("iframe")}} を親ウィンドウから参照する場合)
    • +
  • {{domxref("window.parent")}} (埋め込まれた {{HTMLElement("iframe")}} の中から親ウィンドウを参照する場合)
    • +
  • {{domxref("window.frames")}} + 添字 (名前または数値)
    • +
+
+
message
+
他のウィンドウに送られるデータ。データは the structured clone algorithm に従ってシリアル化されます。つまり、手動でシリアル化することなく様々なデータオブジェクトを渡すことができます。
+
targetOrigin
+
イベントを配信する otherWindow のオリジンを "*" というリテラル文字列（制限しないことを示します）か URI のいずれかで指定します。もしイベントの配信が予約される時点で、targetWindow のドキュメントのスキーマ、ホスト名、あるいはポートが targetOrigin で指定されたものにマッチしない場合、そのイベントは配信されません。3 つすべてがマッチした場合にだけイベントが配信されます。この仕組みはメッセージがどこに送られるかを制御できるようにしています。例えば postMessage をパスワードを送るために利用する場合、悪意のある第三者によるパスワードの傍受を防ぐため、そのメッセージを受け取るべき受信者のオリジンと一致する URI をこの引数に指定しておくことが非常に重要になります。 送信先ウィンドウのドキュメントがどこに配置されるのかを知っている場合、* ではなく具体的な targetOrigin を指定してください。具体的なターゲットを指定しない場合、相手が悪意を持ったサイトであっても、送信したデータが公開されることを意味します。
+
transfer {{optional_Inline}}
+
メッセージと一緒に転送される {{domxref("Transferable")}} オブジェクトのシーケンス。これらのオブジェクトの所有権は送信先に移動され、送信元では使えなくなります。
+
+ +

配信されるイベント

+ +

otherWindow は以下の JavaScript を実行することで、配信されたメッセージを受け取ることができます。

+ +
window.addEventListener("message", receiveMessage, false);
+
+function receiveMessage(event) {
+  if (event.origin !== "http://example.org:8080")
+    return;
+
+  // ...
+}
+
+ +

配信されたメッセージは以下のプロパティを持ちます。

+ +
+
data
+
他のウィンドウから渡されたメッセージを保持しているオブジェクト。
+
origin
+
postMessage が呼び出されたときにメッセージを送るウィンドウのオリジン。この文字列は、プロトコルと "://"、ホスト名（存在する場合）、そして、":" の後に続くポート番号（デフォルトポートと指定するポートが異なる場合）が連結されたものです。典型的なオリジンの例は https://example.org (この場合のポートは 443)、http://example.net (この場合のポートは 80)、そして http://example.com:8080。このオリジン生成元はそのウィンドウの現在もしくは将来のオリジンであることを保証していないことに注意してください。postMessage が呼び出された時とは異なる場所に移動しているかもしれません。
+
source
+
メッセージを送った window オブジェクトへの参照。これを使うことでオリジンの異なる二つのウィンドウ間で双方向の通信を確立することができます。
+
+ +

セキュリティの考慮事項

+ +

他のサイトからメッセージを受け取りたくない場合、message イベントに対して一切イベントリスナーを追加しないでください。これはセキュリティ的な問題を避けるための完全にフールプルーフな方法です。

+ +

他のサイトからメッセージを受け取りたい場合、origin あるいは source プロパティを用いて常に送信者の識別情報を確かめてください。任意のウィンドウ（例えば、http://evil.example.com も含む）は任意の他のウィンドウにメッセージを送ることができ、見知らぬ送信者が悪意あるメッセージを送らない保証はありません。識別情報を確かめても、常に受け取ったメッセージの構文を確かめるべきです。さもなければ、信頼されたメッセージだけを送るとして信頼されたサイトにセキュリティホールが存在した場合に、クロスサイトスクリプティングのセキュリティホールをあなたのサイトに開けることになり得ます。

+ +

他のウィンドウに postMessage でデータを送信する場合、 * ではなく、常に具体的なターゲットオリジンを指定してください。 悪意を持ったサイトはあなたの知らないうちに送信先ウィンドウの場所を変更することができ、そのまま postMessage で送信されたデータを傍受することができてしまいます。

+ +

例

+ +
/*
+ * <http://example.com:8080> にある、window A のスクリプト:
+ */
+
+var popup = window.open(/* ポップアップの詳細 */);
+
+// ポップアップブロッカーでブロックされず、ポップアップが完全にロードされたとき
+
+// ウィンドウがその場所を変更していない場合、これは何もしません。
+popup.postMessage("ユーザー名は 'bob' 、パスワードは 'secret' です",
+                  "https://secure.example.net");
+
+// ウィンドウがその場所を変更していない場合、
+//これはポップアップに送るメッセージのキューに追加します。
+popup.postMessage("hello there!", "http://example.com");
+
+function receiveMessage(event)
+{
+  // このメッセージの送信者は信頼している者か？（例えば、最初開いたものと違
+  // うかもしれません）。
+  if (event.origin !== "http://example.com")
+    return;
+
+  // event.source は popup
+  // event.data は "hi there yourself!  the secret response is: rheeeeet!"
+}
+window.addEventListener("message", receiveMessage, false);
+
+ +
/*
+ * <http://example.org> で実行される popup のスクリプト:
+ */
+
+// postMessage が呼び出された後に呼び出されます。
+function receiveMessage(event)
+{
+  // このメッセージの送信者は信頼している者か？
+  if (event.origin !== "http://example.com:8080")
+    return;
+
+  // event.source は window.opener
+  // event.data は "hello there!"
+
+  // 受け取ったメッセージのオリジンを確かめたい場合（どんな場合でもそうするべ
+  // きです）、メッセージに返答するための便利なイディオムは event.source 上
+  // の postMessage を呼び出し、targetOrigin に event.origin を指定すること
+  // です。
+  event.source.postMessage("hi there yourself!  the secret response " +
+                           "is: rheeeeet!",
+                           event.origin);
+}
+
+window.addEventListener("message", receiveMessage, false);
+
+ +

注記

+ +

任意のウィンドウが、いつでも、ウィンドウの文書の場所にかかわらず、メッセージを送るために、任意の他のウィンドウ上でこのメソッドにアクセスするかもしれません。従って、任意のイベントリスナーはメッセージを受け取る際に、origin あるいは source プロパティを用いて、まず最初にメッセージの送信者の識別情報をチェックしなければなりません。これを軽視することはできません。なぜなら、origin あるいは source プロパティのチェックの失敗はクロスサイトスクリプティング攻撃を可能にするからです。

+ +

非同期に配信されるスクリプト（タイムアウト、ユーザーが生成したイベント）のために postMessage の呼び出し元の判別が不可能であるとき、postMessage によって送られるイベントを待ち受けているイベントハンドラは例外を投げます。

+ +

postMessage() は {{domxref("MessageEvent")}} を、すべての待ち状態の実行コンテキストが終了した後のみ配信するためにスケジューリングします。例えば、 postMessage() がイベントハンドラーから呼び出された場合、 {{domxref("MessageEvent")}} が配信される前に、そのイベントハンドラーが最後まで実行され、同じイベントの残りのハンドラーが実行されます。

+ +

配信されるイベントの origin プロパティは呼び出すウィンドウの document.domain の現在の値に影響されません。

+ +

IDN ホスト名に限った話ですが、origin プロパティの値が Unicode と Punycode のどちらなのかは一貫していません。ですから、IDN サイトからのメッセージを期待する場合にこのプロパティを用いるときは、互換性を高めるために、IDN と Punycode の両方でチェックしてください。この値は最終的には 一貫して IDN になるはずですが、現在は IDN と Punycode 両方の形式を扱うべきです。

+ +

送信元ウィンドウが javascript: や data: のURLを持つ場合、origin プロパティの値はその URL を読み込んだスクリプトのオリジンになります。

+ +

window.postMessage を拡張機能で使う {{Non-standard_inline}}

+ +

window.postMessage は chrome コードで実行される JavaScript で利用可能です（例：拡張内および特権コード）。しかし、配信されるイベントの source プロパティはセキュリティ上の制限から常に null です（他のプロパティは期待された値です）。

+ +

コンテンツスクリプトやウェブコンテキストスクリプトは targetOrigin を拡張機能 (バックグラウンドスクリプトやコンテンツスクリプト) と直接通信するために指定することはできません。ウェブやコンテンツのスクリプトは、 window.postMessage を targetOrigin を "*" にして使用することで、すべてのリスナーにブロードキャストすることができますが、これは拡張機能がそのようなメッセージのオリジンを特定することができないこと、他のリスナー (制御するべきでないものも含む) が待ち受けしている可能性があるため推奨されません。

+ +

コンテンツスクリプトでバックグラウンドスクリプトと通信したい場合は runtime.sendMessage を使うべきです。ウェブコンテキストスクリプトでバックグラウンドスクリプトと通信したい場合はカスタムイベント（ゲストページから覗かれなくない場合など、必要であればランダム生成したイベント名で）を使うことができます。

+ +

最後に、 file: URL のページへのメッセージを送るには targetOrigin 引数を "*" にする必要があります。 file:// はセキュリティ上の制限のために用いることはできません、この制限は将来修正されるかもしれません。

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('HTML WHATWG', "web-messaging.html#dom-window-postmessage", "postMessage()")}}{{Spec2('HTML WHATWG')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.postMessage")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/print/index.html b/files/ja/web/api/window/print/index.html new file mode 100644 index 0000000000..691c4d3961 --- /dev/null +++ b/files/ja/web/api/window/print/index.html @@ -0,0 +1,24 @@ +--- +title: window.print +slug: Web/API/Window/print +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference +translation_of: Web/API/Window/print +--- +
+ {{ApiRef()}}
+

概要

+

現在の文書を印刷するための印刷ダイアログを開きます。

+

構文

+
window.print()
+

仕様

+

{{DOM0()}}

+

関連情報

+ diff --git a/files/ja/web/api/window/prompt/index.html b/files/ja/web/api/window/prompt/index.html new file mode 100644 index 0000000000..d9b98d4394 --- /dev/null +++ b/files/ja/web/api/window/prompt/index.html @@ -0,0 +1,61 @@ +--- +title: window.prompt +slug: Web/API/Window/prompt +tags: + - DOM + - Gecko +translation_of: Web/API/Window/prompt +--- +
{{ApiRef()}}
+ +

概要

+ +

ユーザにテキストを入力することを促すメッセージを持つダイアログを表示します。

+ +

構文

+ +
result = window.prompt( text, value );
+ + + +

例

+ +
var sign = prompt("What's your sign?");
+
+if (sign.toLowerCase() == "scorpio") alert("Wow! I'm a Scorpio too!");
+
+// プロンプトの使い方には色々なものがあります。
+var sign = window.prompt(); // 空のプロンプトを表示
+var sign = prompt();       //  同上
+var sign = window.prompt("元気にしてる ?"); // 「元気にしてる ?」の文字列入りで表示
+var sign = window.prompt("元気にしてる ?", "元気だよ !"); // 「元気にしてる ?」 の文字列入りで、入力欄の初期値に「元気だよ !」を設定して表示
+ +

ユーザが OK ボタンをクリックすると、入力フィールドに入力されたテキストが返ります。ユーザがテキストを入力せずに OK をクリックする場合、空文字列が返ります。ユーザがキャンセルボタンをクリックする場合、この関数は、null を返します。

+ +

上記例のプロンプトは次の様に表示されます(※ Chrome on Windows 7)

+ +

+ +

注記

+ +

プロンプトダイアログは、単一の行のテキストボックス、キャンセルボタン、OK ボタンを含み、ユーザがテキストボックスに入力した（空の可能性もある）テキストを返します。

+ + +

Chrome のコード（拡張機能など）では、nsIPromptService メソッドを代わりに使うべきです。

+ +

Safari では、window.prompt をキャンセルした場合の戻り値が空文字であるため、テキストボックス内に何も入力されていない場合との差別化をはかることができませんので、注意して使うべきです。

+ +

仕様

+ +

{{dom0()}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/rejectionhandled_event/index.html b/files/ja/web/api/window/rejectionhandled_event/index.html new file mode 100644 index 0000000000..d671cbfeef --- /dev/null +++ b/files/ja/web/api/window/rejectionhandled_event/index.html @@ -0,0 +1,86 @@ +--- +title: 'Window: rejectionhandled イベント' +slug: Web/API/Window/rejectionhandled_event +tags: + - API + - Event + - HTML DOM + - JavaScript + - Promise + - Promises + - Reference + - Window + - Worker + - global + - onrejectionhandled + - rejectionhandled + - イベント +translation_of: Web/API/Window/rejectionhandled_event +--- +
{{APIRef("HTML DOM")}}
+ +

rejectionhandled イベントは、 JavaScript の {{jsxref("Promise")}} が拒絶されたものの、その後で Promise の拒絶が処理された場合にスクリプトのグローバルスコープ (ふつうは {{domxref("window")}} だが {{domxref("Worker")}} の場合もある) に送られます。これは、 Promise が拒絶されたが拒絶の手助けがないときに送信される {{domxref("Window.unhandledrejection_event", "unhandledrejection")}} イベントと並行して、デバッグや一般的なアプリケーションの回復に使用できます。

+ + + + + + + + + + + + + + + + + + + + +
バブリングなし
キャンセル可能いいえ
インターフェイス{{domxref("PromiseRejectionEvent")}}
イベントハンドラープロパティ{{domxref("WindowEventHandlers.onrejectionhandled", "onrejectionhandled")}}
+ +

例

+ +

rejectionhandled イベントを使用して、拒絶された Promise を、拒絶された理由を添えてコンソールに出力することができます。

+ +
window.addEventListener("rejectionhandled", event => {
+  console.log("Promise rejected; reason: " + event.reason);
+}, false);
+
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('HTML WHATWG', 'webappapis.html#unhandled-promise-rejections', 'rejectionhandled')}}{{Spec2('HTML WHATWG')}}初回定義
+ +

ブラウザーの対応

+ + + +

{{Compat("api.Window.rejectionhandled_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/releaseevents/index.html b/files/ja/web/api/window/releaseevents/index.html new file mode 100644 index 0000000000..3aff175902 --- /dev/null +++ b/files/ja/web/api/window/releaseevents/index.html @@ -0,0 +1,42 @@ +--- +title: window.releaseEvents +slug: Web/API/Window/releaseEvents +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - 要更新 +translation_of: Web/API/Window/releaseEvents +--- +

 

+

{{ ApiRef() }} {{ 英語版章題("Summary") }}

+

概要

+

{{ Obsolete_header() }} 指定したタイプのイベントを補足することを解除します。

+

{{ 英語版章題("Syntax") }}

+

構文

+
window.releaseEvents(eventType)
+
+

eventType は、次の値の組み合わせを取ります。: Event.ABORT, Event.BLUR, Event.CLICK, Event.CHANGE, Event.DBLCLICK, Event.DRAGDDROP, Event.ERROR, Event.FOCUS, Event.KEYDOWN, Event.KEYPRESS, Event.KEYUP, Event.LOAD, Event.MOUSEDOWN, Event.MOUSEMOVE, Event.MOUSEOUT, Event.MOUSEOVER, Event.MOUSEUP, Event.MOVE, Event.RESET, Event.RESIZE, Event.SELECT, Event.SUBMIT, Event.UNLOAD.

+

{{ 英語版章題("Example") }}

+

例

+
window.releaseEvents(Event.KEYPRESS)
+
+

{{ 英語版章題("Notes") }}

+

注記

+
+

W3C DOM Events メソッドを支持するにあたり、このメソッドは Gecko 1.9 では廃止されました（addEventListener を参照してください）。このメソッドのサポートは Gecko 1.9 で 削除されました。

+
+

注：次の構文を使用することでこのメソッドにイベントのリストを渡すことができます。

+
+
+ window.releaseEvents(Event.KEYPRESS | Event.KEYDOWN | Event.KEYUP).
+
+

window.captureEvents も参照してください ({{ Obsolete_inline() }})。

+

{{ 英語版章題("Specification") }}

+

仕様

+

{{ DOM0() }}

+

 

+
+  
+

{{ languages( { "en": "en/DOM/window.releaseEvents", "pl": "pl/DOM/window.releaseEvents" } ) }}

diff --git a/files/ja/web/api/window/requestanimationframe/index.html b/files/ja/web/api/window/requestanimationframe/index.html new file mode 100644 index 0000000000..5bd58aea29 --- /dev/null +++ b/files/ja/web/api/window/requestanimationframe/index.html @@ -0,0 +1,112 @@ +--- +title: Window.requestAnimationFrame() +slug: Web/API/Window/requestAnimationFrame +tags: + - API + - Animations + - DOM + - DOM Reference + - Drawing + - Games + - Graphics + - Intermediate + - JavaScript timers + - Method + - Performance + - Reference + - Scheduling + - Window + - requestAnimationFrame +translation_of: Web/API/window/requestAnimationFrame +--- +
{{APIRef}}
+ +

window.requestAnimationFrame() メソッドは、ブラウザにアニメーションを行いたいことを知らせ、指定した関数を呼び出して次の再描画の前にアニメーションを更新することを要求します。このメソッドは、再描画の前に呼び出されるコールバック 1 個を引数として取ります。

+ +
メモ: 次の再描画時に別のフレームをアニメーションさせたいときは、コールバックルーチン自身で requestAnimationFrame() を呼ばなければなりません。
+ +

このメソッドは、いつでも画面上でアニメーションの更新準備が整った時に呼び出してください。これにより、ブラウザの次の再描画が実行される前にアニメーション関数が呼び出されることを要求します。このコールバックの回数は、たいてい毎秒 60 回ですが、一般的に多くのブラウザーでは W3C の勧告に従って、ディスプレイのリフレッシュレートに合わせて行われます。ただし、コールバックの確率は、バックグラウンドのタブや隠れた {{ HTMLElement("iframe") }} では、パフォーマンス向上やバッテリー消費を減らすために低くなるでしょう。

+ +

コールバックメソッドには、1 個の引数 {{domxref("DOMHighResTimeStamp")}} が渡されます。これは、requestAnimationFrame の発火開始によりコールバックがキューに追加された時点の現在時刻を示します。単一フレーム内で複数のコールバックがあり、前のコールバックで計算負荷が生じていいても、各コールバックは同じタイムスタンプを受け取ります。このタイムスタンプは、ミリ秒単位の十進数ですが、その最小精度は 1ms (1000 µs) です。

+ +

構文

+ +
window.requestAnimationFrame(callback);
+
+ +

引数

+ +
+
callback
+
次の再描画でアニメーションを更新する時に呼び出す関数を指定します。コールバック関数は 1 個の引数 {{domxref("DOMHighResTimeStamp")}} を受け取ります。この引数は、requestAnimationFrame がコールバックの呼び出しを開始した現在時刻 ( {{domxref('performance.now()')}} から返された時刻 ) を示します。
+
+ +

返値

+ +

コールバックリスト内のエントリーを一意に識別するための、倍精度整数値の requestID を返します。この値は非ゼロ値ですが、値そのものを推定することはできないでしょう。この値を {{domxref("window.cancelAnimationFrame()")}} に渡すことで、コールバック関数の更新を中止できます。

+ +

例

+ +
var start = null;
+var element = document.getElementById('SomeElementYouWantToAnimate');
+
+function step(timestamp) {
+  if (!start) start = timestamp;
+  var progress = timestamp - start;
+  element.style.transform = 'translateX(' + Math.min(progress / 10, 200) + 'px)';
+  if (progress < 2000) {
+    window.requestAnimationFrame(step);
+  }
+}
+
+window.requestAnimationFrame(step);
+
+ +

メモ

+ +

Edge のバージョン17以前と Internet Explorer は、描画サイクルの前に requestAnimationFrame を確実に発行するとは限りません。

+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('HTML WHATWG', '#animation-frames', 'requestAnimationFrame')}}{{Spec2('HTML WHATWG')}}変更なし、以前のものを置き換える
{{SpecName('RequestAnimationFrame', '#dom-windowanimationtiming-requestanimationframe', 'requestAnimationFrame')}}{{Spec2('RequestAnimationFrame')}}初回定義
+ +

ブラウザーの対応

+ +
+ + +

{{Compat("api.Window.requestAnimationFrame")}}

+
+ +

関連情報

+ + diff --git a/files/ja/web/api/window/requestidlecallback/index.html b/files/ja/web/api/window/requestidlecallback/index.html new file mode 100644 index 0000000000..9e45f49a13 --- /dev/null +++ b/files/ja/web/api/window/requestidlecallback/index.html @@ -0,0 +1,74 @@ +--- +title: requestIdleCallback +slug: Web/API/Window/requestIdleCallback +tags: + - API + - HTML DOM + - JavaScript timer + - Reference + - Window +translation_of: Web/API/Window/requestIdleCallback +--- +

{{APIRef("HTML DOM")}}{{SeeCompatTable}}

+ +

window.requestIdleCallback() メソッドを利用すると、ブラウザーがアイドル状態の時に実行される関数をキューに登録できます。これにより、アニメーションや入力への応答など、遅延が問題となる処理に影響を与えることなく、優先度の低いバックグラウンド処理をメインスレッド内で実行させられます。キューに登録された関数は、関数登録時に設定したタイムアウト時間（timeout）に達していない限り、登録順に呼び出されます。

+ +

requestIdleCallback() をアイドルコールバック関数からコールし、次のイベントループ以降で実行されるようにスケジュールもできます。

+ +
timeout は必須のタスクにおいては設定することを強くおすすめします。設定しない場合、コールバックが実行するまでに数秒かかってしまう可能性もあるからです。
+ +

構文

+ +
var handle = window.requestIdleCallback(callback[, options])
+ +

返り値

+ +

{{domxref("Window.cancelIdleCallback()")}} メソッドで、実行をキャンセルする際に使用するIDを返します。

+ +

引数

+ +
+
callback
+
イベントループがアイドル状態のときに実行したい関数への参照。コールバック関数には {{domxref("IdleDeadline")}} オブジェクトが渡されます。これはアイドル状態の際に余っている時間と、コールバックが実行されたかされていないかを示します。コールバックの実行有無は、タイムアウト期間が終了してしまったかどうかに左右されます。
+
options {{optional_inline}}
+
任意の設定パラメータです。現在はひとつのプロパティのみ定義されています。 +
    +
  • timeout：timeout に正の値が指定され、かつコールバックがその値の期間（ミリ秒）内に実行されていない場合、コールバックは次のアイドル期間に実行されます。それがパフォーマンスに悪影響があったとしても、それを加味することはありません。
    • +
+
+
+ +

Example

+ +

Cooperative Scheduling of Background Tasks APIの記事で、例を一式紹介しています。

+ +

仕様

+ + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('Background Tasks')}}{{Spec2('Background Tasks')}}初期定義
+ +

ブラウザ互換性

+ +

{{Compat("api.Window.requestIdleCallback")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/resizeby/index.html b/files/ja/web/api/window/resizeby/index.html new file mode 100644 index 0000000000..43e86c4422 --- /dev/null +++ b/files/ja/web/api/window/resizeby/index.html @@ -0,0 +1,38 @@ +--- +title: window.resizeBy +slug: Web/API/Window/resizeBy +tags: + - DOM + - DOM Reference + - DOM_0 + - Window +translation_of: Web/API/Window/resizeBy +--- +
+ {{ApiRef}}
+

概要

+

現在のウィンドウを特定の量だけリサイズします。

+

構文

+
window.resizeBy(xDelta, yDelta)
+
+

引数

+ +

例

+
// ウィンドウを縮める
+window.resizeBy(-200, -200);
+
+

注記

+

Firefox 7 より、Web サイトは以下の規則に従う場合のみしかブラウザウィンドウの初期サイズを変更する事が出来なくなりました。

+
    +
  1. window.open で作成されたウィンドウ（またはタブ）しかリサイズ出来ません。
    2. +
  2. ウィンドウが複数のタブを持つ場合、ウィンドウ（またはタブ）のリサイズは出来ません。
    3. +
+

仕様

+

{{dom0}}

+

関連情報

+ diff --git a/files/ja/web/api/window/resizeto/index.html b/files/ja/web/api/window/resizeto/index.html new file mode 100644 index 0000000000..b67f73b9d5 --- /dev/null +++ b/files/ja/web/api/window/resizeto/index.html @@ -0,0 +1,42 @@ +--- +title: window.resizeTo +slug: Web/API/Window/resizeTo +tags: + - DOM + - DOM Reference + - DOM_0 + - Window +translation_of: Web/API/Window/resizeTo +--- +
+ {{ApiRef}}
+

概要

+

ウィンドウサイズを動的に変更します。

+

構文

+
window.resizeTo(iWidth, iHeight)
+
+

引数

+ +

例

+
// ウィンドウサイズの縦尺および横尺を半分に (面積を 4 分の 1 に) する関数
+function quarter() {
+  window.resizeTo(
+    window.screen.availWidth  / 2,
+    window.screen.availHeight / 2
+  );
+}
+

注記

+

Firefox 7 より、Web サイトは以下の規則に従う場合のみしかブラウザウィンドウの初期サイズを変更する事が出来なくなりました。

+
    +
  1. window.open で作成されたウィンドウ（またはタブ）しかリサイズ出来ません。
    2. +
  2. ウィンドウが複数のタブを持つ場合、ウィンドウ（またはタブ）のリサイズは出来ません。
    3. +
+

仕様

+

{{dom0}}

+

関連情報

+ diff --git a/files/ja/web/api/window/restore/index.html b/files/ja/web/api/window/restore/index.html new file mode 100644 index 0000000000..3fbd8503f2 --- /dev/null +++ b/files/ja/web/api/window/restore/index.html @@ -0,0 +1,10 @@ +--- +title: Window.restore() +slug: Web/API/Window/restore +translation_of: Web/API/Window/moveTo +--- +

{{APIRef}}

+ +

このメソッドは現在動作していませんが、代わりに次のメソッドを利用することができます:

+ +

window.moveTo(window.screenX, window.screenY);

diff --git a/files/ja/web/api/window/screen/index.html b/files/ja/web/api/window/screen/index.html new file mode 100644 index 0000000000..a78bf0e563 --- /dev/null +++ b/files/ja/web/api/window/screen/index.html @@ -0,0 +1,52 @@ +--- +title: Window.screen +slug: Web/API/Window/screen +tags: + - API + - CSSOM View + - HTML DOM + - Property + - Window +translation_of: Web/API/Window/screen +--- +

{{APIRef("CSSOM")}}

+ +

{{DOMxRef("Window")}} の screen プロパティは、ウィンドウに関連付けられた画面オブジェクトへの参照を返します。 screen オブジェクトは {{DOMxRef("Screen")}} インターフェースを実装しており、現在のウィンドウがレンダリングされている画面のプロパティを検査するための特別なオブジェクトです。

+ +

構文

+ +
let screenObj = window.screen;
+ +

例

+ +
if (screen.pixelDepth < 8) {
+  // use low-color version of page
+} else {
+  // use regular, colorful page
+}
+
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('CSSOM View', '#dom-window-screen', 'window.screen')}}{{Spec2('CSSOM View')}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.screen")}}

diff --git a/files/ja/web/api/window/screenx/index.html b/files/ja/web/api/window/screenx/index.html new file mode 100644 index 0000000000..01ad72c62b --- /dev/null +++ b/files/ja/web/api/window/screenx/index.html @@ -0,0 +1,29 @@ +--- +title: window.screenX +slug: Web/API/Window/screenX +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - 要更新 +translation_of: Web/API/Window/screenX +--- +

{{ ApiRef() }} {{ 英語版章題("Summary") }}

+

概要

+

画面の左端からユーザのブラウザの左端までの水平距離を返します。

+

{{ 英語版章題("Syntax") }}

+

構文

+
lLoc = window.screenX
+
+

{{ 英語版章題("Parameters") }}

+

戻り値

+ +

{{ 英語版章題("Notes") }}

+

注記

+

window.screenY も参照してください。

+

{{ 英語版章題("Specification") }}

+

仕様

+

{{ DOM0() }}

diff --git a/files/ja/web/api/window/screeny/index.html b/files/ja/web/api/window/screeny/index.html new file mode 100644 index 0000000000..727b447443 --- /dev/null +++ b/files/ja/web/api/window/screeny/index.html @@ -0,0 +1,29 @@ +--- +title: window.screenY +slug: Web/API/Window/screenY +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - 要更新 +translation_of: Web/API/Window/screenY +--- +

{{ ApiRef() }} {{ 英語版章題("Summary") }}

+

概要

+

画面の上端からユーザのブラウザの上端までの垂直距離を返します。

+

{{ 英語版章題("Syntax") }}

+

構文

+
lLoc = window.screenY
+
+

{{ 英語版章題("Parameters") }}

+

戻り値

+ +

{{ 英語版章題("Notes") }}

+

注記

+

window.screenX も参照してください。

+

{{ 英語版章題("Specification") }}

+

仕様

+

{{ DOM0() }}

diff --git a/files/ja/web/api/window/scroll/index.html b/files/ja/web/api/window/scroll/index.html new file mode 100644 index 0000000000..6bc2c589e8 --- /dev/null +++ b/files/ja/web/api/window/scroll/index.html @@ -0,0 +1,82 @@ +--- +title: window.scroll +slug: Web/API/Window/scroll +tags: + - CSSOM View + - DOM +translation_of: Web/API/Window/scroll +--- +

{{ApiRef}}

+ +

概要

+ +

ウィンドウを文書内の特定の位置までスクロールします。

+ +

構文

+ +
window.scroll(x-coord,y-coord)
+window.scroll(options)
+
+ +

引数

+ + + +

または

+ + + +

例

+ +
<!-- 100 個目の垂直ピクセル上にウィンドウの最上部を配置します。 -->
+
+<button onClick="scroll(0, 100);">click to scroll down 100 pixels</button>
+
+ +

スクロールの動作を変更する

+ +

スクロールの仕方を変えたいなら、options で指定してください

+ +
window.scroll({
+  top: 1000,
+  behavior: "smooth"
+});
+ +

注記

+ +

効果としては、 {{domxref("window.scrollTo")}} もこのメソッドと同じです。 繰り返し特定の距離をスクロールさせるには {{domxref("window.scrollBy")}} を使用してください。

+ +

次のページもご覧下さい : {{domxref("window.scrollByLines")}} 、 {{domxref("window.scrollByPages")}} 、 {{domxref("Element.scrollIntoView()")}}

+ +

仕様

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{ SpecName('CSSOM View', '#dom-window-scroll', 'window.scroll()') }}{{ Spec2('CSSOM View') }} +

Initial definition.

+
diff --git a/files/ja/web/api/window/scrollbars/index.html b/files/ja/web/api/window/scrollbars/index.html new file mode 100644 index 0000000000..3ad2ce63e5 --- /dev/null +++ b/files/ja/web/api/window/scrollbars/index.html @@ -0,0 +1,70 @@ +--- +title: window.scrollbars +slug: Web/API/Window/scrollbars +tags: + - Gecko + - HTML DOM + - Window +translation_of: Web/API/Window/scrollbars +--- +
{{ApiRef}}
+ +

概要

+ +

scrollbars オブジェクトを返します。このバーの表示は、ウィンドウ内でトグル（表示/非表示の状態を切り替える）ことができます。

+ +

構文

+ +
objRef = window.scrollbars
+
+ +

例

+ +

以下の完全な HTML の例は、様々な "bar" オブジェクトの visible プロパティで利用可能な方法を示しています。

+ +
<DOCTYPE html>
+<html lang="ja">
+<head>
+<meta charset="UTF-8" />
+<title>様々な DOM テスト</title>
+
+<script>
+// 存在するウィンドウのバーの状態を変更します
+netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserWrite");
+window.scrollbars.visible = !window.scrollbars.visible;
+</script>
+
+</head>
+<body>
+  <p>様々な DOM テスト</p>
+</body>
+</html>
+
+ +

仕様

+ + + + + + + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('HTML WHATWG', 'browsers.html#dom-window-scrollbars', 'Window.scrollbars')}}{{Spec2('HTML WHATWG')}}
{{SpecName('HTML5 W3C', 'browsers.html#dom-window-scrollbars', 'Window.scrollbars')}}{{Spec2('HTML5 W3C')}}
+ +

関連情報

+ + diff --git a/files/ja/web/api/window/scrollby/index.html b/files/ja/web/api/window/scrollby/index.html new file mode 100644 index 0000000000..28b8ea032a --- /dev/null +++ b/files/ja/web/api/window/scrollby/index.html @@ -0,0 +1,66 @@ +--- +title: window.scrollBy +slug: Web/API/Window/scrollBy +tags: + - API + - CSSOM View + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - Method + - Reference + - Window +translation_of: Web/API/Window/scrollBy +--- +
{{ApiRef}}
+ +

概要

+ +

指定された量だけウィンドウ内の文書をスクロールします。

+ +

構文

+ +
window.scrollBy(X,Y);
+window.scrollBy(options)
+
+ +

引数

+ + + +

- または -

+ + + +

例

+ +

1ページ下スクロールの例:

+ +
window.scrollBy(0, window.innerHeight);
+
+ +

上スクロールの例:

+ +
window.scrollBy(0, -window.innerHeight);
+ +

options の使用例:

+ +
window.scrollBy({
+  top: 100,
+  left: 100,
+  behavior: 'smooth'
+});
+ +

注記

+ +

{{domxref("window.scrollBy")}} は、指定量のスクロール、 {{domxref("window.scroll")}} は、文書の絶対座標へのスクロールです。 {{domxref("window.scrollByLines")}} 、{{domxref("window.scrollByPages")}} も参照してください。

+ +

仕様

+ +

{{DOM0}}

diff --git a/files/ja/web/api/window/scrollbylines/index.html b/files/ja/web/api/window/scrollbylines/index.html new file mode 100644 index 0000000000..c510a70844 --- /dev/null +++ b/files/ja/web/api/window/scrollbylines/index.html @@ -0,0 +1,38 @@ +--- +title: window.scrollByLines +slug: Web/API/Window/scrollByLines +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - 要更新 +translation_of: Web/API/Window/scrollByLines +--- +

{{ ApiRef() }} {{ 英語版章題("Summary") }}

+

概要

+

指定した行分文書をスクロールします。 {{ 英語版章題("Syntax") }}

+

構文

+
window.scrollByLines(lines)
+
+

{{ 英語版章題("Parameters") }}

+

引数

+ + +

{{ 英語版章題("Example") }}

+

例

+
// 5 行分文書をスクロールダウンします。
+<button onclick="scrollByLines(5);">down 5 lines</button>
+
+
// 5 行分文書をスクロールアップします。
+<button onclick="scrollByLines(-5);">up 5 lines</button>
+
+

{{ 英語版章題("Notes") }}

+

注記

+

{{domxref("window.scrollBy")}}、{{domxref("window.scrollByPages")}} も参照してください。 {{ 英語版章題("Specification") }}

+

仕様

+

{{ DOM0() }}

diff --git a/files/ja/web/api/window/scrollbypages/index.html b/files/ja/web/api/window/scrollbypages/index.html new file mode 100644 index 0000000000..3e76e6bed6 --- /dev/null +++ b/files/ja/web/api/window/scrollbypages/index.html @@ -0,0 +1,38 @@ +--- +title: window.scrollByPages +slug: Web/API/Window/scrollByPages +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - Window + - 要更新 +translation_of: Web/API/Window/scrollByPages +--- +

{{ ApiRef() }} {{ 英語版章題("Summary") }}

+

概要

+

指定したページ分文書をスクロールします。 {{ 英語版章題("Syntax") }}

+

構文

+
window.scrollByPages(pages)
+
+

{{ 英語版章題("Parameters") }}

+

引数

+ +

{{ 英語版章題("Example") }}

+

例

+
// 1 ページ分文書をスクロールダウンします。
+window.scrollByPages(1);
+
+// 1 ページ分文書をスクロールアップします。
+window.scrollByPages(-1);
+
+

{{ 英語版章題("Notes") }}

+

注記

+

{{domxref("window.scrollBy")}}、{{domxref("window.scrollByLines")}}、{{domxref("window.scroll")}}、{{domxref("window.scrollTo")}}
+ も参照してください。 {{ 英語版章題("Specification") }}

+

仕様

+

{{ DOM0() }}

diff --git a/files/ja/web/api/window/scrollmaxx/index.html b/files/ja/web/api/window/scrollmaxx/index.html new file mode 100644 index 0000000000..243cd07ab8 --- /dev/null +++ b/files/ja/web/api/window/scrollmaxx/index.html @@ -0,0 +1,37 @@ +--- +title: window.scrollMaxX +slug: Web/API/Window/scrollMaxX +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - 要更新 +translation_of: Web/API/Window/scrollMaxX +--- +

{{ ApiRef() }}

+

{{ 英語版章題("Summary") }}

+

概要

+

文書が水平スクロールされ得る最大ピクセル数を返します。

+

{{ 英語版章題("Syntax") }}

+

構文

+
xpix = window.scrollMaxX
+
+

{{ 英語版章題("Parameters") }}

+

引数

+ +

{{ 英語版章題("Example") }}

+

例

+
// ページの右端までスクロールします。
+ var maxX = window.scrollMaxX;
+ window.scrollTo(maxX, 0);
+
+

{{ 英語版章題("Notes") }}

+

注記

+

このプロパティは、文書の幅の合計を取得するために使用してください。文書の幅の合計は、window.innerWidth + window.scrollMaxX と同等です。

+

window.scrollMaxY も参照してください。

+

{{ 英語版章題("Specification") }}

+

仕様

+

{{ DOM0() }}

diff --git a/files/ja/web/api/window/scrollmaxy/index.html b/files/ja/web/api/window/scrollmaxy/index.html new file mode 100644 index 0000000000..5f8cf61308 --- /dev/null +++ b/files/ja/web/api/window/scrollmaxy/index.html @@ -0,0 +1,38 @@ +--- +title: window.scrollMaxY +slug: Web/API/Window/scrollMaxY +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - Window + - 要更新 +translation_of: Web/API/Window/scrollMaxY +--- +

{{ ApiRef() }}

+

{{ 英語版章題("Summary") }}

+

概要

+

文書が垂直スクロールされ得る最大ピクセル数を返します。

+

{{ 英語版章題("Syntax") }}

+

構文

+
ypix = window.scrollMaxY
+
+

{{ 英語版章題("Parameters") }}

+

戻り値

+ +

{{ 英語版章題("Example") }}

+

例

+
// ページの最下部までスクロールします。
+ var maxY = window.scrollMaxY;
+ window.scrollTo(0,maxY);
+
+

{{ 英語版章題("Notes") }}

+

注記

+

このプロパティは、文書の高さの合計を取得するために使用してください。文書の高さの合計は、window.innerHeight + window.scrollMaxY と同等です。

+

window.scrollMaxX と window.scrollTo も参照してください。

+

{{ 英語版章題("Specification") }}

+

仕様

+

{{ DOM0() }}

diff --git a/files/ja/web/api/window/scrollto/index.html b/files/ja/web/api/window/scrollto/index.html new file mode 100644 index 0000000000..fb80f7819e --- /dev/null +++ b/files/ja/web/api/window/scrollto/index.html @@ -0,0 +1,77 @@ +--- +title: window.scrollTo +slug: Web/API/Window/scrollTo +tags: + - API + - CSSOM View + - Method + - NeedsMarkupWork + - Reference +translation_of: Web/API/Window/scrollTo +--- +

{{APIRef}}

+ +

Window.scrollTo() は文書内の特定の組み合わせの座標までスクロールします。

+ +

構文

+ +
window.scrollTo(x-coord, y-coord)
+window.scrollTo(options)
+
+ +

引数

+ + + +

- または -

+ + + +

例

+ +
window.scrollTo(0, 1000);
+
+ +

options の使用例:

+ +
window.scrollTo({
+  top: 100,
+  left: 100,
+  behavior: 'smooth'
+});
+ +

注

+ +

{{domxref("Window.scroll()")}} はこのメソッドとほぼ同じです。相対スクロールについては、 {{domxref("Window.scrollBy()")}}, {{domxref("Window.scrollByLines()")}}, {{domxref("Window.scrollByPages()")}} を参照してください。

+ +

要素をスクロールするには、 {{domxref("Element.scrollTop")}} および {{domxref("Element.scrollLeft")}} を参照してください。

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{ SpecName('CSSOM View', '#dom-window-scroll', 'window.scroll()') }}{{ Spec2('CSSOM View') }}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.scrollTo")}}

diff --git a/files/ja/web/api/window/scrollx/index.html b/files/ja/web/api/window/scrollx/index.html new file mode 100644 index 0000000000..94852e3996 --- /dev/null +++ b/files/ja/web/api/window/scrollx/index.html @@ -0,0 +1,157 @@ +--- +title: window.scrollX +slug: Web/API/Window/scrollX +tags: + - API + - CSSOM View + - Property + - Reference +translation_of: Web/API/Window/scrollX +--- +
{{APIRef("CSSOM View")}}
+ +

{{domxref("Window")}} インターフェイスの読み取り専用プロパティである scrollX は、文書が水平スクロールされているピクセル数を返します。現代のブラウザーではこの値がサブピクセル精度ですので、必ずしも整数であるとは限りません。文書が垂直スクロールされているピクセル数は、{{domxref("Window.scrollY", "scrollY")}} プロパティで取得できます。

+ +

構文

+ +
var x = window.scrollX;
+ +

値

+ +

実際に返される値は、文書が原点から水平方向にスクロールされた量をピクセル数で表す倍精度浮動小数点数です。正の値は、内容物が左にスクロールされていることを表します。文書がサブピクセル精度のデバイスに表示されている場合は、戻り値も小数部を含むサブピクセル精度の値になります。文書が左にも右にもスクロールされていない場合の scrollX は 0 です。

+ +
+

整数値が必要である場合は、{{jsxref("Math.round()")}} を使用して切り捨てできます。

+
+ +

専門用語で説明すると scrollX は、現在の {{Glossary("viewport", "ビューポート")}} の左端の X 座標を返します。ビューポートがない場合の戻り値は 0 です。

+ +

例

+ +

これは、文書の現在の水平スクロール位置を確認する例です。400 ピクセルより大きい場合は、文書の左上にスクロール位置をリセットします。

+ +
if (window.scrollX > 400) {
+  window.scroll(0,0);
+}
+ +

注記

+ +

pageXOffset プロパティは、scrollX プロパティのエイリアスです。:

+ +
window.pageXOffset == window.scrollX; // 常に true
+ +

クロスブラウザー互換性のため、window.scrollX ではなく window.pageXOffset を使用します。さらに、古いバージョンの Internet Explorer (IE9 以前) はいずれもサポートしていないため、チェックの上、なければ他の非標準の方法で回避する必要があります。以下に互換性を確保した例を示します。

+ +
var x = (window.pageXOffset !== undefined)
+  ? window.pageXOffset
+  : (document.documentElement || document.body.parentNode || document.body).scrollLeft;
+
+var y = (window.pageYOffset !== undefined)
+  ? window.pageYOffset
+  : (document.documentElement || document.body.parentNode || document.body).scrollTop;
+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様状況備考
{{ SpecName('CSSOM View', '#dom-window-scrollx', 'window.scrollX') }}{{ Spec2('CSSOM View') }} 
+ +

ブラウザー実装状況

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
基本サポート{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
サブピクセル精度{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatGeckoDesktop(55)}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能AndroidAndroid WebviewEdgeFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari MobileAndroid 版 Chrome
基本サポート{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}
サブピクセル精度{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatGeckoMobile(55)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}
+
+ +

関連情報

+ + diff --git a/files/ja/web/api/window/scrolly/index.html b/files/ja/web/api/window/scrolly/index.html new file mode 100644 index 0000000000..85195fc8bd --- /dev/null +++ b/files/ja/web/api/window/scrolly/index.html @@ -0,0 +1,87 @@ +--- +title: window.scrollY +slug: Web/API/Window/scrollY +tags: + - API + - CSSOM View + - Property + - Reference + - Window + - scrollY + - プロパティ +translation_of: Web/API/Window/scrollY +--- +
{{APIRef("CSSOM View")}}
+ +

{{domxref("Window")}} インターフェイスの読み取り専用プロパティである scrollY は、文書が現在垂直方向にスクロールしているピクセル数を返します。最近のブラウザーでは、この値はサブピクセル精度ですので、必ずしも整数であるとは限りません。文書が水平方向にスクロールしているピクセル数は {{domxref("Window.scrollX", "scrollX")}} プロパティで取得できます。

+ +

構文

+ +
var y = window.scrollY
+ +

値

+ +

実際に返される値は、文書が原点から垂直方向にスクロールした量をピクセル数で表す倍精度浮動小数点値であり、正の値は、内容物が上にスクロールしていることを表します。文書がサブピクセル精度の端末に表示されている場合は、返値も小数部を含むサブピクセル精度の値になります。文書が上にも下にもスクロールしていない場合、 scrollY は 0 になります。

+ +
+

整数値が必要である場合は、 {{jsxref("Math.round()")}} を使用して四捨五入してください。

+
+ +

専門用語で説明すると scrollY は、現在の {{Glossary("viewport", "ビューポート")}} の上端の Y 座標を返します。ビューポートがない場合の戻り値は 0 です。

+ +

例

+ +
// スクロールしている場合、戻してから次のページへスクロールダウン
+if (window.scrollY) {
+  window.scroll(0, 0); //文書の左上にスクロール位置をリセット
+}
+
+window.scrollByPages(1);
+ +

メモ

+ +

{{domxref("window.scrollBy", "scrollBy()")}}、{{domxref("window.scrollByLines", "scrollByLines()")}}、{{domxref("window.scrollByPages", "scrollByPages()")}} のような相対スクロールする関数を使用する際に、文書がすでにスクロールしていないかをチェックするためにこのプロパティを使用してください。

+ +

pageYOffset プロパティは、scrollY プロパティのエイリアスです。

+ +
window.pageYOffset === window.scrollY; // 常に true
+ +

クロスブラウザー互換性のため、window.scrollY ではなく window.pageYOffset を使用します。さらに、古いバージョンの Internet Explorer (IE9 以前) はいずれもサポートしていないため、チェックの上、なければ他の非標準の方法で回避する必要があります。以下に互換性を確保した例を示します。

+ +
var supportPageOffset = window.pageXOffset !== undefined;
+var isCSS1Compat = ((document.compatMode || "") === "CSS1Compat");
+
+var x = supportPageOffset ? window.pageXOffset : isCSS1Compat ? document.documentElement.scrollLeft : document.body.scrollLeft;
+var y = supportPageOffset ? window.pageYOffset : isCSS1Compat ? document.documentElement.scrollTop : document.body.scrollTop;
+
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{ SpecName('CSSOM View', '#dom-window-scrolly', 'window.scrollY') }}{{ Spec2('CSSOM View') }} 
+ +

ブラウザーの対応

+ + + +

{{Compat("api.Window.scrollY")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/self/index.html b/files/ja/web/api/window/self/index.html new file mode 100644 index 0000000000..8a884828f3 --- /dev/null +++ b/files/ja/web/api/window/self/index.html @@ -0,0 +1,123 @@ +--- +title: window.self +slug: Web/API/Window/self +tags: + - API + - Gecko + - HTML DOM + - Property + - Read-only + - Reference + - Window +translation_of: Web/API/Window/self +--- +

{{ APIRef() }}

+ +

Window.self 読み取り専用プロパティは、{{domxref("WindowProxy")}} のように、ウィンドウ自身を返します。window オブジェクトでドット表記法 (つまり、window.self) を使用して使うことも、単独 (self) で使うこともできます。単独表記法を使用する利点は、{{domxref("Worker", "Web Workers")}} のような非 window コンテクストにも同様の表記法が存在することです。self を使用することで、window コンテキスト (self は window.self として解決されます) だけでなく、worker コンテキスト (self は {{domxref("WorkerGlobalScope.self")}} として解決されます) でも機能するようにグローバルスコープを参照できます。

+ +

構文

+ +
var w = window.self;  // w === window
+
+ +

例

+ +

次のような window.self の使い方は、window に置き換えることもできます。

+ +
if (window.parent.frames[0] != window.self) {
+  // このウィンドウは、一覧における一番最初のフレームではありません。
+}
+ +

さらに、ブラウジングコンテクストのアクティブなドキュメントで実行するとき、window は現在のグローバルオブジェクトを参照するため、以下のものはすべて等価です:

+ +
var w1 = window;
+var w2 = self;
+var w3 = window.window;
+var w4 = window.self;
+// w1, w2, w3, w4 は厳密に等価、しかし w2 だけは worker で動作します。
+
+ +

仕様

+ + + + + + + + + + + + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('HTML WHATWG', '#dom-self', 'Window.self')}}{{Spec2('HTML WHATWG')}}最新のスナップショット {{SpecName("HTML5.1")}} からの変更なし
{{SpecName('HTML5.1', 'browsers.html#dom-self', 'Window.self')}}{{Spec2('HTML5.1')}}{{SpecName("HTML5 W3C")}} からの変更なし
{{SpecName('HTML5 W3C', 'browsers.html#dom-self', 'Window.self')}}{{Spec2('HTML5 W3C')}}Window.self の定義を含む最初のスナップショット
+ +

ブラウザー互換性

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本サポート{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
機能AndroidChrome for AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本サポート{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
+
+ +

関連

+ + diff --git a/files/ja/web/api/window/sessionstorage/index.html b/files/ja/web/api/window/sessionstorage/index.html new file mode 100644 index 0000000000..426a8e6f18 --- /dev/null +++ b/files/ja/web/api/window/sessionstorage/index.html @@ -0,0 +1,154 @@ +--- +title: Window.sessionStorage +slug: Web/API/Window/sessionStorage +tags: + - API + - Property + - Reference + - Storage + - WindowSessionStorage + - sessionStorage +translation_of: Web/API/Window/sessionStorage +--- +

{{APIRef}}

+ +

sessionStorage プロパティで、 session {{domxref("Storage")}} オブジェクトにアクセスできます。sessionStorage は {{domxref("Window.localStorage")}} に似ています。唯一の違いは、localStorage に保存されたデータに期限がないのに対して、sessionStorage に保存されたデータはページのセッションが終了するときに消去されます。ページのセッションはブラウザを開いている限り、ページの再読み込みや復元を越えて持続します。新しいタブやウィンドウにページを開くと、新しいセッションが開始します。これは、セッション Cookie の動作とは異なります。

+ +

注意すべき点として、sessionStorage や localStorage はページのプロトコルに限定されます。

+ +

構文

+ +
// sessionStorage にデータを保存する
+sessionStorage.setItem('key', 'value');
+
+// sessionStorage に保存したデータを取得する
+var data = sessionStorage.getItem('key');
+
+// sessionStorage に保存したデータを削除する
+sessionStorage.removeItem('key')
+
+ +

値

+ +

{{domxref("Storage")}} オブジェクト。

+ +

例

+ +

以下のスニペットは、現在のドメインのセッション {{domxref("Storage")}} オブジェクトにアクセスして、{{domxref("Storage.setItem()")}} を使用してデータアイテムを追加します。

+ +
sessionStorage.setItem('myCat', 'Tom');
+ +

以下の例はテキストフィールドの内容を自動的に保存して、ブラウザが意図せず再開されたときに、記入した内容を失わないようにテキストフィールドの内容を復元します。

+ +
// 追跡するテキストフィールドを取得する
+var field = document.getElementById("field");
+
+// 自動保存された値があるかを確認する
+// (これはページが意図せず再開された場合にのみ存在する)
+if (sessionStorage.getItem("autosave")) {
+  // テキストフィールドの内容を復元する
+  field.value = sessionStorage.getItem("autosave");
+}
+
+// テキストフィールドの変更をリッスンする
+field.addEventListener("change", function() {
+  // セッションストレージオブジェクトに結果を保存する
+  sessionStorage.setItem("autosave", field.value);
+});
+ +
+

注記: 詳細な使用例は Web Storage API を使用する の記事を参照してください。

+
+ +

仕様

+ + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName('Web Storage', '#the-sessionstorage-attribute', 'sessionStorage')}}{{Spec2('Web Storage')}} 
+ +

ブラウザ実装状況

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
localStorage4{{CompatVersionUnknown}}3.5810.504
sessionStorage5{{CompatVersionUnknown}}2810.504
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
機能AndroidEdgeFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
基本サポート2.1{{CompatVersionUnknown}}{{CompatUnknown}}811iOS 3.2
+
+ +

すべてのブラウザで、localStorage および sessionStorage が受け入れる容量は異なります。さまざまなブラウザのストレージ容量を報告しているページがあります。

+ +
+

注記: iOS 5.1 より Safari Mobile は localStorage データを cache フォルダに保存しており、概して空き容量が少ない場合に OS の要求により、時々クリーンアップを受けます。

+
+ +

関連情報

+ + diff --git a/files/ja/web/api/window/setcursor/index.html b/files/ja/web/api/window/setcursor/index.html new file mode 100644 index 0000000000..ccc60e2ec5 --- /dev/null +++ b/files/ja/web/api/window/setcursor/index.html @@ -0,0 +1,23 @@ +--- +title: window.setCursor +slug: Web/API/Window/setCursor +tags: + - DOM + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/Window/setCursor +--- +
+ {{ApiRef}}
+

概要

+

対象ウィンドウのカーソルを変更します。

+

例

+
function setBusyCursor(enable) {
+  window.setCursor(enable ? "wait" : "auto");
+}
+

注記

+

カーソルは auto に設定されるまでリセットされません。

+

これは ChromeWindow interface の一部です。 Web ページに於いては使用できません。 Web ページのカーソルを変更するには CSS の {{cssxref("cursor")}} プロパティを用います。

+

仕様

+

{{dom0}}

diff --git a/files/ja/web/api/window/showmodaldialog/index.html b/files/ja/web/api/window/showmodaldialog/index.html new file mode 100644 index 0000000000..fc00fabadd --- /dev/null +++ b/files/ja/web/api/window/showmodaldialog/index.html @@ -0,0 +1,99 @@ +--- +title: window.showModalDialog +slug: Web/API/Window/showModalDialog +tags: + - API + - DOM + - Deprecated + - Window +translation_of: Web/API/Window/showModalDialog +--- +
{{Fx_minversion_header(3)}} {{obsolete_header}}{{APIRef}}
+ +
+

この機能は削除されました。ウェブサイトやアプリケーションを修正してください。

+ +

このメソッドは Chrome 43 および Firefox 56 で廃止されました。

+
+ +

概要

+ +

指定された HTML 文書を含む モーダルダイアログボックスを生成し、表示します。

+ +

構文

+ +
returnVal = window.showModalDialog(uri[,arguments][,options]);
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
構文説明
center: {on | off | yes | no | 1 | 0 }この引数の値が on、yes、または、1 である場合、ダイアログウィンドウはデスクトップの中央に配置されます。それ以外の場合は、ダイアログボックスが隠れます。デフォルトの値は、yes です。
dialogheight:height ダイアログボックスの高さを指定します。デフォルトでは、ピクセル値でサイズが指定されます。
dialogleft:left ダイアログボックスの水平位置をデスクトップの左上を基準とした値で指定します。
dialogwidth:width ダイアログボックスの幅を指定します。デフォルトでは、ピクセル値でサイズが指定されます。
dialogtop:top ダイアログボックスの垂直位置をデスクトップの左上角を基準とした値で指定します。
resizable: {on | off | yes | no | 1 | 0 }この引数の値が on、yes、または、1 である場合、ダイアログウィンドウは、ユーザによってリサイズ可能になります。それ以外の場合は、ウィンドウのサイズが自動で調整されます。デフォルトの値は、no です。
scroll: {on | off | yes | no | 1 | 0 }この引数の値が on、yes、または、1 である場合、ダイアログボックスにスクロールバーが表示されます。それ以外の場合は、ボックスのサイズが自動で調整されます。デフォルトの値は、no です。
+ +

{{Note("Firefox は、dialogHide、edge、status、および、unadorned 引数を実装していません。")}}

+ +

互換性

+ +

Microsoft Internet Explorer 4 で実装され、Firefox では、Firefox 3 で (Fx 28 で非推奨)、Safari は Safari 5.1 でサポートが追加されました。

+ +

このメソッドは Chrome 43 および Firefox 56 で完全に廃止されました。Safari から削除される可能性については、WebKit bug 151885 をご覧ください。

+ +

例

+ +

showModalDialog()

+ +

注記

+ +

showModalDialog() is currently being standardized as part of HTML5. The third argument (for additional options) is not present in the HTML5 version, and is (safely) ignored by both Safari and Chrome.

+ +

仕様

+ + + +

関連情報

+ + diff --git a/files/ja/web/api/window/sidebar/index.html b/files/ja/web/api/window/sidebar/index.html new file mode 100644 index 0000000000..3196222432 --- /dev/null +++ b/files/ja/web/api/window/sidebar/index.html @@ -0,0 +1,46 @@ +--- +title: window.sidebar +slug: Web/API/Window/sidebar +tags: + - DOM + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/Window/sidebar +--- +
+ {{ApiRef}} {{Non-standard_header}} {{deprecated_header}}
+

概要

+

ブラウザにアドオンを追加するためのいくつかのメソッドを含む、sidebar オブジェクトを返します。

+

例

+
window.sidebar.addPanel("Google", "http://www.google.com/", "");
+
+

注記：三番目の空の引数は必須です！

+

注記

+

戻り値となる sidebar オブジェクトは、以下のメソッドを持ちます。

+ + + + + + + + + + + + + + + + + + + + + + + +
メソッド説明
addPanel(title, contentURL, customizeURL) {{Obsolete_inline(23)}}サイドバーパネルを追加します。 Firefox 2 以降でのサイドバーの詳細については、『Firefox のサイドバーの作成』を参照してください。
addPersistentPanel(title, contentURL, customizeURL) {{Obsolete_inline(23)}}バックグラウンドでの動作が可能なサイドバーパネルを追加します。これは SeaMonkey 及び Firefox 1.x でのみ動作します (Firefox 2 以降では addPanel() のみで可)
addSearchEngine(engineURL, iconURL, suggestedTitle, suggestedCategory)Sherlock 検索エンジンをインストールします。詳細は、『ウェブページからの検索エンジンの追加』をご覧下さい。
addMicrosummaryGenerator(generatorURL) {{gecko_minversion_inline("1.8.1")}} {{Obsolete_inline(6)}}microsummary generator をインストールします。 Firefox 2 からの新機能です。
+

仕様

+

Mozilla 固有のプロパティです。どの標準にも属しません。

diff --git a/files/ja/web/api/window/sizetocontent/index.html b/files/ja/web/api/window/sizetocontent/index.html new file mode 100644 index 0000000000..6d8afcc2d1 --- /dev/null +++ b/files/ja/web/api/window/sizetocontent/index.html @@ -0,0 +1,24 @@ +--- +title: window.sizeToContent +slug: Web/API/Window/sizeToContent +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/Window/sizeToContent +--- +
+ {{ApiRef}}
+

概要

+

コンテンツの大きさにウィンドウのサイズを変更します。

+

DOM コンテンツはこの関数が呼び出されたときに読み込まれるべきです。例えば、DOMContentLoaded イベント後などです。

+

構文

+
window.sizeToContent()
+
+

例

+
window.sizeToContent();
+
+

仕様

+

{{DOM0}}

diff --git a/files/ja/web/api/window/speechsynthesis/index.html b/files/ja/web/api/window/speechsynthesis/index.html new file mode 100644 index 0000000000..b15635f374 --- /dev/null +++ b/files/ja/web/api/window/speechsynthesis/index.html @@ -0,0 +1,102 @@ +--- +title: Window.speechSynthesis +slug: Web/API/Window/speechSynthesis +tags: + - API + - Experimental + - Property + - Reference + - SpeechSynthesis + - Window +translation_of: Web/API/Window/speechSynthesis +--- +

{{APIRef()}}{{SeeCompatTable}}

+ +

Window オブジェクトの speechSynthesis 読み取り専用プロパティは、{{domxref("SpeechSynthesis")}} オブジェクトを返します。これは、Web Speech API の音声合成機能を使用するためのエントリーポイントです。

+ +

構文

+ +
var synth = window.speechSynthesis;
+
+ +

値

+ +

{{domxref("SpeechSynthesis")}} オブジェクト。

+ +

例

+ +

私たちの基本的な 音声合成のデモ では、最初に window.speechSynthesis を使用して SpeechSynthesis コントローラーへの参照を取得します。いくつかの必要な変数を定義した後、{{domxref("SpeechSynthesis.getVoices()")}} を使用して利用可能な音声のリストを取得し、それらの選択メニューを構成します。ユーザーは、そこから使用したい音声を選べます。

+ +

inputForm.onsubmit ハンドラー内部では、preventDefault() でフォーム送信を停止し、テキスト {{htmlelement("input")}} に入力されたテキストを含む新しい {{domxref("SpeechSynthesisUtterance")}} インスタンスを作成します。その発声 (utterance) にユーザーが {{htmlelement("select")}} 要素で選択した音声を設定し、{{domxref("SpeechSynthesis.speak()")}} メソッドを通して発声の発話を開始します。

+ +
var synth = window.speechSynthesis;
+
+var inputForm = document.querySelector('form');
+var inputTxt = document.querySelector('input');
+var voiceSelect = document.querySelector('select');
+
+
+function populateVoiceList() {
+  voices = synth.getVoices();
+
+  for(i = 0; i < voices.length ; i++) {
+    var option = document.createElement('option');
+    option.textContent = voices[i].name + ' (' + voices[i].lang + ')';
+
+    if(voices[i].default) {
+      option.textContent += ' -- DEFAULT';
+    }
+
+    option.setAttribute('data-lang', voices[i].lang);
+    option.setAttribute('data-name', voices[i].name);
+    voiceSelect.appendChild(option);
+  }
+}
+
+populateVoiceList();
+if (speechSynthesis.onvoiceschanged !== undefined) {
+  speechSynthesis.onvoiceschanged = populateVoiceList;
+}
+
+inputForm.onsubmit = function(event) {
+  event.preventDefault();
+
+  var utterThis = new SpeechSynthesisUtterance(inputTxt.value);
+  var selectedOption = voiceSelect.selectedOptions[0].getAttribute('data-name');
+  for(i = 0; i < voices.length ; i++) {
+    if(voices[i].name === selectedOption) {
+      utterThis.voice = voices[i];
+    }
+  }
+  synth.speak(utterThis);
+  inputTxt.blur();
+}
+ +

仕様

+ + + + + + + + + + + + + + +
仕様書策定状況備考
{{SpecName('Web Speech API', '#tts-section', 'SpeechSynthesis')}}{{Spec2('Web Speech API')}}
+ +

ブラウザーの実装状況

+ + + +

{{Compat("api.Window.speechSynthesis")}}

+ +

関連項目

+ + diff --git a/files/ja/web/api/window/status/index.html b/files/ja/web/api/window/status/index.html new file mode 100644 index 0000000000..284e9f0f2c --- /dev/null +++ b/files/ja/web/api/window/status/index.html @@ -0,0 +1,23 @@ +--- +title: window.status +slug: Web/API/Window/status +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference +translation_of: Web/API/Window/status +--- +
+ {{ApiRef}}
+

概要

+

ブラウザの下部にあるステータスバー内にテキストを設定するか、もしくは、直前に設定されていたテキストを返します。

+

このプロパティは、Firefox、及び、いくつかの他のブラウザのデフォルト設定では動作しません。つまり、window.status を設定しても、ステータスバーに表示されているテキストには何の効果もないということです。ステータスバーのテキストを変更するスクリプトを許可するには、ユーザは、about:config 画面で、dom.disable_window_status_change の設定を false にしなければなりません。

+
+

{{gecko_callout_heading("1.9.1")}}

+

Starting in Gecko 1.9.1 {{geckoRelease("1.9.1")}}, users can let websites change the status text by enabling the "Change status bar" preference in the Advanced options panel.

+
+

構文

+
string =window.status; //取得window.status = string; //設定
+

仕様

+

{{DOM0}}

diff --git a/files/ja/web/api/window/statusbar/index.html b/files/ja/web/api/window/statusbar/index.html new file mode 100644 index 0000000000..4ffa41cd90 --- /dev/null +++ b/files/ja/web/api/window/statusbar/index.html @@ -0,0 +1,80 @@ +--- +title: window.statusbar +slug: Web/API/Window/statusbar +tags: + - Gecko + - HTML DOM + - Window + - 要更新 +translation_of: Web/API/Window/statusbar +--- +

{{ ApiRef() }} {{ 英語版章題("Summary") }}

+ +

概要

+ +

statusbar オブジェクトを返します。このバーの表示は、ウィンドウ内でトグル（表示/非表示の状態を切り替える）ことができます。

+ +

{{ 英語版章題("Syntax") }}

+ +

構文

+ +
objRef = window.statusbar
+
+ +

{{ 英語版章題("Example") }}

+ +

例

+ +

次の完全な HTML の例は、様々な "bar" オブジェクトの visible プロパティで利用可能な方法を示しています。存在するウィンドウのあらゆるバーの visible プロパティ を書き換えるには、特権が必要です。

+ +
<html>
+<head>
+  <title>様々な DOM テスト</title>
+  <script>
+     // 存在するウィンドウのバーの状態を変更します
+    netscape.security.PrivilegeManager.
+        enablePrivilege("UniversalBrowserWrite");
+    window.statusbar.visible=!window.statusbar.visible;
+  </script>
+</head>
+<body>
+  <p>様々な DOM テスト</p>
+</body>
+</html>
+
+ +

{{ 英語版章題("Notes") }}

+ +

注記

+ +

あなたが上記の例のページを読み込んだとき、ブラウザは、以下のダイアログを表示するでしょう。: Image:Modify_any_open_window_dialog.png

+ +

バーの表示状態をトグルするには、上記の例のように、スクリプトの実行と特権要求を許可しなければなりません。また、様々なツールバーの表示の動的な変更は、ウィンドウのサイズをかなり劇的に変化させることがあり、ページのレイアウトに影響する可能性があることに注意してください。

+ +

{{ 英語版章題("Specification") }}

+ +

仕様

+ + + + + + + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('HTML WHATWG', 'browsers.html#dom-window-statusbar', 'Window.statusbar')}}{{Spec2('HTML WHATWG')}} 
{{SpecName('HTML5 W3C', 'browsers.html#dom-window-statusbar', 'Window.statusbar')}}{{Spec2('HTML5 W3C')}} 
+ +

関連項目

+ +

window.locationbar, window.menubar, window.personalbar, window.scrollbars, window.toolbar

diff --git a/files/ja/web/api/window/storage_event/index.html b/files/ja/web/api/window/storage_event/index.html new file mode 100644 index 0000000000..a9d1e54cbb --- /dev/null +++ b/files/ja/web/api/window/storage_event/index.html @@ -0,0 +1,82 @@ +--- +title: storage +slug: Web/API/Window/storage_event +translation_of: Web/API/Window/storage_event +--- +

storage イベントは、ストレージエリア (localStorage または sessionStorage) が変更されたときに発生します。詳しくは Web Storage API をご覧ください。

+ +

一般情報

+ +
+
仕様
+
Web Storage
+
インターフェイス
+
{{domxref("StorageEvent")}}
+
バブリング
+
不可
+
キャンセル可能か
+
不可
+
ターゲット
+
DefaultView (<window>)
+
既定のアクション
+
なし
+
+ +

プロパティ

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
PropertyTypeDescription
target {{readonlyInline}}{{domxref("EventTarget")}}The event target (the topmost target in the DOM tree).
type {{readonlyInline}}{{domxref("DOMString")}}The type of event.
bubbles {{readonlyInline}}{{jsxref("Boolean")}}Whether the event normally bubbles or not.
cancelable {{readonlyInline}}{{jsxref("Boolean")}}Whether the event is cancellable or not.
key {{readonlyInline}}{{domxref("DOMString")}} (string)The key being changed.
oldValue {{readonlyInline}}{{domxref("DOMString")}} (string)The old value of the key being changed.
newValue {{readonlyInline}}{{domxref("DOMString")}} (string)The new value of the key being changed.
url {{readonlyInline}}{{domxref("DOMString")}} (string)The address of the document whose key changed.
storageArea {{readonlyInline}}{{domxref("Storage")}}The Storage object that was affected.
diff --git a/files/ja/web/api/window/toolbar/index.html b/files/ja/web/api/window/toolbar/index.html new file mode 100644 index 0000000000..dd40c4c522 --- /dev/null +++ b/files/ja/web/api/window/toolbar/index.html @@ -0,0 +1,74 @@ +--- +title: window.toolbar +slug: Web/API/Window/toolbar +tags: + - Gecko + - HTML DOM + - Window + - 要更新 +translation_of: Web/API/Window/toolbar +--- +

{{ ApiRef() }} {{ 英語版章題("Summary") }}

+ +

概要

+ +

toolbar オブジェクトを返します。このバーの表示は、ウィンドウ内でトグル（表示/非表示の状態を切り替える）ことができます。 {{ 英語版章題("Syntax") }}

+ +

構文

+ +
objRef = window.toolbar
+ +

{{ 英語版章題("Example") }}

+ +

例

+ +

以下の完全な HTML の例は、様々な "bar" オブジェクトの visible プロパティで利用可能な方法を示しています。存在するウィンドウのあらゆるバーの visible プロパティ を書き換えるには、特権が必要です。

+ +
 <html>
+  <head>
+   <title>様々な DOM テスト</title>
+   <script>
+    // 存在するウィンドウのバーの状態を変更します
+    netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserWrite");
+    window.toolbar.visible=!window.toolbar.visible;
+   </script>
+  </head>
+  <body>
+   <p>様々な DOM テスト</p>
+  </body>
+ </html>
+
+ +

{{ 英語版章題("Notes") }}

+ +

注記

+ +

あなたが上記の例のページを読み込んだとき、ブラウザは、以下のダイアログを表示するでしょう。: Image:Modify_any_open_window_dialog.png

+ +

バーの表示を表示をトグルには、上記の例のように、スクリプトの実行と特権要求を許可しなければなりません。また、様々なツールバーの表示の動的な変更は、ウィンドウのサイズをかなり劇的に変化させることがあり、ページのレイアウトに影響する可能性があることに注意してください。

+ +

参照: window.locationbar, window.menubar, window.personalbar, window.scrollbars, window.statusbar

+ +

{{ 英語版章題("Specification") }}

+ +

仕様

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('HTML WHATWG', 'browsers.html#dom-window-toolbar', 'Window.toolbar')}}{{Spec2('HTML WHATWG')}}
{{SpecName('HTML5 W3C', 'browsers.html#dom-window-toolbar', 'Window.toolbar')}}{{Spec2('HTML5 W3C')}}
diff --git a/files/ja/web/api/window/top/index.html b/files/ja/web/api/window/top/index.html new file mode 100644 index 0000000000..2972fa34ae --- /dev/null +++ b/files/ja/web/api/window/top/index.html @@ -0,0 +1,54 @@ +--- +title: window.top +slug: Web/API/Window/top +tags: + - API + - DOM + - HTML + - Window +translation_of: Web/API/Window/top +--- +
{{APIRef}}
+ +

ウィンドウ階層における最上位のウィンドウへの参照を返します。

+ +

構文

+ +
var topWindow = window.top;
+
+ +

注記

+ +

{{domxref("window.parent")}} プロパティは、現在のウィンドウの直近の親を返しますが、window.top は、ウィンドウオブジェクトの階層における最上位のウィンドウを返します。

+ +

このプロパティは、親、あるいは、階層になっているウィンドウのサブフレーム内にあるウィンドウを扱っていて、最上位のフレームセットを取得したいときに特に役立ちます。

+ +

仕様

+ + + + + + + + + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('HTML WHATWG', 'browsers.html#dom-top', 'window.top')}}{{Spec2('HTML WHATWG')}}
{{SpecName('HTML5 W3C', 'browsers.html#dom-top', 'window.top')}}{{Spec2('HTML5 W3C')}}初期の定義
+ +

ブラウザー互換性

+ + + +

{{Compat("api.Window.top")}}

diff --git a/files/ja/web/api/window/transitioncancel_event/index.html b/files/ja/web/api/window/transitioncancel_event/index.html new file mode 100644 index 0000000000..2dfdf09c0a --- /dev/null +++ b/files/ja/web/api/window/transitioncancel_event/index.html @@ -0,0 +1,94 @@ +--- +title: 'Window: transitioncancel イベント' +slug: Web/API/Window/transitioncancel_event +tags: + - API + - Event + - Reference + - Web + - Window + - events + - transitioncancel + - イベント +translation_of: Web/API/Window/transitioncancel_event +--- +
{{APIRef}}{{SeeCompatTable}}
+ +

transitioncancel イベントは、 CSS トランジションがキャンセルされたときに発生します。

+ +

詳しくは {{domxref("GlobalEventHandlers.ontransitioncancel")}} をご覧ください。

+ + + + + + + + + + + + + + + + + + + + +
バブリングあり
キャンセル不可
インターフェイス{{domxref("TransitionEvent")}}
イベントハンドラープロパティ{{domxref("GlobalEventHandlers.ontransitioncancel")}}
+ +

このイベントの本来の対象は、トランジションが適用された {{domxref("Element")}} です。このイベントを {{domxref("Document")}} インターフェイス上で待ち受けし、キャプチャやバブリングの局面で処理することができます。このイベントについて完全な詳細は、 HTMLElement: transitioncancel イベントを参照してください。

+ +

例

+ +

このコードは、リスナーに transitioncancel イベントを追加します。

+ +
document.addEventListener('transitioncancel', () => {
+  console.log('Transition canceled');
+});
+ +

同様に、 {{domxref("GlobalEventHandlers.ontransitioncancel", "ontransitioncancel")}} プロパティを addEventListener() の代わりに使用した例です。

+ +
document.ontransitioncancel = () => {
+  console.log('Transition canceled');
+};
+ +

このイベントのライブデモを参照してください。

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('CSS3 Transitions', '#transitioncancel', 'transitioncancel')}}{{Spec2('CSS3 Transitions')}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Document.transitioncancel_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/transitionend_event/index.html b/files/ja/web/api/window/transitionend_event/index.html new file mode 100644 index 0000000000..2323b99320 --- /dev/null +++ b/files/ja/web/api/window/transitionend_event/index.html @@ -0,0 +1,92 @@ +--- +title: 'Window: transitionend イベント' +slug: Web/API/Window/transitionend_event +tags: + - API + - Reference + - Web + - Window + - events + - transitionend +translation_of: Web/API/Window/transitionend_event +--- +
{{APIRef}}
+ +

transitionend イベントは、 CSS トランジションが完了したときに発生します。トランジションが完了前に削除された場合、例えば {{cssxref("transition-property")}} が削除されたり、 {{cssxref("display")}} が none に設定されたりした場合、イベントは生成されません。

+ + + + + + + + + + + + + + + + + + + + +
バブリングあり
キャンセル可
インターフェイス{{domxref("TransitionEvent")}}
イベントハンドラープロパティ{{domxref("GlobalEventHandlers/ontransitionend", "ontransitionend")}}
+ +

transitionend イベントは二つの方向で発生します。 - トランジション終了の状態まで遷移し終わったときと、既定またはトランジションがない状態まで完全に戻ったときです。トランジションに待ち時間や実行時間がない場合、両方が0秒またはどちらも宣言されていなかった場合、トランジションは発生せず、トランジションイベントは発生しません。 transitioncancel イベントが発生すると、 transitionend イベントは発生しません。

+ +

このイベントの本来の対象は、トランジションが適用された {{domxref("Element")}} です。このイベントを {{domxref("Document")}} インターフェイス上で待ち受けし、キャプチャやバブリングの局面で処理することができます。このイベントについて完全な詳細は、 HTMLElement: transitionend イベントを参照してください。

+ +

例

+ +

このコードはリスナーに transitionend イベントを追加します。

+ +
document.addEventListener('transitionend', () => {
+  console.log('Transition ended');
+});
+ +

同様に、 {{domxref("GlobalEventHandlers/ontransitioncancel", "ontransitionend")}} プロパティを addEventListener() の代わりに使用した例です。

+ +
document.ontransitionend = () => {
+  console.log('Transition ended');
+};
+ +

このイベントのライブデモを参照してください。

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("CSS3 Transitions", "#transitionend", "transitionend")}}{{Spec2('CSS3 Transitions')}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Document.transitionend_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/transitionrun_event/index.html b/files/ja/web/api/window/transitionrun_event/index.html new file mode 100644 index 0000000000..0ee17b852a --- /dev/null +++ b/files/ja/web/api/window/transitionrun_event/index.html @@ -0,0 +1,90 @@ +--- +title: 'Window: transitionrun イベント' +slug: Web/API/Window/transitionrun_event +tags: + - API + - Reference + - Web + - Window + - events + - transitionrun +translation_of: Web/API/Window/transitionrun_event +--- +
{{APIRef}} {{SeeCompatTable}}
+ +

transitionstart イベントは、 CSS トランジションが実際に始まったとき、すなわち {{cssxref("transition-delay")}} が終了した後に発生します。

+ + + + + + + + + + + + + + + + + + + + +
バブリングあり
キャンセル不可
インターフェイス{{domxref("TransitionEvent")}}
イベントハンドラープロパティ{{domxref("GlobalEventHandlers.ontransitionstart")}}
+ +

このイベントの本来の対象は、トランジションが適用された {{domxref("Element")}} です。このイベントを {{domxref("Window")}} インターフェイス上で待ち受けし、キャプチャやバブリングの局面で処理することができます。このイベントについて完全な詳細は、 HTMLElement: transitionstart イベントを参照してください。

+ +

例

+ +

次のコードは transitionstart イベントにリスナーを追加します。

+ +
window.addEventListener('transitionstart', () => {
+  console.log('Started transitioning');
+});
+ +

同じですが、 {{domxref("GlobalEventHandlers/ontransitionstart", "ontransitionstart")}} を addEventListener() の代わりに使用すると次のようになります。

+ +
window.ontransitionrun = () => {
+  console.log('Started transitioning');
+};
+ +

このイベントのライブデモを参照してください。

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('CSS3 Transitions', '#transitionstart', 'transitionstart')}}{{Spec2('CSS3 Transitions')}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.transitionstart_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/transitionstart_event/index.html b/files/ja/web/api/window/transitionstart_event/index.html new file mode 100644 index 0000000000..a8cbdcc782 --- /dev/null +++ b/files/ja/web/api/window/transitionstart_event/index.html @@ -0,0 +1,91 @@ +--- +title: 'Window: transitionstart イベント' +slug: Web/API/Window/transitionstart_event +tags: + - API + - Reference + - Web + - Window + - events + - transitionstart + - イベント +translation_of: Web/API/Window/transitionstart_event +--- +
{{APIRef}} {{SeeCompatTable}}
+ +

transitionstart イベントは、 CSS トランジションが実際に始まったとき、すなわち {{cssxref("transition-delay")}} が終了した後に発生します。

+ + + + + + + + + + + + + + + + + + + + +
バブリングあり
キャンセル不可
インターフェイス{{domxref("TransitionEvent")}}
イベントハンドラープロパティ{{domxref("GlobalEventHandlers.ontransitionstart")}}
+ +

このイベントの本来の対象は、トランジションが適用された {{domxref("Element")}} です。このイベントを {{domxref("Window")}} インターフェイス上で待ち受けし、キャプチャやバブリングの局面で処理することができます。このイベントについて完全な詳細は、 HTMLElement: transitionstart イベントを参照してください。

+ +

例

+ +

次のコードは transitionstart イベントにリスナーを追加します。

+ +
window.addEventListener('transitionstart', () => {
+  console.log('Started transitioning');
+});
+ +

同じですが、 {{domxref("GlobalEventHandlers/ontransitionstart", "ontransitionstart")}} を addEventListener() の代わりに使用すると次のようになります。

+ +
window.ontransitionrun = () => {
+  console.log('Started transitioning');
+};
+ +

このイベントのライブデモを参照してください。

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('CSS3 Transitions', '#transitionstart', 'transitionstart')}}{{Spec2('CSS3 Transitions')}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.transitionstart_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/unescape/index.html b/files/ja/web/api/window/unescape/index.html new file mode 100644 index 0000000000..501592c3d2 --- /dev/null +++ b/files/ja/web/api/window/unescape/index.html @@ -0,0 +1,33 @@ +--- +title: window.unescape +slug: Web/API/Window/unescape +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/JavaScript/Reference/Global_Objects/unescape +--- +
+ {{ApiRef}}
+

概要

+

16 進でエンコードされた値（例えば、クッキー）をデコードします。

+

構文

+
regular = window.unescape(escaped)
+ +

例

+
alert( unescape("%5C") );  // 表示結果: "\"
+
+alert( unescape("https%3A//developer.mozilla.org") );  // 表示結果: "https://developer.mozilla.org"
+
+

仕様

+

{{DOM0}} 但し、ECMA-262 の非標準化セクションで言及されています。

+

関連情報

+ diff --git a/files/ja/web/api/window/unhandledrejection_event/index.html b/files/ja/web/api/window/unhandledrejection_event/index.html new file mode 100644 index 0000000000..87c06dccad --- /dev/null +++ b/files/ja/web/api/window/unhandledrejection_event/index.html @@ -0,0 +1,125 @@ +--- +title: 'Window: unhandledrejection イベント' +slug: Web/API/Window/unhandledrejection_event +tags: + - API + - Event + - HTML DOM + - JavaScript + - Promise + - Promises + - Reference + - Rejection + - Window + - Worker + - events + - global scope + - unhandledrejection + - イベント +translation_of: Web/API/Window/unhandledrejection_event +--- +
{{APIRef("HTML DOM")}}
+ +

unhandledrejection イベントは、 JavaScript の拒否ハンドラーを持たない {{jsxref("Promise")}} が拒否されたときにスクリプトのグローバルスコープに送られます。 通常、これは {{domxref("window")}} ですが、 {{domxref("Worker")}} であることもあります。 これはデバッグや、予期しない場面でのエラーハンドリングのエラーの代替手段を提供するために利用することができます。

+ + + + + + + + + + + + + + + + + + + + +
バブリングなし
キャンセル可
インターフェイス{{domxref("PromiseRejectionEvent")}}
イベントハンドラープロパティ{{domxref("WindowEventHandlers.onunhandledrejection", "onunhandledrejection")}}
+ +

使用上のメモ

+ +

unhandledrejection イベントにバブリングを許すと、結局はコンソールにエラーメッセージを出力することになります。 これは {{domxref("PromiseRejectionEvent")}} の {{domxref("Event.preventDefault", "preventDefault()")}} を呼び出すことで防ぐことができます。 例は以下の {{anch("Preventing default handling")}} を参照してください。

+ +

例

+ +

ここで unhandledrejection イベントの使い方が分かる例をいくつか見てみましょう。 イベントには2つの有用な情報があります。

+ +
+
promise
+
拒否を扱うために利用できるハンドラーがなく拒否された実際の {{jsxref("Promise")}} です。
+
reason
+
拒否ハンドラーに渡されるはずだった理由です。 詳しくは {{jsxref("Promise.catch", "catch()")}} を参照してください。
+
+ +

基本的なエラーのログ

+ +

この例では、処理されなかった Promise の拒否についての情報を単純にコンソールにログ出力します。

+ +
window.addEventListener("unhandledrejection", event => {
+  console.warn(`UNHANDLED PROMISE REJECTION: ${event.reason}`);
+});
+
+ +

イベントハンドラープロパティを使用して、イベントリスナーを設定することもできます。

+ +
window.onunhandledrejection = event => {
+  console.warn(`UNHANDLED PROMISE REJECTION: ${event.reason}`);
+};
+
+ +

既定のハンドリングの防止

+ +

({{Glossary("Node.js")}} など) 多くの環境では、既定では処理されなかった Promise の拒否はコンソールに報告されます。 unhandledrejection イベントのハンドラー — と、さらに実行したいその他のタスク — を追加して、 {{domxref("Event.preventDefault()", "preventDefault()")}} を呼び出すことでイベントをキャンセルし、実行時のログ出力コードが扱われるまでバブリングすることを防ぐことができます。 これは unhandledrejection がキャンセル可能であるためです。

+ +
window.addEventListener('unhandledrejection', function (event) {
+  // ...your code here to handle the unhandled rejection...
+
+  // Prevent the default handling (such as outputting the
+  // error to the console
+
+  event.preventDefault();
+});
+
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('HTML WHATWG', 'webappapis.html#unhandled-promise-rejections', 'unhandledrejection')}}{{Spec2('HTML WHATWG')}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.unhandledrejection_event")}}

+ +

関連情報

+ + + +

[1] 対応するイベントハンドラープロパティは、{{domxref("WindowEventHandlers")}} ミックスインで定義されています。 これは、{{domxref("Window")}} インターフェイスとすべての種類の {{domxref("Worker")}} インターフェイスの両方で使用できます。

diff --git a/files/ja/web/api/window/unload_event/index.html b/files/ja/web/api/window/unload_event/index.html new file mode 100644 index 0000000000..019894e002 --- /dev/null +++ b/files/ja/web/api/window/unload_event/index.html @@ -0,0 +1,121 @@ +--- +title: unload +slug: Web/API/Window/unload_event +translation_of: Web/API/Window/unload_event +--- +
{{APIRef}}
+ +

unload イベントは、文書または子リソースがアンロードされるときに発生します。

+ + + + + + + + + + + + + + + + + + + + +
バブリングなし
キャンセル不可
インターフェイス{{domxref("Event")}}
イベントハンドラープロパティ{{domxref("WindowEventHandlers/onunload", "onunload")}}
+ +

以下のイベントの後に発生します。

+ + + +

文書は以下のような状態にあります。

+ + + +

unload イベントは文書ツリーにも続くことに注意してください。親フレームのアンロードは、子フレームの unload の前に行われます (以下の例を参照)。

+ +

例

+ +
<!DOCTYPE html>
+<html>
+  <head>
+    <title>Parent Frame</title>
+    <script>
+      window.addEventListener('beforeunload', function(event) {
+        console.log('I am the 1st one.');
+      });
+      window.addEventListener('unload', function(event) {
+        console.log('I am the 3rd one.');
+      });
+    </script>
+  </head>
+  <body>
+    <iframe src="child-frame.html"></iframe>
+  </body>
+</html>
+ +

child-frame.html の内容を以下に示します。

+ +
<!DOCTYPE html>
+<html>
+  <head>
+    <title>Child Frame</title>
+    <script>
+      window.addEventListener('beforeunload', function(event) {
+        console.log('I am the 2nd one.');
+      });
+      window.addEventListener('unload', function(event) {
+        console.log('I am the 4th and last one…');
+      });
+    </script>
+  </head>
+  <body>
+      ☻
+  </body>
+</html>
+ +

親フレームがアンロードされると、 console.log() のメッセージに記述された順序でイベントが発生します。

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('UI Events', '#event-type-unload', 'unload')}}{{Spec2('UI Events')}} 
+ +

ブラウザーの対応

+ + + +

{{Compat("api.Window.unload_event")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/window/updatecommands/index.html b/files/ja/web/api/window/updatecommands/index.html new file mode 100644 index 0000000000..16439aee12 --- /dev/null +++ b/files/ja/web/api/window/updatecommands/index.html @@ -0,0 +1,26 @@ +--- +title: window.updateCommands +slug: Web/API/Window/updateCommands +tags: + - DOM + - DOM_0 + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/Window/updateCommands +--- +
+ {{ApiRef}}
+

概要

+

現在の chrome ウィンドウ（UI）のコマンドの状態を更新します。

+

構文

+
window.updateCommands("sCommandName")
+
+

引数

+ +

注記

+

これは（特定のコマンドノードの "無効な" 属性を設定したり解除する）アイテムを有効、または、無効に、あるいは、XUL コマンドノードの "state" 属性における現在の状態の情報を設定することにより選択される状態がコマンドの状態に反映されることを確実にします。

+

仕様

+

{{DOM0}}

diff --git a/files/ja/web/api/window/url/index.html b/files/ja/web/api/window/url/index.html new file mode 100644 index 0000000000..9d2c28cdf5 --- /dev/null +++ b/files/ja/web/api/window/url/index.html @@ -0,0 +1,100 @@ +--- +title: window.URL +slug: Web/API/Window/URL +tags: + - API + - DOM + - Property + - Reference + - Window +translation_of: Web/API/URL +--- +

{{ApiRef("Window")}}{{SeeCompatTable}}

+ +

Window.URL プロパティは、オブジェクト URL の作成や操作に用いる静的なメソッドを提供します。

+ +

{{AvailableInWorkers}}

+ +

構文

+ +

静的なメソッドの呼び出し:

+ +
img.src = URL.{{domxref("URL.createObjectURL", "createObjectURL")}}(blob);
+ +

新しいオブジェクトの構築:

+ +
var url = new {{domxref("URL.URL", "URL")}}("../cats/", "https://www.example.com/dogs/");
+ +

仕様

+ + + + + + + + + + + + + + +
仕様ステータスコメント
{{SpecName('URL', '#dom-url', 'URL')}}{{Spec2('URL')}}初期定義。
+ +

ブラウザー実装状況

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本サポート8.0[2]{{CompatGeckoDesktop("2.0")}}[1]
+ {{CompatGeckoDesktop("19.0")}}		10.015.0[2]6.0[2]
+ 7.0
+
+ +
+ + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本サポート{{CompatVersionUnknown}}[2]{{CompatGeckoMobile("14.0")}}[1]
+ {{CompatGeckoMobile("19.0")}}		{{CompatVersionUnknown}}15.0[2]6.0[2]
+
+ +

[1] Gecko 2 (Firefox 4) から Gecko 18 まで、Gecko は非標準の nsIDOMMozURLProperty 内部型を返していました。 実際には、何の違いもありません。

+ +

[2] 非標準の webkitURL という名前で実装されています。

diff --git a/files/ja/web/api/window/visualviewport/index.html b/files/ja/web/api/window/visualviewport/index.html new file mode 100644 index 0000000000..63ba34eab4 --- /dev/null +++ b/files/ja/web/api/window/visualviewport/index.html @@ -0,0 +1,39 @@ +--- +title: Window.visualViewport +slug: Web/API/Window/visualViewport +translation_of: Web/API/Window/visualViewport +--- +

{{SeeCompatTable}}{{APIRef("Visual Viewport")}}

+ +

{{domxref("Window")}}インターフェイスのvisualViewport は読み取り専用プロパティーです。 特定のウィンドウの視覚的ビューポートを表す{{domxref("VisualViewport")}}オブジェクトを返します。

+ +

構文

+ +
var visualViewport = Window.visualViewport
+ +

値

+ +

{{domxref("VisualViewport")}} はオブジェクトです。

+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Visual Viewport','#dom-window-visualviewport','visualViewport')}}{{Spec2('Visual Viewport')}}Initial definition.
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Window.visualViewport")}}

diff --git a/files/ja/web/api/window/vrdisplayconnect_event/index.html b/files/ja/web/api/window/vrdisplayconnect_event/index.html new file mode 100644 index 0000000000..2330451d67 --- /dev/null +++ b/files/ja/web/api/window/vrdisplayconnect_event/index.html @@ -0,0 +1,69 @@ +--- +title: vrdisplayconnected +slug: Web/API/Window/vrdisplayconnect_event +translation_of: Web/API/Window/vrdisplayconnect_event +--- +
{{APIRef}}{{SeeCompatTable}}
+ +
+

WebVR API の vrdisplayconnected イベントは，コンピュータに互換性のあるVRデバイスが接続された時に発火します．

+
+ + + + + + + + + + + + + + + + + + + + +
BubblesNo
CancelableNo
Target objects{{domxref("Window")}}
Interface{{domxref("Event")}}
+ +

例

+ +
TBD.
+ +

継承

+ +

vrdisplayconnected イベントは， {{domxref("Event")}} インターフェイスを実装しています — このインターフェイスで定義されているプロパティとメソッドを利用可能です．

+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('WebVR', '#dom-window-onvrdisplayconnected', 'vrdisplayconnected')}}{{Spec2('WebVR')}}Initial definition
+ +

ブラウザの互換性

+ + + +

{{Compat("api.Window.vrdisplayconnect_event")}}

+ +

参照

+ + diff --git a/files/ja/web/api/window/vrdisplaydisconnect_event/index.html b/files/ja/web/api/window/vrdisplaydisconnect_event/index.html new file mode 100644 index 0000000000..71281e5c3d --- /dev/null +++ b/files/ja/web/api/window/vrdisplaydisconnect_event/index.html @@ -0,0 +1,77 @@ +--- +title: vrdisplaydisconnected +slug: Web/API/Window/vrdisplaydisconnect_event +translation_of: Web/API/Window/vrdisplaydisconnect_event +--- +
{{APIRef}}{{SeeCompatTable}}
+ +
+

WebVR API の vrdisplaydisconnected イベントは，互換性のあるVRデバイスがコンピュータから接続解除された時に発火します．

+
+ + + + + + + + + + + + + + + + + + + + +
BubblesNo
CancelableNo
Target objects{{domxref("Window")}}
Interface{{domxref("Event")}}
+ +

例

+ +

You can use the vrdisplaydisconnect event in an addEventListener method:

+ +
window.addEventListener('vrdisplaydisconnect', function() {
+  info.textContent = 'Display disconnected.';
+  reportDisplays();
+});
+ +

Or use the onvrdisplaydisconnect event handler property:

+ +
window.onvrdisplaydisconnect = function() {
+  info.textContent = 'Display disconnected.';
+  reportDisplays();
+);
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('WebVR 1.1', '#dom-window-onvrdisplaydisconnected', 'vrdisplaydisconnected')}}{{Spec2('WebVR 1.1')}}Initial definition
+ +

ブラウザの互換性

+ + + +

{{Compat("api.Window.vrdisplaydisconnect_event")}}

+ +

参照

+ + diff --git a/files/ja/web/api/window/vrdisplayfocus_event/index.html b/files/ja/web/api/window/vrdisplayfocus_event/index.html new file mode 100644 index 0000000000..61ab54e59a --- /dev/null +++ b/files/ja/web/api/window/vrdisplayfocus_event/index.html @@ -0,0 +1,83 @@ +--- +title: 'Window: vrdisplayfocus event' +slug: Web/API/Window/vrdisplayfocus_event +tags: + - Reference + - WebVR + - events + - onvrdisplayfocus + - vrdisplayfocus +translation_of: Web/API/Window/vrdisplayfocus_event +--- +
{{APIRef("Window")}}
+ +
+

WebVR API の vrdisplayfocus イベントは VR ディスプレイへのプレゼンテーションがぼやけた後に再開されたときに発生します。

+
+ + + + + + + + + + + + + + + + + + + + +
BubblesNo
CancelableNo
Interface{{domxref("VRDisplayEvent")}}
Event handler propertyonvrdisplayfocus
+ +

例

+ +

addEventListener メソッドで vrdisplayfocus イベントを使用できます:

+ +
window.addEventListener('vrdisplayfocus', function() {
+  info.textContent = 'Display focused.';
+  reportDisplays();
+});
+ +

または、 onvrdisplayfocus イベントハンドラープロパティを使用します:

+ +
window.onvrdisplayfocus = function() {
+  info.textContent = 'Display focused.';
+  reportDisplays();
+};
+ +

仕様

+ + + + + + + + + + + + + + +
仕様ステータス備考
{{SpecName('WebVR 1.1', '#dom-window-onvrdisplayfocus', 'vrdisplayfocus')}}{{Spec2('WebVR 1.1')}}初回定義
+ +

ブラウザー実装状況

+ + + +

{{Compat("api.Window.vrdisplayfocus_event")}}

+ +

関連項目

+ + diff --git a/files/ja/web/api/window/vrdisplaypresentchange_event/index.html b/files/ja/web/api/window/vrdisplaypresentchange_event/index.html new file mode 100644 index 0000000000..4b70220959 --- /dev/null +++ b/files/ja/web/api/window/vrdisplaypresentchange_event/index.html @@ -0,0 +1,69 @@ +--- +title: vrdisplaypresentchange +slug: Web/API/Window/vrdisplaypresentchange_event +translation_of: Web/API/Window/vrdisplaypresentchange_event +--- +
{{APIRef}}{{SeeCompatTable}}
+ +
+

WebVR API の vrdisplaypresentchange イベントは，VRデバイスの表示状態が変化したときに発火します — つまり，表示状態から非表示になったとき，あるいはその逆のケースです．

+
+ + + + + + + + + + + + + + + + + + + + +
BubblesNo
CancelableNo
Target objects{{domxref("Window")}}
Interface{{domxref("Event")}}
+ +

例

+ +
TBD.
+ +

継承

+ +

vrdisplaypresentchange イベントは {{domxref("Event")}} インターフェイスを実装しています — このインターフェイスで定義されているプロパティとメソッドを利用可能です．

+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('WebVR', '#dom-window-onvrdisplaypresentchange', 'vrdisplaypresentchange')}}{{Spec2('WebVR')}}Initial definition
+ +

ブラウザの互換性

+ + + +

{{Compat("api.Window.vrdisplaypresentchange_event")}}

+ +

参照

+ + diff --git a/files/ja/web/api/window/window/index.html b/files/ja/web/api/window/window/index.html new file mode 100644 index 0000000000..9884945c39 --- /dev/null +++ b/files/ja/web/api/window/window/index.html @@ -0,0 +1,78 @@ +--- +title: window.window +slug: Web/API/Window/window +tags: + - API + - Gecko + - HTML DOM + - Property + - Reference + - Window + - 要更新 +translation_of: Web/API/Window/window +--- +
{{ApiRef}}
+ +

概要

+ +

window オブジェクトの window プロパティは、その window オブジェクト自身を指します。故に、以下の表現は同じ window オブジェクトを返します。

+ +
window.window
+window.window.window
+window.window.window.window
+  ...
+
+ +

Web ページに於いては、window オブジェクトはグローバルオブジェクト でもあります。これは次の事を意味します。

+ +
    +
  1. スクリプト中の変数 "global" は、実際には window オブジェクトのプロパティです。 + + 
    var global = {data: 0};
+
+alert(global === window.global); // "true" を表示します。
+
    +
    2. +
  2. ブラウジングコンテキストに於いて window は最上位オブジェクトである為、 window オブジェクトのメンバへのアクセス時には "window." 接頭辞を省略する事が可能となっています。 + 
    // 次の 2 行は同じ動作となります。
+window.setTimeout( "window.alert('Hi!')", 50 );
+       setTimeout(        "alert('Hi!')", 50 );
+
+
+// window プロパティが自身を参照しているか確認してみましょう。
+alert( window === window.window === window.window.window.window ); // true
+
    +
    3. +
+ +

そのオブジェクト自身を参照する window プロパティが持っている理由は、おそらくグローバルオブジェクトの参照を容易にする為でしょう。もしこのようになっていない場合、 var window = this; という代入をスクリプトの一番最初に自分で書かなければならないでしょう。

+ +

別の理由としては、このプロパティ無しには、例えば、 "{{domxref("window.open", "window.open('http://google.com/')")}}" と書くことができないということが挙げられます。そうでなければ、単に、"open('http://google.com/')" と書かなければならないでしょう。

+ +

Yet another reason to use this property is for libraries which wish to offer OOP-versions and non-OOP versions (especially JavaScript modules). If, for example, we refer to "this.window.location.href", a JavaScript module could define a property called "window" inside of a class it defined (since no global "window" variable exists for it by default) which, could be created, for example, after passing in a window object to the module class' constructor. Thus, "this.window" inside of its functions would refer to that window object. In the non-namespaced version, "this.window" would simply refer back to "window", and also be able to get the document location without trouble. Another advantage is that the objects of such a class (even if the class were defined outside of a module) could change their reference to the window at will, as they would not be able to do if they had hard-coded a reference to "window" (yet the default in the class could still be set as the current window object).

+ +

仕様

+ + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('HTML WHATWG', '#dom-window', 'Window.window')}}{{Spec2('HTML WHATWG')}}最新のスナップショット {{SpecName("HTML5.1")}} から変更なし
{{SpecName('HTML5.1', 'browsers.html#dom-window', 'Window.window')}}{{Spec2('HTML5.1')}}{{SpecName("HTML5 W3C")}} から変更なし
{{SpecName('HTML5 W3C', 'browsers.html#dom-window', 'Window.window')}}{{Spec2('HTML5 W3C')}}Window.window の定義を含む最初のスナップショット
-- cgit v1.2.3-54-g00ecf