From 82d5f08c1cca84743cb040f4481799df68eb111c Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Tue, 24 May 2022 01:54:12 +0900 Subject: [PATCH 01/17] =?UTF-8?q?{{languages}}=20=E3=83=9E=E3=82=AF?= =?UTF-8?q?=E3=83=AD=E3=82=92=E4=BD=BF=E7=94=A8=E3=81=97=E3=81=A6=E3=81=84?= =?UTF-8?q?=E3=81=9F=E6=96=87=E6=9B=B8=E3=82=92=E6=9B=B4=E6=96=B0=E9=96=8B?= =?UTF-8?q?=E5=A7=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/glossary/plugin/{index.html => index.md} | 0 files/ja/web/accessibility/faq/{index.html => index.md} | 0 files/ja/web/api/event/initevent/{index.html => index.md} | 0 .../multiple_items/{index.html => index.md} | 0 files/ja/web/api/range/collapsed/{index.html => index.md} | 0 .../xsltprocessor/browser_differences/{index.html => index.md} | 0 .../api/xsltprocessor/generating_html/{index.html => index.md} | 0 .../web/api/xsltprocessor/introduction/{index.html => index.md} | 0 files/ja/web/exslt/exsl/node-set/{index.html => index.md} | 0 files/ja/web/exslt/{index.html => index.md} | 0 .../writing_forward-compatible_websites/{index.html => index.md} | 0 files/ja/web/svg/scripting/{index.html => index.md} | 0 files/ja/web/svg/tutorial/basic_shapes/{index.html => index.md} | 0 files/ja/web/svg/tutorial/filter_effects/{index.html => index.md} | 0 files/ja/web/svg/tutorial/patterns/{index.html => index.md} | 0 15 files changed, 0 insertions(+), 0 deletions(-) rename files/ja/glossary/plugin/{index.html => index.md} (100%) rename files/ja/web/accessibility/faq/{index.html => index.md} (100%) rename files/ja/web/api/event/initevent/{index.html => index.md} (100%) rename files/ja/web/api/html_drag_and_drop_api/multiple_items/{index.html => index.md} (100%) rename files/ja/web/api/range/collapsed/{index.html => index.md} (100%) rename files/ja/web/api/xsltprocessor/browser_differences/{index.html => index.md} (100%) rename files/ja/web/api/xsltprocessor/generating_html/{index.html => index.md} (100%) rename files/ja/web/api/xsltprocessor/introduction/{index.html => index.md} (100%) rename files/ja/web/exslt/exsl/node-set/{index.html => index.md} (100%) rename files/ja/web/exslt/{index.html => index.md} (100%) rename files/ja/web/guide/writing_forward-compatible_websites/{index.html => index.md} (100%) rename files/ja/web/svg/scripting/{index.html => index.md} (100%) rename files/ja/web/svg/tutorial/basic_shapes/{index.html => index.md} (100%) rename files/ja/web/svg/tutorial/filter_effects/{index.html => index.md} (100%) rename files/ja/web/svg/tutorial/patterns/{index.html => index.md} (100%) diff --git a/files/ja/glossary/plugin/index.html b/files/ja/glossary/plugin/index.md similarity index 100% rename from files/ja/glossary/plugin/index.html rename to files/ja/glossary/plugin/index.md diff --git a/files/ja/web/accessibility/faq/index.html b/files/ja/web/accessibility/faq/index.md similarity index 100% rename from files/ja/web/accessibility/faq/index.html rename to files/ja/web/accessibility/faq/index.md diff --git a/files/ja/web/api/event/initevent/index.html b/files/ja/web/api/event/initevent/index.md similarity index 100% rename from files/ja/web/api/event/initevent/index.html rename to files/ja/web/api/event/initevent/index.md diff --git a/files/ja/web/api/html_drag_and_drop_api/multiple_items/index.html b/files/ja/web/api/html_drag_and_drop_api/multiple_items/index.md similarity index 100% rename from files/ja/web/api/html_drag_and_drop_api/multiple_items/index.html rename to files/ja/web/api/html_drag_and_drop_api/multiple_items/index.md diff --git a/files/ja/web/api/range/collapsed/index.html b/files/ja/web/api/range/collapsed/index.md similarity index 100% rename from files/ja/web/api/range/collapsed/index.html rename to files/ja/web/api/range/collapsed/index.md diff --git a/files/ja/web/api/xsltprocessor/browser_differences/index.html b/files/ja/web/api/xsltprocessor/browser_differences/index.md similarity index 100% rename from files/ja/web/api/xsltprocessor/browser_differences/index.html rename to files/ja/web/api/xsltprocessor/browser_differences/index.md diff --git a/files/ja/web/api/xsltprocessor/generating_html/index.html b/files/ja/web/api/xsltprocessor/generating_html/index.md similarity index 100% rename from files/ja/web/api/xsltprocessor/generating_html/index.html rename to files/ja/web/api/xsltprocessor/generating_html/index.md diff --git a/files/ja/web/api/xsltprocessor/introduction/index.html b/files/ja/web/api/xsltprocessor/introduction/index.md similarity index 100% rename from files/ja/web/api/xsltprocessor/introduction/index.html rename to files/ja/web/api/xsltprocessor/introduction/index.md diff --git a/files/ja/web/exslt/exsl/node-set/index.html b/files/ja/web/exslt/exsl/node-set/index.md similarity index 100% rename from files/ja/web/exslt/exsl/node-set/index.html rename to files/ja/web/exslt/exsl/node-set/index.md diff --git a/files/ja/web/exslt/index.html b/files/ja/web/exslt/index.md similarity index 100% rename from files/ja/web/exslt/index.html rename to files/ja/web/exslt/index.md diff --git a/files/ja/web/guide/writing_forward-compatible_websites/index.html b/files/ja/web/guide/writing_forward-compatible_websites/index.md similarity index 100% rename from files/ja/web/guide/writing_forward-compatible_websites/index.html rename to files/ja/web/guide/writing_forward-compatible_websites/index.md diff --git a/files/ja/web/svg/scripting/index.html b/files/ja/web/svg/scripting/index.md similarity index 100% rename from files/ja/web/svg/scripting/index.html rename to files/ja/web/svg/scripting/index.md diff --git a/files/ja/web/svg/tutorial/basic_shapes/index.html b/files/ja/web/svg/tutorial/basic_shapes/index.md similarity index 100% rename from files/ja/web/svg/tutorial/basic_shapes/index.html rename to files/ja/web/svg/tutorial/basic_shapes/index.md diff --git a/files/ja/web/svg/tutorial/filter_effects/index.html b/files/ja/web/svg/tutorial/filter_effects/index.md similarity index 100% rename from files/ja/web/svg/tutorial/filter_effects/index.html rename to files/ja/web/svg/tutorial/filter_effects/index.md diff --git a/files/ja/web/svg/tutorial/patterns/index.html b/files/ja/web/svg/tutorial/patterns/index.md similarity index 100% rename from files/ja/web/svg/tutorial/patterns/index.html rename to files/ja/web/svg/tutorial/patterns/index.md From dc560af8b166ea3b4bd76a17c6ed4ef339e92cbe Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Tue, 24 May 2022 01:54:57 +0900 Subject: [PATCH 02/17] =?UTF-8?q?{{languages}}=20=E3=83=9E=E3=82=AF?= =?UTF-8?q?=E3=83=AD=E3=82=92=E4=BD=BF=E7=94=A8=E3=81=97=E3=81=9F=E5=8F=A4?= =?UTF-8?q?=E3=81=84=E6=96=87=E6=9B=B8=EF=BC=88=E8=8B=B1=E8=AA=9E=E7=89=88?= =?UTF-8?q?=E3=81=AB=E6=97=A2=E3=81=AB=E3=81=AA=E3=81=84=E3=82=82=E3=81=AE?= =?UTF-8?q?=EF=BC=89=E3=82=92=E5=89=8A=E9=99=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/_redirects.txt | 16 --- files/ja/_wikihistory.json | 37 ------ .../index.html | 75 ----------- .../index.html | 124 ------------------ .../ja/orphaned/developing_add-ons/index.html | 9 -- .../ja/orphaned/developing_mozilla/index.html | 68 ---------- .../ja/orphaned/javascript_modules/index.html | 25 ---- .../javascript_presentations/index.html | 17 --- .../index.html | 116 ---------------- .../orphaned/mcd/getting_started/index.html | 55 -------- files/ja/orphaned/mcd/index.html | 57 -------- .../index.html | 63 --------- .../dom_inspector_faq/index.html | 45 ------- .../html5/introduction_to_html5/index.html | 25 ---- 14 files changed, 732 deletions(-) delete mode 100644 files/ja/orphaned/ant_script_to_assemble_an_extension/index.html delete mode 100644 files/ja/orphaned/building_a_mozilla_distribution/index.html delete mode 100644 files/ja/orphaned/developing_add-ons/index.html delete mode 100644 files/ja/orphaned/developing_mozilla/index.html delete mode 100644 files/ja/orphaned/javascript_modules/index.html delete mode 100644 files/ja/orphaned/javascript_presentations/index.html delete mode 100644 files/ja/orphaned/key-navigable_custom_dhtml_widgets/index.html delete mode 100644 files/ja/orphaned/mcd/getting_started/index.html delete mode 100644 files/ja/orphaned/mcd/index.html delete mode 100644 files/ja/orphaned/mozilla_modules_and_module_ownership/index.html delete mode 100644 files/ja/orphaned/tools/add-ons/dom_inspector/dom_inspector_faq/index.html delete mode 100644 files/ja/orphaned/web/guide/html/html5/introduction_to_html5/index.html diff --git a/files/ja/_redirects.txt b/files/ja/_redirects.txt index a823a89ba8be3c..112e19d24cb56e 100644 --- a/files/ja/_redirects.txt +++ b/files/ja/_redirects.txt @@ -136,7 +136,6 @@ /ja/docs/Applying_SVG_effects_to_HTML_content /ja/docs/Web/SVG/Applying_SVG_effects_to_HTML_content /ja/docs/Array.prototype.reduceRight /ja/docs/Web/JavaScript/Reference/Global_Objects/Array/reduceRight /ja/docs/Bugzilla_(external) https://bugzilla.mozilla.org/enter_bug.cgi?format=guided -/ja/docs/Building_a_Mozilla_Distribution /ja/docs/orphaned/Building_a_Mozilla_Distribution /ja/docs/Building_an_Extension /ja/docs/Mozilla/Add-ons /ja/docs/CORS_Enabled_Image /ja/docs/Web/HTML/CORS_enabled_image /ja/docs/CSS /ja/docs/Web/CSS @@ -1801,14 +1800,11 @@ /ja/docs/DOM_Inspector /ja/docs/orphaned/Tools/Add-ons/DOM_Inspector /ja/docs/DOM_Inspector/Internals /ja/docs/orphaned/Tools/Add-ons/DOM_Inspector/Internals /ja/docs/DOM_Inspector/Introduction_to_DOM_Inspector /ja/docs/orphaned/Tools/Add-ons/DOM_Inspector/Introduction_to_DOM_Inspector -/ja/docs/DOM_Inspector_FAQ /ja/docs/orphaned/Tools/Add-ons/DOM_Inspector/DOM_Inspector_FAQ /ja/docs/DOM_Levels /ja/docs/Web/API/Document_Object_Model /ja/docs/DOM_improvements_in_Firefox_3 /ja/docs/Mozilla/Firefox/Releases/3/DOM_improvements /ja/docs/Deer_Park /ja/docs/Mozilla/Firefox/Releases/1.5 /ja/docs/Detecting_device_orientation /ja/docs/Web/Events/Detecting_device_orientation /ja/docs/Determining_the_dimensions_of_elements /ja/docs/Web/API/CSS_Object_Model/Determining_the_dimensions_of_elements -/ja/docs/Developing_Mozilla /ja/docs/orphaned/Developing_Mozilla -/ja/docs/Developing_add-ons /ja/docs/orphaned/Developing_add-ons /ja/docs/DragDrop /ja/docs/Web/API/HTML_Drag_and_Drop_API /ja/docs/DragDrop/DataTransfer /ja/docs/Web/API/DataTransfer /ja/docs/DragDrop/DataTransfer/getData /ja/docs/Web/API/DataTransfer/getData @@ -2048,7 +2044,6 @@ /ja/docs/HTML/HTML5/HTML5_element_list /ja/docs/Web/HTML/Element /ja/docs/HTML/HTML5/HTML5_element_list-redirect-1 /ja/docs/Web/HTML/Element /ja/docs/HTML/HTML5/HTML5_のフォーム /ja/docs/Learn/Forms -/ja/docs/HTML/HTML5/Introduction_to_HTML5 /ja/docs/orphaned/Web/Guide/HTML/HTML5/Introduction_to_HTML5 /ja/docs/HTML/HTML_Elements /ja/docs/Web/HTML/Element /ja/docs/HTML/HTML_Elements/Audio /ja/docs/Web/HTML/Element/audio /ja/docs/HTML/HTML_Elements/Heading_Elements /ja/docs/Web/HTML/Element/Heading_Elements @@ -2091,7 +2086,6 @@ /ja/docs/HTML/HTML_Elements/var /ja/docs/Web/HTML/Element/var /ja/docs/HTML/Inline_elements /ja/docs/Web/HTML/Inline_elements /ja/docs/HTML/Introduction /ja/docs/Learn/HTML/Introduction_to_HTML -/ja/docs/HTML/Introduction_to_HTML5 /ja/docs/orphaned/Web/Guide/HTML/HTML5/Introduction_to_HTML5 /ja/docs/HTML/Sections_and_Outlines_of_an_HTML5_document /ja/docs/orphaned/Web/Guide/HTML/Using_HTML_sections_and_outlines /ja/docs/HTML/Supported_media_formats /ja/docs/Web/Media/Formats /ja/docs/HTML/Using_HTML5_audio_and_video /ja/docs/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content @@ -2627,14 +2621,11 @@ /ja/docs/JavaScript/Typed_arrays/Uint8Array /ja/docs/Web/JavaScript/Reference/Global_objects/Uint8Array /ja/docs/JavaScriptReference/Statements/let /ja/docs/Web/JavaScript/Reference/Statements/let /ja/docs/JavaScript_Language_Resources /ja/docs/Web/JavaScript/Language_Resources -/ja/docs/JavaScript_Presentations /ja/docs/orphaned/JavaScript_Presentations -/ja/docs/JavaScript_modules /ja/docs/orphaned/JavaScript_modules /ja/docs/JavaScript_shells /ja/docs/Web/JavaScript/Shells /ja/docs/JavaScript_technologies_overview /ja/docs/Web/JavaScript/JavaScript_technologies_overview /ja/docs/JavaScript_typed_arrays /ja/docs/Web/JavaScript/Typed_arrays /ja/docs/JavaScript_技術の概要 /ja/docs/Web/JavaScript/JavaScript_technologies_overview /ja/docs/JavaScript_技術概説 /ja/docs/Web/JavaScript/JavaScript_technologies_overview -/ja/docs/Key-navigable_custom_DHTML_widgets /ja/docs/orphaned/Key-navigable_custom_DHTML_widgets /ja/docs/Learn/CSS/Building_blocks/セレクタ /ja/docs/Learn/CSS/Building_blocks/Selectors /ja/docs/Learn/CSS/First_steps/Using_your_new_knowledge /ja/docs/Learn/CSS/First_steps/Styling_a_biography_page /ja/docs/Learn/CSS/Introduction_to_CSS /ja/docs/Learn/CSS/First_steps @@ -2712,9 +2703,6 @@ /ja/docs/Link_prefetching_FAQ /ja/docs/Web/HTTP/Link_prefetching_FAQ /ja/docs/Localization /ja/docs/Glossary/Localization /ja/docs/Localizing_extension_descriptions /ja/docs/orphaned/Localizing_extension_descriptions -/ja/docs/MCD /ja/docs/orphaned/MCD -/ja/docs/MCD/Getting_Started /ja/docs/orphaned/MCD/Getting_Started -/ja/docs/MCD:Getting_Started /ja/docs/orphaned/MCD/Getting_Started /ja/docs/MDN/About/Linking_to_MDN /ja/docs/orphaned/MDN/About/Linking_to_MDN /ja/docs/MDN/Community /ja/docs/orphaned/MDN/Community /ja/docs/MDN/Community/Conversations /ja/docs/orphaned/MDN/Community/Conversations @@ -4099,7 +4087,6 @@ /ja/docs/Web/Guide/HTML/HTML5/HTML5_Thematic_Classification /ja/docs/orphaned/Web/Guide/HTML/HTML5 /ja/docs/Web/Guide/HTML/HTML5/HTML5_element_list /ja/docs/Web/HTML/Element /ja/docs/Web/Guide/HTML/HTML5/HTML5_のフォーム /ja/docs/Learn/Forms -/ja/docs/Web/Guide/HTML/HTML5/Introduction_to_HTML5 /ja/docs/orphaned/Web/Guide/HTML/HTML5/Introduction_to_HTML5 /ja/docs/Web/Guide/HTML/Introduction /ja/docs/Learn/HTML/Introduction_to_HTML /ja/docs/Web/Guide/HTML/Obsolete_things_to_avoid /ja/docs/Learn/HTML/Introduction_to_HTML /ja/docs/Web/Guide/HTML/Using_HTML_sections_and_outlines /ja/docs/orphaned/Web/Guide/HTML/Using_HTML_sections_and_outlines @@ -4168,7 +4155,6 @@ /ja/docs/Web/HTML/HTML5/HTML5_Thematic_Classification /ja/docs/orphaned/Web/Guide/HTML/HTML5 /ja/docs/Web/HTML/HTML5/HTML5_element_list /ja/docs/Web/HTML/Element /ja/docs/Web/HTML/HTML5/HTML5_のフォーム /ja/docs/Learn/Forms -/ja/docs/Web/HTML/HTML5/Introduction_to_HTML5 /ja/docs/orphaned/Web/Guide/HTML/HTML5/Introduction_to_HTML5 /ja/docs/Web/HTML/HTML_Elements /ja/docs/Web/HTML/Element /ja/docs/Web/HTML/HTML_Elements/Audio /ja/docs/Web/HTML/Element/audio /ja/docs/Web/HTML/HTML_Elements/Heading_Elements /ja/docs/Web/HTML/Element/Heading_Elements @@ -4211,7 +4197,6 @@ /ja/docs/Web/HTML/HTML_Elements/var /ja/docs/Web/HTML/Element/var /ja/docs/Web/HTML/Index /ja/docs/conflicting/Web/HTML /ja/docs/Web/HTML/Introduction /ja/docs/Learn/HTML/Introduction_to_HTML -/ja/docs/Web/HTML/Introduction_to_HTML5 /ja/docs/orphaned/Web/Guide/HTML/HTML5/Introduction_to_HTML5 /ja/docs/Web/HTML/Optimizing_your_pages_for_speculative_parsing /ja/docs/Glossary/speculative_parsing /ja/docs/Web/HTML/Preloading_content /ja/docs/Web/HTML/Link_types/preload /ja/docs/Web/HTML/Sections_and_Outlines_of_an_HTML5_document /ja/docs/orphaned/Web/Guide/HTML/Using_HTML_sections_and_outlines @@ -4829,7 +4814,6 @@ /ja/docs/XSLT_in_Gecko:Introduction /ja/docs/Web/API/XSLTProcessor/Introduction /ja/docs/XSLT_in_Gecko:Resources /ja/docs/Web/API/XSLTProcessor/Resources /ja/docs/addons.mozilla.org_(AMO)_API_Developers'_Guide /ja/docs/Mozilla/Add-ons -/ja/docs/ant_script_to_assemble_an_extension /ja/docs/orphaned/ant_script_to_assemble_an_extension /ja/docs/console /ja/docs/Web/API/console /ja/docs/counters /ja/docs/Web/CSS/CSS_Counter_Styles/Using_CSS_counters /ja/docs/data_URIs /ja/docs/Web/HTTP/Basics_of_HTTP/Data_URLs diff --git a/files/ja/_wikihistory.json b/files/ja/_wikihistory.json index 753e75ad34f770..0d62685e1670eb 100644 --- a/files/ja/_wikihistory.json +++ b/files/ja/_wikihistory.json @@ -48548,13 +48548,6 @@ "silverskyvicto" ] }, - "orphaned/Building_a_Mozilla_Distribution": { - "modified": "2019-03-23T23:49:07.062Z", - "contributors": [ - "Kohei", - "Mgjbot" - ] - }, "orphaned/Code_snippets/Toolbar": { "modified": "2019-03-23T23:46:21.932Z", "contributors": [ @@ -48622,13 +48615,6 @@ "RobinEgg" ] }, - "orphaned/Mozilla_Modules_and_Module_Ownership": { - "modified": "2019-01-16T15:50:48.596Z", - "contributors": [ - "Kohei", - "Mgjbot" - ] - }, "orphaned/New_in_JavaScript_1.8": { "modified": "2019-03-24T00:06:00.366Z", "contributors": [ @@ -48680,14 +48666,6 @@ "Taken" ] }, - "orphaned/Tools/Add-ons/DOM_Inspector/DOM_Inspector_FAQ": { - "modified": "2020-07-16T22:36:25.610Z", - "contributors": [ - "wbamberg", - "Kohei", - "Mgjbot" - ] - }, "orphaned/Tools/Add-ons/DOM_Inspector/Internals": { "modified": "2020-07-16T22:36:25.310Z", "contributors": [ @@ -49228,15 +49206,6 @@ "Marsf" ] }, - "orphaned/Web/Guide/HTML/HTML5/Introduction_to_HTML5": { - "modified": "2020-01-19T16:30:15.396Z", - "contributors": [ - "mfuji09", - "teoli", - "ethertank", - "Potappo" - ] - }, "orphaned/Web/Guide/HTML/Using_HTML_sections_and_outlines": { "modified": "2020-08-09T13:53:14.893Z", "contributors": [ @@ -49546,12 +49515,6 @@ "ethertank" ] }, - "orphaned/ant_script_to_assemble_an_extension": { - "modified": "2019-08-11T02:17:04.841Z", - "contributors": [ - "Marsf" - ] - }, "orphaned/reftest_opportunities_files": { "modified": "2019-01-16T16:06:58.745Z", "contributors": [ diff --git a/files/ja/orphaned/ant_script_to_assemble_an_extension/index.html b/files/ja/orphaned/ant_script_to_assemble_an_extension/index.html deleted file mode 100644 index 6c301e02422e05..00000000000000 --- a/files/ja/orphaned/ant_script_to_assemble_an_extension/index.html +++ /dev/null @@ -1,75 +0,0 @@ ---- -title: ant script to assemble an extension -slug: orphaned/ant_script_to_assemble_an_extension -tags: - - Extensions - - Extensions:Tools - - Tools -original_slug: ant_script_to_assemble_an_extension ---- -

この ant スクリプトは拡張機能のパッケージ化に役立ちます。 -

-
<?xml version="1.0"?>
-This build file was written by Régis Décamps <decamps@users.sf.net>
-
-<project name="blogmark" default="createxpi">
-       <property name="VERSION" value="1.3-rc1"/>
-       <property name="DESCRIPTION" value="New context-menu item to add
-                                           the current page in your Blogmarks"/>
-       XPI file is created after "chrome/blogmark.jar"               is created, which is then stuffed into "blogmark.xpi"
-       <target name="createxpi" depends="createjar"
-               description="Assemble the final build blogmark.xpi">
-               <zip destfile="blogmark-${VERSION}.xpi">
-                        <zipfileset dir="." includes="chrome/blogmark.jar" />
-                        <zipfileset dir="." includes="install.rdf" />
-                </zip>
-        </target>
-
-       Everything inside the chrome directory is zipped into chrome/blogmark.jar
-       <target name="createjar" depends="templates" description="Assemble the jar">
-                <jar destfile="chrome/blogmark.jar">
-                       <fileset dir="chrome/">
-                               <include name="**/*"/>
-                               <exclude name="**/*~"/>
-                               <exclude name="**/*.tpl.*"/>
-                               <exclude name="blogmark.jar"/>
-                       </fileset>
-                </jar>
-        </target>
-
-       <target name="templates" description="Generate files from templates.">
-               <copy file="chrome/content/blogmark/contents.rdf.tpl.xml"
-                     tofile="chrome/content/blogmark/contents.rdf"
-                     overwrite="true">
-                       <filterchain>
-                               <replacetokens>
-                                       <token key="VERSION" value="${VERSION}"/>
-                                       <token key="DESCRIPTION" value="${DESCRIPTION}"/>
-                               </replacetokens>
-                       </filterchain>
-               </copy>
-               <copy file="chrome/content/blogmark/about.xul.tpl.xml"
-                       tofile="chrome/content/blogmark/about.xul"
-                       overwrite="true">
-                       <filterchain>
-                               <replacetokens>
-                                       <token key="VERSION" value="${VERSION}"/>
-                               </replacetokens>
-                       </filterchain>
-               </copy>
-               <copy file="install.rdf.tpl.xml"
-                       tofile="install.rdf"
-                       overwrite="true">
-                       <filterchain>
-                               <replacetokens>
-                                       <token key="VERSION" value="${VERSION}"/>
-                                       <token key="DESCRIPTION" value="${DESCRIPTION}"/>
-                               </replacetokens>
-                       </filterchain>
-               </copy>
-       </target>
-</project>
-
-
-
-{{ languages( { "en": "en/Ant_script_to_assemble_an_extension" } ) }} diff --git a/files/ja/orphaned/building_a_mozilla_distribution/index.html b/files/ja/orphaned/building_a_mozilla_distribution/index.html deleted file mode 100644 index f2d79ef0e3d410..00000000000000 --- a/files/ja/orphaned/building_a_mozilla_distribution/index.html +++ /dev/null @@ -1,124 +0,0 @@ ---- -title: Building a Mozilla Distribution -slug: orphaned/Building_a_Mozilla_Distribution -tags: - - Build documentation - - Developing Mozilla -original_slug: Building_a_Mozilla_Distribution ---- -

-

ここでは、どうやって独自のマイルストーンビルドまたは他のディストリビューションを作るのかを説明します。独自のディストリビューシュンを作成したいというのは以下のような場合が考えられます。我々の ftp サイトに通常は置かれていないプラットフォーム用のビルドを作りたいとか、標準のビルドではサポートされていない機能を有効にしたい、などです。 -

-
    -
  1. -専用のマイルストーンソースの tar ボールをダウンロードし、自分用の通常のツリーからではなく、その tar ボールからビルドしてください。もし tar ボールがみつからない場合には、マイルストーンディレクトリの README ファイルに CVS でどうやって適切なソースを持ってくることができるかが書いてあります。必ず正しい タグ を持ってくるようにしてください。例えば次のようにします。
    cvs co -r MOZILLA_1_0_2_RELEASE mozilla/client.mk
    -cd mozilla
    -gmake -f client.mk checkout
    -
    -
  2. -
  3. -ビルドオプションを次のように設定します:デバッグシンボルを無効にする、コードを最適化する、ビルドの日付 (Bugzilla で使っているもの) を設定する、その他については適宜選択してください。 -
  4. -
  5. -作成したビルドの動作確認テストをしてください。この際、アプリケーションの右端の下あたりにある BuildID を必ずメモしてください。 BuildID は 2001102513 のようなもので、パッケージをビルドした日時を表しています。 -
  6. -
  7. -README ファイルを作り、以下のような項目についてできる限り記述してください。
    • 連絡先。これには自分の Bugzilla ID を入れてください。こうしておけば、あるパッケージに特有の問題を発見した人がそのバグについてパケージ作成者に連絡できるようになります。 -
    • BuildID -
    • ライブラリの依存関係。 -
    • ビルド作成時に使用にしたオプション一覧。 -
    • ビルド時に有効 (あるいは無効) にした非標準のも のなんでも。例えば、適用したパッチやそのパッチへのリンクなどです。 -
    -
  8. -
  9. -tar ボールをどこかに公開し、こちらに連絡をください。そうすれば私達が tar ボールを ftp サイトに移します。 さらに、tar ボール用の md5 checksum ファイルを作っておくとよ いでしょう。作成した md5sum ファイルに電子署名をしておくと さらによいでしょう。
    md5sum mozilla-i686-pc-linux-gnu-0.9.5.tar.gz
    -       > mozilla-i686-pc-linux-gnu-0.9.5.tar.gz.md5sum
    -
    -
  10. -
-

ディストリビューションを作成する

-

ビルド方法Unix Build Configurator の使い方に慣れておくと、mozconfig ファイルの作成に役立ちます。 -

-

ソースをダウンロードしてください

-

最新のマイルストーンソースの tar ボールを ダウンロード してください。または、最新のマイルストーンの README ファイルに書いてある方法に従って、CVS から tag でもってきてください。(独自のツリーでコードからディストリビューションを作成した場合には、おそらく、最初に gmake -f client.mk distclean をする必要があります。) -

-

ビルド環境を設定してください

-

tar ボールから作成されたツリーにファイルを作り mozilla/.mozconfig としてください。以下にあげるようなオプションを付けるとディストリビューションのサイズを小さくすることができます。<tt>--disable-debug</tt> オプションはとても重要です。これを指定しないとパッケージが 50MB あるいはそれ以上になってしまいます。パッケージのサイズは通常 10MB くらいです。<tt>--enable-optimize</tt> オプションを付けるとコンパイラは最適化されたバイナリを作成します。オフィシャルビルドでは有効になっていない SVG などの他のオプションは適宜選択してください。 -

ビルドしているバイナリがさまざまなシステムに配布される予定であったり、実行時にリンクする共通ライブラリと全く同一のライブラリ一式がビルドしているバイナリに含まれていない場合には、Mozilla の zlib や jpeg のライブラリをビルドして配布するようにするといいでしょう。 -

-
ac_add_options --disable-tests
-ac_add_options --disable-debug
-ac_add_options --enable-optimize
-ac_add_options --without-system-nspr
-ac_add_options --without-system-zlib
-ac_add_options --without-system-jpeg
-ac_add_options --without-system-png
-ac_add_options --without-system-mng
-ac_add_options --enable-crypto #PSM/SSL のサポートを無効にするにはこの行をコメントアウトする
-
-

以下の環境変数を設定してください。ビルドの日付が正確になります。 -

Unix または Mac OS X の場合: -

-
MOZILLA_OFFICIAL=1
-export MOZILLA_OFFICIAL
-BUILD_OFFICIAL=1
-export BUILD_OFFICIAL
-
-

Win32 の場合: -

-
set MOZILLA_OFFICIAL=1
-set BUILD_OFFICIAL=1
-
-

ツリーをビルドしてください

-

普段使う build コマンドは、マイルストーンビルドをコンパイルするのに決して使わないでください。CVS アップデートをしたいわけではないのです。ツリーと同期をとってしまうと最新版からビルドしていることになり、マイルストーンビルドではなくなってしまいます。 -

-
gmake -f client.mk build
-
-

README ファイルを添えてください

-

README ファイルを mozilla/dist/bin にコピーしてください。こうすれば、次のステップで作成される tar ボールに README ファイルが含まれるようになります。ldd のある UNIX の場合には、以下のコマンドを実行し UNIX ビルド用の依存関係一覧を作成してください。 -

-
ldd mozilla-bin components/*.so | awk '{ if (/=/ && !/not found/ ) print $3 }' | sort | uniq
-
-

If using tcsh, you may need to escape the ! . -

-

パッケージを作成してください

-
tar ボール( または zip や dmg) を作るには
-

packager ディレクトリにある makefile でパッケージのディレクトリに tar ボールを作成します。パッケージは mozilla/dist に配置されます。 -

OS/2 と Win32 用のビルドの場合、デフォルトのパッケージタイプは zip です。Mac OS X 用の場合、デフォルトのパッケージタイプは dmg です。その他のビルドの場合には、デフォルトのタイプは tar.gz です。 -

-
gmake -C mozilla/xpinstall/packager
-
-
UNIX のインストーラを作るには
-

UNIX インストーラをビルドするには、カレントディレクトリを xpinstall builder に変更し perl スクリプトを実行してください。すると mozilla/installermozilla-$platform$-installer.exe が作成されます。 -

-
cd mozilla/xpinstall/packager/unix/
-perl deliver.pl <version> <urlpath> <stubname> <blobname>
-</blobname></stubname></urlpath></version>
-
-
Win32 のインストーラを作るには
-

以下のものが必要になります: -

- -

Win32 インストーラをビルドするには、カレントディレクトリを xpinstall builder に変更し perl のスクリプトを実行してください。すると mozilla\dist\installmozilla-win32-installer.exe が作成されます。 -

-
cd mozilla\xpinstall\wizard\windows\builder
-perl build.pl
-
-

テスト

-

パッケージの動作確認テストをしてください。スモークテスト はこのテストのために設計されています。 -

-

配布

-

tar ボールをどこかに公開し、こちらに連絡をください。そうすれば私達が tar ボールを ftp サイトに移します。連絡してほしい項目は、BuildID およびビルド環境について有益だと思われることなんでもです。例えば、OS のバージョン、ディストリビューションの名前、含まれているオプションコンポーネント、または、非標準のコンパイラを使ったかどうか、などです。

各パッケージには必ず README ファイルを添 えてください。 -

-
-

原文書の情報

-
  • 著者: Dawn Endico -
  • 最終更新日: January 20, 2007 -
  • 著作権: Portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a Creative Commons license | 詳細 -
-
-
-
-{{ languages( { "en": "en/Building_a_Mozilla_Distribution" } ) }} diff --git a/files/ja/orphaned/developing_add-ons/index.html b/files/ja/orphaned/developing_add-ons/index.html deleted file mode 100644 index 2223fbf2a20487..00000000000000 --- a/files/ja/orphaned/developing_add-ons/index.html +++ /dev/null @@ -1,9 +0,0 @@ ---- -title: アドオンを開発する -slug: orphaned/Developing_add-ons -original_slug: Developing_add-ons ---- -

Mozilla ベースのソフトウェアはたいていアドオンを通して拡張可能です。アドオンには、拡張機能、プラグイン、テーマの 3 つの主なタイプがあります。このページはFirefox、Thunderbird、あるいは、Mozilla プラットフォームをベースにしたその他のソフトウェア向けのアドオンを作成するために必要となる情報、および、作成したアドオンを配布する方法のガイドを提供します。

- -

アドオンに関するトピックス

アドオンを AMO に提出する
アドオン開発者がアドオンを正しくパッケージし配布するために助けとなる情報を提供します。このページには Mozilla のアドオン配布 Web サイトである addons.mozilla.org についての情報が含まれています。
拡張機能
拡張機能は Firefox や SeaMonkey、Thunderbird のような Mozilla アプリケーションに新しい機能を追加します。ツールバーボタンから完全に新しい形態のものまであらゆるものを追加できます。
プラグイン
Mozilla ベースのソフトウェアにネイティブでは扱えないコンテンツを表示させることを可能にさせるバイナリコンポーネントである、プラグインの作成方法についての情報。
Jetpack
あらゆる人のためのブラウザ拡張開発システムです。Jetpack 開発者はモダンな web のツールである HTML と CSS、JavaScript を知っているだけで良いのです。
テーマ
テーマはユーザに Mozilla ベースのアプリケーションによって提供されているユーザインターフェースの見た目をカスタマイズさせることを可能にします。
検索エンジンプラグイン
Firefox は検索ボックスで異なる検索エンジンをサポートすることを可能にする検索エンジンプラグインをサポートしています。
addons.mozilla.org (AMO) API Developers' Guide
AMO Developers' Guide は addons.mozilla.org からアドオンにつての情報を入手するための AMO API の利用方法を説明します。
Mozilla プラットフォーム
API および技術のすべて、また、それらをあなた自身のプロジェクトで利用する方法を含む、Mozilla プラットフォームについての情報。
-

{{ languages( { "en": "en/Developing_add-ons", "zh-cn": "cn/Developing_add-ons"} ) }}

diff --git a/files/ja/orphaned/developing_mozilla/index.html b/files/ja/orphaned/developing_mozilla/index.html deleted file mode 100644 index e027705e1021d1..00000000000000 --- a/files/ja/orphaned/developing_mozilla/index.html +++ /dev/null @@ -1,68 +0,0 @@ ---- -title: Developing Mozilla -slug: orphaned/Developing_Mozilla -tags: - - Developing Mozilla -original_slug: Developing_Mozilla ---- -

-

バグの修正を手伝いたいけれど、どこから始めたらいいのか分からない? これは獣をハックするためのすべてのスタート地点です。ここでは、ソースの取得方法そのビルド方法パッチの作成や、それらを tree にチェックインする方法、その他の Mozilla ハッカーが知らなければならない基本的なことを見つけられるでしょう。 -

- - -
-

ドキュメンテーション

-
mozilla.org のハッキングガイド -
ハッキングに関連する他のページ。 これは作成途中です。 -
-
コードの断片Firefox をハッキング -
フロントエンド開発にどのように関わるか。 -
-
Firefox や Thunderbird、その他のアプリケーションのビルド -
このセクションには、Firefox や Thunderbird、その他の Mozilla ベースのアプリケーションをビルド方法についてのドキュメントが含まれています。 -
-
Mozilla の開発戦略 -
Mozilla プロジェクトで効率良く作業するためのヒント。 -
-
開発製品のテスト -
製品をテストするための情報テスト自動化ツール -
-
デバッグについての FAQ -
デバッグのヒントはプラットフォームごとに異なります。Windows または Linux, Mac OS X のいずれかを選んでください。 -
-
パッチの作成レビューおよびコミットのために -
パッチの作成と tree に変更を加えるためのヒント。 -
-
Mozilla のソースコードをオンラインで表示、検索する -
Mozilla クロスリファレンス (MXR) システムを利用して、すべての Mozilla 製品のソースコードを表示、検索します。 -
-
Getting commit access to Mozilla source code -
Find out how you can get access to commit changes directly into the source code. -
-

すべて見る... -

-
-

コミュニティ

- -

ツール

- -

すべて見る... -

-

関連項目

-
品質保証 -
-
-

Categories -

Interwiki Language Links -


-

{{ languages( { "de": "de/Mozilla_entwickeln", "en": "en/Developing_Mozilla", "es": "es/Desarrollando_Mozilla", "fr": "fr/D\u00e9veloppement_de_Mozilla", "pl": "pl/Programowanie_Mozilli", "pt": "pt/Desenvolvimento_Mozilla", "zh-cn": "cn/\u5f00\u53d1Mozilla" } ) }} diff --git a/files/ja/orphaned/javascript_modules/index.html b/files/ja/orphaned/javascript_modules/index.html deleted file mode 100644 index 2febde5954dd39..00000000000000 --- a/files/ja/orphaned/javascript_modules/index.html +++ /dev/null @@ -1,25 +0,0 @@ ---- -title: JavaScript modules -slug: orphaned/JavaScript_modules -tags: - - Firefox 3 - - JavaScript - - XPCOM:Language Bindings - - XPConnect -original_slug: JavaScript_modules ---- -

Firefox 3 で、外部モジュールから JavaScript コードをインポートする簡単な方法を提供する、新しい Components.utils.import() メソッドが導入されました。JavaScript モジュールの作成と 使い方 に関する情報を参照してください。JavaScript モジュールは、拡張機能では共有データ に利用することもできます。 -

モジュールのインポートに関しては、この方法が利用できるほか、Firefox 3 にはあらかじめ 2 つのモジュールが組み込まれています。 -

-
XPCOMUtils -
XPCOMUtils.jsm モジュールは、JavaScript コンポーネントローダーによって読み込まれる、JavaScript コンポーネントのためのユーティリティを提供します。 -
JSON -
JSON.jsm モジュールは、JSON データを操作するためのユーティリティを提供します。 -
PluralForm -
PluralForm.jsm モジュールは、複数のローカライゼーションで複数形の単語を正しく扱うためのツールを提供します。 -
-


-

-
-
-{{ languages( { "en": "en/JavaScript_modules", "es": "es/M\u00f3dulos_JavaScript", "fr": "fr/Modules_JavaScript", "pl": "pl/Modu\u0142y_JavaScript" } ) }} diff --git a/files/ja/orphaned/javascript_presentations/index.html b/files/ja/orphaned/javascript_presentations/index.html deleted file mode 100644 index eb8cf5a123c7b5..00000000000000 --- a/files/ja/orphaned/javascript_presentations/index.html +++ /dev/null @@ -1,17 +0,0 @@ ---- -title: JavaScript Presentations -slug: orphaned/JavaScript_Presentations -tags: - - JavaScript - - Presentations -translation_of: JavaScript_Presentations -original_slug: JavaScript_Presentations ---- -


-

-
JavaScript 2 and The Open Web -
2007-11-20, Brendan Eich -
-
-
-{{ languages( { "en": "en/JavaScript_Presentations" } ) }} diff --git a/files/ja/orphaned/key-navigable_custom_dhtml_widgets/index.html b/files/ja/orphaned/key-navigable_custom_dhtml_widgets/index.html deleted file mode 100644 index d6e5d0a0307bf3..00000000000000 --- a/files/ja/orphaned/key-navigable_custom_dhtml_widgets/index.html +++ /dev/null @@ -1,116 +0,0 @@ ---- -title: キー操作可能なカスタム DHTML ウィジェット -slug: orphaned/Key-navigable_custom_DHTML_widgets -tags: - - AJAX - - Accessibility - - DHTML -original_slug: Key-navigable_custom_DHTML_widgets ---- -

 

- -

課題: 今日の DHTML パッケージはキーボードアクセシビリティが欠けている

- -

増加傾向にあるウェブアプリケーションは、JavaScript を使用してメニューやツリービュー、リッチテキストフィールド、タブパネルなどのようなデスクトップウィジェットを模倣しています。Web 開発者は絶えず表計算やカレンダー、構造図などのような対話的な要素を取り入れ、新たなアプリケーションは複雑化しています。現在まで、Web 開発者はスタイル付けられた <div><span> を基にして、正しい技術を欠いたウィジェットをキーボードで利用できるようにしようとしています。しかしながら、キーボードアクセシビリティは Web 開発者が知っておくべき最小限必要なアクセシビリティの一部でしかありません。

- -

実例を挙げると、ほとんどの DHTML メニューは、キーボードアクセスを尊重した正規のメニューのようには動作しません。キーボードでとにかくメニューを利用できるようにする場合によくある共通の間違いは、各メニュー項目(<a> 要素を使用して作られます) をタブ移動の順番に含めてしまうことです。実際のメニューの正しい振る舞いは、一度でメニュー全体にタブ移動でき、矢印キーによる操作でメニュー項目からメニュー項目へと移動できるようになっていなければなりません。これはツリービューやグリッド、タブパネルなど、その他の "グループ化された操作" にも当てはまります。

- -

HTML 作者にとっては今すぐできる正しいことです。これらのウィジェットを支援技術との互換性を持たせるためのドキュメントは、ARIA: Accessible Rich Internet Applications 以下にあります。

- -

解決法: tabindex の振る舞いを標準準拠にする

- -

Firefox 1.5 は、Microsoft Internet Explorer が先導する tabindex 属性を拡張することにより、どの要素でもフォーカスできるように変更しています。IE システムの tabindex によれば、私たちは、すでに IE でキーボード操作できるようになっているDHTML ウィジェットを Firefox 1.5 でもキーボードで操作できるようにしています。作者がカスタムウィジェットをキーボードで操作できるようにする手段をもつために、ルールは曲げられるべきです。

- -

続く表は、新しい tabindex の振る舞いについて記述しています:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
tabindex 属性マウスまたは element.focus() を用いた JavaScript でフォーカスタブ操作
なし既定の要素の振る舞いに従う。(フォームコントロールやリンクなどについては可)既定の要素の振る舞いに従う。
負の値 (例: tabindex="-1")不可。作者は矢印キーか他のキーの押下によって element.focus() でフォーカスしなければいけません。
0 (例: tabindex="0")タブで移動する順番は、要素のドキュメント内の位置によります。
正の値 (例: tabindex="33")tabindex の値は、要素の位置にタブで移動する順番を手動で変更します。これらの要素へ移動する順番は、tabindex="0" を持つ要素か、そのままタブで移動できる要素の前に位置します。
- -

新しいシステムの使い方

- -

タブで操作できる簡単なウィジェットを作成するには、tabindex="0"<div> または <span> 上に使用してください。span を基にしたチェックボックス の例は Firefox 1.5 と IE の両方で、キーボードで利用できます。(ただし、チェックボックス画像の :before ルールは IE で動作しません)

- -

メニューやタブパネル、グリッド、ツリービューなど、ウィジェットの集まりの親要素は tabindex="0" を持つべきです。また、選択肢/タブ/セル/行の子孫要素は tabindex="-1" を持つべきです。element.focus() を使用して矢印キーを観察する onkeydown イベントは、適切な子孫ウィジェットにフォーカスをセットして呼び出すことができるため、フォーカスすることができます。DHTML ツリービュー の例は Firefox の nightly ビルド上で、キーボードとスクリーンリーダで利用できます。(IE 上でも動作します)

- -

これはまだ W3C やその他の公式な標準の一部ではありません。しかし今は、完全にキーボードで利用できるようにするためにルールを曲げる必要があります。

- -

作成時のヒント

- -

onfocus を使用して現在のフォーカスを追跡する

- -

onfocus イベントおよび onblur イベントは、すべての要素で使用することができます。現在のドキュメントのフォーカスを得るための 標準的な DOM インタフェースが無いため、これを追跡し続けるには JavaScript の変数を使用します。

- -

すべてのフォーカス変更はキーイベントとマウスイベントによってのみ起こるとは仮定しないでください。スクリーンリーダなどの支援技術はフォーカスを任意のフォーカス可能な要素にセットすることができ、それらが JavaScript ウィジェットによって的確に扱われる必要があります。

- -

tabIndex プロパティを使用してフォーカス可能性を動的に変更する

- -

カスタムコントロールが無効なった場合にはフォーカスできなくし、有効になった場合にはフォーカスできるようにしたいはずです。無効になったコントロールにタブで移動するべきではありません。しかしながら、それらが操作ウィジェットの集まりの一部である場合はタブで移動できるようにします。

- -

element.focus()setTimeout を使用してフォーカスをセットする

- -

要素にフォーカスを移すために createEvent() および initEvent(), dispatchEvent() を使用してはいけません。DOM フォーカスイベントは、何かがフォーカスされた後にシステムによって発生しますが、フォーカスのセットには使用されません。タイムアウトは、ユーザがボタンやその他のコントロールをクリックして予期しない動作を起こすスクリプトを防ぐために、IE と Firefox 1.5 の両方で必要です。要素をフォーカスする実際のコードは以下のようになります:

- -
window.setTimeout(function () { focusItem.focus(); },0);  // focusItem はスコープ内になければいけません
-
- -

フォーカスのスタイル付けに :focus または属性セレクタを使用してはいけません

- -

IE でフォーカスが表れるようにしたい場合、フォーカスのスタイル付けに :focus または属性セレクタを使用することはできません。onfocus イベントハンドラ内でスタイルをセットしてください。例えば、<div> メニュー項目のフォーカスハンドラに this.style.backgroundColor = "gray"; を追加します。

- -

プログラム的にフォーカスを受けた tabindex="-1" 項目および要素にはいつもフォーカスを描く

- -

IE はプログラム的にフォーカスを受けた項目には自動的にフォーカスの輪郭を描きません。this.style.backgroundColor = "gray"; のようにして背景色を変更するか、this.style.border = "1px dotted invert" のように点線の境界線を追加するか、どちらかを選んでください。点線の境界線にする場合は、はじめに見えない 1px の境界線を要素に指定しておく必要があります。こうしておけば、境界線のスタイルが適用されたときに要素がずれることはありません。(境界線が空白をつくり、IE は CSS の輪郭を提供しません)

- -

キーイベントの追跡には onkeypress ではなくonkeydown を使用する

- -

IE は英数字以外のキーで keypress イベントを発生させることができません。

- -

ブラウザの機能を実行するキーイベントの使用を避ける

- -

矢印キーが使用される場合は、以下のようなコードで、キーを使用をする何か(スクロールなど) からブラウザを避けてください:

- -
<span tabindex="-1" onkeydown="return handleKeyDown();">
-
- -

handleKeyDown()false を返す場合は、イベントは消費され、キー入力して実行する動作からブラウザを避けます。

- -

キーイベントハンドラを使用して要素のアクティベーションを有効にする

- -

すべてのマウスイベントハンドラには、キーボードイベントハンドラが必要です。例えば、onclick="doSomething()" には、この要素を Enter キーでアクティベートできるようにするために、onkeydown="return event.keyCode != 13 || doSomething();" が必要です。

- -

try/catch を使用して JavaScript エラーを回避する

- -

このシステムは現在、Opera および Safari、その他の Mozilla (1.7 およびそれ以前) の古いバージョンではサポートしていません。一部のブラウザは、すべての要素上のtabIndex プロパティのような新しい能力をサポートしていないため、適切な場所で try/catch を使用してください。DTHML によるキー操作システムをサポートしていないブラウザ上では、ウィジェットをマウスで利用できるようにしておくべきです。このシステムは Opera と Safari でのサポートが WHATWG 仕様を通して計画されています。

- -

キーリピートの振る舞いは一貫していません

- -

困ったことに、onkeydown が繰り返されるかどうかは、あなたの起動している OS に依存します。Bugzilla データベースの {{ Bug(91592) }} をご覧ください。

- -

{{ languages( { "en": "en/Key-navigable_custom_DHTML_widgets", "fr": "fr/Contr\u00f4les_DHTML_personnalis\u00e9s_navigables_au_clavier" } ) }}

diff --git a/files/ja/orphaned/mcd/getting_started/index.html b/files/ja/orphaned/mcd/getting_started/index.html deleted file mode 100644 index eb2e86aeacb80a..00000000000000 --- a/files/ja/orphaned/mcd/getting_started/index.html +++ /dev/null @@ -1,55 +0,0 @@ ---- -title: Mozilla 製品の集中管理 - 基本編 -slug: orphaned/MCD/Getting_Started -tags: - - Administration - - Configuration management - - enterprise -original_slug: MCD/Getting_Started ---- -

Firefox や Thunderbird などの Mozilla アプリケーションには、設定項目を集中管理する機能が備わっています。この機能は Netscape Communicator から引き継がれたものです。今のところ、Netscape Mission Control Desktop (MCD) のような管理者向けツールはありませんが、Mozilla アプリケーションの設定項目に詳しい方であれば、いくつかのテキストファイルを用意するだけで、簡単にこの機能を利用できます。

-

準備

-

以下は Firefox の例で説明しますが、Thunderbird でも同様です。

-

クライアントサイド

-

autoconfig.cfgautoconfig.js という 2 つのプレーンテキストファイルをアプリケーションディレクトリ以下に追加します。ここでは Windows での標準的なパスを想定しますが、必要に応じて読み替えてください。

-

C:\Program Files\Mozilla Firefox\autoconfig.cfg

-

中身は空白にします。

-

C:\Program Files\Mozilla Firefox\defaults\pref\autoconfig.js

-

以下の 3 つの設定項目を記述します。

-
// サーバ上に置く jsc ファイルの URL (適宜変更してください)
-pref("autoadmin.global_config_url", "http://myserver/mozilla/firefox/autoconfig.jsc");
-
-// ローカルに置く cfg ファイルのファイル名
-pref("general.config.filename", "autoconfig.cfg");
-
-// 上記ファイル名の拡張子を除いた名前
-pref("general.config.vendor", "autoconfig");
-
-

サーバサイド

-

サーバ上に以下の 2 つのファイルを置きます。

-

http://myserver/mozilla/firefox/.htaccess

-

これは jsc ファイルの適切な MIME タイプを設定するものです。不明な場合はサーバ管理者に問い合わせてください。

-
AddType application/x-javascript-config jsc
-
-

http://myserver/mozilla/firefox/autoconfig.jsc

-

これが、実際に設定を記述するファイルです。ファイルの拡張子は js ではなく jsc とします。

-
// クライアントの js ファイルと同じ内容をここにも記述します。
-// ただし、lockPref によって設定項目をロックしていることに注意してください。
-lockPref("autoadmin.global_config_url", "http://myserver/mozilla/firefox/autoconfig.jsc");
-lockPref("general.config.filename", "autoconfig.cfg");
-lockPref("general.config.vendor", "autoconfig");
-
-// 以下、任意の設定項目を追加していきます。
-// 例えば以下の行ではアドオンのインストールを無効化しています。
-lockPref("xpinstall.enabled", false);
-    :
-    :
-    :
-
-

使い方

-

準備が終わったら、クライアント側でアプリケーションを起動すれば、サーバから自動的に設定項目が読み込まれ、適用されます。

-

関連記事

-

jsc ファイルでは、特定の設定項目をロックするだけでなく、環境変数の取得と条件分岐、規定値の設定、LDAP サポート (Thunderbird のみ) など、他にもいくつかの機能を利用できます。詳細は以下の記事を参照してください。

- diff --git a/files/ja/orphaned/mcd/index.html b/files/ja/orphaned/mcd/index.html deleted file mode 100644 index 7283dca2deea29..00000000000000 --- a/files/ja/orphaned/mcd/index.html +++ /dev/null @@ -1,57 +0,0 @@ ---- -title: MCD -slug: orphaned/MCD -tags: - - MDC Project - - NeedsEditorialReview - - NeedsTechnicalReview -original_slug: MCD ---- -
-

Mozillaを企業に配備する方法についての寄稿ドキュメンテーション記事です。

-
- - - - - - - -
-

ドキュメンテーション

-
-
- ガイド
-
- -
-

リンク

-
-
- 関連 bugzilla
-
- -
-
- リファレンス
-
- -
-

{{ languages( { "en": "en/MCD" } ) }}

diff --git a/files/ja/orphaned/mozilla_modules_and_module_ownership/index.html b/files/ja/orphaned/mozilla_modules_and_module_ownership/index.html deleted file mode 100644 index 6ab13a36004229..00000000000000 --- a/files/ja/orphaned/mozilla_modules_and_module_ownership/index.html +++ /dev/null @@ -1,63 +0,0 @@ ---- -title: Mozilla Modules and Module Ownership -slug: orphaned/Mozilla_Modules_and_Module_Ownership -tags: - - Developing Mozilla -original_slug: Mozilla_Modules_and_Module_Ownership ---- -

Mozilla モジュールの特徴、モジュールオーナーの役割、モジュール所有者の基準、モジュールオーナーの指名。 -

-

意思決定の分散

-

コードの適切性、品質、または CVS ソースレポジトリにチェックインされる準備が整っているのかという点に関して mozilla.org のスタッフメンバーが決定を下していない事項が多数あります。スタッフがこのような作業を行うには Mozilla プロジェクトがあまりに大きすぎるためです。プロジェクトにはコアテクノロジーセット (レイアウトエンジン、ネットワークライブラリ、クロスプラットフォームコンポーネントモデルなど)とこれらのテクノロジーで構築されたアプリケーションセット (ブラウザ、メール/ニュースリーダー、Internet Relay Chat クライアント) の両方が含まれています。mozilla.org のスタッフは、現行の開発に必要な大量の決定を下すための態勢が整っていません。ひとつには、mozilla.org スタッフがコードのあらゆる分野の専門家であると思うのはおこがましいことだと考えるからです。間違いなくそんなことはありません。もうひとつには、スタッフが少人数であることが挙げられます。特定のコードに関する大半の決定を mozilla.org のスタッフが下そうとしたならばプロジェクトはなかなか進捗しなくなってしまいます。 -

この代わりとして、mozilla.org は「モジュール」およびモジュールオーナーシップを通じて広範な参加者に意思決定を分散しています。モジュールとは、合理的に定義された境界を持つ機能の一部分を実装するファイルセットです。モジュールは、アクセシビリティのための「accessible」などディレクトリ内のファイルセットの場合があります。または「スタイルシート」などのようにより概念的な場合があります。このような場合、モジュールにはソースツリーのさまざまな領域内に多数のファイルが含まれます。モジュールが C または C++ で記述されている場合には、.h ファイルと、.c または .cpp ファイルの 2 ファイルのみを含むことができます (一例は xpcom/ds/pldhash.{{ mediawiki.external('ch') }} で、これは xpcom の他の要素とは個別に処理されます)。 -

「合理的に定義された境界」といっても、絶対的に明確ではないのは当然です。特定の機能が終了し別の機能が開始する場合に重複やあいまいさがある場合、この定義自体がコードを反映するため、私たちはこの定義を使用します。絶対的な定義を作成しようとすると、複雑なルールや例外が要求されますが、これらはほとんどの場合必要とされません。このような定義を考案するためにエネルギーを使うよりも、必要に応じて mozilla.org のスタッフが仲介となってモジュールオーナーに重複または共有したオーナーシップを可能であれば管理していただきたいと考えています。 -

-

モジュールオーナーシップの役割

-

「モジュールオーナー」は mozilla.org のスタッフがモジュールの開発のリーダーシップを委ねた人を指します。モジュールオーナーの責任範囲は、コードの品質を改善する、適宜改訂と刷新を実施する、残りのコードベースの開発との調整を図る、モジュールの方向性に関する共通の理解を構築および維持する、適宜 API を開発する、可能な限り多くの文書を作成する、コードの貢献に適切に対応する、提言を策定したり、コミュニティから述べられたニーズをまとめる、有能な新規参加者を喜んで受け入れる環境を作るなど、広範囲に及びます。 -

コードをそのモジュールにチェックインするためには、モジュールオーナーの承認が必要です。これと引き換えに、私たちはモジュールオーナーに対して、受け取るものに注意を払う、他の人によって実行されたパッチに対応する、そして他の人によって開発されたコードを正当に評価することを期待しています。この役割を果たす方法についてはかなりの柔軟性がモジュールオーナーに与えられています。mozilla.org のスタッフは、モジュールオーナーがモジュールを管理する方法についての複雑なルールや手順を規定しません。作業がうまくいき、コミュニティ全体が満足すれば、これに越したことはありません。そうでない場合には、うまくいくように問題点を見つけて正していけばいいのです。 -

モジュールオーナーはモジュールの管理作業すべてを自分で行う必要はありません。モジュールオーナーは、モジュールにチェックインするためにコードを認可する能力のある他の人を指名することができます。これらの開発者は「ピア」と呼ばれ、優れたモジュールオーナーに求められる資質の多くを持つ人がその任に就くべきです。モジュールオーナーは、自分自身が作成したコードを評価する場合、ピアを指名して評価してもらわなければなりません。モジュールオーナー自身が自分のコードのレビューをすることは許されません。モジュールオーナーがいない場合には、そのモジュールをコードにチェックインするためにピアの承認があれば十分です。 -

モジュールオーナーは専制的な支配者ではありません。コミュニティからの入力を基に、そしてコミュニティの利益を最優先にして決定する権限を与えられています。コードの記述はコミュニティが行うので、モジュールオーナーに記述は求められません (もちろん、他の人たちと同じように、モジュールオーナーの雇用者やコミュニティが記述を求めるなどさまざまな理由から、モジュールオーナーがコードを記述してもかまいません)。モジュールオーナーはそのモジュールに実行されるパッチに注意を払う必要があります。といっても、「注意を払う」ということはすべてのパッチに同意することを意味するわけではありません。Mozilla にとって意味のないパッチもあれば、実装してもうまくいかないパッチもあるかもしれません。モジュールオーナーにはパッチを拒否する権限が与えられています。これはモジュールオーナーの不可欠な役割のひとつです。mozilla.org はモジュールオーナーに、パッチへの変更を求める理由、パッチを拒否する理由、または一定期間レビューを延期する理由など該当するバグのレポートをお願いしています。使えるパッチにするためにパッチをリライトすることはお願いも期待もしていません。同様に、次回の期日を考慮するとある有望なパッチのレビューを延期しなければならない場合があります。たとえば、パッチに関心はあるが、次のマイルストーンに向かないという場合です。このような場合には、マイルストーンに必要な状況が整うまでパッチのレビューを延期する方が得策です。該当するバグのレポートにその旨を記述してください。そして当然のことですが、mozilla.org スタッフによるレビューを行わずに頻繁にまた長期間にわたって延期し続けることはできません。 -

-

mozilla.org スタッフのレビュー

-

論争に発展した場合やその他の方法で解決できない場合には、mozilla.org が関与します。モジュールオーナーが特定のアクションに同意する公式見解を mozilla.org に求める場合もあれば、モジュールオーナーが改善できるであろう方法をその他の貢献者が提案する場合もあります。現在論争が展開されている場合もあります。可能であればこれらの問題をコミュニティが解決するのが望ましいと考えますが、常にそうはいかないということも分かっています。「こうでなければならない」というような絶対的な決定は避けようと努めますが、必要な場合には絶対的な決定を下します。 -

-

モジュールオーナーシップの基準

-

優れたモジュールオーナーシップにとって重要な要素は多数あります。もちろん第一は問題のコードに対する個人の専門的な知識です。しかしこれまでの経験から、付加的な基準も重要であること、また優れたハッカーがモジュールオーナーに適しているとは限らないことが分かっています。優れたモジュールオーナーのための基準は以下のとおりです。 -

-
  1. モジュールのコードに対する専門知識 -
  2. そのモジュールに現在関与している -
  3. モジュールの進むべき方向性を深く理解し、ビジョンを持っている -
  4. Mozilla コードベース全体、ならびにコードベースとモジュールの関係を正しく理解している -
  5. パッチや新機能への貢献を含み、そのモジュールのコードを評価する能力 -
  6. コードベースの他の部分に対するコードの影響を評価する能力 -
  7. 多様で地理的に分散しているコミュニティとのコミュニケーション能力 -
  8. 出処に関係なく (つまり「ここで開発されたものではない」シンドロームに罹っていない)、真価で貢献を評価しようとする姿勢 -
  9. そのモジュールの対象となるさまざまなコンシューマの多様な視点とニーズを考慮する能力 -
  10. 適宜ファクタリングやその他の抽出技法によってさまざまなニーズを解決する能力 -
-

モジュールオーナーの指名

-

ある個人が一定期間モジュールで作業を行い、モジュールを完了させるまでの間、基準のほとんど (完璧を求めるほど世間知らずではありません) を満たすことができる能力を証明し、そしてこの人をモジュールオーナーとして指名することへの総意が生まれることが望ましいと考えています。このように、指名は任命というよりはむしろ確認です。これまで常にそうしてきたわけではなく、また常にこの方法がうまくいったわけでもありませんが、今後よりよい仕事をしていこうと思っています。 -

これは、モジュールオーナーが不在の時があるということを意味します。特にほとんど注目されてなかったモジュールや廃り始めたモジュール、また勇敢な人が状況を把握し再び軌道に乗せるために尽力してくれる場合には、モジュールオーナーが不在です。これらの人たちの取り組みに対して大いに感謝するものです。ただし、これらの人たちをモジュールオーナーに指名することはすぐにはできません。当然のことながら、このモジュールの作業に相応の時間を費やさないと、この人が基準のいくつか、特に 1 から 5 の基準を満たしていることを証明することは困難です。この作業を行うことができるだけの幅広いそして深い専門知識をある人が持っているというのは十分にあり得ることですが、これはどちらかといえば例外だと思います。 -

モジュールオーナーを決定する際、上記の基準が各モジュールに対して同じ重要性を持っているとは限りません。モジュールごとに特定の要素の重要性は変わります。たとえば、基準 4 (Mozilla コードベース全体、ならびにコードベースとモジュールの関係を正しく理解している) と 6 (コードベースの他の部分に対するコードの影響を評価する能力) は自己完結型のモジュールにはあまり重要ではありませんが、コードの他の部分に多大な影響を及ぼすコアテクノロジーを含むモジュールにとっては非常に重要です。同様に、基準 9 (そのモジュールの対象となるさまざまなコンシューマの多様な視点とニーズを考慮する能力) と 10 (適宜ファクタリングやその他の抽出技法によってさまざまなニーズを解決する能力) は、少人数の貢献者のために明確に定義された機能を果たすモジュールにはあまり重要ではありませんが、さまざまな用途と広範な貢献者グループをサポートするモジュールには不可欠です。 -

-

Despot によるモジュールオーナーとピアデータの追跡

-

mozilla.org は「Despot」(despot.mozilla.org) として知られているデータベースを使用してモジュール、モジュールオーナーおよびピアを追跡しています。データは www.mozilla.org/owners.html をご覧ください。このページには、各モジュールを構成するコードの指示も記載されています。 -

-

モジュールオーナーシップの譲渡

-

モジュールオーナーシップの譲渡は mozilla.org を通じて行われます。モジュールオーナーを辞任するためには、staff@mozilla.org にメールを送信してください。遠慮なく新しいモジュールオーナーの推薦をメールに記載してください。モジュールによっては、モジュールオーナーシップの基準を満たしていることが証明済みで、モジュールオーナーになることに興味を持っており、継承者となることを概ね了承しているピアがいる場合もあります。このような場合には、mozilla.org のスタッフが Despot にオーナーシップの変更を行います。それ以外の場合には、そのモジュールに関するオーナーシップの基準を満たしていることを証明済みの人はいないでしょう。このような場合には、オーナーが育つまでオーナー不在でモジュールを進行し、モジュールのピアがそのモジュールにチェックインするために必要なレビューと承認を行います。 -

-

Bugzilla コンポーネントオーナーシップとの関係

-

モジュールオーナー/ピアの役割と Bugzilla コンポーネントの既定のオーナーの役割が不明瞭な場合があります。しかし役割は全く異なっています。コンポーネントオーナーは、特定のコンポーネントに対するバグレポートの受け取りに最も適した人のことで、モジュールの方向性やコードのレビューに関しての決定を下すために最適な人とは限りません。これにはいくつかの理由があります。第一に、Bugzilla コンポーネントはモジュールに正確に対応してはいません。これは、コンポーネントがバグを確認および経験する方法を反映しているが、コードの構造を必ずしも反映していないためです。第二に、バグの管理は、モジュールのコード管理とは異なる作業です。必要となるスキルが異なります。したがって、非常に優れたハッカーであっても、バグレポートを定期的にレビューする、進捗状況を追跡する、正しいオーナーにバグを再度割り当てる、テストケースが存在することを確認するなどの作業を得意としない場合があります。これらのスキルに優れていてもモジュールオーナーにふさわしくない貢献者もいます。Bugzilla コンポーネントオーナーとモジュールオーナーが同一人物の場合もありますが、多くの場合、別の人物がそれぞれのオーナーです。 -

-

モジュールのメンテナンス不良

-

モジュールのメンテナンス状態が悪く、残りのコードベースとうまく動かない場合があります。モジュールオーナーが不在である、または指名されたモジュールオーナーが他の作業に忙しくてそのモジュールのメンテナンスができない場合に発生します。あるいはモジュールオーナーはいるが、コミュニティ全般が不適切だと考えるモジュールへのアプローチをとった場合にも発生する可能性があります。mozilla.org のスタッフは、開発コミュニティがこのようなモジュールを確認し、解決策を提案して改善策を実施することを望んでいます。何らかの理由で不可能な場合には、mozilla.org のスタッフが可能な限り最善の解決策を見つけ出すために尽力させていただきます。 -

-
-

原文書の情報

-
  • 最終更新日: September 3, 2006 -
  • 著作権: Portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a Creative Commons license | 詳細 -
-
-
-
-{{ languages( { "en": "en/Mozilla_Modules_and_Module_Ownership" } ) }} diff --git a/files/ja/orphaned/tools/add-ons/dom_inspector/dom_inspector_faq/index.html b/files/ja/orphaned/tools/add-ons/dom_inspector/dom_inspector_faq/index.html deleted file mode 100644 index cda0708c4f8257..00000000000000 --- a/files/ja/orphaned/tools/add-ons/dom_inspector/dom_inspector_faq/index.html +++ /dev/null @@ -1,45 +0,0 @@ ---- -title: DOM Inspector FAQ -slug: orphaned/Tools/Add-ons/DOM_Inspector/DOM_Inspector_FAQ -tags: - - DOM_Inspector -translation_of: Tools/Add-ons/DOM_Inspector/DOM_Inspector_FAQ -original_slug: DOM_Inspector_FAQ ---- -
{{ToolsSidebar}}

Web サイトを調べるには?

- -

Inspector の URL バーに URL を入力して Enter キーを押します。あるいは、Inspector の {{ mediawiki.external('ファイル') }} メニューから {{ mediawiki.external('URL を Inspect') }} を選びます。開いている XUL ウィンドウを調べたいのであれば、{{ mediawiki.external('ファイル') }} メニューから {{ mediawiki.external('ウィンドウを Inspect') }} を選びます。

- -

ドキュメントの DOM ノードビューで一部のノードが赤色表示されるのはなぜ?

- -

これらのノードは 無名コンテントノード であり、元のドキュメントによって生成されて DOM にあるものではないのです。

- -

なるほど。では、これらの無名ノードを表示したくない場合はどうすればいいのでしょう?

- -

{{ mediawiki.external('表示') }} メニューの {{ mediawiki.external('無名コンテントを表示') }} からチェックを外せば Inspector の中で無名ノードを隠せます。

- -

元のドキュメントにない空の #text ノードがいっぱいあります。これらは何でしょう? どうして存在して、どうすれば取り除けるのでしょう?

- -

これらのテキストノードは実際は要素間の改行とスペースなのです。どうしてそれらを表示するのかについての長々とした議論は {{ Bug(26179) }} で行われています。

- -

都合の良いことに、{{ mediawiki.external('表示') }} メニューの {{ mediawiki.external('ホワイトスペースノードを表示') }} からチェックを外せば、Inspector の中でこれらの ホワイトスペースノード を隠せます。ただし、すべての空のテキストノードを隠せるわけではありません。連続するホワイトスペースをユーザエージェントがまとめることを CSS の white-space プロパティの値で制限しているノードが隠されることはありません。

- -

DOM ツリー中の特定のノードを探すのが大変です。ツリー中を探す以外にもっと手早くできる方法はありませんか?

- -

ご心配なく。ノード名、ID、あるいは属性と値の組み合わせで検索できます。検索したいドキュメントを調べている Inspector ウィンドウの {{ mediawiki.external('検索') }} メニューから {{ mediawiki.external('ノードを検索') }} を選んで検索条件を入力すればよいのです。

- -

ノードについて何も分かっていないなら、それをクリックして選択してみることもできます。そのノードをビューの中に表示させておいて、{{ mediawiki.external('検索') }} メニューから {{ mediawiki.external('クリックで要素を選択') }} を選び、それから調べたい要素をクリックするのです。

- -
-

原文書の情報

- -
    -
  • 著者: Christopher Aillon
  • -
  • 最終更新日: November 11, 2003
  • -
  • 著作権: Portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a Creative Commons license | 詳細
  • -
-
- -
 
- -

{{ languages( { "en": "en/DOM_Inspector_FAQ" } ) }}

diff --git a/files/ja/orphaned/web/guide/html/html5/introduction_to_html5/index.html b/files/ja/orphaned/web/guide/html/html5/introduction_to_html5/index.html deleted file mode 100644 index c1cdd1d6b5ff61..00000000000000 --- a/files/ja/orphaned/web/guide/html/html5/introduction_to_html5/index.html +++ /dev/null @@ -1,25 +0,0 @@ ---- -title: HTML5 の紹介 -slug: orphaned/Web/Guide/HTML/HTML5/Introduction_to_HTML5 -tags: - - HTML - - HTML5 -translation_of: Web/Guide/HTML/HTML5/Introduction_to_HTML5 -original_slug: Web/Guide/HTML/HTML5/Introduction_to_HTML5 ---- -

HTML5 は、HTML 標準の最も新しいバージョンです。HTML5 によって、リッチメディアのサポートだけでなく、ユーザ、彼らのローカルデータ、サーバの間でより簡単にかつ効果的にやり取りするための Web アプリケーションを作成するための拡張されたサポートを提供するための新機能も手に入れることができます。

- -

HTML5 はまだ策定段階にあるため、現在の仕様に対する変更は当然あり得ます。そのため、すべてのブラウザで HTML5 の機能のすべてがサポートされているわけではありません。ですが、Gecko (そしてその拡張である、Firefox) には、素晴らしいほどに、HTML5 の最初の段階のサポートが含まれており、さらなる機能のサポートに対する取り組みを続けています。Gecko は バージョン1.8.1 から HTML5 の機能をサポートし始めました。HTML5 のメインページに Gecko がサポートしている HTML5 の機能のリストがあります。複数ブラウザのサポート状況の詳細な情報については、CanIUse ウェブサイトを参照してください。

- -

HTML5  の DOCTYPE

- -

HTML5 の DOCTYPE は非常にシンプルです。HTML コンテントで HTML5 を使用することを示すには、単純に以下のようにします:

- -
<!DOCTYPE html>
-
- -

この非常にシンプルな DOCTYPE は、現在 HTML5をサポートしていないブラウザでさえ、HTML の古くから存在する部分に HTML5の規格通りに入り込み、それらがサポートしない HTML5 の新機能を無視することを意味する、標準モードに切り替えます。

- -
-

{{ languages( {"en": "en/HTML/HTML5/Introduction to HTML5", "fr":"fr/HTML/Introduction_à_HTML5", "pt": "pt/HTML/HTML5/Introdução_ao_HTML5"} ) }}

-
From 769890e6719eeba7ac55856233f641e7dba347be Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Tue, 24 May 2022 02:12:00 +0900 Subject: [PATCH 03/17] =?UTF-8?q?2021/11/18=20=E6=99=82=E7=82=B9=E3=81=AE?= =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=90=8C=E6=9C=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/glossary/plugin/index.md | 26 +++++++++++++++----------- 1 file changed, 15 insertions(+), 11 deletions(-) diff --git a/files/ja/glossary/plugin/index.md b/files/ja/glossary/plugin/index.md index 6b9fee3e6cf1c6..c3e71756c358dc 100644 --- a/files/ja/glossary/plugin/index.md +++ b/files/ja/glossary/plugin/index.md @@ -1,14 +1,18 @@ --- -title: Constants +title: Plugin (プラグイン) slug: Glossary/Plugin -translation_of: Plugins/Guide/Constants -translation_of_original: NPAPI/Constants -original_slug: Plugins/Guide/Constants +translation_of: Glossary/Plugin --- -

このセクションはプラグイン API で使用されるプログラム定義のリファレンスです。すべてのプラグイン定義は npapi.h にあります。 -


-

-

エラーコード

- -
コード 説明
NPERR_NO_ERROR 0 エラーは起こりませんでした
NPERR_GENERIC_ERROR 1 特定のエラーコードを持たないエラーが起こりました
NPERR_INVALID_INSTANCE_ERROR 2 プラグインへ無効なインスタンスが渡されました
NPERR_INVALID_FUNCTABLE_ERROR 3 関数表が無効です
NPERR_MODULE_LOAD_FAILED_ERROR 4 プラグインの読み込みに失敗しました
NPERR_OUT_OF_MEMORY_ERROR 5 メモリの割り当てに失敗しました
NPERR_INVALID_PLUGIN_ERROR 6 プラグインが見つからないか無効です
NPERR_INVALID_PLUGIN_DIR_ERROR 7 プラグインディレクトリが見つからないか無効です
NPERR_INCOMPATIBLE_VERSION_ERROR 8 プラグインと Communicator のバージョンが一致しません
NPERR_INVALID_PARAM 9 パラメータが無いか無効です
NPERR_INVALID_URL 10 URL が見つからないか無効です
NPERR_FILE_NOT_FOUND 11 ファイルが見つからないか無効です
NPERR_NO_DATA 12 ストリームにデータが含まれていません
NPERR_STREAM_NOT_SEEKABLE 13 シークできるストリームが期待されます
-{{ languages( { "en": "en/NPAPI/Constants" } ) }} +ブラウザープラグインとは、ブラウザーがネイティブに対応できないコンテンツを扱うために、ユーザーがインストールすることができるソフトウェアコンポーネントのことです。ブラウザープラグインは通常、 [NPAPI](https://en.wikipedia.org/wiki/NPAPI) (Netscape Plugin Application Programming Interface) アーキテクチャを使用して記述されています。 + +最も有名で広く使われていたプラグインは Adobe Flash Player で、これによりブラウザーで {{Glossary("Adobe Flash")}} コンテンツを実行できるようになりました。 + +ブラウザーがより強力になるにつれて、プラグインはあまり有用ではなくなってきました。また、プラグインはウェブユーザーにセキュリティやパフォーマンスの問題を引き起こしてきた歴史があります。 + +2016 年から 2021 年にかけて、ブラウザーベンダーはプラグイン、特に Adobe Flash の廃止ロードマップに取り組み、今日では、プラグインは主要なブラウザーが対応しなくなりました。 + +プラグインはブラウザーの拡張機能と混同してはいけません。こちらはプラグインとは異なり、バイナリーではなくソースコードとして配布され、特に {{Glossary("WebExtensions")}} システムを使用してブラウザーがまだ対応しているものです。 + +## 関連情報 + +- [Adobe Flash 終了アナウンス](https://blog.adobe.com/en/publish/2017/07/25/adobe-flash-update#gs.g8mmgf) From 2089bdf6bc6565e6e5d196baf6c39a9317b1df29 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Tue, 24 May 2022 02:22:16 +0900 Subject: [PATCH 04/17] =?UTF-8?q?2022/04/06=20=E6=99=82=E7=82=B9=E3=81=AE?= =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=90=8C=E6=9C=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/accessibility/faq/index.md | 39 ++++++++++++------------- 1 file changed, 18 insertions(+), 21 deletions(-) diff --git a/files/ja/web/accessibility/faq/index.md b/files/ja/web/accessibility/faq/index.md index ec09baed2112d2..d6fe648dbdffa4 100644 --- a/files/ja/web/accessibility/faq/index.md +++ b/files/ja/web/accessibility/faq/index.md @@ -1,27 +1,24 @@ --- -title: Accessibility FAQ +title: アクセシビリティのよくある質問 slug: Web/Accessibility/FAQ tags: - - Accessibility + - アクセシビリティ + - FAQ translation_of: Web/Accessibility/FAQ original_slug: Web/Accessibility/Accessibility_FAQ --- -

Mozilla のアクセシビリティについて、どこから始めたらよいですか?
-Mozilla Accessibility Project
-


-現在ブラウザでサポートされている組み込みアクセシビリティ機能は何ですか?
-Firefox's Built-in Accessibility Features
-


-どの支援技術が Firefox や Thunderbird をサポートしていますか?
-Assistive Technology Compatibility - Windows, Linux, UNIX, Mac OS X のための支援技術についてのドキュメントと、Firefox 1.5.0.5 以降および Thunderbird 1.5.0.5 以降での互換性。
-


-わたしの Mozilla 拡張機能をアクセシブルにするには何をしたらよいですか?
-一般的には、Accessible Toolkit Checklist を使用します。XUL によるインタフェースデザインについては、XUL accessibility guidelines -{{ mediawiki.external('http://www.mozilla.org/access/xul-guidelines Accessibile XUL Authoring Guidelines') }}をご覧ください。
-


-わたしは、Firefox が提供する良いアクセシビリティ機能の促進を手助けすることに興味があります。どうしたらよいですか?
-Firefox Accessibility Advocates に参加してください。
-

-
-
-{{ languages( { "en": "en/Accessibility_FAQ" } ) }} +## アクセシビリティについて、どこから始めたらよいですか? + +[Mozilla アクセシビリティプロジェクト](/ja/docs/Web/Accessibility) + +## Firefox と Thunderbird に対応している支援技術はどれですか? + +[Assistive Technology Compatibility](https://support.mozilla.org/en-US/kb/Assistive%20technology%20compatibility) - Windows, Linux, UNIX, macOS の支援技術と Firefox の互換性の面に関する記事。 + +## Mozilla 拡張機能をアクセシブルにするには何をしたらよいですか? + +拡張機能が[通常のウェブページのアクセシビリティ原則](/ja/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility)に従っていることを確認してください。 + +## Firefox が提供する良いアクセシビリティ機能の促進を手助けすることに興味があります。どうしたらよいですか? + +[Firefox Accessibility Advocates](http://www.accessfirefox.com/) に参加してください。 From 0a01af0f57987e75a03e450465f46d24e956dd2c Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Tue, 24 May 2022 02:35:07 +0900 Subject: [PATCH 05/17] =?UTF-8?q?2022/01/19=20=E6=99=82=E7=82=B9=E3=81=AE?= =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=90=8C=E6=9C=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/api/event/initevent/index.md | 81 ++++++++++++++--------- 1 file changed, 50 insertions(+), 31 deletions(-) diff --git a/files/ja/web/api/event/initevent/index.md b/files/ja/web/api/event/initevent/index.md index 858bbe38beadcf..0ff411a03a5a95 100644 --- a/files/ja/web/api/event/initevent/index.md +++ b/files/ja/web/api/event/initevent/index.md @@ -1,51 +1,70 @@ --- -title: event.initEvent +title: Event.initEvent() slug: Web/API/Event/initEvent tags: - - DOM - - Gecko + - 非推奨 + - メソッド + - リファレンス +browser-compat: api.Event.initEvent translation_of: Web/API/Event/initEvent --- -

{{ ApiRef() }}{{deprecated_header}}

+{{ ApiRef("DOM") }}{{deprecated_header}} -

概要

+**`Event.initEvent()`** メソッドは、 {{domxref("Document.createEvent()")}} を使用して作成された {{ domxref("event") }} の値を初期化するために使用します。 -

initEvent メソッドは document.createEvent によって作成された event の値を初期化するために使われます。

+この方法で初期化されたイベントは、 {{domxref("Document.createEvent()") }} メソッドで作成されている必要があります。 +このメソッドは {{ domxref("EventTarget.dispatchEvent()") }} を使用してイベントが配信される前に、イベントを設定するために呼び出す必要があります。 +配信されると、もう何もしません。 -
-

このメソッドは廃止されているため、使用しないでください。

+> **Note:** **このメソッドは廃止されているため、使用しないでください。** +> 代わりに、 {{domxref("Event.Event", "Event()")}} のような特定のイベントのコンストラクターを使用してください。[イベントの作成と起動](/ja/docs/Web/Events/Creating_and_triggering_events)のページに、これらの使用方法の詳細が記載されています。 -代わりに、{{domxref("Event.Event", "Event()")}}のような特定のイベントコンストラクターを使用します。 イベントの作成と起動のページに、これらの使用方法の詳細が記載されています。 -
+## 構文 -

構文

+```js +event.initEvent(type, bubbles, cancelable); +``` -
event.initEvent(type,bubbles,cancelable)
-
+### 引数 -
-
type
-
イベントの種類。
-
bubbles
-
イベントチェーンを通じてイベントを浮上させるかどうかを示す真偽値 (bubbles 参照)。
-
cancelable
-
イベントがキャンセル可能かどうかを示す真偽値 (cancelable 参照)。
-
+- _`type`_ + - : 文字列で、イベントの種類を定義します。 +- _`bubbles`_ + - : 論理値で、イベントがイベントチェーンを通じてバブルアップするかどうかを決定します。設定されると、読み取り専用のプロパティ {{ domxref("Event.bubbles") }} がその値を提供します。 +- _`cancelable`_ + - : 論理値で、イベントをキャンセルできるかどうかを定義します。設定されると、読み取り専用のプロパティ {{ domxref("Event.cancelable") }} がその値を提供します。 -

+### 返値 -
// 浮上し、キャンセル不可能なクリックイベントを作成
-event.initEvent("click", true, false);
-
+なし。 -

注意点

+## 例 -

この方法で初期化されるイベントは、document.createEvent メソッドで作成されたものでなければなりません。initEvent によるイベントの設定は、イベントを 割り当てる 前に呼び出す必要があります。

+```js +// イベントを作成 +const event = document.createEvent('Event'); -

仕様書

+// バブルアップしキャンセルできないクリックイベントを +// 作成 +event.initEvent('click', true, false); -

DOM Level 2 Events: Event.initEvent

+// イベントを待ち受けする +elem.addEventListener('click', function (e) { + // e.target matches elem +}, false); -
+elem.dispatchEvent(event); +``` -

{{ languages( { "en": "en/DOM/event.initEvent", "es": "es/DOM/event.initEvent", "fr": "fr/DOM/event.initEvent", "pl": "pl/DOM/event.initEvent" } ) }}

+## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- この非推奨のメソッドの代わりに使用するコンストラクター: + {{domxref("Event.Event", "Event()")}}。より具体的なイベントインターフェイスを作成するには、目的のイベントインターフェイスに対して定義されたコンストラクターを使用します。 From cac75bf7dfe63bafd7c58e532dc2f5e678584026 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Wed, 25 May 2022 01:06:57 +0900 Subject: [PATCH 06/17] =?UTF-8?q?2022/05/25=20=E6=99=82=E7=82=B9=E3=81=AE?= =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=90=8C=E6=9C=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../multiple_items/index.md | 186 ++++++++++++------ 1 file changed, 124 insertions(+), 62 deletions(-) diff --git a/files/ja/web/api/html_drag_and_drop_api/multiple_items/index.md b/files/ja/web/api/html_drag_and_drop_api/multiple_items/index.md index 5a4fded9fe277e..7f9f607c00d512 100644 --- a/files/ja/web/api/html_drag_and_drop_api/multiple_items/index.md +++ b/files/ja/web/api/html_drag_and_drop_api/multiple_items/index.md @@ -1,21 +1,45 @@ --- -title: 複数の項目のドラッグ&ドロップ +title: 複数のアイテムのドラッグ&ドロップ slug: Web/API/HTML_Drag_and_Drop_API/Multiple_items +tags: + - Gecko + - ガイド + - 標準外 + - ドラッグ&ドロップ translation_of: Web/API/HTML_Drag_and_Drop_API/Multiple_items original_slug: DragDrop/Dragging_and_Dropping_Multiple_Items --- -

Mozillaはいくつかの非標準の機能によって、複数の項目のドラッグをサポートしています。それらの機能はtypesプロパティやgetDatasetDataclearDataの各メソッドに酷似していますが、データの取得や変更、削除の際などに項目のインデックスを追加の引数として要求します。

-

mozSetDataAtを使うと、dragstartイベントで複数の項目を登録することができます。これはsetDataメソッドとよく似た働きをします。

-
var dt = event.dataTransfer;
+{{DefaultAPISidebar("HTML Drag and Drop API")}}
+
+> **Warning:** **moz** の接頭辞がついたメソッドやプロパティ(**mozSetDataAt()** など)は Gecko 固有のインターフェイスです。これらのインターフェイスは Gecko ベースのブラウザーで**しか**動作しません。
+
+Mozilla はいくつかの標準外の機能を使用した、複数のアイテムのドラッグができる機能に対応しています。これは {{domxref("DataTransfer.types","types")}} プロパティと、同様に {{domxref("DataTransfer.getData","getData()")}}, {{domxref("DataTransfer.setData","setData()")}}, {{domxref("DataTransfer.clearData","clearData()")}} メソッドを反映したものですが、取得、修正、削除するアイテムの位置を指定する追加の引数を取ります。
+
+この記事で説明するドラッグ処理は、 {{domxref("DataTransfer")}} インターフェイスを利用します.この処理は {{domxref("DataTransferItem")}} インターフェイスおよび {{domxref("DataTransferItemList")}} インターフェイスは使用しません。
+
+## 位置を使用した設定および取得
+
+{{domxref("DataTransfer.mozSetDataAt","mozSetDataAt()")}} メソッドで、 {{domxref("HTMLElement/dragstart_event", "dragstart")}} イベントの間に
+複数のアイテムを追加することができます。これは {{domxref("DataTransfer.setData","setData()")}} と似ています。
+
+```js
+var dt = event.dataTransfer;
 dt.mozSetDataAt("text/plain", "ドラッグされるデータ", 0);
-dt.mozSetDataAt("text/plain", "ドラッグされる2つめのデータ", 1);
-
-

この例では2つのドラッグ項目を追加しています。最後の引数は追加する項目のインデックスを示しています。これらの項目は0番から順番に登録するべきで、最後の方(インデックスの大きなもの)から逆順に登録することはできません。また、すでにデータが登録されているインデックスを指定してもう1度データを登録すると、前に登録したデータを置き換えることができます。インデックスとして0を指定すると、setDataメソッドを呼んだのと等しく扱われます。

-

mozClearDataAtメソッドを使って、指定した項目を削除することもできます。

-
event.dataTransfer.mozClearDataAt("text/plain", 1);
-
-

あるインデックスで示される項目について、最後のデータ形式の削除によって項目全体を削除すると、残りの項目が繰り上がって項目のインデックスが変わることに注意してください。例えば、

-
var dt = event.dataTransfer;
+dt.mozSetDataAt("text/plain", "ドラッグされる 2 つ目のデータ", 1);
+```
+
+この例では 2 つのドラッグアイテムを追加しています。最後の引数は追加するアイテムの位置を示しています。これらのアイテムは 0 番から順番に登録する必要があり、最後の方(位置の大きなもの)から逆順に登録することはできません。また、すでにデータが登録されている位置を指定してもう一度データを登録すると、前に登録したデータを置き換えることができます。位置として 0 を指定すると、 {{domxref("DataTransfer.setData","setData()")}} を呼び出すことと同等になります。
+
+アイテムを削除するには、 {{domxref("DataTransfer.mozClearDataAt","mozClearDataAt()")}} メソッドを使用します。
+
+```js
+event.dataTransfer.mozClearDataAt("text/plain", 1);
+```
+
+注意: ある位置で示されるアイテムについて、最後のデータ形式の削除によってアイテム全体を削除すると、残りのアイテムが繰り上がってアイテムの位置が変わることに注意してください。例えば、次のようのコードを見てください。
+
+```js
+var dt = event.dataTransfer;
 dt.mozSetDataAt("text/uri-list", "URL1", 0);
 dt.mozSetDataAt("text/plain",    "URL1", 0);
 dt.mozSetDataAt("text/uri-list", "URL2", 1);
@@ -25,42 +49,68 @@ dt.mozSetDataAt("text/plain",    "URL3", 2);
 // [item1] data=URL1, index=0
 // [item2] data=URL2, index=1
 // [item3] data=URL3, index=2
-
-

このように2つの形式で提供されたデータを持つ3つの項目を登録した後で、

-
dt.mozClearDataAt("text/uri-list", 1);
+```
+
+このように 2 つの異なる形式による 3 つのアイテムを登録した後で、
+
+```js
+dt.mozClearDataAt("text/uri-list", 1);
 dt.mozClearDataAt("text/plain", 1);
-
-

このように2番目の項目についてすべての形式のデータを削除すると、3番目だった項目が繰り上がって2番目の項目になり、インデックスが2から1に変わります。

-
// [item1] data=URL1, index=0
+```
+
+このように 2 番目のアイテムについてすべての形式のデータを削除すると、 3 番目だったアイテムが繰り上がって 2 番目になり、位置が 2 から 1 に変わります。
+
+```js
+// [item1] data=URL1, index=0
 // [item2] data=URL3, index=1
-
-

幸いなことに、通常は項目を削除する必要がある場合は希で、それよりも、必要に応じて項目を追加するだけの場合の方がずっと多いです。

-

複数の項目のドラッグが使われる場合の代表は、複数のファイルやブックマークをドラッグする時です。この場合には、適切な形式でそれらの項目を追加してください。また必須ではありませんが、それぞれの項目は常に同じ形式でデータを追加するべきです。これによりドロップ対象は、一貫したデータの受け取りを期待できます。

-

複数のファイルがドラッグされているかどうかを確認するには、mozItemCountプロパティを調べます。このプロパティにはドラッグされている項目の数がセットされます。もしそのドロップ対象が1つの項目のドロップだけを受け付ける場合には、ドラッグされた項目すべてを拒否することもできますし、最初の項目だけを受け取ることもできます。複数の項目の受け取りを拒否するには、dragoverイベントをキャンセルしないか、effectAllowedプロパティにnoneを指定します。他のイベントリスナがすでにイベントをキャンセルしている場合に備えて、両方を実行しても構いません。

-

ドロップされた項目のうち最初の項目だけを扱う場合は、1つだけの項目のドラッグの場合と同様にgetDataを使います。これは、何も追加の処理が必要ないドロップ項目を1つだけ受け取るドロップ対象のために有用です。

-

それに対して、任意のインデックスの項目をデータトランスファーから取得するにはmozGetDataAtメソッドを使います。以下の例は、ドラッグされたファイルを取得し、それらを配列に追加するものです。

-
function onDrop(event)
+```
+
+幸いなことに、通常はアイテムを削除する必要がある場合は希で、それよりも、必要に応じてアイテムを追加するだけの場合の方がずっと多いです。
+
+複数のアイテムのドラッグが使われる場合の代表例は、複数のファイルやブックマークをドラッグする時です。この場合には、適切な形式でそれらのアイテムを追加してください。また必須ではありませんが、それぞれのアイテムは常に同じ形式でデータを追加するべきです。これによりドロップ対象は、一貫したデータの受け取りを期待できます。
+
+複数のファイルがドラッグされているかどうかを確認するには、 {{domxref("DataTransfer.mozItemCount","mozItemCount")}} プロパティを調べます。このプロパティにはドラッグされているアイテムの数がセットされます。もしそのドロップ先が 1 つのアイテムのドロップだけを受け付ける場合には、ドラッグされたアイテムすべてを拒否することもできますし、最初のアイテムだけを受け取ることもできます。複数のアイテムの受け取りを拒否するには、 {{domxref("HTMLElement/dragover_event", "dragover")}} イベントをキャンセルしないか、 {{domxref("DataTransfer.effectAllowed","effectAllowed")}} プロパティに `none` を指定します。他のイベントリスナーがすでにイベントをキャンセルしている場合に備えて、両方を実行しても構いません。
+
+ドロップされたアイテムのうち最初のアイテムだけを扱う場合は、 1 つだけのアイテムのドラッグの場合と同様に {{domxref("DataTransfer.getData","getData()")}} を使います。これは、何も追加の処理が必要ないドロップアイテムを1つだけ受け取るドロップ対象のために有用です。
+
+それに対して、任意の位置のアイテムをデータトランスファーから取得するには {{domxref("DataTransfer.mozGetDataAt","mozGetDataAt()")}} メソッドを使います。以下の例は、ドラッグされたファイルを取得し、それらを配列に追加するものです。
+
+```js
+function onDrop(event)
 {
   var files = [];
   var dt = event.dataTransfer;
-  for (var i = 0; i < dt.mozItemCount; i++)
+  for (var i = 0; i < dt.mozItemCount; i++)
     files.push(dt.mozGetDataAt("application/x-moz-file", i));
 }
-
-

mozTypesAtメソッドを使って、望んでいる形式のデータが存在しているかどうかを確かめたいとも思うでしょう。typesプロパティと同様に、このメソッドは、その項目が保持しているデータの型の文字列を返します。typesプロパティを取得する事は、インデックスが0の項目の型のリストを取得する事に等しいです。

-
var types = event.dataTransfer.mozTypesAt(1);
-
-

文字列でないデータのドラッグ

-

上で解説した追加のメソッドが扱えるデータは文字列に限定されず、どんな種類のデータでも指定することができます。例えば、ファイルはapplication/x-moz-file型でnsIFileのオブジェクトとして保持されてドラッグされます。setDataメソッドは文字列しかサポートしておらず、 ドラッグするファイルを指定するのには利用できないため、代わりにmozSetDataAtメソッドを使わなくてはなりません。

-
dt.mozSetDataAt("application/x-moz-file", file, 0);
-
-

複数の項目を扱う必要がない場合でも、このメソッドを使うことによって任意のオブジェクトをデータに指定できます。この場合には、インデックスとして0を指定しておきます。

-

同様に、ファイルやその他のオブジェクトを取得するにはmozGetDataAtメソッドを使う必要があります。もしgetDataを使った場合は、値が文字列でない型のデータは空文字として取得されます。ただし、数値のような単純な型のデータについては文字列に変換できるため、この場合はgetDataを使っても問題ありません。

-

複数項目のドロップの例

-

以下は、ドロップされた項目のデータとその形式を一覧表示するボックスの例です。

-
<html>
-<head>
-<script>
+```
+
+{{domxref("DataTransfer.mozTypesAt","mozTypesAt")}} メソッドを使って、望んでいる形式のデータが存在しているかどうかを確かめたくなるかもしれません。 {{domxref("DataTransfer.types","types")}} プロパティと同様に、このメソッドは、そのアイテムが保持しているデータの型の文字列を返します。 {{domxref("DataTransfer.types","types")}} プロパティを取得する事は、位置が 0 のアイテムの型のリストを取得する事に等しくなります。
+
+```js
+var types = event.dataTransfer.mozTypesAt(1);
+```
+
+## 文字列でないデータのドラッグ
+
+上で解説した追加のメソッドが扱えるデータは文字列に限定されず、どんな種類のデータでも指定することができます。例えば、ファイルは [application/x-moz-file](/ja/docs/Web/API/HTML_Drag_and_Drop_API/Recommended_drag_types#file) 型で `nsIFile` のオブジェクトとして保持されてドラッグされます。 {{domxref("DataTransfer.setData","setData()")}} メソッドは文字列しか対応しておらず、 ドラッグするファイルを指定するのには利用できないため、代わりに {{domxref("DataTransfer.mozSetDataAt","mozSetDataAt()")}} メソッドを使わなくてはなりません。
+
+```js
+dt.mozSetDataAt("application/x-moz-file", file, 0);
+```
+
+複数のアイテムを扱う必要がない場合でも、このメソッドを使うことによって任意のオブジェクトをデータに指定できます。この場合には、位置として 0 を指定しておきます。
+
+同様に、ファイルやその他のオブジェクトを取得するには {{domxref("DataTransfer.mozGetDataAt","mozGetDataAt()")}} メソッドを使う必要があります。もし {{domxref("DataTransfer.getData","getData()")}} を使った場合は、値が文字列でない型のデータは空文字として取得されます。ただし、数値のような単純な型のデータについては文字列に変換できるため、この場合は {{domxref("DataTransfer.getData","getData()")}} を使っても問題ありません。
+
+## 複数アイテムのドロップの例
+
+次の例では、ドロップしたアイテムとフォーマットのリストが表示されるボックスが用意されています。
+
+```html
+
+
+
+
+
+
+
+ +
+ + Fix
+
+ + + +``` +この例では、 {{domxref("HTMLElement/dragenter_event", "dragenter")}} と `{{domxref("HTMLElement/dragover_event", "dragover")}}` の両イベントを {{domxref("Event.preventDefault","preventDefault()")}} メソッドでキャンセルします。これにより、要素の上でのドロップが可能になっています。 + +アイテムをドロップした時に、 `dodrop` イベントハンドラーが呼び出されます。この関数は {{domxref("DataTransfer.mozItemCount","mozItemCount")}} プロパティを見て、いくつのアイテムがドロップされたのかを調べ、それらに繰り返し処理を行います。それぞれのアイテムについて、型の一覧を得るために {{domxref("DataTransfer.mozTypesAt","mozTypesAt")}} メソッドが呼ばれます。この一覧の生成処理は、ドラッグに対して関連づけられたすべてのデータに対して繰り返されます。 + +この例は、あるドラッグ操作が保持しているデータを確かめたい時に便利です。ただアイテムをこの例のドロップ対象にドロップするだけで、ドラッグされたどのアイテムがどんな形式でどのようなデータを保持しているのかを見ることができます。 + +## 関連情報 + +- [HTML ドラッグ&ドロップ API (概要)](/ja/docs/Web/API/HTML_Drag_and_Drop_API) +- [ドラッグ操作](/ja/docs/Web/API/HTML_Drag_and_Drop_API/Drag_operations) +- [推奨されるドラッグ型](/ja/docs/Web/API/HTML_Drag_and_Drop_API/Recommended_drag_types) +- [HTML5 Living Standard: Drag and Drop](https://html.spec.whatwg.org/multipage/interaction.html#dnd) From 0e73708459366f84b2b5d2925be7279f5c1df4f0 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Wed, 25 May 2022 01:13:35 +0900 Subject: [PATCH 07/17] =?UTF-8?q?2022/04/05=20=E6=99=82=E7=82=B9=E3=81=AE?= =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=90=8C=E6=9C=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/api/range/collapsed/index.md | 57 +++++++++++++++-------- 1 file changed, 37 insertions(+), 20 deletions(-) diff --git a/files/ja/web/api/range/collapsed/index.md b/files/ja/web/api/range/collapsed/index.md index 772aab50f591f9..16aa47418679da 100644 --- a/files/ja/web/api/range/collapsed/index.md +++ b/files/ja/web/api/range/collapsed/index.md @@ -1,27 +1,44 @@ --- -title: range.collapsed +title: Range.collapsed slug: Web/API/Range/collapsed tags: + - API - DOM - - Gecko - - Gecko DOM Reference + - DOM リファレンス + - プロパティ + - Range + - リファレンス +browser-compat: api.Range.collapsed translation_of: Web/API/Range/collapsed --- -

{{ ApiRef() }}

-

Summary

-

range の始点と終点が同じ位置にあるか、boolean値を返します。

-

Syntax

-
isCollapsed = range.collapsed;
-
-

Example

-
range = document.createRange();
-range.setStart(startNode,startOffset);
-range.setEnd(endNode,endOffset);
+{{ APIRef("DOM") }}
+
+**`Range.collapsed`** は読み取り専用プロパティで、 {{domxref("Range")}} の開始点と終了点が同じ位置にあるかどうかを示す論理型フラグを返します。 {{domxref("Range")}} の開始境界点と終了境界点が DOM 上で同じ位置であれば `true` を、そうでなければ `false` を返します。
+
+折りたたまれた {{domxref("Range")}} は空であり(内容を含まない)、 DOM ツリー内の 1 つの点を指定します。範囲を折りたたむには、 {{domxref("Range.collapse()")}} メソッドを参照してください。
+
+## 値
+
+論理値。
+
+## 例
+
+```js
+let range = document.createRange();
+
+range.setStart(startNode, startOffset);
+range.setEnd(endNode, endOffset);
 isCollapsed = range.collapsed;
-
-

Notes

-

range の始点と終点が DOM において同じ点にあるとき、true を返し、そうでないとき false を返します。

-

折り畳まれた range は空で、内容を含まず、DOM tree 内の1点を示しています。collapsed プロパティは読取専用です。range の折り畳みについては、 collapse メソッドを参照してください。

-

Specification

-

collapsed

-

{{ languages( { "en": "en/DOM/range.collapsed", "es": "es/DOM/range.collapsed" } ) }}

+``` + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- [DOM インターフェイス索引](/ja/docs/Web/API/Document_Object_Model) From c7626c2d0ebedee9c9814eb5550ea60364c22615 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Wed, 25 May 2022 01:16:24 +0900 Subject: [PATCH 08/17] =?UTF-8?q?2022/04/30=20=E6=99=82=E7=82=B9=E3=81=AE?= =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=90=8C=E6=9C=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../api/xsltprocessor/browser_differences/index.md | 13 ++++--------- 1 file changed, 4 insertions(+), 9 deletions(-) diff --git a/files/ja/web/api/xsltprocessor/browser_differences/index.md b/files/ja/web/api/xsltprocessor/browser_differences/index.md index eb3fe9d6c9f953..a7030b25ba5ed6 100644 --- a/files/ja/web/api/xsltprocessor/browser_differences/index.md +++ b/files/ja/web/api/xsltprocessor/browser_differences/index.md @@ -1,13 +1,8 @@ --- -title: Browser Differences +title: ブラウザー間の違い slug: Web/API/XSLTProcessor/Browser_Differences translation_of: Web/API/XSLTProcessor/Browser_Differences --- -

-

-

ブラウザの違い

-

Netscape 7.x (すべてのプラットフォーム) と Internet Explorer 6 (Windows) は W3C XSLT 1.0 標準 (http://www.w3.org/TR/xslt) をサポートしています。IE 5.0 および 5.5 (共に Windows) は XSLT のワーキングドラフトのみがサポートされているため、XSLT 1.0 スタイルシートとの互換性はありません。Netscape 6.x は XSLT 1.0 が部分的にサポートされています。 -

-
-
-{{ languages( { "en": "en/XSLT_in_Gecko/Browser_Differences", "fr": "fr/XSLT_dans_Gecko/Diff\u00e9rences_entre_les_navigateurs", "ko": "ko/XSLT_in_Gecko/Browser_Differences" } ) }} +## ブラウザー間の違い + +Netscape 7.x (全プラットフォーム)と Internet Explorer 6 (Windows) は W3C XSLT 1.0 標準 ([http://www.w3.org/TR/xslt](https://www.w3.org/TR/xslt/)) に対応しています。 IE 5.0 および 5.5 (共に Windows)は XSLT の草稿のみに対応しているため、 XSLT 1.0 スタイルシートとの互換性はありません。Netscape 6.x は XSLT 1.0 に部分的に対応しています。 From aaa869713bf59e3281662023be167865b46c5d2d Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Wed, 25 May 2022 01:26:55 +0900 Subject: [PATCH 09/17] =?UTF-8?q?2022/04/07=20=E6=99=82=E7=82=B9=E3=81=AE?= =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=90=8C=E6=9C=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../xsltprocessor/generating_html/index.md | 354 +++++++++--------- 1 file changed, 181 insertions(+), 173 deletions(-) diff --git a/files/ja/web/api/xsltprocessor/generating_html/index.md b/files/ja/web/api/xsltprocessor/generating_html/index.md index 5dd0bc1f01a501..e95f878efbe9b4 100644 --- a/files/ja/web/api/xsltprocessor/generating_html/index.md +++ b/files/ja/web/api/xsltprocessor/generating_html/index.md @@ -1,178 +1,186 @@ --- -title: Generating HTML +title: HTML の生成 slug: Web/API/XSLTProcessor/Generating_HTML translation_of: Web/API/XSLTProcessor/Generating_HTML --- -

-

-

HTML を生成する

-

ブラウザ内の XSLT の共通アプリケーションの一つは、クライアント上で XML を HTML へと変換することです。二つ目の例は、前回と同様の記事についての情報を含むドキュメント (example2.xml) を入力し、HTML ドキュメントへ変換します。 -

今回は、記事の <body> 要素は HTML 要素 (図 2 では <b> タグと <u> タグ) を含みます。XML ドキュメントは HTML 要素と XML 要素の両方を含みますが、一つの名前空間、つまり XML 要素のための名前空間のみが必要です。これには HTML 名前空間が無く、XHTML 名前空間を使用すると HTML ドキュメントのように振舞わない XML ドキュメントを XSL に生成させてしまうため、XSL スタイルシート内の xsl:output によって結果のドキュメントが HTML として扱われるようにします。XML 要素については、私たちの独自の名前空間 http://devedge.netscape.com/2002/de と、それによって与えられる myNS プレフィックス (xmlns:myNS="http://devedge.netscape.com/2002/de") が必要です。 -

図 2 XML ファイル :(example2.xml)view example | view source -XML Document (example2.xml): -

-
<?xml version="1.0"?>
-<?xml-stylesheet type="text/xsl" href="example2.xsl"?>
-  <myNS:Article xmlns:myNS="http://devedge.netscape.com/2002/de">
-    <myNS:Title>My Article</myNS:Title>
-    <myNS:Authors>
-      <myNS:Author company="Foopy Corp.">Mr. Foo</myNS:Author>
-      <myNS:Author>Mr. Bar</myNS:Author>
-    </myNS:Authors>
-    <myNS:Body>
-      The <b>rain</b> in <u>Spain</u> stays mainly in the plains.
-    </myNS:Body>
-  </myNS:Article>
-
-

XSL スタイルシートは二つの名前空間を持つ必要があります。一つは XSLT 要素、もう一つは私たちの独自の XML 要素を XML ドキュメント内で使用するためのものです。XSL スタイルシートの出力は、xsl:output 要素を使用して HTML に設定します。出力を HTML に設定すると結果的に要素 (青色の部分) が名前空間を持たないため、これらの要素は HTML 要素とみなされます。 -

図 3 : 二つの名前空間をもつ XSL スタイルシート (example2.xsl) -XSL Stylesheet (example2.xsl): -

-
  <?xml version="1.0"?>
-  <xsl:stylesheet version="1.0"
-                           xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
-                           xmlns:myNS="http://devedge.netscape.com/2002/de">
-
-    <xsl:output method="html"/>
-    ...
-  </xsl:stylesheet version="1.0">
-
-

XML ドキュメントのルートノードに一致するテンプレートは、基本的な HTML ページの構造を生成するために作成し、使用されます。 -

図 4 : 基本的な HTML ドキュメントの生成 -XSL スタイルシート (example2.xsl): -

-
  ...
-  <xsl:template match="/">
-  <html>
-
-    <head>
-
-      <title>
-        <xsl:value-of select="/myNS:Article/myNS:Title"/>
-      </title>
-
-      <style type="text/css">
-        .myBox {margin:10px 155px 0 50px; border: 1px dotted #639ACE; padding:0 5px 0 5px;}
-      </style>
-
-    </head>
-
-    <body>
-      <p class="myBox">
-        <span class="title">
-          <xsl:value-of select="/myNS:Article/myNS:Title"/>
-        </span> </br>
-
-        Authors:   <br />
-          <xsl:apply-templates select="/myNS:Article/myNS:Authors/myNS:Author"/>
-      </p>
-
-      <p class="myBox">
-        <xsl:apply-templates select="//myNS:Body"/>
-      </p>
-
-    </body>
-
-  </html>
-  </xsl:template>
-  ...
-
-

例を完成するには、さらに三つの xsl:template が必要です。最初の xsl:template は、二番目のテンプレートが body ノードを処理する間、author ノードに使用されます。三番目のテンプレートは、任意のノードや任意の属性に対応する一般的な対応規則を持っています。これは XML ドキュメント内で、HTML 要素のすべてに対応し、変換生成される HTML ドキュメントにコピーする要素を予約しておくために必要です。 -

図 5 : 最終的な三つのテンプレート -XSL Stylesheet(example2.xsl): -

-
  ...
-  <xsl:template match="myNS:Author">
-     --   <xsl:value-of select="." />
-
-    <xsl:if test="@company">
-     ::   <b>  <xsl:value-of select="@company" />  </b>
-    </xsl:if>
-
-    <br />
-  </xsl:template>
-
-  <xsl:template match="myNS:Body">
-    <xsl:copy>
-      <xsl:apply-templates select="@*|node()"/>
-    </xsl:copy>
-  </xsl:template>
-
-  <xsl:template match="@*|node()">
-    <xsl:copy>
-      <xsl:apply-templates select="@*|node()"/>
-    </xsl:copy>
-  </xsl:template>
+## HTML の生成
+
+ブラウザー内の XSLT のよくあるアプリケーションの一つは、クライアント上で XML を HTML へと変換することです。二つ目の例は、前回と同様の記事についての情報を含む文書 (example2.xml) を入力し、HTML 文書へ変換します。
+
+記事の `` 要素は HTML 要素(図 2 では `` タグと `` タグ)を含みます。XML 文書は HTML 要素と XML 要素の両方を含みますが、一つの名前空間、つまり XML 要素のための名前空間のみが必要です。これには HTML 名前空間が無く、XHTML 名前空間を使用すると HTML 文書のように振舞わない XML 文書を XSL に生成させてしまうため、XSL スタイルシート内の `xsl:output` によって結果の文書が HTML として扱われるようにします。XML 要素については、私たちの独自の名前空間 [`http://devedge.netscape.com/2002/de`](http://devedge.netscape.com/2002/de) と、それによって与えられる myNS 接頭辞 `(xmlns:myNS="http://devedge.netscape.com/2002/de")` が必要です。
+
+**図 2 XML ファイル :(example2.xml)**
+
+```xml
+
+
+  
+    My Article
+    
+      Mr. Foo
+      Mr. Bar
+    
+    
+      The rain in Spain stays mainly in the plains.
+    
+  
+```
+
+XSL スタイルシートは二つの名前空間を持つ必要があります。一つは XSLT 要素、もう一つは私たちの独自の XML 要素を XML 文書内で使用するためのものです。XSL スタイルシートの出力は、`xsl:output` 要素を使用して `HTML` に設定します。出力を HTML に設定すると結果的に要素 (青色の部分) が名前空間を持たないため、これらの要素は HTML 要素とみなされます。
+
+**図 3 : 二つの名前空間をもつ XSL スタイルシート** (example2.xsl)
+
+```xml
+
+
+
+  
   ...
-
-

最終的な XSLT スタイルシートは次のようになります: -

図 6 : 最終的な XSLT スタイルシートview example | view source -XSL Stylesheet: -

-
  <?xml version="1.0"?>
-  <xsl:stylesheet version="1.0"
-                           xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
-                           xmlns:myNS="http://devedge.netscape.com/2002/de">
-
-    <xsl:output method="html" />
-
-    <xsl:template match="/">
-      <html>
-
-        <head>
-
-          <title>
-            <xsl:value-of select="/myNS:Article/myNS:Title"/>
-          </title>
-
-          <style type="text/css">
-            .myBox {margin:10px 155px 0 50px; border: 1px dotted #639ACE; padding:0 5px 0 5px;}
-          </style>
-
-        </head>
-
-        <body>
-          <p class="myBox">
-            <span class="title">
-              <xsl:value-of select="/myNS:Article/myNS:Title"/>
-            </span> <br />
-
-            Authors:   <br />
-              <xsl:apply-templates select="/myNS:Article/myNS:Authors/myNS:Author"/>
-            </p>
-
-          <p class="myBox">
-            <xsl:apply-templates select="//myNS:Body"/>
-          </p>
-
-        </body>
-
-      </html>
-    </xsl:template>
-
-    <xsl:template match="myNS:Author">
-       --   <xsl:value-of select="." />
-
-      <xsl:if test="@company">
-       ::   <b>  <xsl:value-of select="@company" />  </b>
-      </xsl:if>
-
-      <br />
-    </xsl:template>
-
-    <xsl:template match="myNS:Body">
-      <xsl:copy>
-        <xsl:apply-templates select="@*|node()"/>
-      </xsl:copy>
-    </xsl:template>
-
-    <xsl:template match="@*|node()">
-        <xsl:copy>
-          <xsl:apply-templates select="@*|node()"/>
-        </xsl:copy>
-    </xsl:template>
-  </xsl:stylesheet>
-
-
-
-{{ languages( { "en": "en/XSLT_in_Gecko/Generating_HTML", "fr": "fr/XSLT_dans_Gecko/G\u00e9n\u00e9ration_de_HTML", "ko": "ko/XSLT_in_Gecko/Generating_HTML" } ) }} + +``` + +XML 文書のルートノードに一致するテンプレートは、基本的な HTML ページの構造を生成するために作成し、使用されます。 + +**図 4 : 基本的な HTML 文書の生成** + +```xml +... + + + + + + + <xsl:value-of select="/myNS:Article/myNS:Title"/> + + + + + + + +

+ + +
+ + Authors:
+ +

+ +

+ +

+ + + + +
+... +``` + +例を完成するには、さらに三つの `xsl:template` が必要です。最初の `xsl:template` は、二番目のテンプレートが body ノードを処理する間、author ノードに使用されます。三番目のテンプレートは、任意のノードや任意の属性に対応する一般的な対応規則を持っています。これは XML 文書内で、HTML 要素のすべてに対応し、変換生成される HTML 文書にコピーする要素を予約しておくために必要です。 + +**図 5 : 最終的な三つのテンプレート** + +```xml +... + + -- + + + :: + + +
+
+``` + +```xml + + + + + + + + + + + +... +``` + +最終的な XSLT スタイルシートは次のようになります。 + +**図 6 : 最終的な XSLT スタイルシート** + +```xml + + + + + + + + + + + + <xsl:value-of select="/myNS:Article/myNS:Title"/> + + + + + + + +

+ + +
+ + Authors:
+ +

+ +

+ +

+ + + + +
+ + + -- + + + :: + + +
+
+ + + + + + + + + + + + +
+``` From 6890d0570abab64d71efe1b11e8b2624f0463035 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Wed, 25 May 2022 01:57:45 +0900 Subject: [PATCH 10/17] =?UTF-8?q?2022/05/25=20=E6=99=82=E7=82=B9=E3=81=AE?= =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=90=8C=E6=9C=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../api/xsltprocessor/introduction/index.md | 22 +++++++++---------- 1 file changed, 10 insertions(+), 12 deletions(-) diff --git a/files/ja/web/api/xsltprocessor/introduction/index.md b/files/ja/web/api/xsltprocessor/introduction/index.md index 353bcad2bc5f67..fc6d33e78df6d4 100644 --- a/files/ja/web/api/xsltprocessor/introduction/index.md +++ b/files/ja/web/api/xsltprocessor/introduction/index.md @@ -1,16 +1,14 @@ --- -title: Introduction +title: 序文 slug: Web/API/XSLTProcessor/Introduction translation_of: Web/API/XSLTProcessor/Introduction --- -

-

-

序文

-

W3C 標準で気付かされる流行の一つは、スタイルからコンテンツを分ける努力がなされていることです。これにより、同じスタイルを複数のコンテンツで再利用することができ、簡単なメンテナンスでコンテンツの外観を (一つのファイルの修正のみで) すばやく変更することができます。 -

CSS (Cascade Style Sheets) は W3C によって最初に提唱された方法の一つでした。CSS は簡単な方法でスタイル規則を Web ドキュメントに適用します。これらのスタイル規則は、ドキュメント(その中のコンテンツ) のレイアウトを定義します。しかしながら、プログラミング構造や複雑なレイアウトモデルの作成能力に欠陥があるなどいくつかの制限があります。CSS はまた、要素の配置の変更のサポートも制限されています。 -

XSL (Extensible Stylesheet Language) 変換は二つの部分で構成されています: XML ツリーを他のマークアップツリーおよび XPath へ変換可能にする XSL 要素、ツリーのための選択言語。XSLT は XML ドキュメント(そのコンテンツ) を取得し、XSL スタイルシートの規則によって新しいドキュメントを生成します。XSLT によって、オリジナルの XML ドキュメントから要素を追加、削除、再構成することができるため、結果的にドキュメント構造をより細かく制御することができます。 -

XSLT による変換は、テンプレートからなる規則を基にしています。各テンプレート (XPath を使用) は入力する XML ドキュメントの断片に一致すると、新しいドキュメントを生成するため、テンプレートをその断片の代わりとなる部分に適用します。 -

-
-
-{{ languages( { "en": "en/XSLT_in_Gecko/Introduction", "ko": "ko/XSLT_in_Gecko/Introduction" } ) }} +## 序文 + +W3C 標準で気付かされる流行の一つは、スタイルからコンテンツを分ける努力がなされていることです。これにより、同じスタイルを複数のコンテンツで再利用することができ、簡単なメンテナンスでコンテンツの外観を (一つのファイルの修正のみで) すばやく変更することができます。 + +CSS (Cascade Style Sheets) は W3C によって最初に提唱された方法の一つでした。CSS は簡単な方法でスタイルルールをウェブ文書に適用します。これらのスタイルルールは、文書(その中のコンテンツ)のレイアウトを定義します。しかしながら、プログラミング構造や複雑なレイアウトモデルの作成能力に欠陥があるなどいくつかの制限があります。CSS はまた、要素の配置の変更のサポートも制限されています。 + +XSL (Extensible Stylesheet Language) 変換は二つの部分で構成されています。 XML ツリーを他のマークアップツリーおよび XPath へ変換可能にする XSL 要素、ツリーのための選択言語。XSLT は XML 文書(そのコンテンツ)を取得し、XSL スタイルシートの規則によって新しい文書を生成します。XSLT によって、オリジナルの XML 文書から要素を追加、削除、再構成することができるため、結果的に文書構造をより細かく制御することができます。 + +XSLT による変換は、テンプレートからなる規則を基にしています。各テンプレート (XPath を使用) は入力する XML 文書の断片に一致すると、新しい文書を生成するため、テンプレートをその断片の代わりとなる部分に適用します。 From 786b5e8aea7bb4cfbd16deb2800ab06ab95b6b32 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Wed, 25 May 2022 23:27:22 +0900 Subject: [PATCH 11/17] =?UTF-8?q?2022/05/02=20=E6=99=82=E7=82=B9=E3=81=AE?= =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=90=8C=E6=9C=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/exslt/index.md | 207 ++++++++++++++++-------------------- 1 file changed, 89 insertions(+), 118 deletions(-) diff --git a/files/ja/web/exslt/index.md b/files/ja/web/exslt/index.md index 9c651b702c7136..75d3c9ddd10540 100644 --- a/files/ja/web/exslt/index.md +++ b/files/ja/web/exslt/index.md @@ -3,152 +3,123 @@ title: EXSLT slug: Web/EXSLT tags: - EXSLT - - XSLT - - XSLT_Reference + - Landing translation_of: Web/EXSLT --- -

{{XSLTRef}}

+EXSLT は [XSLT](/ja/docs/Web/XSLT) に対する一連の拡張機能です。いくつものモジュールがあります。 Firefox が対応しているものは以下の通りです。 -
- -{{QuickLinksWithSubpages("/ja/docs/EXSLT")}}
- - - -

EXSLTは XSLTの拡張です. 幾つかのモジュールがある。Firefox にサポートされているものを以下に示す:

- -
-
Common (exsl)
-
基本的な拡張要素と関数。
-
Math (math)
-
ノード比較ルーチン。
-
Regular expressions (regexp)
-
JavaScriptスタイル正規表現を扱う。
-
Sets (set)
-
集合操作ルーチン。
-
Strings (str)
-
文字列操作関数。
-
- -

EXSLT使用方法

+{{SubpagesWithSummaries}} -

EXSLT拡張を使用するためには、スタイルシートに拡張名前空間として名前空間を宣言する必要があります。 例)正規表現パッケージの使用:

+## EXSLT モジュール -
<xsl:stylesheet version="1.0"
-                xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
-                xmlns:regexp="http://exslt.org/regular-expressions"
-                extension-element-prefixes="regexp">
+EXSLT関数を使用するには、その関数が属する名前空間を宣言し、関数を呼び出す際に適切な接頭辞を使用する必要があります。例えば、正規表現パッケージを使用する場合は次のようにします。
 
-<xsl:import href="regexp.xsl" />
+```xml
+
+  
+    ...
+    
+    ...
+  
 
-...
+
+```
 
-</xsl:stylesheet>
-
+### 共通 -

Common

+EXSLT Common パッケージは、 XSLT の機能を拡張する基本的な関数を提供します。 Common パッケージの名前空間は `http://exslt.org/common` です。 -

 EXSLT CommonパッケージはXSLTの機能に関わる基本関数を提供します。Commonパッケージの名前空間は http://exslt.org/common.

+#### 関数 -

Functions

+- [`exsl:node-set()`](/ja/docs/Web/EXSLT/exsl/node-set) +- [`exsl:object-type()`](/ja/docs/Web/EXSLT/exsl/object-type) - +### Math -

Math

+EXSLT の Math パッケージは、数値を扱ったり、ノードを比較したりするための関数を提供します。 Math パッケージの名前空間は `http://exslt.org/math` です。 -

EXSLT Mathパッケージは数値とノード比較に関わる関数を提供する。Mathパッケージの名前空間は http://exslt.org/math.

+#### 関数 -

Functions

+- [`math:highest()`](/ja/docs/Web/EXSLT/math/highest) +- [`math:lowest()`](/ja/docs/Web/EXSLT/math/lowest) +- [`math:max()`](/ja/docs/Web/EXSLT/math/max) +- [`math:min()`](/ja/docs/Web/EXSLT/math/min) - +### 正規表現 -

Regular expressions

+EXSLT 正規表現パッケージは、JavaScript スタイルの正規表現を使って、テキストのテスト、照合、置換ができる関数を提供します。 -

EXSLT Regular ExpressionsパッケージはJavaScriptスタイルの正規表現を使った、 検査(test)、検索(match)、および置換(replace)を行う関数を提供する。

+EXSLT 正規表現の名前空間は、`http://exslt.org/regular-expressions` です。 -

Regular Expressionsの名前空間は http://exslt.org/regular-expressions.

+#### 関数 -

Functions

+- [`regexp:match()`](/ja/docs/Web/EXSLT/regexp/match) +- [`regexp:replace()`](/ja/docs/Web/EXSLT/regexp/replace) +- [`regexp:test()`](/ja/docs/Web/EXSLT/regexp/test) - +### セット -

Sets

+EXSLT セットパッケージは、集合の操作ができる関数を提供します。これらの関数の名前空間は `http://exslt.org/sets` です。 -

EXSLT Setsパッケージは集合操作関数を提供する。Setsパッケージの名前空間は

+#### 関数 -
http://exslt.org/sets.
-
+- [`set:difference()`](/ja/docs/Web/EXSLT/set/difference) +- [`set:distinct()`](/ja/docs/Web/EXSLT/set/distinct) +- [`set:intersection()`](/ja/docs/Web/EXSLT/set/intersection) +- [`set:has-same-node()`](/ja/docs/Web/EXSLT/set/has-same-node) +- [`set:leading()`](/ja/docs/Web/EXSLT/set/leading) +- [`set:trailing()`](/ja/docs/Web/EXSLT/set/trailing) -

Functions

+### 文字列 - +EXSLT 文字列パッケージは、文字列の操作ができる関数を提供します。文字列パッケージの名前空間は `http://exslt.org/strings` です。 -

Strings

+#### 関数 -

EXSLT Stringsパッケージは文字列操作関数を提供する。 Stringsパッケージの名前空間はhttp://exslt.org/sets.

+- [`str:concat()`](/ja/docs/Web/EXSLT/str/concat) +- [`str:split()`](/ja/docs/Web/EXSLT/str/split) +- [`str:tokenize()`](/ja/docs/Web/EXSLT/str/tokenize) -

Functions

+## 関連情報 - +- [EXSLT ウェブサイト](http://exslt.org/) -

Functions

- - - -

See also

- - - -

</div>

- -

{{ languages( { "en": "en/EXSLT", "es": "es/EXSLT", "fr": "fr/EXSLT", "pl": "pl/EXSLT" } ) }}

+ From 500182cbbca518e7e7d37e44151bf5086d458548 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Wed, 25 May 2022 23:36:58 +0900 Subject: [PATCH 12/17] =?UTF-8?q?2022/04/27=20=E6=99=82=E7=82=B9=E3=81=AE?= =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=90=8C=E6=9C=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/exslt/exsl/node-set/index.md | 56 +++++++++++------------ 1 file changed, 27 insertions(+), 29 deletions(-) diff --git a/files/ja/web/exslt/exsl/node-set/index.md b/files/ja/web/exslt/exsl/node-set/index.md index 486c78fd3796e2..6ee405ca8113b7 100644 --- a/files/ja/web/exslt/exsl/node-set/index.md +++ b/files/ja/web/exslt/exsl/node-set/index.md @@ -1,35 +1,33 @@ --- -title: node-set +title: exsl:node-set() slug: Web/EXSLT/exsl/node-set tags: - EXSLT - - XSLT - - XSLT_Reference + - NeedsSpecTable + - リファレンス translation_of: Web/EXSLT/exsl/node-set --- -

-{{ XsltRef() }} -


-exsl:node-set()は、xsl:variableの値を取得するための選択属性の代わりに、xsl:variableを見た時に得られる返却ツリー・フラグメントからノードセットを返します。これにより、変数内に生成されたXMLを複数ステップで処理させることができる。 -

また、文字列をテキストノードに変換するためにexsl:node-set()を使うことができます。 -

-

Syntax

-
exsl:node-set(object)
-
-

Arguments

-
object -
対応するノードセットを返却するためのオブジェクト -
-

Returns

-

指定されたobjectに対応するノードセット -

-

Defined

-

EXSLT - EXSL:NODE-SET -

-

Gecko support

-

Gecko 1.9およびそれ以降でサポートされる。 -


-

-
-
-{{ languages( { "en": "en/EXSLT/exsl/node-set", "es": "es/EXSLT/exsl/node-set", "fr": "fr/EXSLT/exsl/node-set" } ) }} +{{XSLTRef}}{{QuickLinksWithSubpages("/ja/docs/Web/EXSLT")}} + +`exsl:node-set()` は結果木の断片からノードセットを返します。これは、変数の値を取得するために select 属性ではなく `xsl:variable` を見たときに得られるものです。これにより、変数内に作成された XML を複数のステップで処理することができます。 + +また、`exsl:node-set()` を使って、文字列をテキストノードにすることができます。 + +## 構文 + +``` +exsl:node-set(object) +``` + +### 引数 + +- `object` + - : 対応するノードセットを返す対象となるオブジェクト。 + +### 返値 + +指定された `object` に対応するノードセットです。 + +## 仕様書 + +[EXSLT - EXSL:NODE-SET](http://exslt.org/exsl/functions/node-set/index.html) From ae47cb30da44c0d3254b551d0e82e74671192295 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Wed, 25 May 2022 23:59:24 +0900 Subject: [PATCH 13/17] =?UTF-8?q?2022/02/18=20=E6=99=82=E7=82=B9=E3=81=AE?= =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=90=8C=E6=9C=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../index.md | 182 +++++++++++------- 1 file changed, 117 insertions(+), 65 deletions(-) diff --git a/files/ja/web/guide/writing_forward-compatible_websites/index.md b/files/ja/web/guide/writing_forward-compatible_websites/index.md index 61e42582bde241..3df46e6ab23353 100644 --- a/files/ja/web/guide/writing_forward-compatible_websites/index.md +++ b/files/ja/web/guide/writing_forward-compatible_websites/index.md @@ -1,82 +1,134 @@ --- -title: Writing forward-compatible websites +title: 前方互換性のあるウェブサイトを書く slug: Web/Guide/Writing_forward-compatible_websites tags: - CSS - - Compatibility + - 互換性 - DOM - HTML - JavaScript - - Web Development + - ウェブ開発 translation_of: Web/Guide/Writing_forward-compatible_websites original_slug: Web_Development/Writing_forward-compatible_websites --- -

このページでは、新しいバージョンのブラウザが公開されても壊れることのない Web サイトを記述する方法を説明します。
-
- これはイントラネットや公衆向けでない Web サイトで特に重要です。私たちがあなたのコードを見ることができないので、それが壊れていることを確認できないのです。これらのすべてに従うことができない場合もありますが、可能な限り多くの事項に従うことで、Web サイトを将来にわたって有用な状態にすることの助けになります。

-

JavaScript

-

onfoo 属性でグローバル変数へアクセスする際に "window." 接頭辞を付加する

-

HTML の要素でイベントハンドラのコンテンツ属性 (onclickonmouseover など) が使用されているとき、それら属性でのすべての名前探索は始めに要素自身、次にフォームコントロール要素の場合はそのフォーム、そして document、さらに (あなたがグローバル変数を定義した) window の順に行われます。例えば、以下のマークアップがある場合は:

-
<div onclick="alert(ownerDocument)">Click me</div>
-
-

文字列をクリックすると divownerDocument をアラートで表示します。これは、var ownerDocument がグローバルスコープで宣言されている場合でも動作します。

-

これが意味することは、イベントハンドラのコンテンツ属性でグローバル変数にアクセスするときやグローバルに宣言された任意の関数を呼び出すとき、あなたの関数や変数と同じ名前の新たな DOM プロパティが仕様書で要素やドキュメントに追加され、またそれをブラウザが実装した場合に、常に名前が衝突した時点で探索が終わってしまいます。これが起きると、突如関数が呼び出されなくなります。この現象は HTML5 の進展に伴い、さまざまなサイトで何度も発生しています。

-

これを防ぐには、以下のように "window." を用いてグローバル変数にアクセスするのが最適です:

-
<script>
+このページでは、新しいバージョンのブラウザーーが公開されても壊れることのないウェブサイトを記述する方法を説明します。
+
+これはイントラネットや公衆向けでないウェブサイトで特に重要です。私たちがコードを見ることができないので、それが壊れていることを確認できないのです。これらのすべてに従うことができない場合もありますが、できる限り多くの事項に従うことで、ウェブサイトを将来にわたって有用な状態にすることの助けになります。
+
+## JavaScript
+
+### `onfoo` 属性でグローバル変数へアクセスする際に "`window`." 接頭辞を付加する
+
+HTML の要素でイベントハンドラーのコンテンツ属性(`onclick`、 `onmouseover` など)が使用されているとき、それら属性でのすべての名前探索は始めに要素自身、次にフォームコントロール要素の場合はそのフォーム、そして document、さらに(あなたがグローバル変数を定義した) window の順に行われます。例えば、以下のマークアップがあるとします。
+
+```html
+
Click me
+``` + +文字列をクリックすると `div` の `ownerDocument` をアラートで表示します。これは、`var ownerDocument` がグローバルスコープで宣言されている場合でも動作します。 + +つまり、イベントハンドラーのコンテンツ属性でグローバル変数にアクセスする場合、グローバルに宣言された関数を呼び出す場合も含めて、その関数や変数と同じ名前の新しい DOM プロパティが要素や文書に追加され、ブラウザーーがそれを実装すると、名前の衝突が発生する可能性があるということです。そうすると、突然、関数が呼び出されなくなるのです。このようなことは、 HTML5 の進化の過程で、すでにさまざまなサイトで何度も起こっています。 + +これを防ぐには、以下のように "window." を用いてグローバル変数にアクセスしてください。 + +```html + +
Clicking me should show an alert
+``` + +### 自身で管理しないスクリプトを連結しない + +ファイルレベルで使用される ECMAScript の `"use strict;"` ディレクティブは、ファイル全体に適用されます。このため、厳格モードでない動作に依存するスクリプトを厳格モードのスクリプトに付加すると、スクリプトが動作しなくなります。 + +### 使用する JavaScript ライブラリーの作者に、上記のガイドラインに従っているかを確認する + +お気に入りのライブラリーの開発者にも、このガイドラインに従うように提案してみてください。そうしないと、将来そのライブラリーが壊れないかどうか当てにならないからです。残念ながら、ライブラリーはこのガイドラインに違反することが多いのです。 + +## 検出 + +### 特定の機能の検出 + +ある機能を用いようとするとき、可能であればその機能を見つけるためにオブジェクト検出を行ってください。簡単な例として、`body.style` に `"filter"` があるかのテストが真になるブラウザーは必ず Microsoft Internet Explorer であり、それゆえ例えばイベントハンドラーで `window.event` オブジェクトが利用できるとは考えないでください。また、ある一定の DOM 機能に対応しているブラウザーが、他の機能、特に非標準の DOM 機能にも対応しているとは考えないでください。あるいは逆に、他の機能に対応*しない*とも考えないでください。例えば、script 要素での `onload` に対応するブラウザーは `onreadystatechange` に対応しないと考えてはいけません。各ブラウザーの動作が収束することにより、機能は追加や削除されます。また、不具合の修正も行います。これら 3 点は過去に発生しており、また今後も発生するでしょう。 + +従ってある機能の存在有無と別の機能の存在有無に関連はありませんので、ある機能やオブジェクトの検出結果から別のことを予測しないでください。 + +### UA 検出を行わない + +これはある機能(ユーザエージェント (UA) 文字列内に特定の文字列が含まれていること)が別の機能の有無を暗に示すと考えられている、特に一般的な実例です。 + +#### UA 検出が必要な場合は、過去のブラウザーのバージョンにのみ行う + +UA 検出に頼る必要がある場合は、特定のブラウザーの過去のバージョンに対して用いてください。始めに、未知のブラウザーおよびあなたがテストで用いているブラウザーの現行バージョンと将来のバージョン向けの既定のコードパスがあります。そして、既定のコードパスが特定のブラウザーの過去のバージョンで動作せず、またそのコードパスで機能の欠落を検出することで問題点を発見できないときは、該当する過去のバージョンのブラウザーを検出することでそのブラウザー向けのハックを追加してかまいません。 + +この提案において、「現行」とはテストを行った最新のバージョンのブラウザーを指します。例えば既定のコードパスが Firefox Aurora で適切に動作するが、Firefox Beta や最新の release 版では不具合があるためにコードが動作しない場合は、テストを行った Aurora の Firefox バージョン番号を「現行」とみなし、一般向けに公開されていないものであっても Beta のバージョンを「過去」のバージョンと考えてください。 + +### 異なるブラウザー向けに分離したコードパスはむやみに作成しない + +関係のあるコードパスの一つがすべてのブラウザーで正しく動作するのに、わざわざオブジェクト検出や UA 検出に基づいて異なるコードを実行することは行わないでください。各ブラウザーの動作がお互い収束するように変更され、そのために代替のコードパスを設定していたあなたのサイトが正常に動作しなくなってしまう可能性があります。 + +## テストの実施 + +### すべての主要なエンジンについてテストを行う + +コードは少なくとも Firefox、Chrome、Safari、Opera、Internet Explorer でテストを行ってください。すべての現行ブラウザーや未知のブラウザー向けに単一のコードパスを持つためこの提案に従えば、そのコードパスがすべての主要なエンジンで動作することをテストすることで、コードが将来にわたって動作する可能性がとても高くなります。 + +各ブラウザーがある機能を若干異なる形で実装していることがあります。主要なエンジンすべてで動作する単一のコードパスが得られた場合は、使用している機能の動作は各ブラウザー間で既に収束していることを意味します。一方、各ブラウザーの動作が完全には収束していない場合は、どのエンジンの標準動作を支持するかが判明することに関係なくコードが動作します。 + +## ブラウザー独自の機能や接頭辞 + +### 現行あるいは将来のバージョンのブラウザーを目標にするハックを行わない + +これは、現在ある不具合間の相関関係が将来の不具合間の相関関係を暗に示すと考えられている一般的な事例です。現行バージョンでは解決している不具合に関するハックを、過去のバージョンのブラウザーに対して適用することは問題ありません。ブラウザーが不具合 X を修正すると、不具合 X が存在するリリースすべてには不具合 Y もあることが確実にわかり、不具合 X が存在することを不具合 Y の回避策の適用基準として用いることができます。 + +この提案において、前出の UA 検出でのアドバイスのように "現行" とはあなたがテストを行った最新のバージョンのブラウザーを指します。 + +### 最新の非標準機能に依存することを避ける + +接頭辞ありの機能であっても、それを使用することは危険です。仕様書の進展に伴い、ブラウザーの接頭辞ありの実装が仕様書に追随して変更されることがあります。またその機能が標準化されると、接頭辞ありのバージョンは削除されるでしょう。 + +接頭辞が付加された非標準の機能は、実験やフィードバックを行うためにブラウザーの開発者が提供しているものであり、一般に展開することを意味していません。これらの機能を使うことを選択した場合は、機能の変更に伴って頻繁にサイトの更新が必要であることを覚悟してください。 + +### (標準化されていても) 広く実装されていない最新機能を用いる際は縮退処理のテストを行う + +用いている機能を実装していないブラウザー でどう動作するか(そのようなブラウザーをウェブサイトの業務で日常使用していない場合は特に)、必ずテストを行ってください。 + +### ベンダー接頭辞が付加されている機能は、過去のバグが多いバージョンを目的とする場合を除き使用しない + +ベンダー接頭辞が付加されている機能は、その動作が将来変更されるかもしれません。ブラウザーがある機能を接頭辞なしで公開しても、利用可能であれば接頭辞なし版を常に使用するようにすることで、過去のリリース向けに接頭辞あり版を使用することができます。良い例として、`make-it-pretty` プロパティの `"sometimes"` 値について接頭辞あり版とは異なる動作を接頭辞なし版に実装して公開した、 CSS の `-vnd` 接頭辞を用いるブラウザーベンダー向けの記述を示します。 + +```html + +``` + +上記の例で、ルール中の宣言の順番は重要です。接頭辞のないものは、最後に置くことが必要です。 + +### 少なくとも一つのブラウザーがサポートするまで、接頭辞のない CSS プロパティや API は使用しない + +何らかの機能について接頭辞なし版がある程度広くサポートされるまでは、その動作が突然変更されることがあります。特に、実際に接頭辞なし版に対応しているブラウザーがない機能は使用しないでください。接頭辞あり版の文法と完成版の文法が同じであると考えてはいけません。 + +## 良好なコード + +### `>` の欠落を防ぐ + +検証ツールを用いることがこれを確実にする方法の一つですが、あなたのウェブサイト全体を検証しないとしてもすべての `>` 文字が置かれていることを確認してください。 `>` が欠落していると、後ろのタグの名前が前のタグの属性であると判断されて予期せぬ状況に陥る場合があります。これはしばらくの間は動作するかもしれませんが、仕様書でその属性に意味が与えられると動作しなくなります。以下の例は HTML5 に対応しないブラウザーでは動作しますが、HTML5 に対応するブラウザーでは動作しません。 + +```html +
+ +``` + +これは `input` タグで `>` が欠落しているためです。 + +### コード中で動作しない実験的な部分は残さない + +何か行いたいことがあって CSS プロパティを使用してみたが効果がなかった場合、そのプロパティは削除してください。将来、予期しない動作が発生する可能性があります。 From e3643cca95d6690b41176e7950a36e3c990a1d3f Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Thu, 26 May 2022 00:44:09 +0900 Subject: [PATCH 14/17] =?UTF-8?q?2022/05/17=20=E6=99=82=E7=82=B9=E3=81=AE?= =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=90=8C=E6=9C=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/svg/scripting/index.md | 95 ++++++++++++++++++----------- 1 file changed, 60 insertions(+), 35 deletions(-) diff --git a/files/ja/web/svg/scripting/index.md b/files/ja/web/svg/scripting/index.md index 37f369f7ca6c64..1d2abcffc4ebfb 100644 --- a/files/ja/web/svg/scripting/index.md +++ b/files/ja/web/svg/scripting/index.md @@ -2,20 +2,27 @@ title: スクリプティング slug: Web/SVG/Scripting tags: + - グラフィック - SVG + - スクリプト + - default + - eventListeners + - preventing + - setProperty translation_of: Web/SVG/Scripting --- -

-

-

イベントコードの初期挙動を防ぐ

-

ドラッグ・アンド・ドロップのコードを書いていると、時々、ページのテキストをドラッグ中に誤って付随的に選択されてしまうことがあります。 -もしくは自分のコードの中でバックスペースキーを使いたい場合、バックスペースキーを押下したときに前のページへ戻る、ブラウザの既定の振る舞いを上書きしたいと望むでしょう。ブラウザが前のページに戻るのを防ぎたいと望むでしょう。 -このような場合、evt.preventDefault() メソッドを使うことが出来ます。 -

-

オブジェクトに eventListeners を使う

-

対話的な SVG を書くとき、addEventListener()removeEventListener() メソッドはとても便利です。これらのメソッドの二番目のパラメータとして、handleEvent インタフェースを実装するオブジェクトを渡すことができます。 -

-
function myRect(x,y,w,h,message){
+ブラウザーの既定の動作を `evt.preventDefault( )` メソッドで上書きしたり、イベントリスナーを `element.addEventListener(event, function, useCapture)` という構文でオブジェクトに追加したり、要素のプロパティを `svgElement.style.setProperty("fill-opacity", "0.0", "")` などで設定することが可能です。 3 つの引数がすべてプロパティを設定していることに注意してください。
+
+### イベントコードの既定の挙動を防ぐ
+
+ドラッグ&ドロップのコードを書いていると、ページのテキストをドラッグ中に誤って付随的に選択してしまうことがあります。もしくは自分のコードの中でバックスペースキーを使いたい場合、バックスペースキーを押下したときに前のページへ戻るという、ブラウザーの既定の振る舞いを上書きしたくなるでしょう。このようなことは、 `evt.preventDefault()` メソッドで実現することができます。
+
+### オブジェクトに `eventListener` を使う
+
+`addEventListener()` や `removeEventListener()` は、対話的な SVG を書くときとても勇湯王です。これらのメソッドの第二引数として、 `handleEvent` インターフェイスを実装するオブジェクトを渡すことができます。
+
+```js
+function myRect(x, y, w, h, message) {
   this.message=message
 
   this.rect=document.createElementNS("http://www.w3.org/2000/svg","rect")
@@ -29,30 +36,48 @@ translation_of: Web/SVG/Scripting
 
   this.handleEvent= function(evt){
     switch (evt.type){
-     case "click":
+    case "click":
       alert(this.message)
       break;
-     }
     }
-   }
-
-

文書間のスクリプティング - 埋め込み SVG の参照

-

HTML 内で SVG を使う場合、Adobe SVG Viewer 3.0 は自動的に SVG 文書を示す svgDocument<code> と呼ばれるウィンドウプロパティをインクルードします。これは Mozilla のネイティヴ実装には当てはまりません。従って Mozilla では <code>window.svgDocument は動きません。代わりに埋め込まれた SVG ドキュメントを参照するために var svgDoc=document.embeds{{ mediawiki.external('\"name_of_svg\"') }}.getSVGDocument(); を代替使用することができます。 -

また、document.getElementById("svg_elem_name").getSVGDocument() を使用して同じ結果を得ることもできます。 -

-

文書間のスクリプティング - JavaScript 関数の呼びだし

-

HTML ドキュメントに埋め込まれた SVG ファイルから HTML ファイルの中にある JavaScript 関数を呼び出すとき、その関数を参照するには parent.functionname() を使うべきです。Adobe SVG Viewer プラグインは functionname() の利用を許可していますが、このようなことを行うには適していません。 -

-
-

注意: SVG wiki によると Adobe の SVG バージョン 6 プレビュープラグインでは "parent" JavaScript 変数は壊れているとのことです。提案された次善策は parent の代わりに top を使うことです。 -

-
-

更なる情報といくつかの例を SVG wiki inter-document scripting page で見付けることが出来ます。 -

-

setProperty は3つのパラメタを持ちます

-

Mozilla では svgElement.style.setProperty("fill-opacity", "0.0") 関数は SYNTAX ERR という DOMException を投げます。この挙動は W3C によって DOM Level 2 Style 仕様の中で定められています。setProperty 関数は 3 つのパラメタを持つ関数として定義されています。上記は 'svgElement.style.setProperty("fill-opacity", "0.0", "")' で置き換えられます。こちらの方がより標準に一致しています。 -

-

リンク

-

SVG ホームページ -

SVG wiki on Scripting and Programming -

{{ languages( { "en": "en/SVG/Scripting" } ) }} + } +} +``` + +## 文書間のスクリプティング - 埋め込み SVG の参照 + +HTML 内で SVG を使用する場合、Adobe の SVG Viewer 3.0 は自動的に `svgDocument` という SVG 文書を指すウィンドウのプロパティを含みます。これは、Mozilla のネイティブ SVG 実装には当てはまりません。したがって、 `window.svgDocument` を使用しても Mozilla ではうまくいきません。その代わりに、 + +```js +var svgDoc=document.embeds["name_of_svg"].getSVGDocument(); +``` + +を使用して埋め込まれた SVG 文書の参照を取得することができます。 + +SVG 文書を表す {{domxref("Document")}} にアクセスするには、以下のように {{domxref("HTMLIFrameElement.contentDocument")}} (文書が {{HTMLElement("iframe")}} で表現されている場合)または {{domxref("HTMLObjectElement.contentDocument")}} (文書が {{HTMLElement("object")}} 要素で表現されている場合)に注目するとよいでしょう。 + +```js +var svgDoc = document.getElementById("iframe_element").contentDocument; +``` + +さらに、{{HTMLElement("iframe")}}, {{HTMLElement("embed")}}, {{HTMLElement("object")}} の各要素は `getSVGDocument()` というメソッドを提供しており、要素の埋め込み SVG を表す {{domxref("XMLDocument")}} または要素が SVG 文書を表さない場合には `null` を返します。 + +また、 `document.getElementById("svg_elem_name").getSVGDocument()` を用いても同じ結果を得ることができます。 + +> **Note:** `SVGDocument` インターフェイスに言及しているドキュメントを見かけることがあります。 SVG 2 より前は、 SVG 文書はこのインターフェイスを使って表現されていました。しかし、現在では SVG 文書は代わりに {{domxref("XMLDocument")}} インターフェイスを用いて表現されています。 + +### 文書をまたがるスクリプティング - JavaScript 関数の呼び出し + +HTML 文書に埋め込まれた SVG ファイルから HTML ファイルの中にある JavaScript 関数を呼び出すとき、その関数を参照するには `parent.functionname()` を使うべきです。Adobe SVG Viewer プラグインは `functionname()` の利用を許可していますが、このようなことを行うには適していません。 + +> **Note:** [SVG wiki](https://web.archive.org/web/20100223210744/http://wiki.svg.org/Inter-Document_Communication) によると、 JavaScript の変数 `"parent"` は Adobe の SVG バージョン 6 プレビュープラグインでは壊れているとのことです。回避策として、`"parent"`の代わりに`"top"`を使用することが提案されています。このプラグインはベータ版なので、おそらく無視しても大丈夫でしょう。 + +更なる情報といくつかの例は [SVG wiki inter-document scripting page](https://web.archive.org/web/20100223210744/http://wiki.svg.org/Inter-Document_Communication) で見つかります。 + +### `setProperty` には 3 つの引数がある + +`svgElement.style.setProperty("fill-opacity", "0.0")` と関数を呼び出すと、 Mozilla では DOMException が `SYNTAX ERR` で発生します。この挙動は W3C によって DOM Level 2 Style 仕様の中で定められています。 `setProperty` 関数は 3 つの引数を持つ関数として定義されています。上記のものは、 `'svgElement.style.setProperty("fill-opacity", "0.0", "")'` で置き換えることができ、これが標準に準拠しています。 + +### リンク + +[SVG wiki on Scripting and Programming](https://web.archive.org/web/20100212202713/http://wiki.svg.org/Main_Page#Scripting_and_Programming) From fb4673bfbb935d785fdcae17e84c59dccb7a3a53 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Thu, 26 May 2022 01:25:03 +0900 Subject: [PATCH 15/17] =?UTF-8?q?2022/02/04=20=E6=99=82=E7=82=B9=E3=81=AE?= =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=90=8C=E6=9C=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ja/web/svg/tutorial/basic_shapes/index.md | 219 ++++++++++++------ 1 file changed, 147 insertions(+), 72 deletions(-) diff --git a/files/ja/web/svg/tutorial/basic_shapes/index.md b/files/ja/web/svg/tutorial/basic_shapes/index.md index 9ad6201924ce90..a08f42fd490980 100644 --- a/files/ja/web/svg/tutorial/basic_shapes/index.md +++ b/files/ja/web/svg/tutorial/basic_shapes/index.md @@ -1,76 +1,151 @@ --- -title: Basic Shapes +title: 基本的な図形 slug: Web/SVG/Tutorial/Basic_Shapes +tags: + - 初心者 + - SVG + - SVG:チュートリアル translation_of: Web/SVG/Tutorial/Basic_Shapes --- -

{{ PreviousNext("SVG/Tutorial/Positions", "SVG/Tutorial/Paths") }}

-

ほとんどの SVG 描画では、数種類の基本的な図形が使われます。それら図形の用途は、その名前からかなり明確です。図形の位置やサイズを指定する属性をいくつか示しますが、要素リファレンスにはここで網羅しない他のプロパティも含めて正確で完全な説明があるでしょう。しかし、それらはほとんどの SVG ドキュメントで用いられますので、何らかの形で紹介することが必要でしょう。

-

基本的な図形

-

図形を挿入するには、ドキュメント内に要素を作成します。さまざまな要素が各々さまざまな図形に対応づけられ、また各属性が図形のサイズや位置を定義します。一部の要素は他の図形で作成できるという点でやや冗長ですが、それらすべては利便性およびドキュメントをできるだけ小さくかつ読みやすくするために存在します。すべての基本的な図形を右図に示しています。これらを生成するコードは以下のとおりです:

-

-
<?xml version="1.0" standalone="no"?>
-<svg width="200" height="250" version="1.1" xmlns="http://www.w3.org/2000/svg">
-
-  <rect x="10" y="10" width="30" height="30" stroke="black" fill="transparent" stroke-width="5"/>
-  <rect x="60" y="10" rx="10" ry="10" width="30" height="30" stroke="black" fill="transparent" stroke-width="5"/>
-
-  <circle cx="25" cy="75" r="20" stroke="red" fill="transparent" stroke-width="5"/>
-  <ellipse cx="75" cy="75" rx="20" ry="5" stroke="red" fill="transparent" stroke-width="5"/>
-
-  <line x1="10" x2="50" y1="110" y2="150" stroke="orange" fill="transparent" stroke-width="5"/>
-  <polyline points="60 110 65 120 70 115 75 130 80 125 85 140 90 135 95 150 100 145"
-      stroke="orange" fill="transparent" stroke-width="5"/>
-
-  <polygon points="50 160 55 180 70 180 60 190 65 205 50 195 35 205 40 190 30 180 45 180"
-      stroke="green" fill="transparent" stroke-width="5"/>
-
-  <path d="M20,230 Q40,205 50,230 T90,230" fill="none" stroke="blue" stroke-width="5"/>
-</svg>
-
-
注意: strokestroke-width および fill の各属性は後のチュートリアルで説明します。
-

長方形

-

rect 要素は、おそらくあなたの予想とまったく同じで、スクリーンに長方形を描画します。この要素にはスクリーン上の位置や形状を操作する、6 種類の基本的な属性があります。前出の画像には 2 つの rect 要素があり、それは少し冗長になっています。右側の長方形は rx および ry 属性があり、これは角を丸くします。これらを設定しない場合、初期値は 0 になります。

-
 <rect x="10" y="10" width="30" height="30"/>
- <rect x="60" y="10" rx="10" ry="10" width="30" height="30"/>
-
-
x
長方形の左上の角の位置を示す、X 座標です。
y
長方形の左上の角の位置を示す、Y 座標です。
width
長方形の幅です。
height
長方形の高さです。
rx
長方形の角の、X 軸方向の半径です。
ry
長方形の角の、Y 軸方向の半径です。
-
-

-

おそらくあなたの推測どおりで、circle 要素はスクリーンに円を描画します。ここで適用できる属性は 3 種類です。

-
 <circle cx="25" cy="75" r="20"/>
-
-
r
円の半径です。
cx
円の中心の位置を示す、X 座標です。
cy
円の中心の位置を示す、Y 座標です。
-
-

楕円

-

ellipse は、実は circle 要素のより一般的な形であり、円の X 方向および Y 方向の半径 (数学者は一般的に長半径および短半径と呼びます) を分けて調節することができます。

-
 <ellipse cx="75" cy="75" rx="20" ry="5"/>
-
-
rx
楕円の X 軸方向の半径です。
ry
楕円の Y 軸方向の半径です。
cx
楕円の中心の位置を示す、X 座標です。
cy
楕円の中心の座標を示す、Y 座標です。
-
-

直線

-

line は直線を描画します。これは線の始点と終点になる 2 つの点を示す属性を持ちます。

-
 <line x1="10" x2="50" y1="110" y2="150"/>
-
-
x1
点 1 の X 座標です。
y1
点 1 の Y 座標です。
x2
点 2 の X 座標です。
y2
点 2 の Y 座標です。
-
-

ポリライン

-

polyline は、連結された直線のグループです。リストがとても長くなるため、すべての点は 1 つの属性に収められます:

-
 <polyline points="60 110, 65 120, 70 115, 75 130, 80 125, 85 140, 90 135, 95 150, 100 145"/>
-
-
points
点のリストで、各々の数値は空白、カンマ、EOL、またはラインフィード文字で区切ります。各々の点は X 座標と Y 座標の 2 つの値を持たなければなりません。従って (0,0), (1,1) (2,2) のリストはこのように記述します: "0 0, 1 1, 2 2"。
-
-

多角形

-

polygon は、点のリストを結ぶ直線の断片を連結して構成される点がポリラインとよく似ています。しかし polygon では、終端で線のパスが自動的に最初の点に戻ることで、閉じた図形を作成します。長方形は多角形の一種であるので、より柔軟性が必要である場合は <rect/> 要素を作成するために polygon を用いることができることに留意してください。

-
 <polygon points="50 160, 55 180, 70 180, 60 190, 65 205, 50 195, 35 205, 40 190, 30 180, 45 180"/>
-
-
points
点のリストで、各々の数値は空白、カンマ、EOL、またはラインフィード文字で区切ります。各々の点は X 座標と Y 座標の 2 つの値を持たなければなりません。従って (0,0), (1,1) (2,2) のリストはこのように記述します: "0 0, 1 1, 2 2"。パスを閉じるように描画するため、最後の直線は (2,2) から (0,0) に描画されます。
-
-

パス

-

path は SVG で使用できる図形の中でもっとも一般的なものでしょう。path 要素を用いて長方形 (角を丸めることもできます)、円、楕円、ポリライン、多角形を描画することができます。基本的には他の図形、ベジェ曲線、二次曲線などのいずれかになります。以上の理由からパスについてはこのチュートリアルの次のセクションに独立していますが、 ここではその図形をコントロールするただ一つの属性があることを示します。

-
 <path d="M 20 230 Q 40 205, 50 230 T 90230"/>
-
-
d
点のリストと、パスの描画方法に関する情報です。詳しくは Paths をご覧ください。
-
-

{{ PreviousNext("SVG/Tutorial/Positions", "SVG/Tutorial/Paths") }}

-

Interwiki Languages Links

-

{{ languages( { "en": "en/SVG/Tutorial/Basic_Shapes", "fr": "fr/SVG/Tutoriel/Formes_de_Bases"} ) }}

+{{ PreviousNext("Web/SVG/Tutorial/Positions", "Web/SVG/Tutorial/Paths") }} + +ほとんどの SVG の描画に使われる基本的な図形がいくつかあります。これらの図形の目的は、その名前からかなり明白です。それらの位置や大きさを決定する引数のいくつかが与えられていますが、要素のリファレンスにはおそらくより正確で完全な説明と、ここでは取り上げない他のプロパティが含まれているでしょう。しかし、これらはほとんどの SVG 文書で使用されるため、ある種の紹介をする必要があります。 + +図形を挿入するには、文書内に要素を作成します。さまざまな要素が各々さまざまな図形に対応づけられ、また各属性が図形のサイズや位置を定義します。一部の要素は他の図形で作成できるという点でやや冗長ですが、それらすべては利便性および文書をできるだけ小さくかつ読みやすくするために存在します。すべての基本的な図形を右図に示しています。これらを生成するコードは以下のとおりです。 + +![](shapes.png) + +この画像を生成するコードは、次のようなものです。 + +```xml + + + + + + + + + + + + + + + + +``` + +> **Note:** `stroke`, `stroke-width`, `fill` の各属性は、後のチュートリアルで説明します。 + +### 長方形 + +{{SVGElement("rect")}} 要素は画面に長方形を描画します。画面上の長方形の位置や形状を操作する、 6 種類の基本的な属性があります。右側の長方形は `rx` および `ry` 属性があり、これは角を丸くしています。これらを設定しない場合、初期値は `0` になります。 + +```xml + + +``` + +- `x` + - : 長方形の左上の角の位置を示す、X 座標です。 +- `y` + - : 長方形の左上の角の位置を示す、Y 座標です。 +- `width` + - : 長方形の幅です。 +- `height` + - : 長方形の高さです。 +- `rx` + - : 長方形の角の、X 軸方向の半径です。 +- `ry` + - : 長方形の角の、Y 軸方向の半径です。 + +### 円 + +{{SVGElement("circle")}} 要素は画面に円を描画します。 3 種類の引数を取り、この要素の形状や大きさを指定します。 + +```xml + +``` + +- `r` + - : 円の半径です。 +- `cx` + - : 円の中心の位置を示す、X 座標です。 +- `cy` + - : 円の中心の位置を示す、Y 座標です。 + +### 楕円 + +{{SVGElement("ellipse")}} は {{SVGElement("circle")}} のより一般的な形で、円の X 方向および Y 方向の半径(数学者は一般的に長半径および短半径と呼びます)を個別に指定することができます。 + +```xml + +``` + +- `rx` + - : 楕円の X 軸方向の半径です。 +- `ry` + - : 楕円の Y 軸方向の半径です。 +- `cx` + - : 楕円の中心の位置を示す、X 座標です。 +- `cy` + - : 楕円の中心の座標を示す、Y 座標です。 + +### 直線 + +{{SVGElement("line")}} 要素は、 2 つの点を引数として取り、それらの間に直線を引きます。 + +```xml + +``` + +- `x1` + - : 点 1 の X 座標です。 +- `y1` + - : 点 1 の Y 座標です。 +- `x2` + - : 点 2 の X 座標です。 +- `y2` + - : 点 2 の Y 座標です。 + +## 連続線 + +{{SVGElement("polyline")}} は、接続された直線のグループです。点のリストは非常に長くなるので、すべての点が 1 つの属性に含まれます。 + +```xml + +``` + +- `points` + - : 点のリスト。それぞれの数値は、空白、カンマ、EOL、改行文字で区切る必要があります。それぞれの点は、 x 座標と y 座標の 2 つの数値を含む必要があります。つまり、リスト `(0,0)`, `(1,1)`, `(2,2)` は、 `0, 0 1, 1 2, 2` と記述されることになります。 + +## 多角形 + +{{SVGElement("polygon")}} は {{SVGElement("polyline")}} と似ており、点のリストを結ぶ直線で構成されています。しかし、多角形の場合、パスは自動的に最後の点と最初の点を結び、閉じた形状を作成します。 + +> **Note:** 長方形は多角形の一種ですので、もう少し柔軟性が必要な場合には、多角形を使って `` 要素を作成することができます。 + +```xml + +``` + +- `points` + - : 点のリストで、それぞれの数値は、空白、カンマ、EOL、改行文字で区切られています。各点は、 x 座標と y 座標の 2 つの数値を含む必要があります。したがって、リスト `(0,0)`, `(1,1)`, `(2,2)` は、 `0, 0 1, 1 2, 2` と記述することになります。そして、描画はパスを閉じるので、最終的には `(2,2)` から `(0,0)` までの直線が描かれることになります。 + +## パス + +{{SVGElement("path")}} は SVG で使用できる最も一般的な図形です。 `path` 要素を用いると、矩形(角丸の有無は問わない)、円、楕円、ポリライン、多角形を描くことができます。基本的には他の種類の形状、ベジェ曲線、二次曲線、その他多くの形状を描くことができます。 + +このため、パスについてはこのチュートリアルの[次の章](/ja/docs/Web/SVG/Tutorial/Paths)に独立していますが、 ここではその図形をコントロールするただ一つの属性があることを示します。 + +```xml + +``` + +- `d` + - : 点のリストと、パスの描画方法に関する情報です。詳しくは[パス](/ja/docs/Web/SVG/Tutorial/Paths)の節を参照してください。 + +{{ PreviousNext("Web/SVG/Tutorial/Positions", "Web/SVG/Tutorial/Paths") }} From 32321c077d0f59dd052c398bb14acc0ef3cdb151 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Thu, 26 May 2022 01:38:38 +0900 Subject: [PATCH 16/17] =?UTF-8?q?2022/02/18=20=E6=99=82=E7=82=B9=E3=81=AE?= =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=90=8C=E6=9C=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../web/svg/tutorial/filter_effects/index.md | 164 ++++++++++++++++-- 1 file changed, 154 insertions(+), 10 deletions(-) diff --git a/files/ja/web/svg/tutorial/filter_effects/index.md b/files/ja/web/svg/tutorial/filter_effects/index.md index 39d1cadb74fa18..7eca3d04c83351 100644 --- a/files/ja/web/svg/tutorial/filter_effects/index.md +++ b/files/ja/web/svg/tutorial/filter_effects/index.md @@ -1,16 +1,160 @@ --- -title: Filter effects +title: フィルター効果 slug: Web/SVG/Tutorial/Filter_effects tags: + - 上級者 + - NeedsContent - SVG - - 'SVG:Tutorial' + - SVG:チュートリアル translation_of: Web/SVG/Tutorial/Filter_effects --- -

{{ PreviousNext("SVG/Tutorial/Other_content_in_SVG", "SVG/Tutorial/SVG_Fonts") }}

-

基本的な図形は、ある効果を得るために必要な柔軟性を持っていない場合があります。一般的な例として、影を落とす効果はグラデーションの組み合わせで無理なく作成することができません。フィルタは、複雑な効果を与えることを可能にする SVG の機能です。

-

基礎的な例として、SVG コンテンツにぼかし (ブラー) 効果を与えます。初歩的なぼかしはグラデーションを活用して実現できますが、より高度なことをするにはぼかしフィルタが必要です。

-

How filters work

-

The light source

-

The single filters explained

-

{{ PreviousNext("SVG/Tutorial/Other_content_in_SVG", "SVG/Tutorial/SVG_Fonts") }}

-

{{ languages( { "en": "en/SVG/Tutorial/Filter_effects"} ) }}

+{{ PreviousNext("Web/SVG/Tutorial/Other_content_in_SVG", "Web/SVG/Tutorial/SVG_Fonts") }} + +基本的な図形では、ある効果を得るために必要な柔軟性が得られない場合があります。よくある例として、ドロップシャドウはグラデーションの組み合わせでは合理的に作成することができません。フィルターは、 SVG が高度な効果を作り出すための仕組みです。 + +基本的な例としては、 SVG コンテンツにぼかし効果を加えることが挙げられます。基本的なぼかしはグラデーションの助けを借りて実現できますが、それ以上のことを行うにはぼかしフィルターが必要です。 + +## 例 + +フィルターは {{SVGElement('filter')}} 要素で定義され、 SVG ファイルの `` セクションに置かなければなりません。フィルタータグの間には*プリミティブ*のリストがあり、前の操作(ぼかし、照明効果の追加など)の上に構築される基本的な操作です。作成したフィルターをグラフィック要素に適用するには、 {{SVGAttr('filter')}} 属性を設定します。 + +```html + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + SVG + + + +``` + +{{ EmbedLiveSample('Example', '100%', 120) }} + +### ステップ 1 + +```html + +``` + +{{SVGElement('feGaussianBlur')}} は `in` "SourceAlpha" を受け取ります。これは元のグラフィックのアルファチャンネルで、 4 のぼかしを適用し,その結果を "blur" という名前の一時的なバッファーに格納します. + +### ステップ 2 + +```html + +``` + +{{SVGElement('feOffset')}} は、先ほど作成した `in` "blur" を取り込み、結果を右に 4、下に 4 シフトして、バッファー "offsetBlur" に格納するものです。最初の 2 つのプリミティブは、ドロップシャドウを作成するだけです。 + +### ステップ 3 + +```html + + + +``` + +{{SVGelement('feSpecularLighting')}} は `in` "offsetBlur" を受け取り、照明効果を生成し、バッファー "specOut" に `result` を格納します。 + +### ステップ 4 + +```html + +``` + +最初の {{SVGElement('feComposite')}} は、`in` "specOut" と "SourceAlpha" を受け取り、"specOut" の結果が "SourceAlpha" (元のソースグラフィック)より大きくならないようにマスクし、`result` "specOut" を上書きするものです。 + +### ステップ 5 + +```html + +``` + +2 番目の {{SVGElement('feComposite')}} は `in` "SourceGraphic" と "specOut" を取り込み、 "SourceGraphic" の上に "specOut" の結果を重ね、その `result` を "litPaint" に格納します。 + +### ステップ 6 + +```html + + + + +``` + +最後に、 {{SVGElement('feMerge')}} は、ドロップシャドウである "offsetBlur" と、元のソースグラフィックに照明効果を加えた "litPaint" を結合します。 + +![元のグラフィック](filters01-0.png) + +元のグラフィック + +![プリミティブ 1](filters01-1.png) + +プリミティブ 1 + +![プリミティブ 2](filters01-2.png) + +プリミティブ 2 + +![プリミティブ 3](filters01-3.png) + +プリミティブ 3 + +![プリミティブ 4](filters01-4.png) + +プリミティブ 4 + +![プリミティブ 5](filters01-5.png) + +プリミティブ 5 + +![プリミティブ 6](filters01-6.png) + +プリミティブ 6 + +{{ PreviousNext("Web/SVG/Tutorial/Other_content_in_SVG", "Web/SVG/Tutorial/SVG_Fonts") }} From c966f4872e862c1db328254f287fa5ad5769be8d Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Thu, 26 May 2022 01:51:59 +0900 Subject: [PATCH 17/17] =?UTF-8?q?2022/02/18=20=E6=99=82=E7=82=B9=E3=81=AE?= =?UTF-8?q?=E8=8B=B1=E8=AA=9E=E7=89=88=E3=81=AB=E5=90=8C=E6=9C=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/svg/tutorial/patterns/index.md | 103 ++++++++++---------- 1 file changed, 54 insertions(+), 49 deletions(-) diff --git a/files/ja/web/svg/tutorial/patterns/index.md b/files/ja/web/svg/tutorial/patterns/index.md index a79fe98e90c56e..f47f02cf72fe2b 100644 --- a/files/ja/web/svg/tutorial/patterns/index.md +++ b/files/ja/web/svg/tutorial/patterns/index.md @@ -1,74 +1,79 @@ --- -title: Patterns +title: パターン slug: Web/SVG/Tutorial/Patterns tags: + - 上級者 - SVG - - 'SVG:Tutorial' + - SVG:チュートリアル translation_of: Web/SVG/Tutorial/Patterns --- -

{{ PreviousNext("SVG/Tutorial/Gradients", "SVG/Tutorial/Texts") }}

+{{ PreviousNext("Web/SVG/Tutorial/Gradients", "Web/SVG/Tutorial/Texts") }} -

私見では、パターンは SVG で用いる中でわかりにくい塗りつぶし方のひとつです。とはいえとても強力であるので、パターンには説明および少なくとも基礎的な部分は把握するだけの価値があります。グラデーションと同様に、<pattern> 要素は SVG ファイルの <defs> セクションに置かなければなりません。

+## パターン -

+パターンは、 SVG で使用する塗りつぶしの種類の中で、間違いなく最も混乱しやすいものの一つです。また、非常に強力であるため、少なくとも基本的な把握はしておく価値があります。グラデーションと同様に、 {{SVGElement('pattern')}} 要素は SVG ファイルの {{SVGElement("defs")}} セクションに置かれるべきものです。 -
<?xml version="1.0" standalone="no"?>
-<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg" version="1.1">
-  <defs>
-    <linearGradient id="Gradient1">
-      <stop offset="5%" stop-color="white"/>
-      <stop offset="95%" stop-color="blue"/>
-    </linearGradient>
-    <linearGradient id="Gradient2" x1="0" x2="0" y1="0" y2="1">
-      <stop offset="5%" stop-color="red"/>
-      <stop offset="95%" stop-color="orange"/>
-    </linearGradient>
+```html
+
+  
+    
+      
+      
+    
+    
+      
+      
+    
 
-    <pattern id="Pattern" x="0" y="0" width=".25" height=".25">
-      <rect x="0" y="0" width="50" height="50" fill="skyblue"/>
-      <rect x="0" y="0" width="25" height="25" fill="url(#Gradient2)"/>
-      <circle cx="25" cy="25" r="20" fill="url(#Gradient1)" fill-opacity="0.5"/>
-    </pattern>
-  </defs>
+    
+      
+      
+      
+    
+  
 
-  <rect fill="url(#Pattern)" stroke="black" x="0" y="0" width="200" height="200"/>
-</svg>
-
+ + +``` -

pattern 要素の内部には先に入れた他の基本図形を含めることができ、それらの図形は前に学習したスタイルを用いてグラデーションや不透明度などの装飾を設定することができます。ここではパターンの内部に 2 つの長方形 (これらは重なっており、片方はもう片方の 2 倍のサイズでパターン全体を埋めています) と 1 つの円を描画しています。

+{{ EmbedLiveSample('Patterns','220','240') }} -

パターンについてわかりにくいことは、単位系の定義とパターンのサイズです。前出の例ではパターンを繰り返し始めるまでどれくらいの距離をおくべきかを示すために、pattern 要素で width および height 属性を定義しました。また、描画内のどこかへパターンの長方形の開始点をずらしたい場合は、 x および y 属性を利用できます。それら属性をここで用いた理由は、後ほど説明します。

+{{SVGElement("pattern")}} 要素の内部には先に入れた他の基本図形を含めることができ、それらの図形は前に学習したスタイルを用いてグラデーションや不透明度などの装飾を設定することができます。ここではパターンの内部に 2 つの長方形 (これらは重なっており、片方はもう片方の 2 倍のサイズでパターン全体を埋めています) と 1 つの円を描画しています。 -

以前 gradientUnits 属性を用いたように、パターンでも同様に width などの属性で用いる単位を指定する、patternUnits 属性があります。前出の例のように既定値は "objectBoundingBox" であり、1 という値はパターンを適用するオブジェクトの幅や高さに調整されます。今回の例ではパターンを水平および垂直方向に 4 回繰り返したいので、height および width は 0.25 に設定します。つまりパターンの幅および高さは、ボックス全体のサイズの 0.25 倍になります。

+パターンについてわかりにくいことは、単位系の定義とパターンのサイズです。前出の例ではパターンを繰り返し始めるまでどれくらいの距離をおくべきかを示すために、 pattern 要素で `width` および `height` 属性を定義しました。また、描画内のどこかへパターンの長方形の開始点をずらしたい場合は、 `x` および `y` 属性を利用できます。それら属性をここで用いた理由は、後ほど説明します。

-

グラデーションとは異なり、パターンには第 2 の属性 patternContentUnits があり、これは pattern 要素内の基本図形自身が用いる単位系を示します。この属性の既定値は "userSpaceOnUse" であり、patternUnits 属性とは逆です。よって、これらの属性 (patternContentUnits および patternUnits) の片方あるいは両方を指定しないと、パターン内に描画する図形は pattern 要素で用いるのとは異なる座標系で描画されることになり、要素を手書きで記述する際に少々わかりにくくなるかもしれないことを意味します。前出の例でこの作業を行うにはボックスのサイズ (200 ピクセル) と、パターンを水平および垂直方向に 4 回繰り返したいという事実を考慮しなければなりませんでした。よって、パターンの 1 単位は 50x50 ピクセルの正方形でした。そしてパターン内にある 2 つの長方形と円は 50x50 ピクセルのボックスに収まるサイズでした。このボックスの外側に描画した図形等は、表示されません。また、パターンがボックスの左上隅から始まるように 10 ピクセルずらす必要がありましたので、pattern の x および y 属性を 10/200 = 0.05 に調整しました。

+以前 `gradientUnits` 属性を用いたように、パターンでも同様に単位を指定する、`patternUnits` 属性があります。前出の例のように既定値は `"objectBoundingBox"` であり、 `1` という値はパターンを適用するオブジェクトの幅や高さに調整されます。今回の例ではパターンを水平および垂直方向に 4 回繰り返したいので、 `height` および `width` は `0.25` に設定します。つまりパターンの幅および高さは、ボックス全体のサイズの `0.25` 倍になります。 -

ここでの注意点は、オブジェクトのサイズが変わった場合にパターンそのものは見合うサイズに調整されますが、内部のオブジェクトは調整されないことです。従ってパターン内では 4 回ユニットを繰り返しますが、パターンを構成するオブジェクトは同じサイズのままになりますので、オブジェクトの間に何もない大きなエリアができあがってしまいます。patternContentUnits 属性を変更することで、すべての要素で同じ単位系を用いることができます:

+グラデーションとは異なり、パターンには第 2 の属性 `patternContentUnits` があり、これは pattern 要素内の基本図形自身が用いる単位系を示します。この属性の既定値は "userSpaceOnUse" であり、`patternUnits` 属性とは逆です。よって、これらの属性 (`patternContentUnits` および `patternUnits`) の片方あるいは両方を指定しないと、パターン内に描画する図形は pattern 要素で用いるのとは異なる座標系で描画されることになり、要素を手書きで記述する際に少々わかりにくくなるかもしれないことを意味します。 -
 <pattern id="Pattern" width=".25" height=".25" patternContentUnits="objectBoundingBox">
-   <rect x="0" y="0" width=".25" height=".25" fill="skyblue"/>
-   <rect x="0" y="0" width=".125" height=".125" fill="url(#Gradient2)"/>
-   <circle cx=".125" cy=".125" r=".1" fill="url(#Gradient1)" fill-opacity="0.5"/>
- </pattern>
-
+前出の例でこの作業を行うにはボックスのサイズ (200 ピクセル) と、パターンを水平および垂直方向に 4 回繰り返したいという事実を考慮しなければなりませんでした。よって、パターンの 1 単位は 50x50 ピクセルの正方形でした。そしてパターン内にある 2 つの長方形と円は 50x50 ピクセルのボックスに収まるサイズでした。このボックスの外側に描画した図形等は、表示されません。また、パターンがボックスの左上隅から始まるように 10 ピクセルずらす必要がありましたので、`pattern` の `x` および `y` 属性を 10÷200 = 0.05 に調整しました。 -

これでパターンとパターン内のコンテンツが同じ単位系になることから、パターンが正しい位置から始まるようにボックスをずらす必要がなくなり、またオブジェクトのサイズが大きくなった場合でもオブジェクト内に同じ数のパターンが入るようにパターンのサイズが自動的に調整されます。またその内部でも、同じことを行います。これは、"userSpaceOnUse" システムと対照的です。こちらはオブジェクトのサイズが変わってもパターンのサイズはそのままであり、ボックスを埋めるためにパターンをより多く繰り返します。

+ここでの注意点は、オブジェクトのサイズが変わった場合にパターンそのものは見合うサイズに調整されますが、内部のオブジェクトは調整されないことです。従ってパターン内では 4 回ユニットを繰り返しますが、パターンを構成するオブジェクトは同じサイズのままになりますので、オブジェクトの間に何もない大きなエリアができあがってしまいます。`patternContentUnits` 属性を変更することで、すべての要素で同じ単位系を用いることができます。 -

余談ですが、Gecko では円の半径が 0.075 より小さいときに描画の不具合が発生するようです (それより大きい半径になるよう拡大すべきであるにもかかわらず。これは pattern 要素のバグかもしれませんし、あるいはバグではないかもしれませんが、私にはよくわかりません)。これの回避法は、必要がなければ "objectBoundingBox" の単位を用いて描画することを避けるのが最善でしょう。

+```xml + + + + + +``` -

これまで見てきた 2 つの使い方はいずれも、パターンについて考えるときに通常は思いつかないでしょう。パターンは通常サイズが決まっており、またそれ自身をオブジェクトの形状に関係なく繰り返します。このようなパターンを作成するには、パターンとその内容物は現在の userSpace 内に描画しなければならず、そのためにオブジェクトの形状が変化してもパターンの形状は変わりません:

+これでパターンとパターン内のコンテンツが同じ単位系になることから、パターンが正しい位置から始まるようにボックスをずらす必要がなくなり、またオブジェクトのサイズが大きくなった場合でもオブジェクト内に同じ数のパターンが入るようにパターンのサイズが自動的に調整されます。またその内部でも、同じことを行います。これは、"userSpaceOnUse" システムと対照的です。こちらはオブジェクトのサイズが変わってもパターンのサイズはそのままであり、ボックスを埋めるためにパターンをより多く繰り返します。 -
 <pattern id="Pattern" x="10" y="10" width="50" height="50" patternUnits="userSpaceOnUse">
-   <rect x="0" y="0" width="50" height="50" fill="skyblue"/>
-   <rect x="0" y="0" width="25" height="25" fill="url(#Gradient2)"/>
-   <circle cx="25" cy="25" r="20" fill="url(#Gradient1)" fill-opacity="0.5"/>
- </pattern>
-
+余談ですが、Gecko では円の半径が `0.075` より小さいときに描画の不具合が発生するようです (それより大きい半径になるよう拡大すべきであるにもかかわらず。これは pattern 要素のバグかもしれませんし、あるいはバグではないかもしれませんが、私にはよくわかりません)。これの回避法は、必要がなければ "objectBoundingBox" の単位を用いて描画することを避けるのが最善でしょう。 -

もちろん、これは後からオブジェクトのサイズを変えてもパターンのサイズは調整されないことを意味します。前出の 3 種類の例について、長方形の高さを 300px に広げたものを以下に示しましたが、これはすべてを網羅した画像ではなく、また目的に応じて利用可能なオプションが他にもあることを注記したいと思います。

+これまで見てきた 2 つの使い方はいずれも、パターンについて考えるときに通常は思いつかないでしょう。パターンは通常サイズが決まっており、またそれ自身をオブジェクトの形状に関係なく繰り返します。このようなパターンを作成するには、パターンとその内容物は現在の userSpace 内に描画しなければならず、そのためにオブジェクトの形状が変化してもパターンの形状は変わりません。 -

Image:SVG_Pattern_Comparison_of_Units.pngo

+```xml + + + + + +``` -

{{ PreviousNext("SVG/Tutorial/Gradients", "SVG/Tutorial/Texts") }}

+もちろん、これは後からオブジェクトのサイズを変えてもパターンのサイズは調整されないことを意味します。前出の 3 種類の例について、長方形の高さを 300px に広げたものを以下に示しましたが、これはすべてを網羅した画像ではなく、また目的に応じて利用可能なオプションが他にもあることを注記したいと思います。 -

{{ languages( { "en": "en/SVG/Tutorial/Patterns"} ) }}

+![](svg_pattern_comparison_of_units.png) + +{{ PreviousNext("Web/SVG/Tutorial/Gradients", "Web/SVG/Tutorial/Texts") }}