UDN Search

<element>: The Custom Element element (Obsolete) - HTML: Hypertext Markup Language

the obsolete html <element> element was part of the web components specification; it was intended to be used to define new custom dom elements.
... the obsolete html <element> element was part of the web components specification; it was intended to be used to define new custom dom elements.
... the obsolete html <element> element was part of the web components specification; it was intended to be used to define new custom dom elements.
...And 7 more matches

Element.getElementsByTagName() - Web APIs

Web › API › Element › getElementsByTagName

the element.getelementsbytagname() method returns a live htmlcollection of elements with the given tag name.
... the element.getelementsbytagname() method returns a live htmlcollection of elements with the given tag name.
... the element.getelementsbytagname() method returns a live htmlcollection of elements with the given tag name.
...And 34 more matches

Element.getElementsByClassName() - Web APIs

Web › API › Element › getElementsByClassName

the element method getelementsbyclassname() returns a live htmlcollection which contains every descendant element which has the specified class name or names.
... the element method getelementsbyclassname() returns a live htmlcollection which contains every descendant element which has the specified class name or names.
... the element method getelementsbyclassname() returns a live htmlcollection which contains every descendant element which has the specified class name or names.
...And 30 more matches

Element.getElementsByTagNameNS() - Web APIs

Web › API › Element › getElementsByTagNameNS

the element.getelementsbytagnamens() method returns a live htmlcollection of elements with the given tag name belonging to the given namespace.
... the element.getelementsbytagnamens() method returns a live htmlcollection of elements with the given tag name belonging to the given namespace.
... the element.getelementsbytagnamens() method returns a live htmlcollection of elements with the given tag name belonging to the given namespace.
...And 22 more matches

CSSPseudoElement.element - Web APIs

Web › API › CSSPseudoElement › element

the element read-only property of the csspseudoelement interface returns a reference to the originating element of the pseudo-element, in other words its parent element.
... the element read-only property of the csspseudoelement interface returns a reference to the originating element of the pseudo-element, in other words its parent element.
... the element read-only property of the csspseudoelement interface returns a reference to the originating element of the pseudo-element, in other words its parent element.
...And 19 more matches

Element.insertAdjacentElement() - Web APIs

Web › API › Element › insertAdjacentElement

the insertadjacentelement() method of the element interface inserts a given element node at a given position relative to the element it is invoked upon.
... the insertadjacentelement() method of the element interface inserts a given element node at a given position relative to the element it is invoked upon.
... the insertadjacentelement() method of the element interface inserts a given element node at a given position relative to the element it is invoked upon.
...And 19 more matches

HTMLFormElement.elements - Web APIs

Web › API › HTMLFormElement › elements

the htmlformelement property elements returns an htmlformcontrolscollection listing all the form controls contained in the <form> element.
... the htmlformelement property elements returns an htmlformcontrolscollection listing all the form controls contained in the <form> element.
...h property.
...And 19 more matches

MediaElementAudioSourceNode.mediaElement - Web APIs

Web › API › MediaElementAudioSourceNode › mediaElement

the mediaelementaudiosourcenode interface's read-only mediaelement property indicates the htmlmediaelement that contains the audio track from which the node is receiving audio.
... the mediaelementaudiosourcenode interface's read-only mediaelement property indicates the htmlmediaelement that contains the audio track from which the node is receiving audio.
... the mediaelementaudiosourcenode interface's read-only mediaelement property indicates the htmlmediaelement that contains the audio track from which the node is receiving audio.
...And 10 more matches

HTMLSlotElement.assignedElements() - Web APIs

Web › API › HTMLSlotElement › assignedElements

the assignedelements() property of the htmlslotelement interface returns a sequence of the elements assigned to this slot (and no other nodes).
... the assignedelements() property of the htmlslotelement interface returns a sequence of the elements assigned to this slot (and no other nodes).
... the assignedelements() property of the htmlslotelement interface returns a sequence of the elements assigned to this slot (and no other nodes).
...And 9 more matches

HTML elements reference - HTML: Hypertext Markup Language

Web › HTML › Element

this page lists all the html elements, which are created using tags.
... this page lists all the html elements, which are created using tags.
... this page lists all the html elements, which are created using tags.
...And 244 more matches

Element - Web APIs

Web › API › Element

element is the most general base class from which all element objects (i.e.
... element is the most general base class from which all element objects (i.e.
... element is the most general base class from which all element objects (i.e.
...And 206 more matches

XUL element attributes - Archive of obsolete content

Archive › Mozilla › XUL › XUL Reference › XUL element attributes

« xul reference home the following attributes are common to all xul elements: align type: one of the values below the align attribute specifies how child elements of the box are aligned, when the size of the box is larger than the total size of the children.
...ifies how child elements of the box are aligned, when the size of the box is larger than the total size of the children.
...tion, it specifies how its children will be aligned horizontally.
...And 125 more matches

<input>: The Input (Form Input) element - HTML: Hypertext Markup Language

Web › HTML › Element › input

the html <input> element is used to create interactive controls for web-based forms in order to accept data from the user; a wide variety of types of input data and control widgets are available, depending on the device and user agent.
... the html <input> element is used to create interactive controls for web-based forms in order to accept data from the user; a wide variety of types of input data and control widgets are available, depending on the device and user agent.
... for entering a date consisting of a week-year number and a week number with no time zone.
...And 109 more matches

Pseudo-classes and pseudo-elements - Learn web development

Learn › CSS › Building blocks › Selectors › Pseudo-classes and pseudo-elements

previous overview: building blocks next the next set of selectors we will look at are referred to as pseudo-classes and pseudo-elements.
...you are trying to achieve.
...xplaining browser support.
...And 103 more matches

Using custom elements - Web Components

Web › Web Components › Using custom elements

one of the key features of the web components standard is the ability to create custom elements that encapsulate your functionality on an html page, rather than having to make do with a long, nested batch of elements that together provide a custom page feature.
... one of the key features of the web components standard is the ability to create custom elements that encapsulate your functionality on an html page, rather than having to make do with a long, nested batch of elements that together provide a custom page feature.
... one of the key features of the web components standard is the ability to create custom elements that encapsulate your functionality on an html page, rather than having to make do with a long, nested batch of elements that together provide a custom page feature.
...And 103 more matches

HTMLMediaElement - Web APIs

Web › API › HTMLMediaElement

the htmlmediaelement interface adds to htmlelement the properties and methods needed to support basic media-related capabilities that are common to audio and video.
... the htmlmediaelement interface adds to htmlelement the properties and methods needed to support basic media-related capabilities that are common to audio and video.
... the htmlmediaelement interface adds to htmlelement the properties and methods needed to support basic media-related capabilities that are common to audio and video.
...And 96 more matches

HTMLElement - Web APIs

Web › API › HTMLElement

the htmlelement interface represents any html element.
... the htmlelement interface represents any html element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...And 95 more matches

Elements - Archive of obsolete content

Archive › Mozilla › XBL › XBL 1.0 Reference › Elements

bindings this section is tested and adjusted for the current firefox implementation.
... bindings this section is tested and adjusted for the current firefox implementation.
... bindings this section is tested and adjusted for the current firefox implementation.
...And 92 more matches

SVGSVGElement - Web APIs

Web › API › SVGSVGElement

the svgsvgelement interface provides access to the properties of <svg> elements, as well as methods to manipulate them.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 87 more matches

HTMLInputElement - Web APIs

Web › API › HTMLInputElement

the htmlinputelement interface provides special properties and methods for manipulating the options, layout, and presentation of <input> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 80 more matches

HTMLSelectElement - Web APIs

Web › API › HTMLSelectElement

the htmlselectelement interface represents a <select> html element.
... the htmlselectelement interface represents a <select> html element.
... the htmlselectelement interface represents a <select> html element.
...And 73 more matches

HTMLTableElement - Web APIs

Web › API › HTMLTableElement

the htmltableelement interface provides special properties and methods (beyond the regular htmlelement object interface it also has available to it by inheritance) for manipulating the layout and presentation of tables in an html document.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 65 more matches

Adding Methods to XBL-defined Elements - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Adding Methods to XBL-defined Elements

« previousnext » next, we'll find out how to add custom methods to xbl-defined elements.
... « previousnext » next, we'll find out how to add custom methods to xbl-defined elements.
...ese methods can be called from a script.
...And 62 more matches

HTMLFormElement - Web APIs

Web › API › HTMLFormElement

the htmlformelement interface represents a <form> element in the dom.
... the htmlformelement interface represents a <form> element in the dom.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...And 58 more matches

Timing element visibility with the Intersection Observer API - Web APIs

Web › API › Intersection Observer API › Timing element visibility

the intersection observer api makes it easy to be asynchronously notified when elements of interest become more or less obscured by a shared ancestor node or element, including the document itself.
...>another link</a></li> <li><a href="#link3">one more link</a></li> </ul> </nav> </aside> <main> </main> </div> this is the framework for the entire site.
...bar as a list of links within an <aside> block.
...And 55 more matches

Element Positioning - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Element Positioning

« previousnext » here we'll look at controlling the position and size of an element.
... « previousnext » here we'll look at controlling the position and size of an element.
... « previousnext » here we'll look at controlling the position and size of an element.
...And 53 more matches

HTMLImageElement - Web APIs

Web › API › HTMLImageElement

the htmlimageelement interface represents an html <img> element, providing the properties and methods used to manipulate image elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 52 more matches

HTMLButtonElement - Web APIs

Web › API › HTMLButtonElement

the htmlbuttonelement interface provides properties and methods (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating <button> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 51 more matches

<audio>: The Embed Audio element - HTML: Hypertext Markup Language

Web › HTML › Element › audio

the html <audio> element is used to embed sound content in documents.
... the html <audio> element is used to embed sound content in documents.
... the browser will choose the most suitable one.
...And 51 more matches

nsIDOMXULElement

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMXULElement

dom/interfaces/xul/nsidomxulelement.idlscriptable represents a xul element within the dom.
... dom/interfaces/xul/nsidomxulelement.idlscriptable represents a xul element within the dom.
... dom/interfaces/xul/nsidomxulelement.idlscriptable represents a xul element within the dom.
...And 50 more matches

HTMLAnchorElement - Web APIs

Web › API › HTMLAnchorElement

the htmlanchorelement interface represents hyperlink elements and provides special properties and methods (beyond those of the regular htmlelement object interface that they inherit from) for manipulating the layout and presentation of such elements.
... the htmlanchorelement interface represents hyperlink elements and provides special properties and methods (beyond those of the regular htmlelement object interface that they inherit from) for manipulating the layout and presentation of such elements.
... the htmlanchorelement interface represents hyperlink elements and provides special properties and methods (beyond those of the regular htmlelement object interface that they inherit from) for manipulating the layout and presentation of such elements.
...And 50 more matches

<video>: The Video Embed element - HTML: Hypertext Markup Language

Web › HTML › Element › video

the html video element (<video>) embeds a media player which supports video playback into the document.
... the html video element (<video>) embeds a media player which supports video playback into the document.
... you can use <video> for audio content as well, but the <audio> element may provide a more appropriate user experience.
...And 49 more matches

HTMLObjectElement - Web APIs

Web › API › HTMLObjectElement

the htmlobjectelement interface provides special properties and methods (beyond those on the htmlelement interface it also has available to it by inheritance) for manipulating the layout and presentation of <object> element, representing external resources.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 46 more matches

Custom XUL Elements with XBL - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › Custom XUL Elements with XBL

« previousnext » xml binding language (xbl, sometimes also called extensible bindings language) is a language for describing bindings that can be attached to elements in other documents.
... « previousnext » xml binding language (xbl, sometimes also called extensible bindings language) is a language for describing bindings that can be attached to elements in other documents.
... « previousnext » xml binding language (xbl, sometimes also called extensible bindings language) is a language for describing bindings that can be attached to elements in other documents.
...And 45 more matches

HTMLOutputElement - Web APIs

Web › API › HTMLOutputElement

the htmloutputelement interface provides properties and methods (beyond those inherited from htmlelement) for manipulating the layout and presentation of <output> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 45 more matches

HTMLAreaElement - Web APIs

Web › API › HTMLAreaElement

the htmlareaelement interface provides special properties and methods (beyond those of the regular object htmlelement interface it also has available to it by inheritance) for manipulating the layout and presentation of <area> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 41 more matches

HTMLTextAreaElement - Web APIs

Web › API › HTMLTextAreaElement

the htmltextareaelement interface provides special properties and methods for manipulating the layout and presentation of <textarea> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 41 more matches

Document.getElementsByClassName() - Web APIs

Web › API › Document › getElementsByClassName

the getelementsbyclassname method of document interface returns an array-like object of all child elements which have all of the given class name(s).
... the getelementsbyclassname method of document interface returns an array-like object of all child elements which have all of the given class name(s).
... the getelementsbyclassname method of document interface returns an array-like object of all child elements which have all of the given class name(s).
...And 40 more matches

Applying color to HTML elements using CSS - HTML: Hypertext Markup Language

Web › HTML › Applying color

the use of color is a fundamental form of human expression.
...s properties are involved, how you describe colors, and how to actually use colors both in stylesheets and in scripts.
... to let the user pick a color.
...And 39 more matches

Images, media, and form elements - Learn web development

Learn › CSS › Building blocks › Images media form elements

previous overview: building blocks next in this lesson we will take a look at how certain special elements are treated in css.
... previous overview: building blocks next in this lesson we will take a look at how certain special elements are treated in css.
...hat is and isn't possible can save some frustration, and this lesson will highlight some of the main things that you need to know.
...And 37 more matches

SVGPathElement - Web APIs

Web › API › SVGPathElement

the svgpathelement interface corresponds to the <path> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 36 more matches

CustomElementRegistry.define() - Web APIs

Web › API › CustomElementRegistry › define

the define() method of the customelementregistry interface defines a new custom element.
... the define() method of the customelementregistry interface defines a new custom element.
... the define() method of the customelementregistry interface defines a new custom element.
...And 34 more matches

Document.getElementById() - Web APIs

Web › API › Document › getElementById

the document method getelementbyid() returns an element object representing the element whose id property matches the specified string.
... the document method getelementbyid() returns an element object representing the element whose id property matches the specified string.
... the document method getelementbyid() returns an element object representing the element whose id property matches the specified string.
...And 33 more matches

Document.createElement() - Web APIs

Web › API › Document › createElement

in an html document, the document.createelement() method creates the html element specified by tagname, or an htmlunknownelement if tagname isn't recognized.
... in an html document, the document.createelement() method creates the html element specified by tagname, or an htmlunknownelement if tagname isn't recognized.
... in an html document, the document.createelement() method creates the html element specified by tagname, or an htmlunknownelement if tagname isn't recognized.
...And 31 more matches

Inline elements - HTML: Hypertext Markup Language

Web › HTML › Inline elements

html (hypertext markup language) elements historically were categorized as either "block-level" elements or "inline-level" elements.
... html (hypertext markup language) elements historically were categorized as either "block-level" elements or "inline-level" elements.
... html (hypertext markup language) elements historically were categorized as either "block-level" elements or "inline-level" elements.
...And 31 more matches

SVGTextContentElement - Web APIs

Web › API › SVGTextContentElement

the svgtextcontentelement interface is implemented by elements that support rendering child text content.
... the svgtextcontentelement interface is implemented by elements that support rendering child text content.
... the svgtextcontentelement interface is implemented by elements that support rendering child text content.
...And 30 more matches

HTMLFieldSetElement - Web APIs

Web › API › HTMLFieldSetElement

the htmlfieldsetelement interface provides special properties and methods (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating the layout and presentation of <fieldset> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 29 more matches

HTMLVideoElement - Web APIs

Web › API › HTMLVideoElement

the htmlvideoelement interface provides special properties and methods for manipulating video objects.
... the htmlvideoelement interface provides special properties and methods for manipulating video objects.
... the htmlvideoelement interface provides special properties and methods for manipulating video objects.
...And 29 more matches

SVGFEConvolveMatrixElement - Web APIs

Web › API › SVGFEConvolveMatrixElement

the svgfeconvolvematrixelement interface corresponds to the <feconvolvematrix> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 29 more matches

Web › HTML › Element › link

the html external resource link element (<link>) specifies relationships between the current document and an external resource.
... the html external resource link element (<link>) specifies relationships between the current document and an external resource.
...site icons (both "favicon" style icons and icons for the home screen and apps on mobile devices) among other things.
...And 29 more matches

Document.getElementsByTagName() - Web APIs

Web › API › Document › getElementsByTagName

the getelementsbytagname method of document interface returns an htmlcollection of elements with the given tag name.
... the getelementsbytagname method of document interface returns an htmlcollection of elements with the given tag name.
... the getelementsbytagname method of document interface returns an htmlcollection of elements with the given tag name.
...And 28 more matches

HTMLIFrameElement - Web APIs

Web › API › HTMLIFrameElement

the htmliframeelement interface provides special properties and methods (beyond those of the htmlelement interface it also has available to it by inheritance) for manipulating the layout and presentation of inline frame elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 28 more matches

SVGAnimationElement - Web APIs

Web › API › SVGAnimationElement

the svganimationelement interface is the base interface for all of the animation element interfaces: svganimateelement, svgsetelement, svganimatecolorelement, svganimatemotionelement and svganimatetransformelement.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 28 more matches

<select>: The HTML Select element - HTML: Hypertext Markup Language

Web › HTML › Element › select

the html <select> element represents a control that provides a menu of options: the source for this interactive example is stored in a github repository.
...xamples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...n/interactive-examples and send us a pull request.
...And 28 more matches

HTMLTableCellElement - Web APIs

Web › API › HTMLTableCellElement

the htmltablecellelement interface provides special properties and methods (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating the layout and presentation of table cells, either header or data cells, in an html document.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 27 more matches

SVGElement - Web APIs

Web › API › SVGElement

all of the svg dom interfaces that correspond directly to elements in the svg language derive from the svgelement interface.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties also inherits properties...
...And 27 more matches

HTMLScriptElement - Web APIs

Web › API › HTMLScriptElement

html <script> elements expose the htmlscriptelement interface, which provides special properties and methods for manipulating the behavior and execution of <script> elements (beyond the inherited htmlelement interface).
...l properties and methods for manipulating the behavior and execution of <script> elements (beyond the inherited htmlelement interface).
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...And 26 more matches

Adding HTML Elements - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Adding HTML Elements

« previousnext » now that we've added some buttons, let's add some other elements.
... « previousnext » now that we've added some buttons, let's add some other elements.
... « previousnext » now that we've added some buttons, let's add some other elements.
...And 25 more matches

Document.getElementsByTagNameNS() - Web APIs

Web › API › Document › getElementsByTagNameNS

returns a list of elements with the given tag name belonging to the given namespace.
... returns a list of elements with the given tag name belonging to the given namespace.
... returns a list of elements with the given tag name belonging to the given namespace.
...And 25 more matches

HTMLLinkElement - Web APIs

Web › API › HTMLLinkElement

the htmllinkelement interface represents reference information for external resources and the relationship of those resources to a document and vice-versa (corresponds to <link> element; not to be confused with <a>, which is represented by htmlanchorelement).
... the htmllinkelement interface represents reference information for external resources and the relationship of those resources to a document and vice-versa (corresponds to <link> element; not to be confused with <a>, which is represented by htmlanchorelement).
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...And 25 more matches

Replaced elements - CSS: Cascading Style Sheets

Web › CSS › Replaced element

in css, a replaced element is an element whose representation is outside the scope of css; they're external objects whose representation is independent of the css formatting model.
... in css, a replaced element is an element whose representation is outside the scope of css; they're external objects whose representation is independent of the css formatting model.
... in css, a replaced element is an element whose representation is outside the scope of css; they're external objects whose representation is independent of the css formatting model.
...And 25 more matches

<dfn>: The Definition element - HTML: Hypertext Markup Language

Web › HTML › Element › dfn

the html definition element (<dfn>) is used to indicate the term being defined within the context of a definition phrase or sentence.
... the html definition element (<dfn>) is used to indicate the term being defined within the context of a definition phrase or sentence.
... the html definition element (<dfn>) is used to indicate the term being defined within the context of a definition phrase or sentence.
...And 25 more matches

Adding Properties to XBL-defined Elements - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Adding Properties to XBL-defined Elements

« previousnext » next, we'll find out how to add custom properties to xbl-defined elements.
... « previousnext » next, we'll find out how to add custom properties to xbl-defined elements.
... « previousnext » next, we'll find out how to add custom properties to xbl-defined elements.
...And 24 more matches

Element.classList - Web APIs

Web › API › Element › classList

the element.classlist is a read-only property that returns a live domtokenlist collection of the class attributes of the element.
... the element.classlist is a read-only property that returns a live domtokenlist collection of the class attributes of the element.
... the element.classlist is a read-only property that returns a live domtokenlist collection of the class attributes of the element.
...And 24 more matches

SVGUseElement - Web APIs

Web › API › SVGUseElement

svg use dom interface the svguseelement interface corresponds to the <use> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 24 more matches

element() - CSS: Cascading Style Sheets

Web › CSS › element

the element() css function defines an <image> value generated from an arbitrary html element.
... the element() css function defines an <image> value generated from an arbitrary html element.
... the element() css function defines an <image> value generated from an arbitrary html element.
...And 24 more matches

Block-level elements - HTML: Hypertext Markup Language

Web › HTML › Block-level elements

html (hypertext markup language) elements historically were categorized as either "block-level" elements or "inline-level" elements.
... html (hypertext markup language) elements historically were categorized as either "block-level" elements or "inline-level" elements.
... html (hypertext markup language) elements historically were categorized as either "block-level" elements or "inline-level" elements.
...And 24 more matches

<source>: The Media or Image Source element - HTML: Hypertext Markup Language

Web › HTML › Element › source

the html <source> element specifies multiple media resources for the <picture>, the <audio> element, or the <video> element.
... the html <source> element specifies multiple media resources for the <picture>, the <audio> element, or the <video> element.
...wsers given their differing support for image file formats and media file formats.
...And 24 more matches

HTMLOptionElement - Web APIs

Web › API › HTMLOptionElement

the htmloptionelement interface represents <option> elements and inherits all classes and methods of the htmlelement interface.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 23 more matches

<img>: The Image Embed element - HTML: Hypertext Markup Language

Web › HTML › Element › img

the html <img> element embeds an image into the document.
... the html <img> element embeds an image into the document.
..., content blocking, or linkrot.
...And 23 more matches

JS_AliasElement

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS AliasElement

obsolete since jsapi 8this feature is obsolete.
...liaselement(jscontext *cx, jsobject *obj, const char *name, jsint alias); name type description cx jscontext * the context in which to create the alias.
... type description cx jscontext * the context in which to create the alias.
...And 22 more matches

CSSPseudoElement - Web APIs

Web › API › CSSPseudoElement

the csspseudoelement interface represents a pseudo-element that may be the target of an event or animated using the web animations api.
... the csspseudoelement interface represents a pseudo-element that may be the target of an event or animated using the web animations api.
... the csspseudoelement interface represents a pseudo-element that may be the target of an event or animated using the web animations api.
...And 22 more matches

Document.createElementNS() - Web APIs

Web › API › Document › createElementNS

creates an element with the specified namespace uri and qualified name.
... creates an element with the specified namespace uri and qualified name.
... creates an element with the specified namespace uri and qualified name.
...And 22 more matches

Element.innerHTML - Web APIs

Web › API › Element › innerHTML

the element property innerhtml gets or sets the html or xml markup contained within the element.
... xml markup contained within the element.
... <noembed> node has a child text node that includes the characters (&), (<), or (>), innerhtml returns these characters as the html entities "&", "<" and ">" respectively.
...And 22 more matches

HTMLCanvasElement - Web APIs

Web › API › HTMLCanvasElement

the htmlcanvaselement interface provides properties and methods for manipulating the layout and presentation of <canvas> elements.
... the htmlcanvaselement interface provides properties and methods for manipulating the layout and presentation of <canvas> elements.
... the htmlcanvaselement interface provides properties and methods for manipulating the layout and presentation of <canvas> elements.
...And 22 more matches

HTMLMarqueeElement - Web APIs

Web › API › HTMLMarqueeElement

the htmlmarqueeelement interface provides methods to manipulate <marquee> elements.
... the htmlmarqueeelement interface provides methods to manipulate <marquee> elements.
...operties and methods from the htmlelement interface.
...And 22 more matches

SVGImageElement - Web APIs

Web › API › SVGImageElement

the svgimageelement interface corresponds to the <image> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 22 more matches

SVGRectElement - Web APIs

Web › API › SVGRectElement

the svgrectelement interface provides access to the properties of <rect> elements, as well as methods to manipulate them.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 22 more matches

Element.querySelector() - Web APIs

Web › API › Element › querySelector

the queryselector() method of the element interface returns the first element that is a descendant of the element on which it is invoked that matches the specified group of selectors.
... the queryselector() method of the element interface returns the first element that is a descendant of the element on which it is invoked that matches the specified group of selectors.
... the queryselector() method of the element interface returns the first element that is a descendant of the element on which it is invoked that matches the specified group of selectors.
...And 21 more matches

HTMLAudioElement - Web APIs

Web › API › HTMLAudioElement

the htmlaudioelement interface provides access to the properties of <audio> elements, as well as methods to manipulate them.
... the htmlaudioelement interface provides access to the properties of <audio> elements, as well as methods to manipulate them.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...And 21 more matches

SVGAElement - Web APIs

Web › API › SVGAElement

the svgaelement interface provides access to the properties of <a> element, as well as methods to manipulate them.
... the svgaelement interface provides access to the properties of <a> element, as well as methods to manipulate them.
... the svgaelement interface provides access to the properties of <a> element, as well as methods to manipulate them.
...And 21 more matches

SVGCircleElement - Web APIs

Web › API › SVGCircleElement

the svgcircleelement interface is an interface for the <circle> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 21 more matches

SVGFESpotLightElement - Web APIs

Web › API › SVGFESpotLightElement

the svgfespotlightelement interface corresponds to the <fespotlight> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 21 more matches

SVGTextPositioningElement - Web APIs

Web › API › SVGTextPositioningElement

the svgtextpositioningelement interface is implemented by elements that support attributes that position individual text glyphs.
... the svgtextpositioningelement interface is implemented by elements that support attributes that position individual text glyphs.
... the svgtextpositioningelement interface is implemented by elements that support attributes that position individual text glyphs.
...And 21 more matches

<kbd>: The Keyboard Input element - HTML: Hypertext Markup Language

Web › HTML › Element › kbd

the html keyboard input element (<kbd>) represents a span of inline text denoting textual user input from a keyboard, voice input, or any other text entry device.
... the html keyboard input element (<kbd>) represents a span of inline text denoting textual user input from a keyboard, voice input, or any other text entry device.
...> element using its default monospace font, although this is not mandated by the html standard.
...And 21 more matches

DocumentOrShadowRoot.activeElement - Web APIs

Web › API › DocumentOrShadowRoot › activeElement

the activeelement read-only property of the document and shadowroot interfaces returns the element within the dom or shadow dom tree that currently has focus.
... the activeelement read-only property of the document and shadowroot interfaces returns the element within the dom or shadow dom tree that currently has focus.
... the activeelement read-only property of the document and shadowroot interfaces returns the element within the dom or shadow dom tree that currently has focus.
...And 20 more matches

HTMLTableRowElement - Web APIs

Web › API › HTMLTableRowElement

the htmltablerowelement interface provides special properties and methods (beyond the htmlelement interface it also has available to it by inheritance) for manipulating the layout and presentation of rows in an html table.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 20 more matches

<table>: The Table element - HTML: Hypertext Markup Language

Web › HTML › Element › table

the html <table> element represents tabular data — that is, information presented in a two-dimensional table comprised of rows and columns of cells containing data.
...s and columns of cells containing data.
....
...And 20 more matches

<tbody>: The Table Body element - HTML: Hypertext Markup Language

Web › HTML › Element › tbody

the html table body element (<tbody>) encapsulates a set of table rows (<tr> elements), indicating that they comprise the body of the table (<table>).
... the html table body element (<tbody>) encapsulates a set of table rows (<tr> elements), indicating that they comprise the body of the table (<table>).
...ractive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 20 more matches

<tr>: The Table Row element - HTML: Hypertext Markup Language

Web › HTML › Element › tr

the html <tr> element defines a row of cells in a table.
... the html <tr> element defines a row of cells in a table.
...ll should be, with the default being 1.
...And 20 more matches

Element.getClientRects() - Web APIs

Web › API › Element › getClientRects

the getclientrects() method of the element interface returns a collection of domrect objects that indicate the bounding rectangles for each css border box in a client.
... the getclientrects() method of the element interface returns a collection of domrect objects that indicate the bounding rectangles for each css border box in a client.
...d value is a collection of domrect objects, one for each css border box associated with the element.
...And 19 more matches

MediaElementAudioSourceNode - Web APIs

Web › API › MediaElementAudioSourceNode

the mediaelementaudiosourcenode interface represents an audio source consisting of an html5 <audio> or <video> element.
... the mediaelementaudiosourcenode interface represents an audio source consisting of an html5 <audio> or <video> element.
... the mediaelementaudiosourcenode interface represents an audio source consisting of an html5 <audio> or <video> element.
...And 19 more matches

SVGComponentTransferFunctionElement - Web APIs

Web › API › SVGComponentTransferFunctionElement

the svgcomponenttransferfunctionelement interface defines a base interface used by the component transfer function interfaces.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 19 more matches

SVGFilterElement - Web APIs

Web › API › SVGFilterElement

the svgfilterelement interface provides access to the properties of <filter> elements, as well as methods to manipulate them.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 19 more matches

SVGPatternElement - Web APIs

Web › API › SVGPatternElement

the svgpatternelement interface corresponds to the <pattern> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 19 more matches

<picture>: The Picture element - HTML: Hypertext Markup Language

Web › HTML › Element › picture

the html <picture> element contains zero or more <source> elements and one <img> element to offer alternative versions of an image for different display/device scenarios.
... the html <picture> element contains zero or more <source> elements and one <img> element to offer alternative versions of an image for different display/device scenarios.
... the html <picture> element contains zero or more <source> elements and one <img> element to offer alternative versions of an image for different display/device scenarios.
...And 19 more matches

<summary>: The Disclosure Summary element - HTML: Hypertext Markup Language

Web › HTML › Element › summary

the html disclosure summary element (<summary>) element specifies a summary, caption, or legend for a <details> element's disclosure box.
... the html disclosure summary element (<summary>) element specifies a summary, caption, or legend for a <details> element's disclosure box.
... the html disclosure summary element (<summary>) element specifies a summary, caption, or legend for a <details> element's disclosure box.
...And 19 more matches

CustomElementRegistry - Web APIs

Web › API › CustomElementRegistry

the customelementregistry interface provides methods for registering custom elements and querying registered elements.
... the customelementregistry interface provides methods for registering custom elements and querying registered elements.
... the customelementregistry interface provides methods for registering custom elements and querying registered elements.
...And 18 more matches

<template>: The Content Template element - HTML: Hypertext Markup Language

Web › HTML › Element › template

the html content template (<template>) element is a mechanism for holding html that is not to be rendered immediately when a page is loaded but may be instantiated subsequently during runtime using javascript.
... the html content template (<template>) element is a mechanism for holding html that is not to be rendered immediately when a page is loaded but may be instantiated subsequently during runtime using javascript.
...r holding html that is not to be rendered immediately when a page is loaded but may be instantiated subsequently during runtime using javascript.
...And 18 more matches

<track>: The Embed Text Track element - HTML: Hypertext Markup Language

Web › HTML › Element › track

the html <track> element is used as a child of the media elements, <audio> and <video>.
...s.
... files) — web video text tracks.
...And 18 more matches

Element.attachShadow() - Web APIs

Web › API › Element › attachShadow

the element.attachshadow() method attaches a shadow dom tree to the specified element and returns a reference to its shadowroot.
... the element.attachshadow() method attaches a shadow dom tree to the specified element and returns a reference to its shadowroot.
... the element.attachshadow() method attaches a shadow dom tree to the specified element and returns a reference to its shadowroot.
...And 17 more matches

Element: fullscreenchange event - Web APIs

Web › API › Element › fullscreenchange event

the fullscreenchange event is fired immediately after an element switches into or out of full-screen mode.
... the fullscreenchange event is fired immediately after an element switches into or out of full-screen mode.
...vent is fired immediately after an element switches into or out of full-screen mode.
...And 17 more matches

Element.name - Web APIs

Web › API › Element › name

name gets or sets the name property of an element in the dom.
... name gets or sets the name property of an element in the dom.
... name gets or sets the name property of an element in the dom.
...And 17 more matches

Element.outerHTML - Web APIs

Web › API › Element › outerHTML

the outerhtml attribute of the element dom interface gets the serialized html fragment describing the element including its descendants.
... the outerhtml attribute of the element dom interface gets the serialized html fragment describing the element including its descendants.
... the outerhtml attribute of the element dom interface gets the serialized html fragment describing the element including its descendants.
...And 17 more matches

Element.requestFullscreen() - Web APIs

Web › API › Element › requestFullScreen

the element.requestfullscreen() method issues an asynchronous request to make the element be displayed in full-screen mode.
... the element.requestfullscreen() method issues an asynchronous request to make the element be displayed in full-screen mode.
... the element.requestfullscreen() method issues an asynchronous request to make the element be displayed in full-screen mode.
...And 17 more matches

Element.scrollHeight - Web APIs

Web › API › Element › scrollHeight

the element.scrollheight read-only property is a measurement of the height of an element's content, including content not visible on the screen due to overflow.
... the element.scrollheight read-only property is a measurement of the height of an element's content, including content not visible on the screen due to overflow.
... the element.scrollheight read-only property is a measurement of the height of an element's content, including content not visible on the screen due to overflow.
...And 17 more matches

HTMLLegendElement - Web APIs

Web › API › HTMLLegendElement

the htmllegendelement is an interface allowing to access properties of the <legend> elements.
... the htmllegendelement is an interface allowing to access properties of the <legend> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...And 17 more matches

HTMLSelectElement.add() - Web APIs

Web › API › HTMLSelectElement › add

the htmlselectelement.add() method adds an element to the collection of option elements for this select element.
... the htmlselectelement.add() method adds an element to the collection of option elements for this select element.
... the htmlselectelement.add() method adds an element to the collection of option elements for this select element.
...And 17 more matches

HTMLTrackElement - Web APIs

Web › API › HTMLTrackElement

the htmltrackelement interface represents an html <track> element within the dom.
... the htmltrackelement interface represents an html <track> element within the dom.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...And 17 more matches

NonDocumentTypeChildNode.previousElementSibling - Web APIs

Web › API › NonDocumentTypeChildNode › previousElementSibling

the nondocumenttypechildnode.previouselementsibling read-only property returns the element immediately prior to the specified one in its parent's children list, or null if the specified element is the first one in the list.
... the nondocumenttypechildnode.previouselementsibling read-only property returns the element immediately prior to the specified one in its parent's children list, or null if the specified element is the first one in the list.
... the nondocumenttypechildnode.previouselementsibling read-only property returns the element immediately prior to the specified one in its parent's children list, or null if the specified element is the first one in the list.
...And 17 more matches

SVGFESpecularLightingElement - Web APIs

Web › API › SVGFESpecularLightingElement

the svgfespecularlightingelement interface corresponds to the <fespecularlighting> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 17 more matches

SVGFETurbulenceElement - Web APIs

Web › API › SVGFETurbulenceElement

the svgfeturbulenceelement interface corresponds to the <feturbulence> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 17 more matches

SVGLineElement - Web APIs

Web › API › SVGLineElement

the svglineelement interface provides access to the properties of <line> elements, as well as methods to manipulate them.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 17 more matches

SVGMaskElement - Web APIs

Web › API › SVGMaskElement

the svgmaskelement interface provides access to the properties of <mask> elements, as well as methods to manipulate them.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 17 more matches

<details>: The Details disclosure element - HTML: Hypertext Markup Language

Web › HTML › Element › details

the html details element (<details>) creates a disclosure widget in which information is visible only when the widget is toggled into an "open" state.
... the html details element (<details>) creates a disclosure widget in which information is visible only when the widget is toggled into an "open" state.
...ment (<details>) creates a disclosure widget in which information is visible only when the widget is toggled into an "open" state.
...And 17 more matches

<rb>: The Ruby Base element - HTML: Hypertext Markup Language

Web › HTML › Element › rb

the html ruby base (<rb>) element is used to delimit the base text component of a <ruby> annotation, i.e.
... the html ruby base (<rb>) element is used to delimit the base text component of a <ruby> annotation, i.e.
... base text.
...And 17 more matches

AudioContext.createMediaElementSource() - Web APIs

Web › API › AudioContext › createMediaElementSource

the createmediaelementsource() method of the audiocontext interface is used to create a new mediaelementaudiosourcenode object, given an existing html <audio> or <video> element, the audio from which can then be played and manipulated.
... the createmediaelementsource() method of the audiocontext interface is used to create a new mediaelementaudiosourcenode object, given an existing html <audio> or <video> element, the audio from which can then be played and manipulated.
... the createmediaelementsource() method of the audiocontext interface is used to create a new mediaelementaudiosourcenode object, given an existing html <audio> or <video> element, the audio from which can then be played and manipulated.
...And 16 more matches

Document.mozSetImageElement() - Web APIs

Web › API › Document › mozSetImageElement

the document.mozsetimageelement() method changes the element being used as the css background for a background with a given background element id.
... the document.mozsetimageelement() method changes the element being used as the css background for a background with a given background element id.
... the document.mozsetimageelement() method changes the element being used as the css background for a background with a given background element id.
...And 16 more matches

HTMLBodyElement - Web APIs

Web › API › HTMLBodyElement

the htmlbodyelement interface provides special properties (beyond those inherited from the regular htmlelement interface) for manipulating <body> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 16 more matches

HTMLSourceElement - Web APIs

Web › API › HTMLSourceElement

the htmlsourceelement interface provides special properties (beyond the regular htmlelement object interface it also has available to it by inheritance) for manipulating <source> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 16 more matches

HTMLTableSectionElement - Web APIs

Web › API › HTMLTableSectionElement

the htmltablesectionelement interface provides special properties and methods (beyond the htmlelement interface it also has available to it by inheritance) for manipulating the layout and presentation of sections, that is headers, footers and bodies, in an html table.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 16 more matches

SVGEllipseElement - Web APIs

Web › API › SVGEllipseElement

the svgellipseelement interface provides access to the properties of <ellipse> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 16 more matches

SVGForeignObjectElement - Web APIs

Web › API › SVGForeignObjectElement

the svgforeignobjectelement interface provides access to the properties of <foreignobject> elements, as well as methods to manipulate them.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 16 more matches

SVGRadialGradientElement - Web APIs

Web › API › SVGRadialGradientElement

the svgradialgradientelement interface corresponds to the <radialgradient> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 16 more matches

<address>: The Contact Address element - HTML: Hypertext Markup Language

Web › HTML › Element › address

the html <address> element indicates that the enclosed html provides contact information for a person or people, or for an organization.
...ss> element indicates that the enclosed html provides contact information for a person or people, or for an organization.
...one https://github.com/mdn/interactive-examples and send us a pull request.
...And 16 more matches

<b>: The Bring Attention To element - HTML: Hypertext Markup Language

Web › HTML › Element › b

the html bring attention to element (<b>) is used to draw the reader's attention to the element's contents, which are not otherwise granted special importance.
... the html bring attention to element (<b>) is used to draw the reader's attention to the element's contents, which are not otherwise granted special importance.
...html bring attention to element (<b>) is used to draw the reader's attention to the element's contents, which are not otherwise granted special importance.
...And 16 more matches

<body>: The Document Body element - HTML: Hypertext Markup Language

Web › HTML › Element › body

the html <body> element represents the content of an html document.
... the html <body> element represents the content of an html document.
... the html <body> element represents the content of an html document.
...And 16 more matches

<dl>: The Description List element - HTML: Hypertext Markup Language

Web › HTML › Element › dl

the html <dl> element represents a description list.
... the html <dl> element represents a description list.
... the html <dl> element represents a description list.
...And 16 more matches

Document.getElementsByName() - Web APIs

Web › API › Document › getElementsByName

the getelementsbyname() method of the document object returns a nodelist collection of elements with a given name in the document.
... the getelementsbyname() method of the document object returns a nodelist collection of elements with a given name in the document.
... the getelementsbyname() method of the document object returns a nodelist collection of elements with a given name in the document.
...And 15 more matches

Element.matches() - Web APIs

Web › API › Element › matches

the matches() method checks to see if the element would be selected by the provided selectorstring -- in other words -- checks if the element "is" the selector.
... the matches() method checks to see if the element would be selected by the provided selectorstring -- in other words -- checks if the element "is" the selector.
...selectorstring); parameters selectorstring is a string representing the selector to test.
...And 15 more matches

HTMLLabelElement - Web APIs

Web › API › HTMLLabelElement

the htmllabelelement interface gives access to properties specific to <label> elements.
... the htmllabelelement interface gives access to properties specific to <label> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...And 15 more matches

HTMLMeterElement - Web APIs

Web › API › HTMLMeterElement

the html <meter> elements expose the htmlmeterelement interface, which provides special properties and methods (beyond the htmlelement object interface they also have available to them by inheritance) for manipulating the layout and presentation of <meter> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 15 more matches

HTMLStyleElement - Web APIs

Web › API › HTMLStyleElement

the htmlstyleelement interface represents a <style> element.
... the htmlstyleelement interface represents a <style> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...And 15 more matches

NonDocumentTypeChildNode.nextElementSibling - Web APIs

Web › API › NonDocumentTypeChildNode › nextElementSibling

the nondocumenttypechildnode.nextelementsibling read-only property returns the element immediately following the specified one in its parent's children list, or null if the specified element is the last one in the list.
... the nondocumenttypechildnode.nextelementsibling read-only property returns the element immediately following the specified one in its parent's children list, or null if the specified element is the last one in the list.
... the nondocumenttypechildnode.nextelementsibling read-only property returns the element immediately following the specified one in its parent's children list, or null if the specified element is the last one in the list.
...And 15 more matches

SVGFEDiffuseLightingElement - Web APIs

Web › API › SVGFEDiffuseLightingElement

the svgfediffuselightingelement interface corresponds to the <fediffuselighting> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 15 more matches

SVGFEDisplacementMapElement - Web APIs

Web › API › SVGFEDisplacementMapElement

the svgfedisplacementmapelement interface corresponds to the <fedisplacementmap> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 15 more matches

SVGFEDropShadowElement - Web APIs

Web › API › SVGFEDropShadowElement

the svgfedropshadowelement interface corresponds to the <fedropshadow> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 15 more matches

SVGGeometryElement - Web APIs

Web › API › SVGGeometryElement

the svggeometryelement interface represents svg elements whose rendering is defined by geometry with an equivalent path, and which can be filled and stroked.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 15 more matches

<article>: The Article Contents element - HTML: Hypertext Markup Language

Web › HTML › Element › article

the html <article> element represents a self-contained composition in a document, page, application, or site, which is intended to be independently distributable or reusable (e.g., in syndication).
...teractive example is stored in a github repository.
...ext of each article one after another as the reader scrolls, each post would be contained in an <article> element, possibly with one or more <section>s within.
...And 15 more matches

<button>: The Button element - HTML: Hypertext Markup Language

Web › HTML › Element › button

the html <button> element represents a clickable button, used to submit forms or anywhere in a document for accessible, standard button functionality.
...nge buttons’ appearance with css.
...amples and send us a pull request.
...And 15 more matches

<u>: The Unarticulated Annotation (Underline) element - HTML: Hypertext Markup Language

Web › HTML › Element › u

the html unarticulated annotation element (<u>) represents a span of inline text which should be rendered in a way that indicates that it has a non-textual annotation.
... the html unarticulated annotation element (<u>) represents a span of inline text which should be rendered in a way that indicates that it has a non-textual annotation.
... the html unarticulated annotation element (<u>) represents a span of inline text which should be rendered in a way that indicates that it has a non-textual annotation.
...And 15 more matches

Select an element - Firefox Developer Tools

Tools › Page Inspector › How to › Select an element

the selected element is the element in the page that the inspector is currently focused on.
... the selected element is the element in the page that the inspector is currently focused on.
... the selected element is the element in the page that the inspector is currently focused on.
...And 14 more matches

DocumentOrShadowRoot.elementFromPoint() - Web APIs

Web › API › DocumentOrShadowRoot › elementFromPoint

the elementfrompoint() method—available on both the document and shadowroot objects—returns the topmost element at the specified coordinates (relative to the viewport).
... the elementfrompoint() method—available on both the document and shadowroot objects—returns the topmost element at the specified coordinates (relative to the viewport).
... the elementfrompoint() method—available on both the document and shadowroot objects—returns the topmost element at the specified coordinates (relative to the viewport).
...And 14 more matches

ElementCSSInlineStyle.style - Web APIs

Web › API › ElementCSSInlineStyle › style

the style property is used to get as well as set the inline style of an element.
... the style property is used to get as well as set the inline style of an element.
... the style property is used to get as well as set the inline style of an element.
...And 14 more matches

HTMLHtmlElement - Web APIs

Web › API › HTMLHtmlElement

the htmlhtmlelement interface serves as the root node for a given html document.
... the htmlhtmlelement interface serves as the root node for a given html document.
... the htmlhtmlelement interface serves as the root node for a given html document.
...And 14 more matches

HTMLHyperlinkElementUtils - Web APIs

Web › API › HTMLHyperlinkElementUtils

the htmlhyperlinkelementutils mixin defines utility methods and properties to work with htmlanchorelement and htmlareaelement.
... the htmlhyperlinkelementutils mixin defines utility methods and properties to work with htmlanchorelement and htmlareaelement.
... the htmlhyperlinkelementutils mixin defines utility methods and properties to work with htmlanchorelement and htmlareaelement.
...And 14 more matches

HTMLMediaElement.load() - Web APIs

Web › API › HTMLMediaElement › load

the htmlmediaelement method load() resets the media element to its initial state and begins the process of selecting a media source and loading the media in preparation for playback to begin at the beginning.
... the htmlmediaelement method load() resets the media element to its initial state and begins the process of selecting a media source and loading the media in preparation for playback to begin at the beginning.
...) resets the media element to its initial state and begins the process of selecting a media source and loading the media in preparation for playback to begin at the beginning.
...And 14 more matches

HTMLSelectElement.selectedOptions - Web APIs

Web › API › HTMLSelectElement › selectedOptions

the read-only htmlselectelement property selectedoptions contains a list of the <option> elements contained within the <select> element that are currently selected.
... the read-only htmlselectelement property selectedoptions contains a list of the <option> elements contained within the <select> element that are currently selected.
... the read-only htmlselectelement property selectedoptions contains a list of the <option> elements contained within the <select> element that are currently selected.
...And 14 more matches

ParentNode.firstElementChild - Web APIs

Web › API › ParentNode › firstElementChild

the parentnode.firstelementchild read-only property returns the object's first child element, or null if there are no child elements.
... the parentnode.firstelementchild read-only property returns the object's first child element, or null if there are no child elements.
...property returns the object's first child element, or null if there are no child elements.
...And 14 more matches

SVGFEGaussianBlurElement - Web APIs

Web › API › SVGFEGaussianBlurElement

the svgfegaussianblurelement interface corresponds to the <fegaussianblur> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 14 more matches

SVGGlyphRefElement - Web APIs

Web › API › SVGGlyphRefElement

the svgglyphrefelement interface corresponds to the <glyphref> elements.
...t interface corresponds to the <glyphref> elements.
...op: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a xlink:href="/docs/web/api/svgglyphrefelement" target="_top"><rect x="1" y="1" width="180" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="91" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgglyphrefelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent, svgelement and implements properties from svgurireference and svgstylable.
...And 14 more matches

SVGLinearGradientElement - Web APIs

Web › API › SVGLinearGradientElement

the svglineargradientelement interface corresponds to the <lineargradient> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 14 more matches

Window.customElements - Web APIs

Web › API › Window › customElements

the customelements read-only property of the window interface returns a reference to the customelementregistry object, which can be used to register new custom elements and get information about previously registered custom elements.
... the customelements read-only property of the window interface returns a reference to the customelementregistry object, which can be used to register new custom elements and get information about previously registered custom elements.
...stomelements read-only property of the window interface returns a reference to the customelementregistry object, which can be used to register new custom elements and get information about previously registered custom elements.
...And 14 more matches

Adding Event Handlers to XBL-defined Elements - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Adding Event Handlers to XBL-defined Elements

« previousnext » next, we'll find out how to add event handlers to xbl-defined elements.
... « previousnext » next, we'll find out how to add event handlers to xbl-defined elements.
... « previousnext » next, we'll find out how to add event handlers to xbl-defined elements.
...And 13 more matches

XForms Repeat Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Repeat

introduction a repeat element contains markup and is itself bound to a nodeset in an instance document (see the spec).
... introduction a repeat element contains markup and is itself bound to a nodeset in an instance document (see the spec).
...tive xpath expressions in that set of repeated markup.
...And 13 more matches

JS_SetElement

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS SetElement

assign a value to a numeric property of an object.
... assign a value to a numeric property of an object.
... assign a value to a numeric property of an object.
...And 13 more matches

Element.className - Web APIs

Web › API › Element › className

the classname property of the element interface gets and sets the value of the class attribute of the specified element.
... the classname property of the element interface gets and sets the value of the class attribute of the specified element.
... the classname property of the element interface gets and sets the value of the class attribute of the specified element.
...And 13 more matches

Element: click event - Web APIs

Web › API › Element › click event

an element receives a click event when a pointing device button (such as a mouse's primary mouse button) is both pressed and released while the pointer is located inside the element.
... an element receives a click event when a pointing device button (such as a mouse's primary mouse button) is both pressed and released while the pointer is located inside the element.
... an element receives a click event when a pointing device button (such as a mouse's primary mouse button) is both pressed and released while the pointer is located inside the element.
...And 13 more matches

Element.closest() - Web APIs

Web › API › Element › closest

the closest() method traverses the element and its parents (heading toward the document root) until it finds a node that matches the provided selector string.
... the closest() method traverses the element and its parents (heading toward the document root) until it finds a node that matches the provided selector string.
... the closest() method traverses the element and its parents (heading toward the document root) until it finds a node that matches the provided selector string.
...And 13 more matches

Element.msZoomTo() - Web APIs

Web › API › Element › msZoomTo

non-standard this feature is non-standard and is not on a standards track.
... non-standard this feature is non-standard and is not on a standards track.
...ibilities between implementations and the behavior may change in the future.
...And 13 more matches

HTMLElement.offsetHeight - Web APIs

Web › API › HTMLElement › offsetHeight

the htmlelement.offsetheight read-only property returns the height of an element, including vertical padding and borders, as an integer.
... the htmlelement.offsetheight read-only property returns the height of an element, including vertical padding and borders, as an integer.
... the htmlelement.offsetheight read-only property returns the height of an element, including vertical padding and borders, as an integer.
...And 13 more matches

HTMLEmbedElement - Web APIs

Web › API › HTMLEmbedElement

the htmlembedelement interface provides special properties (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating <embed> elements.
... the htmlembedelement interface provides special properties (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating <embed> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...And 13 more matches

HTMLFormElement.length - Web APIs

Web › API › HTMLFormElement › length

the htmlformelement.length read-only property returns the number of controls in the <form> element.
... the htmlformelement.length read-only property returns the number of controls in the <form> element.
... the htmlformelement.length read-only property returns the number of controls in the <form> element.
...And 13 more matches

HTMLImageElement.x - Web APIs

Web › API › HTMLImageElement › x

the read-only htmlimageelement property x indicates the x-coordinate of the <img> element's left border edge relative to the root element's origin.
... the read-only htmlimageelement property x indicates the x-coordinate of the <img> element's left border edge relative to the root element's origin.
...relative to the root element's origin.
...And 13 more matches

HTMLImageElement.y - Web APIs

Web › API › HTMLImageElement › y

the read-only htmlimageelement property y indicates the y-coordinate of the <img> element's top border edge relative to the root element's origin.
... the read-only htmlimageelement property y indicates the y-coordinate of the <img> element's top border edge relative to the root element's origin.
...relative to the root element's origin.
...And 13 more matches

HTMLLIElement - Web APIs

Web › API › HTMLLIElement

the htmllielement interface exposes specific properties and methods (beyond those defined by regular htmlelement interface it also has available to it by inheritance) for manipulating list elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 13 more matches

HTMLTableColElement - Web APIs

Web › API › HTMLTableColElement

the htmltablecolelement interface provides special properties (beyond the htmlelement interface it also has available to it inheritance) for manipulating single or grouped table column elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 13 more matches

Recording a media element - Web APIs

Web › API › MediaStream Recording API › Recording a media element

while the article using the mediastream recording api demonstrates using the mediarecorder interface to capture a mediastream generated by a hardware device, as returned by navigator.mediadevices.getusermedia(), you can also use an html media element (namely <audio> or <video>) as the source of the mediastream to be recorded.
... of the html.
...o ensure that the sound from the user's microphone isn't output to their speakers, causing an ugly feedback loop.
...And 13 more matches

ParentNode.childElementCount - Web APIs

Web › API › ParentNode › childElementCount

the parentnode.childelementcount read-only property returns an unsigned long representing the number of child elements of the given element.
... the parentnode.childelementcount read-only property returns an unsigned long representing the number of child elements of the given element.
...y returns an unsigned long representing the number of child elements of the given element.
...And 13 more matches

SVGFEMorphologyElement - Web APIs

Web › API › SVGFEMorphologyElement

the svgfemorphologyelement interface corresponds to the <femorphology> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 13 more matches

SVGTextPathElement - Web APIs

Web › API › SVGTextPathElement

the svgtextpathelement interface corresponds to the <textpath> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 13 more matches

<canvas>: The Graphics Canvas element - HTML: Hypertext Markup Language

Web › HTML › Element › canvas

use the html <canvas> element with either the canvas scripting api or the webgl api to draw graphics and animations.
... use the html <canvas> element with either the canvas scripting api or the webgl api to draw graphics and animations.
... use the html <canvas> element with either the canvas scripting api or the webgl api to draw graphics and animations.
...And 13 more matches

<em>: The Emphasis element - HTML: Hypertext Markup Language

Web › HTML › Element › em

the html <em> element marks text that has stress emphasis.
... the html <em> element marks text that has stress emphasis.
...itory.
...And 13 more matches

<output>: The Output element - HTML: Hypertext Markup Language

Web › HTML › Element › output

the html output element (<output>) is a container element into which a site or app can inject the results of a calculation or the outcome of a user action.
... the html output element (<output>) is a container element into which a site or app can inject the results of a calculation or the outcome of a user action.
...ent into which a site or app can inject the results of a calculation or the outcome of a user action.
...And 13 more matches

<section>: The Generic Section element - HTML: Hypertext Markup Language

Web › HTML › Element › section

the html <section> element represents a standalone section — which doesn't have a more specific semantic element to represent it — contained within an html document.
...t to represent it — contained within an html document.
...have a heading.
...And 13 more matches

<td>: The Table Data Cell element - HTML: Hypertext Markup Language

Web › HTML › Element › td

the html <td> element defines a cell of a table that contains data.
...n a github repository.
...to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 13 more matches

TypedArray.BYTES_PER_ELEMENT - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › BYTES PER ELEMENT

the typedarray.bytes_per_element property represents the size in bytes of each element in an typed array.
... the typedarray.bytes_per_element property represents the size in bytes of each element in an typed array.
...ute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 13 more matches

JS_DefineElement

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS DefineElement

creates a numeric property on a specified object.
... creates a numeric property on a specified object.
..., uint32_t index, js::handlevalue value, unsigned attrs, jsnative getter = nullptr, jsnative setter = nullptr); bool js_defineelement(jscontext *cx, js::handleobject obj, uint32_t index, js::handleobject value, unsigned attrs, jsnative getter = nullptr, jsnative setter = nullptr); bool js_defineelement(jscontext *cx, js::handleobject obj, uint32_t index, js::handlestring value, unsigned attrs, jsnative getter = nullptr, jsnative setter = nullptr); bool js_defineelement(jscontext *cx, js::handleobject obj, uint32_t index, int32_t value, unsigned attrs, jsnative getter = nullptr, jsnative setter...
...And 12 more matches

JS_DeleteElement

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS DeleteElement

removes a specified element or numeric property from an object.
... removes a specified element or numeric property from an object.
... removes a specified element or numeric property from an object.
...And 12 more matches

JS_GetElement

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS GetElement

find a specified numeric property of an object and return its current value.
...ntax bool js_getelement(jscontext *cx, js::handleobject obj, uint32_t index, js::mutablehandlevalue vp); name type description cx jscontext * the context in which to perform the property lookup.
...ect obj, uint32_t index, js::mutablehandlevalue vp); name type description cx jscontext * the context in which to perform the property lookup.
...And 12 more matches

JS_HasElement

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS HasElement

determine whether a javascript array has an element in the specified index.
... determine whether a javascript array has an element in the specified index.
...the specified index.
...And 12 more matches

Determining the dimensions of elements - Web APIs

Web › API › CSS Object Model › Determining the dimensions of elements

there are several properties you can look at in order to determine the width and height of elements, and it can be tricky to determine which is the right one for your needs.
... there are several properties you can look at in order to determine the width and height of elements, and it can be tricky to determine which is the right one for your needs.
...ky to determine which is the right one for your needs.
...And 12 more matches

DocumentOrShadowRoot.elementsFromPoint() - Web APIs

Web › API › DocumentOrShadowRoot › elementsFromPoint

the elementsfrompoint() method of the documentorshadowroot interface returns an array of all elements at the specified coordinates (relative to the viewport).
... the elementsfrompoint() method of the documentorshadowroot interface returns an array of all elements at the specified coordinates (relative to the viewport).
... the elementsfrompoint() method of the documentorshadowroot interface returns an array of all elements at the specified coordinates (relative to the viewport).
...And 12 more matches

Element.getBoundingClientRect() - Web APIs

Web › API › Element › getBoundingClientRect

the element.getboundingclientrect() method returns the size of an element and its position relative to the viewport.
... the element.getboundingclientrect() method returns the size of an element and its position relative to the viewport.
... the element.getboundingclientrect() method returns the size of an element and its position relative to the viewport.
...And 12 more matches

HTMLBaseElement - Web APIs

Web › API › HTMLBaseElement

the htmlbaseelement interface contains the base uri for a document.
... the htmlbaseelement interface contains the base uri for a document.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...And 12 more matches

HTMLDialogElement - Web APIs

Web › API › HTMLDialogElement

the htmldialogelement interface provides methods to manipulate <dialog> elements.
... the htmldialogelement interface provides methods to manipulate <dialog> elements.
....
...And 12 more matches

HTMLHRElement - Web APIs

Web › API › HTMLHRElement

the htmlhrelement interface provides special properties (beyond those of the htmlelement interface it also has available to it by inheritance) for manipulating <hr> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 12 more matches

HTMLIsIndexElement - Web APIs

Web › API › HTMLIsIndexElement

the htmlisindexelement interface provides special properties (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating <isindex> elements.
... the htmlisindexelement interface provides special properties (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating <isindex> elements.
... the htmlisindexelement interface provides special properties (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating <isindex> elements.
...And 12 more matches

HTMLOListElement - Web APIs

Web › API › HTMLOListElement

the htmlolistelement interface provides special properties (beyond those defined on the regular htmlelement interface it also has available to it by inheritance) for manipulating ordered list elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 12 more matches

HTMLProgressElement - Web APIs

Web › API › HTMLProgressElement

the htmlprogresselement interface provides special properties and methods (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating the layout and presentation of <progress> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 12 more matches

HTMLTableElement.insertRow() - Web APIs

Web › API › HTMLTableElement › insertRow

the htmltableelement.insertrow() method inserts a new row (<tr>) in a given <table>, and returns a reference to the new row.
... the htmltableelement.insertrow() method inserts a new row (<tr>) in a given <table>, and returns a reference to the new row.
... the htmltableelement.insertrow() method inserts a new row (<tr>) in a given <table>, and returns a reference to the new row.
...And 12 more matches

SVGGraphicsElement - Web APIs

Web › API › SVGGraphicsElement

the svggraphicselement interface represents svg elements whose primary purpose is to directly render graphics into a group.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 12 more matches

Web › HTML › Element › meta

the html <meta> element represents metadata that cannot be represented by other html meta-related elements, like <base>, <link>, <script>, <style> or <title>.
... the html <meta> element represents metadata that cannot be represented by other html meta-related elements, like <base>, <link>, <script>, <style> or <title>.
... the html <meta> element represents metadata that cannot be represented by other html meta-related elements, like <base>, <link>, <script>, <style> or <title>.
...And 12 more matches

<plaintext>: The Plain Text element (Deprecated) - HTML: Hypertext Markup Language

Web › HTML › Element › plaintext

the html plaintext element (<plaintext>) renders everything following the start tag as raw text, ignoring any following html.
... the html plaintext element (<plaintext>) renders everything following the start tag as raw text, ignoring any following html.
...llowing the start tag as raw text, ignoring any following html.
...And 12 more matches

Web › HTML › Element › script

the html <script> element is used to embed executable code or data; this is typically used to embed or refer to javascript code.
... the html <script> element is used to embed executable code or data; this is typically used to embed or refer to javascript code.
...avascript code.
...And 12 more matches

Web › HTML › Element › style

the html <style> element contains style information for a document, or part of a document.
... the html <style> element contains style information for a document, or part of a document.
...ains style information for a document, or part of a document.
...And 12 more matches

XForms Select1 Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Select1

introduction allows the user to choose a single value from a list of pre-defined values (see the spec).
... introduction allows the user to choose a single value from a list of pre-defined values (see the spec).
... introduction allows the user to choose a single value from a list of pre-defined values (see the spec).
...And 11 more matches

JS_DeleteElement2

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS DeleteElement2

obsolete since jsapi 39this feature is obsolete.
... obsolete since jsapi 39this feature is obsolete.
... obsolete since jsapi 39this feature is obsolete.
...And 11 more matches

Select and highlight elements - Firefox Developer Tools

Tools › Page Inspector › How to › Select and highlight elements

the selected element is the element in the page that the inspector is currently focused on.
... the selected element is the element in the page that the inspector is currently focused on.
... the selected element is the element in the page that the inspector is currently focused on.
...And 11 more matches

Document.documentElement - Web APIs

Web › API › Document › documentElement

document.documentelement returns the element that is the root element of the document (for example, the <html> element for html documents).
... document.documentelement returns the element that is the root element of the document (for example, the <html> element for html documents).
... document.documentelement returns the element that is the root element of the document (for example, the <html> element for html documents).
...And 11 more matches

Element.attributes - Web APIs

Web › API › Element › attributes

the element.attributes property returns a live collection of all attribute nodes registered to the specified node.
... the element.attributes property returns a live collection of all attribute nodes registered to the specified node.
...live collection of all attribute nodes registered to the specified node.
...And 11 more matches

Element.insertAdjacentHTML() - Web APIs

Web › API › Element › insertAdjacentHTML

the insertadjacenthtml() method of the element interface parses the specified text as html or xml and inserts the resulting nodes into the dom tree at a specified position.
... the insertadjacenthtml() method of the element interface parses the specified text as html or xml and inserts the resulting nodes into the dom tree at a specified position.
... the insertadjacenthtml() method of the element interface parses the specified text as html or xml and inserts the resulting nodes into the dom tree at a specified position.
...And 11 more matches

Element.shadowRoot - Web APIs

Web › API › Element › shadowRoot

the element.shadowroot read-only property represents the shadow root hosted by the element.
... the element.shadowroot read-only property represents the shadow root hosted by the element.
... the element.shadowroot read-only property represents the shadow root hosted by the element.
...And 11 more matches

HTMLImageElement.loading - Web APIs

Web › API › HTMLImageElement › loading

the htmlimageelement property loading is a string whose value provides a hint to the user agent that tells the browser how to handle loading images which are currently outside the window's visual viewport.
...ading is a string whose value provides a hint to the user agent that tells the browser how to handle loading images which are currently outside the window's visual viewport.
...lue provides a hint to the user agent that tells the browser how to handle loading images which are currently outside the window's visual viewport.
...And 11 more matches

HTMLMapElement - Web APIs

Web › API › HTMLMapElement

the htmlmapelement interface provides special properties and methods (beyond those of the regular object htmlelement interface it also has available to it by inheritance) for manipulating the layout and presentation of map elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 11 more matches

HTMLMediaElement.audioTracks - Web APIs

Web › API › HTMLMediaElement › audioTracks

the read-only audiotracks property on htmlmediaelement objects returns an audiotracklist object listing all of the audiotrack objects representing the media element's audio tracks.
... the read-only audiotracks property on htmlmediaelement objects returns an audiotracklist object listing all of the audiotrack objects representing the media element's audio tracks.
... the read-only audiotracks property on htmlmediaelement objects returns an audiotracklist object listing all of the audiotrack objects representing the media element's audio tracks.
...And 11 more matches

HTMLParamElement - Web APIs

Web › API › HTMLParamElement

the htmlparamelement interface provides special properties (beyond those of the regular htmlelement object interface it inherits) for manipulating <param> elements, representing a pair of a key and a value that acts as a parameter for an <object> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 11 more matches

HTMLTitleElement - Web APIs

Web › API › HTMLTitleElement

the htmltitleelement interface contains the title for a document.
... the htmltitleelement interface contains the title for a document.
... the htmltitleelement interface contains the title for a document.
...And 11 more matches

HTMLVideoElement.videoHeight - Web APIs

Web › API › HTMLVideoElement › videoHeight

the htmlvideoelement interface's read-only videoheight property indicates the intrinsic height of the video, expressed in css pixels.
... the htmlvideoelement interface's read-only videoheight property indicates the intrinsic height of the video, expressed in css pixels.
... the htmlvideoelement interface's read-only videoheight property indicates the intrinsic height of the video, expressed in css pixels.
...And 11 more matches

HTMLVideoElement.videoWidth - Web APIs

Web › API › HTMLVideoElement › videoWidth

the htmlvideoelement interface's read-only videowidth property indicates the intrinsic width of the video, expressed in css pixels.
... the htmlvideoelement interface's read-only videowidth property indicates the intrinsic width of the video, expressed in css pixels.
... the htmlvideoelement interface's read-only videowidth property indicates the intrinsic width of the video, expressed in css pixels.
...And 11 more matches

SVGFEBlendElement - Web APIs

Web › API › SVGFEBlendElement

the svgfeblendelement interface corresponds to the <feblend> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 11 more matches

SVGFEColorMatrixElement - Web APIs

Web › API › SVGFEColorMatrixElement

the svgfecolormatrixelement interface corresponds to the <fecolormatrix> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 11 more matches

SVGFECompositeElement - Web APIs

Web › API › SVGFECompositeElement

the svgfecompositeelement interface corresponds to the <fecomposite> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 11 more matches

SVGFEOffsetElement - Web APIs

Web › API › SVGFEOffsetElement

the svgfeoffsetelement interface corresponds to the <feoffset> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 11 more matches

SVGFEPointLightElement - Web APIs

Web › API › SVGFEPointLightElement

the svgfepointlightelement interface corresponds to the <fepointlight> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 11 more matches

SVGGradientElement - Web APIs

Web › API › SVGGradientElement

the svggradient interface is a base interface used by svglineargradientelement and svgradialgradientelement.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 11 more matches

SVGStyleElement - Web APIs

Web › API › SVGStyleElement

svg style interface the svgstyleelement interface corresponds to the svg <style> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 11 more matches

<div>: The Content Division element - HTML: Hypertext Markup Language

Web › HTML › Element › div

the html content division element (<div>) is the generic container for flow content.
...ent division element (<div>) is the generic container for flow content.
...ot inherently represent anything.
...And 11 more matches

<dt>: The Description Term element - HTML: Hypertext Markup Language

Web › HTML › Element › dt

the html <dt> element specifies a term in a description or definition list, and as such must be used inside a <dl> element.
... the html <dt> element specifies a term in a description or definition list, and as such must be used inside a <dl> element.
... the html <dt> element specifies a term in a description or definition list, and as such must be used inside a <dl> element.
...And 11 more matches

<fieldset>: The Field Set element - HTML: Hypertext Markup Language

Web › HTML › Element › fieldset

the html <fieldset> element is used to group several controls as well as labels (<label>) within a web form.
... the html <fieldset> element is used to group several controls as well as labels (<label>) within a web form.
...s as well as labels (<label>) within a web form.
...And 11 more matches

<ol>: The Ordered List element - HTML: Hypertext Markup Language

Web › HTML › Element › ol

the html <ol> element represents an ordered list of items — typically rendered as a numbered list.
... the html <ol> element represents an ordered list of items — typically rendered as a numbered list.
...ordered list of items — typically rendered as a numbered list.
...And 11 more matches

<option>: The HTML Option element - HTML: Hypertext Markup Language

Web › HTML › Element › option

the html <option> element is used to define an item contained in a <select>, an <optgroup>, or a <datalist> element.
...ample is stored in a github repository.
...e to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 11 more matches

<strong>: The Strong Importance element - HTML: Hypertext Markup Language

Web › HTML › Element › strong

the html strong importance element (<strong>) indicates that its contents have strong importance, seriousness, or urgency.
...repository.
... interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 11 more matches

JS_LookupElement

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS LookupElement

obsolete since jsapi 37this feature is obsolete.
...ontext in which to look up the property.
...uest.
...And 10 more matches

Element.insertAdjacentText() - Web APIs

Web › API › Element › insertAdjacentText

the insertadjacenttext() method of the element interface inserts a given text node at a given position relative to the element it is invoked upon.
... the insertadjacenttext() method of the element interface inserts a given text node at a given position relative to the element it is invoked upon.
... the insertadjacenttext() method of the element interface inserts a given text node at a given position relative to the element it is invoked upon.
...And 10 more matches

Element.querySelectorAll() - Web APIs

Web › API › Element › querySelectorAll

the element method queryselectorall() returns a static (not live) nodelist representing a list of elements matching the specified group of selectors which are descendants of the element on which the method was called.
... the element method queryselectorall() returns a static (not live) nodelist representing a list of elements matching the specified group of selectors which are descendants of the element on which the method was called.
...ement on which the method was called.
...And 10 more matches

Element.scrollIntoViewIfNeeded() - Web APIs

Web › API › Element › scrollIntoViewIfNeeded

the element.scrollintoviewifneeded() method scrolls the current element into the visible area of the browser window if it's not already within the visible area of the browser window.
... the element.scrollintoviewifneeded() method scrolls the current element into the visible area of the browser window if it's not already within the visible area of the browser window.
... the element.scrollintoviewifneeded() method scrolls the current element into the visible area of the browser window if it's not already within the visible area of the browser window.
...And 10 more matches

HTMLHeadElement - Web APIs

Web › API › HTMLHeadElement

the htmlheadelement interface contains the descriptive information, or metadata, for a document.
... the htmlheadelement interface contains the descriptive information, or metadata, for a document.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...And 10 more matches

HTMLInputElement.setSelectionRange() - Web APIs

Web › API › HTMLInputElement › setSelectionRange

the htmlinputelement.setselectionrange() method sets the start and end positions of the current text selection in an <input> or <textarea> element.
...nd end positions of the current text selection in an <input> or <textarea> element.
...t accordingly to the whatwg forms spec selectionstart, selectionend properties and setselectionrange method apply only to inputs of types text, search, url, tel and password.
...And 10 more matches

HTMLMediaElement.error - Web APIs

Web › API › HTMLMediaElement › error

the htmlmediaelement.error is the mediaerror object for the most recent error, or null if there has not been an error.
... the htmlmediaelement.error is the mediaerror object for the most recent error, or null if there has not been an error.
... the htmlmediaelement.error is the mediaerror object for the most recent error, or null if there has not been an error.
...And 10 more matches

HTMLTableRowElement.insertCell() - Web APIs

Web › API › HTMLTableRowElement › insertCell

the htmltablerowelement.insertcell() method inserts a new cell (<td>) into a table row (<tr>) and returns a reference to the cell.
... the htmltablerowelement.insertcell() method inserts a new cell (<td>) into a table row (<tr>) and returns a reference to the cell.
... the htmltablerowelement.insertcell() method inserts a new cell (<td>) into a table row (<tr>) and returns a reference to the cell.
...And 10 more matches

MediaElementAudioSourceNode() - Web APIs

Web › API › MediaElementAudioSourceNode › MediaElementAudioSourceNode

the mediaelementaudiosourcenode() constructor creates a new mediaelementaudiosourcenode object instance.
... the mediaelementaudiosourcenode() constructor creates a new mediaelementaudiosourcenode object instance.
... the mediaelementaudiosourcenode() constructor creates a new mediaelementaudiosourcenode object instance.
...And 10 more matches

ParentNode.lastElementChild - Web APIs

Web › API › ParentNode › lastElementChild

the parentnode.lastelementchild read-only property returns the object's last child element or null if there are no child elements.
... the parentnode.lastelementchild read-only property returns the object's last child element or null if there are no child elements.
...perty returns the object's last child element or null if there are no child elements.
...And 10 more matches

<a>: The Anchor element - HTML: Hypertext Markup Language

Web › HTML › Element › a

the html <a> element (or anchor element), with its href attribute, creates a hyperlink to web pages, files, email addresses, locations in the same page, or anything else a url can address.
...s, files, email addresses, locations in the same page, or anything else a url can address.
...wsing context of the current one.
...And 10 more matches

<br>: The Line Break element - HTML: Hypertext Markup Language

Web › HTML › Element › br

the html <br> element produces a line break in text (carriage-return).
... break in text (carriage-return).
... the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 10 more matches

Web › HTML › Element › iframe

the html inline frame element (<iframe>) represents a nested browsing context, embedding another html page into the current one.
...ry and other computing resources.
...nt, interactive content, palpable content.
...And 10 more matches

<nextid>: The NeXT ID element (Obsolete) - HTML: Hypertext Markup Language

Web › HTML › Element › nextid

<nextid> is an obsolete html element that served to enable the next web designing tool to generate automatic name labels for its anchors.
... <nextid> is an obsolete html element that served to enable the next web designing tool to generate automatic name labels for its anchors.
... <nextid> is an obsolete html element that served to enable the next web designing tool to generate automatic name labels for its anchors.
...And 10 more matches

<rp>: The Ruby Fallback Parenthesis element - HTML: Hypertext Markup Language

Web › HTML › Element › rp

the html ruby fallback parenthesis (<rp>) element is used to provide fall-back parentheses for browsers that do not support display of ruby annotations using the <ruby> element.
... the html ruby fallback parenthesis (<rp>) element is used to provide fall-back parentheses for browsers that do not support display of ruby annotations using the <ruby> element.
... the html ruby fallback parenthesis (<rp>) element is used to provide fall-back parentheses for browsers that do not support display of ruby annotations using the <ruby> element.
...And 10 more matches

<tfoot>: The Table Foot element - HTML: Hypertext Markup Language

Web › HTML › Element › tfoot

the html <tfoot> element defines a set of rows summarizing the columns of the table.
... the html <tfoot> element defines a set of rows summarizing the columns of the table.
...n a github repository.
...And 10 more matches

<thead>: The Table Head element - HTML: Hypertext Markup Language

Web › HTML › Element › thead

the html <thead> element defines a set of rows defining the head of the columns of the table.
... <thead> element defines a set of rows defining the head of the columns of the table.
...his interactive example is stored in a github repository.
...And 10 more matches

<tt>: The Teletype Text element (obsolete) - HTML: Hypertext Markup Language

Web › HTML › Element › tt

the obsolete html teletype text element (<tt>) creates inline text which is presented using the user agent's default monospace font face.
... the obsolete html teletype text element (<tt>) creates inline text which is presented using the user agent's default monospace font face.
...ent's default monospace font face.
...And 10 more matches

<ul>: The Unordered List element - HTML: Hypertext Markup Language

Web › HTML › Element › ul

the html <ul> element represents an unordered list of items, typically rendered as a bulleted list.
... the html <ul> element represents an unordered list of items, typically rendered as a bulleted list.
... unordered list of items, typically rendered as a bulleted list.
...And 10 more matches

XForms Select Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Select

introduction allows the user to choose one or more selections from a list of pre-defined items (see the spec).
... introduction allows the user to choose one or more selections from a list of pre-defined items (see the spec).
... introduction allows the user to choose one or more selections from a list of pre-defined items (see the spec).
...And 9 more matches

CustomElementRegistry.whenDefined() - Web APIs

Web › API › CustomElementRegistry › whenDefined

the whendefined() method of the customelementregistry interface returns a promise that resolves when the named element is defined.
... the whendefined() method of the customelementregistry interface returns a promise that resolves when the named element is defined.
... the whendefined() method of the customelementregistry interface returns a promise that resolves when the named element is defined.
...And 9 more matches

Document.registerElement() - Web APIs

Web › API › Document › registerElement

warning: document.registerelement() is deprecated in favor of customelements.define().
... warning: document.registerelement() is deprecated in favor of customelements.define().
... warning: document.registerelement() is deprecated in favor of customelements.define().
...And 9 more matches

Element.scrollTop - Web APIs

Web › API › Element › scrollTop

the element.scrolltop property gets or sets the number of pixels that an element's content is scrolled vertically.
... the element.scrolltop property gets or sets the number of pixels that an element's content is scrolled vertically.
... the element.scrolltop property gets or sets the number of pixels that an element's content is scrolled vertically.
...And 9 more matches

Element.setCapture() - Web APIs

Web › API › Element › setCapture

call this method during the handling of a mousedown event to retarget all mouse events to this element until the mouse button is released or document.releasecapture() is called.
... call this method during the handling of a mousedown event to retarget all mouse events to this element until the mouse button is released or document.releasecapture() is called.
... call this method during the handling of a mousedown event to retarget all mouse events to this element until the mouse button is released or document.releasecapture() is called.
...And 9 more matches

HTMLBaseFontElement - Web APIs

Web › API › HTMLBaseFontElement

the htmlbasefontelement interface provides special properties (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating <basefont> elements.
... the htmlbasefontelement interface provides special properties (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating <basefont> elements.
... the htmlbasefontelement interface provides special properties (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating <basefont> elements.
...And 9 more matches

HTMLDivElement - Web APIs

Web › API › HTMLDivElement

the htmldivelement interface provides special properties (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating <div> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 9 more matches

HTMLElement.hidden - Web APIs

Web › API › HTMLElement › hidden

the htmlelement property hidden is a boolean which is true if the element is hidden; otherwise the value is false.
... the htmlelement property hidden is a boolean which is true if the element is hidden; otherwise the value is false.
... content that isn't yet relevant but may be needed later content that was previously needed but is not any longer content that is reused by other parts of the page in a template-like fashion creating an offscreen canvas as a drawing buffer inappropriate use cases include: hiding panels in a tabbed dialog box hiding content in one presentation while intending it to be visible in others elements that are not hidden must not link to elements which are.
...And 9 more matches

HTMLHeadingElement - Web APIs

Web › API › HTMLHeadingElement

the htmlheadingelement interface represents the different heading elements, <h1> through <h6>.
... the htmlheadingelement interface represents the different heading elements, <h1> through <h6>.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...And 9 more matches

HTMLMediaElement.srcObject - Web APIs

Web › API › HTMLMediaElement › srcObject

the srcobject property of the htmlmediaelement interface sets or returns the object which serves as the source of the media associated with the htmlmediaelement.
... the source of the media associated with the htmlmediaelement.
... be a mediastream, a mediasource, a blob, or a file (which inherits from blob).
...And 9 more matches

HTMLMediaElement.textTracks - Web APIs

Web › API › HTMLMediaElement › textTracks

the read-only texttracks property on htmlmediaelement objects returns a texttracklist object listing all of the texttrack objects representing the media element's text tracks, in the same order as in the list of text tracks.
... the read-only texttracks property on htmlmediaelement objects returns a texttracklist object listing all of the texttrack objects representing the media element's text tracks, in the same order as in the list of text tracks.
...y texttracks property on htmlmediaelement objects returns a texttracklist object listing all of the texttrack objects representing the media element's text tracks, in the same order as in the list of text tracks.
...And 9 more matches

HTMLOptGroupElement - Web APIs

Web › API › HTMLOptGroupElement

the htmloptgroupelement interface provides special properties and methods (beyond the regular htmlelement object interface they also have available to them by inheritance) for manipulating the layout and presentation of <optgroup> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 9 more matches

HTMLParagraphElement - Web APIs

Web › API › HTMLParagraphElement

the htmlparagraphelement interface provides special properties (beyond those of the regular htmlelement object interface it inherits) for manipulating <p> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 9 more matches

HTMLPreElement - Web APIs

Web › API › HTMLPreElement

the htmlpreelement interface exposes specific properties and methods (beyond those of the htmlelement interface it also has available to it by inheritance) for manipulating a block of preformatted text (<pre>).
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 9 more matches

HTMLSlotElement - Web APIs

Web › API › HTMLSlotElement

the htmlslotelement interface of the shadow dom api enables access to the name and assigned nodes of an html <slot> element.
... the htmlslotelement interface of the shadow dom api enables access to the name and assigned nodes of an html <slot> element.
... the htmlslotelement interface of the shadow dom api enables access to the name and assigned nodes of an html <slot> element.
...And 9 more matches

HTMLUListElement - Web APIs

Web › API › HTMLUListElement

the htmlulistelement interface provides special properties (beyond those defined on the regular htmlelement interface it also has available to it by inheritance) for manipulating unordered list elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 9 more matches

SVGFEDistantLightElement - Web APIs

Web › API › SVGFEDistantLightElement

the svgfedistantlightelement interface corresponds to the <fedistantlight> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 9 more matches

SVGFEImageElement - Web APIs

Web › API › SVGFEImageElement

the svgfeimageelement interface corresponds to the <feimage> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 9 more matches

SVGPolygonElement - Web APIs

Web › API › SVGPolygonElement

the svgpolygonelement interface provides access to the properties of <polygon> elements, as well as methods to manipulate them.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 9 more matches

SVGPolylineElement - Web APIs

Web › API › SVGPolylineElement

the svgpolylineelement interface provides access to the properties of <polyline> elements, as well as methods to manipulate them.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 9 more matches

Pseudo-elements - CSS: Cascading Style Sheets

Web › CSS › Pseudo-elements

a css pseudo-element is a keyword added to a selector that lets you style a specific part of the selected element(s).
... a css pseudo-element is a keyword added to a selector that lets you style a specific part of the selected element(s).
... a css pseudo-element is a keyword added to a selector that lets you style a specific part of the selected element(s).
...And 9 more matches

<abbr>: The Abbreviation element - HTML: Hypertext Markup Language

Web › HTML › Element › abbr

the html abbreviation element (<abbr>) represents an abbreviation or acronym; the optional title attribute can provide an expansion or description for the abbreviation.
...ository.
... content categories flow content, phrasing content, palpable content permitted content phrasing content tag omission none, both the starting and ending tag are mandatory.
...And 9 more matches

<base>: The Document Base URL element - HTML: Hypertext Markup Language

Web › HTML › Element › base

the html <base> element specifies the base url to use for all relative urls in a document.
... the html <base> element specifies the base url to use for all relative urls in a document.
... the html <base> element specifies the base url to use for all relative urls in a document.
...And 9 more matches

<bdi>: The Bidirectional Isolate element - HTML: Hypertext Markup Language

Web › HTML › Element › bdi

the html bidirectional isolate element (<bdi>) tells the browser's bidirectional algorithm to treat the text it contains in isolation from its surrounding text.
...bic characters are treated as rtl.
...ibute set to the known directionality.
...And 9 more matches

<cite>: The Citation element - HTML: Hypertext Markup Language

Web › HTML › Element › cite

the html citation element (<cite>) is used to describe a reference to a cited creative work, and must include the title of that work.
...tory.
... content categories flow content, phrasing content, palpable content.
...And 9 more matches

<head>: The Document Metadata (Header) element - HTML: Hypertext Markup Language

Web › HTML › Element › head

the html <head> element contains machine-readable information (metadata) about the document, like its title, scripts, and style sheets.
... the html <head> element contains machine-readable information (metadata) about the document, like its title, scripts, and style sheets.
...information for machine processing, not human-readability.
...And 9 more matches

<html>: The HTML Document / Root element - HTML: Hypertext Markup Language

Web › HTML › Element › html

the html <html> element represents the root (top-level element) of an html document, so it is also referred to as the root element.
... the html <html> element represents the root (top-level element) of an html document, so it is also referred to as the root element.
... the html <html> element represents the root (top-level element) of an html document, so it is also referred to as the root element.
...And 9 more matches

<p>: The Paragraph element - HTML: Hypertext Markup Language

Web › HTML › Element › p

the html <p> element represents a paragraph.
... the html <p> element represents a paragraph.
... the html <p> element represents a paragraph.
...And 9 more matches

Issues Arising From Arbitrary-Element hover - Archive of obsolete content

Archive › Web Standards › Issues Arising From Arbitrary-Element hover

e their links.
...ling of text links, particularly those that are supposed to look and act like javascript-driven "rollovers." however, advancing css support in browsers has caused some unexpectedly aggressive hovering behavior on some pages.
...." however, advancing css support in browsers has caused some unexpectedly aggressive hovering behavior on some pages.
...And 8 more matches

DocumentOrShadowRoot.fullscreenElement - Web APIs

Web › API › DocumentOrShadowRoot › fullscreenElement

the documentorshadowroot.fullscreenelement read-only property returns the element that is currently being presented in full-screen mode in this document, or null if full-screen mode is not currently in use.
... the documentorshadowroot.fullscreenelement read-only property returns the element that is currently being presented in full-screen mode in this document, or null if full-screen mode is not currently in use.
... the documentorshadowroot.fullscreenelement read-only property returns the element that is currently being presented in full-screen mode in this document, or null if full-screen mode is not currently in use.
...And 8 more matches

DocumentOrShadowRoot.msElementsFromRect() - Web APIs

Web › API › DocumentOrShadowRoot › msElementsFromRect

the mselementsfromrect method returns the node list of elements that are under a rectangle defined by left, top, width, and height.
... the mselementsfromrect method returns the node list of elements that are under a rectangle defined by left, top, width, and height.
...fined by left, top, width, and height.
...And 8 more matches

Element: mouseleave event - Web APIs

Web › API › Element › mouseleave event

the mouseleave event is fired at an element when the cursor of a pointing device (usually a mouse) is moved out of it.
...red at an element when the cursor of a pointing device (usually a mouse) is moved out of it.
...t.
...And 8 more matches

Element.scrollIntoView() - Web APIs

Web › API › Element › scrollIntoView

the element interface's scrollintoview() method scrolls the element's parent container such that the element on which scrollintoview() is called is visible to the user syntax element.scrollintoview(); element.scrollintoview(aligntotop); // boolean parameter element.scrollintoview(scrollintoviewoptions); // object parameter parameters aligntotop optional is a boolean value: if true, the top of the element will be aligned to the top of the visible area of the scrollable ancestor.
...ligntotop); // boolean parameter element.scrollintoview(scrollintoviewoptions); // object parameter parameters aligntotop optional is a boolean value: if true, the top of the element will be aligned to the top of the visible area of the scrollable ancestor.
...ns optional is an object with the following properties: behavior optional defines the transition animation.
...And 8 more matches

Element.tagName - Web APIs

Web › API › Element › tagName

the tagname read-only property of the element interface returns the tag name of the element on which it's called.
... the tagname read-only property of the element interface returns the tag name of the element on which it's called.
... the tagname read-only property of the element interface returns the tag name of the element on which it's called.
...And 8 more matches

HTMLCanvasElement.toBlob() - Web APIs

Web › API › HTMLCanvasElement › toBlob

the htmlcanvaselement.toblob() method creates a blob object representing the image contained in the canvas; this file may be cached on the disk or stored in memory at the discretion of the user agent.
...ely.
...nvas's bitmap is not origin clean; at least some of its contents come from secure examples getting a file representing the canvas once you have drawn content into a canvas, you can convert it into a file of any supported image format.
...And 8 more matches

HTMLDListElement - Web APIs

Web › API › HTMLDListElement

the htmldlistelement interface provides special properties (beyond those of the regular htmlelement interface it also has available to it by inheritance) for manipulating definition list (<dl>) elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 8 more matches

HTMLElement.dir - Web APIs

Web › API › HTMLElement › dir

the htmlelement.dir property gets or sets the text writing directionality of the content of the current element.
... the htmlelement.dir property gets or sets the text writing directionality of the content of the current element.
...ement is which direction that text goes (for support of different language systems).
...And 8 more matches

HTMLElement.offsetLeft - Web APIs

Web › API › HTMLElement › offsetLeft

the htmlelement.offsetleft read-only property returns the number of pixels that the upper left corner of the current element is offset to the left within the htmlelement.offsetparent node.
... the htmlelement.offsetleft read-only property returns the number of pixels that the upper left corner of the current element is offset to the left within the htmlelement.offsetparent node.
... the htmlelement.offsetleft read-only property returns the number of pixels that the upper left corner of the current element is offset to the left within the htmlelement.offsetparent node.
...And 8 more matches

HTMLKeygenElement - Web APIs

Web › API › HTMLKeygenElement

note: this page describes the keygen element interface as specified, not as currently implemented by gecko.
... note: this page describes the keygen element interface as specified, not as currently implemented by gecko.
... note: this page describes the keygen element interface as specified, not as currently implemented by gecko.
...And 8 more matches

HTMLMetaElement - Web APIs

Web › API › HTMLMetaElement

the htmlmetaelement interface contains descriptive metadata about a document.
... the htmlmetaelement interface contains descriptive metadata about a document.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...And 8 more matches

HTMLModElement - Web APIs

Web › API › HTMLModElement

the htmlmodelement interface provides special properties (beyond the regular methods and properties available through the htmlelement interface they also have available to them by inheritance) for manipulating modification elements, that is <del> and <ins>.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 8 more matches

HTMLElement.focus() - Web APIs

Web › API › HTMLOrForeignElement › focus

the htmlelement.focus() method sets focus on the specified element, if it can be focused.
... the htmlelement.focus() method sets focus on the specified element, if it can be focused.
... the htmlelement.focus() method sets focus on the specified element, if it can be focused.
...And 8 more matches

HTMLQuoteElement - Web APIs

Web › API › HTMLQuoteElement

the htmlquoteelement interface provides special properties and methods (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating quoting elements, like <blockquote> and <q>, but not the <cite> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 8 more matches

HTMLSelectElement.form - Web APIs

Web › API › HTMLSelectElement › form

the htmlselectelement.form read-only property returns a htmlformelement representing the form that this element is associated with.
... the htmlselectelement.form read-only property returns a htmlformelement representing the form that this element is associated with.
... the htmlselectelement.form read-only property returns a htmlformelement representing the form that this element is associated with.
...And 8 more matches

HTMLSpanElement - Web APIs

Web › API › HTMLSpanElement

the htmlspanelement interface represents a <span> element and derives from the htmlelement interface, but without implementing any additional properties or methods.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 8 more matches

HTMLTableCaptionElement - Web APIs

Web › API › HTMLTableCaptionElement

the htmltablecaptionelement interface special properties (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating table caption elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 8 more matches

HTMLTimeElement - Web APIs

Web › API › HTMLTimeElement

the htmltimeelement interface provides special properties (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating <time> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 8 more matches

targetElement - Web APIs

Web › API › SVGAnimationElement › targetElement

the svganimationelement.targetelement property refers to the element which is being animated.
... the svganimationelement.targetelement property refers to the element which is being animated.
... the svganimationelement.targetelement property refers to the element which is being animated.
...And 8 more matches

SVGCursorElement - Web APIs

Web › API › SVGCursorElement

the svgcursorelement interface provides access to the properties of <cursor> elements, as well as methods to manipulate them.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 8 more matches

SVGDefsElement - Web APIs

Web › API › SVGDefsElement

the svgdefselement interface corresponds to the <defs> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 8 more matches

SVGGElement - Web APIs

Web › API › SVGGElement

the svggelement interface corresponds to the <g> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 8 more matches

SVGMarkerElement - Web APIs

Web › API › SVGMarkerElement

svg path segment interface the svgmarkerelement interface corresponds to the marker element.
... existing value to this type.
...face also inherits properties from its parent interface, svgelement, and implements properties from svgexternalresourcesrequired, svganimatedpreserveaspectratio, and svgstylable.
...And 8 more matches

SVGSwitchElement - Web APIs

Web › API › SVGSwitchElement

the svgswitchelement interface corresponds to the <switch> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 8 more matches

SVGTextElement - Web APIs

Web › API › SVGTextElement

the svgtextelement interface corresponds to the <text> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 8 more matches

WebGL2RenderingContext.drawElementsInstanced() - Web APIs

Web › API › WebGL2RenderingContext › drawElementsInstanced

the webgl2renderingcontext.drawelementsinstanced() method of the webgl 2 api renders primitives from array data like the gl.drawelements() method.
... the webgl2renderingcontext.drawelementsinstanced() method of the webgl 2 api renders primitives from array data like the gl.drawelements() method.
... the webgl2renderingcontext.drawelementsinstanced() method of the webgl 2 api renders primitives from array data like the gl.drawelements() method.
...And 8 more matches

<caption>: The Table Caption element - HTML: Hypertext Markup Language

Web › HTML › Element › caption

the html <caption> element specifies the caption (or title) of a table.
... caption (or title) of a table.
...f you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 8 more matches

<content>: The Shadow DOM Content Placeholder element (obsolete) - HTML: Hypertext Markup Language

Web › HTML › Element › content

the html <content> element—an obsolete part of the web components suite of technologies—was used inside of shadow dom as an insertion point, and wasn't meant to be used in ordinary html.
... the html <content> element—an obsolete part of the web components suite of technologies—was used inside of shadow dom as an insertion point, and wasn't meant to be used in ordinary html.
...tent> element—an obsolete part of the web components suite of technologies—was used inside of shadow dom as an insertion point, and wasn't meant to be used in ordinary html.
...And 8 more matches

<i>: The Idiomatic Text element - HTML: Hypertext Markup Language

Web › HTML › Element › i

the html idiomatic text element (<i>) represents a range of text that is set off from the normal text for some reason, such as idiomatic text, technical terms, taxonomical designations, among others.
... the html idiomatic text element (<i>) represents a range of text that is set off from the normal text for some reason, such as idiomatic text, technical terms, taxonomical designations, among others.
...itory.
...And 8 more matches

<rt>: The Ruby Text element - HTML: Hypertext Markup Language

Web › HTML › Element › rt

the html ruby text (<rt>) element specifies the ruby text component of a ruby annotation, which is used to provide pronunciation, translation, or transliteration information for east asian typography.
... the html ruby text (<rt>) element specifies the ruby text component of a ruby annotation, which is used to provide pronunciation, translation, or transliteration information for east asian typography.
... the html ruby text (<rt>) element specifies the ruby text component of a ruby annotation, which is used to provide pronunciation, translation, or transliteration information for east asian typography.
...And 8 more matches

<var>: The Variable element - HTML: Hypertext Markup Language

Web › HTML › Element › var

the html variable element (<var>) represents the name of a variable in a mathematical expression or a programming context.
...itory.
... content categories flow content, phrasing content, palpable content.
...And 8 more matches

Mapping the width and height attributes of media container elements to their aspect-ratio - Web media technologies

Web › Media › images › aspect ratio mapping

the image is calculated by the browser early on and can then be used to correct the size needed to display the image before it has loaded, if css has been applied that causes problems with its display size.
...tation to prove it would work.
...k.
...And 8 more matches

XForms Input Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Input

introduction this element is an important and oft-used xforms element to show and change the instance data to which this xforms control is bound (see the spec).
...of widget(s) to use to represent this control accesskey - used to specify the keyboard shortcut for focusing this control single-node binding special inputmode - not supported for this control incremental - supported.
...this control incremental - supported.
...And 7 more matches

XForms Label Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Label

introduction specifies the label (short description) for the xforms control (see the spec).
... introduction specifies the label (short description) for the xforms control (see the spec).
... introduction specifies the label (short description) for the xforms control (see the spec).
...And 7 more matches

nsIDOMElement

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMElement

dom/interfaces/core/nsidomelement.idlscriptable this interface represents an element in an html or xml document.
...presents an element in an html or xml document.
...s from: nsidomnode last changed in gecko 1.7 method overview domstring getattribute(in domstring name); nsidomattr getattributenode(in domstring name); nsidomattr getattributenodens(in domstring namespaceuri, in domstring localname); domstring getattributens(in domstring namespaceuri, in domstring localname); nsidomnodelist getelementsbytagname(in domstring name); nsidomnodelist getelementsbytagnamens(in domstring namespaceuri, in domstring localname); boolean hasattribute(in domstring name); boolean hasattributens(in domstring namespaceuri, in domstring localname); void removeattribute(in domstring name) nsidomattr removeattributenode(in nsidomattr oldattr) void removeattributens(in domstring namespaceuri, in domstring localname) void setattribute(in domstring name, in...
...And 7 more matches

nsIDOMXULLabeledControlElement

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMXULLabeledControlElement

dom/interfaces/xul/nsidomxullabeledcontrolel.idlscriptable this interface is used as a basis for labeled control elements in xul.
... dom/interfaces/xul/nsidomxullabeledcontrolel.idlscriptable this interface is used as a basis for labeled control elements in xul.
...m/interfaces/xul/nsidomxullabeledcontrolel.idlscriptable this interface is used as a basis for labeled control elements in xul.
...And 7 more matches

nsIDOMXULSelectControlElement

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMXULSelectControlElement

dom/interfaces/xul/nsidomxulselectcntrlel.idlscriptable please add a summary to this article.
... dom/interfaces/xul/nsidomxulselectcntrlel.idlscriptable please add a summary to this article.
... dom/interfaces/xul/nsidomxulselectcntrlel.idlscriptable please add a summary to this article.
...And 7 more matches

ANGLE_instanced_arrays.drawElementsInstancedANGLE() - Web APIs

Web › API › ANGLE instanced arrays › drawElementsInstancedANGLE

the angle_instanced_arrays.drawelementsinstancedangle() method of the webgl api renders primitives from array data like the gl.drawelements() method.
... the angle_instanced_arrays.drawelementsinstancedangle() method of the webgl api renders primitives from array data like the gl.drawelements() method.
... the angle_instanced_arrays.drawelementsinstancedangle() method of the webgl api renders primitives from array data like the gl.drawelements() method.
...And 7 more matches

Document.rootElement - Web APIs

Web › API › Document › rootElement

document.rootelement returns the element that is the root element of the document if it is an <svg> element, otherwise null.
... document.rootelement returns the element that is the root element of the document if it is an <svg> element, otherwise null.
... document.rootelement returns the element that is the root element of the document if it is an <svg> element, otherwise null.
...And 7 more matches

Locating DOM elements using selectors - Web APIs

Web › API › Document Object Model › Locating DOM elements using selectors

the selectors api provides methods that make it quick and easy to retrieve element nodes from the dom by matching against a set of selectors.
...at make it quick and easy to retrieve element nodes from the dom by matching against a set of selectors.
... matching against a set of selectors.
...And 7 more matches

Element.getAttributeNames() - Web APIs

Web › API › Element › getAttributeNames

the getattributenames() method of the element interface returns the attribute names of the element as an array of strings.
... the getattributenames() method of the element interface returns the attribute names of the element as an array of strings.
... the getattributenames() method of the element interface returns the attribute names of the element as an array of strings.
...And 7 more matches

Element.localName - Web APIs

Web › API › Element › localName

the element.localname read-only property returns the local part of the qualified name of an element.
... the element.localname read-only property returns the local part of the qualified name of an element.
... the element.localname read-only property returns the local part of the qualified name of an element.
...And 7 more matches

Element.namespaceURI - Web APIs

Web › API › Element › namespaceURI

the element.namespaceuri read-only property returns the namespace uri of the element, or null if the element is not in a namespace.
... the element.namespaceuri read-only property returns the namespace uri of the element, or null if the element is not in a namespace.
... the element.namespaceuri read-only property returns the namespace uri of the element, or null if the element is not in a namespace.
...And 7 more matches

Element.scrollWidth - Web APIs

Web › API › Element › scrollWidth

the element.scrollwidth read-only property is a measurement of the width of an element's content, including content not visible on the screen due to overflow.
... the element.scrollwidth read-only property is a measurement of the width of an element's content, including content not visible on the screen due to overflow.
... the element.scrollwidth read-only property is a measurement of the width of an element's content, including content not visible on the screen due to overflow.
...And 7 more matches

Element.setAttributeNode() - Web APIs

Web › API › Element › setAttributeNode

the setattributenode() method adds a new attr node to the specified element.
... the setattributenode() method adds a new attr node to the specified element.
... the setattributenode() method adds a new attr node to the specified element.
...And 7 more matches

Element.setPointerCapture() - Web APIs

Web › API › Element › setPointerCapture

the setpointercapture() method of the element interface is used to designate a specific element as the capture target of future pointer events.
... the setpointercapture() method of the element interface is used to designate a specific element as the capture target of future pointer events.
... the setpointercapture() method of the element interface is used to designate a specific element as the capture target of future pointer events.
...And 7 more matches

HTMLBRElement - Web APIs

Web › API › HTMLBRElement

the htmlbrelement interface represents a html line break element (<br>).
... the htmlbrelement interface represents a html line break element (<br>).
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...And 7 more matches

HTMLDataElement - Web APIs

Web › API › HTMLDataElement

the htmldataelement interface provides special properties (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating <data> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 7 more matches

HTMLElement.innerText - Web APIs

Web › API › HTMLElement › innerText

the innertext property of the htmlelement interface represents the "rendered" text content of a node and its descendants.
... the innertext property of the htmlelement interface represents the "rendered" text content of a node and its descendants.
....
...And 7 more matches

HTMLElement: input event - Web APIs

Web › API › HTMLElement › input event

the input event fires when the value of an <input>, <select>, or <textarea> element has been changed.
... the input event fires when the value of an <input>, <select>, or <textarea> element has been changed.
... the input event fires when the value of an <input>, <select>, or <textarea> element has been changed.
...And 7 more matches

HTMLElement.offsetParent - Web APIs

Web › API › HTMLElement › offsetParent

the htmlelement.offsetparent read-only property returns a reference to the element which is the closest (nearest in the containment hierarchy) positioned ancestor element.
... the htmlelement.offsetparent read-only property returns a reference to the element which is the closest (nearest in the containment hierarchy) positioned ancestor element.
... the htmlelement.offsetparent read-only property returns a reference to the element which is the closest (nearest in the containment hierarchy) positioned ancestor element.
...And 7 more matches

HTMLElement.offsetWidth - Web APIs

Web › API › HTMLElement › offsetWidth

the htmlelement.offsetwidth read-only property returns the layout width of an element as an integer.
... the htmlelement.offsetwidth read-only property returns the layout width of an element as an integer.
... the htmlelement.offsetwidth read-only property returns the layout width of an element as an integer.
...And 7 more matches

HTMLFrameSetElement - Web APIs

Web › API › HTMLFrameSetElement

the htmlframesetelement interface provides special properties (beyond those of the regular htmlelement interface they also inherit) for manipulating <frameset> elements.
... the htmlframesetelement interface provides special properties (beyond those of the regular htmlelement interface they also inherit) for manipulating <frameset> elements.
... the htmlframesetelement interface provides special properties (beyond those of the regular htmlelement interface they also inherit) for manipulating <frameset> elements.
...And 7 more matches

HTMLImageElement.crossOrigin - Web APIs

Web › API › HTMLImageElement › crossOrigin

the htmlimageelement interface's crossorigin attribute is a string which specifies the cross-origin resource sharing (cors) setting to use when retrieving the image.
... the htmlimageelement interface's crossorigin attribute is a string which specifies the cross-origin resource sharing (cors) setting to use when retrieving the image.
... the htmlimageelement interface's crossorigin attribute is a string which specifies the cross-origin resource sharing (cors) setting to use when retrieving the image.
...And 7 more matches

HTMLMediaElement.src - Web APIs

Web › API › HTMLMediaElement › src

the htmlmediaelement.src property reflects the value of the html media element's src attribute, which indicates the url of a media resource to use in the element.
... the htmlmediaelement.src property reflects the value of the html media element's src attribute, which indicates the url of a media resource to use in the element.
...rty reflects the value of the html media element's src attribute, which indicates the url of a media resource to use in the element.
...And 7 more matches

HTMLOrForeignElement - Web APIs

Web › API › HTMLOrForeignElement

the htmlorforeignelement mixin describes several features common to the htmlelement, svgelement and mathmlelement interfaces.
... the htmlorforeignelement mixin describes several features common to the htmlelement, svgelement and mathmlelement interfaces.
... the htmlorforeignelement mixin describes several features common to the htmlelement, svgelement and mathmlelement interfaces.
...And 7 more matches

HTMLTableElement.tHead - Web APIs

Web › API › HTMLTableElement › tHead

the htmltableelement.thead represents the <thead> element of a <table> .
... the htmltableelement.thead represents the <thead> element of a <table> .
... the htmltableelement.thead represents the <thead> element of a <table> .
...And 7 more matches

MathMLElement - Web APIs

Web › API › MathMLElement

the mathmlelement interface represents any mathml element.
... the mathmlelement interface represents any mathml element.
... the mathmlelement interface represents any mathml element.
...And 7 more matches

SVGClipPathElement - Web APIs

Web › API › SVGClipPathElement

the svgclippathelement interface provides access to the properties of <clippath> elements, as well as methods to manipulate them.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 7 more matches

SVGFEComponentTransferElement - Web APIs

Web › API › SVGFEComponentTransferElement

the svgfecomponenttransferelement interface corresponds to the <fecomponenttransfer> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 7 more matches

SVGFEMergeNodeElement - Web APIs

Web › API › SVGFEMergeNodeElement

the svgfemergenodeelement interface corresponds to the <femergenode> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 7 more matches

SVGFETileElement - Web APIs

Web › API › SVGFETileElement

the svgfetileelement interface corresponds to the <fetile> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 7 more matches

SVGScriptElement - Web APIs

Web › API › SVGScriptElement

the svgscriptelement interface corresponds to the svg <script> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 7 more matches

SVGStopElement - Web APIs

Web › API › SVGStopElement

the svgstopelement interface corresponds to the <stop> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 7 more matches

SVGSymbolElement - Web APIs

Web › API › SVGSymbolElement

the svgsymbolelement interface corresponds to the <symbol> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 7 more matches

SVGTSpanElement - Web APIs

Web › API › SVGTSpanElement

the svgtspanelement interface represents a <tspan> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 7 more matches

<dialog>: The Dialog element - HTML: Hypertext Markup Language

Web › HTML › Element › dialog

the html <dialog> element represents a dialog box or other interactive component, such as a dismissable alert, inspector, or subwindow.
... the html <dialog> element represents a dialog box or other interactive component, such as a dismissable alert, inspector, or subwindow.
...rt, inspector, or subwindow.
...And 7 more matches

<dir>: The Directory element (obsolete) - HTML: Hypertext Markup Language

Web › HTML › Element › dir

the obsolete html directory element (<dir>) is used as a container for a directory of files and/or folders, potentially with styles and icons applied by the user agent.
... the obsolete html directory element (<dir>) is used as a container for a directory of files and/or folders, potentially with styles and icons applied by the user agent.
... the obsolete html directory element (<dir>) is used as a container for a directory of files and/or folders, potentially with styles and icons applied by the user agent.
...And 7 more matches

Web › HTML › Element › embed

the html <embed> element embeds external content at the specified point in the document.
...n the document.
...h as a browser plug-in.
...And 7 more matches

<meter>: The HTML Meter element - HTML: Hypertext Markup Language

Web › HTML › Element › meter

the html <meter> element represents either a scalar value within a known range or a fractional value.
... source for this interactive example is stored in a github repository.
...lone https://github.com/mdn/interactive-examples and send us a pull request.
...And 7 more matches

<noframes>: The Frame Fallback element - HTML: Hypertext Markup Language

Web › HTML › Element › noframes

the obsolete html no frames or frame fallback element, <noframes>, provides content to be presented in browsers that don't support (or have disabled support for) the <frame> element.
... the obsolete html no frames or frame fallback element, <noframes>, provides content to be presented in browsers that don't support (or have disabled support for) the <frame> element.
... obsolete html no frames or frame fallback element, <noframes>, provides content to be presented in browsers that don't support (or have disabled support for) the <frame> element.
...And 7 more matches

<xsl:element> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › element

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:element> element creates an element in the output document.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:element> element creates an element in the output document.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:element> element creates an element in the output document.
...And 7 more matches

XSLT elements reference - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes there are two types of elements discussed here: top-level elements and instructions.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes there are two types of elements discussed here: top-level elements and instructions.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes there are two types of elements discussed here: top-level elements and instructions.
...And 7 more matches

nsIDOMHTMLSourceElement

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMHTMLSourceElement

the nsidomhtmlsourceelement interface is the dom interface to the source child of the audio and video media elements in html.
... the nsidomhtmlsourceelement interface is the dom interface to the source child of the audio and video media elements in html.
... the nsidomhtmlsourceelement interface is the dom interface to the source child of the audio and video media elements in html.
...And 6 more matches

CSSPseudoElement.type - Web APIs

Web › API › CSSPseudoElement › type

the type read-only property of the csspseudoelement interface returns the type of the pseudo-element as a string, represented in the form of a css selector.
... the type read-only property of the csspseudoelement interface returns the type of the pseudo-element as a string, represented in the form of a css selector.
... the type read-only property of the csspseudoelement interface returns the type of the pseudo-element as a string, represented in the form of a css selector.
...And 6 more matches

CustomElementRegistry.get() - Web APIs

Web › API › CustomElementRegistry › get

the get() method of the customelementregistry interface returns the constructor for a previously-defined custom element.
... the get() method of the customelementregistry interface returns the constructor for a previously-defined custom element.
... the get() method of the customelementregistry interface returns the constructor for a previously-defined custom element.
...And 6 more matches

CustomElementRegistry.upgrade() - Web APIs

Web › API › CustomElementRegistry › upgrade

the upgrade() method of the customelementregistry interface upgrades all shadow-containing custom elements in a node subtree, even before they are connected to the main document.
... the upgrade() method of the customelementregistry interface upgrades all shadow-containing custom elements in a node subtree, even before they are connected to the main document.
... the upgrade() method of the customelementregistry interface upgrades all shadow-containing custom elements in a node subtree, even before they are connected to the main document.
...And 6 more matches

Document.scrollingElement - Web APIs

Web › API › Document › scrollingElement

the scrollingelement read-only property of the document interface returns a reference to the element that scrolls the document.
... the scrollingelement read-only property of the document interface returns a reference to the element that scrolls the document.
... the scrollingelement read-only property of the document interface returns a reference to the element that scrolls the document.
...And 6 more matches

Element.animate() - Web APIs

Web › API › Element › animate

the element interface's animate() method is a shortcut method which creates a new animation, applies it to the element, then plays the animation.
... the element interface's animate() method is a shortcut method which creates a new animation, applies it to the element, then plays the animation.
... the element interface's animate() method is a shortcut method which creates a new animation, applies it to the element, then plays the animation.
...And 6 more matches

Element.getAnimations() - Web APIs

Web › API › Element › getAnimations

the getanimations() method of the element interface (specified on the animatable mixin) returns an array of all animation objects affecting this element or which are scheduled to do so in future.
... the getanimations() method of the element interface (specified on the animatable mixin) returns an array of all animation objects affecting this element or which are scheduled to do so in future.
... the getanimations() method of the element interface (specified on the animatable mixin) returns an array of all animation objects affecting this element or which are scheduled to do so in future.
...And 6 more matches

Element.getAttributeNS() - Web APIs

Web › API › Element › getAttributeNS

the getattributens() method of the element interface returns the string value of the attribute with the specified namespace and name.
... the getattributens() method of the element interface returns the string value of the attribute with the specified namespace and name.
...oo attribute in a custom namespace.
...And 6 more matches

Element.hasAttribute() - Web APIs

Web › API › Element › hasAttribute

the element.hasattribute() method returns a boolean value indicating whether the specified element has the specified attribute or not.
... the element.hasattribute() method returns a boolean value indicating whether the specified element has the specified attribute or not.
... the element.hasattribute() method returns a boolean value indicating whether the specified element has the specified attribute or not.
...And 6 more matches

Element.scroll() - Web APIs

Web › API › Element › scroll

the scroll() method of the element interface scrolls the element to a particular set of coordinates inside a given element.
... the scroll() method of the element interface scrolls the element to a particular set of coordinates inside a given element.
... the scroll() method of the element interface scrolls the element to a particular set of coordinates inside a given element.
...And 6 more matches

Element.scrollLeft - Web APIs

Web › API › Element › scrollLeft

the element.scrollleft property gets or sets the number of pixels that an element's content is scrolled from its left edge.
... the element.scrollleft property gets or sets the number of pixels that an element's content is scrolled from its left edge.
... edge.
...And 6 more matches

HTMLElement: beforeinput event - Web APIs

Web › API › HTMLElement › beforeinput event

the dom beforeinput event fires when the value of an <input>, <select>, or <textarea> element is about to be modified.
... the dom beforeinput event fires when the value of an <input>, <select>, or <textarea> element is about to be modified.
... the dom beforeinput event fires when the value of an <input>, <select>, or <textarea> element is about to be modified.
...And 6 more matches

HTMLElement: change event - Web APIs

Web › API › HTMLElement › change event

the change event is fired for <input>, <select>, and <textarea> elements when an alteration to the element's value is committed by the user.
... the change event is fired for <input>, <select>, and <textarea> elements when an alteration to the element's value is committed by the user.
...hange event is fired for <input>, <select>, and <textarea> elements when an alteration to the element's value is committed by the user.
...And 6 more matches

HTMLElement.isContentEditable - Web APIs

Web › API › HTMLElement › isContentEditable

the htmlelement.iscontenteditable read-only property returns a boolean that is true if the contents of the element are editable; otherwise it returns false.
... the htmlelement.iscontenteditable read-only property returns a boolean that is true if the contents of the element are editable; otherwise it returns false.
...urns a boolean that is true if the contents of the element are editable; otherwise it returns false.
...And 6 more matches

HTMLElement.lang - Web APIs

Web › API › HTMLElement › lang

the htmlelement.lang property gets or sets the base language of an element's attribute values and text content.
...operty gets or sets the base language of an element's attribute values and text content.
...ues and text content.
...And 6 more matches

HTMLMediaElement.captureStream() - Web APIs

Web › API › HTMLMediaElement › captureStream

the capturestream() property of the htmlmediaelement interface returns a mediastream object which is streaming a real-time capture of the content being rendered in the media element.
... the capturestream() property of the htmlmediaelement interface returns a mediastream object which is streaming a real-time capture of the content being rendered in the media element.
..., as a source for a webrtc rtcpeerconnection.
...And 6 more matches

HTMLSelectElement.autofocus - Web APIs

Web › API › HTMLSelectElement › autofocus

the htmlselectelement.autofocus property is a boolean that reflects the autofocus html attribute, which indicates whether the associated <select> element will get input focus when the page loads, unless the user overrides it.
... the htmlselectelement.autofocus property is a boolean that reflects the autofocus html attribute, which indicates whether the associated <select> element will get input focus when the page loads, unless the user overrides it.
... the htmlselectelement.autofocus property is a boolean that reflects the autofocus html attribute, which indicates whether the associated <select> element will get input focus when the page loads, unless the user overrides it.
...And 6 more matches

HTMLTemplateElement - Web APIs

Web › API › HTMLTemplateElement

the htmltemplateelement interface enables access to the contents of an html <template> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 6 more matches

HTMLTrackElement: cuechange event - Web APIs

Web › API › HTMLTrackElement › cuechange event

the cuechange event fires when a texttrack has changed the currently displaying cues.
... the texttrack you can set up a listener for the cuechange event on a texttrack using the addeventlistener() method: track.addeventlistener('cuechange', function () { let cues = track.activecues; // array of current cues }); or you can just set the oncuechange event handler property: track.oncuechange = function () { let cues = track.activecues; // array of current cues } on the track element the underlying texttrack, indicated by the track property, receives a cuechange event every time the currently-presented cue is changed.
...ray of current cues }); or you can just set the oncuechange event handler property: track.oncuechange = function () { let cues = track.activecues; // array of current cues } on the track element the underlying texttrack, indicated by the track property, receives a cuechange event every time the currently-presented cue is changed.
...And 6 more matches

Node.parentElement - Web APIs

Web › API › Node › parentElement

the node.parentelement read-only property returns the dom node's parent element, or null if the node either has no parent, or its parent isn't a dom element.
... the node.parentelement read-only property returns the dom node's parent element, or null if the node either has no parent, or its parent isn't a dom element.
... the node.parentelement read-only property returns the dom node's parent element, or null if the node either has no parent, or its parent isn't a dom element.
...And 6 more matches

SVGAnimateElement - Web APIs

Web › API › SVGAnimateElement

the svganimateelement interface corresponds to the <animate> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 6 more matches

SVGAnimateMotionElement - Web APIs

Web › API › SVGAnimateMotionElement

the svganimatemotionelement interface corresponds to the <animatemotion> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 6 more matches

SVGAnimateTransformElement - Web APIs

Web › API › SVGAnimateTransformElement

the svganimatetransformelement interface corresponds to the <animatetransform> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 6 more matches

SVGColorProfileElement - Web APIs

Web › API › SVGColorProfileElement

the svgcolorprofileelement interface corresponds to the <color-profile> element.
... the svgcolorprofileelement interface corresponds to the <color-profile> element.
... the svgcolorprofileelement interface corresponds to the <color-profile> element.
...And 6 more matches

SVGFEFuncAElement - Web APIs

Web › API › SVGFEFuncAElement

the svgfefuncaelement interface corresponds to the <fefunca> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 6 more matches

SVGFEFuncBElement - Web APIs

Web › API › SVGFEFuncBElement

the svgfefuncbelement interface corresponds to the <fefuncb> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 6 more matches

SVGFEFuncGElement - Web APIs

Web › API › SVGFEFuncGElement

the svgfefuncgelement interface corresponds to the <fefuncg> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 6 more matches

SVGFEFuncRElement - Web APIs

Web › API › SVGFEFuncRElement

the svgfefuncrelement interface corresponds to the <fefuncr> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 6 more matches

SVGSetElement - Web APIs

Web › API › SVGSetElement

the svgsetelement interface corresponds to the <set> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 6 more matches

SVGViewElement - Web APIs

Web › API › SVGViewElement

the svgviewelement interface provides access to the properties of <view> elements, as well as methods to manipulate them.
... the svgviewelement interface provides access to the properties of <view> elements, as well as methods to manipulate them.
... the svgviewelement interface provides access to the properties of <view> elements, as well as methods to manipulate them.
...And 6 more matches

WebGLRenderingContext.drawElements() - Web APIs

Web › API › WebGLRenderingContext › drawElements

the webglrenderingcontext.drawelements() method of the webgl api renders primitives from array data.
... the webglrenderingcontext.drawelements() method of the webgl api renders primitives from array data.
... gl.points: draws a single dot.
...And 6 more matches

<h1>–<h6>: The HTML Section Heading elements - HTML: Hypertext Markup Language

Web › HTML › Element › Heading Elements

the html <h1>–<h6> elements represent six levels of section headings.
...itory.
...xamples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 6 more matches

<applet>: The Embed Java Applet element - HTML: Hypertext Markup Language

Web › HTML › Element › applet

the <applet> element was removed in gecko 56 and chrome 47.
... the <applet> element was removed in gecko 56 and chrome 47.
... the <applet> element was removed in gecko 56 and chrome 47.
...And 6 more matches

<big>: The Bigger Text element - HTML: Hypertext Markup Language

Web › HTML › Element › big

the obsolete html big element (<big>) renders the enclosed text at a font size one level larger than the surrounding text (medium becomes large, for example).
... the obsolete html big element (<big>) renders the enclosed text at a font size one level larger than the surrounding text (medium becomes large, for example).
...the enclosed text at a font size one level larger than the surrounding text (medium becomes large, for example).
...And 6 more matches

<code>: The Inline Code element - HTML: Hypertext Markup Language

Web › HTML › Element › code

the html <code> element displays its contents styled in a fashion intended to indicate that the text is a short fragment of computer code.
...itory.
... content categories flow content, phrasing content, palpable content.
...And 6 more matches

<command>: The HTML Command element - HTML: Hypertext Markup Language

Web › HTML › Element › command

the html command element (<command>) represents a command which the user can invoke.
... the html command element (<command>) represents a command which the user can invoke.
... the html command element (<command>) represents a command which the user can invoke.
...And 6 more matches

<del>: The Deleted Text element - HTML: Hypertext Markup Language

Web › HTML › Element › del

the html <del> element represents a range of text that has been deleted from a document.
... the html <del> element represents a range of text that has been deleted from a document.
... changes" or source code diff information, for example.
...And 6 more matches

<figure>: The Figure with Optional Caption element - HTML: Hypertext Markup Language

Web › HTML › Element › figure

the html <figure> (figure with optional caption) element represents self-contained content, potentially with an optional caption, which is specified using the (<figcaption>) element.
... its contents are referenced as a single unit.
...ive example is stored in a github repository.
...And 6 more matches

<mark>: The Mark Text element - HTML: Hypertext Markup Language

Web › HTML › Element › mark

the html mark text element (<mark>) represents text which is marked or highlighted for reference or notation purposes, due to the marked passage's relevance or importance in the enclosing context.
...itory.
... content categories flow content, phrasing content, palpable content.
...And 6 more matches

<nav>: The Navigation Section element - HTML: Hypertext Markup Language

Web › HTML › Element › nav

the html <nav> element represents a section of a page whose purpose is to provide navigation links, either within the current document or to other documents.
...sitory.
... content categories flow content, sectioning content, palpable content.
...And 6 more matches

<progress>: The Progress Indicator element - HTML: Hypertext Markup Language

Web › HTML › Element › progress

the html <progress> element displays an indicator showing the completion progress of a task, typically displayed as a progress bar.
...urce for this interactive example is stored in a github repository.
...e https://github.com/mdn/interactive-examples and send us a pull request.
...And 6 more matches

Adding more elements - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Adding More Elements

« previousnext » we will conclude the discussion of boxes by adding some boxes to the find files dialog.
... « previousnext » we will conclude the discussion of boxes by adding some boxes to the find files dialog.
... </menupopup> </menulist> <spacer style="width: 10px;"/> <menulist id="searchmode"> <menupopup> <menuitem label="is"/> <menuitem label="is not"/> </menupopup> </menulist> <spacer style="width: 10px;"/> <textbox id="find-text" flex="1" style="min-width: 15em;"/> </hbox> two drop down boxes have been added to the dialog.
...And 5 more matches

XForms Alert Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Alert

introduction this message will be shown when the form control cannot properly bind to instance data or when the instance data value is invalid or out of the specified range of selectable values (see the spec).
... introduction this message will be shown when the form control cannot properly bind to instance data or when the instance data value is invalid or out of the specified range of selectable values (see the spec).
...e values (see the spec).
...And 5 more matches

XForms Output Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Output

introduction serves to show the instance data that the element is bound to in a read-only manner (see the spec).
...to the xforms processor as to which type of widget(s) to use to represent this control accesskey - used to specify the keyboard shortcut for focusing this control single-node binding special value - xpath expression whose evaluation result is used as the output's value.
...ify the keyboard shortcut for focusing this control single-node binding special value - xpath expression whose evaluation result is used as the output's value.
...And 5 more matches

Element.getAttribute() - Web APIs

Web › API › Element › getAttribute

the getattribute() method of the element interface returns the value of a specified attribute on the element.
... the getattribute() method of the element interface returns the value of a specified attribute on the element.
...e element.
...And 5 more matches

Element.getAttributeNode() - Web APIs

Web › API › Element › getAttributeNode

returns the specified attribute of the specified element, as an attr node.
... returns the specified attribute of the specified element, as an attr node.
... returns the specified attribute of the specified element, as an attr node.
...And 5 more matches

Element.hasPointerCapture() - Web APIs

Web › API › Element › hasPointerCapture

the haspointercapture() method of the element interface sets whether the element on which it is invoked has pointer capture for the pointer identified by the given pointer id.
... the haspointercapture() method of the element interface sets whether the element on which it is invoked has pointer capture for the pointer identified by the given pointer id.
... the haspointercapture() method of the element interface sets whether the element on which it is invoked has pointer capture for the pointer identified by the given pointer id.
...And 5 more matches

Element: mouseenter event - Web APIs

Web › API › Element › mouseenter event

the mouseenter event is fired at an element when a pointing device (usually a mouse) is initially moved so that its hotspot is within the element at which the event was fired.
... bubbles no cancelable no interface mouseevent event handler property onmouseenter usage notes though similar to mouseover, mouseenter differs in that it doesn't bubble and it isn't sent to any descendants when the pointer is moved from one of its descendants' physical space to its own physical space.
...ent event handler property onmouseenter usage notes though similar to mouseover, mouseenter differs in that it doesn't bubble and it isn't sent to any descendants when the pointer is moved from one of its descendants' physical space to its own physical space.
...And 5 more matches

Element: mouseout event - Web APIs

Web › API › Element › mouseout event

the mouseout event is fired at an element when a pointing device (usually a mouse) is used to move the cursor so that it is no longer contained within the element or one of its children.
... the mouseout event is fired at an element when a pointing device (usually a mouse) is used to move the cursor so that it is no longer contained within the element or one of its children.
... the mouseout event is fired at an element when a pointing device (usually a mouse) is used to move the cursor so that it is no longer contained within the element or one of its children.
...And 5 more matches

Element.scrollTo() - Web APIs

Web › API › Element › scrollTo

the scrollto() method of the element interface scrolls to a particular set of coordinates inside a given element.
... the scrollto() method of the element interface scrolls to a particular set of coordinates inside a given element.
... the scrollto() method of the element interface scrolls to a particular set of coordinates inside a given element.
...And 5 more matches

HTMLCanvasElement.getContext() - Web APIs

Web › API › HTMLCanvasElement › getContext

the htmlcanvaselement.getcontext() method returns a drawing context on the canvas, or null if the context identifier is not supported.
... the htmlcanvaselement.getcontext() method returns a drawing context on the canvas, or null if the context identifier is not supported.
...turns a drawing context on the canvas, or null if the context identifier is not supported.
...And 5 more matches

HTMLDataListElement - Web APIs

Web › API › HTMLDataListElement

the htmldatalistelement interface provides special properties (beyond the htmlelement object interface it also has available to it by inheritance) to manipulate <datalist> elements and their content.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 5 more matches

HTMLDetailsElement - Web APIs

Web › API › HTMLDetailsElement

the htmldetailselement interface provides special properties (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating <details> elements.
...vailable to it by inheritance) for manipulating <details> elements.
...op: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a xlink:href="/docs/web/api/htmldetailselement" target="_top"><rect x="1" y="1" width="180" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="91" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmldetailselement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
...And 5 more matches

HTMLFontElement - Web APIs

Web › API › HTMLFontElement

implements the document object model (dom) representation of the font element.
... implements the document object model (dom) representation of the font element.
... implements the document object model (dom) representation of the font element.
...And 5 more matches

HTMLFormElement.name - Web APIs

Web › API › HTMLFormElement › name

the htmlformelement.name property represents the name of the current <form> element as a string.
... the htmlformelement.name property represents the name of the current <form> element as a string.
... the htmlformelement.name property represents the name of the current <form> element as a string.
...And 5 more matches

HTMLImageElement.srcset - Web APIs

Web › API › HTMLImageElement › srcset

the htmlimageelement property srcset is a string which identifies one or more image candidate strings, separated using commas (,) each specifying image resources to use under given circumstances.
...an optional width or pixel density descriptor that indicates the conditions under which that candidate should be used instead of the image specified by the src property.
...he conditions under which that candidate should be used instead of the image specified by the src property.
...And 5 more matches

HTMLMediaElement.autoplay - Web APIs

Web › API › HTMLMediaElement › autoplay

the htmlmediaelement.autoplay property reflects the autoplay html attribute, indicating whether playback should automatically begin as soon as enough media is available to do so without interruption.
... the htmlmediaelement.autoplay property reflects the autoplay html attribute, indicating whether playback should automatically begin as soon as enough media is available to do so without interruption.
...ck when it becomes active (that is, when mediastream.active becomes true).
...And 5 more matches

HTMLMediaElement.networkState - Web APIs

Web › API › HTMLMediaElement › networkState

the htmlmediaelement.networkstate property indicates the current state of the fetching of media over the network.
... the htmlmediaelement.networkstate property indicates the current state of the fetching of media over the network.
...ate = audioorvideo.networkstate; value an unsigned short.
...And 5 more matches

HTMLOrForeignElement.tabIndex - Web APIs

Web › API › HTMLOrForeignElement › tabIndex

the tabindex property of the htmlorforeignelement interface represents the tab order of the current element.
... the tabindex property of the htmlorforeignelement interface represents the tab order of the current element.
... the tabindex property of the htmlorforeignelement interface represents the tab order of the current element.
...And 5 more matches

HTMLShadowElement - Web APIs

Web › API › HTMLShadowElement

the htmlshadowelement interface represents a <shadow> html element, which is used in shadow dom.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 5 more matches

HTMLStyleElement.media - Web APIs

Web › API › HTMLStyleElement › media

the htmlstyleelement.media property specifies the intended destination medium for style information.
...edium parameters medium is a string describing a single medium or a comma-separated list.
...rated list.
...And 5 more matches

HTMLTableElement.tFoot - Web APIs

Web › API › HTMLTableElement › tFoot

the htmltableelement.tfoot property represents the <tfoot> element of a <table>.
... the htmltableelement.tfoot property represents the <tfoot> element of a <table>.
... the htmltableelement.tfoot property represents the <tfoot> element of a <table>.
...And 5 more matches

HTMLUnknownElement - Web APIs

Web › API › HTMLUnknownElement

the htmlunknownelement interface represents an invalid html element and derives from the htmlelement interface, but without implementing any additional properties or methods.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 5 more matches

SVGAltGlyphElement - Web APIs

Web › API › SVGAltGlyphElement

the svgaltglyphelement interface represents an <altglyph> element.
... more sophisticated and particular glyph characters.
... particular glyph characters.
...And 5 more matches

SVGDescElement - Web APIs

Web › API › SVGDescElement

the svgdescelement interface corresponds to the <desc> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 5 more matches

SVGFEFloodElement - Web APIs

Web › API › SVGFEFloodElement

the svgfefloodelement interface corresponds to the <feflood> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 5 more matches

SVGFEMergeElement - Web APIs

Web › API › SVGFEMergeElement

the svgfemergeelement interface corresponds to the <femerge> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 5 more matches

SVGMPathElement - Web APIs

Web › API › SVGMPathElement

the svgmpathelement interface corresponds to the <mpath> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 5 more matches

SVGMetadataElement - Web APIs

Web › API › SVGMetadataElement

the svgmetadataelement interface corresponds to the <metadata> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 5 more matches

SVGTitleElement - Web APIs

Web › API › SVGTitleElement

the svgtitleelement interface corresponds to the <title> element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
..."50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="431" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2...
...And 5 more matches

WebGL2RenderingContext.drawRangeElements() - Web APIs

Web › API › WebGL2RenderingContext › drawRangeElements

the webgl2renderingcontext.drawrangeelements() method of the webgl api renders primitives from array data in a given range.
... the webgl2renderingcontext.drawrangeelements() method of the webgl api renders primitives from array data in a given range.
...rtex, and connects the last vertex back to the first.
...And 5 more matches

<bdo>: The Bidirectional Text Override element - HTML: Hypertext Markup Language

Web › HTML › Element › bdo

the html bidirectional text override element (<bdo>) overrides the current directionality of text, so that the text within is rendered in a different direction.
...rom the starting point in the given direction; the individual characters' orientation is not affected (so characters don't get drawn backward, for example).
... content categories flow content, phrasing content, palpable content.
...And 5 more matches

<center>: The Centered Text element (obsolete) - HTML: Hypertext Markup Language

Web › HTML › Element › center

the obsolete html center element (<center>) is a block-level element that displays its block-level or inline contents centered horizontally within its containing element.
... the obsolete html center element (<center>) is a block-level element that displays its block-level or inline contents centered horizontally within its containing element.
...hin its containing element.
...And 5 more matches

<dd>: The Description Details element - HTML: Hypertext Markup Language

Web › HTML › Element › dd

the html <dd> element provides the description, definition, or value for the preceding term (<dt>) in a description list (<dl>).
... the source for this interactive example is stored in a github repository.
...red in a github repository.
...And 5 more matches

<samp>: The Sample Output element - HTML: Hypertext Markup Language

Web › HTML › Element › samp

the html sample element (<samp>) is used to enclose inline text which represents sample (or quoted) output from a computer program.
...tory.
... content categories flow content, phrasing content, palpable content.
...And 5 more matches

<title>: The Document Title element - HTML: Hypertext Markup Language

Web › HTML › Element › title

the html title element (<title>) defines the document's title that is shown in a browser's title bar or a page's tab.
... the html title element (<title>) defines the document's title that is shown in a browser's title bar or a page's tab.
... the html title element (<title>) defines the document's title that is shown in a browser's title bar or a page's tab.
...And 5 more matches

TypeError: can't delete non-configurable array element - JavaScript

Web › JavaScript › Reference › Errors › Non configurable array element

the javascript exception "can't delete non-configurable array element" occurs when it was attempted to shorten the length of an array, but one of the array's elements is non-configurable.
... the javascript exception "can't delete non-configurable array element" occurs when it was attempted to shorten the length of an array, but one of the array's elements is non-configurable.
...figurable array element" occurs when it was attempted to shorten the length of an array, but one of the array's elements is non-configurable.
...And 5 more matches

MathML element reference - MathML

Web › MathML › Element

this is an alphabetical list of mathml presentation elements.
...betical list of mathml presentation elements.
...tation elements.
...And 5 more matches

<title> — the SVG accessible name element - SVG: Scalable Vector Graphics

Web › SVG › Element › title

the <title> element provides an accessible, short-text description of any svg container element or graphics element.
... the <title> element provides an accessible, short-text description of any svg container element or graphics element.
... the <title> element provides an accessible, short-text description of any svg container element or graphics element.
...And 5 more matches

SVG element reference - SVG: Scalable Vector Graphics

Web › SVG › Element

« svg / svg attribute reference » svg drawings and images are created using a wide array of elements which are dedicated to the construction, drawing, and layout of vector images and diagrams.
... « svg / svg attribute reference » svg drawings and images are created using a wide array of elements which are dedicated to the construction, drawing, and layout of vector images and diagrams.
... « svg / svg attribute reference » svg drawings and images are created using a wide array of elements which are dedicated to the construction, drawing, and layout of vector images and diagrams.
...And 5 more matches

XForms Message Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Message

introduction used in combination with xml event listeners to display a message to the user when the specified event occurs (see the spec).
... introduction used in combination with xml event listeners to display a message to the user when the specified event occurs (see the spec).
...curs (see the spec).
...And 4 more matches

nsIXFormsNSInstanceElement

Mozilla › Tech › XPCOM › Reference › Interface › nsIXFormsNSInstanceElement

nsixformsnsinstanceelement is implemented by all xforms <instance/> elements, defining mozilla extensions.
... nsixformsnsinstanceelement is implemented by all xforms <instance/> elements, defining mozilla extensions.
... nsixformsnsinstanceelement is implemented by all xforms <instance/> elements, defining mozilla extensions.
...And 4 more matches

DataTransfer.addElement() - Web APIs

Web › API › DataTransfer › addElement

the datatransfer.addelement() method sets the drag source to the given element.
... the datatransfer.addelement() method sets the drag source to the given element.
... the datatransfer.addelement() method sets the drag source to the given element.
...And 4 more matches

Element.id - Web APIs

Web › API › Element › id

the id property of the element interface represents the element's identifier, reflecting the id global attribute.
... the id property of the element interface represents the element's identifier, reflecting the id global attribute.
... the id property of the element interface represents the element's identifier, reflecting the id global attribute.
...And 4 more matches

Element.onfullscreenchange - Web APIs

Web › API › Element › onfullscreenchange

the element interface's onfullscreenchange property is an event handler for the fullscreenchange event that is fired when the element has transitioned into or out of full-screen mode.
... the element interface's onfullscreenchange property is an event handler for the fullscreenchange event that is fired when the element has transitioned into or out of full-screen mode.
...s fired when the element has transitioned into or out of full-screen mode.
...And 4 more matches

Element.scrollBy() - Web APIs

Web › API › Element › scrollBy

the scrollby() method of the element interface scrolls an element by the given amount.
... the scrollby() method of the element interface scrolls an element by the given amount.
... the scrollby() method of the element interface scrolls an element by the given amount.
...And 4 more matches

Element.slot - Web APIs

Web › API › Element › slot

the slot property of the element interface returns the name of the shadow dom slot the element is inserted in.
... the slot property of the element interface returns the name of the shadow dom slot the element is inserted in.
... the slot property of the element interface returns the name of the shadow dom slot the element is inserted in.
...And 4 more matches

ElementCSSInlineStyle - Web APIs

Web › API › ElementCSSInlineStyle

the elementcssinlinestyle mixin describes cssom-specific features common to the htmlelement, svgelement and mathmlelement interfaces.
... the elementcssinlinestyle mixin describes cssom-specific features common to the htmlelement, svgelement and mathmlelement interfaces.
... the elementcssinlinestyle mixin describes cssom-specific features common to the htmlelement, svgelement and mathmlelement interfaces.
...And 4 more matches

HTMLCanvasElement.height - Web APIs

Web › API › HTMLCanvasElement › height

the htmlcanvaselement.height property is a positive integer reflecting the height html attribute of the <canvas> element interpreted in css pixels.
... the htmlcanvaselement.height property is a positive integer reflecting the height html attribute of the <canvas> element interpreted in css pixels.
...height html attribute of the <canvas> element interpreted in css pixels.
...And 4 more matches

HTMLCanvasElement.mozGetAsFile() - Web APIs

Web › API › HTMLCanvasElement › mozGetAsFile

the non-standard, firefox-specific the htmlcanvaselement method mozgetasfile() returns a memory-based file object representing the image contained in the canvas.
...es the image file format to use when creating the new image file.
... uses a filereader to read the image data from the file.
...And 4 more matches

HTMLCanvasElement.toDataURL() - Web APIs

Web › API › HTMLCanvasElement › toDataURL

the htmlcanvaselement.todataurl() method returns a data uri containing a representation of the image in the format specified by the type parameter (defaults to png).
...the default value for image quality is used.
...d data uri.
...And 4 more matches

HTMLCanvasElement.width - Web APIs

Web › API › HTMLCanvasElement › width

the htmlcanvaselement.width property is a positive integer reflecting the width html attribute of the <canvas> element interpreted in css pixels.
... the htmlcanvaselement.width property is a positive integer reflecting the width html attribute of the <canvas> element interpreted in css pixels.
...e width html attribute of the <canvas> element interpreted in css pixels.
...And 4 more matches

HTMLContentElement - Web APIs

Web › API › HTMLContentElement

the htmlcontentelement interface represents a <content> html element, which is used in shadow dom.
... the htmlcontentelement interface represents a <content> html element, which is used in shadow dom.
... the htmlcontentelement interface represents a <content> html element, which is used in shadow dom.
...And 4 more matches

HTMLElement.contentEditable - Web APIs

Web › API › HTMLElement › contentEditable

the contenteditable property of the htmlelement interface specifies whether or not the element is editable.
... the contenteditable property of the htmlelement interface specifies whether or not the element is editable.
... the contenteditable property of the htmlelement interface specifies whether or not the element is editable.
...And 4 more matches

HTMLElement.contextMenu - Web APIs

Web › API › HTMLElement › contextMenu

the htmlelement.contextmenu property refers to the context menu assigned to an element using the contextmenu attribute.
... the htmlelement.contextmenu property refers to the context menu assigned to an element using the contextmenu attribute.
... the htmlelement.contextmenu property refers to the context menu assigned to an element using the contextmenu attribute.
...And 4 more matches

HTMLImageElement.alt - Web APIs

Web › API › HTMLImageElement › alt

the htmlimageelement property alt provides fallback (alternate) text to display when the image specified by the <img> element is not loaded.
...sually impaired users.
...: when choosing alt strings for your images, imagine what you would say when reading the page to someone over the phone without mentioning that there's an image on the page.
...And 4 more matches

HTMLImageElement.currentSrc - Web APIs

Web › API › HTMLImageElement › currentSrc

the read-only htmlimageelement property currentsrc indicates the url of the image which is currently presented in the <img> element it represents.
... the read-only htmlimageelement property currentsrc indicates the url of the image which is currently presented in the <img> element it represents.
... the read-only htmlimageelement property currentsrc indicates the url of the image which is currently presented in the <img> element it represents.
...And 4 more matches

HTMLImageElement.useMap - Web APIs

Web › API › HTMLImageElement › useMap

the usemap property on the htmlimageelement interface reflects the value of the html usemap attribute, which is a string providing the name of the client-side image map to apply to the image.
... the usemap property on the htmlimageelement interface reflects the value of the html usemap attribute, which is a string providing the name of the client-side image map to apply to the image.
... the usemap property on the htmlimageelement interface reflects the value of the html usemap attribute, which is a string providing the name of the client-side image map to apply to the image.
...And 4 more matches

HTMLInputElement.select() - Web APIs

Web › API › HTMLInputElement › select

the htmlinputelement.select() method selects all the text in a <textarea> element or in an <input> element that includes a text field.
... the htmlinputelement.select() method selects all the text in a <textarea> element or in an <input> element that includes a text field.
... the htmlinputelement.select() method selects all the text in a <textarea> element or in an <input> element that includes a text field.
...And 4 more matches

HTMLMediaElement.currentSrc - Web APIs

Web › API › HTMLMediaElement › currentSrc

the htmlmediaelement.currentsrc property contains the absolute url of the chosen media resource.
... web server selects a media file based on the resolution of the user's display.
...sed on the resolution of the user's display.
...And 4 more matches

HTMLMediaElement.play() - Web APIs

Web › API › HTMLMediaElement › play

the htmlmediaelement play() method attempts to begin playback of the media.
... the htmlmediaelement play() method attempts to begin playback of the media.
...delay before the returned promise is resolved.
...And 4 more matches

HTMLMenuElement - Web APIs

Web › API › HTMLMenuElement

the htmlmenuelement interface provides special properties (beyond those defined on the regular htmlelement interface it also has available to it by inheritance) for manipulating <menu> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 4 more matches

HTMLOrForeignElement.dataset - Web APIs

Web › API › HTMLOrForeignElement › dataset

the dataset read-only property of the htmlorforeignelement interface provides read/write access to all the custom data attributes (data-*) set on the element.
...owed by its lowercase counterpart; other characters are left unchanged.
...on in the rules above ensures that the two transformations are the inverse one of the other.
...And 4 more matches

HTMLPictureElement - Web APIs

Web › API › HTMLPictureElement

the htmlpictureelement interface represents a <picture> html element.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 4 more matches

HTMLSelectElement.remove() - Web APIs

Web › API › HTMLSelectElement › remove

the htmlselectelement.remove() method removes the element at the specified index from the options collection for this select element.
... the htmlselectelement.remove() method removes the element at the specified index from the options collection for this select element.
... the htmlselectelement.remove() method removes the element at the specified index from the options collection for this select element.
...And 4 more matches

HTMLSlotElement: slotchange event - Web APIs

Web › API › HTMLSlotElement › slotchange event

the slotchange event is fired on an htmlslotelement instance (<slot> element) when the node(s) contained in that slot change.
...in that slot change.
... event doesn't fire if the children of a slotted node change — only if you change (e.g.
...And 4 more matches

HTMLTableElement.caption - Web APIs

Web › API › HTMLTableElement › caption

the htmltableelement.caption property represents the table caption.
... the htmltableelement.caption property represents the table caption.
... the htmltableelement.caption property represents the table caption.
...And 4 more matches

HTMLTableElement.createCaption() - Web APIs

Web › API › HTMLTableElement › createCaption

the htmltableelement.createcaption() method returns the <caption> element associated with a given <table>.
... the htmltableelement.createcaption() method returns the <caption> element associated with a given <table>.
... the htmltableelement.createcaption() method returns the <caption> element associated with a given <table>.
...And 4 more matches

HTMLVideoElement.getVideoPlaybackQuality() - Web APIs

Web › API › HTMLVideoElement › getVideoPlaybackQuality

the htmlvideoelement method getvideoplaybackquality() creates and returns a videoplaybackquality object containing metrics including how many frames have been lost.
... the htmlvideoelement method getvideoplaybackquality() creates and returns a videoplaybackquality object containing metrics including how many frames have been lost.
... the htmlvideoelement method getvideoplaybackquality() creates and returns a videoplaybackquality object containing metrics including how many frames have been lost.
...And 4 more matches

SVGGeometryElement.isPointInFill() - Web APIs

Web › API › SVGGeometryElement › isPointInFill

the svggeometryelement.ispointinfill() method determines whether a given point is within the fill shape of an element.
... the svggeometryelement.ispointinfill() method determines whether a given point is within the fill shape of an element.
... the svggeometryelement.ispointinfill() method determines whether a given point is within the fill shape of an element.
...And 4 more matches

SVGGeometryElement.isPointInStroke() - Web APIs

Web › API › SVGGeometryElement › isPointInStroke

the svggeometryelement.ispointinstroke() method determines whether a given point is within the stroke shape of an element.
... the svggeometryelement.ispointinstroke() method determines whether a given point is within the stroke shape of an element.
... the svggeometryelement.ispointinstroke() method determines whether a given point is within the stroke shape of an element.
...And 4 more matches

SVGGlyphElement - Web APIs

Web › API › SVGGlyphElement

the svgglyphelement interface corresponds to the <glyph> element.
... the svgglyphelement interface corresponds to the <glyph> element.
...of the <glyph> element via the svg dom is not possible.
...And 4 more matches

<aside>: The Aside element - HTML: Hypertext Markup Language

Web › HTML › Element › aside

the html <aside> element represents a portion of a document whose content is only indirectly related to the document's main content.
...sitory.
...xamples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 4 more matches

<blockquote>: The Block Quotation element - HTML: Hypertext Markup Language

Web › HTML › Element › blockquote

the html <blockquote> element (or html block quotation element) indicates that the enclosed text is an extended quotation.
... the html <blockquote> element (or html block quotation element) indicates that the enclosed text is an extended quotation.
...repository.
...And 4 more matches

<hr>: The Thematic Break (Horizontal Rule) element - HTML: Hypertext Markup Language

Web › HTML › Element › hr

the html <hr> element represents a thematic break between paragraph-level elements: for example, a change of scene in a story, or a shift of topic within a section.
...f topic within a section.
...istorically, this has been presented as a horizontal rule or line.
...And 4 more matches

<q>: The Inline Quotation element - HTML: Hypertext Markup Language

Web › HTML › Element › q

the html <q> element indicates that the enclosed text is a short inline quotation.
... the html <q> element indicates that the enclosed text is a short inline quotation.
... the html <q> element indicates that the enclosed text is a short inline quotation.
...And 4 more matches

<rtc>: The Ruby Text Container element - HTML: Hypertext Markup Language

Web › HTML › Element › rtc

the html ruby text container (<rtc>) element embraces semantic annotations of characters presented in a ruby of <rb> elements used inside of <ruby> element.
... the html ruby text container (<rtc>) element embraces semantic annotations of characters presented in a ruby of <rb> elements used inside of <ruby> element.
...> elements can have both pronunciation (<rt>) and semantic (<rtc>) annotations.
...And 4 more matches

<small>: the side comment element - HTML: Hypertext Markup Language

Web › HTML › Element › small

the html <small> element represents side-comments and small print, like copyright and legal text, independent of its styled presentation.
...stored in a github repository.
...o contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 4 more matches

<sub>: The Subscript element - HTML: Hypertext Markup Language

Web › HTML › Element › sub

the html subscript element (<sub>) specifies inline text which should be displayed as subscript for solely typographical reasons.
...itory.
... content categories flow content, phrasing content, palpable content.
...And 4 more matches

Element - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Element

an element is a part of a webpage.
... an element is a part of a webpage.
... an element is a part of a webpage.
...And 3 more matches

Empty element - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Empty element

an empty element is an element from html, svg, or mathml that cannot have any child nodes (i.e., nested elements or text nodes).
... an empty element is an element from html, svg, or mathml that cannot have any child nodes (i.e., nested elements or text nodes).
... an empty element is an element from html, svg, or mathml that cannot have any child nodes (i.e., nested elements or text nodes).
...And 3 more matches

Reposition elements in the page - Firefox Developer Tools

Tools › Page Inspector › How to › Reposition elements in the page

new in firefox 48 starting in firefox 48 you can move absolutely positioned elements by dragging them around the page.
... new in firefox 48 starting in firefox 48 you can move absolutely positioned elements by dragging them around the page.
... new in firefox 48 starting in firefox 48 you can move absolutely positioned elements by dragging them around the page.
...And 3 more matches

Element.clientHeight - Web APIs

Web › API › Element › clientHeight

the element.clientheight read-only property is zero for elements with no css or inline layout boxes; otherwise, it's the inner height of an element in pixels.
... the element.clientheight read-only property is zero for elements with no css or inline layout boxes; otherwise, it's the inner height of an element in pixels.
...theight read-only property is zero for elements with no css or inline layout boxes; otherwise, it's the inner height of an element in pixels.
...And 3 more matches

Element.clientLeft - Web APIs

Web › API › Element › clientLeft

the width of the left border of an element in pixels.
... the width of the left border of an element in pixels.
... rendered.
...And 3 more matches

Element.clientWidth - Web APIs

Web › API › Element › clientWidth

the element.clientwidth property is zero for inline elements and elements with no css; otherwise, it's the inner width of an element in pixels.
... the element.clientwidth property is zero for inline elements and elements with no css; otherwise, it's the inner width of an element in pixels.
... the element.clientwidth property is zero for inline elements and elements with no css; otherwise, it's the inner width of an element in pixels.
...And 3 more matches

Element.computedStyleMap() - Web APIs

Web › API › Element › computedStyleMap

the computedstylemap() method of the element interface returns a stylepropertymapreadonly interface which provides a read-only representation of a css declaration block that is an alternative to cssstyledeclaration.
... the computedstylemap() method of the element interface returns a stylepropertymapreadonly interface which provides a read-only representation of a css declaration block that is an alternative to cssstyledeclaration.
...a paragraph with a link, and a definition list to which we will add all the css property / value pairs.
...And 3 more matches

Element.hasAttributes() - Web APIs

Web › API › Element › hasAttributes

the hasattributes() method of the element interface returns a boolean indicating whether the current element has any attributes or not.
... the hasattributes() method of the element interface returns a boolean indicating whether the current element has any attributes or not.
... the hasattributes() method of the element interface returns a boolean indicating whether the current element has any attributes or not.
...And 3 more matches

Element.openOrClosedShadowRoot - Web APIs

Web › API › Element › openOrClosedShadowRoot

note: this api is available only to webextensions.
... note: this api is available only to webextensions.
... note: this api is available only to webextensions.
...And 3 more matches

Element.releasePointerCapture() - Web APIs

Web › API › Element › releasePointerCapture

the releasepointercapture() method of the element interface releases (stops) pointer capture that was previously set for a specific (pointerevent) pointer.
... the releasepointercapture() method of the element interface releases (stops) pointer capture that was previously set for a specific (pointerevent) pointer.
... the releasepointercapture() method of the element interface releases (stops) pointer capture that was previously set for a specific (pointerevent) pointer.
...And 3 more matches

Element.setAttributeNodeNS() - Web APIs

Web › API › Element › setAttributeNodeNS

setattributenodens adds a new namespaced attribute node to an element.
... setattributenodens adds a new namespaced attribute node to an element.
...r = element.setattributenodens(attributenode) replacedattr is the replaced attribute node, if any, returned by this function.
...And 3 more matches

Element.tabStop - Web APIs

Web › API › Element › tabStop

the tabstop property of the element interface returns a boolean indicating if the element can receive input focus via the tab key.
... the tabstop property of the element interface returns a boolean indicating if the element can receive input focus via the tab key.
... the tabstop property of the element interface returns a boolean indicating if the element can receive input focus via the tab key.
...And 3 more matches

Element.toggleAttribute() - Web APIs

Web › API › Element › toggleAttribute

the toggleattribute() method of the element interface toggles a boolean attribute (removing it if it is present and adding it if it is not present) on the given element.
... the toggleattribute() method of the element interface toggles a boolean attribute (removing it if it is present and adding it if it is not present) on the given element.
...ibute() method of the element interface toggles a boolean attribute (removing it if it is present and adding it if it is not present) on the given element.
...And 3 more matches

HTMLDialogElement.showModal() - Web APIs

Web › API › HTMLDialogElement › showModal

the showmodal() method of the htmldialogelement interface displays the dialog as a modal, over the top of any other dialogs that might be present.
... the showmodal() method of the htmldialogelement interface displays the dialog as a modal, over the top of any other dialogs that might be present.
...al, over the top of any other dialogs that might be present.
...And 3 more matches

HTMLElement.click() - Web APIs

Web › API › HTMLElement › click

the htmlelement.click() method simulates a mouse click on an element.
... the htmlelement.click() method simulates a mouse click on an element.
... the htmlelement.click() method simulates a mouse click on an element.
...And 3 more matches

HTMLElement.offsetTop - Web APIs

Web › API › HTMLElement › offsetTop

the htmlelement.offsettop read-only property returns the distance of the current element relative to the top of the offsetparent node.
... the htmlelement.offsettop read-only property returns the distance of the current element relative to the top of the offsetparent node.
... the htmlelement.offsettop read-only property returns the distance of the current element relative to the top of the offsetparent node.
...And 3 more matches

HTMLFormElement.method - Web APIs

Web › API › HTMLFormElement › method

the htmlformelement.method property represents the http method used to submit the <form>.
... the htmlformelement.method property represents the http method used to submit the <form>.
... the htmlformelement.method property represents the http method used to submit the <form>.
...And 3 more matches

HTMLHyperlinkElementUtils.href - Web APIs

Web › API › HTMLHyperlinkElementUtils › href

the htmlhyperlinkelementutils.href property is a stringifier that returns a usvstring containing the whole url, and allows the href to be updated.
... the htmlhyperlinkelementutils.href property is a stringifier that returns a usvstring containing the whole url, and allows the href to be updated.
... the htmlhyperlinkelementutils.href property is a stringifier that returns a usvstring containing the whole url, and allows the href to be updated.
...And 3 more matches

HTMLHyperlinkElementUtils.pathname - Web APIs

Web › API › HTMLHyperlinkElementUtils › pathname

the htmlhyperlinkelementutils.pathname property is a usvstring containing an initial '/' followed by the path of the url (or the empty string if there is no path).
... the htmlhyperlinkelementutils.pathname property is a usvstring containing an initial '/' followed by the path of the url (or the empty string if there is no path).
... the htmlhyperlinkelementutils.pathname property is a usvstring containing an initial '/' followed by the path of the url (or the empty string if there is no path).
...And 3 more matches

HTMLHyperlinkElementUtils.toString() - Web APIs

Web › API › HTMLHyperlinkElementUtils › toString

the htmlhyperlinkelementutils.tostring() stringifier method returns a usvstring containing the whole url.
... the htmlhyperlinkelementutils.tostring() stringifier method returns a usvstring containing the whole url.
... the htmlhyperlinkelementutils.tostring() stringifier method returns a usvstring containing the whole url.
...And 3 more matches

HTMLImageElement.align - Web APIs

Web › API › HTMLImageElement › align

the obsolete align property of the htmlimageelement interface is a string which indicates how to position the image relative to its container.
...perty of the htmlimageelement interface is a string which indicates how to position the image relative to its container.
...ing which indicates how to position the image relative to its container.
...And 3 more matches

HTMLImageElement.isMap - Web APIs

Web › API › HTMLImageElement › isMap

the htmlimageelement proeprty ismap is a boolean value which indicates that the image is to be used by a server-side image map.
... the htmlimageelement proeprty ismap is a boolean value which indicates that the image is to be used by a server-side image map.
... the htmlimageelement proeprty ismap is a boolean value which indicates that the image is to be used by a server-side image map.
...And 3 more matches

HTMLImageElement.name - Web APIs

Web › API › HTMLImageElement › name

the htmlimageelement interface's deprecated name property specifies a name for the element.
... the htmlimageelement interface's deprecated name property specifies a name for the element.
... the htmlimageelement interface's deprecated name property specifies a name for the element.
...And 3 more matches

HTMLImageElement.sizes - Web APIs

Web › API › HTMLImageElement › sizes

the htmlimageelement property sizes allows you to specify the layout width of the image for each of a list of media conditions.
... you to specify the layout width of the image for each of a list of media conditions.
...ut width of the image for each of a list of media conditions.
...And 3 more matches

HTMLInputElement: invalid event - Web APIs

Web › API › HTMLInputElement › invalid event

the invalid event fires when a submittable element has been checked for validity and doesn't satisfy its constraints.
...y and doesn't satisfy its constraints.
...terface event event handler property globaleventhandlers.oninvalid this event can be useful for displaying a summary of the problems with a form on submission.
...And 3 more matches

HTMLInputElement.setRangeText() - Web APIs

Web › API › HTMLInputElement › setRangeText

the htmlinputelement.setrangetext() method replaces a range of text in an <input> or <textarea> element with a new string.
... the htmlinputelement.setrangetext() method replaces a range of text in an <input> or <textarea> element with a new string.
... the htmlinputelement.setrangetext() method replaces a range of text in an <input> or <textarea> element with a new string.
...And 3 more matches

HTMLInputElement.webkitEntries - Web APIs

Web › API › HTMLInputElement › webkitEntries

the read-only webkitentries property of the htmlinputelement interface contains an array of file system entries (as objects based on filesystementry) representing files and/or directories selected by the user using an <input> element of type file, but only if that selection was made using drag-and-drop: selecting a file in the dialog will leave the property empty (bug 1326031).
...ray of file system entries (as objects based on filesystementry) representing files and/or directories selected by the user using an <input> element of type file, but only if that selection was made using drag-and-drop: selecting a file in the dialog will leave the property empty (bug 1326031).
...the dialog will leave the property empty (bug 1326031).
...And 3 more matches

HTMLInputElement.webkitdirectory - Web APIs

Web › API › HTMLInputElement › webkitdirectory

the htmlinputelement.webkitdirectory is a property that reflects the webkitdirectory html attribute and indicates that the <input> element should let the user select directories instead of files.
...ebkitdirectory is a property that reflects the webkitdirectory html attribute and indicates that the <input> element should let the user select directories instead of files.
...te and indicates that the <input> element should let the user select directories instead of files.
...And 3 more matches

HTMLLabelElement.htmlFor - Web APIs

Web › API › HTMLLabelElement › htmlFor

the htmllabelelement.htmlfor property reflects the value of the for content property.
... the htmllabelelement.htmlfor property reflects the value of the for content property.
... the htmllabelelement.htmlfor property reflects the value of the for content property.
...And 3 more matches

HTMLMediaElement.currentTime - Web APIs

Web › API › HTMLMediaElement › currentTime

the htmlmediaelement interface's currenttime property specifies the current playback time in seconds.
... the htmlmediaelement interface's currenttime property specifies the current playback time in seconds.
... the htmlmediaelement interface's currenttime property specifies the current playback time in seconds.
...And 3 more matches

HTMLMediaElement.duration - Web APIs

Web › API › HTMLMediaElement › duration

the read-only htmlmediaelement property duration indicates the length of the element's media in seconds.
... the read-only htmlmediaelement property duration indicates the length of the element's media in seconds.
... the read-only htmlmediaelement property duration indicates the length of the element's media in seconds.
...And 3 more matches

HTMLMediaElement.ended - Web APIs

Web › API › HTMLMediaElement › ended

the htmlmediaelement.ended indicates whether the media element has ended playback.
... the htmlmediaelement.ended indicates whether the media element has ended playback.
... the htmlmediaelement.ended indicates whether the media element has ended playback.
...And 3 more matches

HTMLMediaElement.fastSeek() - Web APIs

Web › API › HTMLMediaElement › fastSeek

the htmlmediaelement.fastseek() method quickly seeks the media to the new time with precision tradeoff.
... the htmlmediaelement.fastseek() method quickly seeks the media to the new time with precision tradeoff.
... the htmlmediaelement.fastseek() method quickly seeks the media to the new time with precision tradeoff.
...And 3 more matches

HTMLMediaElement.videoTracks - Web APIs

Web › API › HTMLMediaElement › videoTracks

the read-only videotracks property on htmlmediaelement objects returns a videotracklist object listing all of the videotrack objects representing the media element's video tracks.
... the read-only videotracks property on htmlmediaelement objects returns a videotracklist object listing all of the videotrack objects representing the media element's video tracks.
...ng the media element's video tracks.
...And 3 more matches

HTMLSelectElement.disabled - Web APIs

Web › API › HTMLSelectElement › disabled

the htmlselectelement.disabled is a boolean that reflects the disabled html attribute, which indicates whether the control is disabled.
... the htmlselectelement.disabled is a boolean that reflects the disabled html attribute, which indicates whether the control is disabled.
... the htmlselectelement.disabled is a boolean that reflects the disabled html attribute, which indicates whether the control is disabled.
...And 3 more matches

HTMLSelectElement.type - Web APIs

Web › API › HTMLSelectElement › type

the htmlselectelement.type read-only property returns the form control's type.
... var str = selectelt.type; the possible values are: "select-multiple" if multiple values can be selected.
... one value can be selected.
...And 3 more matches

HTMLTableElement.createTFoot() - Web APIs

Web › API › HTMLTableElement › createTFoot

the htmltableelement.createtfoot() method returns the <tfoot> element associated with a given <table>.
... the htmltableelement.createtfoot() method returns the <tfoot> element associated with a given <table>.
...ableelement.createtfoot() method returns the <tfoot> element associated with a given <table>.
...And 3 more matches

HTMLTableElement.createTHead() - Web APIs

Web › API › HTMLTableElement › createTHead

the htmltableelement.createthead() method returns the <thead> element associated with a given <table>.
... the htmltableelement.createthead() method returns the <thead> element associated with a given <table>.
...tableelement.createthead() method returns the <thead> element associated with a given <table>.
...And 3 more matches

HTMLTemplateElement.content - Web APIs

Web › API › HTMLTemplateElement › content

the htmltemplateelement.content property returns a <template> element's template contents (a documentfragment).
... the htmltemplateelement.content property returns a <template> element's template contents (a documentfragment).
... the htmltemplateelement.content property returns a <template> element's template contents (a documentfragment).
...And 3 more matches

HTMLVideoElement.msIsLayoutOptimalForPlayback - Web APIs

Web › API › HTMLVideoElement › msIsLayoutOptimalForPlayback

oduction sites facing the web: it will not work for every user.
...property is specific to internet explorer and microsoft edge.
...ideoelement.msislayoutoptimalforplayback: domstring; value boolean value set to true indicates that video is being rendered optimally (better performance and using less battery power).
...And 3 more matches

OES_element_index_uint - Web APIs

Web › API › OES element index uint

the oes_element_index_uint extension is part of the webgl api and adds support for gl.unsigned_int types to webglrenderingcontext.drawelements().
...ements().
...information, see also using extensions in the webgl tutorial.
...And 3 more matches

SVGAltGlyphDefElement - Web APIs

Web › API › SVGAltGlyphDefElement

the svgaltglyphdefelement interface corresponds to the <altglyphdef> element.
...terface corresponds to the <altglyphdef> element.
... left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a xlink:href="/docs/web/api/svgaltglyphdefelement" target="_top"><rect x="1" y="1" width="210" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="106" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgaltglyphdefelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} warning: this interface was removed in the svg 2 specification.
...And 3 more matches

SVGAltGlyphItemElement - Web APIs

Web › API › SVGAltGlyphItemElement

the svgaltglyphitemelement interface corresponds to the <altglyphitem> element.
...rface corresponds to the <altglyphitem> element.
...eft: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a xlink:href="/docs/web/api/svgaltglyphitemelement" target="_top"><rect x="1" y="1" width="220" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="111" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgaltglyphitemelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} warning: this interface was removed in the svg 2 specification.
...And 3 more matches

SVGFontElement - Web APIs

Web › API › SVGFontElement

the svgfontelement interface corresponds to the <font> elements.
... the svgfontelement interface corresponds to the <font> elements.
... of the <font> element via the svg dom is not possible.
...And 3 more matches

SVGFontFaceElement - Web APIs

Web › API › SVGFontFaceElement

the svgfontfaceelement interface corresponds to the <font-face> elements.
... the svgfontfaceelement interface corresponds to the <font-face> elements.
...font-face> element via the svg dom is not possible.
...And 3 more matches

SVGFontFaceFormatElement - Web APIs

Web › API › SVGFontFaceFormatElement

the svgfontfaceformatelement interface corresponds to the <font-face-format> elements.
... the svgfontfaceformatelement interface corresponds to the <font-face-format> elements.
...mat> element via the svg dom is not possible.
...And 3 more matches

SVGFontFaceNameElement - Web APIs

Web › API › SVGFontFaceNameElement

the svgfontfacenameelement interface corresponds to the <font-face-name> elements.
... the svgfontfacenameelement interface corresponds to the <font-face-name> elements.
...-name> element via the svg dom is not possible.
...And 3 more matches

SVGFontFaceSrcElement - Web APIs

Web › API › SVGFontFaceSrcElement

the svgfontfacesrcelement interface corresponds to the <font-face-src> elements.
... the svgfontfacesrcelement interface corresponds to the <font-face-src> elements.
...ce-src> element via the svg dom is not possible.
...And 3 more matches

SVGFontFaceUriElement - Web APIs

Web › API › SVGFontFaceUriElement

the svgfontfaceurielement interface corresponds to the <font-face-uri> elements.
... the svgfontfaceurielement interface corresponds to the <font-face-uri> elements.
...ce-uri> element via the svg dom is not possible.
...And 3 more matches

SVGHKernElement - Web APIs

Web › API › SVGHKernElement

the svghkernelement interface corresponds to the <hkern> elements.
... the svghkernelement interface corresponds to the <hkern> elements.
...f the <hkern> element via the svg dom is not possible.
...And 3 more matches

SVGMissingGlyphElement - Web APIs

Web › API › SVGMissingGlyphElement

the svgmissingglyphelement interface corresponds to the <missing-glyph> elements.
... the svgmissingglyphelement interface corresponds to the <missing-glyph> elements.
...glyph> element via the svg dom is not possible.
...And 3 more matches

SVGTRefElement - Web APIs

Web › API › SVGTRefElement

the svgtrefelement interface corresponds to the <tref> elements.
... the svgtrefelement interface corresponds to the <tref> elements.
... of the <tref> element via the svg dom is not possible.
...And 3 more matches

SVGVKernElement - Web APIs

Web › API › SVGVKernElement

the svgvkernelement interface corresponds to the <vkern> elements.
... the svgvkernelement interface corresponds to the <vkern> elements.
...f the <vkern> element via the svg dom is not possible.
...And 3 more matches

Window.frameElement - Web APIs

Web › API › Window › frameElement

the window.frameelement property returns the element (such as <iframe> or <object>) in which the window is embedded.
... the window.frameelement property returns the element (such as <iframe> or <object>) in which the window is embedded.
... the window.frameelement property returns the element (such as <iframe> or <object>) in which the window is embedded.
...And 3 more matches

<blink>: The Blinking Text element (obsolete) - HTML: Hypertext Markup Language

Web › HTML › Element › blink

the html blink element (<blink>) is a non-standard element which causes the enclosed text to flash slowly.
... the html blink element (<blink>) is a non-standard element which causes the enclosed text to flash slowly.
... the html blink element (<blink>) is a non-standard element which causes the enclosed text to flash slowly.
...And 3 more matches

<datalist>: The HTML Data List element - HTML: Hypertext Markup Language

Web › HTML › Element › datalist

the html <datalist> element contains a set of <option> elements that represent the permissible or recommended options available to choose from within other controls.
... from within other controls.
...contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 3 more matches

<pre>: The Preformatted Text element - HTML: Hypertext Markup Language

Web › HTML › Element › pre

the html <pre> element represents preformatted text which is to be presented exactly as written in the html file.
... the html <pre> element represents preformatted text which is to be presented exactly as written in the html file.
...in a github repository.
...And 3 more matches

<shadow>: The obsolete Shadow Root element - HTML: Hypertext Markup Language

Web › HTML › Element › shadow

the html <shadow> element—an obsolete part of the web components technology suite—was intended to be used as a shadow dom insertion point.
...ology suite—was intended to be used as a shadow dom insertion point.
...ated multiple shadow roots under a shadow host.
...And 3 more matches

Element - Archive of obsolete content

Archive › RSS › Module › Slash › Element

rss slash module elements note: in the list of elements below the slash xml namespace prefix is used (since it is a popular choice).
... rss slash module elements note: in the list of elements below the slash xml namespace prefix is used (since it is a popular choice).
... rss slash module elements note: in the list of elements below the slash xml namespace prefix is used (since it is a popular choice).
...And 2 more matches

XForms Group Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Group

introduction the group element is used as a container for defining a hierarchy of form controls.
... introduction the group element is used as a container for defining a hierarchy of form controls.
... introduction the group element is used as a container for defining a hierarchy of form controls.
...And 2 more matches

XForms Help Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Help

introduction specifies contextual help for the containing form control (see the spec).
... specifies contextual help for the containing form control (see the spec).
...ieves a xforms-help event.
...And 2 more matches

XForms Hint Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Hint

introduction similar to a tooltip (see the spec).
... introduction similar to a tooltip (see the spec).
...ieves a xforms-hint event.
...And 2 more matches

XForms Submit Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Submit

introduction this form control initiates a submission.
... (see the spec) specified in its submission attibute.
...ibutes ui common appearance - the value of this attribute gives a hint to the xforms processor as to which type of widget(s) to use to represent this control.
...And 2 more matches

XForms Upload Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Upload

introduction provides a means for the user to select a file (see the spec) from the file system.
...vides a means for the user to select a file (see the spec) from the file system.
...ec) from the file system.
...And 2 more matches

nsIXFormsNSModelElement

Mozilla › Tech › XPCOM › Reference › Interface › nsIXFormsNSModelElement

nsixformsnsmodelelement is implemented by all xforms <model/> elements.
... nsixformsnsmodelelement is implemented by all xforms <model/> elements.
... nsixformsnsmodelelement is implemented by all xforms <model/> elements.
...And 2 more matches

AnimationEvent.pseudoElement - Web APIs

Web › API › AnimationEvent › pseudoElement

summary the animationevent.pseudoelement read-only property is a domstring, starting with '::', containing the name of the pseudo-element the animation runs on.
... summary the animationevent.pseudoelement read-only property is a domstring, starting with '::', containing the name of the pseudo-element the animation runs on.
... summary the animationevent.pseudoelement read-only property is a domstring, starting with '::', containing the name of the pseudo-element the animation runs on.
...And 2 more matches

DocumentOrShadowRoot.pointerLockElement - Web APIs

Web › API › DocumentOrShadowRoot › pointerLockElement

the pointerlockelement property of the document and shadowroot interfaces provides the element set as the target for mouse events while the pointer is locked.
... the pointerlockelement property of the document and shadowroot interfaces provides the element set as the target for mouse events while the pointer is locked.
... the pointerlockelement property of the document and shadowroot interfaces provides the element set as the target for mouse events while the pointer is locked.
...And 2 more matches

Element.clientTop - Web APIs

Web › API › Element › clientTop

the width of the top border of an element in pixels.
... the width of the top border of an element in pixels.
... the width of the top border of an element in pixels.
...And 2 more matches

Element.part - Web APIs

Web › API › Element › part

the part property of the element interface represents the part identifier(s) of the element (i.e.
... the part property of the element interface represents the part identifier(s) of the element (i.e.
... the part property of the element interface represents the part identifier(s) of the element (i.e.
...And 2 more matches

Element.removeAttribute() - Web APIs

Web › API › Element › removeAttribute

the element method removeattribute() removes the attribute with the specified name from the element.
... the element method removeattribute() removes the attribute with the specified name from the element.
... the element method removeattribute() removes the attribute with the specified name from the element.
...And 2 more matches

Element.removeAttributeNS() - Web APIs

Web › API › Element › removeAttributeNS

the removeattributens() method of the element interface removes the specified attribute from an element.
... the removeattributens() method of the element interface removes the specified attribute from an element.
...ment.
...And 2 more matches

Element.removeAttributeNode() - Web APIs

Web › API › Element › removeAttributeNode

the removeattributenode() method of the element object removes the specified attribute from the current element.
... the removeattributenode() method of the element object removes the specified attribute from the current element.
... the removeattributenode() method of the element object removes the specified attribute from the current element.
...And 2 more matches

Element.setAttribute() - Web APIs

Web › API › Element › setAttribute

sets the value of an attribute on the specified element.
... sets the value of an attribute on the specified element.
...s added with the specified name and value.
...And 2 more matches

HTMLButtonElement.labels - Web APIs

Web › API › HTMLButtonElement › labels

the htmlbuttonelement.labels read-only property returns a nodelist of the <label> elements associated with the <button> element.
... the htmlbuttonelement.labels read-only property returns a nodelist of the <label> elements associated with the <button> element.
... the htmlbuttonelement.labels read-only property returns a nodelist of the <label> elements associated with the <button> element.
...And 2 more matches

HTMLCanvasElement.transferControlToOffscreen() - Web APIs

Web › API › HTMLCanvasElement › transferControlToOffscreen

the htmlcanvaselement.transfercontroltooffscreen() method transfers control to an offscreencanvas object, either on the main thread or on a worker.
... the htmlcanvaselement.transfercontroltooffscreen() method transfers control to an offscreencanvas object, either on the main thread or on a worker.
... the htmlcanvaselement.transfercontroltooffscreen() method transfers control to an offscreencanvas object, either on the main thread or on a worker.
...And 2 more matches

HTMLDialogElement.close() - Web APIs

Web › API › HTMLDialogElement › close

the close() method of the htmldialogelement interface closes the dialog.
... the close() method of the htmldialogelement interface closes the dialog.
...tance.close(returnvalue); parameters returnvalue optional a domstring representing an updated value for the htmldialogelement.returnvalue of the dialog.
...And 2 more matches

HTMLFormElement.requestSubmit() - Web APIs

Web › API › HTMLFormElement › requestSubmit

the htmlformelement method requestsubmit() requests that the form be submitted using a specific submit button.
... the htmlformelement method requestsubmit() requests that the form be submitted using a specific submit button.
... the htmlformelement method requestsubmit() requests that the form be submitted using a specific submit button.
...And 2 more matches

HTMLFormElement.submit() - Web APIs

Web › API › HTMLFormElement › submit

the htmlformelement.submit() method submits a given <form>.
... the htmlformelement.submit() method submits a given <form>.
...s not run.
...And 2 more matches

HTMLHyperlinkElementUtils.host - Web APIs

Web › API › HTMLHyperlinkElementUtils › host

the htmlhyperlinkelementutils.host property is a usvstring containing the host, that is the hostname, and then, if the port of the url is nonempty, a ':', and the port of the url.
... the htmlhyperlinkelementutils.host property is a usvstring containing the host, that is the hostname, and then, if the port of the url is nonempty, a ':', and the port of the url.
... the htmlhyperlinkelementutils.host property is a usvstring containing the host, that is the hostname, and then, if the port of the url is nonempty, a ':', and the port of the url.
...And 2 more matches

HTMLHyperlinkElementUtils.hostname - Web APIs

Web › API › HTMLHyperlinkElementUtils › hostname

the htmlhyperlinkelementutils.hostname property is a usvstring containing the domain of the url.
... the htmlhyperlinkelementutils.hostname property is a usvstring containing the domain of the url.
... the htmlhyperlinkelementutils.hostname property is a usvstring containing the domain of the url.
...And 2 more matches

HTMLHyperlinkElementUtils.port - Web APIs

Web › API › HTMLHyperlinkElementUtils › port

the htmlhyperlinkelementutils.port property is a usvstring containing the port number of the url.
... the htmlhyperlinkelementutils.port property is a usvstring containing the port number of the url.
... the htmlhyperlinkelementutils.port property is a usvstring containing the port number of the url.
...And 2 more matches

HTMLHyperlinkElementUtils.protocol - Web APIs

Web › API › HTMLHyperlinkElementUtils › protocol

the htmlhyperlinkelementutils.protocol property is a usvstring representing the protocol scheme of the url, including the final ':'.
... the htmlhyperlinkelementutils.protocol property is a usvstring representing the protocol scheme of the url, including the final ':'.
... the htmlhyperlinkelementutils.protocol property is a usvstring representing the protocol scheme of the url, including the final ':'.
...And 2 more matches

HTMLHyperlinkElementUtils.search - Web APIs

Web › API › HTMLHyperlinkElementUtils › search

the htmlhyperlinkelementutils.search property is a search string, also called a query string, that is usvstring containing a '?' followed by the parameters of the url.
...is a search string, also called a query string, that is usvstring containing a '?' followed by the parameters of the url.
...led a query string, that is usvstring containing a '?' followed by the parameters of the url.
...And 2 more matches

HTMLImageElement.border - Web APIs

Web › API › HTMLImageElement › border

the obsolete htmlimageelement property border specifies the number of pixels thick the border surrounding the image should be.
... to it.
... the writing-mode aware border-block-start-width, border-block-end-width, border-inline-start-width, and border-inline-end-width properties.
...And 2 more matches

HTMLImageElement.decode() - Web APIs

Web › API › HTMLImageElement › decode

the decode() method of the htmlimageelement interface returns a promise that resolves when the image is decoded and it is safe to append the image to the dom.
... the decode() method of the htmlimageelement interface returns a promise that resolves when the image is decoded and it is safe to append the image to the dom.
... the decode() method of the htmlimageelement interface returns a promise that resolves when the image is decoded and it is safe to append the image to the dom.
...And 2 more matches

HTMLImageElement.hspace - Web APIs

Web › API › HTMLImageElement › hspace

the obsolete hspace property of the htmlimageelement interface specifies the number of pixels of empty space to leave empty on the left and right sides of the <img> element when laying out the page.
... the obsolete hspace property of the htmlimageelement interface specifies the number of pixels of empty space to leave empty on the left and right sides of the <img> element when laying out the page.
... the obsolete hspace property of the htmlimageelement interface specifies the number of pixels of empty space to leave empty on the left and right sides of the <img> element when laying out the page.
...And 2 more matches

HTMLImageElement.longDesc - Web APIs

Web › API › HTMLImageElement › longDesc

the obsolete property longdesc on the htmlimageelement interface specifies the url of a text or html file which contains a long-form description of the image.
... the obsolete property longdesc on the htmlimageelement interface specifies the url of a text or html file which contains a long-form description of the image.
... the obsolete property longdesc on the htmlimageelement interface specifies the url of a text or html file which contains a long-form description of the image.
...And 2 more matches

HTMLImageElement.src - Web APIs

Web › API › HTMLImageElement › src

the htmlimageelement property src, which reflects the html src attribute, specifies the image to display in the <img> element.
... the htmlimageelement property src, which reflects the html src attribute, specifies the image to display in the <img> element.
... the htmlimageelement property src, which reflects the html src attribute, specifies the image to display in the <img> element.
...And 2 more matches

HTMLImageElement.vspace - Web APIs

Web › API › HTMLImageElement › vspace

the obsolete vspace property of the htmlimageelement interface specifies the number of pixels of empty space to leave empty on the top and bottom of the <img> element when laying out the page.
... the obsolete vspace property of the htmlimageelement interface specifies the number of pixels of empty space to leave empty on the top and bottom of the <img> element when laying out the page.
... the obsolete vspace property of the htmlimageelement interface specifies the number of pixels of empty space to leave empty on the top and bottom of the <img> element when laying out the page.
...And 2 more matches

HTMLInputElement.labels - Web APIs

Web › API › HTMLInputElement › labels

the htmlinputelement.labels read-only property returns a nodelist of the <label> elements associated with the <input> element.
... the htmlinputelement.labels read-only property returns a nodelist of the <label> elements associated with the <input> element.
... the htmlinputelement.labels read-only property returns a nodelist of the <label> elements associated with the <input> element.
...And 2 more matches

HTMLInputElement.stepDown() - Web APIs

Web › API › HTMLInputElement › stepDown

the htmlinputelement.stepdown([n]) method decrements the value of a numeric type of <input> element by the value of the step attribute or up to n multiples of the step attribute if a number is passed as the parameter.
...straints set by the step attribute, invoking the stepdown() method will return a value that does match the form controls constraints.
...oes not support the step attribute (see the list of supported input types in the the table above), or if the step value is set to any, an invalidstateerror exception is thrown.
...And 2 more matches

HTMLLabelElement.control - Web APIs

Web › API › HTMLLabelElement › control

the read-only htmllabelelement.control property returns a reference to the control (in the form of an object of type htmlelement or one of its derivatives) with which the <label> element is associated, or null if the label isn't associated with a control.
... the read-only htmllabelelement.control property returns a reference to the control (in the form of an object of type htmlelement or one of its derivatives) with which the <label> element is associated, or null if the label isn't associated with a control.
... the read-only htmllabelelement.control property returns a reference to the control (in the form of an object of type htmlelement or one of its derivatives) with which the <label> element is associated, or null if the label isn't associated with a control.
...And 2 more matches

HTMLMediaElement.playbackRate - Web APIs

Web › API › HTMLMediaElement › playbackRate

the htmlmediaelement.playbackrate property sets the rate at which the media is being played back.
...rent rate, so a value of 1.0 indicates normal speed.
...d is the same for every speed.
...And 2 more matches

HTMLMediaElement.readyState - Web APIs

Web › API › HTMLMediaElement › readyState

the htmlmediaelement.readystate property indicates the readiness state of the media.
...layback position as well as for at least a little bit of time into the future is available (in other words, at least two frames of video, for example).
...ough—that the media can be played through to the end without interruption.
...And 2 more matches

HTMLMediaElement.seekable - Web APIs

Web › API › HTMLMediaElement › seekable

the seekable read-only property of the htmlmediaelement returns a timeranges object that contains the time ranges that the user is able to seek to, if any.
....queryselector("video"); var timerangesobject = video.seekable; var timeranges = []; //go through the object and output an array for (let count = 0; count < timerangesobject.length; count ++) { timeranges.push([timerangesobject.start(count), timerangesobject.end(count)]); } specifications specification status comment html living standardthe definition of 'htmlmediaelement' in that specification.
...ut an array for (let count = 0; count < timerangesobject.length; count ++) { timeranges.push([timerangesobject.start(count), timerangesobject.end(count)]); } specifications specification status comment html living standardthe definition of 'htmlmediaelement' in that specification.
...And 2 more matches

HTMLMenuItemElement - Web APIs

Web › API › HTMLMenuItemElement

the htmlmenuitemelement interface provides special properties (beyond those defined on the regular htmlelement interface it also has available to it by inheritance) for manipulating <menuitem> elements.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...And 2 more matches

HTMLMeterElement.labels - Web APIs

Web › API › HTMLMeterElement › labels

the htmlmeterelement.labels read-only property returns a nodelist of the <label> elements associated with the <meter> element.
... the htmlmeterelement.labels read-only property returns a nodelist of the <label> elements associated with the <meter> element.
... the htmlmeterelement.labels read-only property returns a nodelist of the <label> elements associated with the <meter> element.
...And 2 more matches

HTMLObjectElement.setCustomValidity - Web APIs

Web › API › HTMLObjectElement › setCustomValidity

the setcustomvalidity() method of the htmlobjectelement interface sets a custom validity message for the element.
... the setcustomvalidity() method of the htmlobjectelement interface sets a custom validity message for the element.
... the setcustomvalidity() method of the htmlobjectelement interface sets a custom validity message for the element.
...And 2 more matches

HTMLOutputElement.labels - Web APIs

Web › API › HTMLOutputElement › labels

the htmloutputelement.labels read-only property returns a nodelist of the <label> elements associated with the <output> element.
... the htmloutputelement.labels read-only property returns a nodelist of the <label> elements associated with the <output> element.
... the htmloutputelement.labels read-only property returns a nodelist of the <label> elements associated with the <output> element.
...And 2 more matches

HTMLProgressElement.labels - Web APIs

Web › API › HTMLProgressElement › labels

the htmlprogresselement.labels read-only property returns a nodelist of the <label> elements associated with the <progress> element.
... the htmlprogresselement.labels read-only property returns a nodelist of the <label> elements associated with the <progress> element.
... the htmlprogresselement.labels read-only property returns a nodelist of the <label> elements associated with the <progress> element.
...And 2 more matches

HTMLSelectElement.checkValidity() - Web APIs

Web › API › HTMLSelectElement › checkValidity

the htmlselectelement.checkvalidity() method checks whether the element has any constraints and whether it satisfies them.
... the htmlselectelement.checkvalidity() method checks whether the element has any constraints and whether it satisfies them.
... the htmlselectelement.checkvalidity() method checks whether the element has any constraints and whether it satisfies them.
...And 2 more matches

HTMLSelectElement.item() - Web APIs

Web › API › HTMLSelectElement › item

the htmlselectelement.item() method returns the element corresponding to the htmloptionelement whose position in the options list corresponds to the index given in the parameter, or null if there are none.
...se position in the options list corresponds to the index given in the parameter, or null if there are none.
...lent to selectelt.nameditem(index).
...And 2 more matches

HTMLSelectElement.labels - Web APIs

Web › API › HTMLSelectElement › labels

the htmlselectelement.labels read-only property returns a nodelist of the <label> elements associated with the <select> element.
... the htmlselectelement.labels read-only property returns a nodelist of the <label> elements associated with the <select> element.
... the htmlselectelement.labels read-only property returns a nodelist of the <label> elements associated with the <select> element.
...And 2 more matches

HTMLSelectElement.namedItem() - Web APIs

Web › API › HTMLSelectElement › namedItem

the htmlselectelement.nameditem() method returns the htmloptionelement corresponding to the htmloptionelement whose name or id match the specified name, or null if no option matches.
...ement corresponding to the htmloptionelement whose name or id match the specified name, or null if no option matches.
...value").
...And 2 more matches

HTMLSelectElement.selectedIndex - Web APIs

Web › API › HTMLSelectElement › selectedIndex

the htmlselectelement.selectedindex is a long that reflects the index of the first or last selected <option> element, depending on the value of multiple.
... the htmlselectelement.selectedindex is a long that reflects the index of the first or last selected <option> element, depending on the value of multiple.
...alue -1 indicates that no element is selected.
...And 2 more matches

HTMLSlotElement.assignedNodes() - Web APIs

Web › API › HTMLSlotElement › assignedNodes

the assignednodes() property of the htmlslotelement interface returns a sequence of the nodes assigned to this slot, and if the flatten option is set to true, the assigned nodes of any other slots that are descendants of this slot.
... the assignednodes() property of the htmlslotelement interface returns a sequence of the nodes assigned to this slot, and if the flatten option is set to true, the assigned nodes of any other slots that are descendants of this slot.
...slots that are descendants of this slot.
...And 2 more matches

HTMLSlotElement.name - Web APIs

Web › API › HTMLSlotElement › name

the name property of the htmlslotelement interface returns or sets the slot name.
... the name property of the htmlslotelement interface returns or sets the slot name.
... the name property of the htmlslotelement interface returns or sets the slot name.
...And 2 more matches

HTMLTableElement.align - Web APIs

Web › API › HTMLTableElement › align

the htmltableelement.align property represents the alignment of the table.
... the htmltableelement.align property represents the alignment of the table.
... the htmltableelement.align property represents the alignment of the table.
...And 2 more matches

HTMLTableElement.border - Web APIs

Web › API › HTMLTableElement › border

the htmltableelement.border property represents the border width of the <table> element.
... the htmltableelement.border property represents the border width of the <table> element.
... the htmltableelement.border property represents the border width of the <table> element.
...And 2 more matches

HTMLTableElement.cellPadding - Web APIs

Web › API › HTMLTableElement › cellPadding

the htmltableelement.cellpadding property represents the padding around the individual cells of the table.
... the htmltableelement.cellpadding property represents the padding around the individual cells of the table.
... the htmltableelement.cellpadding property represents the padding around the individual cells of the table.
...And 2 more matches

HTMLTableElement.cellSpacing - Web APIs

Web › API › HTMLTableElement › cellSpacing

while you should instead use the css border-spacing property, the obsolete htmltableelement interface's cellspacing property represents the spacing around the individual <th> and <td> elements representing a table's cells.
... while you should instead use the css border-spacing property, the obsolete htmltableelement interface's cellspacing property represents the spacing around the individual <th> and <td> elements representing a table's cells.
... while you should instead use the css border-spacing property, the obsolete htmltableelement interface's cellspacing property represents the spacing around the individual <th> and <td> elements representing a table's cells.
...And 2 more matches

HTMLTextAreaElement.labels - Web APIs

Web › API › HTMLTextAreaElement › labels

the htmltextareaelement.labels read-only property returns a nodelist of the <label> elements associated with the <textarea> element.
... the htmltextareaelement.labels read-only property returns a nodelist of the <label> elements associated with the <textarea> element.
... the htmltextareaelement.labels read-only property returns a nodelist of the <label> elements associated with the <textarea> element.
...And 2 more matches

SVGAnimateColorElement - Web APIs

Web › API › SVGAnimateColorElement

the svganimatecolorelement interface corresponds to the <animatecolor> element.
...face corresponds to the <animatecolor> element.
...ft: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a xlink:href="/docs/web/api/svganimatecolorelement" target="_top"><rect x="1" y="1" width="220" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="111" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svganimatecolorelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface has no properties but inherits properties from its parent, svganimationelement.
...And 2 more matches

SVGGeometryElement.getPointAtLength() - Web APIs

Web › API › SVGGeometryElement › getPointAtLength

the svggeometryelement.getpointatlength() method returns the point at a given distance along the path.
... the svggeometryelement.getpointatlength() method returns the point at a given distance along the path.
... the svggeometryelement.getpointatlength() method returns the point at a given distance along the path.
...And 2 more matches

SVGGeometryElement.getTotalLength() - Web APIs

Web › API › SVGGeometryElement › getTotalLength

the svggeometryelement.gettotallength() method returns the user agent's computed value for the total length of the path in user units.
... the svggeometryelement.gettotallength() method returns the user agent's computed value for the total length of the path in user units.
... the svggeometryelement.gettotallength() method returns the user agent's computed value for the total length of the path in user units.
...And 2 more matches

SVGGeometryElement.pathLength - Web APIs

Web › API › SVGGeometryElement › pathLength

the svggeometryelement.pathlength property reflects the pathlength attribute and returns the total length of the path, in user units.
... the svggeometryelement.pathlength property reflects the pathlength attribute and returns the total length of the path, in user units.
... the svggeometryelement.pathlength property reflects the pathlength attribute and returns the total length of the path, in user units.
...And 2 more matches

SVGPathElement.getPointAtLength() - Web APIs

Web › API › SVGPathElement › getPointAtLength

the svgpathelement.getpointatlength() method returns the point at a given distance along the path.
... the svgpathelement.getpointatlength() method returns the point at a given distance along the path.
... the svgpathelement.getpointatlength() method returns the point at a given distance along the path.
...And 2 more matches

SVGPathElement.getTotalLength() - Web APIs

Web › API › SVGPathElement › getTotalLength

the svgpathelement.gettotallength() method returns the user agent's computed value for the total length of the path in user units.
... the svgpathelement.gettotallength() method returns the user agent's computed value for the total length of the path in user units.
... the svgpathelement.gettotallength() method returns the user agent's computed value for the total length of the path in user units.
...And 2 more matches

SVGPathElement.pathLength - Web APIs

Web › API › SVGPathElement › pathLength

the svgpathelement.pathlength property reflects the pathlength attribute and returns the total length of the path, in user units.
... the svgpathelement.pathlength property reflects the pathlength attribute and returns the total length of the path, in user units.
... the svgpathelement.pathlength property reflects the pathlength attribute and returns the total length of the path, in user units.
...And 2 more matches

Text.isElementContentWhitespace - Web APIs

Web › API › Text › isElementContentWhitespace

note: you may simply replace it with /\s+/.test(text.data), /\s+/.test(text.nodevalue), or /\s+/.test(text.textcontent).
...t.data), /\s+/.test(text.nodevalue), or /\s+/.test(text.textcontent).
...mple above.
...And 2 more matches

TransitionEvent.pseudoElement - Web APIs

Web › API › TransitionEvent › pseudoElement

the transitionevent.pseudoelement read-only property is a domstring, starting with '::', containing the name of the pseudo-element the animation runs on.
... the transitionevent.pseudoelement read-only property is a domstring, starting with '::', containing the name of the pseudo-element the animation runs on.
... the transitionevent.pseudoelement read-only property is a domstring, starting with '::', containing the name of the pseudo-element the animation runs on.
...And 2 more matches

::-webkit-progress-inner-element - CSS: Cascading Style Sheets

Web › CSS › ::-webkit-progress-inner-element

the ::-webkit-progress-inner-element css pseudo-element represents the outermost container of the <progress> element.
... the ::-webkit-progress-inner-element css pseudo-element represents the outermost container of the <progress> element.
... the ::-webkit-progress-inner-element css pseudo-element represents the outermost container of the <progress> element.
...And 2 more matches

<figcaption>: The Figure Caption element - HTML: Hypertext Markup Language

Web › HTML › Element › figcaption

the html <figcaption> or figure caption element represents a caption or legend describing the rest of the contents of its parent <figure> element.
...ctive example is stored in a github repository.
... a github repository.
...And 2 more matches

<noembed>: The Embed Fallback element (Obsolete) - HTML: Hypertext Markup Language

Web › HTML › Element › noembed

the <noembed> element is an obsolete, non-standard way to provide alternative, or "fallback", content for browsers that do not support the <embed> element or do not support the type of embedded content an author wishes to use.
... the <noembed> element is an obsolete, non-standard way to provide alternative, or "fallback", content for browsers that do not support the <embed> element or do not support the type of embedded content an author wishes to use.
... the <noembed> element is an obsolete, non-standard way to provide alternative, or "fallback", content for browsers that do not support the <embed> element or do not support the type of embedded content an author wishes to use.
...And 2 more matches

<param>: The Object Parameter element - HTML: Hypertext Markup Language

Web › HTML › Element › param

the html <param> element defines parameters for an <object> element.
... the html <param> element defines parameters for an <object> element.
... the html <param> element defines parameters for an <object> element.
...And 2 more matches

<sup>: The Superscript element - HTML: Hypertext Markup Language

Web › HTML › Element › sup

the html superscript element (<sup>) specifies inline text which is to be displayed as superscript for solely typographical reasons.
...itory.
... content categories flow content, phrasing content, palpable content.
...And 2 more matches

element-available - XPath

Web › XPath › Functions › element-available

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the element-available function determines if an element is available and returns true or false.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the element-available function determines if an element is available and returns true or false.
...eturns true or false.
...And 2 more matches

getElementsByAttributeNS - Archive of obsolete content

Archive › Mozilla › XUL › Method › getElementsByAttributeNS

« xul reference home getelementsbyattributens(ns, attrib, value ) return type: dom nodelist returns an array of all the child elements of the element that have the attribute namespace given by the first argument, the attribute name given by the second argument, and the value given by the third argument.
... « xul reference home getelementsbyattributens(ns, attrib, value ) return type: dom nodelist returns an array of all the child elements of the element that have the attribute namespace given by the first argument, the attribute name given by the second argument, and the value given by the third argument.
...s, attrib, value ) return type: dom nodelist returns an array of all the child elements of the element that have the attribute namespace given by the first argument, the attribute name given by the second argument, and the value given by the third argument.
...e namespace given by the first argument, the attribute name given by the second argument, and the value given by the third argument.

XForms Range Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Range

ut for focusing this control.
...ue is false start - lower bound of possible values end - upper bound of possible values step - is used for incrementing/decrementing values start/end/step attributes if the value of the bound instance node is outside the range of values specified by the start and end attributes, then the range element receives a xforms-out-of-range event.
...ues can't be greater than the value of this attribute.
...n user interaction.

Script-supporting element - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Script-supporting element

in an html document, script-supporting elements are those elements that don't directly contribute to the appearance or layout of the page; instead, they're either scripts or contain information that's only used by scripts.
... in an html document, script-supporting elements are those elements that don't directly contribute to the appearance or layout of the page; instead, they're either scripts or contain information that's only used by scripts.
... in an html document, script-supporting elements are those elements that don't directly contribute to the appearance or layout of the page; instead, they're either scripts or contain information that's only used by scripts.
...tly contribute to the appearance or layout of the page; instead, they're either scripts or contain information that's only used by scripts.

nsIDOMHTMLMediaElement

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMHTMLMediaElement

dom/interfaces/html/nsidomhtmlmediaelement.idlscriptable the basis for the nsidomhtmlaudioelement and nsidomhtmlvideoelement interfaces, which in turn implement the <audio> and <video> html5 elements.
... dom/interfaces/html/nsidomhtmlmediaelement.idlscriptable the basis for the nsidomhtmlaudioelement and nsidomhtmlvideoelement interfaces, which in turn implement the <audio> and <video> html5 elements.
... dom/interfaces/html/nsidomhtmlmediaelement.idlscriptable the basis for the nsidomhtmlaudioelement and nsidomhtmlvideoelement interfaces, which in turn implement the <audio> and <video> html5 elements.
... dom/interfaces/html/nsidomhtmlmediaelement.idlscriptable the basis for the nsidomhtmlaudioelement and nsidomhtmlvideoelement interfaces, which in turn implement the <audio> and <video> html5 elements.

nsIDOMXULControlElement

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMXULControlElement

dom/interfaces/xul/nsidomxulcontrolelement.idlscriptable provides additional attributes specific to control elements.
... dom/interfaces/xul/nsidomxulcontrolelement.idlscriptable provides additional attributes specific to control elements.
... dom/interfaces/xul/nsidomxulcontrolelement.idlscriptable provides additional attributes specific to control elements.
...interfaces/xul/nsidomxulcontrolelement.idlscriptable provides additional attributes specific to control elements.

Element: compositionend event - Web APIs

Web › API › Element › compositionend event

vent is fired when a text composition system such as an input method editor completes or cancels the current composition session.
...method editor completes or cancels the current composition session.
...lear</button> </div> css body { padding: .2rem; display: grid; grid-template-areas: "control log"; } .control { grid-area: control; } .event-log { grid-area: log; } .event-log-contents { resize: none; } label, button { display: block; } input[type="text"] { margin: .5rem 0; } kbd { border-radius: 3px; padding: 1px 2px 0; border: 1px solid black; } js const inputelement = document.queryselector('input[type="text"]'); const log = document.queryselector('.event-log-contents'); const clearlog = document.queryselector('.clear-log'); clearlog.addeventlistener('click', () => { log.textcontent = ''; }); function handleevent(event) { log.textcontent = log.textcontent + `${event.type}: ${event.data}\n`; } inputelement.addeventlistener('compositionstart', handl...
...eryselector('input[type="text"]'); const log = document.queryselector('.event-log-contents'); const clearlog = document.queryselector('.clear-log'); clearlog.addeventlistener('click', () => { log.textcontent = ''; }); function handleevent(event) { log.textcontent = log.textcontent + `${event.type}: ${event.data}\n`; } inputelement.addeventlistener('compositionstart', handleevent); inputelement.addeventlistener('compositionupdate', handleevent); inputelement.addeventlistener('compositionend', handleevent); result specifications specification status ui events working draft ...

Element: compositionstart event - Web APIs

Web › API › Element › compositionstart event

the compositionstart event is fired when a text composition system such as an input method editor starts a new composition session.
...stem such as an input method editor starts a new composition session.
...lear</button> </div> css body { padding: .2rem; display: grid; grid-template-areas: "control log"; } .control { grid-area: control; } .event-log { grid-area: log; } .event-log-contents { resize: none; } label, button { display: block; } input[type="text"] { margin: .5rem 0; } kbd { border-radius: 3px; padding: 1px 2px 0; border: 1px solid black; } js const inputelement = document.queryselector('input[type="text"]'); const log = document.queryselector('.event-log-contents'); const clearlog = document.queryselector('.clear-log'); clearlog.addeventlistener('click', () => { log.textcontent = ''; }); function handleevent(event) { log.textcontent = log.textcontent + `${event.type}: ${event.data}\n`; } inputelement.addeventlistener('compositionstart', handl...
...eryselector('input[type="text"]'); const log = document.queryselector('.event-log-contents'); const clearlog = document.queryselector('.clear-log'); clearlog.addeventlistener('click', () => { log.textcontent = ''; }); function handleevent(event) { log.textcontent = log.textcontent + `${event.type}: ${event.data}\n`; } inputelement.addeventlistener('compositionstart', handleevent); inputelement.addeventlistener('compositionupdate', handleevent); inputelement.addeventlistener('compositionend', handleevent); result specifications specification status ui events working draft ...

Element: compositionupdate event - Web APIs

Web › API › Element › compositionupdate event

w character is received in the context of a text composition session controlled by a text composition system such as an input method editor.
...ession controlled by a text composition system such as an input method editor.
...lear</button> </div> css body { padding: .2rem; display: grid; grid-template-areas: "control log"; } .control { grid-area: control; } .event-log { grid-area: log; } .event-log-contents { resize: none; } label, button { display: block; } input[type="text"] { margin: .5rem 0; } kbd { border-radius: 3px; padding: 1px 2px 0; border: 1px solid black; } js const inputelement = document.queryselector('input[type="text"]'); const log = document.queryselector('.event-log-contents'); const clearlog = document.queryselector('.clear-log'); clearlog.addeventlistener('click', () => { log.textcontent = ''; }); function handleevent(event) { log.textcontent = log.textcontent + `${event.type}: ${event.data}\n`; } inputelement.addeventlistener('compositionstart', handl...
...eryselector('input[type="text"]'); const log = document.queryselector('.event-log-contents'); const clearlog = document.queryselector('.clear-log'); clearlog.addeventlistener('click', () => { log.textcontent = ''; }); function handleevent(event) { log.textcontent = log.textcontent + `${event.type}: ${event.data}\n`; } inputelement.addeventlistener('compositionstart', handleevent); inputelement.addeventlistener('compositionupdate', handleevent); inputelement.addeventlistener('compositionend', handleevent); result specifications specification status ui events working draft ...

Element: contextmenu event - Web APIs

Web › API › Element › contextmenu event

the contextmenu event fires when the user attempts to open a context menu.
... the contextmenu event fires when the user attempts to open a context menu.
... or by pressing the context menu key.
...default() when the contextmenu event is fired at the first paragraph.

Element.createShadowRoot() - Web APIs

Web › API › Element › createShadowRoot

use element.createshadowroot to create an instance of shadow dom.
... use element.createshadowroot to create an instance of shadow dom.
... use element.createshadowroot to create an instance of shadow dom.
... use element.createshadowroot to create an instance of shadow dom.

Element.hasAttributeNS() - Web APIs

Web › API › Element › hasAttributeNS

hasattributens returns a boolean value indicating whether the current element has the specified attribute.
... hasattributens returns a boolean value indicating whether the current element has the specified attribute.
...ns returns a boolean value indicating whether the current element has the specified attribute.
... or false.

Element: select event - Web APIs

Web › API › Element › select event

the select event fires when some text has been selected.
...elect event fires when some text has been selected.
... cancelable no interface uievent if generated from a user interface, event otherwise event handler property onselect the event is not available for all elements in all languages.
...ent otherwise event handler property onselect the event is not available for all elements in all languages.

ElementTraversal - Web APIs

Web › API › ElementTraversal

the elementtraversal interface used to define methods that allowed access from one node to another in the document tree.
...perties.
...seful methods and properties for each kind of nodes: childnode parentnode as it was a pure interface, with no object of this type, this change has no effect on the web.
...s: childnode parentnode as it was a pure interface, with no object of this type, this change has no effect on the web.

HTMLCanvasElement.captureStream() - Web APIs

Web › API › HTMLCanvasElement › captureStream

the htmlcanvaselement capturestream() method returns a mediastream which includes a canvascapturemediastreamtrack containing a real-time video capture of the canvas's contents.
... captured each time the canvas changes; if set to 0, frames will not be captured automatically; instead, they will only be captured when the returned track's requestframe() method is called.
...ent to capture var canvaselt = document.queryselector('canvas'); // get the stream var stream = canvaselt.capturestream(25); // 25 fps // do things to the stream // e.g.
...nt.queryselector('canvas'); // get the stream var stream = canvaselt.capturestream(25); // 25 fps // do things to the stream // e.g.

HTMLCanvasElement.mozOpaque - Web APIs

Web › API › HTMLCanvasElement › mozOpaque

the non-standard htmlcanvaselement.mozopaque property is a boolean reflecting the moz-opaque html attribute of the <canvas> element.
... the non-standard htmlcanvaselement.mozopaque property is a boolean reflecting the moz-opaque html attribute of the <canvas> element.
....
...ar opaque = canvas.mozopaque; canvas.mozopaque = true; examples given this <canvas> element: <canvas id="canvas" width="300" height="300" moz-opaque></canvas> you can get or set the mozopaque property.

HTMLContentElement.select - Web APIs

Web › API › HTMLContentElement › select

the htmlcontentelement.select property reflects the select attribute.
... the htmlcontentelement.select property reflects the select attribute.
... the htmlcontentelement.select property reflects the select attribute.
... the htmlcontentelement.select property reflects the select attribute.

HTMLDataElement.value - Web APIs

Web › API › HTMLDataElement › value

the value property of the htmldataelement interface returns a domstring reflecting the value html attribute.
... the value property of the htmldataelement interface returns a domstring reflecting the value html attribute.
... the value property of the htmldataelement interface returns a domstring reflecting the value html attribute.
... the value property of the htmldataelement interface returns a domstring reflecting the value html attribute.

HTMLDialogElement.open - Web APIs

Web › API › HTMLDialogElement › open

the open property of the htmldialogelement interface is a boolean reflecting the open html attribute, indicating whether the dialog is available for interaction.
...own.
...ion>red panda</option> <option>spider monkey</option> </select></p> </section> <menu> <button id="cancel" type="reset">cancel</button> <button type="submit">confirm</button> </menu> </form> </dialog> <menu> <button id="updatedetails">update details</button> </menu> <script> (function() { var updatebutton = document.getelementbyid('updatedetails'); var cancelbutton = document.getelementbyid('cancel'); var dialog = document.getelementbyid('favdialog'); dialog.returnvalue = 'favanimal'; function opencheck(dialog) { if(dialog.open) { console.log('dialog open'); } else { console.log('dialog closed'); } } // update button opens a modal dialog ...
...al dialog updatebutton.addeventlistener('click', function() { dialog.showmodal(); opencheck(dialog); }); // form cancel button closes the dialog box cancelbutton.addeventlistener('click', function() { dialog.close('animalnotchosen'); opencheck(dialog); }); })(); </script> note: you can find this example on github as htmldialogelement-basic (see it live also).

HTMLElement.title - Web APIs

Web › API › HTMLElement › title

the htmlelement.title property represents the title of the element: the text usually displayed in a 'tooltip' popup when the mouse is over the node.
... the htmlelement.title property represents the title of the element: the text usually displayed in a 'tooltip' popup when the mouse is over the node.
... the htmlelement.title property represents the title of the element: the text usually displayed in a 'tooltip' popup when the mouse is over the node.
... the htmlelement.title property represents the title of the element: the text usually displayed in a 'tooltip' popup when the mouse is over the node.

HTMLFontElement.size - Web APIs

Web › API › HTMLFontElement › size

the obsolete htmlfontelement.size property is a domstring that reflects the size html attribute.
... the obsolete htmlfontelement.size property is a domstring that reflects the size html attribute.
...ase the value of the size attribute of the <basefont> element.
...es valid size number string integer number in the range of 1-7 6 relative size string +x or -x, where x is the number relative to the value of the size attribute of the <basefont> element (the result should be in the same range of 1-7) +2 -1 syntax sizestring = fontobj.size; fontobj.size = sizestring; examples // assumes there is <font id="f"> element in the html var f = document.getelementbyid("f"); f.size = "6"; specifications the <font> tag is not supported in html5 and as a result neither is <font>.size .

HTMLFormElement.enctype - Web APIs

Web › API › HTMLFormElement › enctype

the htmlformelement.enctype property is the mime type of content that is used to submit the form to the server.
... the htmlformelement.enctype property is the mime type of content that is used to submit the form to the server.
...ormelement.enctype property is the mime type of content that is used to submit the form to the server.
...s) to upload file data.

HTMLFormElement.reportValidity() - Web APIs

Web › API › HTMLFormElement › reportValidity

the htmlformelement.reportvalidity() method returns true if the element's child controls satisfy their validation constraints.
... the htmlformelement.reportvalidity() method returns true if the element's child controls satisfy their validation constraints.
...re fired for each invalid child and validation problems are reported to the user.
...idity() return value boolean example document.forms['myform'].addeventlistener('submit', function() { document.forms['myform'].reportvalidity(); }, false); specifications specification status comment html living standardthe definition of 'htmlformelement.reportvalidity()' in that specification.

HTMLFormElement.reset() - Web APIs

Web › API › HTMLFormElement › reset

the htmlformelement.reset() method restores a form element's default values.
... the htmlformelement.reset() method restores a form element's default values.
... the htmlformelement.reset() method restores a form element's default values.
...s reset button.

HTMLFormElement.target - Web APIs

Web › API › HTMLFormElement › target

the target property of the htmlformelement interface represents the target of the form's action (i.e., the frame in which to render its output).
... the target property of the htmlformelement interface represents the target of the form's action (i.e., the frame in which to render its output).
... the target property of the htmlformelement interface represents the target of the form's action (i.e., the frame in which to render its output).
... the target property of the htmlformelement interface represents the target of the form's action (i.e., the frame in which to render its output).

HTMLHyperlinkElementUtils.hash - Web APIs

Web › API › HTMLHyperlinkElementUtils › hash

the htmlhyperlinkelementutils.hash property returns a usvstring containing a '#' followed by the fragment identifier of the url.
... the htmlhyperlinkelementutils.hash property returns a usvstring containing a '#' followed by the fragment identifier of the url.
... returns a usvstring containing a '#' followed by the fragment identifier of the url.
...ng, "".

HTMLHyperlinkElementUtils.password - Web APIs

Web › API › HTMLHyperlinkElementUtils › password

the htmlhyperlinkelementutils.password property is a usvstring containing the password specified before the domain name.
... the htmlhyperlinkelementutils.password property is a usvstring containing the password specified before the domain name.
... property is a usvstring containing the password specified before the domain name.
...ect.password = string; examples // let's <a id="myanchor" href="https://anonymous:flabada@developer.mozilla.org/docs/htmlhyperlinkelementutils.username"> be in the document var anchor = document.getelementbyid("myanchor"); var result = anchor.password; // returns:'flabada' specifications specification status comment html living standardthe definition of 'htmlhyperlinkelementutils.password' in that specification.

HTMLHyperlinkElementUtils.username - Web APIs

Web › API › HTMLHyperlinkElementUtils › username

the htmlhyperlinkelementutils.username property is a usvstring containing the username specified before the domain name.
... the htmlhyperlinkelementutils.username property is a usvstring containing the username specified before the domain name.
... the htmlhyperlinkelementutils.username property is a usvstring containing the username specified before the domain name.
...t.username = string; examples // let's <a id="myanchor" href="https://anonymous:flabada@developer.mozilla.org/docs/htmlhyperlinkelementutils.username"> be in the document var anchor = document.getelementbyid("myanchor"); var result = anchor.username; // returns:'anonymous' specifications specification status comment html living standardthe definition of 'htmlhyperlinkelementutils.username' in that specification.

HTMLIFrameElement.contentWindow - Web APIs

Web › API › HTMLIFrameElement › contentWindow

the contentwindow property returns the window object of an htmliframeelement.
... the contentwindow property returns the window object of an htmliframeelement.
... the contentwindow property returns the window object of an htmliframeelement.
...like the global window object.

HTMLIFrameElement.referrerPolicy - Web APIs

Web › API › HTMLIFrameElement › referrerPolicy

the htmliframeelement.referrerpolicy property reflects the html referrerpolicy attribute of the <iframe> element defining which referrer is sent when fetching the resource.
...origin when the protocol security level stays the same (https→https), and send no header to a less secure destination (https→http).
...ss secure destination (https→http).
...getelementsbytagname("body")[0]; body.appendchild(iframe); // fetch the image using the complete url as the referrer specifications specification status comment referrer policythe definition of 'referrerpolicy attribute' in that specification.

HTMLIFrameElement.src - Web APIs

Web › API › HTMLIFrameElement › src

the htmliframeelement.src property reflects the html referrerpolicy attribute of the <iframe> element defining which referrer is sent when fetching the resource.
... the htmliframeelement.src property reflects the html referrerpolicy attribute of the <iframe> element defining which referrer is sent when fetching the resource.
... the htmliframeelement.src property reflects the html referrerpolicy attribute of the <iframe> element defining which referrer is sent when fetching the resource.
...ource.

HTMLImageElement.complete - Web APIs

Web › API › HTMLImageElement › complete

the read-only htmlimageelement interface's complete attribute is a boolean value which indicates whether or not the image has completely loaded.
... the read-only htmlimageelement interface's complete attribute is a boolean value which indicates whether or not the image has completely loaded.
...f the image has completely loaded; otherwise, the value is false.
...; lightboxcontrolselem.disabled = false; } /* ...

HTMLImageElement.height - Web APIs

Web › API › HTMLImageElement › height

the height property of the htmlimageelement interface indicates the height at which the image is drawn, in css pixels if the image is being drawn or rendered to any visual medium such as the screen or a printer; otherwise, it's the natural, pixel density corrected height of the image.
... the height property of the htmlimageelement interface indicates the height at which the image is drawn, in css pixels if the image is being drawn or rendered to any visual medium such as the screen or a printer; otherwise, it's the natural, pixel density corrected height of the image.
... the height property of the htmlimageelement interface indicates the height at which the image is drawn, in css pixels if the image is being drawn or rendered to any visual medium such as the screen or a printer; otherwise, it's the natural, pixel density corrected height of the image.
...ut = document.queryselector(".size"); const updateheight = event => { output.innertext = clockimage.height; }; window.addeventlistener("load", updateheight); window.addeventlistener("resize", updateheight); result this example may be easier to try out in its own window.

HTMLImageElement.width - Web APIs

Web › API › HTMLImageElement › width

the width property of the htmlimageelement interface indicates the width at which the image is drawn, in css pixels if the image is being drawn or rendered to any visual medium such as the screen or a printer; otherwise, it's the natural, pixel density corrected width of the image.
... the width property of the htmlimageelement interface indicates the width at which the image is drawn, in css pixels if the image is being drawn or rendered to any visual medium such as the screen or a printer; otherwise, it's the natural, pixel density corrected width of the image.
... the width property of the htmlimageelement interface indicates the width at which the image is drawn, in css pixels if the image is being drawn or rendered to any visual medium such as the screen or a printer; otherwise, it's the natural, pixel density corrected width of the image.
...output = document.queryselector(".size"); const updatewidth = event => { output.innertext = clockimage.width; }; window.addeventlistener("load", updatewidth); window.addeventlistener("resize", updatewidth); result this example may be easier to try out in its own window.

HTMLInputElement.mozSetFileNameArray() - Web APIs

Web › API › HTMLInputElement › mozSetFileNameArray

the htmlinputelement.mozsetfilenamearray() method sets the names of the files that selected on an html input element.
... the htmlinputelement.mozsetfilenamearray() method sets the names of the files that selected on an html input element.
... the htmlinputelement.mozsetfilenamearray() method sets the names of the files that selected on an html input element.
...ent.

HTMLLabelElement.form - Web APIs

Web › API › HTMLLabelElement › form

the read-only htmllabelelement.form property returns an htmlformelement object which represents the form of which the label's associated control is a part, or null if there is either no associated control, or if that control isn't in a form.
... the read-only htmllabelelement.form property returns an htmlformelement object which represents the form of which the label's associated control is a part, or null if there is either no associated control, or if that control isn't in a form.
... the read-only htmllabelelement.form property returns an htmlformelement object which represents the form of which the label's associated control is a part, or null if there is either no associated control, or if that control isn't in a form.
... the read-only htmllabelelement.form property returns an htmlformelement object which represents the form of which the label's associated control is a part, or null if there is either no associated control, or if that control isn't in a form.

HTMLMediaElement.buffered - Web APIs

Web › API › HTMLMediaElement › buffered

the htmlmediaelement.buffered read-only property returns a new timeranges object that indicates the ranges of the media source that the browser has buffered (if any) at the moment the buffered property is accessed.
...wser has buffered (if any) at the moment the buffered property is accessed.
...ges object.
...cent ranges are folded into one bigger range).

HTMLMediaElement.controls - Web APIs

Web › API › HTMLMediaElement › controls

the htmlmediaelement.controls property reflects the controls html attribute, which controls whether user interface controls for playing the media item will be displayed.
... the htmlmediaelement.controls property reflects the controls html attribute, which controls whether user interface controls for playing the media item will be displayed.
...whether user interface controls for playing the media item will be displayed.
...ols = true; value a boolean.

HTMLMediaElement.defaultMuted - Web APIs

Web › API › HTMLMediaElement › defaultMuted

the htmlmediaelement.defaultmuted property reflects the muted html attribute, which indicates whether the media element's audio output should be muted by default.
...d html attribute, which indicates whether the media element's audio output should be muted by default.
....defaultmuted; audio.defaultmuted = true; value a boolean.
....

HTMLMediaElement.defaultPlaybackRate - Web APIs

Web › API › HTMLMediaElement › defaultPlaybackRate

the htmlmediaelement.defaultplaybackrate property indicates the default playback rate for the media.
...aultplaybackrate property indicates the default playback rate for the media.
...0 is "normal speed," values lower than 1.0 make the media play slower than normal, higher values make it play faster.
...valid and throws a not_supported_err exception.

HTMLMediaElement.disableRemotePlayback - Web APIs

Web › API › HTMLMediaElement › disableRemotePlayback

the htmlmediaelement.disableremoteplayback property determines whether the media element is allowed to have a remote playback ui.
... the htmlmediaelement.disableremoteplayback property determines whether the media element is allowed to have a remote playback ui.
... the htmlmediaelement.disableremoteplayback property determines whether the media element is allowed to have a remote playback ui.
... the htmlmediaelement.disableremoteplayback property determines whether the media element is allowed to have a remote playback ui.

HTMLMediaElement.loop - Web APIs

Web › API › HTMLMediaElement › loop

the htmlmediaelement.loop property reflects the loop html attribute, which controls whether the media element should start over when it reaches the end.
... the htmlmediaelement.loop property reflects the loop html attribute, which controls whether the media element should start over when it reaches the end.
...loop property reflects the loop html attribute, which controls whether the media element should start over when it reaches the end.
...ver when it reaches the end.

HTMLMediaElement.muted - Web APIs

Web › API › HTMLMediaElement › muted

the htmlmediaelement.muted indicates whether the media element muted.
... the htmlmediaelement.muted indicates whether the media element muted.
...the htmlmediaelement.muted indicates whether the media element muted.
...o.muted audio.muted = true; value a boolean.

HTMLMediaElement.onencrypted - Web APIs

Web › API › HTMLMediaElement › onencrypted

the onencrypted property of the htmlmediaelement is an event handler, fired whenever an encrypted event occurs, denoting the media is encrypted.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...ndale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y2="25" stroke="#d4dde4"/><line x1="509" y1="25" x2="509" y2="90" stroke="#d4dde4"/><line x1="509" y1="90" x2="492" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlmediaelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="411" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlmediaelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} syntax htmlmediaelement.onen...

HTMLMediaElement.onwaitingforkey - Web APIs

Web › API › HTMLMediaElement › onwaitingforkey

the onwaitingforkey property of the htmlmediaelement is an event handler, fired when a waitingforkey event occurs, when playback is blocked while waiting for an encryption key.
...eight="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="...
...50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y...
...ndale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y2="25" stroke="#d4dde4"/><line x1="509" y1="25" x2="509" y2="90" stroke="#d4dde4"/><line x1="509" y1="90" x2="492" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlmediaelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="411" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlmediaelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} syntax htmlmediaelement.onwa...

HTMLMediaElement: pause event - Web APIs

Web › API › HTMLMediaElement › pause event

the pause event is sent when a request to pause an activity is handled and the activity has entered its paused state, most commonly after the media has been paused through a call to the element's pause() method.
... the pause event is sent when a request to pause an activity is handled and the activity has entered its paused state, most commonly after the media has been paused through a call to the element's pause() method.
...se an activity is handled and the activity has entered its paused state, most commonly after the media has been paused through a call to the element's pause() method.
...urns and after the media element's paused property has been changed to true.

HTMLMediaElement.paused - Web APIs

Web › API › HTMLMediaElement › paused

the read-only htmlmediaelement.paused property tells whether the media element is paused.
... the read-only htmlmediaelement.paused property tells whether the media element is paused.
... the read-only htmlmediaelement.paused property tells whether the media element is paused.
...ispaused = audioorvideo.paused value a boolean.

HTMLMediaElement.seekToNextFrame() - Web APIs

Web › API › HTMLMediaElement › seekToNextFrame

the htmlmediaelement.seektonextframe() method asynchronously advances the the current play position to the next frame in the media.
...eo content.
...led when the seek operation is complete.
...te.

HTMLMediaElement.volume - Web APIs

Web › API › HTMLMediaElement › volume

the htmlmediaelement.volume property sets the volume at which the media will be played.
... the htmlmediaelement.volume property sets the volume at which the media will be played.
...ia will be played.
...0 and 1, where 0 is effectively muted and 1 is the loudest possible value.

HTMLObjectElement.form - Web APIs

Web › API › HTMLObjectElement › form

the form read-only property of the htmlobjectelement interface retuns a htmlformelement representing the object element's form owner, or null if there isn't one.
... the form read-only property of the htmlobjectelement interface retuns a htmlformelement representing the object element's form owner, or null if there isn't one.
... the form read-only property of the htmlobjectelement interface retuns a htmlformelement representing the object element's form owner, or null if there isn't one.
... the form read-only property of the htmlobjectelement interface retuns a htmlformelement representing the object element's form owner, or null if there isn't one.

HTMLObjectElement.typeMustMatch - Web APIs

Web › API › HTMLObjectElement › typeMustMatch

the htmlobjectelement.typemustmatch property is a boolean that reflects the typemustmatch attribute of the <object> element.
... the htmlobjectelement.typemustmatch property is a boolean that reflects the typemustmatch attribute of the <object> element.
...match attribute of the <object> element.
... resource to be used.

HTMLElement.blur() - Web APIs

Web › API › HTMLOrForeignElement › blur

the htmlelement.blur() method removes keyboard focus from the current element.
... the htmlelement.blur() method removes keyboard focus from the current element.
...ur() method removes keyboard focus from the current element.
...element.blur(); examples remove focus from a text input html <input type="text" id="mytext" value="sample text"> <br><br> <button type="button" onclick="focusinput()">click me to gain focus</button> <button type="button" onclick="blurinput()">click me to lose focus</button> javascript function focusinput() { document.getelementbyid('mytext').focus(); } function blurinput() { document.getelementbyid('mytext').blur(); } result specification specification status comment html living standardthe definition of 'blur' in that specification.

HTMLScriptElement.referrerPolicy - Web APIs

Web › API › HTMLScriptElement › referrerPolicy

the referrerpolicy property of the htmlscriptelement interface reflects the html referrerpolicy of the <script> element and fetches made by that script, defining which referrer is sent when fetching the resource.
...safe-url send a full url when performing a same-origin or cross-origin request.
...efault value, and a fallback value if referrerpolicy is not supported.
...lement("script"); scriptelem.src = "/"; scriptelem.referrerpolicy = "unsafe-url"; document.body.appendchild(script); specifications specification status comment referrer policythe definition of 'referrerpolicy attribute' in that specification.

HTMLSelectElement.options - Web APIs

Web › API › HTMLSelectElement › options

the htmlselectelement.options read-only property returns a htmloptionscollection of the <option> elements contained by the <select> element.
... the htmlselectelement.options read-only property returns a htmloptionscollection of the <option> elements contained by the <select> element.
... the htmlselectelement.options read-only property returns a htmloptionscollection of the <option> elements contained by the <select> element.
... syntax var options = select.options; return value a htmloptionscollection containing the <option> elements contained by the <select> element.

HTMLSelectElement.setCustomValidity() - Web APIs

Web › API › HTMLSelectElement › setCustomValidity

the htmlselectelement.setcustomvalidity() method sets the custom validity message for the selection element to the specified message.
... the htmlselectelement.setcustomvalidity() method sets the custom validity message for the selection element to the specified message.
...custom validity message for the selection element to the specified message.
...or.

HTMLTableElement.bgColor - Web APIs

Web › API › HTMLTableElement › bgColor

the htmltableelement.bgcolor property represents the background color of the table.
... the htmltableelement.bgcolor property represents the background color of the table.
... attribute is deprecated in html 4.01.
...ead by modifying the element's style object or using a style rule.

HTMLTableElement.deleteCaption() - Web APIs

Web › API › HTMLTableElement › deleteCaption

the htmltableelement.deletecaption() method removes the <caption> element from a given <table>.
... the htmltableelement.deletecaption() method removes the <caption> element from a given <table>.
... the htmltableelement.deletecaption() method removes the <caption> element from a given <table>.
... a table's caption.

HTMLTableElement.frame - Web APIs

Web › API › HTMLTableElement › frame

the htmltableelement interface's frame property is a string that indicates which of the table's exterior borders should be drawn.
... the htmltableelement interface's frame property is a string that indicates which of the table's exterior borders should be drawn.
... the htmltableelement interface's frame property is a string that indicates which of the table's exterior borders should be drawn.
...meters framesides is a string whose value is one of the following values: void no sides.

HTMLTableElement.rows - Web APIs

Web › API › HTMLTableElement › rows

the read-only htmltableelement property rows returns a live htmlcollection of all the rows in the table, including the rows contained within any <thead>, <tfoot>, and <tbody> elements.
...leelement property rows returns a live htmlcollection of all the rows in the table, including the rows contained within any <thead>, <tfoot>, and <tbody> elements.
...llection of all the rows in the table, including the rows contained within any <thead>, <tfoot>, and <tbody> elements.
...search for them.

HTMLTableElement.rules - Web APIs

Web › API › HTMLTableElement › rules

the htmltableelement.rules property indicates which cell borders to render in the table.
... the htmltableelement.rules property indicates which cell borders to render in the table.
... the htmltableelement.rules property indicates which cell borders to render in the table.
...s which cell borders to render in the table.

HTMLTableElement.summary - Web APIs

Web › API › HTMLTableElement › summary

the htmltableelement.summary property represents the table description.
... the htmltableelement.summary property represents the table description.
... the htmltableelement.summary property represents the table description.
... the htmltableelement.summary property represents the table description.

HTMLTableElement.tBodies - Web APIs

Web › API › HTMLTableElement › tBodies

the htmltableelement.tbodies read-only property returns a live htmlcollection of the bodies in a <table>.
... the htmltableelement.tbodies read-only property returns a live htmlcollection of the bodies in a <table>.
...ableelement.tbodies read-only property returns a live htmlcollection of the bodies in a <table>.
...</tr> </table> the html dom generated from the above html will have a <tbody> element even though the tags are not included in the source html.

HTMLTableRowElement.rowIndex - Web APIs

Web › API › HTMLTableRowElement › rowIndex

the htmltablerowelement.rowindex read-only property represents the position of a row in relation to the whole <table>.
... the htmltablerowelement.rowindex read-only property represents the position of a row in relation to the whole <table>.
... the htmltablerowelement.rowindex read-only property represents the position of a row in relation to the whole <table>.
...<tr><th>item</th> <th>price</th></tr> </thead> <tbody> <tr><td>bananas</td> <td>$2</td></tr> <tr><td>oranges</td> <td>$8</td></tr> <tr><td>top sirloin</td> <td>$20</td></tr> </tbody> <tfoot> <tr><td>total</td> <td>$30</td></tr> </tfoot> </table> javascript let rows = document.queryselectorall('tr'); rows.foreach((row) => { let z = document.createelement("td"); z.textcontent = `(row #${row.rowindex})`; row.appendchild(z); }); result ...

HTMLTimeElement.dateTime - Web APIs

Web › API › HTMLTimeElement › dateTime

the htmltimeelement.datetime property is a domstring that reflects the datetime html attribute, containing a machine-readable form of the element's date and time value.
....xxs pddthhmms.xxxs pthhmmss pthhmms.xs pthhmms.xxs pthhmms.xxxs ww dd hh mm ss p12dt7h12m13s p12dt7h12m13.3s p12dt7h12m13.45s p12dt7h12m13.455s pt7h12m13s pt7h12m13.2s pt7h12m13.56s pt7h12m13.999s 7d 5h 24m 13s syntax datetimestring = timeelt.datetime; timeelt.datetime = datetimestring example // assumes there is <time id="t"> element in the html var t = document.getelementbyid("t"); t.datetime = "6w 5h 34m 5s"; specifications specification status comment html living standardthe definition of 'htmltimeelement' in that specification.
...datetime = datetimestring example // assumes there is <time id="t"> element in the html var t = document.getelementbyid("t"); t.datetime = "6w 5h 34m 5s"; specifications specification status comment html living standardthe definition of 'htmltimeelement' in that specification.
...entbyid("t"); t.datetime = "6w 5h 34m 5s"; specifications specification status comment html living standardthe definition of 'htmltimeelement' in that specification.

HTMLTrackElement.src - Web APIs

Web › API › HTMLTrackElement › src

the htmltrackelement.src property reflects the value of the <track> element's src attribute, which indicates the url of the text track's data.
... the htmltrackelement.src property reflects the value of the <track> element's src attribute, which indicates the url of the text track's data.
...ltrackelement.src property reflects the value of the <track> element's src attribute, which indicates the url of the text track's data.
... track's data.

HTMLVideoElement.msHorizontalMirror - Web APIs

Web › API › HTMLVideoElement › msHorizontalMirror

non-standard this feature is non-standard and is not on a standards track.
...on sites facing the web: it will not work for every user.
....mshorizontalmirror: boolean; value boolean value set to true flips the video playback horizontally.
... (ie.

HTMLVideoElement.msInsertVideoEffect() - Web APIs

Web › API › HTMLVideoElement › msInsertVideoEffect

non-standard this feature is non-standard and is not on a standards track.
...t on production sites facing the web: it will not work for every user.
...: domstring, effectrequired: boolean, config); parameters activatableclassid a domstring defining the video effects class.
...required a boolean which if set to true requires a video effect to be defined.

SVGAnimationElement: beginEvent event - Web APIs

Web › API › SVGAnimationElement › beginEvent event

the beginevent event of the svganimationelement interface is fired when the element local timeline begins to play.
... the beginevent event of the svganimationelement interface is fired when the element local timeline begins to play.
... the beginevent event of the svganimationelement interface is fired when the element local timeline begins to play.
...ur="5s" repeatcount="indefinite" /> </circle> </svg> <hr> <ul> </ul> ul { height: 100px; border: 1px solid #ddd; overflow-y: scroll; padding: 10px 30px; } let svgelem = document.queryselector('svg'); let animateelem = document.queryselector('animatemotion'); let list = document.queryselector('ul'); animateelem.addeventlistener('beginevent', () => { let listitem = document.createelement('li'); listitem.textcontent = 'beginevent fired'; list.appendchild(listitem); }) animateelem.addeventlistener('repeatevent', (e) => { let listitem = document.createelement('li'); let msg = 'repeatevent fired'; if(e.detail) { msg += '; repeat number: ' + e.detail; } listitem.textcontent = msg; list.appendchild(listitem); }) event handler property equivalent note that you ...

SVGGraphicsElement: paste event - Web APIs

Web › API › SVGGraphicsElement › paste event

the paste event is fired on an svggraphicselement when the user has initiated a "paste" action through the browser's user interface.
... the paste event is fired on an svggraphicselement when the user has initiated a "paste" action through the browser's user interface.
... a synthetic paste event, but this will not affect the document's contents.
...2000/svg"> <foreignobject x="5" y="-10" width="90" height="20"> <input xmlns="http://www.w3.org/1999/xhtml" value="copy this text"/> </foreignobject> <text x="5" y="30" id="element-to-paste-text" tabindex="1">paste it here</text> </svg> css input { font-size: 10px; width: 100%; height: 90%; box-sizing: border-box; border: 1px solid black; } javascript document.getelementbyid("element-to-paste-text").addeventlistener("paste", evt => { evt.target.textcontent = evt.clipboarddata.getdata("text/plain").touppercase(); evt.preventdefault(); }); result specifications specification status comment scalable vector graphics (svg) 2 candidate recommendation definition that the clipboard events apply to svg elements.

SVGMeshElement - Web APIs

Web › API › SVGMeshElement

the svgmeshelement interface provides access to the properties of <mesh> elements.
...e provides access to the properties of <mesh> elements.
...olute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a xlink:href="/docs/web/api/svgmeshelement" target="_top"><rect x="1" y="1" width="140" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="71" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgmeshelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface doesn't implement any specific properties, but inherits properties from its parent interface, svggeometryelement, and implements the properties of svgurireference.
.../text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface doesn't implement any specific properties, but inherits properties from its parent interface, svggeometryelement, and implements the properties of svgurireference.

SVGSolidcolorElement - Web APIs

Web › API › SVGSolidcolorElement

the svgsolidcolorelement interface corresponds to the <solidcolor> element.
...nterface corresponds to the <solidcolor> element.
...; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a xlink:href="/docs/web/api/svgsolidcolorelement" target="_top"><rect x="1" y="1" width="200" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="101" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgsolidcolorelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface doesn't implement any specific properties, but inherits properties from its parent interface, svgelement.
...-anchor="middle" alignment-baseline="middle">svgsolidcolorelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface doesn't implement any specific properties, but inherits properties from its parent interface, svgelement.

::-webkit-meter-inner-element - CSS: Cascading Style Sheets

Web › CSS › ::-webkit-meter-inner-element

::-webkit-meter-inner-element is a proprietary webkit css pseudo-element for selecting and applying styles to to the outer containing element of a <meter> element.
... ::-webkit-meter-inner-element is a proprietary webkit css pseudo-element for selecting and applying styles to to the outer containing element of a <meter> element.
... ::-webkit-meter-inner-element is a proprietary webkit css pseudo-element for selecting and applying styles to to the outer containing element of a <meter> element.
...r-element specifications not part of any standard.

<bgsound>: The Background Sound element (obsolete) - HTML: Hypertext Markup Language

Web › HTML › Element › bgsound

the internet explorer only html background sound element (<bgsound>) sets up a sound file to play in the background while the page is used; use <audio> instead.
... the internet explorer only html background sound element (<bgsound>) sets up a sound file to play in the background while the page is used; use <audio> instead.
... the keyword infinite.
...nd2.au" loop="infinite"> usage notes historically, the <embed> element could be used with audio player plug-ins to play audio in the background in most browsers.

<image>: The obsolete Image element - HTML: Hypertext Markup Language

Web › HTML › Element › image

the obsolete html image element (<image>) is an obsolete remnant of an ancient version of html lost in the mists of time; use the standard <img> element instead.
... the obsolete html image element (<image>) is an obsolete remnant of an ancient version of html lost in the mists of time; use the standard <img> element instead.
... the obsolete html image element (<image>) is an obsolete remnant of an ancient version of html lost in the mists of time; use the standard <img> element instead.
...ge element (<image>) is an obsolete remnant of an ancient version of html lost in the mists of time; use the standard <img> element instead.

Element - Archive of obsolete content

Archive › RSS › Module › Well-Formed Web › Element

rss well-formed web module elements note: in the list of elements below the wfw xml namespace prefix is used (since it is a popular choice).
... rss well-formed web module elements note: in the list of elements below the wfw xml namespace prefix is used (since it is a popular choice).
... rss well-formed web module elements note: in the list of elements below the wfw xml namespace prefix is used (since it is a popular choice).

XForms Trigger Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Trigger

the spec).
...ributes ui common appearance - the value of this attribute gives a hint to the xforms processor as to which type of widget(s) to use to represent this control accesskey - used to specify the keyboard shortcut for focusing this control single-node binding type restrictions the trigger element can be bound to a node containing data of any type.
...s control single-node binding type restrictions the trigger element can be bound to a node containing data of any type.

Pseudo-element - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Pseudo-element

in css, a pseudo-element selector applies styles to parts of your document content in scenarios where there isn't a specific html element to select.
... in css, a pseudo-element selector applies styles to parts of your document content in scenarios where there isn't a specific html element to select.
... in css, a pseudo-element selector applies styles to parts of your document content in scenarios where there isn't a specific html element to select.

HTMLIFrameElement.getMuted()

Mozilla › Gecko › Chrome › API › Browser API › getMuted

non-standard this feature is non-standard and is not on a standards track.
...e it on production sites facing the web: it will not work for every user.
...ry user.

HTMLIFrameElement.getScreenshot()

Mozilla › Gecko › Chrome › API › Browser API › getScreenshot

warning: removed in firefox 65.
...of the htmliframeelement lets you request a screenshot of a content <iframe>, scaled to fit within a specified maximum width and height.
...a specified maximum width and height.

HTMLIFrameElement.getVolume()

Mozilla › Gecko › Chrome › API › Browser API › getVolume

non-standard this feature is non-standard and is not on a standards track.
...do not use it on production sites facing the web: it will not work for every user.
... for every user.

HTMLIFrameElement.purgeHistory()

Mozilla › Gecko › Chrome › API › Browser API › purgeHistory

warning: removed in firefox 65.
...ry() method of the htmliframeelement interface is used to clear the browsing history associated with the browser <iframe>.
...e is used to clear the browsing history associated with the browser <iframe>.

nsIDOMHTMLAudioElement

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMHTMLAudioElement

the nsidomhtmlaudioelement interface is used to implement the html5 <audio> element.
... the nsidomhtmlaudioelement interface is used to implement the html5 <audio> element.
... the nsidomhtmlaudioelement interface is used to implement the html5 <audio> element.

Element: MozMousePixelScroll event - Web APIs

Web › API › Element › MozMousePixelScroll

the firefox-only, non-standard, and obsolete mozmousepixelscroll event is fired at an element asynchronously when a mouse wheel or similar device is operated.
... lines, with negative values indicating the scrolling movement is either toward the bottom or toward the right, and positive values indicating scrolling to the top or left.
...cating the scrolling movement is either toward the bottom or toward the right, and positive values indicating scrolling to the top or left.

Element.currentStyle - Web APIs

Web › API › Element › currentStyle

element.currentstyle is a proprietary property which is similar to the standardized window.getcomputedstyle() method.
...however, it returns the units set in css while window.getcomputedstyle() returns the values in pixels.
... window.getcomputedstyle() returns the values in pixels.

Element.getAttributeNodeNS() - Web APIs

Web › API › Element › getAttributeNodeNS

returns the attr node for the attribute with the given namespace and name.
...the attribute with the given namespace and name.
... id="top" /> t = document.getelementbyid("top"); specialnode = t.getattributenodens( "http://www.mozilla.org/ns/specialspace", "id"); // inode.value = "full-top" </pre notes getattributenodens is more specific than getattributenode in that it allows you to specify attributes that are part of a particular namespace.

Element: mousedown event - Web APIs

Web › API › Element › mousedown event

the mousedown event is fired at an element when a pointing device button is pressed while the pointer is inside the element.
... the mousedown event is fired at an element when a pointing device button is pressed while the pointer is inside the element.
...ne segment, sets x and y to 0, and stops further drawing by setting isdrawing to false.

Element: msContentZoom event - Web APIs

Web › API › Element › msContentZoom event

the mscontentzoom event fires when a user zooms the element (changes the scale of the content).
... the mscontentzoom event fires when a user zooms the element (changes the scale of the content).
... the mscontentzoom event fires when a user zooms the element (changes the scale of the content).

Element.prefix - Web APIs

Web › API › Element › prefix

the element.prefix read-only property returns the namespace prefix of the specified element, or null if no prefix is specified.
... the element.prefix read-only property returns the namespace prefix of the specified element, or null if no prefix is specified.
...e interface.

Element.setAttributeNS() - Web APIs

Web › API › Element › setAttributeNS

setattributens adds a new attribute or changes the value of an attribute with the given namespace and name.
... attribute with the given namespace and name.
...g the namespace of the attribute.

Element: underflow event - Web APIs

Web › API › Element › underflow event

the non-standard underflow event, which is specific to firefox, is fired when an element is no longer overflowed by its content.
... the non-standard underflow event, which is specific to firefox, is fired when an element is no longer overflowed by its content.
... <div id="wrapper"> <div id="child"></div> </div> <br/> <label><input type="checkbox" id="toggle" checked/> overflow</label> <style> #wrapper { width: 20px; height: 20px; background: #000; padding: 5px; overflow: hidden; } #child { width: 40px; height: 40px; border: 2px solid grey; background: #ccc; } </style> <script> var wrapper = document.getelementbyid("wrapper"), child = document.getelementbyid("child"), toggle = document.getelementbyid("toggle"); wrapper.addeventlistener("overflow", function( event ) { console.log( event ); }, false); wrapper.addeventlistener("underflow", function( event ) { console.log( event ); }, false); toggle.addeventlistener("change", function( event ) { if ( event.target.c...

HTMLAnchorElement.referrerPolicy - Web APIs

Web › API › HTMLAnchorElement › referrerPolicy

the htmlanchorelement.referrerpolicy property reflect the html referrerpolicy attribute of the <a> element defining which referrer is sent when fetching the resource.
...be sent.
...d the path (but not the fragment, password, or username).

HTMLAnchorElement.rel - Web APIs

Web › API › HTMLAnchorElement › rel

the htmlanchorelement.rel property reflects the rel attribute.
... the htmlanchorelement.rel property reflects the rel attribute.
... the htmlanchorelement.rel property reflects the rel attribute.

HTMLAnchorElement.relList - Web APIs

Web › API › HTMLAnchorElement › relList

the htmlanchorelement.rellist read-only property reflects the rel attribute.
... the htmlanchorelement.rellist read-only property reflects the rel attribute.
...the rel attribute.

HTMLAreaElement.referrerPolicy - Web APIs

Web › API › HTMLAreaElement › referrerPolicy

the htmlareaelement.referrerpolicy property reflect the html referrerpolicy attribute of the <area> element defining which referrer is sent when fetching the resource.
... and the port.
...se is unsafe as it can leak path information that has been concealed to third-party by using tls.

HTMLAreaElement.rel - Web APIs

Web › API › HTMLAreaElement › rel

the htmlareaelement.rel property reflects the rel attribute.
... the htmlareaelement.rel property reflects the rel attribute.
... the htmlareaelement.rel property reflects the rel attribute.

HTMLAreaElement.relList - Web APIs

Web › API › HTMLAreaElement › relList

the htmlareaelement.rellist read-only property reflects the rel attribute.
... the htmlareaelement.rellist read-only property reflects the rel attribute.
...ribute.

HTMLDialogElement.returnValue - Web APIs

Web › API › HTMLDialogElement › returnValue

the returnvalue property of the htmldialogelement interface gets or sets the return value for the <dialog>, usually to indicate which button the user pressed to close it.
...tion>brine shrimp</option> <option>red panda</option> <option>spider monkey</option> </select> </label></p> <menu> <button>cancel</button> <button>confirm</button> </menu> </form> </dialog> <menu> <button id="updatedetails">update details</button> </menu> <script> (function() { var updatebutton = document.getelementbyid('updatedetails'); var dialog = document.getelementbyid('favdialog'); dialog.returnvalue = 'favanimal'; function opencheck(dialog) { if (dialog.open) { console.log('dialog open'); } else { console.log('dialog closed'); } } function handleuserinput(returnvalue) { if (returnvalue === 'cancel' || returnvalue == nu...
...m') { // user chose a favorite animal, do something with it } } // “update details” button opens the <dialog> modally updatebutton.addeventlistener('click', function() { dialog.showmodal(); opencheck(dialog); handleuserinput(dialog.returnvalue); }); })(); </script> note: you can find this example on github as htmldialogelement-basic (see it live also).

HTMLDialogElement.show() - Web APIs

Web › API › HTMLDialogElement › show

the show() method of the htmldialogelement interface displays the dialog modelessly, i.e.
...nt interface displays the dialog modelessly, i.e.
...ion>red panda</option> <option>spider monkey</option> </select></p> </section> <menu> <button id="cancel" type="reset">cancel</button> <button type="submit">confirm</button> </menu> </form> </dialog> <menu> <button id="updatedetails">update details</button> </menu> <script> (function() { var updatebutton = document.getelementbyid('updatedetails'); var cancelbutton = document.getelementbyid('cancel'); var dialog = document.getelementbyid('favdialog'); dialog.returnvalue = 'favanimal'; function opencheck(dialog) { if(dialog.open) { console.log('dialog open'); } else { console.log('dialog closed'); } } // update button opens a modal dialog ...

HTMLElement: animationend event - Web APIs

Web › API › HTMLElement › animationend event

the animationend event is fired when a css animation has completed.
... the animationend event is fired when a css animation has completed.
...fired when a css animation has completed.

HTMLElement: gotpointercapture event - Web APIs

Web › API › HTMLElement › gotpointercapture event

the gotpointercapture event is fired when an element captures a pointer using setpointercapture().
... the gotpointercapture event is fired when an element captures a pointer using setpointercapture().
... the gotpointercapture event is fired when an element captures a pointer using setpointercapture().

HTMLElement.oncopy - Web APIs

Web › API › HTMLElement › oncopy

the oncopy property of the htmlelement interface is an eventhandler that processes copy events.
...tionref is a function name or a function expression.
...ows="3">try copying and pasting text into this field!</textarea> <h3>log:</h3> <p id="log"></p> javascript const log = document.getelementbyid('log'); function logcopy(event) { log.innertext = 'copy blocked!\n' + log.innertext; event.preventdefault(); } function logpaste(event) { log.innertext = 'paste blocked!\n' + log.innertext; event.preventdefault(); } const editor = document.getelementbyid('editor'); editor.oncopy = logcopy; editor.onpaste = logpaste; result specification whatwg standard ...

HTMLElement.oncut - Web APIs

Web › API › HTMLElement › oncut

the htmlelement.oncut property of the htmlelement interface is an eventhandler that processes cut events.
... attempt.
.../h3> <textarea id="editor" rows="3">try copying and cutting the text in this field!</textarea> <h3>log:</h3> <p id="log"></p> javascript function logcopy(event) { log.innertext = 'copied!\n' + log.innertext; } function preventcut(event) { event.preventdefault(); log.innertext = 'cut blocked!\n' + log.innertext; } const editor = document.getelementbyid('editor'); const log = document.getelementbyid('log'); editor.oncopy = logcopy; editor.oncut = preventcut; result specification whatwg standard ...

HTMLElement.onpaste - Web APIs

Web › API › HTMLElement › onpaste

the htmlelement.onpaste property of the htmlelement interface is an eventhandler that processes paste events.
...ry copy and paste attempt to the <textarea>.
...tml <h3>play with this text area:</h3> <textarea id="editor" rows="3">try copying and pasting text into this field!</textarea> <h3>log:</h3> <p id="log"></p> javascript function logcopy(event) { log.innertext = 'copied!\n' + log.innertext; } function logpaste(event) { log.innertext = 'pasted!\n' + log.innertext; } const editor = document.getelementbyid('editor'); const log = document.getelementbyid('log'); editor.oncopy = logcopy; editor.onpaste = logpaste; result specification whatwg standard ...

HTMLElement: pointerenter event - Web APIs

Web › API › HTMLElement › pointerenter event

the pointerenter event fires when a pointing device is moved into the hit test boundaries of an element or one of its descendants, including as a result of a pointerdown event from a device that does not support hover (see pointerdown).
...as a result of a pointerdown event from a device that does not support hover (see pointerdown).
...event event handler property onpointerenter examples using addeventlistener(): const para = document.queryselector('p'); para.addeventlistener('pointerenter', (event) => { console.log('pointer entered element'); }); using the onpointerenter event handler property: const para = document.queryselector('p'); para.onpointerenter = (event) => { console.log('pointer entered element'); }; specifications specification status pointer events obsolete ...

HTMLElement: pointerleave event - Web APIs

Web › API › HTMLElement › pointerleave event

the pointerleave event is fired when a pointing device is moved out of the hit test boundaries of an element.
...n devices, this event is fired when the stylus leaves the hover range detectable by the digitizer.
...ointerevent event handler property onpointerleave examples using addeventlistener(): const para = document.queryselector('p'); para.addeventlistener('pointerleave', (event) => { console.log('pointer left element'); }); using the onpointerleave event handler property: const para = document.queryselector('p'); para.onpointerleave = (event) => { console.log('pointer left element'); }; specifications specification status pointer events obsolete ...

HTMLElement: transitionstart event - Web APIs

Web › API › HTMLElement › transitionstart event

the transitionstart event is fired when a css transition has actually started, i.e., after any transition-delay has ended.
...ed.
...tart examples this code adds a listener to the transitionstart event: element.addeventlistener('transitionstart', () => { console.log('started transitioning'); }); the same, but using the ontransitionstart property instead of addeventlistener(): element.ontransitionrun = () => { console.log('started transitioning'); }; live example in the following example, we have a simple <div> element, styled with a transition that includes a delay: <div class="transition">hover over me</div> <div class="message"></div> .transition { width: 100px; height: 100px; background: rgba(255,0,0,1); transition-property: transform, background; transition-duration: 2s; transition-delay: 1s; } .transition:hover { transform: rotate(90deg); background: rgba(255,0,0,0); } to this, we'll a...

HTMLFontElement.face - Web APIs

Web › API › HTMLFontElement › face

the obsolete htmlfontelement.face property is a domstring that reflects the face html attribute, containing a comma-separated list of one or more font names.
... that system.
...ust follow one of the following html microsyntax: microsyntax description examples list of one or more valid font family names a list of font names, that have to be present on the local system courier,verdana syntax facestring = fontobj.face; fontobj.face = facestring; examples // assumes there is <font id="f"> element in the html var f = document.getelementbyid("f"); f.face = "arial"; specifications the <font> tag is not supported in html5 and as a result neither is <font>.face .

HTMLFormElement: submit event - Web APIs

Web › API › HTMLFormElement › submit event

the submit event fires when a <form> is submitted.
...p whenever that occurs, then prevents the default action of submitting the form.
...ault action of submitting the form.

HTMLIFrameElement.allowPaymentRequest - Web APIs

Web › API › HTMLIFrameElement › allowPaymentRequest

the allowpaymentrequest property of the htmliframeelement interface returns a boolean indicating whether the payment request api may be invoked on a cross-origin iframe.
... the allowpaymentrequest property of the htmliframeelement interface returns a boolean indicating whether the payment request api may be invoked on a cross-origin iframe.
... api may be invoked on a cross-origin iframe.

HTMLIFrameElement.csp - Web APIs

Web › API › HTMLIFrameElement › csp

the csp property of the htmliframeelement interface specifies the content security policy that an embedded document must agree to enforce upon itself.
... the csp property of the htmliframeelement interface specifies the content security policy that an embedded document must agree to enforce upon itself.
... the csp property of the htmliframeelement interface specifies the content security policy that an embedded document must agree to enforce upon itself.

HTMLImageElement.lowSrc - Web APIs

Web › API › HTMLImageElement › lowSrc

the htmlimageelement interface's obsolete lowsrc property can be used to specify the url of a reduced-quality or otherwise faster-loading version of the image specified by the src property.
... the htmlimageelement interface's obsolete lowsrc property can be used to specify the url of a reduced-quality or otherwise faster-loading version of the image specified by the src property.
... the htmlimageelement interface's obsolete lowsrc property can be used to specify the url of a reduced-quality or otherwise faster-loading version of the image specified by the src property.

HTMLImageElement.naturalHeight - Web APIs

Web › API › HTMLImageElement › naturalHeight

the htmlimageelement interface's naturalheight property is a read-only value which returns the intrinsic (natural), density-corrected height of the image in css pixels.
... read-only value which returns the intrinsic (natural), density-corrected height of the image in css pixels.
... the javascript code simply dumps the natural and as-displayed sizes into the <div> with the class output.

HTMLImageElement.naturalWidth - Web APIs

Web › API › HTMLImageElement › naturalWidth

the htmlimageelement interface's read-only naturalwidth property returns the intrinsic (natural), density-corrected width of the image in css pixels.
...css pixels.
... the javascript code simply dumps the natural and as-displayed sizes into the <div> with the class output.

HTMLInputElement.mozGetFileNameArray() - Web APIs

Web › API › HTMLInputElement › mozGetFileNameArray

the htmlinputelement.mozgetfilenamearray() method returns an array of the names of the files that were selected by the user on an html input element.
... the htmlinputelement.mozgetfilenamearray() method returns an array of the names of the files that were selected by the user on an html input element.
...is method is gecko-specific and is not available in other browsers.

HTMLInputElement.stepUp() - Web APIs

Web › API › HTMLInputElement › stepUp

the htmlinputelement.stepup() method increments the value of a numeric type of <input> element by the value of the step attribute, or the default step value if the step attribute is not explicitly set.
...s set by the step attribute—invoking the stepup() method will return a value that does match the form controls constraints.
...by 5: <input type="number" step="5" id="thenumber" min="0" max="400"> </label> </p> <p> <label>enter how many values of step you would like to increment by or leave it blank: <input type="number" step="1" id="incrementer" min="0" max="25"> </label> </p> <input type="button" value="increment" id="thebutton"> javascript /* make the button call the function */ let button = document.getelementbyid('thebutton') button.addeventlistener('click', function() { steponup() }) function steponup() { let input = document.getelementbyid('thenumber') let val = document.getelementbyid('incrementer').value if (val) { /* increment with a parameter */ input.stepup(val) } else { /* or without a parameter.

HTMLLinkElement.as - Web APIs

Web › API › HTMLLinkElement › as

the as property of the htmllinkelement interface returns a domstring representing the type of content being loaded by the html link, one of "script", "style", "image", "video", "audio", "track", "font", "fetch".
... the as property of the htmllinkelement interface returns a domstring representing the type of content being loaded by the html link, one of "script", "style", "image", "video", "audio", "track", "font", "fetch".
... the as property of the htmllinkelement interface returns a domstring representing the type of content being loaded by the html link, one of "script", "style", "image", "video", "audio", "track", "font", "fetch".

HTMLLinkElement.referrerPolicy - Web APIs

Web › API › HTMLLinkElement › referrerPolicy

the htmllinkelement.referrerpolicy property reflect the html referrerpolicy attribute of the <link> element defining which referrer is sent when fetching the resource.
... the htmllinkelement.referrerpolicy property reflect the html referrerpolicy attribute of the <link> element defining which referrer is sent when fetching the resource.
... the htmllinkelement.referrerpolicy property reflect the html referrerpolicy attribute of the <link> element defining which referrer is sent when fetching the resource.

HTMLLinkElement.rel - Web APIs

Web › API › HTMLLinkElement › rel

the htmllinkelement.rel property reflects the rel attribute.
... the htmllinkelement.rel property reflects the rel attribute.
...he relationship between the resource represented by the <link> element and the current document.

HTMLLinkElement.relList - Web APIs

Web › API › HTMLLinkElement › relList

the htmllinkelement.rellist read-only property reflects the rel attribute.
... the htmllinkelement.rellist read-only property reflects the rel attribute.
...ttribute.

HTMLMediaElement.canPlayType() - Web APIs

Web › API › HTMLMediaElement › canPlayType

the htmlmediaelement method canplaytype() reports how likely it is that the current browser will be able to play media of a given mime type.
... of the following values: probably media of the type indicated by the mediatype parameter is probably playable on this device.
...ring) media of the given type definitely can't be played on the current device.

HTMLMediaElement.controller - Web APIs

Web › API › HTMLMediaElement › controller

the htmlmediaelement.controller property represents the media controller assigned to the element.
... the htmlmediaelement.controller property represents the media controller assigned to the element.
... the htmlmediaelement.controller property represents the media controller assigned to the element.

HTMLMediaElement.crossOrigin - Web APIs

Web › API › HTMLMediaElement › crossOrigin

the htmlmediaelement.crossorigin property is the cors setting for this image element.
... the htmlmediaelement.crossorigin property is the cors setting for this image element.
... the htmlmediaelement.crossorigin property is the cors setting for this image element.

HTMLMediaElement: ended event - Web APIs

Web › API › HTMLMediaElement › ended event

the ended event is fired when playback or streaming has stopped because the end of the media was reached or because no further data is available.
... the ended event is fired when playback or streaming has stopped because the end of the media was reached or because no further data is available.
...the media.

HTMLMediaElement.mediaGroup - Web APIs

Web › API › HTMLMediaElement › mediaGroup

the htmlmediaelement.mediagroup property reflects the mediagroup html attribute, which indicates the name of the group of elements it belongs to.
... the htmlmediaelement.mediagroup property reflects the mediagroup html attribute, which indicates the name of the group of elements it belongs to.
... the htmlmediaelement.mediagroup property reflects the mediagroup html attribute, which indicates the name of the group of elements it belongs to.

HTMLMediaElement.msInsertAudioEffect() - Web APIs

Web › API › HTMLMediaElement › msInsertAudioEffect

non-standard this feature is non-standard and is not on a standards track.
... use it on production sites facing the web: it will not work for every user.
...atableclassid: domstring, effectrequired: boolean, config); parameters activatableclassid a domstring defining the audio effects class.

HTMLMediaElement.setMediaKeys() - Web APIs

Web › API › HTMLMediaElement › setMediaKeys

the setmediakeys() property of the htmlmediaelement interface returns a promise that resolves to the passed mediakeys, which are those used to decrypt media during playback.
... the setmediakeys() property of the htmlmediaelement interface returns a promise that resolves to the passed mediakeys, which are those used to decrypt media during playback.
... the setmediakeys() property of the htmlmediaelement interface returns a promise that resolves to the passed mediakeys, which are those used to decrypt media during playback.

HTMLMediaElement.setSinkId() - Web APIs

Web › API › HTMLMediaElement › setSinkId

the htmlmediaelement.setsinkid() method sets the id of the audio device to use for output and returns a promise.
... the htmlmediaelement.setsinkid() method sets the id of the audio device to use for output and returns a promise.
... undefined.

HTMLObjectElement.data - Web APIs

Web › API › HTMLObjectElement › data

the data property of the htmlobjectelement interface returns a domstring that reflects the data html attribute, specifying the address of a resource's data.
... the data property of the htmlobjectelement interface returns a domstring that reflects the data html attribute, specifying the address of a resource's data.
... the data property of the htmlobjectelement interface returns a domstring that reflects the data html attribute, specifying the address of a resource's data.

HTMLObjectElement.height - Web APIs

Web › API › HTMLObjectElement › height

the height property of the htmlobjectelement interface returns a domstring that reflects the height html attribute, specifying the displayed height of the resource in css pixels.
... the height property of the htmlobjectelement interface returns a domstring that reflects the height html attribute, specifying the displayed height of the resource in css pixels.
... the height property of the htmlobjectelement interface returns a domstring that reflects the height html attribute, specifying the displayed height of the resource in css pixels.

HTMLObjectElement.name - Web APIs

Web › API › HTMLObjectElement › name

the name property of the htmlobjectelement interface returns a domstring that reflects the name html attribute, specifying the name of the browsing context.
... the name property of the htmlobjectelement interface returns a domstring that reflects the name html attribute, specifying the name of the browsing context.
... the name property of the htmlobjectelement interface returns a domstring that reflects the name html attribute, specifying the name of the browsing context.

HTMLObjectElement.type - Web APIs

Web › API › HTMLObjectElement › type

the type property of the htmlobjectelement interface returns a domstring that reflects the type html attribute, specifying the mime type of the resource.
... the type property of the htmlobjectelement interface returns a domstring that reflects the type html attribute, specifying the mime type of the resource.
... the type property of the htmlobjectelement interface returns a domstring that reflects the type html attribute, specifying the mime type of the resource.

HTMLObjectElement.useMap - Web APIs

Web › API › HTMLObjectElement › useMap

the usemap property of the htmlobjectelement interface returns a domstring that reflects the usemap html attribute, specifying a <map> element to use.
... the usemap property of the htmlobjectelement interface returns a domstring that reflects the usemap html attribute, specifying a <map> element to use.
... the usemap property of the htmlobjectelement interface returns a domstring that reflects the usemap html attribute, specifying a <map> element to use.

HTMLObjectElement.width - Web APIs

Web › API › HTMLObjectElement › width

the width property of the htmlobjectelement interface returns a domstring that reflects the width html attribute, specifying the displayed width of the resource in css pixels.
... the width property of the htmlobjectelement interface returns a domstring that reflects the width html attribute, specifying the displayed width of the resource in css pixels.
... the width property of the htmlobjectelement interface returns a domstring that reflects the width html attribute, specifying the displayed width of the resource in css pixels.

HTMLObjectElement.willValidate - Web APIs

Web › API › HTMLObjectElement › willValidate

the willvalidate read-only property of the htmlobjectelement interface returns a boolean that indicates whether the element is a candidate for constraint validation.
... the willvalidate read-only property of the htmlobjectelement interface returns a boolean that indicates whether the element is a candidate for constraint validation.
... the willvalidate read-only property of the htmlobjectelement interface returns a boolean that indicates whether the element is a candidate for constraint validation.

HTMLTableElement.deleteRow() - Web APIs

Web › API › HTMLTableElement › deleteRow

the htmltableelement.deleterow() method removes a specific row (<tr>) from a given <table>.
... the htmltableelement.deleterow() method removes a specific row (<tr>) from a given <table>.
...l 1.2</td><td>cell 1.3</td></tr> <tr><td>cell 2.1</td><td>cell 2.2</td><td>cell 2.3</td></tr> <tr><td>cell 3.1</td><td>cell 3.2</td><td>cell 3.3</td></tr> </table> javascript let table = document.queryselector('table'); // delete second row table.deleterow(1); result specifications specification status comment html living standardthe definition of 'htmltableelement: deleterow' in that specification.

HTMLTableElement.deleteTFoot() - Web APIs

Web › API › HTMLTableElement › deleteTFoot

the htmltableelement.deletetfoot() method removes the <tfoot> element from a given <table>.
... the htmltableelement.deletetfoot() method removes the <tfoot> element from a given <table>.
....

HTMLTableElement.deleteTHead() - Web APIs

Web › API › HTMLTableElement › deleteTHead

the htmltableelement.deletethead() removes the <thead> element from a given <table>.
... the htmltableelement.deletethead() removes the <thead> element from a given <table>.
...ascript to delete a table's header.

HTMLTableElement.width - Web APIs

Web › API › HTMLTableElement › width

the htmltableelement.width property represents the desired width of the table.
... the htmltableelement.width property represents the desired width of the table.
... the htmltableelement.width property represents the desired width of the table.

HTMLVideoElement.msFrameStep() - Web APIs

Web › API › HTMLVideoElement › msFrameStep

non-standard this feature is non-standard and is not on a standards track.
....
...s the video by one frame forward or one frame backward.

HTMLVideoElement.msZoom - Web APIs

Web › API › HTMLVideoElement › msZoom

will not work for every user.
...is trimmed.
... coming in is in 16:9 aspect ratio, the mszoom option can be used to render the 16:9 video in 4:3 aspect ratio.

SVGAltGlyphElement.glyphRef - Web APIs

Web › API › SVGAltGlyphElement › glyphRef

the svgaltglyphelement.glyphref property is a domstring representing a glyph identifier.
... the svgaltglyphelement.glyphref property is a domstring representing a glyph identifier.
... the svgaltglyphelement.glyphref property is a domstring representing a glyph identifier.

SVGAnimationElement: endEvent event - Web APIs

Web › API › SVGAnimationElement › endEvent event

the endevent event of the svganimationelement interface is fired when at the active end of the animation is reached.
... the endevent event of the svganimationelement interface is fired when at the active end of the animation is reached.
...nimation</button> <ul> </ul> ul { height: 100px; border: 1px solid #ddd; overflow-y: scroll; padding: 10px 30px; } let svgelem = document.queryselector('svg'); let animateelem = document.queryselector('animatemotion'); let list = document.queryselector('ul'); let btn = document.queryselector('button'); animateelem.addeventlistener('beginevent', () => { let listitem = document.createelement('li'); listitem.textcontent = 'beginevent fired'; list.appendchild(listitem); }) animateelem.addeventlistener('endevent', () => { let listitem = document.createelement('li'); listitem.textcontent = 'endevent fired'; list.appendchild(listitem); }) animateelem.addeventlistener('repeatevent', (e) => { let listitem = document.createelement('li'); let msg = 'repeatevent fired'; if(e.

SVGAnimationElement.onbegin - Web APIs

Web › API › SVGAnimationElement › onbegin

the svganimationelement.onbegin property refers to the event handler for the beginevent.
... the svganimationelement.onbegin property refers to the event handler for the beginevent.
... the svganimationelement.onbegin property refers to the event handler for the beginevent.

SVGAnimationElement.onend - Web APIs

Web › API › SVGAnimationElement › onend

the svganimationelement.onend property refers to the event handler for the endevent.
... the svganimationelement.onend property refers to the event handler for the endevent.
... the svganimationelement.onend property refers to the event handler for the endevent.

SVGAnimationElement.onrepeat - Web APIs

Web › API › SVGAnimationElement › onrepeat

the svganimationelement.onrepeat property refers to the event handler for the repeatevent.
... the svganimationelement.onrepeat property refers to the event handler for the repeatevent.
... the svganimationelement.onrepeat property refers to the event handler for the repeatevent.

SVGAnimationElement: repeatEvent event - Web APIs

Web › API › SVGAnimationElement › repeatEvent event

the repeatevent event of the svganimationelement interface is fired when the element's local timeline repeats.
... the repeatevent event of the svganimationelement interface is fired when the element's local timeline repeats.
...dur="5s" repeatcount="indefinite" /> </circle> </svg> <hr> <ul> </ul> ul { height: 100px; border: 1px solid #ddd; overflow-y: scroll; padding: 10px 30px; } let svgelem = document.queryselector('svg'); let animateelem = document.queryselector('animatemotion'); let list = document.queryselector('ul'); animateelem.addeventlistener('beginevent', () => { let listitem = document.createelement('li'); listitem.textcontent = 'beginevent fired'; list.appendchild(listitem); }) animateelem.addeventlistener('repeatevent', (e) => { let listitem = document.createelement('li'); let msg = 'repeatevent fired'; if(e.detail) { msg += '; repeat number: ' + e.detail; } listitem.textcontent = msg; list.appendchild(listitem); }) event handler property equivalent note that you ...

SVGImageElement.decoding - Web APIs

Web › API › SVGImageElement › decoding

the decoding property of the svgimageelement interface represents a hint given to the browser on how it should decode the image.
... the decoding property of the svgimageelement interface represents a hint given to the browser on how it should decode the image.
... the decoding property of the svgimageelement interface represents a hint given to the browser on how it should decode the image.

HTMLSlotElement.assignedSlot - Web APIs

Web › API › Text › assignedSlot

the assignedslot property of the text interface returns the htmlslotelement object associated with the element.
... the assignedslot property of the text interface returns the htmlslotelement object associated with the element.
... the assignedslot property of the text interface returns the htmlslotelement object associated with the element.

getElementsByAttribute - Archive of obsolete content

Archive › Mozilla › XUL › Method › getElementsByAttribute

« xul reference home getelementsbyattribute( attrib, value ) return type: dom nodelist returns a nodelist of all the child elements of the element that have the attribute given by the first argument set to the value given by the second argument.
...ements of the element that have the attribute given by the first argument set to the value given by the second argument.

labelElement - Archive of obsolete content

Archive › Mozilla › XUL › Property › labelElement

« xul reference labelelement type: label element the label element associated with the control.
... « xul reference labelelement type: label element the label element associated with the control.

Element - Archive of obsolete content

Archive › RSS elements

rss elements a <author> (rss author element) b c <category> (rss category element) <channel> (rss channel element) <cloud> (rss cloud element) <comments> (rss comments element) <copyright> (rss copyright element) d <day> (rss day element) <description> (rss description element) <docs> (rss docs element) e <enclosure> (rss enclosure element) f g <generator> (rss generator element) <guid> (rss guid element) h <height> (rss height element) <hour> (rss hour element) i <image> (rss image element) <item> (rss item element) j k l <language> (rss language element) <lastbuilddate> (rss last build date element) <link> (rss link element) m <managingeditor> (rss managing editor element) n <name> (rss name element) o p <pubdate> (rss publi...
...<guid> (rss guid element) h <height> (rss height element) <hour> (rss hour element) i <image> (rss image element) <item> (rss item element) j k l <language> (rss language element) <lastbuilddate> (rss last build date element) <link> (rss link element) m <managingeditor> (rss managing editor element) n <name> (rss name element) o p <pubdate> (rss published date element) q r <rating> (rss rating element) <rss> (rss's root "rss" element) s <skipdays> (rss skip days element) <skiphours> (rss skip hours element) <source> (rss source element) t <textinput> (rss text input element) <title> (rss title element) <ttl> (rss ttl element) u <url> (rss url element) v w <webmaster> (rss web master element) <width> (rss width element) x y ...

XForms Secret Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Secret

other sensitive text.
...ed to specify the keyboard shortcut for focusing this control.

XForms Textarea Element - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Textarea

introduction serves to show/change multiline text (see the spec).
...tributes ui common appearance - isn't supported.

HTMLIFrameElement.addNextPaintListener()

Mozilla › Gecko › Chrome › API › Browser API › addNextPaintListener

warning: removed in firefox 65.
...fox 65.

HTMLIFrameElement.clearMatch()

Mozilla › Gecko › Chrome › API › Browser API › clearMatch

warning: removed in firefox 65.
...iframeelement clears any content highlighted by findall() or findnext().

HTMLIFrameElement.download()

Mozilla › Gecko › Chrome › API › Browser API › download

warning: removed in firefox 65.
... warning: removed in firefox 65.

HTMLIFrameElement.executeScript()

Mozilla › Gecko › Chrome › API › Browser API › executeScript

warning: removed in firefox 65.
...oved in firefox 65.

HTMLIFrameElement.findAll()

Mozilla › Gecko › Chrome › API › Browser API › findAll

warning: removed in firefox 65.
...stance of the string relative to the caret position will be highlighted.

HTMLIFrameElement.findNext()

Mozilla › Gecko › Chrome › API › Browser API › findNext

warning: removed in firefox 65.
...stance of a search result after a findall() search has been carried out.

HTMLIFrameElement.getActive()

Mozilla › Gecko › Chrome › API › Browser API › getActive

non-standard this feature is non-standard and is not on a standards track.
...is not on a standards track.

HTMLIFrameElement.getCanGoBack()

Mozilla › Gecko › Chrome › API › Browser API › getCanGoBack

non-standard this feature is non-standard and is not on a standards track.
...rack.

HTMLIFrameElement.getCanGoForward()

Mozilla › Gecko › Chrome › API › Browser API › getCanGoForward

non-standard this feature is non-standard and is not on a standards track.
...ds track.

HTMLIFrameElement.getContentDimensions()

Mozilla › Gecko › Chrome › API › Browser API › getContentDimensions

warning: removed in firefox 65.
... warning: removed in firefox 65.

HTMLIFrameElement.getManifest()

Mozilla › Gecko › Chrome › API › Browser API › getManifest

warning: removed in firefox 65.
... warning: removed in firefox 65.

HTMLIFrameElement.getStructuredData()

Mozilla › Gecko › Chrome › API › Browser API › getStructuredData

non-standard this feature is non-standard and is not on a standards track.
...user.

HTMLIFrameElement.getVisible()

Mozilla › Gecko › Chrome › API › Browser API › getVisible

non-standard this feature is non-standard and is not on a standards track.
...is not on a standards track.

HTMLIFrameElement.goBack()

Mozilla › Gecko › Chrome › API › Browser API › goBack

non-standard this feature is non-standard and is not on a standards track.
...in the future.

HTMLIFrameElement.goForward()

Mozilla › Gecko › Chrome › API › Browser API › goForward

non-standard this feature is non-standard and is not on a standards track.
...ior may change in the future.

HTMLIFrameElement.mute()

Mozilla › Gecko › Chrome › API › Browser API › mute

non-standard this feature is non-standard and is not on a standards track.
...on-standard this feature is non-standard and is not on a standards track.

HTMLIFrameElement.reload()

Mozilla › Gecko › Chrome › API › Browser API › reload

non-standard this feature is non-standard and is not on a standards track.
... this feature is non-standard and is not on a standards track.

HTMLIframeElement.removeNextPaintListener()

Mozilla › Gecko › Chrome › API › Browser API › removeNextPaintListener

warning: removed in firefox 65.
... warning: removed in firefox 65.

HTMLIFrameElement.sendMouseEvent()

Mozilla › Gecko › Chrome › API › Browser API › sendMouseEvent

non-standard this feature is non-standard and is not on a standards track.
...s not on a standards track.

HTMLIFrameElement.sendTouchEvent()

Mozilla › Gecko › Chrome › API › Browser API › sendTouchEvent

warning: removed in firefox 65.
... warning: removed in firefox 65.

HTMLIFrameElement.setActive()

Mozilla › Gecko › Chrome › API › Browser API › setActive

non-standard this feature is non-standard and is not on a standards track.
...track.

HTMLIFrameElement.setVisible()

Mozilla › Gecko › Chrome › API › Browser API › setVisible

non-standard this feature is non-standard and is not on a standards track.
...over the resources it needs.

HTMLIFrameElement.setVolume()

Mozilla › Gecko › Chrome › API › Browser API › setVolume

non-standard this feature is non-standard and is not on a standards track.
...ndard this feature is non-standard and is not on a standards track.

HTMLIFrameElement.stop()

Mozilla › Gecko › Chrome › API › Browser API › stop

non-standard this feature is non-standard and is not on a standards track.
... this feature is non-standard and is not on a standards track.

HTMLIFrameElement.unmute()

Mozilla › Gecko › Chrome › API › Browser API › unmute

non-standard this feature is non-standard and is not on a standards track.
...andard this feature is non-standard and is not on a standards track.

HTMLIFrameElement.zoom()

Mozilla › Gecko › Chrome › API › Browser API › zoom

warning: removed in firefox 65.
... warning: removed in firefox 65.

nsIDOMXULSelectControlItemElement

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMXULSelectControlItemElement

dom/interfaces/xul/nsidomxulselectcntrlitemel.idlscriptable please add a summary to this article.
... dom/interfaces/xul/nsidomxulselectcntrlitemel.idlscriptable please add a summary to this article.

nsIFeedElementBase

Mozilla › Tech › XPCOM › Reference › Interface › nsIFeedElementBase

toolkit/components/feeds/public/nsifeedelementbase.idlscriptable this interface is a base interface from which several of the other feed access interfaces derive.
...ase.idlscriptable this interface is a base interface from which several of the other feed access interfaces derive.

nsIXFormsModelElement

Mozilla › Tech › XPCOM › Reference › Interface › nsIXFormsModelElement

extensions/xforms/nsixformsmodelelement.idlscriptable defines scriptable methods for manipulating instance data and updating computed and displayed values.
...ts from: nsisupports last changed in gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) method overview nsidomdocument getinstancedocument(in domstring instanceid); void rebuild(); void recalculate(); void refresh(); void revalidate(); methods getinstancedocument() nsidomdocument getinstancedocument( in domstring instanceid ); parameters instanceid the id of the instance element to be returned.

Element: DOMMouseScroll event - Web APIs

Web › API › Element › DOMMouseScroll event

er of lines to scroll, with the direction indicated by the value's sign.
...on indicated by the value's sign.

Element: MSManipulationStateChanged event - Web APIs

Web › API › Element › MSManipulationStateChanged event

msmanipulationstatechanged fires when the state of an element being manipulated has changed (ie.
... msmanipulationstatechanged fires when the state of an element being manipulated has changed (ie.

Element.accessKey - Web APIs

Web › API › Element › accessKey

the element.accesskey property sets the keystroke which a user can press to jump to a given element.
... the element.accesskey property sets the keystroke which a user can press to jump to a given element.

Element: auxclick event - Web APIs

Web › API › Element › auxclick event

the auxclick event is fired at an element when a non-primary pointing device button (any mouse button other than the primary—usually leftmost—button) has been pressed and released both within the same element.
... cancelable yes interface mouseevent event handler property onauxclick preventing default actions for the vast majority of browsers that map middle click to opening a link in a new tab, including firefox, it is possible to cancel this behavior by calling preventdefault() from within an auxclick event handler.

Element: blur event - Web APIs

Web › API › Element › blur event

the blur event fires when an element has lost focus.
...ent.target.style.background = ''; }); result event delegation there are two ways of implementing event delegation for this event: by using the focusout event, or by setting the usecapture parameter of addeventlistener() to true.

Element: error event - Web APIs

Web › API › Element › error event

the error event is fired on an element object when a resource failed to load, or can't be used.
...ror event is fired on an element object when a resource failed to load, or can't be used.

Element: focus event - Web APIs

Web › API › Element › focus event

the focus event fires when an element has received focus.
...vent.target.style.background = ''; }); result event delegation there are two ways of implementing event delegation for this event: by using the focusin event, or by setting the usecapture parameter of addeventlistener() to true.

Element: focusin event - Web APIs

Web › API › Element › focusin event

the focusin event fires when an element is about to receive focus.
...ocusin is focusout.

Element: focusout event - Web APIs

Web › API › Element › focusout event

the focusout event fires when an element is about to lose focus.
...cusout is focusin.

Element: fullscreenerror event - Web APIs

Web › API › Element › fullscreenerror event

the fullscreenerror event is fired when the browser cannot switch to full-screen mode.
...ent is fired when the browser cannot switch to full-screen mode.

Element: keydown event - Web APIs

Web › API › Element › keydown event

ething like this (229 is a special value set for a keycode relating to an event that has been processed by an ime): eventtarget.addeventlistener("keydown", event => { if (event.iscomposing || event.keycode === 229) { return; } // do something }); examples addeventlistener keydown example this example logs the keyboardevent.code value whenever you press down a key inside the <input> element.
...{ if (event.iscomposing || event.keycode === 229) { return; } // do something }); examples addeventlistener keydown example this example logs the keyboardevent.code value whenever you press down a key inside the <input> element.

Element: keypress event - Web APIs

Web › API › Element › keypress event

keydown instead.
...position system; blur and focus events; domactivate event; other event examples addeventlistener keypress example this example logs the keyboardevent.code value whenever you press a key after focussing the <input> element.

Element: keyup event - Web APIs

Web › API › Element › keyup event

do something like this (229 is a special value set for a keycode relating to an event that has been processed by an ime): eventtarget.addeventlistener("keyup", event => { if (event.iscomposing || event.keycode === 229) { return; } // do something }); examples addeventlistener keyup example this example logs the keyboardevent.code value whenever you release a key inside the <input> element.
... if (event.iscomposing || event.keycode === 229) { return; } // do something }); examples addeventlistener keyup example this example logs the keyboardevent.code value whenever you release a key inside the <input> element.

Element: mousemove event - Web APIs

Web › API › Element › mousemove event

the mousemove event is fired at an element when a pointing device (usually a mouse) is moved while the cursor's hotspot is inside it.
...ne segment, sets x and y to 0, and stops further drawing by setting isdrawing to false.

Element: mouseover event - Web APIs

Web › API › Element › mouseover event

the mouseover event is fired at an element when a pointing device (such as a mouse or trackpad) is used to move the cursor onto the element or one of its child elements.
...the element or one of its child elements.

Element: mouseup event - Web APIs

Web › API › Element › mouseup event

the mouseup event is fired at an element when a button on a pointing device (such as a mouse or trackpad) is released while the pointer is located inside it.
...ne segment, sets x and y to 0, and stops further drawing by setting isdrawing to false.

Element.onfullscreenerror - Web APIs

Web › API › Element › onfullscreenerror

the element interface's onfullscreenerror property is an event handler for the fullscreenerror event which is sent to the element when an error occurs while attempting to transition into or out of full-screen mode.
... the element interface's onfullscreenerror property is an event handler for the fullscreenerror event which is sent to the element when an error occurs while attempting to transition into or out of full-screen mode.

Element: overflow event - Web APIs

Web › API › Element › overflow event

the overflow event is fired when an element has been overflowed by its content or has been rendered for the first time in this state (only works for elements styled with overflow != visible).
... <div id="wrapper"> <div id="child"></div> </div> <br/> <label><input type="checkbox" id="toggle" checked/> overflow</label> <style> #wrapper { width: 20px; height: 20px; background: #000; padding: 5px; overflow: hidden; } #child { width: 40px; height: 40px; border: 2px solid grey; background: #ccc; } </style> <script> var wrapper = document.getelementbyid("wrapper"), child = document.getelementbyid("child"), toggle = document.getelementbyid("toggle"); wrapper.addeventlistener("overflow", function( event ) { console.log( event ); }, false); wrapper.addeventlistener("underflow", function( event ) { console.log( event ); }, false); toggle.addeventlistener("change", function( event ) { if ( event.target.c...

Element.requestPointerLock() - Web APIs

Web › API › Element › requestPointerLock

the element.requestpointerlock() method lets you asynchronously ask for the pointer to be locked on the given element.
... the element.requestpointerlock() method lets you asynchronously ask for the pointer to be locked on the given element.

Element.scrollLeftMax - Web APIs

Web › API › Element › scrollLeftMax

the element.scrollleftmax read-only property returns a number representing the maximum left scroll offset possible for the element.
... the element.scrollleftmax read-only property returns a number representing the maximum left scroll offset possible for the element.

Element: show event - Web APIs

Web › API › Element › show event

the show event is fired when a contextmenu event was fired on/bubbled to an element that has a contextmenu attribute.
...contextmenu event was fired on/bubbled to an element that has a contextmenu attribute.

Element: wheel event - Web APIs

Web › API › Element › wheel event

mplementation-specific, and doesn't necessarily dispatch a scroll event.
... scroll event.

Event.srcElement - Web APIs

Web › API › Event › srcElement

initially implemented in internet explorer, event.srcelement is a now-standard alias (defined in the dom standard but flagged as "historical") for the event.target property.
... initially implemented in internet explorer, event.srcelement is a now-standard alias (defined in the dom standard but flagged as "historical") for the event.target property.

HTMLCanvasElement.mozFetchAsStream() - Web APIs

Web › API › HTMLCanvasElement › mozFetchAsStream

the htmlcanvaselement.mozfetchasstream() internal method used to create a new input stream that, when ready, would provide the contents of the canvas as image data.
...ack.

HTMLDetailsElement: toggle event - Web APIs

Web › API › HTMLDetailsElement › toggle event

the toggle event fires when the open/closed state of a <details> element is toggled.
... the toggle event fires when the open/closed state of a <details> element is toggled.

HTMLElement: animationcancel event - Web APIs

Web › API › HTMLElement › animationcancel event

g node is hidden using css.
...an event handler for this event can be added by setting the onanimationcancel property, or using addeventlistener().

HTMLElement.forceSpellCheck() - Web APIs

Web › API › HTMLElement › forceSpellCheck

the forcespellcheck() method of the htmlelement interface forces a spelling and grammar check on html elements, even if the user has not focused on the elements.
... the forcespellcheck() method of the htmlelement interface forces a spelling and grammar check on html elements, even if the user has not focused on the elements.

HTMLElement: lostpointercapture event - Web APIs

Web › API › HTMLElement › lostpointercapture event

the lostpointercapture event is fired when a captured pointer is released.
... the lostpointercapture event is fired when a captured pointer is released.

HTMLElement: transitioncancel event - Web APIs

Web › API › HTMLElement › transitioncancel event

the transitioncancel event is fired when a css transition is canceled.
...nsition'); transition.addeventlistener('transitioncancel', () => { console.log('transition canceled'); }); the same, but using the ontransitioncancel property instead of addeventlistener(): const transition = document.queryselector('.transition'); transition.ontransitioncancel = () => { console.log('transition canceled'); }; live example in the following example, we have a simple <div> element, styled with a transition that includes a delay: <div class="transition"></div> <div class="message"></div> .transition { width: 100px; height: 100px; background: rgba(255,0,0,1); transition-property: transform background; transition-duration: 2s; transition-delay: 2s; } .transition:hover { transform: rotate(90deg); background: rgba(255,0,0,0); } to this, we'll add some javasc...

HTMLElement: transitionend event - Web APIs

Web › API › HTMLElement › transitionend event

directions - as it finishes transitioning to the transitioned state, and when it fully reverts to the default or non-transitioned state.
...event: const transition = document.queryselector('.transition'); transition.addeventlistener('transitionend', () => { console.log('transition ended'); }); the same, but using the ontransitionend: const transition = document.queryselector('.transition'); transition.ontransitionend = () => { console.log('transition ended'); }; live example in the following example, we have a simple <div> element, styled with a transition that includes a delay: <div class="transition">hover over me</div> <div class="message"></div> .transition { width: 100px; height: 100px; background: rgba(255,0,0,1); transition-property: transform background; transition-duration: 2s; transition-delay: 1s; } .transition:hover { transform: rotate(90deg); background: rgba(255,0,0,0); } to this, we'll ad...

HTMLFontElement.color - Web APIs

Web › API › HTMLFontElement › color

the obsolete htmlfontelement.color property is a domstring that reflects the color html attribute, containing either a named color or a color specified in the hexadecimal #rrggbb format.
...ription examples valid name color string nameofcolor (case insensitive) green green green valid hex color string in rgb format: #rrggbb #008000 rgb using decimal values rgb(x,x,x) (x in 0-255 range) rgb(0,128,0) syntax colorstring = fontobj.color; fontobj.color = colorstring; examples // assumes there is <font id="f"> element in the html var f = document.getelementbyid("f"); f.color = "green"; specifications the <font> tag is not supported in html5 and as a result neither is <font>.color.

HTMLFormElement.acceptCharset - Web APIs

Web › API › HTMLFormElement › acceptCharset

the htmlformelement.acceptcharset property represents a list of the supported character encodings for the given <form> element.
...property represents a list of the supported character encodings for the given <form> element.

HTMLFormElement.action - Web APIs

Web › API › HTMLFormElement › action

the htmlformelement.action property represents the action of the <form> element.
...resents the action of the <form> element.

HTMLFormElement: reset event - Web APIs

Web › API › HTMLFormElement › reset event

nttarget.addeventlistener() to listen for form resets, and logs the current event.timestamp whenever that occurs.
...m resets, and logs the current event.timestamp whenever that occurs.

HTMLHyperlinkElementUtils.origin - Web APIs

Web › API › HTMLHyperlinkElementUtils › origin

the htmlhyperlinkelementutils.origin read-only property is a usvstring containing the unicode serialization of the origin of the represented url; that is: for url using the http or https, the scheme followed by '://', followed by the domain, followed by ':', followed by the port (the default port, 80 and 443 respectively, if explicitely specified); for url using file: scheme, the value is browser dependant; for url using the blob: scheme, the origin of the url following blob:.
....

HTMLIFrameElement.featurePolicy - Web APIs

Web › API › HTMLIFrameElement › featurePolicy

the featurepolicy read-only property of the htmliframeelement interface returns the featurepolicy interface which provides a simple api for introspecting the feature policies applied to a specific frame.
... the featurepolicy read-only property of the htmliframeelement interface returns the featurepolicy interface which provides a simple api for introspecting the feature policies applied to a specific frame.

HTMLImageElement.decoding - Web APIs

Web › API › HTMLImageElement › decoding

the decoding property of the htmlimageelement interface represents a hint given to the browser on how it should decode the image.
...tent.

HTMLImageElement.referrerPolicy - Web APIs

Web › API › HTMLImageElement › referrerPolicy

the htmlimageelement.referrerpolicy property reflects the html referrerpolicy attribute of the <img> element defining which referrer is sent when fetching the resource.
...that is roughly the scheme, the host and the port.

HTMLInputElement.multiple - Web APIs

Web › API › HTMLInputElement › multiple

the htmlinputelement.multiple property indicates if an input can have more than one value.
... the htmlinputelement.multiple property indicates if an input can have more than one value.

HTMLInputElement: search event - Web APIs

Web › API › HTMLInputElement › search event

the search event is fired when a search is initiated usinng an <input> element of type="search".
...put> is focused, or, if the incremental attribute is present, after a ua-defined timeout elapses since the most recent keystroke (with new keystrokes resetting the timeout so the firing of the event is debounced).

HTMLMediaElement: canplay event - Web APIs

Web › API › HTMLMediaElement › canplay event

the canplay event is fired when the user agent can play the media, but estimates that not enough data has been loaded to play the media up to its end without having to stop for further buffering of content.
...to play the media up to its end without having to stop for further buffering of content.

HTMLMediaElement: canplaythrough event - Web APIs

Web › API › HTMLMediaElement › canplaythrough event

the canplaythrough event is fired when the user agent can play the media, and estimates that enough data has been loaded to play the media up to its end without having to stop for further buffering of content.
... the media up to its end without having to stop for further buffering of content.

HTMLMediaElement.controlsList - Web APIs

Web › API › HTMLMediaElement › controlsList

the controlslist property of the htmlmediaelement interface returns a domtokenlist that helps the user agent select what controls to show on the media element whenever the user agent shows its own set of controls.
... the controlslist property of the htmlmediaelement interface returns a domtokenlist that helps the user agent select what controls to show on the media element whenever the user agent shows its own set of controls.

HTMLMediaElement: durationchange event - Web APIs

Web › API › HTMLMediaElement › durationchange event

the durationchange event is fired when the duration attribute has been updated.
... the durationchange event is fired when the duration attribute has been updated.

HTMLMediaElement: emptied event - Web APIs

Web › API › HTMLMediaElement › emptied event

the emptied event is fired when the media has become empty; for example, this event is sent if the media has already been loaded (or partially loaded), and the load() method is called to reload it.
...already been loaded (or partially loaded), and the load() method is called to reload it.

HTMLMediaElement.initialTime - Web APIs

Web › API › HTMLMediaElement › initialTime

the htmlmediaelement.initialtime is the initial playback position in seconds.
... the htmlmediaelement.initialtime is the initial playback position in seconds.

HTMLMediaElement: loadeddata event - Web APIs

Web › API › HTMLMediaElement › loadeddata event

the loadeddata event is fired when the frame at the current playback position of the media has finished loading; often the first frame.
... no cancelable no interface event target element default action none event handler property globaleventhandlers.onloadeddata specification html5 media note that this event will not fire in mobile/tablet devices if data-saver is on in browser settings.

HTMLMediaElement: loadedmetadata event - Web APIs

Web › API › HTMLMediaElement › loadedmetadata event

the loadedmetadata event is fired when the metadata has been loaded.
... html5 media additional properties property type description mozchannels read only int the number of channels.

HTMLMediaElement.onerror - Web APIs

Web › API › HTMLMediaElement › onerror

the onerror property of the htmlmediaelement interface is the eventhandler for processing error events.
... the onerror property of the htmlmediaelement interface is the eventhandler for processing error events.

HTMLMediaElement.pause() - Web APIs

Web › API › HTMLMediaElement › pause

the htmlmediaelement.pause() method will pause playback of the media, if the media is already in a paused state this method will have no effect.
... the htmlmediaelement.pause() method will pause playback of the media, if the media is already in a paused state this method will have no effect.

HTMLMediaElement: play event - Web APIs

Web › API › HTMLMediaElement › play event

the play event is fired when the paused property is changed from true to false, as a result of the play method, or the autoplay attribute.
...y is changed from true to false, as a result of the play method, or the autoplay attribute.

HTMLMediaElement: playing event - Web APIs

Web › API › HTMLMediaElement › playing event

the playing event is fired when playback is ready to start after having been paused or delayed due to lack of data.
...when playback is ready to start after having been paused or delayed due to lack of data.

HTMLMediaElement: ratechange event - Web APIs

Web › API › HTMLMediaElement › ratechange event

the ratechange event is fired when the playback rate has changed.
... the ratechange event is fired when the playback rate has changed.

HTMLMediaElement: seeked event - Web APIs

Web › API › HTMLMediaElement › seeked event

the seeked event is fired when a seek operation completed, the current playback position has changed, and the boolean seeking attribute is changed to false.
...ent playback position has changed, and the boolean seeking attribute is changed to false.

HTMLMediaElement: seeking event - Web APIs

Web › API › HTMLMediaElement › seeking event

the seeking event is fired when a seek operation starts, meaning the boolean seeking attribute has changed to true and the media is seeking a new position.
...e boolean seeking attribute has changed to true and the media is seeking a new position.

HTMLMediaElement.sinkId - Web APIs

Web › API › HTMLMediaElement › sinkId

the htmlmediaelement.sinkid read-only property returns a domstring that is the unique id of the audio device delivering output.
... the htmlmediaelement.sinkid read-only property returns a domstring that is the unique id of the audio device delivering output.

HTMLMediaElement: stalled event - Web APIs

Web › API › HTMLMediaElement › stalled event

the stalled event is fired when the user agent is trying to fetch media data, but data is unexpectedly not forthcoming.
... the user agent is trying to fetch media data, but data is unexpectedly not forthcoming.

HTMLMediaElement: suspend event - Web APIs

Web › API › HTMLMediaElement › suspend event

the suspend event is fired when media data loading has been suspended.
... the suspend event is fired when media data loading has been suspended.

HTMLMediaElement: timeupdate event - Web APIs

Web › API › HTMLMediaElement › timeupdate event

ers don't take longer than 250ms to run).
...ny more frequent than the user agent can comfortably handle while decoding the video.

HTMLMediaElement: volumechange event - Web APIs

Web › API › HTMLMediaElement › volumechange event

the volumechange event is fired when the volume has changed.
... the volumechange event is fired when the volume has changed.

HTMLMediaElement: waiting event - Web APIs

Web › API › HTMLMediaElement › waiting event

the waiting event is fired when playback has stopped because of a temporary lack of data.
...he waiting event is fired when playback has stopped because of a temporary lack of data.

HTMLObjectElement.checkValidity - Web APIs

Web › API › HTMLObjectElement › checkValidity

the checkvalidity() method of the htmlobjectelement interface returns a boolean that always is true, because object objects are never candidates for constraint validation.
... the checkvalidity() method of the htmlobjectelement interface returns a boolean that always is true, because object objects are never candidates for constraint validation.

HTMLObjectElement.contentDocument - Web APIs

Web › API › HTMLObjectElement › contentDocument

the contentdocument read-only property of the htmlobjectelement interface returns a document representing the active document of the object element's nested browsing context, if any; otherwise null.
... the contentdocument read-only property of the htmlobjectelement interface returns a document representing the active document of the object element's nested browsing context, if any; otherwise null.

HTMLObjectElement.contentWindow - Web APIs

Web › API › HTMLObjectElement › contentWindow

the contentwindow read-only property of the htmlobjectelement interface returns a windowproxy representing the window proxy of the object element's nested browsing context, if any; otherwise null.
... the contentwindow read-only property of the htmlobjectelement interface returns a windowproxy representing the window proxy of the object element's nested browsing context, if any; otherwise null.

HTMLObjectElement.validationMessage - Web APIs

Web › API › HTMLObjectElement › validationMessage

the validationmessage read-only property of the htmlobjectelement interface returns a domstring representing a localized message that describes the validation constraints that the control does not satisfy (if any).
... the validationmessage read-only property of the htmlobjectelement interface returns a domstring representing a localized message that describes the validation constraints that the control does not satisfy (if any).

HTMLObjectElement.validity - Web APIs

Web › API › HTMLObjectElement › validity

the validity read-only property of the htmlobjectelement interface returns a validitystate with the validity states that this element is in.
... the validity read-only property of the htmlobjectelement interface returns a validitystate with the validity states that this element is in.

HTMLOrForeignElement.nonce - Web APIs

Web › API › HTMLOrForeignElement › nonce

the nonce property of the htmlorforeignelement interface returns the cryptographic number used once that is used by content security policy to determine whether a given fetch will be allowed to proceed.
... the nonce property of the htmlorforeignelement interface returns the cryptographic number used once that is used by content security policy to determine whether a given fetch will be allowed to proceed.

SVGAElement.target - Web APIs

Web › API › SVGAElement › target

the svgaelement.target read-only property of svgaelement returns an svganimatedstring object that specifies the portion of a target window, frame, pane into which a document is to be opened when a link is activated.
...s activated.

SVGGraphicsElement: copy event - Web APIs

Web › API › SVGGraphicsElement › copy event

the copy event fires on svggraphicselements when the user initiates a copy action through the browser's user interface.
...tp://www.w3.org/2000/svg"> <text x="5" y="10" id="text-to-copy">copy this text</text> <foreignobject x="5" y="20" width="90" height="20"> <input xmlns="http://www.w3.org/1999/xhtml" placeholder="paste it here"/> </foreignobject> </svg> css input { font-size: 10px; width: 100%; height: 90%; box-sizing: border-box; border: 1px solid black; } javascript document.getelementsbytagname("text")[0].addeventlistener("copy", evt => { evt.clipboarddata.setdata('text/plain', document.getselection().tostring().touppercase()); evt.preventdefault(); }); result specifications specification status comment scalable vector graphics (svg) 2 candidate recommendation definition that the clipboard events apply to svg elements.

SVGGraphicsElement: cut event - Web APIs

Web › API › SVGGraphicsElement › cut event

the cut event is fired on an svggraphicselement when the user has initiated a "cut" action through the browserʼs user interface.
...the selection from the document.

SVGImageElement.decode - Web APIs

Web › API › SVGImageElement › decode

the decode() method of the svgimageelement interface initiates asynchronous decoding of an image, returning a promise that resolves once the image data is ready for use.
... the decode() method of the svgimageelement interface initiates asynchronous decoding of an image, returning a promise that resolves once the image data is ready for use.

SVGImageElement.height - Web APIs

Web › API › SVGImageElement › height

the height read-only property of the svgimageelement interface returns an svganimatedlength corresponding to the height attribute of the given <image> element.
... the height read-only property of the svgimageelement interface returns an svganimatedlength corresponding to the height attribute of the given <image> element.

SVGImageElement.preserveAspectRatio - Web APIs

Web › API › SVGImageElement › preserveAspectRatio

the preserveaspectratio read-only property of the svgimageelement interface returns an svganimatedpreserveaspectratio corresponding to the preserveaspectratio attribute of the given <image> element.
... the preserveaspectratio read-only property of the svgimageelement interface returns an svganimatedpreserveaspectratio corresponding to the preserveaspectratio attribute of the given <image> element.

SVGImageElement.width - Web APIs

Web › API › SVGImageElement › width

the width read-only property of the svgimageelement interface returns an svganimatedlength corresponding to the width attribute of the given <image> element.
... the width read-only property of the svgimageelement interface returns an svganimatedlength corresponding to the width attribute of the given <image> element.

SVGImageElement.x - Web APIs

Web › API › SVGImageElement › x

the x read-only property of the svgimageelement interface returns an svganimatedlength corresponding to the x attribute of the given <image> element.
... the x read-only property of the svgimageelement interface returns an svganimatedlength corresponding to the x attribute of the given <image> element.

SVGImageElement.y - Web APIs

Web › API › SVGImageElement › y

the y read-only property of the svgimageelement interface returns an svganimatedlength corresponding to the y attribute of the given <image> element.
... the y read-only property of the svgimageelement interface returns an svganimatedlength corresponding to the y attribute of the given <image> element.

<marquee>: The Marquee element (Obsolete) - HTML: Hypertext Markup Language

Web › HTML › Element › marquee

the html <marquee> element is used to insert a scrolling area of text.
... the html <marquee> element is used to insert a scrolling area of text.

<multicol>: The HTML Multi-Column Layout element (Obsolete) - HTML: Hypertext Markup Language

Web › HTML › Element › multicol

the html multi-column layout element (<multicol>) was an experimental element designed to allow multi-column layouts and must not be used.
...lumn layout element (<multicol>) was an experimental element designed to allow multi-column layouts and must not be used.

<nobr>: The Non-Breaking Text element (obsolete) - HTML: Hypertext Markup Language

Web › HTML › Element › nobr

the non-standard, obsolete html <nobr> element prevents the text it contains from automatically wrapping across multiple lines, potentially resulting in the user having to scroll horizontally to see the entire width of the text.
... the non-standard, obsolete html <nobr> element prevents the text it contains from automatically wrapping across multiple lines, potentially resulting in the user having to scroll horizontally to see the entire width of the text.

SyntaxError: missing ] after element list - JavaScript

Web › JavaScript › Reference › Errors › Missing bracket after list

the javascript exception "missing ] after element list" occurs when there is an error with the array initializer syntax somewhere.
... the javascript exception "missing ] after element list" occurs when there is an error with the array initializer syntax somewhere.

element - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › element

« xul reference home element type: id the id of the broadcaster element that the observer is observing.

removeelement - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › removeelement

« xul reference home removeelement type: id when placed on an element in an overlay, it indicates that the element in the base file should be removed from the window.

resizer.element - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › resizer.element

« xul reference home element type: element to resize the id of the element that should be resized by the resizer.

checkAdjacentElement - Archive of obsolete content

Archive › Mozilla › XUL › Method › checkAdjacentElement

« xul reference home checkadjacentelement( dir ) return type: no return value deselects the currently selected radio button in the group and selects the one adjacent to it.

ensureElementIsVisible - Archive of obsolete content

Archive › Mozilla › XUL › Method › ensureElementIsVisible

« xul reference home ensureelementisvisible( element ) return type: no return value if the specified element is not currently visible to the user, the displayed items are scrolled so that it is.

ensureSelectedElementIsVisible - Archive of obsolete content

Archive › Mozilla › XUL › Method › ensureSelectedElementIsVisible

« xul reference home ensureselectedelementisvisible() return type: no return value if the currently selected element in the list box is not currently visible to the user, the list box view is scrolled so that it is.

preferenceForElement - Archive of obsolete content

Archive › Mozilla › XUL › Method › preferenceForElement

« xul reference home preferenceforelement( uielement ) return type: preference element returns the preference element to which a user interface element is attached.

preferenceElements - Archive of obsolete content

Archive › Mozilla › XUL › Property › preferenceElements

« xul reference preferenceelements type: dom nodelist holds a list of the ui elements in the pane that are attached to preferences.

Test your skills: Images and Form elements - Learn web development

Learn › CSS › Building blocks › Images tasks

the aim of this task is to help you check your understanding of some of the values and units that we looked at in the lesson on images, media and form elements.

nsIDOMHTMLFormElement

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMHTMLFormElement

the nsidomhtmlformelement interface implements the dom htmlformelement interface.

hasMoreElements

Mozilla › Tech › XPCOM › Reference › Interface › nsISimpleEnumerator › hasMoreElements

documentation is now located at nsisimpleenumerator.hasmoreelements().

Element: DOMActivate event - Web APIs

Web › API › Element › DOMActivate event

the domactivate event is fired at an element when it becomes active, such as when it is clicked on using the mouse or a keypress is used to navigate to it.

Element: dblclick event - Web APIs

Web › API › Element › dblclick event

the dblclick event fires when a pointing device button (such as a mouse's primary button) is double-clicked; that is, when it's rapidly clicked twice on a single element within a very short span of time.

Element: mousewheel event - Web APIs

Web › API › Element › mousewheel event

the obsolete and non-standard mousewheel event is fired asynchronously at an element to provide updates while a mouse wheel or similar device is operated.

Element: paste event - Web APIs

Web › API › Element › paste event

the paste event is fired when the user has initiated a "paste" action through the browser's user interface.

Element.runtimeStyle - Web APIs

Web › API › Element › runtimeStyle

summary element.runtimestyle is a proprietary property similar to htmlelement.style, except its styles, that have higher precedence and modification.

Element.scrollTopMax - Web APIs

Web › API › Element › scrollTopMax

the element.scrolltopmax read-only property returns a number representing the maximum top scroll offset possible for the element.

Element: scroll event - Web APIs

Web › API › Element › scroll event

the scroll event fires an element has been scrolled.

Element: webkitmouseforcedown event - Web APIs

Web › API › Element › webkitmouseforcedown event

after a mousedown event has been fired at the element, if and when sufficient pressure has been applied to the mouse or trackpad button to qualify as a "force click," safari begins sending webkitmouseforcedown events to the element.

Element: webkitmouseforceup event - Web APIs

Web › API › Element › webkitmouseforceup event

the non-standard webkitmouseforceup event is fired by safari at an element some time after the webkitmouseforcedown event, when pressure on the button has been reduced sufficiently to end the "force click".

Element: webkitmouseforcewillbegin event - Web APIs

Web › API › Element › webkitmouseforcewillbegin event

safari for macos fires the non-standard webkitmouseforcewillbegin event at an element before firing the initial mousedown event.

HTMLAnchorElement.download - Web APIs

Web › API › HTMLAnchorElement › download

the htmlanchorelement.download property is a domstring indicating that the linked resource is intended to be downloaded rather than displayed in the browser.

HTMLCanvasElement: webglcontextcreationerror event - Web APIs

Web › API › HTMLCanvasElement › webglcontextcreationerror event

s fired if the user agent is unable to create a webglrenderingcontext context.

HTMLCanvasElement: webglcontextlost event - Web APIs

Web › API › HTMLCanvasElement › webglcontextlost event

l api is fired if the user agent detects that the drawing buffer associated with a webglrenderingcontext object has been lost.

HTMLCanvasElement: webglcontextrestored event - Web APIs

Web › API › HTMLCanvasElement › webglcontextrestored event

e context was lost are no longer valid.

HTMLContentElement.getDistributedNodes() - Web APIs

Web › API › HTMLContentElement › getDistributedNodes

the htmlcontentelement.getdistributednodes() method returns a static nodelist of the distributed nodes associated with this <content> element.

HTMLDialogElement: close event - Web APIs

Web › API › HTMLDialogElement › close event

the close event is fired on an htmldialogelement object when the dialog it represents has been closed.

HTMLElement.outerText - Web APIs

Web › API › HTMLElement › outerText

htmlelement.outertext is a non-standard property.

HTMLElement: pointerout event - Web APIs

Web › API › HTMLElement › pointerout event

the pointerout event is fired for several reasons including: pointing device is moved out of the hit test boundaries of an element; firing the pointerup event for a device that does not support hover (see pointerup); after firing the pointercancel event (see pointercancel); when a pen stylus leaves the hover range detectable by the digitizer.

HTMLElement: pointerover event - Web APIs

Web › API › HTMLElement › pointerover event

the pointerover event is fired when a pointing device is moved into an element's hit test boundaries.

HTMLElement: transitionrun event - Web APIs

Web › API › HTMLElement › transitionrun event

run', () => { console.log('transition is running but hasn\'t necessarily started transitioning yet'); }); the same, but using the ontransitionrun property instead of addeventlistener(): el.ontransitionrun = () => { console.log('transition started running, and will start transitioning when the transition delay has expired'); }; live example in the following example, we have a simple <div> element, styled with a transition that includes a delay: <div class="transition">hover over me</div> <div class="message"></div> .transition { width: 100px; height: 100px; background: rgba(255,0,0,1); transition-property: transform, background; transition-duration: 2s; transition-delay: 1s; } .transition:hover { transform: rotate(90deg); background: rgba(255,0,0,0); } to this, we'll a...

HTMLFormElement.encoding - Web APIs

Web › API › HTMLFormElement › encoding

the htmlformelement.encoding property is an alternative name for the enctype element on the dom htmlformelement object.

HTMLIFrameElement.setNfcFocus() - Web APIs

Web › API › HTMLIFrameElement › setNFCFocus

the setnfcfocus() method of the htmliframeelement interface sets whether an <iframe> can receive an nfc event.

HTMLMediaElement: abort event - Web APIs

Web › API › HTMLMediaElement › abort event

lly loaded, but not as the result of an error.

HTMLMediaElement: loadstart event - Web APIs

Web › API › HTMLMediaElement › loadstart event

} video.addeventlistener('loadstart', handleevent); video.addeventlistener('progress', handleevent); video.addeventlistener('canplay', handleevent); video.addeventlistener('canplaythrough', handleevent); loadvideo.addeventlistener('click', () => { if (source) { document.location.reload(); } else { loadvideo.textcontent = "reset example"; source = document.createelement('source'); source.setattribute('src', 'https://interactive-examples.mdn.mozilla.net/media/examples/flower.webm'); source.setattribute('type', 'video/webm'); video.appendchild(source); } }); result specifications specification status html living standardthe definition of 'loadstart media event' in that specification.

HTMLMediaElement: progress event - Web APIs

Web › API › HTMLMediaElement › progress event

} video.addeventlistener('loadstart', handleevent); video.addeventlistener('progress', handleevent); video.addeventlistener('canplay', handleevent); video.addeventlistener('canplaythrough', handleevent); loadvideo.addeventlistener('click', () => { if (source) { document.location.reload(); } else { loadvideo.textcontent = "reset example"; source = document.createelement('source'); source.setattribute('src', 'https://interactive-examples.mdn.mozilla.net/media/examples/flower.webm'); source.setattribute('type', 'video/webm'); video.appendchild(source); } }); result specifications specification status html living standardthe definition of 'progress media event' in that specification.

HTMLShadowElement.getDistributedNodes() - Web APIs

Web › API › HTMLShadowElement › getDistributedNodes

the htmlshadowelement.getdistributednodes() method returns a static nodelist of the distributed nodes associated with this <shadow> element.

HTMLStyleElement.scoped - Web APIs

Web › API › HTMLStyleElement › scoped

the htmlstyleelement.scoped property is a boolean value indicating if the element applies to the whole document (false) or only to the parent's sub-tree (true).

HTMLStyleElement.type - Web APIs

Web › API › HTMLStyleElement › type

the htmlstyleelement.type read-only property returns the type of the current style.

HTMLVideoElement.msIsStereo3D - Web APIs

Web › API › HTMLVideoElement › msIsStereo3D

msisstereo3d is a read-only property which determines whether the system considers the loaded video source to be stereo 3-d or not.

SVGElement: abort event - Web APIs

Web › API › SVGElement › abort event

the abort event is fired when page loading is stopped before an svg element has been allowed to load completely.

SVGElement: error event - Web APIs

Web › API › SVGElement › error event

the error event is fired when an svg element does not load properly or when an error occurs during script execution.

SVGElement: load event - Web APIs

Web › API › SVGElement › load event

the load event fires on an svgelement when it is loaded in the browser, e.g.

SVGElement: resize event - Web APIs

Web › API › SVGElement › resize event

the resize event is fired when an svg document is being resized.

Center an element - CSS: Cascading Style Sheets

Web › CSS › Layout cookbook › Center an element

equirements to place an item into the center of another box horizontally and vertically.

SVG image element - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › SVG Image Tag

« previousnext » the svg <image> element allows for raster images to be rendered within an svg object.

Index - Web APIs

Web › API › Index

he same vertex data, primitive count and type.
... 3 angle_instanced_arrays.drawarraysinstancedangle() angle_instanced_arrays, api, method, reference, webgl, webgl extension the angle_instanced_arrays.drawarraysinstancedangle() method of the webgl api renders primitives from array data like the gl.drawarrays() method.
... the angle_instanced_arrays.drawarraysinstancedangle() method of the webgl api renders primitives from array data like the gl.drawarrays() method.
...And 2713 more matches

HTML documentation index - HTML: Hypertext Markup Language

Web › HTML › Index

html are generally used to describe a web page's appearance/presentation (css) or functionality/behavior (javascript).
... of images and canvas advanced, cors, canvas, html, image, reference, security, storage, data html provides a crossorigin attribute for images that, in combination with an appropriate cors header, allows images defined by the <img> element that are loaded from foreign origins to be used in a <canvas> as if they had been loaded from the current origin.
...with an appropriate cors header, allows images defined by the <img> element that are loaded from foreign origins to be used in a <canvas> as if they had been loaded from the current origin.
...And 616 more matches

Index - Archive of obsolete content

Archive › Index

jpm, sdk no summary!
...hronous programming easier.
... no summary!
...And 574 more matches

Index - Archive of obsolete content

Archive › Mozilla › XUL › Index

found 1218 pages: # page tags and summary 1 xul landing, mozilla, xul xul (xml user interface language) is mozilla's xml-based language for building user interfaces of applications like firefox.
... found 1218 pages: # page tags and summary 1 xul landing, mozilla, xul xul (xml user interface language) is mozilla's xml-based language for building user interfaces of applications like firefox.
... user interface language) is mozilla's xml-based language for building user interfaces of applications like firefox.
...And 437 more matches

SVG documentation index - SVG: Scalable Vector Graphics

Web › SVG › Index

graphics (svg) are an xml-based markup language for describing two-dimensional based vector graphics.xml 2 applying svg effects to html content css, guide, html, svg modern browsers support using svg within css styles to apply graphical effects to html content.
...svg the following sources are used for the compatibility tables on svg elements and attributes: 4 content type needstechnicalreview, svg, types, data types svg makes use of a number of data types.
...e motes are governed by two simple principles.
...And 309 more matches

Chapter 3: Introduction to XUL—How to build a more intuitive UI - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › Firefox addons developer guide › Introduction to XUL—How to build a more intuitive UI

cifications that have been standardized by bodies like the w3c, xul currently does not have an explicit specification.
... listing 1, is to use the window.opendialog() method, which can be used only within a xul window.
...og() method, which can be used only within a xul window.
...And 162 more matches

XPCOM array guide

Mozilla › Tech › XPCOM › Guide › Arrays

from the other array types by using unsigned indices.
...ned indices.
... no yes* no reference counted, strong (*) note: concrete c++ arrays can be made read-only by declaring them const.
...And 107 more matches

Index - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Index

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes found 54 pages: # page tags and summary 1 xslt: extensible stylesheet language transformations landing, web, xslt extensible stylesheet language transformations (xslt) is an xml-based language used, in conjunction with specialized processing software, for the transformation of xml documents.
...eedscontent, needsexample, needslivesample, xml, xsl no summary!
...le, needslivesample, xml, xsl no summary!
...And 105 more matches

The HTML DOM API - Web APIs

Web › API › HTML DOM API

the html dom api is made up of the interfaces that define the functionality of each of the elements in html, as well as any supporting types and interfaces they rely upon.
... the html dom api is made up of the interfaces that define the functionality of each of the elements in html, as well as any supporting types and interfaces they rely upon.
...ents in html, as well as any supporting types and interfaces they rely upon.
...And 100 more matches

Getting started with HTML - Learn web development

Learn › HTML › Introduction to HTML › Getting started

overview: introduction to html next in this article we cover the absolute basics of html.
... overview: introduction to html next in this article we cover the absolute basics of html.
... how html elements are structured, how a typical html page is structured, and other important basic language features.
...And 89 more matches

MathML documentation index - MathML

Web › MathML › Index

ivation of the quadratic formula.
...de, html5 math, math education, mathml, needsbeginnerupdate we will now prove the pythagorean theorem: 6 mathml attribute reference mathml, mathml reference this is an alphabetical list of mathml attributes.
...s for each attribute are available on particular element pages.
...And 89 more matches

Anonymous Content - Archive of obsolete content

Archive › Mozilla › XBL › XBL 1.0 Reference › Anonymous Content

introduction a binding can specify an anonymous content template using the content element.
... introduction a binding can specify an anonymous content template using the content element.
... introduction a binding can specify an anonymous content template using the content element.
...And 85 more matches

display - CSS: Cascading Style Sheets

Web › CSS › display

the display css property sets whether an element is treated as a block or inline element and the layout used for its children, such as flow layout, grid or flex.
... the display css property sets whether an element is treated as a block or inline element and the layout used for its children, such as flow layout, grid or flex.
... the display css property sets whether an element is treated as a block or inline element and the layout used for its children, such as flow layout, grid or flex.
...And 84 more matches

Positioning - Learn web development

Learn › CSS › CSS layout › Positioning

previous overview: css layout next positioning allows you to take elements out of the normal document layout flow, and make them behave differently; for example sitting on top of one another, or always remaining in the same place inside the browser viewport.
...starting point.
...o give a slightly quirky, distressed feel?
...And 82 more matches

Traversing an HTML table with JavaScript and DOM Interfaces - Web APIs

Web › API › Document Object Model › Traversing an HTML table with JavaScript and DOM Interfaces

introduction this article is an overview of some powerful, fundamental dom level 1 methods and how to use them from javascript.
....
...nt access and manipulation (dom 1 core) as well as methods specific to html documents (dom 1 html).
...And 82 more matches

Migrate apps from Internet Explorer to Mozilla - Archive of obsolete content

Archive › Mozilla › Migrate apps from Internet Explorer to Mozilla

the easiest way to eliminate the need to recode for a new browser is to abstract out functionality.
...de for a new browser is to abstract out functionality.
...s to abstract out functionality.
...And 81 more matches

xlink:href - SVG: Scalable Vector Graphics

Web › SVG › Attribute › xlink:href

the xlink:href attribute defines a reference to a resource as a reference iri.
... the xlink:href attribute defines a reference to a resource as a reference iri.
...viewbox="0 0 160 40" xmlns="http://www.w3.org/2000/svg"> <a xlink:href="https://developer.mozilla.org/"><text x="10" y="25">mdn web docs</text></a> </svg> a for <a>, xlink:href defines the location of the referenced object.
...And 78 more matches

Plug-in Basics - Plugins

Plugins › Guide › Plug-in Basics

ug-ins may support multiple mime types and each mime type may be supported by multiple plug-ins, only one plug-in can be configured for a mime type.
...e opaque and always come to the top html section of a web page.
...awn in a native window; it is drawn in its own drawing target.
...And 77 more matches

nsIHTMLEditor

Mozilla › Tech › XPCOM › Reference › Interface › nsIHTMLEditor

void adddefaultproperty(in nsiatom aproperty, in astring aattribute, in astring avalue); void addinsertionlistener(in nsicontentfilter infilter); void align(in astring aalign); boolean breakisvisible(in nsidomnode anode); boolean candrag(in nsidomevent aevent); void checkselectionstateforanonymousbuttons(in nsiselection aselection); nsidomelement createanonymouselement(in astring atag, in nsidomnode aparentnode, in astring aanonclass, in boolean aiscreatedhidden); nsidomelement createelementwithdefaults(in astring atagname); void decreasefontsize(); void dodrag(in nsidomevent aevent); void getalignment(out boolean amixed, out short aalign); astring getbackgroundcolorstate(out boolean amixed); ...
...uselement(in astring atag, in nsidomnode aparentnode, in astring aanonclass, in boolean aiscreatedhidden); nsidomelement createelementwithdefaults(in astring atagname); void decreasefontsize(); void dodrag(in nsidomevent aevent); void getalignment(out boolean amixed, out short aalign); astring getbackgroundcolorstate(out boolean amixed); nsidomelement getelementorparentbytagname(in astring atagname, in nsidomnode anode); astring getfontcolorstate(out boolean amixed); astring getfontfacestate(out boolean amixed); astring getheadcontentsashtml(); astring gethighlightcolorstate(out boolean amixed); void getindentstate(out boolean acanindent, out boolean acanoutdent); void getinlineproperty(in ...
...ute, in astring avalue, out boolean afirst, out boolean aany, out boolean aall); nsisupportsarray getlinkedobjects(); void getlistitemstate(out boolean amixed, out boolean ali, out boolean adt, out boolean add); void getliststate(out boolean amixed, out boolean aol, out boolean aul, out boolean adl); astring getparagraphstate(out boolean amixed); nsidomelement getselectedelement(in astring atagname); nsidomelement getselectioncontainer(); void ignorespuriousdragevent(in boolean aignorespuriousdragevent); void increasefontsize(); void indent(in astring aindent); void insertelementatselection(in nsidomelement aelement, in boolean adeleteselection); void insertfromdrop(in nsidomevent aevent); ...
...And 75 more matches

Intersection Observer API - Web APIs

Web › API › Intersection Observer API

the intersection observer api provides a way to asynchronously observe changes in the intersection of a target element with an ancestor element or with a top-level document's viewport.
... the intersection observer api provides a way to asynchronously observe changes in the intersection of a target element with an ancestor element or with a top-level document's viewport.
... the intersection observer api provides a way to asynchronously observe changes in the intersection of a target element with an ancestor element or with a top-level document's viewport.
...And 74 more matches

Event reference

Web › Events

nt and its resources are about to be unloaded.
...the document or a dependent resource is being unloaded.
... network events event name fired when online the browser has gained access to the network.
...And 74 more matches

Indexed collections - JavaScript

Web › JavaScript › Guide › Indexed collections

the predefined array object and its methods to work with arrays in your applications.
...ined array object and its methods to work with arrays in your applications.
...ct and its methods to work with arrays in your applications.
...And 73 more matches

Using templates and slots - Web Components

Web › Web Components › Using templates and slots

this article explains how you can use the <template> and <slot> elements to create a flexible template that can then be used to populate the shadow dom of a web component.
...t> elements to create a flexible template that can then be used to populate the shadow dom of a web component.
...used to populate the shadow dom of a web component.
...And 73 more matches

Web Components

Web › Web Components

web components is a suite of different technologies allowing you to create reusable custom elements — with their functionality encapsulated away from the rest of your code — and utilize them in your web apps.
...ot been so easy for custom markup structures — think of the complex html (and associated style and script) you've sometimes had to write to render custom ui controls, and how using them multiple times can turn your page into a mess if you are not careful.
...imes had to write to render custom ui controls, and how using them multiple times can turn your page into a mess if you are not careful.
...And 70 more matches

Introduction to CSS layout - Learn web development

Learn › CSS › CSS layout › Introduction

some of the concepts we'll be covering throughout this module.
... and an idea of how css works (study introduction to css.) objective: to give you an overview of css page layout techniques.
...er lays out html pages by default when you do nothing to control page layout.
...And 69 more matches

nsIFocusManager

Mozilla › Tech › XPCOM › Reference › Interface › nsIFocusManager

n gecko 5.0 (firefox 5.0 / thunderbird 5.0 / seamonkey 2.2) implemented by: @mozilla.org/focus-manager;1 as a service: var focusmanager = components.classes["@mozilla.org/focus-manager;1"] .getservice(components.interfaces.nsifocusmanager); method overview void clearfocus(in nsidomwindow awindow); void contentremoved(in nsidocument adocument, in nsicontent aelement); native code only!
...tservice(components.interfaces.nsifocusmanager); method overview void clearfocus(in nsidomwindow awindow); void contentremoved(in nsidocument adocument, in nsicontent aelement); native code only!
...s.interfaces.nsifocusmanager); method overview void clearfocus(in nsidomwindow awindow); void contentremoved(in nsidocument adocument, in nsicontent aelement); native code only!
...And 68 more matches

Document - Web APIs

Web › API › Document

the document interface represents any web page loaded in the browser and serves as an entry point into the web page's content, which is the dom tree.
... the document interface represents any web page loaded in the browser and serves as an entry point into the web page's content, which is the dom tree.
...aractersetread only returns the character set being used by the document.
...And 67 more matches

Introduction to the DOM - Web APIs

Web › API › Document Object Model › Introduction

iented representation of the web page, which can be modified with a scripting language such as javascript.
... language such as javascript.
...standards are implemented in most modern browsers.
...And 66 more matches

Box Objects - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Box Objects

component that can be displayed.
...ed to be displayed there is not necessarily a one to one relationship between content and layout nodes.
...t all.
...And 65 more matches

Document Object Model - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Document Object Model

« previousnext » the document object model (dom) can be used with xul elements to get information about them or modify them.
...ements to get information about them or modify them.
...on the kind of document.
...And 65 more matches

Using HTML sections and outlines - Developer guides

Web › Guide › HTML › Using HTML sections and outlines

important: there are no implementations of the proposed outline algorithm in web browsers nor assistive technology; it was never part of a final w3c specification.
...hm in web browsers nor assistive technology; it was never part of a final w3c specification.
...g rank (h1-h6) to convey document structure.
...And 65 more matches

Global attributes - HTML: Hypertext Markup Language

Web › HTML › Global attributes

global attributes are attributes common to all html elements; they can be used on all elements, though they may have no effect on some elements.
... global attributes are attributes common to all html elements; they can be used on all elements, though they may have no effect on some elements.
... global attributes are attributes common to all html elements; they can be used on all elements, though they may have no effect on some elements.
...And 65 more matches

Using the Right Markup to Invoke Plugins - Archive of obsolete content

Archive › Web Standards › Using the Right Markup to Invoke Plugins

this article is about how to invoke a plugin with the correct use of html.
... this article is about how to invoke a plugin with the correct use of html.
... this article is about how to invoke a plugin with the correct use of html.
...And 64 more matches

Index

Mozilla › Tech › XPCOM › Index

ceed.
...he number of accessible actions associated with this accessible.
...ce reference adds a listener that receives progress and state information about the update that is currently being downloaded.
...And 61 more matches

inIDOMUtils

Mozilla › Tech › XPCOM › Reference › Interface › inIDOMUtils

om utility functions.
...y functions.
...0 / thunderbird 22.0 / seamonkey 2.19) implemented by: @mozilla.org/inspector/dom-utils;1 as a service: var inidomutils = components.classes["@mozilla.org/inspector/dom-utils;1"] .getservice(components.interfaces.inidomutils); method overview void addpseudoclasslock(in nsidomelement aelement, in domstring apseudoclass); void clearpseudoclasslocks(in nsidomelement aelement); [implicit_jscontext] jsval colornametorgb(in domstring acolorname); nsiarray getbindingurls(in nsidomelement aelement); nsidomnodelist getchildrenfornode(in nsidomnode anode, in boolean ashowinganonymouscontent); unsigned long long getcontentstate(in nsidomelement aelement); void getcsspropertynames([optional] in unsigned long aflags, [opti...
...And 61 more matches

Examine and edit HTML - Firefox Developer Tools

Tools › Page Inspector › How to › Examine and edit HTML

you can examine and edit the page's html in the html pane.
... you can examine and edit the page's html in the html pane.
...cmd + f on a mac.
...And 61 more matches

HTML attribute reference - HTML: Hypertext Markup Language

Web › HTML › Attributes

elements in html have attributes; these are additional values that configure the elements or adjust their behavior in various ways to meet the criteria the users want.
... elements in html have attributes; these are additional values that configure the elements or adjust their behavior in various ways to meet the criteria the users want.
... adjust their behavior in various ways to meet the criteria the users want.
...And 61 more matches

href - SVG: Scalable Vector Graphics

Web › SVG › Attribute › href

the href attribute defines a link to a resource as a reference url.
... the href attribute defines a link to a resource as a reference url.
.../"><text x="10" y="25">mdn web docs</text></a> </svg> in svg a for <a>, href defines the location of the referenced object, expressed as a url reference.
...And 61 more matches

Text labels and names - Accessibility

Web › Accessibility › Understanding WCAG › Text labels and names

given a descriptive name or label to allow users of assistive technologies to understand what its purpose is and to be able to understand and operate it correctly.
...gies to understand what its purpose is and to be able to understand and operate it correctly.
...image maps, give each <area> element an alt attribute containing a name that describes what resources the areas links to.
...And 57 more matches

Audio and Video Delivery - Developer guides

Web › Guide › Audio and video delivery

we can deliver audio and video on the web in a number of ways, ranging from 'static' media files to adaptive live streams.
...ays, ranging from 'static' media files to adaptive live streams.
... audio, the general workflow is usually something like this: check what format the browser supports via feature detection (usually a choice of two, as stated above).
...And 56 more matches

XUL Events - Archive of obsolete content

Archive › Mozilla › XUL › Events

« xul reference home the following tables and sections describe the event handler that are valid for most xul elements.
... some of the events can be attached using attributes as well.
...eners are disconnected.
...And 55 more matches

Templates - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Templates

« previousnext » in this section, we'll find out how to populate elements with data.
... « previousnext » in this section, we'll find out how to populate elements with data.
... « previousnext » in this section, we'll find out how to populate elements with data.
...And 55 more matches

Client-side form validation - Learn web development

Learn › Forms › Form validation

stomizable as javascript validation.
... of numerical input types type: specifies whether the data needs to be a number, an email address, or some other specific preset type.
...ata needs to be a number, an email address, or some other specific preset type.
...And 55 more matches

position - CSS: Cascading Style Sheets

Web › CSS › position

the position css property sets how an element is positioned in a document.
... the position css property sets how an element is positioned in a document.
...e the final location of positioned elements.
...And 55 more matches

HTML basics - Learn web development

Learn › Getting started with the web › HTML basics

e and its content.
...t a certain way.
...n make a word or image hyperlink to somewhere else, can italicize words, can make the font bigger or smaller, and so on.
...And 54 more matches

nsIDOMWindowUtils

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMWindowUtils

ecko 1.8 inherits from: nsisupports last changed in gecko 49.0 (firefox 49.0 / thunderbird 49.0 / seamonkey 2.46) implemented by: window.
...supports last changed in gecko 49.0 (firefox 49.0 / thunderbird 49.0 / seamonkey 2.46) implemented by: window.
... window.
...And 54 more matches

Accessibility documentation index - Accessibility

Web › Accessibility › Index

s, web you have a form — a contact form, for example — that you want to put some accessible error checking into.
... a label with its control.
... how to file aria-related bugs aria, bugzilla the state of aria technology has always depended on the community.
...And 53 more matches

jspage - Archive of obsolete content

Archive › Mozilla › Jetpack › jspage

$type(b); return(a)?((a!="array"&&a!="arguments")?[b]:b):[];}var $time=date.now||function(){return +new date;};function $try(){for(var b=0,a=arguments.length;b<a; b++){try{return arguments[b]();}catch(c){}}return null;}function $type(a){if(a==undefined){return false;}if(a.$family){return(a.$family.name=="number"&&!isfinite(a))?false:a.$family.name; }if(a.nodename){switch(a.nodetype){case 1:return"element";case 3:return(/\s/).test(a.nodevalue)?"textnode":"whitespace";}}else{if(typeof a.length=="number"){if(a.callee){return"arguments"; }else{if(a.item){return"collection";}}}}return typeof a;}function $unlink(c){var b;switch($type(c)){case"object":b={};for(var e in c){b[e]=$unlink(c[e]); }break;case"hash":b=new hash(c);break;case"array":b=[];for(var d=0,a=c.length;d<a;d++){b[d]=$unlink(c[d]);}break;...
...;}return b;}var browser=$merge({engine:{name:"unknown",version:0},platform:{name:(window.orientation!=undefined)?"ipod":(navigator.platform.match(/mac|win|linux/i)||["other"])[0].tolowercase()},features:{xpath:!!(document.evaluate),air:!!(window.runtime),query:!!(document.queryselector)},plugins:{},engines:{presto:function(){return(!window.opera)?false:((arguments.callee.caller)?960:((document.getelementsbyclassname)?950:925)); },trident:function(){return(!window.activexobject)?false:((window.xmlhttprequest)?((document.queryselectorall)?6:5):4);},webkit:function(){return(navigator.taintenabled)?false:((browser.features.xpath)?((browser.features.query)?525:420):419); },gecko:function(){return(!document.getboxobjectfor&&window.mozinnerscreenx==null)?false:((document.getelementsbyclassname)?19:18);}...
...(function(){var a=($try(function(){return navigator.plugins["shockwave flash"].description; },function(){return new activexobject("shockwaveflash.shockwaveflash").getvariable("$version");})||"0 r0").match(/\d+/g);return{version:parseint(a[0]||0+"."+a[1],10)||0,build:parseint(a[2],10)||0}; })();function $exec(b){if(!b){return b;}if(window.execscript){window.execscript(b);}else{var a=document.createelement("script");a.setattribute("type","text/javascript"); a[(browser.engine.webkit&&browser.engine.version<420)?"innertext":"text"]=b;document.head.appendchild(a);document.head.removechild(a);}return b;}native.uid=1; var $uid=(browser.engine.trident)?function(a){return(a.uid||(a.uid=[native.uid++]))[0];}:function(a){return a.uid||(a.uid=native.uid++);};var window=new native({name:"window",legacy:(brows...
...And 52 more matches

JXON - Archive of obsolete content

Archive › JXON

re using an instance of xmlhttprequest in order to retrieve your xml file, please use the yourrequest.responsexml property to get a parsed xml document.
...algorithm.
... to a javascript object tree.
...And 50 more matches

Index - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Index

es for keeping a website usable despite physical and technical restrictions.
...d to store multiple values in a single variable.
...gan as a fork of the webcore library in webkit, which handles layout, rendering, and dom, but now stands on its own as a separate rendering engine.
...And 50 more matches

How to build custom form controls - Learn web development

Learn › Forms › How to build custom form controls

there are some cases where the available native html form controls may seem like they are not enough.
...here the available native html form controls may seem like they are not enough.
...ilding a custom control, you should start by figuring out exactly what you want.
...And 50 more matches

EventTarget.addEventListener() - Web APIs

Web › API › EventTarget › addEventListener

the eventtarget method addeventlistener() sets up a function that will be called whenever the specified event is delivered to the target.
...f the firefox browser.
... optional a boolean indicating whether events of this type will be dispatched to the registered listener before being dispatched to any eventtarget beneath it in the dom tree.
...And 50 more matches

Building accessible custom components in XUL - Archive of obsolete content

Archive › Mozilla › XUL › Building accessible custom components in XUL

new technology which enables developers to construct accessible controls within (x)html pages.
...ccessible as similar controls in desktop applications.
...e same dhtml accessibility techniques can be applied to xul, mozilla's xml markup language for building user interfaces.
...And 49 more matches

Anonymous Content - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Anonymous Content

« previousnext » in this section we'll look at creating content with xbl.
... « previousnext » in this section we'll look at creating content with xbl.
... « previousnext » in this section we'll look at creating content with xbl.
...And 49 more matches

Grids - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Grids

« previousnext » xul has a set of elements for creating tabular grids.
... « previousnext » xul has a set of elements for creating tabular grids.
... « previousnext » xul has a set of elements for creating tabular grids.
...And 49 more matches

Popup Menus - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Popup Menus

on a menu bar.
...t a context menu is opened varies on each platform.
...ouse, for example by pressing the menu key on a keyboard.
...And 48 more matches

Manipulating documents - Learn web development

Learn › JavaScript › Client-side web APIs › Manipulating documents

bject to retrieve things like the user's preferred language, a media stream from the user's webcam, etc.
... the user's webcam, etc.
...t (represented by the dom in browsers) is the actual page loaded into the window, and is represented in javascript by the document object.
...And 48 more matches

nsIMutableArray

Mozilla › Tech › XPCOM › Reference › Interface › nsIMutableArray

xpcom/ds/nsimutablearray.idlscriptable this interface is a subclass of nsiarray that provides arrays that are mutable; that is, they can be altered programmatically.
...this interface is a subclass of nsiarray that provides arrays that are mutable; that is, they can be altered programmatically.
...ides arrays that are mutable; that is, they can be altered programmatically.
...And 48 more matches

listbox - Archive of obsolete content

Archive › Mozilla › XUL › listbox

« xul reference home [ examples | attributes | properties | methods | related ] this element is used to create a list of items where one or more of the items may be selected.
...lement is used to create a list of items where one or more of the items may be selected.
...pecify the number of rows to display in the list using the rows attribute.
...And 47 more matches

Microsummary XML grammar reference - Archive of obsolete content

Archive › Mozilla › Microsummary topics › XML grammar reference

hat describes how to pull specific information from a web page to be presented in summary form as a bookmark whose title changes based on the content of the page it targets.
...hod="text"/> <template match="/"> <value-of select="id('download-count')"/> <text> fx downloads</text> </template> </transform> </template> <pages> <include>http://(www\.)?spreadfirefox\.com/(index\.php)?</include> </pages> </generator> namespace the namespace uri for microsummary generator xml documents is: http://www.mozilla.org/microsummaries/0.1 all elements in a microsummary generator document should be in this namespace except the descendants of the <template> element, which should be in the xslt namespace: http://www.w3.org/1999/xsl/transform the <generator> element the <generator> element is the root tag for all microsummary generators, and should contain the remainder of the xml code describing the generator.
...crosummary created by the generator.
...And 46 more matches

Focus and Selection - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Focus and Selection

« previousnext » the section will describe how to handle the focus and selection of elements.
... « previousnext » the section will describe how to handle the focus and selection of elements.
... « previousnext » the section will describe how to handle the focus and selection of elements.
...And 46 more matches

menu - Archive of obsolete content

Archive › Mozilla › XUL › menu

menulist - Archive of obsolete content

Archive › Mozilla › XUL › menulist

Array - JavaScript

Web › JavaScript › Reference › Global Objects › Array

the javascript array class is a global object that is used in the construction of arrays; which are high-level, list-like objects.
...ce an array's length can change at any time, and data can be stored at non-contiguous locations in the array, javascript arrays are not guaranteed to be dense; this depends on how the programmer chooses to use them.
... how the programmer chooses to use them.
...And 45 more matches

menuitem - Archive of obsolete content

Archive › Mozilla › XUL › menuitem

« xul reference home [ examples | attributes | properties | methods | related ] a single choice in a menupopup element.
...element.
...o indicate the shortcut key (accelerator key) to use to invoke the command.
...And 44 more matches

Modifying a XUL Interface - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Modifying a XUL Interface

« previousnext » the dom provides various functions to modify the document.
... « previousnext » the dom provides various functions to modify the document.
... « previousnext » the dom provides various functions to modify the document.
...And 43 more matches

menuseparator - Archive of obsolete content

Archive › Mozilla › XUL › menuseparator

les | attributes | properties | methods | related ] used to create a separator between menu items.
... indicate the shortcut key (accelerator key) to use to invoke the command.
... overrides an assigned key set in the key attribute.
...And 43 more matches

textbox - Archive of obsolete content

Archive › Mozilla › XUL › textbox

« xul reference home [ examples | attributes | properties | methods | related ] an input field where the user can enter text.
...ols type: integer for multiline textboxes, the number of columns to display.
... columns to display.
...And 43 more matches

WAI-ARIA basics - Learn web development

Learn › Accessibility › WAI-ARIA basics

how it can be used to provide useful additional semantics to enhance accessibility where required.
... values, etc.
...esigns.
...And 43 more matches

Cascade and inheritance - Learn web development

Learn › CSS › Building blocks › Cascade and inheritance

ve: to learn about the cascade and specificity, and how inheritance works in css.
... for cascading style sheets, and that first word cascading is incredibly important to understand — the way that the cascade behaves is key to understanding css.
...nt, you will be working on a project and you will find that the css you thought should be applied to an element is not working.
...And 43 more matches

The box model - Learn web development

Learn › CSS › Building blocks › The box model

is defined as a block, it will behave in the following ways: the box will break onto a new line.
...e.
...pe by default.
...And 43 more matches

Fullscreen API - Web APIs

Web › API › Fullscreen API

the fullscreen api adds methods to present a specific element (and its descendants) in full-screen mode, and to exit full-screen mode once it is no longer needed.
... the fullscreen api adds methods to present a specific element (and its descendants) in full-screen mode, and to exit full-screen mode once it is no longer needed.
...nsider using a library such as fscreen for vendor agnostic access to the fullscreen api.
...And 43 more matches

Layout System Overview - Archive of obsolete content

Archive › Mozilla › Firefox › Layout System Overview

red to as the galley mode presentation, and is what one expects from a typical browser.
...ob: frames and reflow so, layout is concerned with providing a presentation, in galley or paged mode.
...in galley or paged mode.
...And 42 more matches

Textbox (XPFE autocomplete) - Archive of obsolete content

Archive › Mozilla › XUL › Textbox (XPFE autocomplete)

« xul reference home [ examples | attributes | properties | methods | related ] this element is created by setting the type attribute of a textbox to autocomplete.
... getresultcount, getresultvalueat, getsession, getsessionbyname, getsessionresultat, getsessionstatusat, getsessionvalueat, removesession, select, setselectionrange, syncsessions examples (example needed) attributes accesskey type: character this should be set to a character that is used as a shortcut key.
...ot be filled in until the user selects an item.
...And 42 more matches

XUL accessibility guidelines - Archive of obsolete content

Archive › Mozilla › XUL › XUL accessibility guidelines

is important to users who can't use a mouse.
...e.
...ss reference.
...And 42 more matches

richlistbox - Archive of obsolete content

Archive › Mozilla › XUL › richlistbox

« xul reference home [ examples | attributes | properties | methods | related ] this element is used to create a list of listitems (richlistitems), similar to a listbox, but is designed to be used when the items do not contain simple text content.
...st boxes.
...selecteditem, insertitemat, invertselection, movebyoffset, removeitemat, removeitemfromselection, scrolltoindex, selectall, selectitem, selectitemrange, timedselect, toggleitemselection examples <richlistbox> <richlistitem> <description>a xul description!</description> </richlistitem> <richlistitem> <button label="a xul button"/> </richlistitem> </richlistbox> the richlistbox element contains multiple richlistitem elements, which can contain any content.
...And 42 more matches

Content categories - Developer guides

Web › Guide › HTML › Content categories

every html element is a member of one or more content categories — these categories group elements that share common characteristics.
... every html element is a member of one or more content categories — these categories group elements that share common characteristics.
...ement is a member of one or more content categories — these categories group elements that share common characteristics.
...And 42 more matches

Broadcasters and Observers - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Broadcasters and Observers

« previousnext » there may be times when you want several elements to respond to events or changes of state easily.
... « previousnext » there may be times when you want several elements to respond to events or changes of state easily.
... « previousnext » there may be times when you want several elements to respond to events or changes of state easily.
...And 41 more matches

listitem - Archive of obsolete content

Archive › Mozilla › XUL › listitem

Namespaces crash course - SVG: Scalable Vector Graphics

Web › SVG › Namespaces Crash Course

oal of the w3c to make it possible for different types of xml based content to be mixed together in the same xml file.
...hml might be incorporated directly into an xhtml based scientific document.
...entific document.
...And 41 more matches

Binding Attachment and Detachment - Archive of obsolete content

Archive › Mozilla › XBL › XBL 1.0 Reference › Binding Attachment and Detachment

attachment using css bindings can be attached to elements through css using the -moz-binding property.
... attachment using css bindings can be attached to elements through css using the -moz-binding property.
... attachment using css bindings can be attached to elements through css using the -moz-binding property.
...And 40 more matches

preference - Archive of obsolete content

Archive › Mozilla › XUL › preference

Using the W3C DOM - Archive of obsolete content

Archive › Using Web Standards in your Web Pages › Using the W3C DOM

« previousnext » the document object has properties for accessing collections of elements, such as document.images and document.forms.
... » the document object has properties for accessing collections of elements, such as document.images and document.forms.
...document.forms(0) (note: document.forms[0] (using square brackets) uses the dom standard forms collection) scripts that use these properties will throw errors in most standards-compliant browsers.
...And 40 more matches

XForms Accessibility

Mozilla › Tech › Accessibility › XForms

intoduction this article provides a quick guide to how accessibility is handled in gecko for xforms..
... intoduction this article provides a quick guide to how accessibility is handled in gecko for xforms..
...how accessibility is handled in gecko for xforms..
...And 40 more matches

Keyboard-navigable JavaScript widgets - Accessibility

Web › Accessibility › Keyboard-navigable JavaScript widgets

overview web applications often use javascript to mimic desktop widgets such as menus, tree views, rich text fields, and tab panels.
...s, tree views, rich text fields, and tab panels.
...ments that do not, by nature, offer the same keyboard functionality that their desktop counterparts do.
...And 40 more matches

textbox (Toolkit autocomplete) - Archive of obsolete content

Archive › Mozilla › XUL › Textbox (Toolkit autocomplete)

« xul reference home [ examples | attributes | properties | methods | related ] this element is created by setting the type attribute of the textbox to autocomplete.
...tvalue, timeout, type, value methods getsearchat, onsearchcomplete, ontextentered, ontextreverted, select, setselectionrange examples <textbox type="autocomplete" autocompletesearch="history"/> attributes accesskey type: character this should be set to a character that is used as a shortcut key.
...ered, ontextreverted, select, setselectionrange examples <textbox type="autocomplete" autocompletesearch="history"/> attributes accesskey type: character this should be set to a character that is used as a shortcut key.
...And 39 more matches

button - Archive of obsolete content

Archive › Mozilla › XUL › button

heck, checkstate, checked, command, crop, dir, disabled, dlgtype, group, image, label, open, orient, tabindex, type examples <button label="press me" oncommand="alert('you pressed me!');"/> attributes accesskey type: character this should be set to a character that is used as a shortcut key.
...checkbox except that there is a third state which must be set manually by adjusting the check state.
...y adjusting the check state.
...And 39 more matches

HTML text fundamentals - Learn web development

Learn › HTML › Introduction to HTML › HTML text fundamentals

cture and meaning—including paragraphs, headings, lists, emphasis, and quotations.
...: headings and paragraphs most structured text consists of headings and paragraphs, whether you are reading a story, a newspaper, a college textbook, a magazine, etc.
...d paragraphs, whether you are reading a story, a newspaper, a college textbook, a magazine, etc.
...And 39 more matches

Using files from web applications - Web APIs

Web › API › File › Using files from web applications

using the file api, which was added to the dom in html5, it's now possible for web content to ask the user to select local files and then read the contents of those files.
... browser chrome code, you can; however, note there are some additional features to be aware of.
... accessing selected file(s) consider this html: <input type="file" id="input" multiple> the file api makes it possible to access a filelist containing file objects representing the files selected by the user.
...And 39 more matches

CSS basics - Learn web development

Learn › Getting started with the web › CSS basics

h what you need to get started.
...t in your browser.
...if your paragraph text is red, congratulations!
...And 38 more matches

Index - Learn web development

Learn › Index

to start small.
...er can live anywhere you like, but you should put it somewhere where you can easily find it, maybe on your desktop, in your home folder, or at the root of your hard drive.
...3rd party, api, beginner, codingscripting, google maps, learn, nytimes, third party, youtube this article has given you a useful introduction to using third-party apis to add functionality to your websites.
...And 38 more matches

Using images - Web APIs

Web › API › Canvas API › Tutorial › Using images

now we have created our own shapes and applied styles to them.
...hese can be used to do dynamic photo compositing or as backdrops of graphs, for sprites in games, and so forth.
... compositing or as backdrops of graphs, for sprites in games, and so forth.
...And 38 more matches

radio - Archive of obsolete content

Archive › Mozilla › XUL › radio

« xul reference home [ examples | attributes | properties | methods | related ] an element that can be turned on and off.
...oup> <radio id="orange" label="red" accesskey="r"/> <radio id="violet" label="green" accesskey="g" selected="true"/> <radio id="yellow" label="blue" accesskey="b" disabled="true"/> </radiogroup> attributes accesskey type: character this should be set to a character that is used as a shortcut key.
...olet" label="green" accesskey="g" selected="true"/> <radio id="yellow" label="blue" accesskey="b" disabled="true"/> </radiogroup> attributes accesskey type: character this should be set to a character that is used as a shortcut key.
...And 37 more matches

tabbrowser - Archive of obsolete content

Archive › Mozilla › XUL › tabbrowser

« xul reference home [ examples | attributes | properties | methods | related ] this element is used for holding a set of read-only views of web documents.
... « xul reference home [ examples | attributes | properties | methods | related ] this element is used for holding a set of read-only views of web documents.
...tab, reload, reloadalltabs, reloadtab, reloadwithflags, removealltabsbut, removecurrenttab, removeprogresslistener, removetab, removetabsprogresslistener,replacegroup, selecttabatindex, seticon, showonlythesetabs, stop, unpintab attributes autocompleteenabled type: boolean set to true to enable autocomplete of fields.
...And 37 more matches

toolbarbutton - Archive of obsolete content

Archive › Mozilla › XUL › toolbarbutton

ype="radio" group="radiogroup"/> <toolbarbutton accesskey="2" label="radio 2" type="radio" group="radiogroup"/> <toolbarbutton accesskey="3" label="radio 3" type="radio" group="radiogroup"/> </toolbar> attributes accesskey type: character this should be set to a character that is used as a shortcut key.
...checkbox except that there is a third state which must be set manually by adjusting the check state.
...by adjusting the check state.
...And 37 more matches

Mozilla XForms User Interface - Archive of obsolete content

Archive › Web › XForms › User Interface Elements

introduction this article is a quick reference of the xforms user interface elements.
... introduction this article is a quick reference of the xforms user interface elements.
...is a quick reference of the xforms user interface elements.
...And 37 more matches

Block and inline layout in normal flow - CSS: Cascading Style Sheets

Web › CSS › CSS Flow Layout › Block and Inline Layout in Normal Flow

in this guide, we will explore the basics of how block and inline elements behave when they are part of the normal flow.
...n they are part of the normal flow.
...ains that any boxes in normal flow will be part of a formatting context.
...And 37 more matches

The stacking context - CSS: Cascading Style Sheets

Web › CSS › CSS Positioning › Understanding z index › The stacking context

the stacking context is a three-dimensional conceptualization of html elements along an imaginary z-axis relative to the user, who is assumed to be facing the viewport or the webpage.
... the stacking context is a three-dimensional conceptualization of html elements along an imaginary z-axis relative to the user, who is assumed to be facing the viewport or the webpage.
... the stacking context is a three-dimensional conceptualization of html elements along an imaginary z-axis relative to the user, who is assumed to be facing the viewport or the webpage.
...And 37 more matches

<textarea> - HTML: Hypertext Markup Language

Web › HTML › Element › textarea

the html <textarea> element represents a multi-line plain-text editing control, useful when you want to allow users to enter a sizeable amount of free-form text, for example a comment on a review or feedback form.
...n a review or feedback form.
...ute to set the name of the associated data point submitted to the server when the form is submitted.
...And 37 more matches

Introduction to XUL - Archive of obsolete content

Archive › Mozilla › XUL › Introduction to XUL

f that spelling helped any, and short for "xml user interface language") is our name for the language in which these ui descriptions are built.
... the most recent list.
...xul is a language for describing window layout, there is some overlap in the topics covered by this document and a separate document describing xul windows.
...And 36 more matches

Browser API

Mozilla › Gecko › Chrome › API › Browser API

the html browser api is an extension of the html <iframe> element that allows web apps to implement browsers or browser-like applications.
... the html browser api is an extension of the html <iframe> element that allows web apps to implement browsers or browser-like applications.
...ications.
...And 36 more matches

Introduction to XPCOM for the DOM

Mozilla › Tech › XPCOM › Introduction to XPCOM for the DOM

er function is not available.
...o that object.
...ss" is correctly defined.
...And 36 more matches

Using Remote XUL - Archive of obsolete content

Archive › Mozilla › XUL › Using Remote XUL

ies of type "allowxulxbl", like this: components.classes["@mozilla.org/permissionmanager;1"] .getservice(components.interfaces.nsipermissionmanager) .add(uri, 'allowxulxbl', components.interfaces.nsipermissionmanager.allow_action); xul (pronounced like "zool"), which is short for xml-based user interface language, is an xml-based language for describing application interfaces.
..." url or the "open file" function of your browser.
.../there.is.only.xul" /> a xul document requires only two entities to be valid, an xml processing instruction on the first line that identifies the file as xml, and a window element that defines a xul application window (or in this case web page).
...And 35 more matches

prefpane - Archive of obsolete content

Archive › Mozilla › XUL › prefpane

tree - Archive of obsolete content

Archive › Mozilla › XUL › tree

« xul reference home [ examples | attributes | properties | methods | related ] a container which can be used to hold a tabular or hierarchical set of rows of elements.
... « xul reference home [ examples | attributes | properties | methods | related ] a container which can be used to hold a tabular or hierarchical set of rows of elements.
...he data to display inside the tree is not specified using tags, but is determined from a view object.
...And 35 more matches

HTML: A good basis for accessibility - Learn web development

Learn › Accessibility › HTML

previous overview: accessibility next a great deal of web content can be made accessible just by making sure the correct hypertext markup language elements are used for the correct purpose at all times.
...iarity with the features of html that have accessibility benefits and how to use them appropriately in your web documents.
...ead more resources, look at more examples, etc.
...And 35 more matches

HTML: A good basis for accessibility - Learn web development

Learn › Accessibility › HTML?document saved=true

previous overview: accessibility next a great deal of web content can be made accessible just by making sure the correct hypertext markup language elements are used for the correct purpose at all times.
...iarity with the features of html that have accessibility benefits and how to use them appropriately in your web documents.
...ead more resources, look at more examples, etc.
...And 35 more matches

How to structure a web form - Learn web development

Learn › Forms › How to structure a web form

previous overview: forms next with the basics out of the way, we'll now look in more detail at the elements used to provide structure and meaning to the different parts of a form.
... meaning to the different parts of a form.
... to understand how to structure html forms and give them semantics so they are usable and accessible.
...And 35 more matches

Introduction to events - Learn web development

Learn › JavaScript › Building blocks › Events

h an action can be automatically taken (that is, some code running) when the event occurs.
...be automatically taken (that is, some code running) when the event occurs.
... result, the plane can safely takeoff.
...And 35 more matches

ARIA: tab role - Accessibility

Web › Accessibility › ARIA › Roles › Tab Role

the aria tab role indicates an interactive element inside a tablist that, when activated, displays its associated tabpanel.
... the aria tab role indicates an interactive element inside a tablist that, when activated, displays its associated tabpanel.
... the aria tab role indicates an interactive element inside a tablist that, when activated, displays its associated tabpanel.
...And 35 more matches

Skinning XUL Files by Hand - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Skinning XUL Files by Hand

ime, however, skinning a file requires some manual interaction.
...e at least basic understanding of xul and the application object model that xul describes.
...anding of xul and the application object model that xul describes.
...And 34 more matches

radiogroup - Archive of obsolete content

Archive › Mozilla › XUL › radiogroup

e the radiogroup inside a groupbox if you would like a border or caption for the group.
...item, itemcount, selectedindex, selecteditem, tabindex, value methods appenditem, checkadjacentelement, getindexofitem, getitematindex, insertitemat, removeitemat examples <radiogroup> <radio id="orange" label="red"/> <radio id="violet" label="green" selected="true"/> <radio id="yellow" label="blue"/> </radiogroup> attributes disabled type: boolean indicates whether the element is disabled or not.
...lue methods appenditem, checkadjacentelement, getindexofitem, getitematindex, insertitemat, removeitemat examples <radiogroup> <radio id="orange" label="red"/> <radio id="violet" label="green" selected="true"/> <radio id="yellow" label="blue"/> </radiogroup> attributes disabled type: boolean indicates whether the element is disabled or not.
...And 34 more matches

Fundamental text and font styling - Learn web development

Learn › CSS › Styling text › Fundamentals

line and letter spacing.
... prerequisites: basic computer literacy, html basics (study introduction to html), css basics (study introduction to css).
...ide an element is laid out inside the element's content box.
...And 34 more matches

Advanced text formatting - Learn web development

Learn › HTML › Introduction to HTML › Advanced text formatting

previous overview: introduction to html next there are many other elements in html for formatting text, which we didn't get to in the html text fundamentals article.
... previous overview: introduction to html next there are many other elements in html for formatting text, which we didn't get to in the html text fundamentals article.
...ete list by any means).
...And 34 more matches

Chapter 5: Let's build a Firefox extension - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › Firefox addons developer guide › Let's build a Firefox extension

firebug.com/wiki/index.php/chromebug_user_guide you may also find this extension to be valuable: extension developer https://addons.mozilla.org/firefox/addon/7434 developing extensions: what you need to know let’s delve into chrome, something you’ll need to know about in order to develop extensions.
...e is used to contain the main xul and javascript source files.
... open the dom inspector by selecting the tools > dom inspector menu item.
...And 33 more matches

Basic native form controls - Learn web development

Learn › Forms › Basic native form controls

previous overview: forms next in the previous article, we marked up a functional web form example, introducing some form controls and common structural elements, and focusing on accessibility best practices.
... will look at the original set of form controls, available in all browsers since the early days of the web.
...eckbox, file, hidden, image, password, radio, reset, submit, and text.
...And 33 more matches

Accessibility API cross-reference

Mozilla › Accessibility › Accessibility API cross-reference

ne a list of possible object states, such as focused, read-only, checked, etc.
...pecifies have already informed the 'semantic elements' of html5 (such as main and footer), but there is not a one-to-one mapping between the aria roles and the semantics of html5.
... banner a portion of quoted content which is 'too long' to appear 'inline' n/a blockquote <blockquote> entire window border as 1 object border n/a n/a n/a specific kind of button that drops down a list of items, msaa only buttondropdown n/a n/a expressed with aria-haspopup on an element with a button role specific kind of button that drops down a grid, msaa only buttondropdowngrid n/a n/a specific kind of button that drops down a menu, msaa only buttonmenu n/a n/a expressed with aria-haspopup on an element with a button role represents the system's caret caret n/a n/a ...
...And 33 more matches

Pointer events - Web APIs

Web › API › Pointer events

tertype property to inspect the device type which produced the event.
... digitizer a sensing device with a surface that can detect contact.
...en that can sense input from an input device such as a pen, stylus, or finger.
...And 33 more matches

Creating a cross-browser video player - Developer guides

Web › Guide › Audio and video delivery › cross browser video player

be taken care of in a future article.
... example our example video player displays a clip from an open source movie called tears of steel, and includes typical video controls.
...eel, and includes typical video controls.
...And 33 more matches

The Box Model - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › The Box Model

« previousnext » in order to master xul, you'll need to have a fairly good understanding of its box model.
... layout model, which is mostly vertical.
...ertically oriented as well as horizontally oriented interfaces, providing greater flexibility in interface design.
...And 32 more matches

XUL controls - Archive of obsolete content

Archive › Mozilla › XUL › XUL controls

the following table lists the xul user interface controls.
... more information about the button element.
... button reference <button type="menu"> a button that has a drop down menu attached to it.
...And 32 more matches

tab - Archive of obsolete content

Archive › Mozilla › XUL › tab

« xul reference home [ examples | attributes | properties | methods | related ] a single tab which should be placed inside a tabs element.
... selected, tabindex, unread, validate, value properties accesskey, accessibletype, command, control, crop, disabled, image, label, linkedpanel, selected, tabindex, value examples (example needed) attributes accesskey type: character this should be set to a character that is used as a shortcut key.
...ed tab.
...And 32 more matches

tabs - Archive of obsolete content

Archive › Mozilla › XUL › tabs

Video and Audio APIs - Learn web development

Learn › JavaScript › Client-side web APIs › Video and audio APIs

previous overview: client-side web apis next html5 comes with elements for embedding rich media in documents — <video> and <audio> — which in turn come with their own apis for controlling playback, seeking, etc.
...olling playback, seeking, etc.
...wser — not very good for cross-browser support!
...And 32 more matches

Constraint validation - Developer guides

Web › Guide › HTML › HTML5 › Constraint validation

the creation of web forms has always been a complex task.
...ript) or by bad people trying to trick your web application.
...er a valid number the value must be less than or equal to the value rangeoverflow constraint violation date, month, week a valid date datetime, datetime-local, time a valid date and time required text, search, url, tel, email, password, date, datetime, datetime-local, month, week, time, number, checkbox, radio, file; also on the <select> and <textarea> elements none as it is a boolean attribute: its presence means true, its absence means false there must be a value (if set).
...And 32 more matches

Using shadow DOM - Web Components

Web › Web Components › Using shadow DOM

an important aspect of web components is encapsulation — being able to keep the markup structure, style, and behavior hidden and separate from other code on the page so that different parts do not clash, and the code can be kept nice and clean.
... of using the shadow dom.
...aur.png" alt="a red tyrannosaurus rex: a two legged dinosaur standing upright like a human, with small arms, and a large head with lots of sharp teeth."> <p>here we will add a link to the <a href="https://www.mozilla.org/">mozilla homepage</a></p> </section> </body> </html> this fragment produces the following dom structure: shadow dom allows hidden dom trees to be attached to elements in the regular dom tree — this shadow dom tree starts with a shadow root, underneath which can be attached to any elements you want, in the same way as the normal dom.
...And 32 more matches

Template Logging - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Template Logging

involves logging all new results that apply to the template due to the data changing as well as logging results that are changed or removed.
...tiple templates are being used.
...rated row.
...And 31 more matches

UI pseudo-classes - Learn web development

Learn › Forms › UI pseudo-classes

sage of pseudo-classes, for example using :checked to target a checkbox only when it is selected.
...a basic understanding of html and css, including general knowledge of pseudo-classes and pseudo-elements.
...s and pseudo-elements.
...And 31 more matches

Your first form - Learn web development

Learn › Forms › Your first form

overview: forms next the first article in our series provides you with your very first experience of creating a web form, including designing a simple form, implementing it using the right html form controls and other html elements, adding some very simple styling via css, and describing how data is sent to a server.
... adding some very simple styling via css, and describing how data is sent to a server.
...orms allow users to enter data, which is generally sent to a web server for processing and storage (see sending form data later in the module), or used on the client-side to immediately update the interface in some way (for example, add another item to a list, or show or hide a ui feature).
...And 31 more matches

Handling common accessibility problems - Learn web development

Learn › Tools and testing › Cross browser testing › Accessibility

ction.
...u bar).
...lect css > disable all styles.
...And 31 more matches

Microdata DOM API - Web APIs

Web › API › Microdata DOM API

comes even more useful when scripts can use it to expose information to the user, for example offering it in a form that can be used by other applications.
...on to the user, for example offering it in a form that can be used by other applications.
...example offering it in a form that can be used by other applications.
...And 31 more matches

pointer-events - CSS: Cascading Style Sheets

Web › CSS › pointer-events

the pointer-events css property sets under what circumstances (if any) a particular graphic element can become the target of pointer events.
...ter-events: painted; /* svg only */ pointer-events: fill; /* svg only */ pointer-events: stroke; /* svg only */ pointer-events: all; /* svg only */ /* global values */ pointer-events: inherit; pointer-events: initial; pointer-events: unset; the pointer-events property is specified as a single keyword chosen from the list of values below.
... /* svg only */ /* global values */ pointer-events: inherit; pointer-events: initial; pointer-events: unset; the pointer-events property is specified as a single keyword chosen from the list of values below.
...And 31 more matches

<menu> - HTML: Hypertext Markup Language

Web › HTML › Element › menu

the html <menu> element represents a group of commands that a user can perform or activate.
... the html <menu> element represents a group of commands that a user can perform or activate.
... the html <menu> element represents a group of commands that a user can perform or activate.
...And 31 more matches

Interaction between privileged and non-privileged pages - Archive of obsolete content

Archive › Add-ons › Interaction between privileged and non-privileged pages

nsionevent", function(e) { myextension.mylistener(e); }, false, true); // the last value is a mozilla-specific value to indicate untrusted content is allowed to trigger the event.
...{ myextension.mylistener(e); }, false, true); // the last value is a mozilla-specific value to indicate untrusted content is allowed to trigger the event.
...(e); }, false, true); // the last value is a mozilla-specific value to indicate untrusted content is allowed to trigger the event.
...And 30 more matches

The Essentials of an Extension - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › The Essentials of an Extension

mostly ignore the version range.
...illa applications need to install an add-on.
...andy if you want to inspect script files that are part of firefox, other extensions, or your own.
...And 30 more matches

CSS FAQ - Learn web development

Learn › CSS › Howto › CSS FAQ

rict.dtd"> when at all possible, you should just use the html5 doctype.
...my css, which is valid, render at all?
... you've got the path to css file wrong.
...And 30 more matches

Handling common HTML and CSS problems - Learn web development

Learn › Tools and testing › Cross browser testing › HTML and CSS

s lies with the fact that both languages are fairly simple, and often developers don't take them seriously, in terms of making sure the code is well-crafted, efficient, and semantically describes the purpose of the features on the page.
...ome kind of third party api (generating ad banners, for example) includes a class name or id that you are already using for a different purpose.
...er html and css problems.
...And 30 more matches

Binding Implementations - Archive of obsolete content

Archive › Mozilla › XBL › XBL 1.0 Reference › Binding Implementations

introduction bindings can define methods and properties on a bound element using the implementation tag.
... introduction bindings can define methods and properties on a bound element using the implementation tag.
...entation provides a new set of methods and properties that can be invoked directly from the bound element.
...And 29 more matches

Menus - Archive of obsolete content

Archive › Mozilla › XUL › PopupGuide › Menus

side the menu.
...gs can be used to create menus which sit on a menubar or are attached to buttons.
... a menubar or are attached to buttons.
...And 29 more matches

Adding Event Handlers - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Adding Event Handlers

sily.
...indow will load slightly faster.
...ndard, poorly written, or syntax prone to cause logic errors are logged to the javascript console.
...And 29 more matches

Trees - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Trees

« previousnext » xul provides a way to create tabular or hierarchical lists using a tree.
...tain column headers.
...start to use trees, you will use one of these built-in types.
...And 29 more matches

XUL Event Propagation - Archive of obsolete content

Archive › Mozilla › XUL › XUL event propagation

interactive xul-based user interfaces, since it is events that bring the information about user actions to the code behind the interface.
...owing image describes in a very basic way how the various actors in the event model interact with one another.
...nother.
...And 29 more matches

Type, class, and ID selectors - Learn web development

Learn › CSS › Building blocks › Selectors › Type Class and ID Selectors

prerequisites: basic computer literacy, basic software installed, basic knowledge of working with files, html basics (study introduction to html), and an idea of how css works (study css first steps.) objective: to learn about the different css selectors we can use to apply css to a document.
... software installed, basic knowledge of working with files, html basics (study introduction to html), and an idea of how css works (study css first steps.) objective: to learn about the different css selectors we can use to apply css to a document.
...css first steps.) objective: to learn about the different css selectors we can use to apply css to a document.
...And 29 more matches

Other form controls - Learn web development

Learn › Forms › Other form controls

previous overview: forms next we now look at the functionality of non-<input> form elements in detail, from other control types such as drop-down lists and multi-line text fields, to other useful form features such as the <output> element (which we saw in action in the previous article), and progress bars.
...useful form features such as the <output> element (which we saw in action in the previous article), and progress bars.
...t> element (which we saw in action in the previous article), and progress bars.
...And 29 more matches

Index

Mozilla › Projects › SpiderMonkey › Index

emory pointed at by js_getstringchars(str).
...inalizecallback jsapi reference, reference, référence(2), spidermonkey js_addfinalizecallback add a callback function which the garbage collector calls at several points during garbage collection.
...éférence(2), spidermonkey js_addfinalizecallback add a callback function which the garbage collector calls at several points during garbage collection.
...And 29 more matches

<input type="image"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › image

<input> elements of type image are used to create graphical submit buttons, i.e.
... clone https://github.com/mdn/interactive-examples and send us a pull request.
...orted common attributes alt, src, width, height, formaction, formenctype, formmethod, formnovalidate, formtarget idl attributes none.
...And 29 more matches

begin - SVG: Scalable Vector Graphics

Web › SVG › Attribute › begin

the begin attribute defines when an animation should begin or when an element should be discarded.
...hould be discarded.
...se-value>, <event-value>, <repeat-value>, <accesskey-value>, <wallclock-sync-value> or the keyword indefinite.
...And 29 more matches

More Event Handlers - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › More Event Handlers

ame 'event'.
...istener function will be the event object.
... which can be examined during an event.
...And 28 more matches

key - Archive of obsolete content

Archive › Mozilla › XUL › key

« xul reference home [ examples | attributes | properties | methods | related ] the key element defines a window-global keyboard shortcut and must be placed inside a keyset element.
... « xul reference home [ examples | attributes | properties | methods | related ] the key element defines a window-global keyboard shortcut and must be placed inside a keyset element.
... « xul reference home [ examples | attributes | properties | methods | related ] the key element defines a window-global keyboard shortcut and must be placed inside a keyset element.
...And 28 more matches

CSS - Archive of obsolete content

Archive › Web › CSS

obsolete css features -moz-bindingthe -moz-binding css property is used by mozilla-based applications to attach an xbl binding to a dom element.-moz-border-bottom-colorsin mozilla applications like firefox, the -moz-border-bottom-colors css property sets a list of colors for the bottom border.-moz-border-left-colorsin mozilla applications like firefox, the -moz-border-left-colors css property sets a list of colors for the left border.-moz-border-right-colorsin mozilla applications like firefox, the -moz-border-right-colors css property sets a list of colors for the right border.-moz-border-top-colorsin mozilla applications like firefox, the -moz-border-top-colors css property sets a list of colors for the top border.-moz-stack-sizing-moz-stack-sizing is an extended css property.
...rsin mozilla applications like firefox, the -moz-border-right-colors css property sets a list of colors for the right border.-moz-border-top-colorsin mozilla applications like firefox, the -moz-border-top-colors css property sets a list of colors for the top border.-moz-stack-sizing-moz-stack-sizing is an extended css property.
...om behavior that occurs when a user hits the zoom limit during page manipulation.-ms-content-zoom-limitthe -ms-content-zoom-limit css shorthand property is a microsoft extension that specifies values for the -ms-content-zoom-limit-min and -ms-content-zoom-limit-max properties.-ms-content-zoom-limit-maxthe -ms-content-zoom-limit-max css property is a microsoft extension that specifies the selected elements' maximum zoom factor.-ms-content-zoom-limit-minthe -ms-content-zoom-limit-min css property is a microsoft extension that specifies the minimum zoom factor.-ms-content-zoom-snapthe -ms-content-zoom-snap css shorthand property is a microsoft extension that specifies values for the -ms-content-zoom-snap-type and -ms-content-zoom-snap-points properties.-ms-content-zoom-snap-pointsthe -ms-content-zoo...
...And 28 more matches

Displaying Places information using views

Mozilla › Displaying Place information using views

ow the contents of bookmarks or history in your extension or application, you may want to use the built-in places views, which are generic and will save you a lot of time writing basic functionality so that you can focus on building your extension or application.
...ute whose value is "places".
...n the view are the results of this query.
...And 28 more matches

How whitespace is handled by HTML, CSS, and in the DOM - Web APIs

Web › API › Document Object Model › Whitespace

sily readable by yourself and other people.
...self and other people.
... is largely ignored — whitespace in between words is treated as a single character, and whitespace at the start and end of elements and outside elements is ignored.
...And 28 more matches

Example and tutorial: Simple synth keyboard - Web APIs

Web › API › Web Audio API › Simple synth

es use of the following web api interfaces: audiocontext, oscillatornode, periodicwave, and gainnode.
...put some controls for configuring the layer.
...he layer.
...And 28 more matches

ARIA: cell role - Accessibility

Web › Accessibility › ARIA › Roles › Cell Role

the cell value of the aria role attribute identifies an element as being a cell in a tabular container that does not contain column or row header information.
... the cell value of the aria role attribute identifies an element as being a cell in a tabular container that does not contain column or row header information.
...ia role attribute identifies an element as being a cell in a tabular container that does not contain column or row header information.
...And 28 more matches

CSS selectors - CSS: Cascading Style Sheets

Web › CSS › CSS Selectors

css selectors define the elements to which a set of css rules apply.
... css selectors define the elements to which a set of css rules apply.
... css selectors define the elements to which a set of css rules apply.
...And 28 more matches

preserveAspectRatio - SVG: Scalable Vector Graphics

Web › SVG › Attribute › preserveAspectRatio

the preserveaspectratio attribute indicates how an element with a viewbox providing a given aspect ratio must fit into a viewport with a different aspect ratio.
... the preserveaspectratio attribute indicates how an element with a viewbox providing a given aspect ratio must fit into a viewport with a different aspect ratio.
...al "meet or slice" reference as described below: alignment value the alignment value indicates whether to force uniform scaling and, if so, the alignment method to use in case the aspect ratio of the viewbox doesn't match the aspect ratio of the viewport.
...And 28 more matches

SVG 2 support in Mozilla - SVG: Scalable Vector Graphics

Web › SVG › SVG 2 support in Mozilla

n of the svg standard, which is a complete rework of the svg 1.2 draft.
...a complete rework of the svg 1.2 draft.
... list interfaces implementation status unknown <script> element in content model of all elements implementation status unknown initialize(), appenditem(), replaceitem(), and insertitembefore() on list objects making a copy of any list item being inserted that is already in another list implementation status unknown crossorigin attribute for <image> and <script> elements not implemented yet (at least for <image>; bug 1240357) rendering model change notes svg root and <foreignobject> not overflow:hidden in ua style sheet implementation status unknown allow overflow: auto; to clip and show scroll bars implementation status unknown allow overflow: scroll; to show scroll bars on <svg> elements implementa...
...And 28 more matches

Introduction to using XPath in JavaScript - XPath

Web › XPath › Introduction to using XPath in JavaScript

ct.
...ch is an xpathresult object of the type specified in the resulttype parameter.
... = document.creatensresolver( contextnode.ownerdocument == null ?
...And 28 more matches

util/array - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs › util array

helper functions for working with arrays.
... helper functions for working with arrays.
... helper functions for working with arrays.
...And 27 more matches

Template Builder Interface - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Template Builder Interface

« previousnext » when inserting an element into a xul document, the element is checked to see if it has a datasources attribute.
... « previousnext » when inserting an element into a xul document, the element is checked to see if it has a datasources attribute.
... « previousnext » when inserting an element into a xul document, the element is checked to see if it has a datasources attribute.
...And 27 more matches

The Box Model - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › The Box Model

« previousnext » in this section, we'll look at how xul handles layout.
... « previousnext » in this section, we'll look at how xul handles layout.
... layout.
...And 27 more matches

checkbox - Archive of obsolete content

Archive › Mozilla › XUL › checkbox

label - Archive of obsolete content

Archive › Mozilla › XUL › label

« xul reference home [ examples | attributes | properties | methods | related ] this element is used to provide a label for a control element.
...ibletype, control, crop, disabled, value style classes header, indent, monospace, plain, small-margin, text-link examples <label value="email address" control="email"/> <textbox id="email"/> attributes accesskey type: character this should be set to a character that is used as a shortcut key.
...nospace, plain, small-margin, text-link examples <label value="email address" control="email"/> <textbox id="email"/> attributes accesskey type: character this should be set to a character that is used as a shortcut key.
...And 27 more matches

richlistitem - Archive of obsolete content

Archive › Mozilla › XUL › richlistitem

Getting started with CSS - Learn web development

Learn › CSS › First steps › Getting started

ng point is an html document.
...a folder on your machine.
... will look at the most usual and useful way of doing so — linking css from the head of your document.
...And 27 more matches

TypeScript support in Svelte - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Svelte TypeScript

previous overview: client-side javascript frameworks next in the last article we learned about svelte stores and even implemented our own custom store to persist the app's information to web storage.
... open the file todosstatus.svelte and add the lang='ts' attribute.
...n import the todotype and declare the todos prop as an array of todotype.
...And 27 more matches

JavaScript-DOM Prototypes in Mozilla

Mozilla › JavaScript-DOM Prototypes in Mozilla

h is not really that special.
...he standard jsobject properties such as constructor, and the non-standard __parent__, __proto__, etc.), all the dom functionality of obj comes from obj's prototype (obj.__proto__) that xpconnect sets up when exposing the first image in document to javascript.
...pe (obj.__proto__) that xpconnect sets up when exposing the first image in document to javascript.
...And 27 more matches

Constraint validation API - Web APIs

Web › API › Constraint validation

eb application.
...validate input values on the server side, in a way that is consistent with what is done on the client side.
...ving quick feedback to the user.
...And 27 more matches

Document Object Model (DOM) - Web APIs

Web › API › Document Object Model

an event is triggered, the event handlers get executed.
...arlier specifications have been removed.
...ionregistry domimplementationsource domlocator domobject domsettabletokenlist domuserdata elementtraversal entity entityreference namelist notation typeinfo userdatahandler html dom a document containing html is described using the document interface, which is extended by the html specification to include various html-specific features.
...And 27 more matches

ARIA: button role - Accessibility

Web › Accessibility › ARIA › Roles › button role

the button role should be used for clickable elements that trigger a response when activated by the user.
... the button role should be used for clickable elements that trigger a response when activated by the user.
... attribute to create toggle buttons.
...And 27 more matches

Dynamically modifying XUL-based user interface - Archive of obsolete content

Archive › Mozilla › XUL › Dynamically modifying XUL-based user interface

rface.
...cript defines the behavior, using dom apis to access the xul document.
...nt.
...And 26 more matches

ContextMenus - Archive of obsolete content

Archive › Mozilla › XUL › PopupGuide › ContextMenus

context menus a context menu is a menu where the items on the menu are specific to the context in which the menu was opened.
... context menus a context menu is a menu where the items on the menu are specific to the context in which the menu was opened.
...n the mouse button or by pressing the control key and clicking the mouse button.
...And 26 more matches

Advanced Rules - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Advanced Rules

datasources but sometimes you will need to display data in more complicated ways.
...rules are placed within the rule tag.
...eria for matching a given resource.
...And 26 more matches

Implementing feature detection - Learn web development

Learn › Tools and testing › Cross browser testing › Feature detection

ing what specific browser is accessing the site) — this is a terrible practice that should be discouraged at all costs.
... ok, although it is slightly more brittle and hacky, and not as cool-looking.
....
...And 26 more matches

Debugger.Source - Firefox Developer Tools

Tools › Debugger-API › Debugger.Source

l code and function definitions, perhaps with nested functions, then the debugger.script instances for those all refer to the same debugger.source instance.
...y a portion of a larger source document.
...ripts created by eval or the function constructor, this may be a synthesized filename, starting with a valid url and followed by information tracking how the code was introduced into the system; the entire string is not a valid url.
...And 26 more matches

Using dynamic styling information - Web APIs

Web › API › CSS Object Model › Using dynamic styling information

olled in a single stylesheet.
...ng dedicated to styling details, it can focus on the overall semantics of each section it is creating or manipulating, leaving the precise style details to the stylesheet.
...script> </head> <body> the stylesheet declaration for the body's background color is modified via javascript.
...And 26 more matches

HTML Drag and Drop API - Web APIs

Web › API › HTML Drag and Drop API

html drag and drop interfaces enable applications to use drag-and-drop features in browsers.
... html drag and drop interfaces enable applications to use drag-and-drop features in browsers.
... html drag and drop interfaces enable applications to use drag-and-drop features in browsers.
...And 26 more matches

Signaling and video calling - Web APIs

Web › API › WebRTC API › Signaling and video calling

process is its message handling.
...ed.
...deo" autoplay muted></video> <button id="hangup-button" onclick="hangupcall();" disabled> hang up </button> </div> </div> the page structure defined here is using <div> elements, giving us full control over the page layout by enabling the use of css.
...And 26 more matches

Box-shadow generator - CSS: Cascading Style Sheets

Web › CSS › CSS Background and Borders › Box-shadow generator

n"> <div class="button" data-type="add"> </div> <div class="button" data-type="move-up"> </div> <div class="button" data-type="move-down"> </div> </div> <div id="stack_container"></div> </div> <div id="preview_zone"> <div id="layer_menu" class="col span_12"> <div class="button" id="element" data-type="subject" data-title="element"> element </div> <div class="button" id="before" data-type="subject" data-title=":before"> :before <span class="delete" data-type="disable"></span> </div> <div class="button" id="after" data-type="subject" data-title=":after"> :after ...
...ct" data-title=":after"> :after <span class="delete" data-type="disable"></span> </div> <div class="ui-checkbox" data-topic='before' data-label=":before"></div> <div class="ui-checkbox" data-topic='after' data-label=":after"></div> </div> <div id="preview"> <div id="obj-element"> <div class="content"> </div> <div id="obj-before"> </div> <div id="obj-after"> </div> </div> </div> </div> </div> <div id="controls" class="group section"> <div class="wrap-left"> <div class="colorpicker category"> <div class="title"> </div> ...
... data-min="-100" data-max="100" data-step="1" data-value="50"> </div> <div class="ui-slider-btn-set" data-topic="spread" data-type="add"></div> <div class="ui-slider-input" data-topic="spread" data-unit="px"></div> </div> </div> </div> <div id="element_properties" class="category"> <div class="title"> class element properties </div> <div class="group"> <div class="group property"> <div class="ui-slider-name"> border </div> <div class="ui-checkbox" data-topic='border-state' data-state="true"></div> </div> <d...
...And 26 more matches

Visual formatting model - CSS: Cascading Style Sheets

Web › CSS › Visual formatting model

in css the visual formatting model describes how user agents take the document tree, and process and display it for visual media.
...ocument printed by browser print functions.
...to offer a way to scroll to the parts of the document that are not displayed.
...And 26 more matches

HTML: Hypertext Markup Language

Web › HTML

that connect web pages to one another, either within a single website or between websites.
...in the world wide web.
...ntent for display in a web browser.
...And 26 more matches

Creating annotations - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Tutorials › Annotator › Creating annotations

this tutorial relies on the since-removed widget api and no longer works with firefox.
...more complex widget try the toolbar or sidebar apis.
...e toolbar or sidebar apis.
...And 25 more matches

What’s in the head? Metadata in HTML - Learn web development

Learn › HTML › Introduction to HTML › The head metadata in HTML

, the most important items it can contain, and what effect it can have on the html document.
... what effect it can have on the html document.
...mple, the head is quite small: <head> <meta charset="utf-8"> <title>my test page</title> </head> in larger pages however, the head can get quite full.
...And 25 more matches

Drag Operations - Web APIs

Web › API › HTML Drag and Drop API › Drag operations

se the datatransfer interface.
...ee this in effect, select an area of a webpage, and then click and hold the mouse and drag the selection.
...n click and hold the mouse and drag the selection.
...And 25 more matches

Capabilities, constraints, and settings - Web APIs

Web › API › Media Streams API › Constraints

have constrainable properties.
... 1179084, for example.
...anything it considers a close match.
...And 25 more matches

Node.insertBefore() - Web APIs

Web › API › Node › insertBefore

end of parentnode's child nodes.
...odes.
...ling to provide it or passing invalid values may behave differently in different browser versions.
...And 25 more matches

Keyboard - Accessibility

Web › Accessibility › Understanding WCAG › Keyboard

to be fully accessible, a web page must be operable by someone using only a keyboard to access and control it.
...web page must be operable by someone using only a keyboard to access and control it.
...who simply prefer to use a keyboard for input whenever possible.
...And 25 more matches

<transform-function> - CSS: Cascading Style Sheets

Web › CSS › transform-function

the <transform-function> css data type represents a transformation that affects an element's appearance.
... the <transform-function> css data type represents a transformation that affects an element's appearance.
...using one of the transformation functions listed below.
...And 25 more matches

<label> - HTML: Hypertext Markup Language

Web › HTML › Element › label

the html <label> element represents a caption for an item in a user interface.
... the html <label> element represents a caption for an item in a user interface.
...the user is focused on the form input, making it easier for an assistive technology user to understand what data should be entered.
...And 25 more matches

StringView - Archive of obsolete content

Archive › Add-ons › Code snippets › StringView library

rs, nidx) { /* utf-16 to domstring decoding algorithm */ var nfrstchr = achars[nidx]; return nfrstchr > 0xd7bf /* 55231 */ && nidx + 1 < achars.length ?
...var nfrstchr = achars[nidx]; return nfrstchr > 0xd7bf /* 55231 */ && nidx + 1 < achars.length ?
...g.
...And 24 more matches

Adding Events and Commands - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › Adding Events and Commands

« previousnext » event handlers just like with html, most javascript code execution is triggered by event handlers attached to dom elements.
...is to place the handler in the xul code: <overlay id="xulschoolhello-browser-overlay" onload="xulschoolchrome.browseroverlay.init();" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> we prefer the first method because it keeps a better separation of content and behavior.
...t();" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> we prefer the first method because it keeps a better separation of content and behavior.
...And 24 more matches

Stacks and Decks - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Stacks and Decks

« previousnext » there may be need to display elements as a set of overlapping cards.
... « previousnext » there may be need to display elements as a set of overlapping cards.
... « previousnext » there may be need to display elements as a set of overlapping cards.
...And 24 more matches

Using Spacers - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Using Spacers

« previousnext » in this section, we will find out how to add some spacing in between the elements we have created.
...ay require more room than another.
...ows laid out with lots of space to allow for this.
...And 24 more matches

description - Archive of obsolete content

Archive › Mozilla › XUL › description

« xul reference home [ examples | attributes | properties | methods | related ] this element is used to create a block of text.
...layed <description> this is a long section of text that will word wrap when displayed.
...tion of text that will not word wrap"> </description> this is a long section of dynamically controlled text that will word wrap <description id="desc" style="width: 300px"></description> document.getelementbyid('desc').textcontent = "this is a long section of dynamic message text that will word wrap"; attributes crop type: one of the values below if the label of the element is too big to fit in its given space, the text will be cropped on the side specified by the crop attribute.
...And 24 more matches

CSS and JavaScript accessibility best practices - Learn web development

Learn › Accessibility › CSS and JavaScript

ml, but they are still able to help or damage accessibility, depending on how they are used.
...e that your use of css and javascript doesn't ruin the accessibility of your documents.
...look like anything, but this doesn't mean that you should.
...And 24 more matches

Normal Flow - Learn web development

Learn › CSS › CSS layout › Normal Flow

previous overview: css layout next this article explains normal flow, or the way that webpage elements lay themselves out if you have not changed their layout.
...l flow, or the way that webpage elements lay themselves out if you have not changed their layout.
...on to html), and an idea of how css works (study introduction to css.) objective: to explain how browsers layout web pages by default, before we begin to make changes.
...And 24 more matches

Setting up your own test automation environment - Learn web development

Learn › Tools and testing › Cross browser testing › Your own automation environment

tests with it, and how to integrate it with tools like lambdatest, sauce labs, and browserstack.
...ick test to make sure everything is working.
...called google_test.js: give it the following contents, then save it: const webdriver = require('selenium-webdriver'), by = webdriver.by, until = webdriver.until; const driver = new webdriver.builder() .forbrowser('firefox') .build(); driver.get('http://www.google.com'); driver.findelement(by.name('q')).sendkeys('webdriver'); driver.sleep(1000).then(function() { driver.findelement(by.name('q')).sendkeys(webdriver.key.tab); }); driver.findelement(by.name('btnk')).click(); driver.sleep(2000).then(function() { driver.gettitle().then(function(title) { if(title === 'webdriver - google search') { console.log('test passed'); } else { console.log('test failed'); } driver.quit(); }); }); in terminal, make sure you are inside your project folde...
...And 24 more matches

Mozilla’s UAAG evaluation report

Mozilla › Accessibility › UAAG evaluation report

ion.
... of graphic image formats.
...fications for html and css rendering.
...And 24 more matches

Taking still photos with WebRTC - Web APIs

Web › API › WebRTC API › Taking still photos

y this sample then read on to learn how it works.
...two components: a <video> element, which will receive the stream from webrtc, and a <button> the user clicks to capture a video frame.
... it ties together when we get into the javascript code.
...And 24 more matches

ARIA: row role - Accessibility

Web › Accessibility › ARIA › Roles › Row Role

an element with role="row" is a row of cells within a tabular structure.
...span> <span role="columnheader"aria-sort="none">population</span> </div> </div> <div role="rowgroup"> <div role="row"> <span role="cell">finland</span> <span role="cell">5.5 million</span> </div> <div role="row"> <span role="cell">france</span> <span role="cell">67 million</span> </div> </div> </div> description the element role="row" is a row within a grid, table or treegrid, and optionally within a rowgroup, that is a container for one or more cells, gridcells, columnheaders, or rowheaders within a static tabular structure.
... </div> <div role="row"> <span role="cell">france</span> <span role="cell">67 million</span> </div> </div> </div> description the element role="row" is a row within a grid, table or treegrid, and optionally within a rowgroup, that is a container for one or more cells, gridcells, columnheaders, or rowheaders within a static tabular structure.
...And 24 more matches

SVG Presentation Attributes - SVG: Scalable Vector Graphics

Web › SVG › Attribute › Presentation

svg presentation attributes are css properties that can be used as attributes on svg elements.
... alignment-baseline it specifies how an object is aligned along the font baseline with respect to its parent.
...ore-edge|text-before-edge|middle|central|after-edge|text-after-edge|ideographic|alphabetic|hanging|mathematical|inherit; animatable: yes baseline-shift it allows repositioning of the dominant-baseline relative to the dominant-baseline of the parent text content element.
...And 24 more matches

Panels - Archive of obsolete content

Archive › Mozilla › XUL › PopupGuide › Panels

a panel is a popup which can support any type of content.
... a panel is a popup which can support any type of content.
... a panel is a popup which can support any type of content.
...And 23 more matches

Tabboxes - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Tabboxes

es to appear.
...low.
...l tabs.
...And 23 more matches

scale - Archive of obsolete content

Archive › Mozilla › XUL › scale

min, movetoclick, pageincrement, tabindex, value properties disabled, max, min, increment, pageincrement, tabindex, value, methods decrease, decreasepage, increase, increasepage, examples horizontal scale: <scale min="1" max="10"/> vertical scale: <scale min="1" max="10" orient="vertical"/> attributes dir type: one of the values below the direction in which the child elements of the element are placed.
... examples horizontal scale: <scale min="1" max="10"/> vertical scale: <scale min="1" max="10" orient="vertical"/> attributes dir type: one of the values below the direction in which the child elements of the element are placed.
...izontal scale: <scale min="1" max="10"/> vertical scale: <scale min="1" max="10" orient="vertical"/> attributes dir type: one of the values below the direction in which the child elements of the element are placed.
...And 23 more matches

tooltip - Archive of obsolete content

Archive › Mozilla › XUL › tooltip

Debugging CSS - Learn web development

Learn › CSS › Building blocks › Debugging CSS

previous overview: building blocks next sometimes when writing css you will encounter an issue where your css doesn't seem to be doing what you expect.
...owsers.
... devtools is the difference between what you see when you view the source of a webpage, or look at the html file you put on the server, and what you can see in the html pane of the devtools.
...And 23 more matches

Video and audio content - Learn web development

Learn › HTML › Multimedia and embedding › Video and audio content

previous overview: multimedia and embedding next now that we are comfortable with adding simple images to a webpage, the next step is to start adding video and audio players to your html documents!
...er, silverlight) became popular for handling such content.
...ch companies offer a convenient, easy way to host and consume videos, so you don't have to worry about the enormous bandwidth consumption.
...And 23 more matches

JS::CompileOptions

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS::CompileOptions

d passed back in jserrorreports.
... const char *filename() const returns filename of the source code.
... const char *introducerfilename() const returns filename of the file which introduces the file.
...And 23 more matches

nsIXULTemplateBuilder

Mozilla › Tech › XPCOM › Reference › Interface › nsIXULTemplateBuilder

the nsitemplatebuilder interface controls the display of elements using a xul template element and is automatically attached to an element containing a datasources attribute.
...s an example, for an xml data source the initial reference point would be a specific node in the dom tree and a template might generate a list of all child nodes.
...queryset> <query></query> <rule> <conditions>...</conditions> <bindings>...</bindings> <action>...</action> </rule> </queryset> </template> </rootnode> the datasources attribute on the root node is used to identify the source of data to be used.
...And 23 more matches

Guide to the Fullscreen API - Web APIs

Web › API › Fullscreen API › Guide

this article demonstrates how to use the fullscreen api to place a given element into full-screen mode, as well as how to detect when the browser enters or exits full-screen mode.
... this article demonstrates how to use the fullscreen api to place a given element into full-screen mode, as well as how to detect when the browser enters or exits full-screen mode.
...how to use the fullscreen api to place a given element into full-screen mode, as well as how to detect when the browser enters or exits full-screen mode.
...And 23 more matches

Introduction to formatting contexts - CSS: Cascading Style Sheets

Web › CSS › CSS Flow Layout › Intro to formatting contexts

f which there are several types, including block formatting contexts, inline formatting contexts, and flex formatting contexts.
...rt of a formatting context, or an area which has been defined to lay out content in a particular way.
...) will lay child elements out according to block layout rules, a flex formatting context will lay its children out as flex items, etc.
...And 23 more matches

Video player styling basics - Developer guides

Web › Guide › Audio and video delivery › Video player styling basics

mple on github, and view it live.
...iminary modifications from the original example this section summarises the modifications that were made to the original video player example to make the styling task easier, before the bulk of the work was started.
...ayer style used here is rather basic — this is intentional, as the purpose is to show how such a video player could be styled and be made responsive.
...And 23 more matches

Block formatting context - Developer guides

Web › Guide › CSS › Block formatting context

a block formatting context is a part of a visual css rendering of a web page.
... a block formatting context is a part of a visual css rendering of a web page.
... a block formatting context is a part of a visual css rendering of a web page.
...And 23 more matches

itemprop - HTML: Hypertext Markup Language

Web › HTML › Global attributes › itemprop

the itemprop global attribute is used to add properties to an item.
... the itemprop global attribute is used to add properties to an item.
...and an itemprop consists of a name-value pair.
...And 23 more matches

Commands - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Commands

« previousnext » a command is an operation which may be invoked.
... « previousnext » a command is an operation which may be invoked.
...ts implementation.
...And 22 more matches

List Controls - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › List Controls

« previousnext » xul has a number of types of elements for creating list boxes.
... « previousnext » xul has a number of types of elements for creating list boxes.
... « previousnext » xul has a number of types of elements for creating list boxes.
...And 22 more matches

Splitters - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Splitters

...
...dd splitters to a window.
...where you can change the size of the sidebar panel by dragging the bar in-between the two frames.
...And 22 more matches

menupopup - Archive of obsolete content

Archive › Mozilla › XUL › menupopup

to display the contents of a popup menu.
...en a menupopup is open, it floats above the window and may extend outside the window border.
...ral ways in which a menupopup may be used: it may be placed inside a menu, menulist, toolbarbutton, or a button with the type attribute set to "menu" to create a popup that will open when the menu or button is pressed.
...And 22 more matches

Accessing XML children - Archive of obsolete content

Archive › Web › E4X tutorial › Accessing XML children

recated.
...ill be disabled by default for content in firefox 16, disabled by default for chrome in firefox 17, and removed in firefox 18.
...fault for chrome in firefox 17, and removed in firefox 18.
...And 22 more matches

Practical positioning examples - Learn web development

Learn › CSS › CSS layout › Practical positioning examples

olor sit amet, consectetur adipiscing elit.
... <li>aliquam ut porttitor urna.</li> <li>nulla facilisi</li> </ol> </article> </div> </section> so here we've got a <section> element with a class of info-box, which contains a <ul> and a <div>.
...re into a page with other content already on it, without fear of interfering with the styles applied to other parts of the page.
...And 22 more matches

Document and website structure - Learn web development

Learn › HTML › Introduction to HTML › Document and website structure

previous overview: introduction to html next in addition to defining individual parts of your page (such as "a paragraph" or "an image"), html also boasts a number of block level elements used to define areas of your website (such as "the header", "the navigation menu", "the main content column").
...e news headlines, etc.
...iding links for quick access to popular content.
...And 22 more matches

Drawing graphics - Learn web development

Learn › JavaScript › Client-side web APIs › Drawing graphics

previous overview: client-side web apis next the browser contains some very powerful graphics programming tools, from the scalable vector graphics (svg) language, to apis for drawing on html <canvas> elements, (see the canvas api and webgl).
...aphics (svg) language, to apis for drawing on html <canvas> elements, (see the canvas api and webgl).
... javascript basics (see first steps, building blocks, javascript objects), the basics of client-side apis objective: to learn the basics of drawing on <canvas> elements using javascript.
...And 22 more matches

XUL Accessibility

Mozilla › Tech › Accessibility › XUL

introduction this article shows how xul control elements are mapped to accessibility api.
... introduction this article shows how xul control elements are mapped to accessibility api.
... introduction this article shows how xul control elements are mapped to accessibility api.
...And 22 more matches

Starting WebLock

Mozilla › Tech › XPCOM › Guide › Creating components › Starting WebLock

attribute nsisimpleenumerator sites; this line defines an attribute in the interface.
... an attribute in the interface.
...nerated.
...And 22 more matches

nsIAccessibleProvider

Mozilla › Tech › XPCOM › Reference › Interface › nsIAccessibleProvider

accessible/public/nsiaccessibleprovider.idlscriptable used to link element and accessible object.
... accessible/public/nsiaccessibleprovider.idlscriptable used to link element and accessible object.
... accessibletype long value representing the type of accessible object.
...And 22 more matches

Node - Web APIs

Web › API › Node

the dom node interface is an abstract base class upon which many other dom api objects are based, thus letting those object types to be used similarly and often interchangeably.
.../div> a:hover text { fill: #0095dd; pointer-events: all;} properties in addition to the properties below, node inherits properties from its parent, eventtarget.
...om.
...And 22 more matches

WAI-ARIA Roles - Accessibility

Web › Accessibility › ARIA › Roles

this page lists reference pages covering all the wai-aria roles discussed on mdn.
...s, states, and properties aria: alert rolethe alert role can be used to tell the user an element has been dynamically updated.
...et on related content items such as comments, forum posts, newspaper articles or other items grouped together on one page.aria: banner rolea banner role represents general and informative content frequently placed at the beginning of the page.
...And 22 more matches

:nth-child() - CSS: Cascading Style Sheets

Web › CSS › :nth-child

the :nth-child() css pseudo-class matches elements based on their position in a group of siblings.
... the :nth-child() css pseudo-class matches elements based on their position in a group of siblings.
... the :nth-child() css pseudo-class matches elements based on their position in a group of siblings.
...And 22 more matches

Color picker tool - CSS: Cascading Style Sheets

Web › CSS › CSS Colors › Color picker tool

0; top: -10000px; left: 0; color: #777; float: left; transition: opacity 1s; } #zindex input { border: 1px solid #ddd; font-size: 16px; color: #777; } #zindex .ui-input-slider-info { width: 60px; } #zindex[data-active='true'] { top: 0; opacity: 1; } javascript content 'use strict'; var uicolorpicker = (function uicolorpicker() { function getelembyid(id) { return document.getelementbyid(id); } var subscribers = []; var pickers = []; /** * rgba color class * * hsv/hsb and hsl (hue, saturation, value / brightness, lightness) * @param hue 0-360 * @param saturation 0-100 * @param value 0-100 * @param lightness 0-100 */ function color(color) { if(color instanceof color === true) { this.copy(color); return; } this.r = 0; this.g = 0; t...
..., this.inputchangehexa.bind(this)); this.setcolor(this.color); pickers[topic] = this; } /*************************************************************************/ // function for generating the color-picker /*************************************************************************/ colorpicker.prototype.createpickingarea = function createpickingarea() { var area = document.createelement('div'); var picker = document.createelement('div'); area.classname = 'picking-area'; picker.classname = 'picker'; this.picking_area = area; this.color_picker = picker; setmousetracking(area, this.updatecolor.bind(this)); area.appendchild(picker); this.node.appendchild(area); }; colorpicker.prototype.createhuearea = function createhuearea() { var area = document.createeleme...
...ement('div'); area.classname = 'picking-area'; picker.classname = 'picker'; this.picking_area = area; this.color_picker = picker; setmousetracking(area, this.updatecolor.bind(this)); area.appendchild(picker); this.node.appendchild(area); }; colorpicker.prototype.createhuearea = function createhuearea() { var area = document.createelement('div'); var picker = document.createelement('div'); area.classname = 'hue'; picker.classname ='slider-picker'; this.hue_area = area; this.hue_picker = picker; setmousetracking(area, this.updatehueslider.bind(this)); area.appendchild(picker); this.node.appendchild(area); }; colorpicker.prototype.createalphaarea = function createalphaarea() { var area = document.createelement('div'); var mask = document.createelement(...
...And 22 more matches

Linear-gradient Generator - CSS: Cascading Style Sheets

Web › CSS › Tools › Linear-gradient Generator

5%; color: #777; position: relative; float: left; } #output .property { height: 100%; width: 12%; position: absolute; left: 0; } #output .value { width: 88%; position: absolute; white-space: pre; word-wrap: break-word; display: block; right: 0; } javascript content var uicolorpicker = (function uicolorpicker() { 'use strict'; function getelembyid(id) { return document.getelementbyid(id); } var subscribers = []; var pickers = []; /** * rgba color class * * hsv/hsb and hsl (hue, saturation, value / brightness, lightness) * @param hue 0-360 * @param saturation 0-100 * @param value 0-100 * @param lightness 0-100 */ function color(color) { if(color instanceof color === true) { this.copy(color); return; } this.r = 0; this.g = 0; t...
..., this.inputchangehexa.bind(this)); this.setcolor(this.color); pickers[topic] = this; } /*************************************************************************/ // function for generating the color-picker /*************************************************************************/ colorpicker.prototype.createpickingarea = function createpickingarea() { var area = document.createelement('div'); var picker = document.createelement('div'); area.classname = 'picking-area'; picker.classname = 'picker'; this.picking_area = area; this.color_picker = picker; setmousetracking(area, this.updatecolor.bind(this)); area.appendchild(picker); this.node.appendchild(area); }; colorpicker.prototype.createhuearea = function createhuearea() { var area = document.createeleme...
...ement('div'); area.classname = 'picking-area'; picker.classname = 'picker'; this.picking_area = area; this.color_picker = picker; setmousetracking(area, this.updatecolor.bind(this)); area.appendchild(picker); this.node.appendchild(area); }; colorpicker.prototype.createhuearea = function createhuearea() { var area = document.createelement('div'); var picker = document.createelement('div'); area.classname = 'hue'; picker.classname ='slider-picker'; this.hue_area = area; this.hue_picker = picker; setmousetracking(area, this.updatehueslider.bind(this)); area.appendchild(picker); this.node.appendchild(area); }; colorpicker.prototype.createalphaarea = function createalphaarea() { var mask = document.createelement('div'); var picker = document.createelemen...
...And 22 more matches

<input type="datetime-local"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › datetime-local

<input> elements of type datetime-local create input controls that let the user easily enter both a date and a time, including the year, month, and day as well as the time in hours and minutes.
... this correctly.
...e above value submitted to the server, for example, it will look like partydate=2017-06-01t08:30.
...And 22 more matches

Array.prototype.splice() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › splice

the splice() method changes the contents of an array by removing or replacing existing elements and/or adding new elements in place.
...contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...active-examples and send us a pull request.
...And 22 more matches

TypedArray - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray

a typedarray object describes an array-like view of an underlying binary data buffer.
...of an underlying binary data buffer.
...ve a common syntax for their constructors: new typedarray(); new typedarray(length); new typedarray(typedarray); new typedarray(object); new typedarray(buffer [, byteoffset [, length]]); where typedarray is a constructor for one of the concrete types.
...And 22 more matches

Inner-browsing extending the browser navigation paradigm - Archive of obsolete content

Archive › Inner-browsing extending the browser navigation paradigm

he separate messages and message lists in an integrated way, much like a client mail app; and a stock ticker that spools the information across the web page.
...ent mail app; and a stock ticker that spools the information across the web page.
...proach, the main steps to the iframe-based implementation can be represented as follows: create a hidden iframe in the page; when a new content is required, ask for the content to the iframe; the iframe will load the content and callback a function in the main page; update the main page.
...And 21 more matches

DOM Interfaces - Archive of obsolete content

Archive › Mozilla › XBL › XBL 1.0 Reference › DOM Interfaces

the nsidomdocumentxbl interface the nsidomdocumentxbl interface contains methods for manipulating xbl bindings.
... the nsidomdocumentxbl interface the nsidomdocumentxbl interface contains methods for manipulating xbl bindings.
... the nsidomdocumentxbl interface the nsidomdocumentxbl interface contains methods for manipulating xbl bindings.
...And 21 more matches

Tooltips - Archive of obsolete content

Archive › Mozilla › XUL › PopupGuide › Tooltips

roviding additional details about a user interface without cluttering up the main interface.
...the tooltiptext attribute may be used, which is valid for all xul elements.
...l xul elements.
...And 21 more matches

Styling a Tree - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Styling a Tree

« previousnext » the following describes how to style a tree.
... « previousnext » the following describes how to style a tree.
... « previousnext » the following describes how to style a tree.
...And 21 more matches

Trees and Templates - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Trees and Templates

« previousnext » the following describes how to use a template with a tree.
... « previousnext » the following describes how to use a template with a tree.
...ot node to display.
...And 21 more matches

XUL Questions and Answers - Archive of obsolete content

Archive › Mozilla › XUL › XUL Questions and Answers

loading remote dtds for xml documents is currenty not supported in xul.
...x highlighting?
...atches one of these common usages, use the icon attribute to indicate this.
...And 21 more matches

splitter - Archive of obsolete content

Archive › Mozilla › XUL › splitter

Combinators - Learn web development

Learn › CSS › Building blocks › Selectors › Combinators

ware installed, basic knowledge of working with files, html basics (study introduction to html), and an idea of how css works (study css first steps.) objective: to learn about the different combinator selectors that can be used in css.
...s first steps.) objective: to learn about the different combinator selectors that can be used in css.
...presented by a single space ( ) character — combines two selectors such that elements matched by the second selector are selected if they have an ancestor (parent, parent's parent, parent's parent's parent, etc) element matching the first selector.
...And 21 more matches

CSS property compatibility table for form controls - Learn web development

Learn › Forms › Property compatibility table for form controls

is property to search fields.
....
....
...And 21 more matches

Styling web forms - Learn web development

Learn › Forms › Styling web forms

some form widgets, it is still difficult to rebuild controls to make them stylable, but we can now use css to style many form features, though we do need to take extra care to ensure we don't break usability.
...n now use css to style many form features, though we do need to take extra care to ensure we don't break usability.
... these problems can be divided into three categories: the good some elements can be styled with few if any problems across platforms.
...And 21 more matches

HTML table advanced features and accessibility - Learn web development

Learn › HTML › Tables › Advanced

ooter sections — as well as looking at the accessibility of tables for visually impaired users.
... accessibility of tables for visually impaired users.
... useful to them as they scan the page, but particularly for blind users.
...And 21 more matches

Build your own function - Learn web development

Learn › JavaScript › Building blocks › Build your own function

ules as variable naming conventions.
......
... this is followed by the name we want to give to our function, a set of parentheses, and a set of curly braces.
...And 21 more matches

ARIA annotations - Accessibility

Web › Accessibility › ARIA › Annotations

low we'll introduce the new features associated with aria annotations, and have a look at some code examples that show them in action.
...ion.
...es providing these new abilities are as follows: aria-description="" — provides a detailed description of an html element, as opposed to the brief label provided by aria-label.
...And 21 more matches

Using CSS animations - CSS: Cascading Style Sheets

Web › CSS › CSS Animations › Using CSS animations

rendering engine can use frame-skipping and other techniques to keep the performance as smooth as possible.
...e name of the @keyframes at-rule describing the animation’s keyframes.
...by the animation before and after it is executing.
...And 21 more matches

CSS reference - CSS: Cascading Style Sheets

Web › CSS › Reference

use this css reference to browse an alphabetical index of all of the standard css properties, pseudo-classes, pseudo-elements, data types, and at-rules.
...l of the standard css properties, pseudo-classes, pseudo-elements, data types, and at-rules.
... organized by type.
...And 21 more matches

<display-internal> - CSS: Cascading Style Sheets

Web › CSS › display-internal

some layout models such as table and ruby have a complex internal structure, with several different roles that their children and descendants can fill.
... some layout models such as table and ruby have a complex internal structure, with several different roles that their children and descendants can fill.
...me layout models such as table and ruby have a complex internal structure, with several different roles that their children and descendants can fill.
...And 21 more matches

Creating a Microsummary - Archive of obsolete content

Archive › Mozilla › Creating a microsummary

warning: microsummary support was removed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) a microsummary generator is a set of instructions for creating a microsummary from the content of a page.
... warning: microsummary support was removed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) a microsummary generator is a set of instructions for creating a microsummary from the content of a page.
...ch is to create the microsummaries on the server-side using the same tools and languages you already use to generate pages.
...And 20 more matches

OpenClose - Archive of obsolete content

Archive › Mozilla › XUL › PopupGuide › OpenClose

opening and closing popups popups and menus may be opened and closed by a script.
...and closing popups popups and menus may be opened and closed by a script.
...ty which may be set to true to open the menu, or false to close the menu.
...And 20 more matches

Adding Style Sheets - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Adding Style Sheets

« previousnext » we have hardly modified the look of the elements we have created so far.
... « previousnext » we have hardly modified the look of the elements we have created so far.
... « previousnext » we have hardly modified the look of the elements we have created so far.
...And 20 more matches

Box Model Details - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Box Model Details

« previousnext » we've seen a lot of features of the box model.
... « previousnext » we've seen a lot of features of the box model.
... applied to any element.
...And 20 more matches

arrowscrollbox - Archive of obsolete content

Archive › Mozilla › XUL › arrowscrollbox

« xul reference home [ examples | attributes | properties | methods | related ] a box which provides scroll arrows along its edges for scrolling through the contents of the box.
... hover the mouse over the arrows to scroll the box.
...rient="vertical" flex="1"> <button label="red"/> <button label="blue"/> <button label="green"/> <button label="yellow"/> <button label="orange"/> <button label="silver"/> <button label="lavender"/> <button label="gold"/> <button label="turquoise"/> <button label="peach"/> <button label="maroon"/> <button label="black"/> </arrowscrollbox> attributes inherited from xul element align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, remove...
...And 20 more matches

tabbox - Archive of obsolete content

Archive › Mozilla › XUL › tabbox

XForms Switch Module - Archive of obsolete content

Archive › Web › XForms › User Interface Elements › Switch

introduction xforms switch module define a switch construct that allows the creation of user interfaces where the user interface can be varied based on user actions and events.
... introduction xforms switch module define a switch construct that allows the creation of user interfaces where the user interface can be varied based on user actions and events.
... introduction xforms switch module define a switch construct that allows the creation of user interfaces where the user interface can be varied based on user actions and events.
...And 20 more matches

CSS values and units - Learn web development

Learn › CSS › Building blocks › Values and units

ues referred to as data types.
...or -1.2.
...on> is a <number> with a unit attached to it, for example 45deg, 5s, or 10px.
...And 20 more matches

HTML Cheatsheet - Learn web development

Learn › HTML › Cheatsheet

ck hints as we go.
... go.
...et, to give you some quick accurate ready to use code snippets for common usages.
...And 20 more matches

Debugging HTML - Learn web development

Learn › HTML › Introduction to HTML › Debugging HTML

debugging doesn't have to be scary though — the key to being comfortable with writing and debugging any programming language or code is familiarity with both the language and the tools.
...th some built-in errors for us to explore (the html markup is said to be badly-formed, as opposed to well-formed).
... errors for us to explore (the html markup is said to be badly-formed, as opposed to well-formed).
...And 20 more matches

nsISupportsArray

Mozilla › Tech › XPCOM › Reference › Interface › nsISupportsArray

xpcom/ds/nsisupportsarray.idlscriptable please add a summary to this article.
... xpcom/ds/nsisupportsarray.idlscriptable please add a summary to this article.
... xpcom/ds/nsisupportsarray.idlscriptable please add a summary to this article.
...And 20 more matches

ParentNode - Web APIs

Web › API › ParentNode

the parentnode mixin contains methods and properties that are common to all types of node objects that can have children.
... the parentnode mixin contains methods and properties that are common to all types of node objects that can have children.
... the parentnode mixin contains methods and properties that are common to all types of node objects that can have children.
...And 20 more matches

Window.getComputedStyle() - Web APIs

Web › API › Window › getComputedStyle

the window.getcomputedstyle() method returns an object containing the values of all css properties of an element, after applying active stylesheets and resolving any basic computation those values may contain.
... the window.getcomputedstyle() method returns an object containing the values of all css properties of an element, after applying active stylesheets and resolving any basic computation those values may contain.
... window.getcomputedstyle() method returns an object containing the values of all css properties of an element, after applying active stylesheets and resolving any basic computation those values may contain.
...And 20 more matches

Specificity - CSS: Cascading Style Sheets

Web › CSS › Specificity

specificity is the means by which browsers decide which css property values are the most relevant to an element and, therefore, will be applied.
...e, will be applied.
...matching rules which are composed of different sorts of css selectors.
...And 20 more matches

left - CSS: Cascading Style Sheets

Web › CSS › left

the left css property participates in specifying the horizontal position of a positioned element.
... the left css property participates in specifying the horizontal position of a positioned element.
...ttps://github.com/mdn/interactive-examples and send us a pull request.
...And 20 more matches

right - CSS: Cascading Style Sheets

Web › CSS › right

the right css property participates in specifying the horizontal position of a positioned element.
... the right css property participates in specifying the horizontal position of a positioned element.
...github.com/mdn/interactive-examples and send us a pull request.
...And 20 more matches

vertical-align - CSS: Cascading Style Sheets

Web › CSS › vertical-align

ss property sets vertical alignment of an inline, inline-block or table-cell box.
...ething even more bizarre and inexplicable.</p> <p>there is another theory which states that this has already happened.</p> </td> </tr> </table> table { margin-left: auto; margin-right: auto; width: 80%; } table, th, td { border: 1px solid black; } td { padding: 0.5em; font-family: monospace; } note that vertical-align only applies to inline, inline-block and table-cell elements: you can't use it to vertically align block-level elements.
...tical-align: text-bottom; vertical-align: middle; vertical-align: top; vertical-align: bottom; /* <length> values */ vertical-align: 10em; vertical-align: 4px; /* <percentage> values */ vertical-align: 20%; /* global values */ vertical-align: inherit; vertical-align: initial; vertical-align: unset; the vertical-align property is specified as one of the values listed below.
...And 20 more matches

BigInt64Array - JavaScript

Web › JavaScript › Reference › Global Objects › BigInt64Array

the bigint64array typed array represents an array of 64-bit signed integers in the platform byte order.
...n the platform byte order.
...ver byte order is needed, use dataview instead.
...And 20 more matches

BigUint64Array - JavaScript

Web › JavaScript › Reference › Global Objects › BigUint64Array

the biguint64array typed array represents an array of 64-bit unsigned integers in the platform byte order.
...he platform byte order.
... byte order is needed, use dataview instead.
...And 20 more matches

Float32Array - JavaScript

Web › JavaScript › Reference › Global Objects › Float32Array

the float32array typed array represents an array of 32-bit floating point numbers (corresponding to the c float data type) in the platform byte order.
...type) in the platform byte order.
...ntrol over byte order is needed, use dataview instead.
...And 20 more matches

Float64Array - JavaScript

Web › JavaScript › Reference › Global Objects › Float64Array

the float64array typed array represents an array of 64-bit floating point numbers (corresponding to the c double data type) in the platform byte order.
...type) in the platform byte order.
...ntrol over byte order is needed, use dataview instead.
...And 20 more matches

Int16Array - JavaScript

Web › JavaScript › Reference › Global Objects › Int16Array

the int16array typed array represents an array of twos-complement 16-bit signed integers in the platform byte order.
...ed integers in the platform byte order.
... if control over byte order is needed, use dataview instead.
...And 20 more matches

Int32Array - JavaScript

Web › JavaScript › Reference › Global Objects › Int32Array

the int32array typed array represents an array of twos-complement 32-bit signed integers in the platform byte order.
...ed integers in the platform byte order.
... if control over byte order is needed, use dataview instead.
...And 20 more matches

Int8Array - JavaScript

Web › JavaScript › Reference › Global Objects › Int8Array

the int8array typed array represents an array of twos-complement 8-bit signed integers.
... the int8array typed array represents an array of twos-complement 8-bit signed integers.
...y represents an array of twos-complement 8-bit signed integers.
...And 20 more matches

Uint16Array - JavaScript

Web › JavaScript › Reference › Global Objects › Uint16Array

the uint16array typed array represents an array of 16-bit unsigned integers in the platform byte order.
...integers in the platform byte order.
... control over byte order is needed, use dataview instead.
...And 20 more matches

Uint32Array - JavaScript

Web › JavaScript › Reference › Global Objects › Uint32Array

the uint32array typed array represents an array of 32-bit unsigned integers in the platform byte order.
...integers in the platform byte order.
... control over byte order is needed, use dataview instead.
...And 20 more matches

Uint8Array - JavaScript

Web › JavaScript › Reference › Global Objects › Uint8Array

the uint8array typed array represents an array of 8-bit unsigned integers.
... the uint8array typed array represents an array of 8-bit unsigned integers.
... typed array represents an array of 8-bit unsigned integers.
...And 20 more matches

Uint8ClampedArray - JavaScript

Web › JavaScript › Reference › Global Objects › Uint8ClampedArray

the uint8clampedarray typed array represents an array of 8-bit unsigned integers clamped to 0-255; if you specified a value that is out of the range of [0,255], 0 or 255 will be set instead; if you specify a non-integer, the nearest integer will be set.
...be set instead; if you specify a non-integer, the nearest integer will be set.
...teger, the nearest integer will be set.
...And 20 more matches

HTML to DOM - Archive of obsolete content

Archive › Add-ons › Code snippets › HTML to DOM

to get the html of a remote webpage, it is often advantageous to turn that html string into dom for easier manipulation.
...otential dangers involved in injecting remote content in a privileged context in your extension, so it can be desirable to parse the html safely.
...rn a dom object which can be manipulated like web page elements.
...And 19 more matches

Introduction to XBL - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Introduction to XBL

« previousnext » xul has a sister language, xbl (extensible bindings language).
... « previousnext » xul has a sister language, xbl (extensible bindings language).
...used for declaring the behavior of xul widgets.
...And 19 more matches

Simple Menu Bars - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Simple Menu Bars

« previousnext » in this section, we'll see how to create a menu bar with menus on it.
...lements which allow you to create menu bars or popup menus.
...nus can be customized quite easily.
...And 19 more matches

Building up a basic demo with A-Frame - Game development

Games › Techniques › 3D on the web › Building up a basic demo with A-Frame

html document — inside your project directory, create a new index.html file, and save the follow html inside it: <!doctype html> <html> <head> <meta charset="utf-8"> <title>mdn games: a-frame demo</title> <script src="aframe.min.js"></script> </head> <body>  </body> </html> this contains some basic information like the document charset and <title>.
...tml inside it: <!doctype html> <html> <head> <meta charset="utf-8"> <title>mdn games: a-frame demo</title> <script src="aframe.min.js"></script> </head> <body>  </body> </html> this contains some basic information like the document charset and <title>.
...title>.
...And 19 more matches

Legacy layout methods - Learn web development

Learn › CSS › CSS layout › Legacy Layout Methods

quis ante semper consectetur eget aliquam lorem.
...rgin: 0 auto; } the body will be 90% of the viewport wide until it gets to 900px wide, in which case it will stay fixed at this width and center itself in the viewport.
... class="row"> <div class="col span1">13</div> <div class="col span6">14</div> <div class="col span3">15</div> <div class="col span2">16</div> </div> </div> the aim is to turn this into a demonstration grid of two rows on a twelve column grid — the top row demonstrating the size of the individual columns, the second row some different sized areas on the grid.
...And 19 more matches

Mozilla Web Developer FAQ

Mozilla › Mozilla Web Developer FAQ

why are there gaps between image rows in tables when the layout engine is in the standards mode?
...e marked with <td class="imgcell">, the required css rule is: .imgcell img, .imgcell a { display: block; } longer explanation… why are there still gaps even between text rows in tables when the layout engine is in the standards mode or in the almost standards mode?
...paragraph.
...And 19 more matches

Building the WebLock UI

Mozilla › Tech › XPCOM › Guide › Creating components › Building the WebLock UI

method expects is a string, so we can pass a string directly in from the user interface, or we can do a check on the string and verify that it's a valid url.
...we'll assume the strings we get from the ui itself are urls we actually want to write to the white list: function addthissite() { var tf = document.getelementbyid("dialog.input"); // weblock is global and declared above weblock.addsite(tf.value); } this javascript function can be called directly from the xul widget, where the input string is retrieved as the value property of the textbox element.
...es the opendialog method from the window object and takes the url to the xul file in which the dialog is defined: function loadweblock() { window.opendialog("chrome://weblock/weblock.xul"); } xul the entire user interface of the mozilla browser and all of the applications that go with it, including the mail client, the irc client, and others, have been defined in an xml language called xul.
...And 19 more matches

Basic usage of canvas - Web APIs

Web › API › Canvas API › Tutorial › Basic usage

« previousnext » let's start this tutorial by looking at the <canvas> html element itself.
... « previousnext » let's start this tutorial by looking at the <canvas> html element itself.
... « previousnext » let's start this tutorial by looking at the <canvas> html element itself.
...And 19 more matches

Examples of web and XML development using the DOM - Web APIs

Web › API › Document Object Model › Examples

es use common apis, tricks, and patterns in javascript for manipulating the document object.
...pt for manipulating the document object.
... height and width the following example shows the use of the height and width properties alongside images of varying dimensions: <!doctype html> <html lang="en"> <head> <title>width/height example</title> <script> function init() { var arrimages = new array(3); arrimages[0] = document.getelementbyid("image1"); arrimages[1] = document.getelementbyid("image2"); arrimages[2] = document.getelementbyid("image3"); var objoutput = document.getelementbyid("output"); var strhtml = "<ul>"; for (var i = 0; i < arrimages.length; i++) { strhtml += "<li>image" + (i+1) + ": height=" + arrimages[i].height + ", width=" + arrimages[i].width + ", style.height=" + arrimages[i].style.height + ", style.width=" + arrimages[i].style.width + ...
...And 19 more matches

ARIA: gridcell role - Accessibility

Web › Accessibility › ARIA › Roles › Gridcell role

the gridcell role is used to make a cell in a grid or treegrid.
... the gridcell role is used to make a cell in a grid or treegrid.
... the gridcell role is used to make a cell in a grid or treegrid.
...And 19 more matches

ARIA: rowgroup role - Accessibility

Web › Accessibility › ARIA › Roles › Rowgroup Role

an element with role="rowgroup" is a group of rows within a tabular structure.
..."none">population</span> </div> </div> <div role="rowgroup"> <div role="row"> <span role="cell">finland</span> <span role="cell">5.5 million</span> </div> <div role="row"> <span role="cell">france</span> <span role="cell">67 million</span> </div> </div> </div> description rowgroup establishes a relationship between owned row elements and is a structural equivalent to the thead, tfoot and tbody elements in html.
...llion</span> </div> <div role="row"> <span role="cell">france</span> <span role="cell">67 million</span> </div> </div> </div> description rowgroup establishes a relationship between owned row elements and is a structural equivalent to the thead, tfoot and tbody elements in html.
...And 19 more matches

ARIA: table role - Accessibility

Web › Accessibility › ARIA › Roles › Table Role

the table value of the aria role attribute identifies the element containing the role as having a non-interactive table structure containing data arranged in rows and columns, similar to the native <table> html element.
... the table value of the aria role attribute identifies the element containing the role as having a non-interactive table structure containing data arranged in rows and columns, similar to the native <table> html element.
... the table value of the aria role attribute identifies the element containing the role as having a non-interactive table structure containing data arranged in rows and columns, similar to the native <table> html element.
...And 19 more matches

Adding captions and subtitles to HTML5 video - Developer guides

Web › Guide › Audio and video delivery › Adding captions and subtitles to HTML5 video

in other articles we looked at how to build a cross browser video player using the htmlmediaelement and window.fullscreen apis, and also at how to style the player.
... in other articles we looked at how to build a cross browser video player using the htmlmediaelement and window.fullscreen apis, and also at how to style the player.
...on the differences if you are not sure what they are.
...And 19 more matches

Cross-browser audio basics - Developer guides

Web › Guide › Audio and video delivery › Cross-browser audio basics

ck for non supporting browsers goes here --> <p>your browser does not support html5 audio, but you can still <a href="audiofile.mp3">download the music</a>.</p> </audio> note: you can also use an mp4 file instead of mp3.
...can use type="audio/mp4".
...ormats.
...And 19 more matches

<input type="time"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › time

<input> elements of type time create input fields designed to let the user easily enter a time (hours and minutes, and optionally seconds).
...the time control is simple, with slots to enter hours and minutes in 12 or 24-hour format depending on operating system locale, and up and down arrows to increment and decrement the currently selected component.
... supported common attributes autocomplete, list, readonly, and step idl attributes value, valueasdate, valueasnumber, and list.
...And 19 more matches

Autoplay guide for media and Web Audio APIs - Web media technologies

Web › Media › Autoplay guide

ld be used carefully and only when needed.
...r specifically requesting that playback begin.
...he user of javascript code to start playback outside the context of handling user input.
...And 19 more matches

display - SVG: Scalable Vector Graphics

Web › SVG › Attribute › display

the display attribute lets you control the rendering of graphical or container elements.
... the display attribute lets you control the rendering of graphical or container elements.
... the display attribute lets you control the rendering of graphical or container elements.
...And 19 more matches

<use> - SVG: Scalable Vector Graphics

Web › SVG › Element › use

the <use> element takes nodes from within the svg document, and duplicates them somewhere else.
...red"/> <!-- stroke="red" will be ignored here, as stroke was already set on mycircle.
...ored here, as stroke was already set on mycircle.
...And 19 more matches

Keyboard Shortcuts - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Keyboard Shortcuts

« previousnext » you could use keyboard event handlers to respond to the keyboard.
...ver.
...g ctrl + c to copy text to the clipboard.
...And 18 more matches

Manipulating Lists - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Manipulating Lists

« previousnext » the xul listbox provides a number of specialized methods.
...nstead when possible.
...ample: example 1 : source view <script> function additem(){ document.getelementbyid('thelist').appenditem("thursday", "thu"); } </script> <listbox id="thelist"/> <button label="add" oncommand="additem();"/> the appenditem() takes two arguments, the label, in this case 'thursday', and a value 'thu'.
...And 18 more matches

Introduction - Archive of obsolete content

Archive › Web › E4X tutorial › Introduction

« previousnext » basic syntax with e4x enabled, basic xml elements are valid syntax for variables.
... « previousnext » basic syntax with e4x enabled, basic xml elements are valid syntax for variables.
... « previousnext » basic syntax with e4x enabled, basic xml elements are valid syntax for variables.
...And 18 more matches

nsIArray

Mozilla › Tech › XPCOM › Reference › Interface › nsIArray

xpcom/ds/nsiarray.idlscriptable this interface implements an array object.
... xpcom/ds/nsiarray.idlscriptable this interface implements an array object.
... xpcom/ds/nsiarray.idlscriptable this interface implements an array object.
...And 18 more matches

EffectTiming.fill - Web APIs

Web › API › EffectTiming › fill

the web animations api's effecttiming dictionary's fill property specifies a fill mode, which defines how the element to which the animation is applied should look when the animation sequence is not actively running, such as before the time specified by iterationstart or after animation's end time.
... the web animations api's effecttiming dictionary's fill property specifies a fill mode, which defines how the element to which the animation is applied should look when the animation sequence is not actively running, such as before the time specified by iterationstart or after animation's end time.
... the animation sequence is not actively running, such as before the time specified by iterationstart or after animation's end time.
...And 18 more matches

Pointer Lock API - Web APIs

Web › API › Pointer Lock API

the pointer lock api (formerly called mouse lock api) provides input methods based on the movement of the mouse over time (i.e., deltas), not just the absolute position of the mouse cursor in the viewport.
... the pointer reaches the edge of the browser or screen.
...ses a specific release gesture.
...And 18 more matches

ValidityState - Web APIs

Web › API › ValidityState

the validitystate interface represents the validity states that an element can be in, with respect to constraint validation.
... the validitystate interface represents the validity states that an element can be in, with respect to constraint validation.
...e interface represents the validity states that an element can be in, with respect to constraint validation.
...And 18 more matches

ARIA: listbox role - Accessibility

Web › Accessibility › ARIA › Roles › listbox role

the listbox role is used for lists from which a user may select one or more items which are static and, unlike html <select> elements, may contain images.
... the listbox role is used for lists from which a user may select one or more items which are static and, unlike html <select> elements, may contain images.
... the listbox role is used for lists from which a user may select one or more items which are static and, unlike html <select> elements, may contain images.
...And 18 more matches

An overview of accessible web applications and widgets - Accessibility

Web › Accessibility › An overview of accessible web applications and widgets

most javascript libraries offer a library of client-side widgets that mimic the behavior of familiar desktop interfaces.
...o describe their widgets in more detail by adding special attributes to the markup.
...ould always prefer using the correct semantic html element over using aria.
...And 18 more matches

:scope - CSS: Cascading Style Sheets

Web › CSS › :scope

the :scope css pseudo-class represents elements that are a reference point for selectors to match against.
... the :scope css pseudo-class represents elements that are a reference point for selectors to match against.
... the :scope css pseudo-class represents elements that are a reference point for selectors to match against.
...And 18 more matches

HTML5 - Developer guides

Web › Guide › HTML › HTML5

html5 is the latest evolution of the standard that defines html.
...fects: allowing a much more diverse range of presentation options.
...and better usage of computer hardware.
...And 18 more matches

Array.prototype.every() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › every

the every() method tests whether all elements in the array pass the test implemented by the provided function.
... the every() method tests whether all elements in the array pass the test implemented by the provided function.
...y the provided function.
...And 18 more matches

Array.prototype.forEach() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › forEach

the foreach() method executes a provided function once for each array element.
...vided function once for each array element.
... is stored in a github repository.
...And 18 more matches

Array.prototype.some() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › some

the some() method tests whether at least one element in the array passes the test implemented by the provided function.
... some() method tests whether at least one element in the array passes the test implemented by the provided function.
...the provided function.
...And 18 more matches

TypedArray.prototype.find() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › find

the find() method returns a value in the typed array, if an element satisfies the provided testing function.
... the find() method returns a value in the typed array, if an element satisfies the provided testing function.
...stead of its value.
...And 18 more matches

TypedArray.prototype.findIndex() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › findIndex

the findindex() method returns an index in the typed array, if an element in the typed array satisfies the provided testing function.
... the findindex() method returns an index in the typed array, if an element in the typed array satisfies the provided testing function.
... of its index.
...And 18 more matches

requiredFeatures - SVG: Scalable Vector Graphics

Web › SVG › Attribute › requiredFeatures

the requiredfeatures attribute takes a list of feature strings, with the individual strings separated by white space.
... the requiredfeatures attribute takes a list of feature strings, with the individual strings separated by white space.
...ildren are skipped and thus will not be rendered.
...And 18 more matches

page-mod - Archive of obsolete content

Archive › Add-ons › Add-on SDK › High-Level APIs › page-mod

age-mod's content script is attached to a document.
...f specific tags from documents that match the pattern.
...ends the desired tag to the content script, and the content script replies by sending the html content of all the elements with that tag.
...And 17 more matches

tabs/utils - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs › tabs utils

functions for working with xul tabs and the xul tabbrowser object.
... functions for working with xul tabs and the xul tabbrowser object.
...windows.
...And 17 more matches

Chapter 2: Technologies used in developing extensions - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › Firefox addons developer guide › Technologies used in developing extensions

dards for web-related technologies.
... of useful qualities: it is generic, extensible, and easy to validate as well-formed.
...e, and easy to validate as well-formed.
...And 17 more matches

Stack Positioning - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Stack Positioning

« previousnext » this section will describe how to position items in a stack.
... normally, the child elements of a stack stretch to fit the size of the stack.
...e size of the stack.
...And 17 more matches

XBL Example - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › XBL Example

« previousnext » this section will describe an example xbl element.
... « previousnext » this section will describe an example xbl element.
... « previousnext » this section will describe an example xbl element.
...And 17 more matches

notificationbox - Archive of obsolete content

Archive › Mozilla › XUL › notificationbox

CSS selectors - Learn web development

Learn › CSS › Building blocks › Selectors

previous overview: building blocks next in css, selectors are used to target the html elements on our web pages that we want to style.
... previous overview: building blocks next in css, selectors are used to target the html elements on our web pages that we want to style.
... prerequisites: basic computer literacy, basic software installed, basic knowledge of working with files, html basics (study introduction to html), and an idea of how css works (study css first steps.) objective: to learn how css selectors work in detail.
...And 17 more matches

Flexbox - Learn web development

Learn › CSS › CSS layout › Flexbox

his article we are going to get you to work through a series of exercises to help you understand how flexbox works.
... of exercises to help you understand how flexbox works.
...flexbox0.html from our github repo — load it in a modern browser (like firefox or chrome), and have a look at the code in your code editor.
...And 17 more matches

Mozilla Web Services Security Model

Mozilla › Mozilla Web Services Security Model

e, mozilla would load the file http://www.example.com/web-scripts-access.xml, which may choose to delegate the decision to http://www.example.com/dir1/dir2/web...pts-access.xml.
...oad the file http://www.example.com/web-scripts-access.xml, which may choose to delegate the decision to http://www.example.com/dir1/dir2/web...pts-access.xml.
...m/web-scripts-access.xml, which may choose to delegate the decision to http://www.example.com/dir1/dir2/web...pts-access.xml.
...And 17 more matches

Shell global objects

Mozilla › Projects › SpiderMonkey › Shell global objects

enumber starting line number for error messages and debug info columnnumber starting column number for error messages and debug info global global in which to execute the code newcontext if true, create and use a new cx (default: false) catchtermination if true, catch termination (failure without an exception value, as for slow scripts or out-of-memory) and return 'terminated' element if present with value v, convert v to an object o and mark the source as being attached to the dom element o.
... if true, create and use a new cx (default: false) catchtermination if true, catch termination (failure without an exception value, as for slow scripts or out-of-memory) and return 'terminated' element if present with value v, convert v to an object o and mark the source as being attached to the dom element o.
...create and use a new cx (default: false) catchtermination if true, catch termination (failure without an exception value, as for slow scripts or out-of-memory) and return 'terminated' element if present with value v, convert v to an object o and mark the source as being attached to the dom element o.
...And 17 more matches

Examine and edit CSS - Firefox Developer Tools

Tools › Page Inspector › How to › Examine and edit CSS

you can examine and edit css in the inspector's css pane.
...ss properties or rules that have invalid values.
...llowed by a list of property:value; declarations.
...And 17 more matches

Background Tasks API - Web APIs

Web › API › Background Tasks API

o queue tasks to be executed automatically by the user agent when it determines that there is free time to do so.
... tachyon emissions...</div> <progress id="progress" value="0"></progress> <div class="button" id="startbutton"> start </div> <div class="label counter"> task <span id="currenttasknumber">0</span> of <span id="totaltaskcount">0</span> </div> </div> <div class="logbox"> <div class="logheader"> log </div> <div id="log"> </div> </div> the progress box uses a <progress> element to show the progress, along with a label with sections that are changed to present numeric information about the progress.
...g to be run.
...And 17 more matches

Using the CSS Painting API - Web APIs

Web › API › CSS Painting API › Guide

ps, we're going to start by creating a half-highlight background, like on this header: css paint worklet in an external script file, we employ the registerpaint() function to name our css paint worklet.
.../header-highlight.js'); reference the paint worklet in css once we have a registered paint worklet, we can use it in css.
...lass="fancy">my cool header</h1> the following example will look like the image above in browsers supporting the css painting api.
...And 17 more matches

ShadowRoot - Web APIs

Web › API › ShadowRoot

the shadowroot interface of the shadow dom api is the root node of a dom subtree that is rendered separately from a document's main dom tree.
... the shadowroot interface of the shadow dom api is the root node of a dom subtree that is rendered separately from a document's main dom tree.
... the shadowroot interface of the shadow dom api is the root node of a dom subtree that is rendered separately from a document's main dom tree.
...And 17 more matches

ARIA: textbox role - Accessibility

Web › Accessibility › ARIA › Roles › textbox role

the textbox role is used to identify an element that allows the input of free-form text.
... the textbox role is used to identify an element that allows the input of free-form text.
... the textbox role is used to identify an element that allows the input of free-form text.
...And 17 more matches

:nth-last-child() - CSS: Cascading Style Sheets

Web › CSS › :nth-last-child

the :nth-last-child() css pseudo-class matches elements based on their position among a group of siblings, counting from the end.
... the :nth-last-child() css pseudo-class matches elements based on their position among a group of siblings, counting from the end.
...very fourth element among any group of siblings, counting backwards from the last one */ :nth-last-child(4n) { color: lime; } note: this pseudo-class is essentially the same as :nth-child, except it counts items backwards from the end, not forwards from the beginning.
...And 17 more matches

font-size - CSS: Cascading Style Sheets

Web › CSS › font-size

ont-size: smaller; font-size: larger; /* <length> values */ font-size: 12px; font-size: 0.8em; /* <percentage> values */ font-size: 80%; /* global values */ font-size: inherit; font-size: initial; font-size: unset; the font-size property is specified in one of the following ways: as one of the absolute-size or relative-size keywords as a <length> or a <percentage>, relative to the parent element's font size values xx-small, x-small, small, medium, large, x-large, xx-large, xxx-large absolute-size keywords, based on the user's default font size (which is medium).
...: as one of the absolute-size or relative-size keywords as a <length> or a <percentage>, relative to the parent element's font size values xx-small, x-small, small, medium, large, x-large, xx-large, xxx-large absolute-size keywords, based on the user's default font size (which is medium).
...lute-size keywords, based on the user's default font size (which is medium).
...And 17 more matches

User input and controls - Developer guides

Web › Guide › User input methods

m offers touch events to interpret finger activity on touch-based user interfaces.
...r devices providing a mouse/touchpad as a pointing method, the pointer lock api helps you in implementing a first person 3d game or other applications requiring full control of the pointing device.
... when the input device is a mouse, you can also control user input through the pointer lock api and implement drag & drop (see below).
...And 17 more matches

<input type="text"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › text

<input> elements of type text create basic single-line text fields.
...e is a domstring that contains the current value of the text entered into the text field.
...xt = mytextinput.value; if no validation constraints are in place for the input (see validation for more details), the value may be an empty string ("").
...And 17 more matches

dominant-baseline - SVG: Scalable Vector Graphics

Web › SVG › Attribute › dominant-baseline

le.
...ont, or if the baseline table lacks an entry for the desired baseline, then the browser may use heuristics to determine the position of the desired baseline.
...seline</text> <text dominant-baseline="middle" x="30" y="50">middle</text> <text dominant-baseline="hanging" x="30" y="80">hanging</text> </svg> usage notes value auto | text-bottom | alphabetic | ideographic | middle | central | mathematical | hanging | text-top default value auto animatable yes auto if this property occurs on a <text> element, then the computed value depends on the value of the writing-mode attribute.
...And 17 more matches

Tabbed browser - Archive of obsolete content

Archive › Add-ons › Tabbed browser

ndow, you need to obtain a reference to one first, see working with windows in chrome code for details.
... meanings for the word 'browser' the word 'browser' is used several ways.
...oth in the common sense of a web page browser and the xul sense of a browser element.
...And 16 more matches

Making it into a static overlay - Archive of obsolete content

Archive › Mozilla › Creating a Mozilla extension › Making it into a static overlay

a javascript script that performs the installation and some rdf files that describe the components being installed for the chrome registry.
...l class="statusbarpanel-iconic" id="tinderbox-status" insertbefore="offline-status" status="none"/> </statusbar> </overlay> tinderstatusoverlay.xul starts with an xml processing instruction that identifies the file as xml (all xul files need to include this).
...sbarpanel-iconic" id="tinderbox-status" insertbefore="offline-status" status="none"/> </statusbar> </overlay> tinderstatusoverlay.xul starts with an xml processing instruction that identifies the file as xml (all xul files need to include this).
...And 16 more matches

Creating a Help Content Pack - Archive of obsolete content

Archive › Mozilla › Help viewer › Creating a Help Content Pack

le list of terms with corresponding urls to the term definition.
...esponding urls to the term definition.
...l, but for now knowledge of the syntax should be enough.
...And 16 more matches

Namespaces - Archive of obsolete content

Archive › Mozilla › XUL › Namespaces

in addition to this document, see namespaces crash course.
... in addition to this document, see namespaces crash course.
... in addition to this document, see namespaces crash course.
...And 16 more matches

Actions - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Actions

« previousnext » the content to generate in a template is specified using the <xul:action> element which should either be the next sibling of the <xul:query> element (if no rules need be specified) or be a direct child of a <xul:rule> element.
... « previousnext » the content to generate in a template is specified using the <xul:action> element which should either be the next sibling of the <xul:query> element (if no rules need be specified) or be a direct child of a <xul:rule> element.
...f" ref="http://www.xulplanet.com/rdf/a"> <template> <query> <content uri="?start"/> <triple subject="?start" predicate="http://www.xulplanet.com/rdf/relateditem" object="?relateditem"/> </query> <action> <button uri="?relateditem" label="?relateditem"/> </action> </template> </vbox> in this example, we omit the <xul:rule> element around the <xul:action> as it is optional when we want to generate content unconditionally.
...And 16 more matches

XML - Archive of obsolete content

Archive › Mozilla › XUL › XUL and XML

rcase verbs (e.g., onclick, onload) -- must be lowercase or they are invalid.
...all strings must be double quoted.
...be double quoted.
...And 16 more matches

browser - Archive of obsolete content

Archive › Mozilla › XUL › browser

« xul reference home [ examples | attributes | properties | methods | related ] a xul <browser> element represents a frame which is expected to contain a view of a web document.
...ener, stop, swapdocshells examples  <groupbox flex="1"> <caption label="mozilla homepage"/> <browser type="content" src="http://www.mozilla.org" flex="1"/> </groupbox> attributes autocompleteenabled type: boolean set to true to enable autocomplete of fields.
... mozilla homepage inside a groupbox --> <groupbox flex="1"> <caption label="mozilla homepage"/> <browser type="content" src="http://www.mozilla.org" flex="1"/> </groupbox> attributes autocompleteenabled type: boolean set to true to enable autocomplete of fields.
...And 16 more matches

colorpicker - Archive of obsolete content

Archive › Mozilla › XUL › colorpicker

ce home [ examples | attributes | properties | methods | related ] a palette of colors from which a user may select by clicking on one of the grid cells.
...ods | related ] a palette of colors from which a user may select by clicking on one of the grid cells.
...f colors from which a user may select by clicking on one of the grid cells.
...And 16 more matches

Adobe Flash - Archive of obsolete content

Archive › Plugins › Scripting Plugins Adobe Flash

ash modules that have little or no user-noticeable impact from being used.
... little or no user-noticeable impact from being used.
... in the future, other modules may be blocked as well.
...And 16 more matches

Windows Media in Netscape - Archive of obsolete content

Archive › Windows Media in Netscape

owsers on other operating systems.
...resence of the strings gecko/ and (ax should provide for the ability to detect any gecko-based browsers which supports geckoactivexobject which may be introduced in the future.
... object element of html to be used to instantiate the windows media player control in the same way it is used in ie.
...And 16 more matches

Audio for Web games - Game development

Games › Techniques › Audio for Web Games

hould be in control of the volume at the os level and this shouldn't be overridden.
...urrent audio playback a requirement of many games is the need to play more than one piece of audio at the same time; for example, there might be background music playing along with sound effects for various things happening in the game.
... need to play more than one piece of audio at the same time; for example, there might be background music playing along with sound effects for various things happening in the game.
...And 16 more matches

Introduction to web APIs - Learn web development

Learn › JavaScript › Client-side web APIs › Introduction

ible include xmlhttprequest and the fetch api.
...ircles, import an image onto the canvas, and apply a filter to it such as sepia or grayscale using the canvas api, or create a complex 3d scene with lighting and textures using webgl.
... our javascript objects module before continuing.
...And 16 more matches

Mozilla Style System Documentation

Mozilla › Mozilla style system documentation

ylecontext although the interface should go away when all of the style systems can be moved back into the layout dll) represents the style data for a css formatting object.
...can be moved back into the layout dll) represents the style data for a css formatting object.
...ents the style data for a css formatting object.
...And 16 more matches

Migrating from Firebug - Firefox Developer Tools

Tools › Migrating from Firebug

nd when you open a page of a different origin in the same tab, it closes automatically.
... you do this by right-clicking a node and clicking edit html...
... context menu.
...And 16 more matches

Applying styles and colors - Web APIs

Web › API › Canvas API › Tutorial › Applying styles and colors

spectacular happening here.
... * 25, 25, 25); } } } <canvas id="canvas" width="150" height="150"></canvas> draw(); the result looks like this: screenshotlive sample a strokestyle example this example is similar to the one above, but uses the strokestyle property to change the colors of the shapes' outlines.
... set of circles with an increasing radius.
...And 16 more matches

Using the aria-hidden attribute - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the aria-hidden attribute

this technique demonstrates how to use the aria-hidden attribute.
... this technique demonstrates how to use the aria-hidden attribute.
... to an element removes that element and all of its children from the accessibility tree.
...And 16 more matches

content - CSS: Cascading Style Sheets

Web › CSS › content

the content css property replaces an element with a generated value.
... the content css property replaces an element with a generated value.
...ue */ content: attr(value string); /* language- and position-dependent keywords */ content: open-quote; content: close-quote; content: no-open-quote; content: no-close-quote; /* except for normal and none, several values can be used simultaneously */ content: open-quote chapter_counter; /* global values */ content: inherit; content: initial; content: unset; syntax values none the pseudo-element is not generated.
...And 16 more matches

<input type="date"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › date

<input> elements of type="date" create input fields that let the user enter a date, either with a textbox that validates the input or a special date picker interface.
...html.
...dd.
...And 16 more matches

<input type="number"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › number

<input> elements of type number are used to let the user enter a number.
...ng-point number, or empty.
...minimum value to accept for this input placeholder an example value to display inside the field when it's empty readonly a boolean attribute indicating whether the value is read-only step a stepping interval to use when using up and down arrows to adjust the value, as well as for validation list the values of the list attribute is the id of a <datalist> element located in the same document.
...And 16 more matches

<input type="url"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › url

<input> elements of type url are used to let the user enter and edit a url.
...t.
...lue or that the value was removed.
...And 16 more matches

<keygen> - HTML: Hypertext Markup Language

Web › HTML › Element › keygen

the html <keygen> element exists to facilitate generation of key material, and submission of the public key as part of an html form.
... the html <keygen> element exists to facilitate generation of key material, and submission of the public key as part of an html form.
...e with web-based certificate management systems.
...And 16 more matches

Array.prototype.find() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › find

the find() method returns the value of the first element in the provided array that satisfies the provided testing function.
... the find() method returns the value of the first element in the provided array that satisfies the provided testing function.
...eractive example is stored in a github repository.
...And 16 more matches

Array.prototype.findIndex() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › findIndex

the findindex() method returns the index of the first element in the array that satisfies the provided testing function.
... the findindex() method returns the index of the first element in the array that satisfies the provided testing function.
...isfies the provided testing function.
...And 16 more matches

Array.prototype.map() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › map

the map() method creates a new array populated with the results of calling a provided function on every element in the calling array.
...ts of calling a provided function on every element in the calling array.
...teractive example is stored in a github repository.
...And 16 more matches

Adding sidebars - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › Adding sidebars

+(some letter), but there's no way of knowing if any other extension uses that same combination as well.
...limit the size boundaries of your sidebar with css or even disable resizing altogether, but none of those are good practices.
...rs to have a fixed size can cause accessibility and usability problems.
...And 15 more matches

Appendix E: DOM Building and Insertion (HTML & XUL) - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › DOM Building and HTML Insertion

master/gatekeeper/there.is.only.xul" }; jsontodom.defaultnamespace = jsontodom.namespaces.html; function jsontodom(jsontemplate, doc, nodes) { function namespace(name) { var reelemnameparts = /^(?:(.*):)?(.*)$/.exec(name); return { namespace: jsontodom.namespaces[reelemnameparts[1]], shortname: reelemnameparts[2] }; } // note that 'elemnameorarray' is: either the full element name (eg.
...odom.defaultnamespace = jsontodom.namespaces.html; function jsontodom(jsontemplate, doc, nodes) { function namespace(name) { var reelemnameparts = /^(?:(.*):)?(.*)$/.exec(name); return { namespace: jsontodom.namespaces[reelemnameparts[1]], shortname: reelemnameparts[2] }; } // note that 'elemnameorarray' is: either the full element name (eg.
...es) { function namespace(name) { var reelemnameparts = /^(?:(.*):)?(.*)$/.exec(name); return { namespace: jsontodom.namespaces[reelemnameparts[1]], shortname: reelemnameparts[2] }; } // note that 'elemnameorarray' is: either the full element name (eg.
...And 15 more matches

Drag and Drop Example - Archive of obsolete content

Archive › Mozilla › Drag and drop › Drag and Drop Example

« previous gecko 1.9.1 (firefox 3.5) and later supports a newer and simpler api.
... « previous gecko 1.9.1 (firefox 3.5) and later supports a newer and simpler api.
... « previous gecko 1.9.1 (firefox 3.5) and later supports a newer and simpler api.
...And 15 more matches

datepicker - Archive of obsolete content

Archive › Mozilla › XUL › datepicker

tepickers whenever a new month is navigated to or displayed.
...d.
...rstdayofweek, readonly, type, tabindex, value properties date, dateleadingzero, datevalue, disabled, month, monthleadingzero, open, readonly, tabindex, value, year, yearleadingzero examples <datepicker type="grid" value="2007-03-26"/> attributes disabled type: boolean indicates whether the element is disabled or not.
...And 15 more matches

timepicker - Archive of obsolete content

Archive › Mozilla › XUL › timepicker

ributes disabled, hideseconds, increment, readonly, tabindex, value properties amindicator, datevalue, disabled, hideseconds, hour, hourleadingzero, increment, is24hourclock, ispm, minute, minuteleadingzero, pmindicator, readonly, second, secondleadingzero, tabindex, value examples <timepicker value="12:05"/> attributes disabled type: boolean indicates whether the element is disabled or not.
...ndex, value properties amindicator, datevalue, disabled, hideseconds, hour, hourleadingzero, increment, is24hourclock, ispm, minute, minuteleadingzero, pmindicator, readonly, second, secondleadingzero, tabindex, value examples <timepicker value="12:05"/> attributes disabled type: boolean indicates whether the element is disabled or not.
... amindicator, datevalue, disabled, hideseconds, hour, hourleadingzero, increment, is24hourclock, ispm, minute, minuteleadingzero, pmindicator, readonly, second, secondleadingzero, tabindex, value examples <timepicker value="12:05"/> attributes disabled type: boolean indicates whether the element is disabled or not.
...And 15 more matches

Processing XML with E4X - Archive of obsolete content

Archive › Web › E4X › Processing XML with E4X

roduced in javascript 1.6, e4x introduces a native xml object to the javascript language, and adds syntax for embedding literal xml documents in javascript code.
... behaves in a similar way to a regular javascript object, the two are not the same thing.
...reater than sign is not escaped, it is possible to get an xml error if the cdata closing sequence (]]>) is included.
...And 15 more matches

Responsive images - Learn web development

Learn › HTML › Multimedia and embedding › Responsive images

what tools html provides to help implement them.
...idth of the viewport.
...ct to display nicely.
...And 15 more matches

A first splash into JavaScript - Learn web development

Learn › JavaScript › First steps › A first splash

= 'last guess was too low!' ; } else if(userguess > randomnumber) { loworhi.textcontent = 'last guess was too high!'; } } guesscount++; guessfield.value = ''; } guesssubmit.addeventlistener('click', checkguess); function setgameover() { guessfield.disabled = true; guesssubmit.disabled = true; resetbutton = document.createelement('button'); resetbutton.textcontent = 'start new game'; document.body.append(resetbutton); resetbutton.addeventlistener('click', resetgame); } function resetgame() { guesscount = 1; const resetparas = document.queryselectorall('.resultparas p'); for(let i = 0 ; i < resetparas.length ; i++) { resetparas[i].textcontent = ''; } resetbu...
...ial setup to begin this tutorial, we'd like you to make a local copy of the number-guessing-game-start.html file (see it live here).
...ou'll see a simple heading, paragraph of instructions and form for entering a guess, but the form won't currently do anything.
...And 15 more matches

What is JavaScript? - Learn web development

Learn › JavaScript › First steps › What is JavaScript

demo) for example, that's the dom in action.
....
...exts, but related, and both approaches (server-side and client-side) usually work together.
...And 15 more matches

Accessibility in React - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › React accessibility

ese things with a mouse.
... dashed focus indicator move between each of the filter buttons.
...e focus indicator is around the first "edit" button.
...And 15 more matches

Advanced Svelte: Reactivity, lifecycle, accessibility - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Svelte reactivity lifecycle accessibility

some advanced svelte techniques involving solving reactivity issues, keyboard accessibility problems to do with component lifecycle, and more.
...m nodes and executing methods like focus() and select().
...anagement.
...And 15 more matches

Experimental features in Firefox

Mozilla › Firefox › Experimental features

will still work with the latest web technology capabilities.
...echnology capabilities.
...apis provide support for html-based modal dialog boxes.
...And 15 more matches

XUL Overlays

Mozilla › Tech › XUL › Overlays

xul files and xul overlays overlays are xul files used to describe extra content in the ui.
...les and overlays work together to describe a single master document.
...to describe a single master document.
...And 15 more matches

Edit fonts - Firefox Developer Tools

Tools › Page Inspector › How to › Edit fonts

d side of the page inspector when it is docked to the bottom of the screen.
...cted element.
... — this section lists all of the fonts in use on the page.
...And 15 more matches

The JavaScript input interpreter - Firefox Developer Tools

Tools › Web Console › The command line interpreter

to move to a different suggestion, or just keep typing if you don't like any of the suggestions.
...h bar.
...on you want, press enter (return) to execute the statement.
...And 15 more matches

WebGL constants - Web APIs

Web › API › WebGL API › Constants

the webgl api provides several constants that are passed into or returned by functions.
...stant name value description depth_buffer_bit 0x00000100 passed to clear to clear the current depth buffer.
...lear to clear the current stencil buffer.
...And 15 more matches

:host-context() - CSS: Cascading Style Sheets

Web › CSS › :host-context()

the :host-context() css pseudo-class function selects the shadow host of the shadow dom containing the css it is used inside (so you can select a custom element from inside its shadow dom) — but only if the selector given as the function's parameter matches the shadow host's ancestor(s) in the place it sits inside the dom hierarchy.
... the :host-context() css pseudo-class function selects the shadow host of the shadow dom containing the css it is used inside (so you can select a custom element from inside its shadow dom) — but only if the selector given as the function's parameter matches the shadow host's ancestor(s) in the place it sits inside the dom hierarchy.
...xt() css pseudo-class function selects the shadow host of the shadow dom containing the css it is used inside (so you can select a custom element from inside its shadow dom) — but only if the selector given as the function's parameter matches the shadow host's ancestor(s) in the place it sits inside the dom hierarchy.
...And 15 more matches

Layout and the containing block - CSS: Cascading Style Sheets

Web › CSS › Containing block

the size and position of an element are often impacted by its containing block.
... the size and position of an element are often impacted by its containing block.
... the size and position of an element are often impacted by its containing block.
...And 15 more matches

clear - CSS: Cascading Style Sheets

Web › CSS › clear

the clear css property sets whether an element must be moved below (cleared) floating elements that precede it.
... the clear css property sets whether an element must be moved below (cleared) floating elements that precede it.
...) floating elements that precede it.
...And 15 more matches

user-select - CSS: Cascading Style Sheets

Web › CSS › user-select

t; -moz-user-select: all; /* webkit-specific values */ -webkit-user-select: none; -webkit-user-select: text; -webkit-user-select: all; /* doesn't work in safari; use only "none" or "text", or else it will allow typing in the <html> container */ /* microsoft-specific values */ -ms-user-select: none; -ms-user-select: text; -ms-user-select: element; note: user-select is not an inherited property, though the initial auto value makes it behave like it is inherited most of the time.
...s not an inherited property, though the initial auto value makes it behave like it is inherited most of the time.
...roperty, though the initial auto value makes it behave like it is inherited most of the time.
...And 15 more matches

Audio and video manipulation - Developer guides

Web › Guide › Audio and video manipulation

streams with technologies such as <canvas>, webgl or web audio api to modify audio and video directly, for example adding reverb/compression effects to audio, or grayscale/sepia filters to video.
...o video.
...erence to explain what you need to do.
...And 15 more matches

HTML5 Parser - Developer guides

Web › Guide › HTML › HTML5 › HTML5 Parser

, replacing the document.
...ding ie, then your code probably will not be affected by this change.
...re, html5 introduced support for inline svg and mathml in text/html.
...And 15 more matches

<colgroup> - HTML: Hypertext Markup Language

Web › HTML › Element › colgroup

the html <colgroup> element defines a group of columns within a table.
...ement defines a group of columns within a table.
...r this interactive example is stored in a github repository.
...And 15 more matches

<form> - HTML: Hypertext Markup Language

Web › HTML › Element › form

the html <form> element represents a document section containing interactive controls for submitting information.
...presents a document section containing interactive controls for submitting information.
...ng interactive controls for submitting information.
...And 15 more matches

<input type="email"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › email

<input> elements of type email are used to let the user enter and edit an e-mail address, or, if the multiple attribute is specified, a list of e-mail addresses.
...lls back to being a standard text input.
... if and only if the multiple attribute is specified, the value can be a list of properly-formed comma-separated e-mail addresses.
...And 15 more matches

<input type="month"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › month

<input> elements of type month create input fields that let the user enter a month and year allowing a month and year to be easily entered.
...date format differs from the actual value; most user agents display the month and year in a locale-appropriate form, based on the set locale of the user's operating system, whereas the date value is always formatted yyyy-mm.
... set the date value in javascript using the htmlinputelement.value property, for example: <label for="bday-month">what month were you born in?</label> <input id="bday-month" type="month" name="bday-month" value="2017-06"> var monthcontrol = document.queryselector('input[type="month"]'); monthcontrol.value = '1978-06'; additional attributes in addition to the attributes common to <input> elements, month inputs offer the following attributes: attribute description list the id of the <datalist> element that contains the optional pre-defined autocomplete options max the latest year and month to accept as a valid input min the earliest year and month to accept as a valid input readonly a boolean which, if present, indicates tha...
...And 15 more matches

HTTP Index - HTTP

Web › HTTP › Index

this article documents the default values for the http accept header for specific inputs and browser versions.
...agent is allowed to load for a given page.
....
...And 15 more matches

Array.prototype.filter() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › filter

the filter() method creates a new array with all elements that pass the test implemented by the provided function.
... the filter() method creates a new array with all elements that pass the test implemented by the provided function.
... the provided function.
...And 15 more matches

TypedArray.prototype.forEach() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › forEach

the foreach() method executes a provided function once per array element.
... the foreach() method executes a provided function once per array element.
... the foreach() method executes a provided function once per array element.
...And 15 more matches

<altGlyph> - SVG: Scalable Vector Graphics

Web › SVG › Element › altGlyph

the <altglyph> svg element allows sophisticated selection of the glyphs used to render its child character data.
... the <altglyph> svg element allows sophisticated selection of the glyphs used to render its child character data.
... the <altglyph> svg element allows sophisticated selection of the glyphs used to render its child character data.
...And 15 more matches

Adding windows and dialogs - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › Adding windows and dialogs

text, passwords, usernames and passwords, and checkboxes that can be used for "never ask this again"-type dialogs.
... allowing a great deal of options that cover most common dialog cases.
...cases.
...And 14 more matches

Drag and Drop - Archive of obsolete content

Archive › Mozilla › Drag and drop

something cannot be dragged, it should not start a drag session.
...applications.
...ser holds down the mouse button and moves the mouse.
...And 14 more matches

Style System Overview - Archive of obsolete content

Archive › Mozilla › Firefox › Style System Overview

c level, sheet is collection of rules other special things: @import, @media, @namespace, etc.
...l things: @import, @media, @namespace, etc.
...rule is a selector and a declaration block.
...And 14 more matches

MenuModification - Archive of obsolete content

Archive › Mozilla › XUL › PopupGuide › MenuModification

modifying a menu menus have a number of methods which may be used to add and remove items.
... modifying a menu menus have a number of methods which may be used to add and remove items.
...ng a menu menus have a number of methods which may be used to add and remove items.
...And 14 more matches

Adding Labels and Images - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Adding Labels and Images

« previousnext » this section describes a way to add labels and images to a window.
... « previousnext » this section describes a way to add labels and images to a window.
... « previousnext » this section describes a way to add labels and images to a window.
...And 14 more matches

command - Archive of obsolete content

Archive › Mozilla › XUL › command

« xul reference home [ examples | attributes | properties | methods | related ] a command element can be used to invoke an operation that can come from multiple sources.
... disable the menu items and keyboard shortcuts.
...ified by their id.
...And 14 more matches

iframe - Archive of obsolete content

Archive › Mozilla › XUL › iframe

« xul reference home [ examples | attributes | properties | methods | related ] an inner frame that works much like the html <iframe> element.
...s | attributes | properties | methods | related ] an inner frame that works much like the html <iframe> element.
...label="mozilla" value="http://mozilla.org" /> <menuitem label="slashdot" value="http://slashdot.org"/> <menuitem label="sourceforge" value="http://sf.net" /> <menuitem label="freshmeat" value="http://freshmeat.net"/> </menupopup> </menulist> <iframe id="myframe" flex="1"/> <script> function donav(obj) { var url = obj.selecteditem.value; // note the firstchild is the menupopup element document.getelementbyid('myframe').setattribute('src', url); } </script> attributes showcaret type: boolean whether or not to cause a typing caret to be visible in the content area.
...And 14 more matches

prefwindow - Archive of obsolete content

Archive › Mozilla › XUL › prefwindow

toolbar - Archive of obsolete content

Archive › Mozilla › XUL › toolbar

attributes | properties | methods | related ] a container which typically contains a row of buttons.
...roups"/> <toolbarbutton id="nav-events" accesskey="e" label="events" disabled="true"/> </toolbar> </toolbox> attributes autohide type: boolean when set to true, the toolbar will be invisible unless the alt key is pressed by the user.
... grippy will be hidden.
...And 14 more matches

wizard - Archive of obsolete content

Archive › Mozilla › XUL › wizard

« xul reference home [ examples | attributes | properties | methods | related ] this element is used to construct a step-by-step wizard found in some applications to guide users through a task.
... « xul reference home [ examples | attributes | properties | methods | related ] this element is used to construct a step-by-step wizard found in some applications to guide users through a task.
...between the pages.
...And 14 more matches

Sizing items in CSS - Learn web development

Learn › CSS › Building blocks › Sizing items in CSS

previous overview: building blocks next in the various lessons so far you have come across a number of ways to size items on a web page using css.
...s around sizing that will help you in the future.
... attributes on the <img> tag or css, it will be displayed using that intrinsic size.
...And 14 more matches

Styling tables - Learn web development

Learn › CSS › Building blocks › Styling tables

able columns tend to be sized according to how much content they contain, which produces some strange results.
...to how much content they contain, which produces some strange results.
... more detail in fixed table layouts.
...And 14 more matches

How CSS is structured - Learn web development

Learn › CSS › First steps › How CSS is structured

an external stylesheet contains css in a separate file with a .css extension.
...<head> <meta charset="utf-8"> <title>my css experiment</title> <link rel="stylesheet" href="styles.css"> </head> <body> <h1>hello world!</h1> <p>this is my first css example</p> </body> </html> the css stylesheet file might look like this: h1 { color: blue; background-color: yellow; border: 1px solid black; } p { color: red; } the href attribute of the <link> element needs to reference a file on your file system.
...ch is in a subdirectory called styles, inside the current directory --> <link rel="stylesheet" href="styles/general/style.css">  <link rel="stylesheet" href="../styles/style.css"> internal stylesheet an internal stylesheet resides within an html document.
...And 14 more matches

What are browser developer tools? - Learn web development

Learn › Common questions › What are browser developer tools

eb developer ➤ toggle tools chrome: more tools ➤ developer tools safari: develop ➤ show web inspector.
... if you can't see the develop menu, go to safari ➤ preferences ➤ advanced, and check the show develop menu in menu bar checkbox.
...om the context menu that appears.
...And 14 more matches

From object to iframe — other embedding technologies - Learn web development

Learn › HTML › Multimedia and embedding › Other embedding technologies

previous overview: multimedia and embedding next by now you should really be getting the hang of embedding things into your web pages, including images, video and audio.
... previous overview: multimedia and embedding next by now you should really be getting the hang of embedding things into your web pages, including images, video and audio.
...positives as network speeds got faster, so you don't see them being used anymore.
...And 14 more matches

Using the Browser API

Mozilla › Gecko › Chrome › API › Browser API › Using

non-standard this feature is non-standard and is not on a standards track.
...ement that allows web apps to implement browsers or browser-like applications.
...cations before that project was cancelled; since firefox 47 it is available to desktop chrome code and used in places like the firefox devtools.
...And 14 more matches

JIT Optimization Strategies

Mozilla › Projects › SpiderMonkey › JIT Optimization Strategies

defeated, and options for how to re-enable them.
...ow to re-enable them.
... new "stub" (or freestanding piece of jitcode) and changes the inline cache to jump to the stub.
...And 14 more matches

JS_SetArrayLength

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS SetArrayLength

ength(jscontext *cx, js::handle<jsobject*> obj, uint32_t length); name type description cx jscontext * the context in which to change the length of the array.
... * the context in which to change the length of the array.
... length uint32_t number of array elements to set.
...And 14 more matches

Document.querySelectorAll() - Web APIs

Web › API › Document › querySelectorAll

the document method queryselectorall() returns a static (not live) nodelist representing a list of the document's elements that match the specified group of selectors.
... the document method queryselectorall() returns a static (not live) nodelist representing a list of the document's elements that match the specified group of selectors.
...tch the specified group of selectors.
...And 14 more matches

Node.textContent - Web APIs

Web › API › Node › textContent

the textcontent property of the node interface represents the text content of the node and its descendants.
...sed, but the two properties are different in important ways.
... the concatenation of the textcontent of every child node, excluding comments and processing instructions.
...And 14 more matches

TextRange - Web APIs

Web › API › TextRange

pletely in cross browser scripts.
...e current range is equal to the specified range.
...ollapses the range and moves the blank range by a specified number of units.
...And 14 more matches

Using the Web Audio API - Web APIs

Web › API › Web Audio API › Using Web Audio API

let's take a look at getting started with the web audio api.
... let's take a look at getting started with the web audio api.
... example that allows us to load an audio track, play and pause it, and change its volume and stereo panning.
...And 14 more matches

Window.pageYOffset - Web APIs

Web › API › Window › pageYOffset

op of the document is located at the top edge of the window's content area.
...t taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
...s.
...And 14 more matches

Using the alert role - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the alert role

description this technique demonstrates how to use the alert role and describes the effect it has on browsers and assistive technology.
...cal changes will not be saved because of its intrusive nature, the alert role must be used sparingly and only in situations where the user's immediate attention is required.
... be saved because of its intrusive nature, the alert role must be used sparingly and only in situations where the user's immediate attention is required.
...And 14 more matches

bottom - CSS: Cascading Style Sheets

Web › CSS › bottom

the bottom css property participates in setting the vertical position of a positioned element.
... the bottom css property participates in setting the vertical position of a positioned element.
...om css property participates in setting the vertical position of a positioned element.
...And 14 more matches

box-sizing - CSS: Cascading Style Sheets

Web › CSS › box-sizing

the box-sizing css property sets how the total width and height of an element is calculated.
... the box-sizing css property sets how the total width and height of an element is calculated.
...erty sets how the total width and height of an element is calculated.
...And 14 more matches

top - CSS: Cascading Style Sheets

Web › CSS › top

the top css property participates in specifying the vertical position of a positioned element.
... the top css property participates in specifying the vertical position of a positioned element.
...op css property participates in specifying the vertical position of a positioned element.
...And 14 more matches

<input type="file"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › file

<input> elements with type="file" let the user choose one or more files from their device storage.
...ect, please clone https://github.com/mdn/interactive-examples and send us a pull request.
... us a pull request.
...And 14 more matches

<th> - HTML: Hypertext Markup Language

Web › HTML › Element › th

the html <th> element defines a cell as header of a group of table cells.
... examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...mdn/interactive-examples and send us a pull request.
...And 14 more matches

hidden - HTML: Hypertext Markup Language

Web › HTML › Global attributes › hidden

the hidden global attribute is a boolean attribute indicating that the element is not yet, or is no longer, relevant.
... the hidden global attribute is a boolean attribute indicating that the element is not yet, or is no longer, relevant.
... the hidden global attribute is a boolean attribute indicating that the element is not yet, or is no longer, relevant.
...And 14 more matches

Closures - JavaScript

Web › JavaScript › Closures

n front-end javascript is event-based.
...ehavior, and then attach it to an event that is triggered by the user (such as a click or a keypress).
....
...And 14 more matches

Array.prototype.indexOf() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › indexOf

the indexof() method returns the first index at which a given element can be found in the array, or -1 if it is not present.
... the indexof() method returns the first index at which a given element can be found in the array, or -1 if it is not present.
...eturns the first index at which a given element can be found in the array, or -1 if it is not present.
...And 14 more matches

TypedArray.prototype.filter() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › filter

the filter() method creates a new typed array with all elements that pass the test implemented by the provided function.
...as array.prototype.filter().
...e typed array types here.
...And 14 more matches

Dialogs and Prompts - Archive of obsolete content

Archive › Add-ons › Code snippets › Dialogs and Prompts

this page has some code snippets used to display and process dialog boxes.
... — help button (doesn't work in thunderbird 1.0 bug 256915) extra1, extra2 — two buttons without any predefined labels or meaning.
...tributes to the dialog element.
...And 13 more matches

Connecting to Remote Content - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › Connecting to Remote Content

ode> </shop> <shop> <name>orange</name> </shop> </shops> <total>2</total> </data> when a valid xml response comes back from the remote server, the xml document object can be manipulated using different dom methods, to display the data in the ui or store it into a local datasource.
... <name>orange</name> </shop> </shops> <total>2</total> </data> when a valid xml response comes back from the remote server, the xml document object can be manipulated using different dom methods, to display the data in the ui or store it into a local datasource.
...me> </shop> </shops> <total>2</total> </data> when a valid xml response comes back from the remote server, the xml document object can be manipulated using different dom methods, to display the data in the ui or store it into a local datasource.
...And 13 more matches

Drag and Drop JavaScript Wrapper - Archive of obsolete content

Archive › Mozilla › Drag and drop › Drag and Drop JavaScript Wrapper

ferdata, action) define this function to have something happen when a drag starts.
...d add the data to drag to the transferdata object.
...s the event object and the second is the data being dragged.
...And 13 more matches

Filtering - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Filtering

« previousnext » adjusting the query sometimes you may wish to change the query at a later time.
...template results should be filtered based on that value.
...t value.
...And 13 more matches

Input Controls - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Input Controls

« previousnext » xul has elements that are similar to the html form controls.
... « previousnext » xul has elements that are similar to the html form controls.
... « previousnext » xul has elements that are similar to the html form controls.
...And 13 more matches

Using the Editor from XUL - Archive of obsolete content

Archive › Mozilla › XUL › Using the editor from XUL

warning: the content of this article may be out of date.
... warning: the content of this article may be out of date.
...iframe> contents are then editable.
...And 13 more matches

listcell - Archive of obsolete content

Archive › Mozilla › XUL › listcell

attributes | properties | methods | related ] a single cell of a listbox.
...ight side.
... none and the displayed text is larger than this maximum width, you may be able to use the max-width css property (or the maxwidth attribute) to override this size.
...And 13 more matches

notification - Archive of obsolete content

Archive › Mozilla › XUL › notification

part of a notificationbox.
... label, priority, persistence, type, value methods close examples <notification label="this is a warning"/> attributes image type: uri the uri of the image to appear on the element.
... <notification label="this is a warning"/> attributes image type: uri the uri of the image to appear on the element.
...And 13 more matches

Floats - Learn web development

Learn › CSS › CSS layout › Floats

another, in the same order as they appear in the source).
...emper consectetur eget aliquam lorem.
... natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p> body { width: 90%; max-width: 900px; margin: 0 auto; font: .9em/1.2 arial, helvetica, sans-serif } .box { float: left; margin-right: 15px; width: 150px; height: 150px; border-radius: 5px; background-color: rgb(207,232,220); padding: 1em; } so let's think about how the float works — the element with the float set on it (the <div> element in this case) is taken out of the normal layout flow of the document and stuck to the left-hand side of its parent container (<body>, in this case).
...And 13 more matches

Images in HTML - Learn web development

Learn › HTML › Multimedia and embedding › Images in HTML

overview: multimedia and embedding next in the beginning, the web was just text, and it was really quite boring.
...basic software installed, basic knowledge of working with files, familiarity with html fundamentals (as covered in getting started with html.) objective: to learn how to embed simple images in html, annotate them with captions, and how html images relate to css background images.
...basic knowledge of working with files, familiarity with html fundamentals (as covered in getting started with html.) objective: to learn how to embed simple images in html, annotate them with captions, and how html images relate to css background images.
...And 13 more matches

HTML table basics - Learn web development

Learn › HTML › Tables › Basics

eir users.
... enough, so, let's dive into a practical example and build up a simple table.
...f we want a row of four cells, we need to copy these tags three times.
...And 13 more matches

Client-side storage - Learn web development

Learn › JavaScript › Client-side web APIs › Client-side storage

done!
...achine.
...ty simple: a web site with a header and footer, as well as a main content area that contains a place to display notes, and a form for entering new notes into the database.
...And 13 more matches

Getting started with React - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › React getting started

es with the use of jsx syntax.
... = <header> <h1>mozilla developer network</h1> </header> however, this looks kind of awkward, because the <header> tag that starts the expression is not indented to the same position as its corresponding closing tag.
...network</h1> </header> however, this looks kind of awkward, because the <header> tag that starts the expression is not indented to the same position as its corresponding closing tag.
...And 13 more matches

JS::AutoVectorRooter

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS::AutoVectorRooter

covers features introduced in spidermonkey 17 base class that roots an internal variable-size array of type t.
...const returns the length of the array.
...the array is empty (length is zero).
...And 13 more matches

Accessibility Inspector - Firefox Developer Tools

Tools › Accessibility inspector

they are using, the speed of their network connection, or their geographic location or locale.
... locale.
...sive information in the accessibility section of mdn web docs.
...And 13 more matches

Index - Firefox Developer Tools

Tools › Index

the font tools available in the firefox devtools.
...event listeners bound to them: 62 examine and edit css guide, inspector, tools you can examine and edit css in the inspector's css pane.
...examine and edit css guide, inspector, tools you can examine and edit css in the inspector's css pane.
...And 13 more matches

Attr - Web APIs

Web › API › Attr

the attr interface represents one of a dom element's attributes as an object.
... the attr interface represents one of a dom element's attributes as an object.
... the attr interface represents one of a dom element's attributes as an object.
...And 13 more matches

Using the CSS Typed Object Model - Web APIs

Web › API › CSS Typed OM API › Guide

the css typed object model api exposes css values as typed javascript objects to allow their performant manipulation.
...lation more logical and performant by providing object features (rather than cssom string manipulation), providing access to types, methods, and an object model for css values.
...map().
...And 13 more matches

CanvasRenderingContext2D.drawImage() - Web APIs

Web › API › CanvasRenderingContext2D › drawImage

the canvasrenderingcontext2d.drawimage() method of the canvas 2d api provides different ways to draw an image onto the canvas.
...s different ways to draw an image onto the canvas.
...draw an image onto the canvas.
...And 13 more matches

Document.execCommand() - Web APIs

Web › API › Document › execCommand

when an html document has been switched to designmode, its document object exposes an execcommand method to run commands that manipulate the current editable region, such as form inputs or contenteditable elements.
... when an html document has been switched to designmode, its document object exposes an execcommand method to run commands that manipulate the current editable region, such as form inputs or contenteditable elements.
..., its document object exposes an execcommand method to run commands that manipulate the current editable region, such as form inputs or contenteditable elements.
...And 13 more matches

ParentNode.querySelectorAll() - Web APIs

Web › API › ParentNode › querySelectorAll

the parentnode mixin defines the queryselectorall() method as returning a nodelist representing a list of elements matching the specified group of selectors which are descendants of the object on which the method was called.
... the parentnode mixin defines the queryselectorall() method as returning a nodelist representing a list of elements matching the specified group of selectors which are descendants of the object on which the method was called.
...) method as returning a nodelist representing a list of elements matching the specified group of selectors which are descendants of the object on which the method was called.
...And 13 more matches

Window - Web APIs

Web › API › Window

o,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">window</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructors see also the dom interfaces.
...alignment-baseline="middle">window</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructors see also the dom interfaces.
...which creates a staticrange object.
...And 13 more matches

:not() - CSS: Cascading Style Sheets

Web › CSS › :not

the :not() css pseudo-class represents elements that do not match a list of selectors.
... the :not() css pseudo-class represents elements that do not match a list of selectors.
...he negation pseudo-class.
...And 13 more matches

Relationship of flexbox to other layout methods - CSS: Cascading Style Sheets

Web › CSS › CSS Flexible Box Layout › Relationship of Flexbox to Other Layout Methods

n for writing-mode.
... direction.
...arent having display: flex applied, the floating and clearing will no longer happen, and the item will not be taken out of normal flow in the way that floats are.
...And 13 more matches

Consistent list indentation - CSS: Cascading Style Sheets

Web › CSS › CSS Lists and Counters › Consistent list indentation

e known as a "bullet") and is not yet part of a list itself.
...sents outer edges of the content-area of the list item.
...ke that shown in figure 2.
...And 13 more matches

CSS values and units - CSS: Cascading Style Sheets

Web › CSS › CSS Values and Units

css-wide values in addition to the pre-defined keywords that are part of the specification for a property, all css properties accept the css-wide property values initial, inherit, and unset, which explicitly specify defaulting behaviors.
... <frequency> <resolution> these are all covered in subsections below.
...wed as a value for a property, this is described as the <length> type.
...And 13 more matches

resize - CSS: Cascading Style Sheets

Web › CSS › resize

the resize css property sets whether an element is resizable, and if so, in which directions.
...ples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...and send us a pull request.
...And 13 more matches

<input type="search"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › search

<input> elements of type search are text fields designed for the user to enter search queries into.
... events change and input supported common attributes autocomplete, list, maxlength, minlength, pattern, placeholder, required, size.
...ng representing the value contained in the search field.
...And 13 more matches

<input type="tel"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › tel

<input> elements of type tel are used to let the user enter and edit a telephone number.
... a domstring representing a telephone number, or empty events change and input supported common attributes autocomplete, list, maxlength, minlength, pattern, placeholder, readonly, and size idl attributes list, selectionstart, selectionend, selectiondirection, and value methods select(), setrangetext(), setselectionrange() value the <input> element's value attribute contains a domstring that either represents a telephone number or is an empty string ("").
...donly, and size idl attributes list, selectionstart, selectionend, selectiondirection, and value methods select(), setrangetext(), setselectionrange() value the <input> element's value attribute contains a domstring that either represents a telephone number or is an empty string ("").
...And 13 more matches

<input type="week"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › week

<input> elements of type week create input fields allowing easy entry of a year plus the iso 8601 week number during that year (i.e., week 1 to 52 or 53).
..."week" type="week" name="week" value="2017-w01"> one thing to note is that the displayed format may differ from the actual value, which is always formatted yyyy-www.
...e server, for example, browsers may display it as week 01, 2017, but the submitted value will always look like week=2017-w01.
...And 13 more matches

<listing> - HTML: Hypertext Markup Language

Web › HTML › Element › listing

summary the html listing element (<listing>) renders text between the start and end tags without interpreting the html in between and using a monospaced font.
... summary the html listing element (<listing>) renders text between the start and end tags without interpreting the html in between and using a monospaced font.
...thout interpreting the html in between and using a monospaced font.
...And 13 more matches

Web › HTML › Element › object

the html <object> element represents an external resource, which can be treated as an image, a nested browsing context, or a resource to be handled by a plugin.
...ested browsing context, or a resource to be handled by a plugin.
...nteractive example is stored in a github repository.
...And 13 more matches

Grammar and types - JavaScript

Web › JavaScript › Guide › Grammar and Types

ements.
...can use undefined to determine whether a variable has a value.
...precision.
...And 13 more matches

Array.prototype.lastIndexOf() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › lastIndexOf

the lastindexof() method returns the last index at which a given element can be found in the array, or -1 if it is not present.
...index at which a given element can be found in the array, or -1 if it is not present.
...in the array, or -1 if it is not present.
...And 13 more matches

Array.prototype.toLocaleString() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › toLocaleString

the tolocalestring() method returns a string representing the elements of the array.
... the tolocalestring() method returns a string representing the elements of the array.
...options]]); parameters locales optional a string with a bcp 47 language tag, or an array of such strings.
...And 13 more matches

The building blocks of responsive design - Progressive web apps (PWAs)

Web › Progressive web apps › Responsive › responsive design building blocks

unctionality and a clean up of the styling of snapshot are planned for a future date.
...d for a future date.
...idth of 40%, floating the columns all left.
...And 13 more matches

textLength - SVG: Scalable Vector Graphics

Web › SVG › Attribute › textLength

the textlength attribute, available on svg <text> and <tspan> elements, lets you specify the width of the space into which the text will draw.
...her than that distance, using the method or methods specified by the lengthadjust attribute.
...er> default value none animatable yes <length-percentage> this value specifies the width of the space the text will be adjusted to occupy as absolute length or percentage.
...And 13 more matches

HTML in XUL for rich tooltips - Archive of obsolete content

Archive › Add-ons › Code snippets › HTML in XUL for rich tooltips

this example demonstrates the dynamic injection of html into a xul element.
... label="foo2" onmouseover="htmltip.onmousetooltip(event)" tooltip="myhtmltip" /> </popup> <popupset id="mainpopupset"> <tooltip id="myhtmltip"> <html:div id="myhtmltipdiv" type="content"/> </tooltip> </popupset> </overlay> insert your version of the following into the javascript overlay.
... <html:div id="myhtmltipdiv" type="content"/> </tooltip> </popupset> </overlay> insert your version of the following into the javascript overlay.
...And 12 more matches

Adding Toolbars and Toolbar Buttons - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › Adding Toolbars and Toolbar Buttons

class="toolbarbutton-1 chromeclass-toolbar-additional" label="&xulschoolhello.helloworld.label;" tooltiptext="&xulschoolhello.helloworld.tooltip;" oncommand="xulschoolchrome.browseroverlay.dosomething(event);" /> <!-- more buttons here.
...ss-toolbar-additional" label="&xulschoolhello.helloworld.label;" tooltiptext="&xulschoolhello.helloworld.tooltip;" oncommand="xulschoolchrome.browseroverlay.dosomething(event);" /> <!-- more buttons here.
...lschoolhello.helloworld.label;" tooltiptext="&xulschoolhello.helloworld.tooltip;" oncommand="xulschoolchrome.browseroverlay.dosomething(event);" /> <!-- more buttons here.
...And 12 more matches

CSS3 - Archive of obsolete content

Archive › CSS3

adds: substring matching attribute selectors, e[attribute^="value"], e[attribute$="value"], e[attribute*="value"] .
... progress, though it still hasn't reached the first public working draft stage.
...st public working draft stage.
...And 12 more matches

Building Menus With Templates - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Building Menus With Templates

« previousnext » menus may be generated using a template in the same manner as other elements.
... « previousnext » menus may be generated using a template in the same manner as other elements.
...?name"/> </menupopup> </action> </template> </button> <button label="children" oncommand="alert(this.previoussibling.childnodes.length);"/> in this example, the datasources attribute has been placed on a menu-type button.
...And 12 more matches

SQLite Templates - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › SQLite Templates

file within this directory is specified after the colon, in this case 'filename.sqlite'.
... uri="?"> <label value="?name"/> <label value="?email"/> </hbox> </action> </template> </vbox> this template displays the results of two columns.
...lue="?name"/> <label value="?email"/> </hbox> </action> </template> </vbox> this template displays the results of two columns.
...And 12 more matches

Simple Query Syntax - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Simple Query Syntax

simple query is equivalent to a query with only the content tag and a member tag, as well as optionally a set of triples from the child node.
...lent to a query with only the content tag and a member tag, as well as optionally a set of triples from the child node.
...ull syntax is used instead.
...And 12 more matches

Things I've tried to do with XUL - Archive of obsolete content

Archive › Mozilla › XUL › Things I've tried to do with XUL

box style="height: 30%" flex="1" style="background: green;"/> <box style="height: 20%" flex="1" style="background: green;"/> <box style="height: 50%" flex="1" style="background: green;"/> </html:div> using flex="3" flex="2" flex="5" would give the right display visually for the empty boxes; however, flex only applies to how empty space is allocated.
... silver: if you set height="0" and include "overflow: hidden" on each box that is sharing the space, current gecko will quite happily split the space out according to flex, ignoring the contents of each box, as desired.
...dden" on each box that is sharing the space, current gecko will quite happily split the space out according to flex, ignoring the contents of each box, as desired.
...And 12 more matches

Groupboxes - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Groupboxes

« previousnext » this section describes a way to include elements into groups groupboxes the groupbox element is used to group related xul elements together, much like the html fieldset element is used to group html elements.
... « previousnext » this section describes a way to include elements into groups groupboxes the groupbox element is used to group related xul elements together, much like the html fieldset element is used to group html elements.
... elements into groups groupboxes the groupbox element is used to group related xul elements together, much like the html fieldset element is used to group html elements.
...And 12 more matches

XUL Template Primer - Bindings - Archive of obsolete content

Archive › Mozilla › XUL › XUL Template Primer - Bindings

warning: the content of this article may be out of date.
... warning: the content of this article may be out of date.
...dr" predicate="http://home.netscape.com/nc-rdf#street" object="?street"/> </bindings> <action> <hbox uri="?friend"> <label value="?name"/> <label value="?street"/> </hbox> </action> </rule> </template> </vbox> </window> the xul template primer covers the <conditions> and <action> elements, so we won't discuss those here.
...And 12 more matches

caption - Archive of obsolete content

Archive › Mozilla › XUL › caption

« xul reference home [ examples | attributes | properties | methods | related ] a header for a groupbox.
...skey, crop, image, label, tabindex examples <groupbox> <caption label="my groupbox"/> </groupbox> <groupbox flex="1"> <caption> <checkbox label="a checked groupbox"/> </caption> </groupbox> attributes accesskey type: character this should be set to a character that is used as a shortcut key.
...oupbox> <groupbox flex="1"> <caption> <checkbox label="a checked groupbox"/> </caption> </groupbox> attributes accesskey type: character this should be set to a character that is used as a shortcut key.
...And 12 more matches

toolbox - Archive of obsolete content

Archive › Mozilla › XUL › toolbox

r does not have grippies so toolbars cannot be collapsed and expanded.
... <toolbar> <toolbarbutton label="back"/> <toolbarbutton label="forward"/> <toolbarbutton label="home"/> </toolbar> <toolbar> <toolbarbutton label="stop"/> <toolbarbutton label="reload"/> </toolbar> </toolbox> <textbox multiline="true" value="we have two toolbars inside of one toolbox above." width="20"/> </window> attributes inherited from xul element align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, remove...
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessible type: nsiaccessible returns the accessibility object for the element.
...And 12 more matches

treecol - Archive of obsolete content

Archive › Mozilla › XUL › treecol

Gecko Compatibility Handbook - Archive of obsolete content

Archive › Mozilla Gecko Compatibility Handbook

ator 4 share support for a large part of the html 3.2 standard and basic javascript.
...ementation of css.
...s span.
...And 12 more matches

Mozilla XForms Specials - Archive of obsolete content

Archive › Web › XForms › Mozilla XForms Specials

ble will probably never work.
...suffer from the same limitation.
...ecified behaviour of these for (x)html.
...And 12 more matches

Sending forms through JavaScript - Learn web development

Learn › Forms › Sending forms through JavaScript

nd process them however you want.
...ross-origin requests, you'll need cors and http access control.
....addeventlistener(' error', function( event ) { alert( 'oops!
...And 12 more matches

Focus management with Vue refs - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Vue refs focus management

r experience, we'll add code to control the focus so that it gets set to the edit field when the edit form is shown.
...representation of all of the nodes in our app in memory.
...ates are first performed on the in-memory nodes, and then all the changes that need to be made to the actual nodes on the page are synced in a batch.
...And 12 more matches

IME handling guide

Mozilla › IME handling guide

ese, korean and taiwan users for inputting chinese characters because the number of them is beyond thousands and cannot be input from the keyboard directly.
... ecompositionchange new composition string widget (or textcomposition) must not be nullptr text ecompositioncommitasis n/a (must be empty) nobody nullptr none ecompositioncommit commit string widget (or textcomposition) nullptr none presshell presshell receives the widget events and decides an event target from focused document and element.
... mozilla::textcomposition textcomposition manages a composition and dispatches dom compositionupdate events.
...And 12 more matches

Web Console Helpers - Firefox Developer Tools

Tools › Web Console › Helpers

the commands the javascript command line provided by the web console offers a few built-in helper functions that make certain tasks easier.
... the commands the javascript command line provided by the web console offers a few built-in helper functions that make certain tasks easier.
... the commands the javascript command line provided by the web console offers a few built-in helper functions that make certain tasks easier.
...And 12 more matches

AbstractRange - Web APIs

Web › API › AbstractRange

ges, detect intersections beween ranges, and so forth.
...th.
... is a basic range which cannot be changed once it's been created.
...And 12 more matches

NonDocumentTypeChildNode - Web APIs

Web › API › NonDocumentTypeChildNode

the nondocumenttypechildnode interface contains methods that are particular to node objects that can have a parent, but not suitable for documenttype.
... the nondocumenttypechildnode interface contains methods that are particular to node objects that can have a parent, but not suitable for documenttype.
...childnode interface contains methods that are particular to node objects that can have a parent, but not suitable for documenttype.
...And 12 more matches

Multi-touch interaction - Web APIs

Web › API › Pointer events › Multi-touch interaction

round: white; border: 1px solid black; } #target2 { background: white; border: 1px solid black; } #target3 { background: white; border: 1px solid black; } </style> global state to support multi-touch interaction, preserving a pointer's event state during various event phases is required.
...ray(); var evcache3 = new array(); register event handlers event handlers are registered for the following pointer events: pointerdown, pointermove and pointerup.
...ray(); register event handlers event handlers are registered for the following pointer events: pointerdown, pointermove and pointerup.
...And 12 more matches

WebGLRenderingContext - Web APIs

Web › API › WebGLRenderingContext

the webglrenderingcontext interface provides an interface to the opengl es 2.0 graphics rendering context for the drawing surface of an html <canvas> element.
... the webglrenderingcontext interface provides an interface to the opengl es 2.0 graphics rendering context for the drawing surface of an html <canvas> element.
... the webglrenderingcontext interface provides an interface to the opengl es 2.0 graphics rendering context for the drawing surface of an html <canvas> element.
...And 12 more matches

window.location - Web APIs

Web › API › Window › location

);">send data</button> the current url with "?some%20data" appended is sent to the server (if no action is taken by the server, the current document is reloaded with the modified search string).
...ata" appended is sent to the server (if no action is taken by the server, the current document is reloaded with the modified search string).
...nare tortor, non viverra justo diam eget arcu.
...And 12 more matches

Web APIs

Web › API

astchannel budgetservice budgetstate buffersource bytelengthqueuingstrategy bytestring c cdatasection css cssconditionrule csscounterstylerule cssgroupingrule cssimagevalue csskeyframerule csskeyframesrule csskeywordvalue cssmathproduct cssmathsum cssmathvalue cssmediarule cssnamespacerule cssnumericvalue cssomstring csspagerule csspositionvalue cssprimitivevalue csspseudoelement cssrule cssrulelist cssstyledeclaration cssstylerule cssstylesheet cssstylevalue csssupportsrule cssunitvalue cssunparsedvalue cssvalue cssvaluelist cssvariablereferencevalue cache cachestorage canvascapturemediastreamtrack canvasgradient canvasimagesource canvaspattern canvasrenderingcontext2d caretposition channelmergernode channelsplitternode characterdata childnode cli...
...elmergernode channelsplitternode characterdata childnode client clients clipboard clipboardevent clipboarditem closeevent comment compositionevent constantsourcenode constrainboolean constraindomstring constraindouble constrainulong contentindex contentindexevent convolvernode countqueuingstrategy crashreportbody credential credentialscontainer crypto cryptokey cryptokeypair customelementregistry customevent d domconfiguration domerror domexception domhighrestimestamp domimplementation domimplementationlist domlocator dommatrix dommatrixreadonly domobject domparser dompoint dompointinit dompointreadonly domquad domrect domrectreadonly domstring domstringlist domstringmap domtimestamp domtokenlist domuserdata datatransfer datatransferitem datatransferitemlist ded...
...cumenttouch documenttype doublerange dragevent dynamicscompressornode e ext_blend_minmax ext_color_buffer_float ext_color_buffer_half_float ext_disjoint_timer_query ext_float_blend ext_frag_depth ext_srgb ext_shader_texture_lod ext_texture_compression_bptc ext_texture_compression_rgtc ext_texture_filter_anisotropic eckeygenparams eckeyimportparams ecdhkeyderiveparams ecdsaparams effecttiming element elementcssinlinestyle elementtraversal errorevent event eventlistener eventsource eventtarget extendableevent extendablemessageevent f featurepolicy federatedcredential fetchevent file fileentrysync fileerror fileexception filelist filereader filereadersync filerequest filesystem filesystemdirectoryentry filesystemdirectoryreader filesystementry filesystementrysync file...
...And 12 more matches

ARIA: form role - Accessibility

Web › Accessibility › ARIA › Roles › Form Role

the form landmark role can be used to identify a group of elements on a page that provide equivalent functionality to an html form.
... the form landmark role can be used to identify a group of elements on a page that provide equivalent functionality to an html form.
...lements on a page that provide equivalent functionality to an html form.
...And 12 more matches

:defined - CSS: Cascading Style Sheets

Web › CSS › :defined

the :defined css pseudo-class represents any element that has been defined.
... the :defined css pseudo-class represents any element that has been defined.
... the :defined css pseudo-class represents any element that has been defined.
...And 12 more matches

contain - CSS: Cascading Style Sheets

Web › CSS › contain

the contain css property allows an author to indicate that an element and its contents are, as much as possible, independent of the rest of the document tree.
...tyle; contain: paint; /* multiple keywords */ contain: size paint; contain: size layout paint; /* global values */ contain: inherit; contain: initial; contain: unset; the contain property is specified as either one of the following: using a single none, strict, or content keyword.
... contain: initial; contain: unset; the contain property is specified as either one of the following: using a single none, strict, or content keyword.
...And 12 more matches

<display-box> - CSS: Cascading Style Sheets

Web › CSS › display-box

these keywords define whether an element generates display boxes at all.
... these keywords define whether an element generates display boxes at all.
... these keywords define whether an element generates display boxes at all.
...And 12 more matches

<display-outside> - CSS: Cascading Style Sheets

Web › CSS › display-outside

the <display-outside> keywords specify the element’s outer display type, which is essentially its role in flow layout.
... the <display-outside> keywords specify the element’s outer display type, which is essentially its role in flow layout.
...tside> keywords specify the element’s outer display type, which is essentially its role in flow layout.
...And 12 more matches

float - CSS: Cascading Style Sheets

Web › CSS › float

the float css property places an element on the left or right side of its container, allowing text and inline elements to wrap around it.
... the float css property places an element on the left or right side of its container, allowing text and inline elements to wrap around it.
...nts to wrap around it.
...And 12 more matches

unicode-bidi - CSS: Cascading Style Sheets

Web › CSS › unicode-bidi

ded for document type definition (dtd) designers.
...keyword values */ unicode-bidi: normal; unicode-bidi: embed; unicode-bidi: isolate; unicode-bidi: bidi-override; unicode-bidi: isolate-override; unicode-bidi: plaintext; /* global values */ unicode-bidi: inherit; unicode-bidi: initial; unicode-bidi: unset; syntax values normal the element does not offer an additional level of embedding with respect to the bidirectional algorithm.
...code-bidi: embed; unicode-bidi: isolate; unicode-bidi: bidi-override; unicode-bidi: isolate-override; unicode-bidi: plaintext; /* global values */ unicode-bidi: inherit; unicode-bidi: initial; unicode-bidi: unset; syntax values normal the element does not offer an additional level of embedding with respect to the bidirectional algorithm.
...And 12 more matches

DOM onevent handlers - Developer guides

Web › Guide › Events › Event handlers

the web platform provides several ways to be notified of dom events.
... the web platform provides several ways to be notified of dom events.
... the web platform provides several ways to be notified of dom events.
...And 12 more matches

Making content editable - Developer guides

Web › Guide › HTML › Editable content

in html, any element can be editable.
....
... provides some information about this functionality.
...And 12 more matches

disabled - HTML: Hypertext Markup Language

Web › HTML › Attributes › disabled

the boolean disabled attribute, when present, makes the element not mutable, focusable, or even submitted with the form.
... the boolean disabled attribute, when present, makes the element not mutable, focusable, or even submitted with the form.
...ing events, like mouse clicks or focus-related ones.
...And 12 more matches

<basefont> - HTML: Hypertext Markup Language

Web › HTML › Element › basefont

the obsolete html base font element (<basefont>) sets a default font face, size, and color for the other elements which are descended from its parent element.
... the obsolete html base font element (<basefont>) sets a default font face, size, and color for the other elements which are descended from its parent element.
... the obsolete html base font element (<basefont>) sets a default font face, size, and color for the other elements which are descended from its parent element.
...And 12 more matches

<header> - HTML: Hypertext Markup Language

Web › HTML › Element › header

the html <header> element represents introductory content, typically a group of introductory or navigational aids.
... the html <header> element represents introductory content, typically a group of introductory or navigational aids.
... the html <header> element represents introductory content, typically a group of introductory or navigational aids.
...And 12 more matches

<input type="range"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › range

<input> elements of type range let the user specify a numeric value which must be no less than a given value, and no more than another given value.
...defaultvalue = (rangeelem.max < rangeelem.min) ?
...n attempt is made to set the value lower than the minimum, it is set to the minimum.
...And 12 more matches

Link types - HTML: Hypertext Markup Language

Web › HTML › Link types

in html, link types indicate the relationship between two documents, in which one links to the other using an <a>, <area>, <form>, or <link> element.
... in html, link types indicate the relationship between two documents, in which one links to the other using an <a>, <area>, <form>, or <link> element.
... in html, link types indicate the relationship between two documents, in which one links to the other using an <a>, <area>, <form>, or <link> element.
...And 12 more matches

TypedArray.prototype.every() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › every

the every() method tests whether all elements in the typed array pass the test implemented by the provided function.
... array.prototype.every().
...ypes here.
...And 12 more matches

Web media technologies

Web › Media

over the years, the web's ability to present, create, and manage audio, video, and other media has grown at an increasing pace.
...s well as html elements, dom interfaces, and other features that make it possible to not only perform these tasks, but use media in tandem with other technologies to do truly remarkable things.
...pis with links to documentation you may find helpful in mastering them.
...And 12 more matches

Extensions - Archive of obsolete content

Archive › Mozilla › XUL › PopupGuide › Extensions

text menu for a link displays items to open the link in a new window or tab and to save or bookmark the link.
...nsion may modify the context menu to show additional items that either appear always, or appear only when certain content is selected.
...from the menu as needed.
...And 11 more matches

XML Templates - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › XML Templates

g a list of people: <people> <person name="napoleon bonaparte" gender="male"/> <person name="cleopatra" gender="female"/> <person name="julius caesar" gender="male"/> <person name="ferdinand magellan" gender="male"/> <person name="laura secord" gender="female"/> </people> xml query syntax the query syntax is fairly simple for xml datasources.
...attribute on the query element containing an xpath expression returns the set of results to output.
... <listbox datasources="people.xml" ref="*" querytype="xml"> <template> <query expr="person"/> <action> <listitem uri="?" label="?name"/> </action> </template> </listbox> the expr attribute is a very simple xpath expression which simply retrieves the person elements from within the datasource.
...And 11 more matches

listheader - Archive of obsolete content

Archive › Mozilla › XUL › listheader

abel="occupation"/> </listhead> <listitem> <listcell label="george"/> <listcell label="house painter"/> </listitem> <listitem> <listcell label="mary ellen"/> <listcell label="candle maker"/> </listitem> <listitem> <listcell label="roger"/> <listcell label="swashbuckler"/> </listitem> </listbox> attributes disabled type: boolean indicates whether the element is disabled or not.
...ll label="george"/> <listcell label="house painter"/> </listitem> <listitem> <listcell label="mary ellen"/> <listcell label="candle maker"/> </listitem> <listitem> <listcell label="roger"/> <listcell label="swashbuckler"/> </listitem> </listbox> attributes disabled type: boolean indicates whether the element is disabled or not.
...ell label="house painter"/> </listitem> <listitem> <listcell label="mary ellen"/> <listcell label="candle maker"/> </listitem> <listitem> <listcell label="roger"/> <listcell label="swashbuckler"/> </listitem> </listbox> attributes disabled type: boolean indicates whether the element is disabled or not.
...And 11 more matches

preferences - Archive of obsolete content

Archive › Mozilla › XUL › preferences

resizer - Archive of obsolete content

Archive › Mozilla › XUL › resizer

tabpanels - Archive of obsolete content

Archive › Mozilla › XUL › tabpanels

window - Archive of obsolete content

Archive › Mozilla › XUL › window

s attribute to true to disable chrome in the window.
...ument.
...g into the title bar.
...And 11 more matches

XForms Custom Controls - Archive of obsolete content

Archive › Web › XForms › Custom Controls

tent/input-xhtml.xml#xformswidget-input-integer'); } advanced xforms controls there may be times where you need a control that is very specific to your task, but you also want it to work with xforms models and instance nodes just like a regular xforms control.
...ethod> <constructor> // we should redirect calls of input's 'refresh' method to custom control 'refresh' method.
... var refreshstub = function() { control.refresh(); } this.ref1.refresh = refreshstub; this.ref2.refresh = refreshstub; </constructor> <property name="ref1" readonly="true" onget="return this.ownerdocument.getanonymouselementbyattribute(this, 'anonid', 'ref1');"/> <property name="ref2" readonly="true" onget="return this.ownerdocument.getanonymouselementbyattribute(this, 'anonid', 'ref2');"/> </implementation> new host language the mozilla xforms implementation currently only supports xforms hosted in xhtml or xul documents.
...And 11 more matches

Backgrounds and borders - Learn web development

Learn › CSS › Building blocks › Backgrounds and borders

56,57,1) 96%) center center / 400px 200px no-repeat, url(big-star.png) center no-repeat, rebeccapurple; } we'll return to how the shorthand works later in the tutorial, but first let's have a look at the different things you can do with backgrounds in css, by looking at the individual background properties.
...w the shorthand works later in the tutorial, but first let's have a look at the different things you can do with backgrounds in css, by looking at the individual background properties.
...css, by looking at the individual background properties.
...And 11 more matches

Graceful asynchronous programming with Promises - Learn web development

Learn › JavaScript › Asynchronous › Promises

ge("connected"); }).catch(err => { setstatusmessage("failed to connect"); }); } this function starts by using a function called setstatusmessage() to update a status display with the message "calling...", indicating that a call is being attempted.
... you'll need to use promises.
...rently as we get you building your own promise-based code.
...And 11 more matches

Introduction to client-side frameworks - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Introduction

the application has to let the user to do all of these things through the browser, however, some cracks start to show.
...bosity of dom changes building html elements and rendering them in the browser at the appropriate time takes a surprising amount of code.
... elements and rendering them in the browser at the appropriate time takes a surprising amount of code.
...And 11 more matches

JNI.jsm

Mozilla › JavaScript code modules › JNI.jsm

java string.
...meters this function takes no arguments.
...ariable, it will be undefined.
...And 11 more matches

Mozilla DOM Hacking Guide

Mozilla › Mozilla DOM Hacking

ument in a wrapper that will be of the type expected by our c++ function.
...ne asks xpconnect to search for the relevant c++ method to call.
...nt to the macro.
...And 11 more matches

Bytecode Descriptions

Mozilla › Projects › SpiderMonkey › Internals › Bytecode

[nextmethod]].
... of obj.
...ty names in object initializers, step 7.a.
...And 11 more matches

nsICollection

Mozilla › Tech › XPCOM › Reference › Interface › nsICollection

xpcom/ds/nsicollection.idlscriptable this interface represents a list of nsisupports items.
...able this interface represents a list of nsisupports items.
...ports items.
...And 11 more matches

Introduction to DOM Inspector - Firefox Developer Tools

Tools › Add-ons › DOM Inspector › Introduction to DOM Inspector

f you're inspecting a chrome document, as you select nodes in the dom nodes viewer, the rendered versions of those nodes are highlighted in the user interface itself.
...r, the rendered versions of those nodes are highlighted in the user interface itself.
...m inspector application window, all of which are available from the menupopup accessed from the upper left corner of the the object pane.
...And 11 more matches

UI Tour - Firefox Developer Tools

Tools › Page Inspector › UI Tour

this article is a quick tour of the main sections of the page inspector's user interface.
... this article is a quick tour of the main sections of the page inspector's user interface.
...e page inspector's user interface.
...And 11 more matches

DocumentFragment - Web APIs

Web › API › DocumentFragment

></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor documentfragment() creates and returns a new documentfragment object.
...ructor documentfragment() creates and returns a new documentfragment object.
...and returns a new documentfragment object.
...And 11 more matches

:host() - CSS: Cascading Style Sheets

Web › CSS › :host()

the :host() css pseudo-class function selects the shadow host of the shadow dom containing the css it is used inside (so you can select a custom element from inside its shadow dom) — but only if the selector given as the function's parameter matches the shadow host.
... the :host() css pseudo-class function selects the shadow host of the shadow dom containing the css it is used inside (so you can select a custom element from inside its shadow dom) — but only if the selector given as the function's parameter matches the shadow host.
...lect a custom element from inside its shadow dom) — but only if the selector given as the function's parameter matches the shadow host.
...And 11 more matches

Attribute selectors - CSS: Cascading Style Sheets

Web › CSS › Attribute selectors

the css attribute selector matches elements based on the presence or value of a given attribute.
... the css attribute selector matches elements based on the presence or value of a given attribute.
... the css attribute selector matches elements based on the presence or value of a given attribute.
...And 11 more matches

CSS Containment - CSS: Cascading Style Sheets

Web › CSS › CSS Containment

pendent of the other articles on the page, and so they have been given contain: content in order to indicate to the browser that this is the case.
...er that this is the case.
...de of the containing element's subtree, although if the <article> is styled such that its size depends on its contents (e.g.
...And 11 more matches

In Flow and Out of Flow - CSS: Cascading Style Sheets

Web › CSS › CSS Flow Layout › In Flow and Out of Flow

in the previous guide i explained block and inline layout in normal flow.
... in the previous guide i explained block and inline layout in normal flow.
... in the previous guide i explained block and inline layout in normal flow.
...And 11 more matches

background-clip - CSS: Cascading Style Sheets

Web › CSS › background-clip

the background-clip css property sets whether an element's background extends underneath its border box, padding box, or content box.
... the background-clip css property sets whether an element's background extends underneath its border box, padding box, or content box.
...he interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 11 more matches

<display-inside> - CSS: Cascading Style Sheets

Web › CSS › display-inside

these keywords specify the element’s inner display type, which defines the type of formatting context that lays out its contents (assuming it is a non-replaced element).
...ner display type, which defines the type of formatting context that lays out its contents (assuming it is a non-replaced element).
...then it generates an inline box.
...And 11 more matches

<length> - CSS: Cascading Style Sheets

Web › CSS › length

ot.
... <length> value in terms of the size of a particular character or font attribute in the font currently in effect in an element or its parent.
...ote: these units, especially em and rem, are often used to create scalable layouts, which maintain the vertical rhythm of the page even when the user changes the font size.
...And 11 more matches

object-position - CSS: Cascading Style Sheets

Web › CSS › object-position

the object-position css property specifies the alignment of the selected replaced element's contents within the element's box.
... the object-position css property specifies the alignment of the selected replaced element's contents within the element's box.
... the object-position css property specifies the alignment of the selected replaced element's contents within the element's box.
...And 11 more matches

visibility - CSS: Cascading Style Sheets

Web › CSS › visibility

the visibility css property shows or hides an element without changing the layout of a document.
... the visibility css property shows or hides an element without changing the layout of a document.
... hide an element and remove it from the document layout, set the display property to none instead of using visibility.
...And 11 more matches

will-change - CSS: Cascading Style Sheets

Web › CSS › will-change

the will-change css property hints to browsers how an element is expected to change.
... the will-change css property hints to browsers how an element is expected to change.
...l-change: contents; will-change: transform; /* example of <custom-ident> */ will-change: opacity; /* example of <custom-ident> */ will-change: left, top; /* example of two <animateable-feature> */ /* global values */ will-change: inherit; will-change: initial; will-change: unset; proper usage of this property can be a bit tricky: don't apply will-change to too many elements.
...And 11 more matches

HTML attribute: rel - HTML: Hypertext Markup Language

Web › HTML › Attributes › rel

the rel attribute defines the relationship between a linked resource and the current document.
...orted values depend on the element on which the attribute is found.
...ed to search through the current document and its related pages.
...And 11 more matches

<col> - HTML: Hypertext Markup Language

Web › HTML › Element › col

the html <col> element defines a column within a table and is used for defining common semantics on all common cells.
... the html <col> element defines a column within a table and is used for defining common semantics on all common cells.
...ub repository.
...And 11 more matches

<input type="button"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › button

<input> elements of type button are rendered as simple push buttons, which can be programmed to control custom functionality anywhere on a webpage as required when assigned an event handler function (typically for the click event).
... programmed to control custom functionality anywhere on a webpage as required when assigned an event handler function (typically for the click event).
...ed when assigned an event handler function (typically for the click event).
...And 11 more matches

HTML reference - HTML: Hypertext Markup Language

Web › HTML › Reference

this html reference describes all elements and attributes of html, including global attributes that apply to all elements.
... this html reference describes all elements and attributes of html, including global attributes that apply to all elements.
... this html reference describes all elements and attributes of html, including global attributes that apply to all elements.
...And 11 more matches

Array.prototype.sort() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › sort

the sort() method sorts the elements of an array in place and returns the sorted array.
... the sort() method sorts the elements of an array in place and returns the sorted array.
...n the implementation.
...And 11 more matches

TypedArray.prototype.some() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › some

the some() method tests whether some element in the typed array passes the test implemented by the provided function.
...as array.prototype.some().
...types here.
...And 11 more matches

Using images in HTML - Web media technologies

Web › Media › images

the html <img> element lets you embed images into an html document, while the <picture> element enables responsive images.
... the html <img> element lets you embed images into an html document, while the <picture> element enables responsive images.
... the html <img> element lets you embed images into an html document, while the <picture> element enables responsive images.
...And 11 more matches

context-menu - Archive of obsolete content

Archive › Add-ons › Add-on SDK › High-Level APIs › context-menu

ine selectorcontext and the "context" event, be aware that the node argument passed to the "context" event will not always match the type specified in selectorcontext.
...context" event, be aware that the node argument passed to the "context" event will not always match the type specified in selectorcontext.
... (node, data) {" + " console.log('clicked: ' + node.nodename);" + "});"; var cm = require("sdk/context-menu"); cm.item({ label: "body context", context: cm.selectorcontext("body"), contentscript: script }); this add-on creates a context-menu item that uses selectorcontext to display the item whenever the context menu is activated on any descendant of the <body> element.
...And 10 more matches

Introducing the Audio API extension - Archive of obsolete content

Archive › Mozilla › Introducing the Audio API Extension

the audio data api extension extends the html5 specification of the <audio> and <video> media elements by exposing audio metadata and raw audio data.
... of this page to guide your decision.
...event when the metadata of the media element is available, it triggers a loadedmetadata event.
...And 10 more matches

disabled - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › disabled

« xul reference home disabled type: boolean indicates whether the element is disabled or not.
... « xul reference home disabled type: boolean indicates whether the element is disabled or not.
... « xul reference home disabled type: boolean indicates whether the element is disabled or not.
...And 10 more matches

Popup Guide - Archive of obsolete content

Archive › Mozilla › XUL › PopupGuide

popups and menus there are various types of popups and menus that may be created.
...ypes of popups and menus that may be created.
...es in the list below are menus.
...And 10 more matches

Special Condition Tests - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Special Condition Tests

erformed.
...risive level.
...ul for recursive templates, since the inner iterations may use different content.
...And 10 more matches

More Tree Features - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › More Tree Features

« previousnext » here, we'll see more features of trees.
...he children to their parents.
...e sure it keeps track of the level of the rows as necessary.
...And 10 more matches

content - Archive of obsolete content

Archive › Mozilla › XUL › content

listhead - Archive of obsolete content

Archive › Mozilla › XUL › listhead

treecell - Archive of obsolete content

Archive › Mozilla › XUL › treecell

« xul reference home [ examples | attributes | properties | methods | related ] a single cell in a tree.
...checkbox">.
...hen the user double-clicks an editable cell, a text field appears in which the user can edit the contents of the cell.
...And 10 more matches

treeitem - Archive of obsolete content

Archive › Mozilla › XUL › treeitem

« xul reference home [ examples | attributes | properties | methods | related ] a treeitem should be placed inside a treechildren element and should contain treerow elements.
... examples | attributes | properties | methods | related ] a treeitem should be placed inside a treechildren element and should contain treerow elements.
...plate condition, you should use a treeitem instead of a content element when the dont-build-content flag is specified.
...And 10 more matches

nsIContentPolicy - Archive of obsolete content

Archive › Mozilla › nsIContentPolicy

ypes constant value description type_other 1 indicates content whose type is unknown, or is not interesting outside a limited use case.
...tent whose type is unknown, or is not interesting outside a limited use case.
...heet (for example, <style> elements).
...And 10 more matches

Browser Detection and Cross Browser Support - Archive of obsolete content

Archive › Web › Browser Detection and Cross Browser Support

of detection which originally was written to support only netscape navigator 4 and internet explorer 4 might look like: // wrong approach - do not use!
...elementbyid became available in internet explorer 5 and later in netscape 6 (gecko).
... height = document.body.offsetheight; } else if (document.layers) { // nn4 height = window.innerheight; } else if (document.getelementbyid) { // they think this is gecko // but could be wrong!
...And 10 more matches

display-outside - Archive of obsolete content

Archive › Web › CSS › display-outside

the display-outside css property specifies the outer display type of the box generated by an element, dictating how the element participates in its parent formatting context.
...roup; display-outside: table-column; display-outside: table-caption; display-outside: ruby-base; display-outside: ruby-text; display-outside: ruby-base-container; display-outside: ruby-text-container; /* global values */ display-outside: inherit; display-outside: initial; display-outside: unset; value not found in db!
...e: ruby-text-container; /* global values */ display-outside: inherit; display-outside: initial; display-outside: unset; value not found in db!
...And 10 more matches

Attribute selectors - Learn web development

Learn › CSS › Building blocks › Selectors › Attribute selectors

previous overview: building blocks next as you know from your study of html, elements can have attributes that give further detail about the element being marked up.
... previous overview: building blocks next as you know from your study of html, elements can have attributes that give further detail about the element being marked up.
... very useful selectors.
...And 10 more matches

create fancy boxes - Learn web development

Learn › CSS › Howto › create fancy boxes

eating fancy boxes are all about mastering css border and background properties and how to apply them to a given box.
...eyond the technics its also all about unleashing your creativity.
...the most simple piece of html possible, a simple element: <div class="fancy">hi!
...And 10 more matches

HTML forms in legacy browsers - Learn web development

Learn › Forms › HTML forms in legacy browsers

.
... caused by legacy browsers.
...odern browser, and you want to be sure it will work, one way or another, on legacy browsers, you are performing graceful degradation.
...And 10 more matches

Making decisions in your code — conditionals - Learn web development

Learn › JavaScript › Building blocks › conditionals

) { para.textcontent = 'the snow is coming down — it is freezing!
...choice === 'overcast') { para.textcontent = 'it isn\'t raining, but the sky is grey and gloomy; it could turn any minute, so take a rain coat just in case.'; } else { para.textcontent = ''; } } here we've got an html <select> element allowing us to make different weather choices, and a simple paragraph.
...\'t raining, but the sky is grey and gloomy; it could turn any minute, so take a rain coat just in case.'; } else { para.textcontent = ''; } } here we've got an html <select> element allowing us to make different weather choices, and a simple paragraph.
...And 10 more matches

Working with JSON - Learn web development

Learn › JavaScript › Objects › JSON

ve learning: working through a json example so, let's work through an example to show how we could make use of some json data on a website.
...th, make local copies of our heroes.html and style.css files.
...ponse will definitely be available when we come to try to do something with it.
...And 10 more matches

source-editor.jsm

Mozilla › JavaScript code modules › source-editor.jsm

e-editor.jsm"); warning: much of the functionality of the source editor is implemented by a secondary code module (by default, source-editor-orion.jsm).
...jsm"); warning: much of the functionality of the source editor is implemented by a secondary code module (by default, source-editor-orion.jsm).
... properties attribute type description dirty boolean set this value to false whenever you save the text; the editor will update it to true when the content is changed.
...And 10 more matches

Mozilla MathML Status

Mozilla › MathML Project › Status

an overview of the mathml 3 elements/attributes - excluding deprecated ones - and the current status of the native support.
... an overview of the mathml 3 elements/attributes - excluding deprecated ones - and the current status of the native support.
...hml 3 are given.
...And 10 more matches

Investigating leaks using DMD heap scan mode

Mozilla › Performance › DMD › Heap Scan Mode

he window, using the find_roots.py script from the heapgraph repository.
...] --[[via hash] mlistenermanager]--> 0x7f0899b4e550 [eventlistenermanager] --[mlisteners event=onload listenertype=3 [i]]--> 0x7f0882ff8f80 [callbackobject] --[mincumbentglobal]--> 0x7f0897082c00 [nsglobalwindowinner # 2147483662 inner https://www.example.com] root 0x7f0882fe3230 is a ref counted object with 1 unknown edge(s).
...> 0x7f0882ff8f80 [callbackobject] --[mincumbentglobal]--> 0x7f0897082c00 [nsglobalwindowinner # 2147483662 inner https://www.example.com] root 0x7f0882fe3230 is a ref counted object with 1 unknown edge(s).
...And 10 more matches

nsISimpleEnumerator

Mozilla › Tech › XPCOM › Reference › Interface › nsISimpleEnumerator

xpcom/ds/nsisimpleenumerator.idlscriptable this interface represents an enumeration of xpcom objects and provides methods to access elements sequentially.
... xpcom/ds/nsisimpleenumerator.idlscriptable this interface represents an enumeration of xpcom objects and provides methods to access elements sequentially.
... xpcom/ds/nsisimpleenumerator.idlscriptable this interface represents an enumeration of xpcom objects and provides methods to access elements sequentially.
...And 10 more matches

Working with windows in chrome code

Mozilla › Working with windows in chrome code

king, it implements a number of interfaces, including nsidomjswindow and nsidomwindow, but it also contains the user-defined properties for global variables and functions of the window.
...indows when a xul window contains a widget capable of displaying a page, such as <browser> or <iframe>, the document in that widget is, naturally, separate from the document of the chrome window itself.
....
...And 10 more matches

ArrayType

Mozilla › js-ctypes › js-ctypes reference › ArrayType

arraytype represents c arrays syntax returns a new ctype representing an array data type.
... arraytype represents c arrays syntax returns a new ctype representing an array data type.
... return value a ctype represents the newly declared array type.
...And 10 more matches

Work with animations - Firefox Developer Tools

Tools › Page Inspector › How to › Work with animations

the page inspector's animations view displays animations in the page synchronized along a timeline, with a draggable widget you can use to move to any point in the timeline and see the page at that point.
... the box below contains a grayscale icon, representing firefox developer edition.
...le icon, representing firefox developer edition.
...And 10 more matches

DataTransfer.setDragImage() - Web APIs

Web › API › DataTransfer › setDragImage

when a drag occurs, a translucent image is generated from the drag target (the element the dragstart event is fired at), and follows the mouse pointer during the drag.
...occurs, a translucent image is generated from the drag target (the element the dragstart event is fired at), and follows the mouse pointer during the drag.
...et (the element the dragstart event is fired at), and follows the mouse pointer during the drag.
...And 10 more matches

Document.body - Web APIs

Web › API › Document › body

the document.body property represents the <body> or <frameset> node of the current document, or null if no such element exists.
... the document.body property represents the <body> or <frameset> node of the current document, or null if no such element exists.
... the document.body property represents the <body> or <frameset> node of the current document, or null if no such element exists.
...And 10 more matches

Audio() - Web APIs

Web › API › HTMLAudioElement › Audio

the audio() constructor creates and returns a new htmlaudioelement which can be either attached to a document for the user to interact with and/or listen to, or can be used offscreen to manage and play audio.
... the audio() constructor creates and returns a new htmlaudioelement which can be either attached to a document for the user to interact with and/or listen to, or can be used offscreen to manage and play audio.
...o() constructor creates and returns a new htmlaudioelement which can be either attached to a document for the user to interact with and/or listen to, or can be used offscreen to manage and play audio.
...And 10 more matches

Resize Observer API - Web APIs

Web › API › Resize Observer API

the resize observer api provides a performant mechanism by which code can monitor an element for changes to its size, with notifications being delivered to the observer each time the size changes.
... the resize observer api provides a performant mechanism by which code can monitor an element for changes to its size, with notifications being delivered to the observer each time the size changes.
...are a whole raft of use cases for responsive design techniques (and others besides) that respond to changes in an element's size, but previously their implementations have often been hacky and/or brittle.
...And 10 more matches

Using DTMF with WebRTC - Web APIs

Web › API › WebRTC API › Using DTMF

ou can simply call rtcdtmfsender.insertdtmf() to enqueue dtmf signals to be sent on the track to the other peer.
...mfsender.insertdtmf().
...finish transmitting, the connection is closed.
...And 10 more matches

Generating HTML - Web APIs

Web › API › XSLTProcessor › Generating HTML

generating html one common application of xslt in the browser is to transform xml into html on the client.
... generating html one common application of xslt in the browser is to transform xml into html on the client.
... generating html one common application of xslt in the browser is to transform xml into html on the client.
...And 10 more matches

Using the aria-labelledby attribute - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the aria-labelledby attribute

description the aria-labelledby attribute establishes relationships between objects and their label(s), and its value should be one or more element ids, which refer to elements that have the text needed for labeling.
... description the aria-labelledby attribute establishes relationships between objects and their label(s), and its value should be one or more element ids, which refer to elements that have the text needed for labeling.
...e should be one or more element ids, which refer to elements that have the text needed for labeling.
...And 10 more matches

ARIA: application role - Accessibility

Web › Accessibility › ARIA › Roles › Application Role

the application role indicates to assistive technologies that an element and all of its children should be treated similar to a desktop application, and no traditional html interpretation techniques should be used.
... the application role indicates to assistive technologies that an element and all of its children should be treated similar to a desktop application, and no traditional html interpretation techniques should be used.
...ml interpretation techniques should be used.
...And 10 more matches

ARIA: contentinfo role - Accessibility

Web › Accessibility › ARIA › Roles › Contentinfo role

the contentinfo landmark role is used to identify information repeated at the end of every page of a website, including copyright information, navigation links, and privacy statements.
... </footer> description the contentinfo role is a landmark used to identify a page footer.
... footer.
...And 10 more matches

ARIA: feed role - Accessibility

Web › Accessibility › ARIA › Roles › Feed Role

ode.
...e, loading more content as the user scrolls.
...etsize on the articles themselves.
...And 10 more matches

ARIA: figure role - Accessibility

Web › Accessibility › ARIA › Roles › Figure Role

r other content that puts across information in a different way to a regular flow of text.
... alt="full alternative image description"> <p id="caption">figure 1: the caption</p> </div> in the above example, we have a figure that consists of two separate content items — an image and a caption.
...ription"> <p id="caption">figure 1: the caption</p> </div> in the above example, we have a figure that consists of two separate content items — an image and a caption.
...And 10 more matches

ARIA: List role - Accessibility

Web › Accessibility › ARIA › Roles › List role

can be used to identify a list of items.
...description any content that consists of an outer container with a list of elements inside it can be identified to assistive technologies using the list and listitem containers respectively.
...children, with each group having one or more listitems as children.
...And 10 more matches

ARIA: dialog role - Accessibility

Web › Accessibility › ARIA › Roles › dialog role

the dialog) or modal (only the content in the dialog can be interacted with).
...escribe how these two requirements can be met.
...t is not required for the dialog itself to be able to receive focus, it still needs to be labeled.
...And 10 more matches

Web applications and ARIA FAQ - Accessibility

Web › Accessibility › ARIA › Web applications and ARIA FAQ

e's the markup for a progress bar widget: <div id="percent-loaded" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" /> this progress bar is built using a <div>, which is not very descriptive.
...ia-valuenow="75" aria-valuemin="0" aria-valuemax="100" /> this progress bar is built using a <div>, which is not very descriptive.
...lement.
...And 10 more matches

Border-image generator - CSS: Cascading Style Sheets

Web › CSS › CSS Background and Borders › Border-image generator

t: bold; text-align: right; float: left; } #output .css-property .value { width: 65%; padding: 0 2.5%; word-break: break-all; float: left; } javascript content 'use strict'; /** * ui-slidersmanager */ var inputslidermanager = (function inputslidermanager() { var subscribers = {}; var sliders = []; var inputcomponent = function inputcomponent(obj) { var input = document.createelement('input'); input.setattribute('type', 'text'); input.style.width = 50 + obj.precision * 10 + 'px'; input.addeventlistener('click', function(e) { this.select(); }); input.addeventlistener('change', function(e) { var value = parsefloat(e.target.value); if (isnan(value) === true) setvalue(obj.topic, obj.value); else setvalue(obj.topic, value); }); return input; ...
...+ 'px'; input.addeventlistener('click', function(e) { this.select(); }); input.addeventlistener('change', function(e) { var value = parsefloat(e.target.value); if (isnan(value) === true) setvalue(obj.topic, obj.value); else setvalue(obj.topic, value); }); return input; }; var slidercomponent = function slidercomponent(obj, sign) { var slider = document.createelement('div'); var startx = null; var start_value = 0; slider.addeventlistener("click", function(e) { document.removeeventlistener("mousemove", slidermotion); setvalue(obj.topic, obj.value + obj.step * sign); }); slider.addeventlistener("mousedown", function(e) { startx = e.clientx; start_value = obj.value; document.body.style.cursor = "e-resize"; document.addeventlistener...
...l ?
...And 10 more matches

Using CSS custom properties (variables) - CSS: Cascading Style Sheets

Web › CSS › Using CSS custom properties

00ff00, especially if this same color is also used in other contexts.
...n't always have to be the case: you maybe have a good reason for limiting the scope of your custom properties.
...ive — --my-color will be treated as a separate custom property to --my-color.
...And 10 more matches

appearance (-moz-appearance, -webkit-appearance) - CSS: Cascading Style Sheets

Web › CSS › appearance

the appearance css property is used to display an element using platform-native styling, based on the operating system's theme.
...gecko/firefox 80, these uses were changed to -moz-default-appearance, which should never be used outside of internal stylesheets.
...ce:none; -webkit-appearance:none; appearance:none; } <div>lorem</div> firefox chrome safari edge no special styling is applied.
...And 10 more matches

box-lines - CSS: Cascading Style Sheets

Web › CSS › box-lines

ted boxes).
...nes: multiple; /* global values */ box-lines: inherit; box-lines: initial; box-lines: unset; by default a horizontal box will lay out its children in a single row, and a vertical box will lay out its children in a single column.
...means that all elements will be placed in a single row or column, and any elements that don't fit will simply be considered overflow.
...And 10 more matches

margin - CSS: Cascading Style Sheets

Web › CSS › margin

the margin css property sets the margin area on all four sides of an element.
... four sides of an element.
...-bottom, and margin-left.
...And 10 more matches

mask - CSS: Cascading Style Sheets

Web › CSS › mask

the mask css shorthand property hides an element (partially or fully) by masking or clipping the image at specific points.
... styles to take effect.
... mask-clip mask-composite mask-image mask-mode mask-origin mask-position mask-repeat mask-size syntax /* keyword values */ mask: none; /* image values */ mask: url(mask.png); /* pixel image used as mask */ mask: url(masks.svg#star); /* element within svg graphic used as mask */ /* combined values */ mask: url(masks.svg#star) luminance; /* element within svg graphic used as luminance mask */ mask: url(masks.svg#star) 40px 20px; /* element within svg graphic used as mask positioned 40px from the top and 20px from the left */ mask: url(masks.svg#star) 0 0/50px 50px; /* element within svg graphic used as mask with a width and height of 50px */ mask: url(masks.svg#star) repeat-x; /* element within svg graphic used as horizontall...
...And 10 more matches

opacity - CSS: Cascading Style Sheets

Web › CSS › opacity

the opacity css property sets the opacity of an element.
... the opacity css property sets the opacity of an element.
...examples and send us a pull request.
...And 10 more matches

Rich-Text Editing in Mozilla - Developer guides

Web › Guide › HTML › Editable content › Rich-Text Editing in Mozilla

he more up-to-date document available at making content editable.
...an implementation of microsoft® internet explorer's designmode feature.
... of a document to "on", such as the document inside an iframe.
...And 10 more matches

<acronym> - HTML: Hypertext Markup Language

Web › HTML › Element › acronym

summary the html acronym element (<acronym>) allows authors to clearly indicate a sequence of characters that compose an acronym or abbreviation for a word.
... summary the html acronym element (<acronym>) allows authors to clearly indicate a sequence of characters that compose an acronym or abbreviation for a word.
... summary the html acronym element (<acronym>) allows authors to clearly indicate a sequence of characters that compose an acronym or abbreviation for a word.
...And 10 more matches

<footer> - HTML: Hypertext Markup Language

Web › HTML › Element › footer

the html <footer> element represents a footer for its nearest sectioning content or sectioning root element.
...ontribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...one https://github.com/mdn/interactive-examples and send us a pull request.
...And 10 more matches

<input type="submit"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › submit

<input> elements of type submit are rendered as buttons.
...nt occurs (typically because the user clicked the button), the user agent attempts to submit the form to the server.
...put type="submit" value="send request"> if you don't specify a value, the button will have a default label, chosen by the user agent.
...And 10 more matches

<menuitem> - HTML: Hypertext Markup Language

Web › HTML › Element › menuitem

the html <menuitem> element represents a command that a user is able to invoke through a popup menu.
... the html <menuitem> element represents a command that a user is able to invoke through a popup menu.
...tached to a menu button.
...And 10 more matches

Web › HTML › Element › noscript

the html <noscript> element defines a section of html to be inserted if a script type on the page is unsupported or if scripting is currently turned off in the browser.
... the html <noscript> element defines a section of html to be inserted if a script type on the page is unsupported or if scripting is currently turned off in the browser.
... the html <noscript> element defines a section of html to be inserted if a script type on the page is unsupported or if scripting is currently turned off in the browser.
...And 10 more matches

tabindex - HTML: Hypertext Markup Language

Web › HTML › Global attributes › tabindex

the tabindex global attribute indicates that its element can be focused, and where it participates in sequential keyboard navigation (usually with the tab key, hence the name).
...ey, hence the name).
...: a negative value (usually tabindex="-1") means that the element is not reachable via sequential keyboard navigation, but could be focused with javascript or visually by clicking with the mouse.
...And 10 more matches

Preloading content with rel="preload" - HTML: Hypertext Markup Language

Web › HTML › Preloading content

the preload value of the <link> element's rel attribute lets you declare fetch requests in the html's <head>, specifying resources that your page will need very soon, which you want to start loading early in the page lifecycle, before browsers' main rendering machinery kicks in.
...t"> <link rel="stylesheet" href="style.css"> </head> <body> <h1>bouncing balls</h1> <canvas></canvas> <script src="main.js" defer></script> </body> here we preload our css and javascript files so they will be available as soon as they are required for the rendering of the page later on.
... content security policy to the resource.
...And 10 more matches

MathML attribute reference - MathML

Web › MathML › Attribute

this is an alphabetical list of mathml attributes.
... this is an alphabetical list of mathml attributes.
... this is an alphabetical list of mathml attributes.
...And 10 more matches

Performance fundamentals - Web Performance

Web › Performance › Fundamentals

or user's perspective, this answers the question, "what does the platform do for you?" web technologies the web platform provides many tools, some better suited for particular jobs than others.
...e html or css (i.e.
...ts of both.
...And 10 more matches

end - SVG: Scalable Vector Graphics

Web › SVG › Attribute › end

the end attribute defines an end value for the animation that can constrain the active duration.
...he <end-value-list> is a semicolon-separated list of values.
...point in time relative to the beginning of the svg document (usually the load or domcontentloaded event).
...And 10 more matches

<switch> - SVG: Scalable Vector Graphics

Web › SVG › Element › switch

the <switch> svg element evaluates any requiredfeatures, requiredextensions and systemlanguage attributes on its direct child elements in order, and then renders the first child where these attributes evaluate to true.
... the <switch> svg element evaluates any requiredfeatures, requiredextensions and systemlanguage attributes on its direct child elements in order, and then renders the first child where these attributes evaluate to true.
... the <switch> svg element evaluates any requiredfeatures, requiredextensions and systemlanguage attributes on its direct child elements in order, and then renders the first child where these attributes evaluate to true.
...And 10 more matches

Scripting - SVG: Scalable Vector Graphics

Web › SVG › Scripting

one can override default browser behaviors with the evt.preventdefault( ) method, add eventlisteners to objects with the syntax element.addeventlistener(event, function, usecapture), and set element properties with syntax svgelement.style.setproperty("fill-opacity", "0.0", "").
... the previous page.
...bject that implements the handleevent interface as the second parameter to these methods.
...And 10 more matches

package.json - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Tools › package json

dule: var title = require("./package.json").title; key reference package.json may contain the following keys: author the name of the package's original author; this could be the name of a person or a company.
...ptional url in parentheses and an email address in angle brackets.
...hen using jpm.
...And 9 more matches

Archive › Add-ons › Code snippets › Forms

datepicker example mdndeveloper network |*| |*| https://developer.mozilla.org/docs/code_snippets/forms |*| https://developer.mozilla.org/user:fusionchess |*| |*| this snippet is released under the gnu public license, version 3 or later.
... |*| |*| https://developer.mozilla.org/docs/code_snippets/forms |*| https://developer.mozilla.org/user:fusionchess |*| |*| this snippet is released under the gnu public license, version 3 or later.
...code_snippets/forms |*| https://developer.mozilla.org/user:fusionchess |*| |*| this snippet is released under the gnu public license, version 3 or later.
...And 9 more matches

A XUL Bestiary - Archive of obsolete content

Archive › Mozilla › XUL › A XUL Bestiary

nning is most often brought up in the context of dynamic changes to the overall look of an application.
...e attributes for individual elements, or in custom css files, you break the ability of gecko to skin the application to which your xul belongs.
... you break the ability of gecko to skin the application to which your xul belongs.
...And 9 more matches

Static Content - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Static Content

« previousnext » creating a menuitem in the filter list to show all items is fairly easy.
...ry-ont#country" oncommand="applyfilter(event.target.value);"> <menupopup> <menuitem label="all"/> </menupopup> <template> <query> <content uri="?start"/> <triple subject="?country" predicate="http://www.w3.org/1999/02/22-rdf-syntax-ns#type" object="?start"/> <triple subject="?country" predicate="http://purl.org/dc/elements/1.1/title" object="?countrytitle"/> </query> <action> <menupopup> <menuitem uri="?country" label="?countrytitle" value="?country"/> </menupopup> </action> </template> </menulist> the only difference between the previous example and this one is that the menulist element has some additional content added before the template.
...e is that only one menupopup will be created, even though there are two in the code, one outside the template and another one inside the action body.
...And 9 more matches

Introduction to RDF - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Introduction to RDF

« previousnext » in this section, we'll look at rdf (resource description framework).
... it reads data such as bookmarks, the history or mail messages.
... can also populate other xul elements as well such as listboxes and menus.
...And 9 more matches

Tree View Details - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Tree View Details

t's put this together into a simple example that takes an array and constructs a tree from it.
...s an array and constructs a tree from it.
...onstructs a tree from it.
...And 9 more matches

XBL Attribute Inheritance - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › XBL Attribute Inheritance

« previousnext » in this section we'll see how attributes can be inherited.
... « previousnext » in this section we'll see how attributes can be inherited.
...s mentioned so far, the anonymous content is always created in the same way.
...And 9 more matches

XUL Changes for Firefox 1.5 - Archive of obsolete content

Archive › Mozilla › XUL › XUL Changes for Firefox 1.5

this lists the most notable changes to xul in firefox 1.5 (gecko 1.8).
... this lists the most notable changes to xul in firefox 1.5 (gecko 1.8).
...5 (gecko 1.8).
...And 9 more matches

The Implementation of the Application Object Model - Archive of obsolete content

Archive › Mozilla › XUL › XUL and RDF › The Implementation of the Application Object Model

at can be accessed and manipulated.
...ated.
...olding content trees.
...And 9 more matches

grid - Archive of obsolete content

Archive › Mozilla › XUL › grid

note: this page is about grids in mozilla's xul technology.
... note: this page is about grids in mozilla's xul technology.
... xul technology.
...And 9 more matches

rows - Archive of obsolete content

Archive › Mozilla › XUL › rows

<statusbarpanel> - Archive of obsolete content

Archive › Mozilla › XUL › statusbarpanel

« xul reference home [ examples | attributes | properties | methods | related ] firefox 4 note the status bar has been removed.
... « xul reference home [ examples | attributes | properties | methods | related ] firefox 4 note the status bar has been removed.
...bel properties image, label style classes statusbarpanel-iconic, statusbarpanel-iconic-text, statusbarpanel-menu-iconic examples <statusbar> <statusbarpanel label="left panel"/> <spacer flex="1"/> <progressmeter mode="determined" value="82"/> <statusbarpanel label="right panel"/> </statusbar> attributes crop type: one of the values below if the label of the element is too big to fit in its given space, the text will be cropped on the side specified by the crop attribute.
...And 9 more matches

-ms-wrap-flow - Archive of obsolete content

Archive › Web › CSS › -ms-wrap-flow

the -ms-wrap-flow css property is a microsoft extension that specifies how exclusions impact inline content within block-level elements.
... the -ms-wrap-flow css property is a microsoft extension that specifies how exclusions impact inline content within block-level elements.
... the -ms-wrap-flow css property is a microsoft extension that specifies how exclusions impact inline content within block-level elements.
...And 9 more matches

The global XML object - Archive of obsolete content

Archive › Web › E4X tutorial › The global XML object

« previous the global xml object e4x-capable javascript engines put a new property on the global object.
....prototype is actually just xml.prototype) cannot be extended in the same conventional way as other constructors such as object.
...nt of <foo> elements in the xml: xml.prototype.function::foocount = function foocount() { return this..foo.length(); }; <foobar><foo/><foo/><foo/></foobar>.foocount() // returns 3 ignorecomments true by default.
...And 9 more matches

Styling links - Learn web development

Learn › CSS › Styling text › Styling links

k pseudo class.
...een created using border-bottom, not text-decoration — some people prefer this because the former has better styling options than the latter, and is drawn a bit lower, so doesn't cut across the descenders of the word being underlined (e.g.
...;padding: 10px;border: 1px solid #0095dd;"></div> <div class="controls"> <input id="reset" type="button" value="reset" style="margin: 10px 10px 0 0;"> <input id="solution" type="button" value="show solution" style="margin: 10px 0 0 10px;"> </div> </div> var htmlinput = document.queryselector(".html-input"); var cssinput = document.queryselector(".css-input"); var reset = document.getelementbyid("reset"); var htmlcode = htmlinput.value; var csscode = cssinput.value; var output = document.queryselector(".output"); var solution = document.getelementbyid("solution"); var styleelem = document.createelement('style'); var headelem = document.queryselector('head'); headelem.appendchild(styleelem); function drawoutput() { output.innerhtml = htmlinput.value; styleelem.textcontent = cssi...
...And 9 more matches

Third-party APIs - Learn web development

Learn › JavaScript › Client-side web APIs › Third party APIs

you can then just search the repo for the example files you need in each section.
...are found on third-party servers browser apis are built into the browser — you can access them from javascript immediately.
...party servers browser apis are built into the browser — you can access them from javascript immediately.
...And 9 more matches

Solve common problems in your JavaScript code - Learn web development

Learn › JavaScript › Howto

utions to common problems you may encounter when writing javascript.
...you may encounter when writing javascript.
...javascript.
...And 9 more matches

Creating our first Vue component - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Vue first component

of the file.
...eate a <script></script> section below your template section.
...}, which is your component object.
...And 9 more matches

Rendering a list of Vue components - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Vue rendering lists

todoitem }, data() { return { todoitems: [ { label: 'learn vue', done: false }, { label: 'create a vue project with the cli', done: true }, { label: 'have fun', done: true }, { label: 'create a to-do list', done: false } ] }; } }; now that we have a list of items, we can use the v-for directive to display them.
...te a to-do list', done: false } ] }; } }; now that we have a list of items, we can use the v-for directive to display them.
...; } }; now that we have a list of items, we can use the v-for directive to display them.
...And 9 more matches

JavaScript Tips

Mozilla › JavaScript Tips

publicmember: "a string", init: function() { this.dosomething(this.anothermember); }, dosomething: function(aparam) { alert(aparam); } }; xpconnect don't use object methods and properties more than you have to.
...bserver) || aiid.equals(components.interfaces.nsisupportsweakreference) || aiid.equals(components.interfaces.nsisupports)) return this; throw components.results.ns_nointerface; }, observe: function observe(asubject, atopic, astate) { } } when declaring xpcom methods, try to use the same names for method parameters as are used in the interface definition.
... aiid.equals(components.interfaces.nsisupportsweakreference) || aiid.equals(components.interfaces.nsisupports)) return this; throw components.results.ns_nointerface; }, observe: function observe(asubject, atopic, astate) { } } when declaring xpcom methods, try to use the same names for method parameters as are used in the interface definition.
...And 9 more matches

Mozilla Quirks Mode Behavior

Mozilla › Mozilla quirks mode behavior

r ul or ol (bug 98636).
...herit font properties into tables except for font-family.
...ot a block.
...And 9 more matches

DOMMatrixReadOnly - Web APIs

Web › API › DOMMatrixReadOnly

if the matrix cannot be inverted, the new matrix's components are all set to nan and its is2d property is set to false.
...components are all set to nan and its is2d property is set to false.
...atrix created by applying the specified skew transformation to the source matrix along its x-axis.
...And 9 more matches

Document.querySelector() - Web APIs

Web › API › Document › querySelector

the document method queryselector() returns the first element within the document that matches the specified selector, or group of selectors.
... the document method queryselector() returns the first element within the document that matches the specified selector, or group of selectors.
...ueryselector() returns the first element within the document that matches the specified selector, or group of selectors.
...And 9 more matches

Event.composed - Web APIs

Web › API › Event › composed

.
...ath the event will follow through the shadow root to the dom root by calling composedpath().
...to the dom root by calling composedpath().
...And 9 more matches

Event.composedPath() - Web APIs

Web › API › Event › composedPath

will be invoked.
... syntax var composed = event.composedpath(); parameters none.
...ameters none.
...And 9 more matches

EventTarget.removeEventListener() - Web APIs

Web › API › EventTarget › removeEventListener

().
... once for the same type if the options are different, the only option removeeventlistener() checks is the capture/usecapture flag.
...ntlistener() checks is the capture/usecapture flag.
...And 9 more matches

KeyframeEffect.target - Web APIs

Web › API › KeyframeEffect › target

the target property of a keyframeeffect interface represents the element or pseudo-element being animated.
... the target property of a keyframeeffect interface represents the element or pseudo-element being animated.
... the target property of a keyframeeffect interface represents the element or pseudo-element being animated.
...And 9 more matches

Pinch zoom gestures - Web APIs

Web › API › Pointer events › Pinch zoom gestures

other.
...elcome.
...var prevdiff = -1; register event handlers event handlers are registered for the following pointer events: pointerdown, pointermove and pointerup.
...And 9 more matches

Using Touch Events - Web APIs

Web › API › Touch events › Using Touch Events

tion-specific manner (for example, too many touch points are created).
... a touch surface, moving a touch point while maintaining contact with the surface, releasing a touch point and canceling a touch event.
...the touch's start and the touch's end, or the time lapse between two consecutive taps intended to create a double-tap gesture.
...And 9 more matches

Using the Web Animations API - Web APIs

Web › API › Web Animations API › Using the Web Animations API

st performant ways to animate on the web, letting the browser make its own internal optimizations without hacks, coercion, or window.requestanimationframe().
...can specify an offset directly in the object, separated from the declaration with a comma.
...nfinite", but instead uses the javascript keyword infinity.
...And 9 more matches

Using the link role - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the link role

this technique demonstrates how to use the link role and describes the effect it has on browsers and assistive technology.
... this technique demonstrates how to use the link role and describes the effect it has on browsers and assistive technology.
...use the link role and describes the effect it has on browsers and assistive technology.
...And 9 more matches

ARIA: article role - Accessibility

Web › Accessibility › ARIA › Roles › Article Role

r on one page.
...article"> <h2>heading of the segment</h2> <p>paragraph for the segment.</p> <p>another paragraph.</p> ...
...</p> <p>another paragraph.</p> ...
...And 9 more matches

-moz-user-focus - CSS: Cascading Style Sheets

Web › CSS › -moz-user-focus

the -moz-user-focus css property is used to indicate whether an element can have the focus.
... the -moz-user-focus css property is used to indicate whether an element can have the focus.
... the -moz-user-focus css property is used to indicate whether an element can have the focus.
...And 9 more matches

::after (:after) - CSS: Cascading Style Sheets

Web › CSS › ::after

in css, ::after creates a pseudo-element that is the last child of the selected element.
... in css, ::after creates a pseudo-element that is the last child of the selected element.
... in css, ::after creates a pseudo-element that is the last child of the selected element.
...And 9 more matches

all - CSS: Cascading Style Sheets

Web › CSS › all

the all shorthand css property resets all of an element's properties except unicode-bidi, direction, and css custom properties.
...one https://github.com/mdn/interactive-examples and send us a pull request.
...lues */ all: initial; all: inherit; all: unset; /* css cascading and inheritance level 4 */ all: revert; the all property is specified as one of the css global keyword values.
...And 9 more matches

border-radius - CSS: Cascading Style Sheets

Web › CSS › border-radius

the border-radius css property rounds the corners of an element's outer border edge.
...s outer border edge.
...mple is stored in a github repository.
...And 9 more matches

Inheritance - CSS: Cascading Style Sheets

Web › CSS › inheritance

in css, inheritance controls what happens when no value is specified for a property on an element.
... in css, inheritance controls what happens when no value is specified for a property on an element.
...erited properties, which by default are set to the computed value of the parent element non-inherited properties, which by default are set to initial value of the property refer to any css property definition to see whether a specific property inherits by default ("inherited: yes") or not ("inherited: no").
...And 9 more matches

<main> - HTML: Hypertext Markup Language

Web › HTML › Element › main

the html <main> element represents the dominant content of the <body> of a document.
... that is directly related to or expands upon the central topic of a document, or the central functionality of an application.
... document mustn't have more than one <main> element that doesn't have the hidden attribute specified.
...And 9 more matches

<s> - HTML: Hypertext Markup Language

Web › HTML › Element › s

the html <s> element renders text with a strikethrough, or a line through it.
... the html <s> element renders text with a strikethrough, or a line through it.
... the html <s> element renders text with a strikethrough, or a line through it.
...And 9 more matches

<span> - HTML: Hypertext Markup Language

Web › HTML › Element › span

the html <span> element is a generic inline container for phrasing content, which does not inherently represent anything.
... the html <span> element is a generic inline container for phrasing content, which does not inherently represent anything.
... the html <span> element is a generic inline container for phrasing content, which does not inherently represent anything.
...And 9 more matches

<time> - HTML: Hypertext Markup Language

Web › HTML › Element › time

the html <time> element represents a specific period in time.
...itory.
... content categories flow content, phrasing content, palpable content.
...And 9 more matches

Content-Security-Policy - HTTP

Web › HTTP › Headers › Content-Security-Policy

name no syntax content-security-policy: <policy-directive>; <policy-directive> where <policy-directive> consists of: <directive> <value> with no internal punctuation.
...d browsing contexts and workers, you should use the frame-src and worker-src directives, respectively.
... specifies valid sources for fonts loaded using @font-face.
...And 9 more matches

TypedArray.prototype.map() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › map

the map() method creates a new typed array with the results of calling a provided function on every element in this typed array.
...ray.prototype.map().
...this interactive example is stored in a github repository.
...And 9 more matches

externalResourcesRequired - SVG: Scalable Vector Graphics

Web › SVG › Attribute › externalResourcesRequired

the externalresourcesrequired attribute specifies whether referenced resources that are not part of the current document are required for proper rendering of the given container or graphics element.
... the externalresourcesrequired attribute specifies whether referenced resources that are not part of the current document are required for proper rendering of the given container or graphics element.
...cesrequired attribute specifies whether referenced resources that are not part of the current document are required for proper rendering of the given container or graphics element.
...And 9 more matches

text-anchor - SVG: Scalable Vector Graphics

Web › SVG › Attribute › text-anchor

a string of pre-formatted text or auto-wrapped text where the wrapping area is determined from the inline-size property relative to a given point.
...hose cases you should use text-align.
... takes place for each line.
...And 9 more matches

Example - SVG: Scalable Vector Graphics

Web › SVG › Namespaces Crash Course › Example

this is done completely in w3c standards–xhtml, svg and javascript–no flash or any vendor specific extensions. currently, this will work in mozilla firefox version 1.5 and above.
... <br/> <label>max.
...id='max_velocity' value='15'/> <br/> <label>attraction to cursor:</label> <input id='attract_cursor' value='6'/> <br/> <label>repulsion from peers:</label> <input id='repel_peer' value='5'/> <br/> </p> </form> <script type='text/javascript'> <![cdata[ // array of motes var motes; // get the display element.
...And 9 more matches

SVG animation with SMIL - SVG: Scalable Vector Graphics

Web › SVG › SVG animation with SMIL

although chrome 45 deprecated smil in favor of css animations and web animations, the chrome developers have since suspended that deprecation.
...d web animations, the chrome developers have since suspended that deprecation.
...s have since suspended that deprecation.
...And 9 more matches

Clipping and masking - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › Clipping and masking

« previousnext » erasing part of what one has created might at first sight look contradictory.
...out the use of the following properties quickly.
...ion="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <clippath id="cut-off-bottom"> <rect x="0" y="0" width="200" height="100" /> </clippath> </defs> <circle cx="100" cy="100" r="100" clip-path="url(#cut-off-bottom)" /> </svg> centered at (100,100) a circle with radius 100 is painted.
...And 9 more matches

XPath snippets - XPath

Web › XPath › Snippets

th() utility function // evaluate an xpath expression aexpression against a given dom node // or document object (anode), returning the results as an array // thanks wanderingstan at morethanwarm dot mail dot com for the // initial work.
...xpath expression aexpression against a given dom node // or document object (anode), returning the results as an array // thanks wanderingstan at morethanwarm dot mail dot com for the // initial work.
...cripts in a web document which might be accessed by edge or internet explorer users should replace the call to new xpathevaluator() with the following fragment: // xpathevaluator is implemented on objects that implement document var xpe = anode.ownerdocument || anode; in that case the creation of the xpathnsresolver can be simplified as: var nsresolver = xpe.creatensresolver(xpe.documentelement); note however that creatensresolver should only be used if you are sure the namespace prefixes in the xpath expression match those in the document you want to query (and that no default namespace is being used (though see document.creatensresolver for a workaround)).
...And 9 more matches

<xsl:stylesheet> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › stylesheet

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:stylesheet> element (or the equivalent <xsl:transform> element) is the outermost element of a stylesheet.
... the <xsl:stylesheet> element (or the equivalent <xsl:transform> element) is the outermost element of a stylesheet.
...nsion-element-prefixes="list-of-names" exclude-result-prefixes="list-of-names"> entire stylesheet </xsl:stylesheet> required attributes version specifies the version of xslt required by this stylesheet.
...And 9 more matches

How to convert an overlay extension to restartless - Archive of obsolete content

Archive › Add-ons › How to convert an overlay extension to restartless

ar more idiot-proof.
...manifest to load xul overlays anymore with a restartless add-on.
...anymore with a restartless add-on.
...And 8 more matches

Appendix C: Avoiding using eval in Add-ons - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › Appendix C: Avoid using eval in Add-ons

nually trigger an event handler that is defined directly in the xul document.
... document.
...l id="mylabel" onclick="executesomething(); executesomethingelse();"/> add-on authors commonly use eval to trigger the handlers.
...And 8 more matches

Appendix F: Monitoring DOM changes - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › Appendix F: Monitoring DOM changes

icies.
...owerful than most people suspect.
....
...And 8 more matches

XBL 1.0 Reference - Archive of obsolete content

Archive › Mozilla › XBL › XBL 1.0 Reference

abstract this document describes extensible binding language (xbl) 1.0 as implemented in gecko browsers.
... abstract this document describes extensible binding language (xbl) 1.0 as implemented in gecko browsers.
... abstract this document describes extensible binding language (xbl) 1.0 as implemented in gecko browsers.
...And 8 more matches

Positioning - Archive of obsolete content

Archive › Mozilla › XUL › PopupGuide › Positioning

ppear near the current mouse position, offset vertically by a small amount.
...osition attribute the position of all types of popups can be controlled in two ways.
..., the position can be specified when using the popup's openpopup method.
...And 8 more matches

Content Panels - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Content Panels

izard that guides you through a number of screens, asking a set of questions.
...s with this approach.
...s such the back and next buttons are the same throughout the interface.
...And 8 more matches

Property Files - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Property Files

three properties.
... by a script and displayed to the user.
...reated as a comment: # this is a comment welcomemessage=hello, world!
...And 8 more matches

Accessibility/XUL Accessibility Reference - Archive of obsolete content

Archive › Mozilla › XUL › XUL accessibility reference

this table is designed to show how to expose text properly for various xul element types.
... this table is designed to show how to expose text properly for various xul element types.
...o pieces that are often overlooked for visual layouts.
...And 8 more matches

image - Archive of obsolete content

Archive › Mozilla › XUL › image

« xul reference home [ examples | attributes | properties | methods | related ] summary an element that displays an image, much like the html img element.
...d ] summary an element that displays an image, much like the html img element.
...gns more with the html <img> element and shrinks both the width and height down proportionally.
...And 8 more matches

keyset - Archive of obsolete content

Archive › Mozilla › XUL › keyset

« xul reference home [ examples | attributes | properties | methods | related ] a container element for key elements.
... « xul reference home [ examples | attributes | properties | methods | related ] a container element for key elements.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width disabled type: boolean indicates whether the element is disabled or not.
...And 8 more matches

panel - Archive of obsolete content

Archive › Mozilla › XUL › panel

the panel is shown just above the window the panel is in, but behind other windows above it.
...ly set the contents when the user requests to display it.
...attribute to the value normal to display a panel with a titlebar.
...And 8 more matches

scrollbox - Archive of obsolete content

Archive › Mozilla › XUL › scrollbox

tes | properties | methods | related ] a box that has additional functions that can be used to scroll the content.
...sed when an application wants to be able to adjust the scroll position itself.
...lue="01 four score and seven years ago "/> <label value="02 our fathers brought forth on "/> <label value="03 this continent, a new nation, "/> <label value="04 conceived in liberty, and "/> <label value="05 dedicated to the proposition "/> <label value="06 that all men are created equal."/> </vbox> the flex="1" above may or may not be needed, or even desired.
...And 8 more matches

stringbundle - Archive of obsolete content

Archive › Mozilla › XUL › stringbundle

« xul reference home [ examples | attributes | properties | methods | related ] an element which can be used to load localized resources from property files.
... « xul reference home [ examples | attributes | properties | methods | related ] an element which can be used to load localized resources from property files.
...formation is available in the xul tutorial.
...And 8 more matches

Developing cross-browser and cross-platform pages - Archive of obsolete content

Archive › Using Web Standards in your Web Pages › Developing cross-browser and cross-platform pages

reliable when you use object/feature support detection, you only implement those features whose support you have first tested and verified on the visiting browser.
...etection, you only implement those features whose support you have first tested and verified on the visiting browser.
...e features whose support you have first tested and verified on the visiting browser.
...And 8 more matches

-ms-content-zooming - Archive of obsolete content

Archive › Web › CSS › -ms-content-zooming

the -ms-content-zooming css property is a microsoft extension that specifies whether zooming is enabled.
... the -ms-content-zooming css property is a microsoft extension that specifies whether zooming is enabled.
... the -ms-content-zooming css property is a microsoft extension that specifies whether zooming is enabled.
...And 8 more matches

display-inside - Archive of obsolete content

Archive › Web › CSS › display-inside

the display-inside css property specifies the inner display type of the box generated by an element, dictating how its contents lay out inside the box.
... dictating how its contents lay out inside the box.
...values */ display-inside: auto; display-inside: block; display-inside: table; display-inside: flex; display-inside: grid; display-inside: ruby; /* global values */ display-inside: inherit; display-inside: initial; display-inside: unset; value not found in db!
...And 8 more matches

Styling the Amazing Netscape Fish Cam Page - Archive of obsolete content

Archive › Web › Styling the Amazing Netscape Fish Cam Page

o break up the content so that there is a self-contained bit of markup for each fish, and then get down to styling.
...sh's description like a trading card.
... stuck, kind of like a barnacle.
...And 8 more matches

Performance best practices for Firefox front-end engineers

Mozilla › Firefox › Performance best practices for Firefox fe engineers

this guide will help firefox developers working on front-end code produce code which is as performant as possible—not just on its own, but in terms of its impact on other parts of firefox.
...and avoiding synchronous reflow below for more information.
... is applied to a document (html or xul, it doesn’t matter), the browser does calculations to figure out which css styles will apply to each element.
...And 8 more matches

CustomizableUI.jsm

Mozilla › JavaScript code modules › CustomizableUI.jsm

shown as its own panel when such a widget is in the toolbar, or as a sliding 'subview' of the menu panel when such a widget is in the menu panel.
...void beginbatchupdate(); void endbatchupdate(aforcedirty); widgetgroupwrapper createwidget(awidgetspecification); void destroywidget(awidgetid); widgetgroupwrapper getwidget(awidgetid); array getunusedwidgets(awindow); array getwidgetidsinarea(aareaid); array getwidgetsinarea(aareaid); string getareatype(aareaid); domelement getcustomizetargetforarea(aareaid, awindow); void reset(); void undoreset(); void removeextratoolbar(); object getplacementofwidget(awidgetid); bool iswidgetremovable(awidgetnodeorwidgetid); bool canwidgetmovetoarea(awidgetid); void getlocalizedproperty(awidget, aprop, aformatargs, adef); void hidepanelfornode(anode); ...
...ners(apanel); void removepanelcloselisteners(apanel); void onwidgetdrag(awidgetid, aarea); void notifystartcustomizing(awindow); void notifyendcustomizing(awindow); void dispatchtoolboxevent(aevent, adetails, awindow); bool isareaoverflowable(aareaid); void settoolbarvisibility(atoolbarid, aisvisible); string getplaceforitem(aelement); bool isbuiltintoolbar(atoolbarid); methods addlistener() add a listener object that will get fired for various events regarding customization.
...And 8 more matches

NSS API Guidelines

Mozilla › Projects › NSS › NSS API Guidelines

ion to the private header file.
...ck over the entire search: for small linked listed, queues, or arrays, you can lock over the entire search.
...ck over the entire search.
...And 8 more matches

JS::HandleValueArray

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS::HandleValueArray

this article covers features introduced in spidermonkey 31 a handle to an array of rooted values.
...valuearray<n>& values); js::handlevaluearray(const js::callargs& args); js::handlevaluearray::frommarkedlocation(size_t len, const js::value *elements); js::handlevaluearray::subarray(const js::handlevaluearray& values, size_t startindex, size_t len); js::handlevaluearray::empty(); name type description value js::rootedvalue & an element of newly created 1-length array.
...rray::frommarkedlocation(size_t len, const js::value *elements); js::handlevaluearray::subarray(const js::handlevaluearray& values, size_t startindex, size_t len); js::handlevaluearray::empty(); name type description value js::rootedvalue & an element of newly created 1-length array.
...And 8 more matches

nsIIOService

Mozilla › Tech › XPCOM › Reference › Interface › nsIIOService

, in nsiprincipal atriggeringprincipal, in uint32_t asecurityflags, in uint32_t acontentpolicytype, ); parameters aspec the spec for the desired uri.
...e null.
... get access to the result of this request.
...And 8 more matches

nsILoginManager

Mozilla › Tech › XPCOM › Reference › Interface › nsILoginManager

zilla.org/login-manager;1.
.../login-manager;1.
...s.interfaces.nsiloginmanager); method overview void addlogin(in nsilogininfo alogin); nsiautocompleteresult autocompletesearch(in astring asearchstring, in nsiautocompleteresult apreviousresult, in nsidomhtmlinputelement aelement); unsigned long countlogins(in astring ahostname, in astring aactionurl, in astring ahttprealm); boolean fillform(in nsidomhtmlformelement aform); void findlogins(out unsigned long count, in astring ahostname, in astring aactionurl, in astring ahttprealm, [retval, array, size_is(count)] out nsilogininfo logins); void getalldisabledhosts([optional] out unsigned long count, [retval, array, size_is(count)] out wstring hostnames); void getalllogins([optional] out unsigned long count, [retval, array, size_is(c...
...And 8 more matches

nsIParserUtils

Mozilla › Tech › XPCOM › Reference › Interface › nsIParserUtils

ce: var parserutils = components.classes["@mozilla.org/parserutils;1"] .getservice(components.interfaces.nsiparserutils); method overview astring converttoplaintext(in astring src, in unsigned long flags, in unsigned long wrapcol); nsidomdocumentfragment parsefragment(in astring fragment, in unsigned long flags, in boolean isxml, in nsiuri baseuri, in nsidomelement element); astring sanitize(in astring src, in unsigned long flags); constants constant value description sanitizerallowcomments (1 << 0) flag for sanitizer: allow comment nodes.
...g fragment, in unsigned long flags, in boolean isxml, in nsiuri baseuri, in nsidomelement element); astring sanitize(in astring src, in unsigned long flags); constants constant value description sanitizerallowcomments (1 << 0) flag for sanitizer: allow comment nodes.
...s for embedded content.
...And 8 more matches

Break on DOM mutation - Firefox Developer Tools

Tools › Debugger › Break on DOM mutation

a dom mutation breakpoint pauses the code when the dom node on which you have set the breakpoint is modified.
...int in the page inspector.
...cation execution pauses if any of the elementʼs descendant nodes are modified.
...And 8 more matches

Drawing shapes with canvas - Web APIs

Web › API › Canvas API › Tutorial › Drawing shapes

cle, you will have learned how to draw rectangles, triangles, lines, arcs and curves, providing familiarity with some of the basic shapes.
... we can start drawing, we need to talk about the canvas grid or coordinate space.
...elative to the origin) of the top-left corner of the rectangle.
...And 8 more matches

Event - Web APIs

Web › API › Event

the event interface represents an event which takes place in the dom.
... the event interface represents an event which takes place in the dom.
...t can also be triggered programmatically, such as by calling the htmlelement.click() method of an element, or by defining the event, then sending it to a specified target using eventtarget.dispatchevent().
...And 8 more matches

GlobalEventHandlers.ondragend - Web APIs

Web › API › GlobalEventHandlers › ondragend

a global event handler for the dragend event.
... a global event handler for the dragend event.
... a global event handler for the dragend event.
...And 8 more matches

GlobalEventHandlers.ondragenter - Web APIs

Web › API › GlobalEventHandlers › ondragenter

a global event handler for the dragenter event.
... a global event handler for the dragenter event.
... a global event handler for the dragenter event.
...And 8 more matches

GlobalEventHandlers.ondragexit - Web APIs

Web › API › GlobalEventHandlers › ondragexit

the globaleventhandler.ondragexit property is an event handler for the dragexit event.
... the globaleventhandler.ondragexit property is an event handler for the dragexit event.
... the globaleventhandler.ondragexit property is an event handler for the dragexit event.
...And 8 more matches

GlobalEventHandlers.ondragleave - Web APIs

Web › API › GlobalEventHandlers › ondragleave

a global event handler for the dragleave event.
... a global event handler for the dragleave event.
... a global event handler for the dragleave event.
...And 8 more matches

Option() - Web APIs

Web › API › HTMLOptionElement › Option

the option() constructor creates a new htmloptionelement.
... the option() constructor creates a new htmloptionelement.
... the option() constructor creates a new htmloptionelement.
...And 8 more matches

Node.childNodes - Web APIs

Web › API › Node › childNodes

the node.childnodes read-only property returns a live nodelist of child nodes of the given element where the first child node is assigned index 0.
... the node.childnodes read-only property returns a live nodelist of child nodes of the given element where the first child node is assigned index 0.
... the node.childnodes read-only property returns a live nodelist of child nodes of the given element where the first child node is assigned index 0.
...And 8 more matches

Node.removeChild() - Web APIs

Web › API › Node › removeChild

reuse the removed node later in your code, via the oldchild object reference.
...form, however, there is no oldchild reference kept, so assuming your code has not kept any other reference to the node elsewhere, it will immediately become unusable and irretrievable, and will usually be automatically deleted from memory after a short time.
...ode elsewhere, it will immediately become unusable and irretrievable, and will usually be automatically deleted from memory after a short time.
...And 8 more matches

A simple RTCDataChannel sample - Web APIs

Web › API › WebRTC API › Simple RTCDataChannel sample

the rtcdatachannel interface is a feature of the webrtc api which lets you open a channel between two peers over which you may send and receive arbitrary data.
... of the connection process together; if you haven't already read up on this functionality of ecmascript 2015, you should read up on them.
...d up on this functionality of ecmascript 2015, you should read up on them.
...And 8 more matches

XMLSerializer - Web APIs

Web › API › XMLSerializer

the xmlserializer interface provides the serializetostring() method to construct an xml string representing a dom tree.
...just serializes an entire document into a string containing xml.
...ializetostring(d); savexml(str); this involves creating a new xmlserializer object, then passing the document to be serialized into serializetostring(), which returns the xml equivalent of the document.
...And 8 more matches

Basic form hints - Accessibility

Web › Accessibility › ARIA › forms › Basic form hints

when implementing forms using traditional html form-related elements, it is important to provide labels for controls, and explicitly associate a label with its control.
...t is important to provide labels for controls, and explicitly associate a label with its control.
... controls, and explicitly associate a label with its control.
...And 8 more matches

ARIA - Accessibility

Web › Accessibility › ARIA

ons and widgets commonly used in applications can be passed to assistive technologies when there is not otherwise a mechanism.
...lications can be passed to assistive technologies when there is not otherwise a mechanism.
...technologies when there is not otherwise a mechanism.
...And 8 more matches

::backdrop - CSS: Cascading Style Sheets

Web › CSS › ::backdrop

the ::backdrop css pseudo-element is a box the size of the viewport which is rendered immediately beneath any element being presented in full-screen mode.
... the ::backdrop css pseudo-element is a box the size of the viewport which is rendered immediately beneath any element being presented in full-screen mode.
... the ::backdrop css pseudo-element is a box the size of the viewport which is rendered immediately beneath any element being presented in full-screen mode.
...And 8 more matches

::before (:before) - CSS: Cascading Style Sheets

Web › CSS › ::before

in css, ::before creates a pseudo-element that is the first child of the selected element.
... in css, ::before creates a pseudo-element that is the first child of the selected element.
... in css, ::before creates a pseudo-element that is the first child of the selected element.
...And 8 more matches

::slotted() - CSS: Cascading Style Sheets

Web › CSS › ::slotted

the ::slotted() css pseudo-element represents any element that has been placed into a slot inside an html template (see using templates and slots for more information).
... the ::slotted() css pseudo-element represents any element that has been placed into a slot inside an html template (see using templates and slots for more information).
... the ::slotted() css pseudo-element represents any element that has been placed into a slot inside an html template (see using templates and slots for more information).
...And 8 more matches

border-image - CSS: Cascading Style Sheets

Web › CSS › border-image

the border-image css property draws an image around a given element.
... the border-image css property draws an image around a given element.
...s <'border-image-source'> the source image.
...And 8 more matches

Adapting to the new two-value syntax of display - CSS: Cascading Style Sheets

Web › CSS › display › two-value syntax of display

0 implemented the two-value syntax for the display property, which is part of the css display module level 3.
...ine we would use the following css: h1 { display: inline; } more recently we have gained css grid layout and flexbox.
...hese we also use values of the display property — display: grid and display: flex.
...And 8 more matches

line-height - CSS: Cascading Style Sheets

Web › CSS › line-height

the line-height css property sets the height of a line box.
... the line-height css property sets the height of a line box.
... the line-height css property sets the height of a line box.
...And 8 more matches

page-break-after - CSS: Cascading Style Sheets

Web › CSS › page-break-after

this property has been replaced by the break-after property.
...reak-after css property adjusts page breaks after the current element.
...fter: recto; page-break-after: verso; /* global values */ page-break-after: inherit; page-break-after: initial; page-break-after: unset; this property applies to block elements that generate a box.
...And 8 more matches

page-break-before - CSS: Cascading Style Sheets

Web › CSS › page-break-before

this property has been replaced by the break-before property.
... this property has been replaced by the break-before property.
...page-break-before: always; page-break-before: avoid; page-break-before: left; page-break-before: right; page-break-before: recto; page-break-before: verso; /* global values */ page-break-before: inherit; page-break-before: initial; page-break-before: unset; syntax values auto initial value.
...And 8 more matches

<font> - HTML: Hypertext Markup Language

Web › HTML › Element › font

summary the html font element (<font>) defines the font size, color and face for its content.
... summary the html font element (<font>) defines the font size, color and face for its content.
... summary the html font element (<font>) defines the font size, color and face for its content.
...And 8 more matches

<input type="color"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › color

<input> elements of type color provide a user interface element that lets a user specify a color, either by using a visual color picker interface or by entering the color into a text field in #rrggbb hexadecimal format.
...put> elements of type color provide a user interface element that lets a user specify a color, either by using a visual color picker interface or by entering the color into a text field in #rrggbb hexadecimal format.
...project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 8 more matches

<xmp> - HTML: Hypertext Markup Language

Web › HTML › Element › xmp

summary the html example element (<xmp>) renders text between the start and end tags without interpreting the html in between and using a monospaced font.
... summary the html example element (<xmp>) renders text between the start and end tags without interpreting the html in between and using a monospaced font.
...text between the start and end tags without interpreting the html in between and using a monospaced font.
...And 8 more matches

Microformats - HTML: Hypertext Markup Language

Web › HTML › microformats

gators, and other tools.
...erns of html are used for marking up entities that range from fundamental to domain-specific information, such as people, organizations, events, and locations.
... and corresponding expected vocabulary of properties.
...And 8 more matches

Index - HTTP

Web › HTTP › Headers › Index

agent is allowed to load for a given page.
....
... security the http content-security-policy (csp) block-all-mixed-content directive prevents loading any assets using http when the page is loaded using https.
...And 8 more matches

Keyed collections - JavaScript

Web › JavaScript › Guide › Keyed collections

« previousnext » this chapter introduces collections of data which are indexed by a key; map and set objects contain elements which are iterable in the order of insertion.
... « previousnext » this chapter introduces collections of data which are indexed by a key; map and set objects contain elements which are iterable in the order of insertion.
...eve those values, delete keys, and detect whether something is stored at a key.
...And 8 more matches

Memory Management - JavaScript

Web › JavaScript › Memory Management

memory for a number var s = 'azerty'; // allocates memory for a string var o = { a: 1, b: null }; // allocates memory for an object and contained values // (like object) allocates memory for the array and // contained values var a = [1, null, 'abra']; function f(a) { return a + 2; } // allocates a function (which is a callable object) // function expressions also allocate an object someelement.addeventlistener('click', function() { someelement.style.backgroundcolor = 'blue'; }, false); allocation via function calls some function calls result in object allocation.
... function f(a) { return a + 2; } // allocates a function (which is a callable object) // function expressions also allocate an object someelement.addeventlistener('click', function() { someelement.style.backgroundcolor = 'blue'; }, false); allocation via function calls some function calls result in object allocation.
... // allocates a function (which is a callable object) // function expressions also allocate an object someelement.addeventlistener('click', function() { someelement.style.backgroundcolor = 'blue'; }, false); allocation via function calls some function calls result in object allocation.
...And 8 more matches

Array.prototype.flatMap() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › flatMap

the flatmap() method first maps each element using a mapping function, then flattens the result into a new array.
...ite useful, as merging both into one method is slightly more efficient.
... this interactive example is stored in a github repository.
...And 8 more matches

<semantics> - MathML

Web › MathML › Element › semantics

in mathml there are two ways to mark up mathematics: presentation mathml is used to control the layout of equations, whereas content mathml is designed to encode the semantic mathematical meaning and to make expressions understandable to computer algebra systems.
...l the layout of equations, whereas content mathml is designed to encode the semantic mathematical meaning and to make expressions understandable to computer algebra systems.
...hereas content mathml is designed to encode the semantic mathematical meaning and to make expressions understandable to computer algebra systems.
...And 8 more matches

Image file type and format guide - Web media technologies

Web › Media › Formats › Image types

a can be either a bmp image without the file header, or a complete png image (including the file header).
... you use ico files, you should use the bmp format, as support for png inside ico files wasn't added until windows vista and may not be well supported.
...apply.
...And 8 more matches

Animation performance and frame rate - Web Performance

Web › Performance › Animation performance and frame rate

ain a fast and steady frame rate.
...code.
... will appear smooth.
...And 8 more matches

in - SVG: Scalable Vector Graphics

Web › SVG › Attribute › in

the in attribute identifies input for the given filter primitive.
...ue within the same <filter> element.
...egraphic as its input.
...And 8 more matches

<a> - SVG: Scalable Vector Graphics

Web › SVG › Element › a

the <a> svg element creates a hyperlink to other web pages, files, locations in the same page, email addresses, or any other url.
... the <a> svg element creates a hyperlink to other web pages, files, locations in the same page, email addresses, or any other url.
... the <a> svg element creates a hyperlink to other web pages, files, locations in the same page, email addresses, or any other url.
...And 8 more matches

<hatch> - SVG: Scalable Vector Graphics

Web › SVG › Element › hatch

the <hatch> svg element is used to fill or stroke an object using one or more pre-defined paths that are repeated at fixed intervals in a specified direction to cover the areas to be painted.
... the <hatch> svg element is used to fill or stroke an object using one or more pre-defined paths that are repeated at fixed intervals in a specified direction to cover the areas to be painted.
... the <hatch> svg element is used to fill or stroke an object using one or more pre-defined paths that are repeated at fixed intervals in a specified direction to cover the areas to be painted.
...And 8 more matches

Specification Deviations - SVG: Scalable Vector Graphics

Web › SVG › Specification Deviations

there are a few places where we have consciously decided to make gecko deviate from or extend the svg specification.
...xtend the svg specification.
...g for them.
...And 8 more matches

Basic Transformations - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › Basic Transformations

« previousnext » now we're ready to start distorting our beautiful images.
... « previousnext » now we're ready to start distorting our beautiful images.
...ut first, let's formally introduce the <g> element.
...And 8 more matches

SVG and CSS - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › SVG and CSS

this page illustrates the application of css to the specialized language for creating graphics: svg.
... this page illustrates the application of css to the specialized language for creating graphics: svg.
... this page illustrates the application of css to the specialized language for creating graphics: svg.
...And 8 more matches

core/namespace - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs › core namespace

provides an api for creating namespaces for objects, which effectively may be used for creating fields that are not part of objects public api.
...fectively may be used for creating fields that are not part of objects public api.
...may be used for creating fields that are not part of objects public api.
...And 7 more matches

ui/frame - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs › ui frame

omponents.
...used in conjunction with a toolbar: you create a frame, then supply it to the toolbar's constructor, and the content is then displayed inside the toolbar.
...ns "data" directory.
...And 7 more matches

align - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › align

« xul reference home align type: one of the values below the align attribute specifies how child elements of the box are aligned, when the size of the box is larger than the total size of the children.
...ifies how child elements of the box are aligned, when the size of the box is larger than the total size of the children.
...tion, it specifies how its children will be aligned horizontally.
...And 7 more matches

Creating a Window - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Creating a Window

ting a xul file an xul file can be given any name but it really should have a .xul extension.
... simplest xul file has the following structure: <?xml version="1.0"?> <?xml-stylesheet href="chrome://global/skin/" type="text/css"?> <window id="findfile-window" title="find files" orient="horizontal" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">  </window> this window will not do anything since it doesn't contain any ui elements.
...style sheets to use for the file.
...And 7 more matches

attribute.align - Archive of obsolete content

Archive › Mozilla › XUL › attribute.align

summary the align attribute specifies how child elements of the box are aligned, when the size of the box is larger than the total size of the children.
...zontal orientation, it specifies how its children will be aligned vertically.
...specify the position in the opposite direction.
...And 7 more matches

bindings - Archive of obsolete content

Archive › Mozilla › XUL › bindings

editor - Archive of obsolete content

Archive › Mozilla › XUL › editor

ment, contentwindow, docshell, editingsession, editortype, webbrowserfind, webnavigation methods geteditor, gethtmleditor, makeeditable examples this example shows how to made the editor editable by setting the designmode property of the loaded html document: <script language="javascript"> function initeditor(){ // this function is called to set up the editor var editor = document.getelementbyid("myeditor"); editor.contentdocument.designmode = 'on'; } </script> <editor id="myeditor" editortype="html" src="about:blank" flex="1" type="content-primary"/> once editable, the document can have special formatting and other html pieces added to it using the document.execcommand method: var editor = document.getelementbyid("myeditor"); // toggle bold for the current selection edit...
...ommand("bold", false, null); see the midas overview for more command strings.
... uri the uri of the content to appear in the element.
...And 7 more matches

observes - Archive of obsolete content

Archive › Mozilla › XUL › observes

« xul reference home [ examples | attributes | properties | methods | related ] the observes element can be used to listen to a broadcaster and receive events and attributes from it.
... « xul reference home [ examples | attributes | properties | methods | related ] the observes element can be used to listen to a broadcaster and receive events and attributes from it.
... « xul reference home [ examples | attributes | properties | methods | related ] the observes element can be used to listen to a broadcaster and receive events and attributes from it.
...And 7 more matches

Archived Mozilla and build documentation - Archive of obsolete content

Archive › Mozilla

create a registered sidebar for firefox 2 or greater.
...irefox 2 or greater.
... class overview this document provides an overview of the classes used by the mozilla http implementation.
...And 7 more matches

Back to the Server: Server-Side JavaScript On The Rise - Archive of obsolete content

Archive › Web › Server-Side JavaScript › Walkthrough

n the raw data var s = new java.io.inputstreamreader( c.getinputstream() ); var b = new java.io.bufferedreader( s ); var l, str = ""; while( ( l = b.readline() ) != null ) { // skip if( l != "" ) { str = str + l + "\n"; } } // define the namespaces, first the default, // then additional namespaces default xml namespace = "http://purl.org/rss/1.0/"; var dc = new namespace( "http://purl.org/dc/elements/1.1/" ); var rdf = new namespace( "http://www.w3.org/1999/02/22-rdf-syntax-ns#" ); // use e4x to process the feed var x = new xml( str ); for each( var i in x..item ) { print( "title: " + i.title + "\n" ); print( "about: " + i.@rdf::about + "\n" ); print( "link: " + i.link + "\n" ); print( "date: " + i.dc::date + "\n" ); } the first half of this script is standard ...
... ); } the first half of this script is standard java code used to retrieve the feed data.
...s important if we want to be able to access any data elements in the feed defined in these namespaces.
...And 7 more matches

Writing JavaScript for XHTML - Archive of obsolete content

Archive › Web › Writing JavaScript for HTML

]]></script>  <style type="text/css"><![cdata[/*><!--*/ ...
...ext/html (at least as far as xhtml 1.* and html 4; html5 addresses many of these problems).
...of mime type and browser.
...And 7 more matches

Semantics - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Semantics

in programming, semantics refers to the meaning of a piece of code — for example "what effect does running that line of javascript have?", or "what purpose or role does that html element have" (rather than "what does it look like?".) semantics in javascript in javascript, consider a function that takes a string parameter, and returns an <li> element with that string as its textcontent.
...have" (rather than "what does it look like?".) semantics in javascript in javascript, consider a function that takes a string parameter, and returns an <li> element with that string as its textcontent.
...extcontent.
...And 7 more matches

Advanced styling effects - Learn web development

Learn › CSS › Building blocks › Advanced styling effects

advanced styling features such as box shadows, blend modes, and filters.
... percentage we are setting how much color we want to be removed.
...t inside the box, not just the box itself as one big chunk, so it is worth knowing the difference.
...And 7 more matches

Organizing your CSS - Learn web development

Learn › CSS › Building blocks › Organizing

to the comments.
...tyle for data tables and lists and so on.
...re used.
...And 7 more matches

Test your skills: Selectors - Learn web development

Learn › CSS › Building blocks › Selectors › Selectors Tasks

ext.
...%.
...inished example: for assessment or further work purposes, download the starting point for this task to work in your own editor or in an online editor.
...And 7 more matches

Advanced form styling - Learn web development

Learn › Forms › Advanced form styling

s are perfectly easy to style; now we will dig into styling the bits that are more problematic.
...tanding of html and css.
...t parts of forms are hard to style, and why; to learn what can be done to customize them.
...And 7 more matches

The HTML5 input types - Learn web development

Learn › Forms › HTML5 input types

previous overview: forms next in the previous article we looked at the <input> element, covering the original values of the type attribute available since the early days of html.
...computer literacy, and a basic understanding of html.
...000"> <output class="price-output" for="price"></output> this example creates a slider whose value may range between 50000 and 500000, which increments/decrements by 100 at a time.
...And 7 more matches

Adding vector graphics to the Web - Learn web development

Learn › HTML › Multimedia and embedding › Adding vector graphics to the Web

e vector-versus-raster.html demo for a real example!
... on every pixel in the image individually.
...ages allow you to create a variety of illustrations using various graphics tools, and create approximations of photos (for example inkscape's trace bitmap feature.) svg has some additional advantages besides those described so far: text in vector images remains accessible (which also benefits your seo).
...And 7 more matches

Choosing the right approach - Learn web development

Learn › JavaScript › Asynchronous › Choosing the right approach

le that loads a resource via the xmlhttprequest api (run it live, and see the source): function loadasset(url, type, callback) { let xhr = new xmlhttprequest(); xhr.open('get', url); xhr.responsetype = type; xhr.onload = function() { callback(xhr.response); }; xhr.send(); } function displayimage(blob) { let objecturl = url.createobjecturl(blob); let image = document.createelement('img'); image.src = objecturl; document.body.appendchild(image); } loadasset('coffee.jpg', 'blob', displayimage); pitfalls nested callbacks can be cumbersome and hard to read (i.e.
...unction creates a new date() object, extracts a time string out of it using tolocaletimestring(), and then displays it in the ui.
...nother operation based on its result.
...And 7 more matches

Getting started with Svelte - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Svelte getting started

ntended for low power devices: applications built with svelte have smaller bundle sizes, which is ideal for devices with slow network connections and limited processing power.
... having a look at our first svelte component components are the building blocks of svelte applications.
... we are embedding the value of the name prop right after the hello text.
...And 7 more matches

Eclipse CDT

Mozilla › Developer guide › Eclipse › Eclipse CDT

bug 380511).
...f the header, that would not be ifdef'ed out - and in fact are required by - source files in other parts of the tree.
...fact are required by - source files in other parts of the tree.
...And 7 more matches

Creating localizable web applications

Mozilla › Localization › Web Localizability › Creating localizable web applications

ou detect user's locale, you may want to provide a way of overriding the autodetection.
...alized and english content.
...ocale and the direction in the html generate the lang attribute dynamically, depending on the current locale.
...And 7 more matches

L20n HTML Bindings

Mozilla › Projects › L20n › HTML Bindings

the l20n html bindings you can take advantage of html bindings to localize your html documents with l20n.
...> create manifest use a localization manifest to define available languages and their resource files.
...able languages and their resource files.
...And 7 more matches

JS_NewArrayObject

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS NewArrayObject

t * js_newarrayobject(jscontext *cx, int length, jsval *vector); // obsolete since jsapi 30 name type description cx jscontext * the context in which to create the new array.
...ay.
...o the initial values for the array's elements.
...And 7 more matches

nsIScriptableUnescapeHTML

Mozilla › Tech › XPCOM › Reference › Interface › nsIScriptableUnescapeHTML

he nsiparserutils interface.
...rserutils interface.
...scapehtml); method overview nsidomdocumentfragment parsefragment(in astring fragment, in prbool isxml, in nsiuri baseuri, in nsidomelement element); astring unescape(in astring src); methods parsefragment() parses a string of html or xml source into a sanitized documentfragment.
...And 7 more matches

Working with data

Mozilla › js-ctypes › Using js-ctypes › Working with data

ct.
...the array's data buffer is 20 bytes (5 entries, 4 bytes apiece).
...g an array of strings var cstr1 = ctypes.jschar.array()('rawr'); var cstr2 = ctypes.jschar.array()('boo'); var mycarray_ofstrings = ctypes.jschar.ptr.array(2)([cstr1, cstr2]); // specifying length of 2 is optional, can omit it, so can just do `ctypes.jschar.ptr.array()([cstr1, cstr2])` mycarray_ofstrings.addressofelement(0).contents.readstring(); // outputs: "rawr" mycarray_ofstrings.addressofelement(1).contents.readstring(); // outputs: "boo" example: creating an array of integers var jsarr = [4, 10]; var mycarr = ctypes.int.array(jsarr.length)(jsarr); // specifying length is optional, can omit.
...And 7 more matches

Waterfall - Firefox Developer Tools

Tools › Performance › Waterfall

to functions.
...o page elements.
...e in the waterfall view is something like this: this is a visualization of the basic algorithm the browser uses to update the page in response to some event: javascript function call: some event - for example, a dom event - causes some javascript in the page to run.
...And 7 more matches

AudioTrackList - Web APIs

Web › API › AudioTrackList

the audiotracklist interface is used to represent a list of the audio tracks contained within a given html media element, with each track represented by a separate audiotrack object in the list.
... the audiotracklist interface is used to represent a list of the audio tracks contained within a given html media element, with each track represented by a separate audiotrack object in the list.
...with htmlmediaelement.audiotracks.
...And 7 more matches

ChildNode.after() - Web APIs

Web › API › ChildNode › after

en list of this childnode's parent, just after this childnode.
...ust after this childnode.
... are inserted as equivalent text nodes.
...And 7 more matches

Document: fullscreenchange event - Web APIs

Web › API › Document › fullscreenchange event

the fullscreenchange event is fired immediately after the browser switches into or out of full-screen mode.
...creenchange event is fired immediately after the browser switches into or out of full-screen mode.
... bubbles yes cancelable no interface event event handler property onfullscreenchange the event is sent to the element that is transitioning into or out of full-screen mode, and this event then bubbles up to the document.
...And 7 more matches

DocumentOrShadowRoot - Web APIs

Web › API › DocumentOrShadowRoot

the documentorshadowroot mixin of the shadow dom api provides apis that are shared between documents and shadow roots.
... the documentorshadowroot mixin of the shadow dom api provides apis that are shared between documents and shadow roots.
... the documentorshadowroot mixin of the shadow dom api provides apis that are shared between documents and shadow roots.
...And 7 more matches

IntersectionObserver.observe() - Web APIs

Web › API › IntersectionObserver › observe

the intersectionobserver method observe() adds an element to the set of target elements being watched by the intersectionobserver.
... the intersectionobserver method observe() adds an element to the set of target elements being watched by the intersectionobserver.
... the intersectionobserver method observe() adds an element to the set of target elements being watched by the intersectionobserver.
...And 7 more matches

MediaStream Recording API - Web APIs

Web › API › MediaStream Recording API

the mediastream recording api, sometimes simply referred to as the media recording api or the mediarecorder api, is closely affiliated with the media capture and streams api and the webrtc api.
...he work of taking the data from a mediastream and delivering it to you for processing.
...and delivering it to you for processing.
...And 7 more matches

Media Source API - Web APIs

Web › API › Media Source Extensions API

the media source api, formally known as media source extensions (mse), provides functionality enabling plugin-free web-based streaming media.
...y only been useful for playing single whole tracks.
... not suitable for real time communication like webrtc is.
...And 7 more matches

Microsoft API extensions - Web APIs

Web › API › Microsoft Extensions

microsoft browsers (internet explorer, and in a few cases, microsoft edge) support a number of special microsoft extensions to the otherwise standard dom apis.
...) support a number of special microsoft extensions to the otherwise standard dom apis.
...crosoft extensions to the otherwise standard dom apis.
...And 7 more matches

Range.setStart() - Web APIs

Web › API › Range › setStart

e end point will result in a collapsed range with the start and end points both set to the specified start position.
...nteger greater than or equal to zero representing the offset for the start of the range from the start of startnode.
...etend() methods to add part of an address to a range.
...And 7 more matches

Using the Screen Capture API - Web APIs

Web › API › Screen Capture API › Using Screen Capture

unless authorization has been given to share that content specifically.
...en capture in this example, the contents of the captured screen area are simply streamed into a <video> element on the same page.
...tdisplaymedia(); here, the cursor property is set to always, indicating that the mouse cursor should always be included in the captured media.
...And 7 more matches

Slottable: assignedSlot - Web APIs

Web › API › Slottable › assignedSlot

the assignedslot read-only property of the slottable interface returns an htmlslotelement representing the <slot> element the node is inserted in.
... the assignedslot read-only property of the slottable interface returns an htmlslotelement representing the <slot> element the node is inserted in.
... the assignedslot read-only property of the slottable interface returns an htmlslotelement representing the <slot> element the node is inserted in.
...And 7 more matches

Text - Web APIs

Web › API › Text

the text interface represents the textual content of element or attr.
... the text interface represents the textual content of element or attr.
... the text interface represents the textual content of element or attr.
...And 7 more matches

TextTrackList - Web APIs

Web › API › TextTrackList

the texttracklist interface is used to represent a list of the text tracks defined by the <track> element, with each track represented by a separate texttrack object in the list.
... the texttracklist interface is used to represent a list of the text tracks defined by the <track> element, with each track represented by a separate texttrack object in the list.
...ividual tracks can be accessed using array syntax or functions such as foreach() for example.
...And 7 more matches

Touch.target - Web APIs

Web › API › Touch › target

summary returns the element (eventtarget) on which the touch contact started when it was first placed on the surface, even if the touch point has since moved outside the interactive area of that element or even been removed from the document.
... summary returns the element (eventtarget) on which the touch contact started when it was first placed on the surface, even if the touch point has since moved outside the interactive area of that element or even been removed from the document.
...on which the touch contact started when it was first placed on the surface, even if the touch point has since moved outside the interactive area of that element or even been removed from the document.
...And 7 more matches

VideoTrackList - Web APIs

Web › API › VideoTrackList

the videotracklist interface is used to represent a list of the video tracks contained within a <video> element, with each track represented by a separate videotrack object in the list.
... the videotracklist interface is used to represent a list of the video tracks contained within a <video> element, with each track represented by a separate videotrack object in the list.
...perties this interface also inherits properties from its parent interface, eventtarget.
...And 7 more matches

WebGLRenderingContext.texImage2D() - Web APIs

Web › API › WebGLRenderingContext › texImage2D

the webglrenderingcontext.teximage2d() method of the webgl api specifies a two-dimensional texture image.
...al texture image.
...th, height, border, format, type, arraybufferview?
...And 7 more matches

WebGL best practices - Web APIs

Web › API › WebGL API › WebGL best practices

fully adapting to the case there they are not supported.
...trade off quality for speed is rendering into a smaller backbuffer, and upscaling the result.
...ents and formats are actually inseparable on many devices.
...And 7 more matches

Web Animations API - Web APIs

Web › API › Web Animations API

the web animations api allows for synchronizing and timing changes to the presentation of a web page, i.e.
... the web animations api allows for synchronizing and timing changes to the presentation of a web page, i.e.
...ine represents the timeline of animation.
...And 7 more matches

Using the Web Speech API - Web APIs

Web › API › Web Speech API › Using the Web Speech API

orrect one from.
...ch.synth.enabled flag to true in about:config.
...div class="clearfix"></div> </div> <div> <label for="pitch">pitch</label><input type="range" min="0" max="2" value="1" step="0.1" id="pitch"> <div class="pitch-value">1</div> <div class="clearfix"></div> </div> <select> </select> </form> javascript let's investigate the javascript that powers this app.
...And 7 more matches

ARIA: switch role - Accessibility

Web › Accessibility › ARIA › Roles › Switch role

ot support the value mixed for the aria-checked attribute; assigning a value of mixed to a switch instead sets the value to false.
...icks on the switch widget, a click event is fired, which must be handled in order to change the state of the widget.
...ich must be handled in order to change the state of the widget.
...And 7 more matches

ARIA: checkbox role - Accessibility

Web › Accessibility › ARIA › Roles › checkbox role

the checkbox role is used for checkable interactive controls.
... the checkbox role is used for checkable interactive controls.
...kbox" must also include the aria-checked attribute to expose the checkbox's state to assistive technology.
...And 7 more matches

HTML To MSAA - Accessibility

Web › Accessibility › HTML To MSAA

remarks the table below shows how gecko maps html elements to msaa.
... remarks the table below shows how gecko maps html elements to msaa.
... remarks the table below shows how gecko maps html elements to msaa.
...And 7 more matches

@namespace - CSS: Cascading Style Sheets

Web › CSS › @namespace

an at-rule that defines xml namespaces to be used in a css style sheet.
...vg or mathml, or xml that mixes multiple vocabularies.
...pace for the style sheet.
...And 7 more matches

Border-radius generator - CSS: Cascading Style Sheets

Web › CSS › CSS Background and Borders › Border-radius generator

#999; border-radius: 3px; -moz-user-select: text; -webkit-user-select: text; -ms-user-select: text; user-select: text; float: right; } javascript content 'use strict'; /** * ui-inputslidermanager */ var inputslidermanager = (function inputslidermanager() { var subscribers = {}; var sliders = []; var inputcomponent = function inputcomponent(obj) { var input = document.createelement('input'); input.setattribute('type', 'text'); input.addeventlistener('click', function(e) { this.select(); }); input.addeventlistener('change', function(e) { var value = parseint(e.target.value); if (isnan(value) === true) setvalue(obj.topic, obj.value); else setvalue(obj.topic, value); }); subscribe(obj.topic, function(value) { input.value = value + obj.uni...
... input.addeventlistener('change', function(e) { var value = parseint(e.target.value); if (isnan(value) === true) setvalue(obj.topic, obj.value); else setvalue(obj.topic, value); }); subscribe(obj.topic, function(value) { input.value = value + obj.unit; }); return input; } var slidercomponent = function slidercomponent(obj, sign) { var slider = document.createelement('div'); var startx = null; var start_value = 0; slider.addeventlistener("click", function(e) { setvalue(obj.topic, obj.value + obj.step * sign); }); slider.addeventlistener("mousedown", function(e) { startx = e.clientx; start_value = obj.value; document.body.style.cursor = "e-resize"; document.addeventlistener("mousemove", slidermotion); }); document.addeventlisten...
...is.topic = topic; this.node = node; this.unit = unit; this.sensivity = sensivity > 0 ?
...And 7 more matches

Spanning and Balancing Columns - CSS: Cascading Style Sheets

Web › CSS › CSS Columns › Spanning Columns

in this guide we look at how to make elements span across columns inside the multicol container and how to control how the columns are filled.
...umns inside the multicol container and how to control how the columns are filled.
...l how the columns are filled.
...And 7 more matches

CSS Grid Layout and Accessibility - CSS: Cascading Style Sheets

Web › CSS › CSS Grid Layout › CSS Grid Layout and Accessibility

create a semantic and well structured document, then apply css to create the layout we desired.
...rolling through a long document on mobile, the priorities for that user quite often map to what should be a priority in the source.
...o keep testing, a very simple test is to tab around the document.
...And 7 more matches

Using CSS transforms - CSS: Cascading Style Sheets

Web › CSS › CSS Transforms › Using CSS transforms

by modifying the coordinate space, css transforms change the shape and position of the affected content without disrupting the normal document flow.
... the shape and position of the affected content without disrupting the normal document flow.
...cument flow.
...And 7 more matches

box-flex-group - CSS: Cascading Style Sheets

Web › CSS › box-flex-group

this is a property of the original css flexible box layout module draft, and has been replaced by a newer standard.
...nal css flexible box layout module draft, and has been replaced by a newer standard.
...ments to a flex group.
...And 7 more matches

box-shadow - CSS: Cascading Style Sheets

Web › CSS › box-shadow

the box-shadow css property adds shadow effects around an element's frame.
... the box-shadow css property adds shadow effects around an element's frame.
...ribed by x and y offsets relative to the element, blur and spread radius, and color.
...And 7 more matches

clip-path - CSS: Cascading Style Sheets

Web › CSS › clip-path

the clip-path css property creates a clipping region that sets what part of an element should be shown.
...0.7,0,0.3 a0.25,0.25,1,1,1,0.5,0.3 a0.25,0.25,1,1,1,1,0.3 c1,0.7,0.5,1,0.5,1 z'); /* box and shape values combined */ clip-path: padding-box circle(50px at 0 100px); /* global values */ clip-path: inherit; clip-path: initial; clip-path: unset; the clip-path property is specified as one or a combination of the values listed below.
... uses the border box as the reference box.
...And 7 more matches

<color> - CSS: Cascading Style Sheets

Web › CSS › color value

following ways: using a keyword (such as blue or transparent) using the rgb cubic-coordinate system (via the #-hexadecimal or the rgb() and rgba() functional notations) using the hsl cylindrical-coordinate system (via the hsl() and hsla() functional notations) note: this article describes the <color> data type in detail.
...ed instead of a regular <color> value on two css properties: background and border.
... the css color module.
...And 7 more matches

font - CSS: Cascading Style Sheets

Web › CSS › font

the font css shorthand property sets all the different properties of an element's font.
... the font css shorthand property sets all the different properties of an element's font.
...efixed, keywords: gecko implements -moz-window, -moz-document, -moz-desktop, -moz-info, -moz-dialog, -moz-button, -moz-pull-down-menu, -moz-list, and -moz-field.
...And 7 more matches

transform-style - CSS: Cascading Style Sheets

Web › CSS › transform-style

the transform-style css property sets whether children of an element are positioned in the 3d space or are flattened in the plane of the element.
... the transform-style css property sets whether children of an element are positioned in the 3d space or are flattened in the plane of the element.
...t.
...And 7 more matches

The HTML autocomplete attribute - HTML: Hypertext Markup Language

Web › HTML › Attributes › autocomplete

the html autocomplete attribute is available on <input> elements that take a text or numeric value as input, <textarea> elements, <select> elements, and <form> elements.
...e from past values entered by the user, but they may also come from pre-configured values.
...for instance, a browser might let the user save their name, address, phone number, and email addresses for autocomplete purposes.
...And 7 more matches

Allowing cross-origin use of images and canvas - HTML: Hypertext Markup Language

Web › HTML › CORS enabled image

html provides a crossorigin attribute for images that, in combination with an appropriate cors header, allows images defined by the <img> element that are loaded from foreign origins to be used in a <canvas> as if they had been loaded from the current origin.
...table that security problems may arise.
...s becomes tainted.
...And 7 more matches

<area> - HTML: Hypertext Markup Language

Web › HTML › Element › area

the html <area> element defines a hot-spot region on an image, and optionally associates it with a hypertext link.
... the html <area> element defines a hot-spot region on an image, and optionally associates it with a hypertext link.
... the html <area> element defines a hot-spot region on an image, and optionally associates it with a hypertext link.
...And 7 more matches

<hgroup> - HTML: Hypertext Markup Language

Web › HTML › Element › hgroup

the html <hgroup> element represents a multi-level heading for a section of a document.
... the html <hgroup> element represents a multi-level heading for a section of a document.
...o the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 7 more matches

<input type="password"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › password

<input> elements of type password provide a way for the user to securely enter a password.
... <input> elements of type password provide a way for the user to securely enter a password.
...ly considered valid if the value passes validation; see validation for more information.
...And 7 more matches

<optgroup> - HTML: Hypertext Markup Language

Web › HTML › Element › optgroup

the html <optgroup> element creates a grouping of options within a <select> element.
... html <optgroup> element creates a grouping of options within a <select> element.
... for this interactive example is stored in a github repository.
...And 7 more matches

TypeError: Reduce of empty array with no initial value - JavaScript

Web › JavaScript › Reference › Errors › Reduce of empty array with no initial value

rror what went wrong?
...ck).
...pty array is provided because no initial value can be returned in that case.
...And 7 more matches

Arrow function expressions - JavaScript

Web › JavaScript › Reference › Functions › Arrow functions

= defaultvaluen) => { statements } // destructuring within the parameter list is also supported var f = ([a, b] = [1, 2], {x: c} = {x: a + b}) => a + b + c; f(); // 6 description see also "es6 in depth: arrow functions" on hacks.mozilla.org.
...], {x: c} = {x: a + b}) => a + b + c; f(); // 6 description see also "es6 in depth: arrow functions" on hacks.mozilla.org.
...) => a + b + c; f(); // 6 description see also "es6 in depth: arrow functions" on hacks.mozilla.org.
...And 7 more matches

Functions - JavaScript

Web › JavaScript › Reference › Functions

= (new function("var bar = \'foo!\';\nreturn(function() {\n\talert(bar);\n});"))(); foo(); // the segment "function() {\n\talert(bar);\n}" of the function body string is not re-parsed.
... {\n\talert(bar);\n});"))(); foo(); // the segment "function() {\n\talert(bar);\n}" of the function body string is not re-parsed.
...tring is not re-parsed.
...And 7 more matches

Array() constructor - JavaScript

Web › JavaScript › Reference › Global Objects › Array › Array

the array() constructor is used to create array objects.
... the array() constructor is used to create array objects.
... the array() constructor is used to create array objects.
...And 7 more matches

Array.prototype.push() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › push

the push() method adds one or more elements to the end of an array and returns the new length of the array.
... the push() method adds one or more elements to the end of an array and returns the new length of the array.
... the push() method adds one or more elements to the end of an array and returns the new length of the array.
...And 7 more matches

Array.prototype.shift() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › shift

the shift() method removes the first element from an array and returns that removed element.
...ethod removes the first element from an array and returns that removed element.
...the length of the array.
...And 7 more matches

Array.prototype.slice() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › slice

d in a github repository.
...icating an offset from the end of the sequence.
...end of the sequence.
...And 7 more matches

Set - JavaScript

Web › JavaScript › Reference › Global Objects › Set

the set object lets you store unique values of any type, whether primitive values or object references.
...== nan).
...rties get set[@@species] the constructor function that is used to create derived objects.
...And 7 more matches

Populating the page: how browsers work - Web Performance

Web › Performance › How browsers work

e html markup and building the dom tree.
... scanner will find the scripts and image, and start downloading them as well.
...e dom is updated.
...And 7 more matches

Media - Progressive web apps (PWAs)

Web › Progressive web apps › Responsive › Media types

media have different characteristics.
...t according to the media type.
...edia projection projected display all all media (the default) more details there are other ways to specify the media type for a set of rules.
...And 7 more matches

enable-background - SVG: Scalable Vector Graphics

Web › SVG › Attribute › enable-background

the enable-background attribute specifies how the accumulation of the background image is managed.
... the enable-background attribute specifies how the accumulation of the background image is managed.
...on attribute, it can be applied to any element but it has effect only on the following eleven elements: <a>, <defs>, <glyph>, <g>, <marker>, <mask>, <missing-glyph>, <pattern>, <svg>, <switch>, and <symbol> context notes value accumulate | new [ <x> <y> <width> <height> ]?
...And 7 more matches

gradientUnits - SVG: Scalable Vector Graphics

Web › SVG › Attribute › gradientUnits

the gradientunits attribute defines the coordinate system used for attributes specified on the gradient elements.
... the gradientunits attribute defines the coordinate system used for attributes specified on the gradient elements.
...s the coordinate system used for the attributes x1, y1, x2, and y2.
...And 7 more matches

patternContentUnits - SVG: Scalable Vector Graphics

Web › SVG › Attribute › patternContentUnits

the patterncontentunits attribute indicates which coordinate system to use for the contents of the <pattern> element.
... the patterncontentunits attribute indicates which coordinate system to use for the contents of the <pattern> element.
... the patterncontentunits attribute indicates which coordinate system to use for the contents of the <pattern> element.
...And 7 more matches

type - SVG: Scalable Vector Graphics

Web › SVG › Attribute › type

the type attribute is a generic attribute and it has different meaning based on the context in which it's used.
... the type attribute is a generic attribute and it has different meaning based on the context in which it's used.
...formation, whose values change over time.
...And 7 more matches

<animateColor> - SVG: Scalable Vector Graphics

Web › SVG › Element › animateColor

this element has been deprecated in svg 1.1 second edition and may be removed in a future version of svg.
... this element has been deprecated in svg 1.1 second edition and may be removed in a future version of svg.
... this element has been deprecated in svg 1.1 second edition and may be removed in a future version of svg.
...And 7 more matches

<clipPath> - SVG: Scalable Vector Graphics

Web › SVG › Element › clipPath

the <clippath> svg element defines a clipping path, to be used by the clip-path property.
...side the clip circle is visible.
...clip-path="url(#myclip)" xlink:href="#heart" fill="red" /> </svg> /* with a touch of css for browsers who * * implemented the r geometry property.
...And 7 more matches

<desc> - SVG: Scalable Vector Graphics

Web › SVG › Element › desc

the <desc> element provides an accessible, long-text description of any svg container element or graphics element.
... the <desc> element provides an accessible, long-text description of any svg container element or graphics element.
... the <desc> element provides an accessible, long-text description of any svg container element or graphics element.
...And 7 more matches

Basic shapes - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › Basic Shapes

« previousnext » there are several basic shapes used for most svg drawing.
...obvious from their names.
...he parameters that determine their position and size are given, but an element reference would probably contain more accurate and complete descriptions along with other properties that won't be covered in here.
...And 7 more matches

An Overview - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Transforming XML with XSLT › An Overview

lows.
..., which has its own specialized syntax, an xslt stylesheet is an xml document, which must conform to all xml rules, including well-formedness.
...et is an xml document, which must conform to all xml rules, including well-formedness.
...And 7 more matches

Using the WebAssembly JavaScript API - WebAssembly

WebAssembly › Using the JavaScript API

rt "imports" "imported_func") (param i32)) (func (export "exported_func") i32.const 42 call $i)) in the second line, you will see that the import has a two-level namespace — the internal function $i is imported from imports.imported_func.
...ry objects.
...ssembly table is a resizable typed array of references that can be accessed by both javascript and webassembly code.
...And 7 more matches

widget - Archive of obsolete content

Archive › Add-ons › Add-on SDK › High-Level APIs › widget

id="pause-button"> <img src="stop.png" id="stop-button"> </body> </html> we just include three icons, and assign an id to each one.
... id to each one.
...a content script that listens for click events on each icon and sends the corresponding message to the main add-on code: var play_button = document.getelementbyid("play-button"); play_button.onclick = function() { self.port.emit("play"); } var pause_button = document.getelementbyid("pause-button"); pause_button.onclick = function() { self.port.emit("pause"); } var stop_button = document.getelementbyid("stop-button"); stop_button.onclick = function() { self.port.emit("stop"); } we save this file in the add-on's data directory as "button-script.js".
...And 6 more matches

remote/parent - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs › remote parent

as at least one process running, the main process that displays the ui.
...=> { // ask for the process id process.port.emit("fetchid"); // first argument is always the process, then the message payload process.port.once("id", (process, id) => { console.log("child process is remote:" + process.isremote); console.log("child process id:" + id); }); }); content frame manipulation this demonstrates telling every current frame to link to a specific anchor element: // remote.js const { frames } = require("sdk/remote/child"); // listeners receive the frame the event was for as the first argument frames.port.on("changelocation", (frame, ref) => { frame.content.location += "#" + ref; }); // main.js const { frames, remoterequire } = require("sdk/remote/parent"); remoterequire("./remote.js", module); frames.port.emit("changelocation", "foo"); tab infor...
...rames.addeventlistener("pageshow", function() { // `this` is bound to the frame the event came from let frame = this; frame.port.emit("pageshow"); }, true); // main.js const { frames, remoterequire } = require("sdk/remote/parent"); remoterequire("./remote.js", module); // the first argument is the frame the message came from frames.port.on("pageshow", (frame) => { console.log(frame.frameelement.currenturi.host + ": pageshow"); }); globals functions remoterequire(id, module = null) loads a module in any existing and future child processes.
...And 6 more matches

util/list - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs › util list

experimental building blocks for composing lists.
... experimental building blocks for composing lists.
... experimental building blocks for composing lists.
...And 6 more matches

Miscellaneous - Archive of obsolete content

Archive › Add-ons › Code snippets › Miscellaneous

/sou...pdates.js#1639 for firefox 2 see around here: http://mxr.mozilla.org/mozilla1.8/so...pdates.js#1631 bug 338039 tracks improving this situation by providing a simple method to restart the application.
...area.
...ntext menus.
...And 6 more matches

Sidebar - Archive of obsolete content

Archive › Add-ons › Code snippets › Sidebar

use window.sidebar to create bookmark with that property.
... script the sidebar content is always in a document separate from the main browser document (the sidebar is actually implemented as a xul browser element).
...lement).
...And 6 more matches

Communication between HTML and your extension - Archive of obsolete content

Archive › Add-ons › Communication between HTML and your extension

nts are more designed for creating custom components and their specific component behavior rather than trying to impose some kind of messaging on existing components.
...ful of events and the w3c documentation is pretty complete.
... javascript function that would update a specific element on the html page with the result.
...And 6 more matches

Chapter 4: Using XPCOM—Implementing advanced processes - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › Firefox addons developer guide › Using XPCOM—Implementing advanced processes

s it possible to access all of firefox's windows.
...gth); get overview of all windows with a certain type use the nsiwindowmediator.getenumerator() method to get an overview of all windows that have a certain type.
...ows var browsers = windowmediator.getenumerator('navigator:browser'); var browser; while (browsers.hasmoreelements()) { browser = browsers.getnext().queryinterface(components.interfaces.nsidomwindowinternal); browser.browsertrytoclosewindow(); } this method returns an overview of the specified window type in the form of an iterator pattern object called nsisimpleenumerator.
...And 6 more matches

Adding menus and submenus - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › Adding menus and submenus

you can do with them.
...nu we already saw how to add menus in overlays and, as you may have imagined, you can nest submenus as deep as you want.
... oncommand="xulschoolchrome.greetingdialog.greetingcustom(event);" /> </menupopup> </menu> </menubar> </toolbox> this code displays a simple menu with options for 3 different types of greetings, a menuseparator, and finally an option to show a custom greeting.
...And 6 more matches

Handling Preferences - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › Handling Preferences

apply until the user click on the ok button.
...nstead of being able to ignore the preferences window.
...he prefpane element.
...And 6 more matches

XBL - Archive of obsolete content

Archive › Mozilla › XBL

tracked in bug 1397874 and are we xbl still?.
...e xbl still?.
...racked in bug 1566221.
...And 6 more matches

datasources - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › datasources

« xul reference home datasources type: space separated list of datasource uris a space-separated list of datasources that an element's template will use for content generation.
... « xul reference home datasources type: space separated list of datasource uris a space-separated list of datasources that an element's template will use for content generation.
... « xul reference home datasources type: space separated list of datasource uris a space-separated list of datasources that an element's template will use for content generation.
...And 6 more matches

mousethrough - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › mousethrough

« xul reference home mousethrough type: one of the values below determines whether mouse events are passed to the element or not.
... « xul reference home mousethrough type: one of the values below determines whether mouse events are passed to the element or not.
... « xul reference home mousethrough type: one of the values below determines whether mouse events are passed to the element or not.
...And 6 more matches

showPopup - Archive of obsolete content

Archive › Mozilla › XUL › Method › showPopup

« xul reference home showpopup( element, x, y, popuptype, anchor, align ) deprecated since gecko 1.9 return type: no return value deprecated in favor of openpopup and openpopupatscreen opens a popup element.
... « xul reference home showpopup( element, x, y, popuptype, anchor, align ) deprecated since gecko 1.9 return type: no return value deprecated in favor of openpopup and openpopupatscreen opens a popup element.
...turn type: no return value deprecated in favor of openpopup and openpopupatscreen opens a popup element.
...And 6 more matches

Multiple Queries - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Multiple Queries

« previousnext » so far, every template has contained only a single query, even for recursive content.
... « previousnext » so far, every template has contained only a single query, even for recursive content.
... so far, every template has contained only a single query, even for recursive content.
...And 6 more matches

Multiple Rules - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Multiple Rules

« previousnext » all of the examples shown so far have used only a single rule.
...t didn't match earlier rules to match this last rule.
...</action> </rule> <rule> <action> <image uri="?photo" src="?photo"/> </action> </rule> </template> </hbox> this template contains a query with two rules.
...And 6 more matches

Creating Dialogs - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Creating Dialogs

e platform the application is running on.
...ents as you wish.
...content/showdetails.xul","showmore", "chrome",somefile); in this example the dialog showdetails.xul is displayed.
...And 6 more matches

columns - Archive of obsolete content

Archive › Mozilla › XUL › columns

dialog - Archive of obsolete content

Archive › Mozilla › XUL › dialog

« xul reference home [ examples | attributes | properties | methods | related ] this element should be used in place of the window element for dialog boxes.
... enter key is pressed.
...his should be set to one of the same values as those for the buttons attribute.
...And 6 more matches

menubar - Archive of obsolete content

Archive › Mozilla › XUL › menubar

separator - Archive of obsolete content

Archive › Mozilla › XUL › separator

« xul reference home [ examples | attributes | properties | methods | related ] creates a small separating gap between elements.
...all size (usually 1.5 ems).
... groove, groove-thin, thin examples <separator class="groove-thin"/> attributes orient type: one of the values below used to specify whether the separator is a horizontal or vertical separator.
...And 6 more matches

treerow - Archive of obsolete content

Archive › Mozilla › XUL › treerow

title - Archive of obsolete content

Archive › RSS elements › title

rsstitle element <title>...</title> - the rss title element has 4 uses.
... rsstitle element <title>...</title> - the rss title element has 4 uses.
... <url>http://www.advogato.org/image/tinyadvogato.png</url> </image> <item> <title>why can i not get any tang?!</title> <link>http://www.advogato.org/article/10101.html</link> <description>seriously.
...And 6 more matches

Browser Feature Detection - Archive of obsolete content

Archive › Web › Browser feature detection

0% 100% 100% / 100% 96% / 96% dom css 2 100% 98% 67% 71% / 83% 38% / 42% test results cross reference dom core level 1 support for properties/methods in document name firefox 1.5 ie 6 & 7 opera 8.54 - 9.01 document.doctype true true true document.implementation true true true document.documentelement true true true document.createelement() true true true document.createdocumentfragment() true true true document.createtextnode() true true true document.createcomment() true true true document.createcdatasection() true false true document.createprocessinginstruction() true false t...
...ocument.createcomment() true true true document.createcdatasection() true false true document.createprocessinginstruction() true false true document.createattribute() true true true document.createentityreference()obsolete since gecko 7 (method present but only returns null: bug 9850) false false document.getelementsbytagname() true true true dom core level 2 support for properties/methods in document name firefox 1.5 ie 6 & 7 opera 8.54 - 9.01 document.doctype true true true document.implementation true true true document.documentelement true true true document.createelement() true true true ...
...extnode() true true true document.createcomment() true true true document.createcdatasection() true false true document.createprocessinginstruction() true false true document.createattribute() true true true document.createentityreference()obsolete since gecko 7 true false false document.getelementsbytagname() true true true document.importnode() true false true document.createelementns() true false true document.createattributens() true false true document.getelementsbytagnamens() true false true document.getelementbyid() true true true dom level 1 html support for properties/method...
...And 6 more matches

-ms-overflow-style - Archive of obsolete content

Archive › Web › CSS › -ms-overflow-style

the -ms-overflow-style css property is a microsoft extension controlling the behavior of scrollbars when the content of an element overflows.
... the -ms-overflow-style css property is a microsoft extension controlling the behavior of scrollbars when the content of an element overflows.
... the -ms-overflow-style css property is a microsoft extension controlling the behavior of scrollbars when the content of an element overflows.
...And 6 more matches

-ms-wrap-through - Archive of obsolete content

Archive › Web › CSS › -ms-wrap-through

the -ms-wrap-through css property is a microsoft extension that specifies how content should wrap around an exclusion element.
... the -ms-wrap-through css property is a microsoft extension that specifies how content should wrap around an exclusion element.
... the -ms-wrap-through css property is a microsoft extension that specifies how content should wrap around an exclusion element.
...And 6 more matches

Fixing Table Inheritance in Quirks Mode - Archive of obsolete content

Archive › Web Standards › Fixing Table Inheritance in Quirks Mode

summary: when in quirks mode, gecko-based browsers will appear to ignore inheritance of font styles into tables from parent elements.
...en in quirks mode, gecko-based browsers will appear to ignore inheritance of font styles into tables from parent elements.
..., for example, the font size of text within a table would match the user's default, not the body style.
...And 6 more matches

XUL Parser in Python - Archive of obsolete content

Archive › XUL Parser in Python

warning: the content of this article may be out of date.
...e activestate's recent announcement about support for perl and python in mozilla, i have put together this little python script that parses your local xul and builds a list of all the xul elements and their attributes in an html page.
...s your local xul and builds a list of all the xul elements and their attributes in an html page.
...And 6 more matches

Fundamental CSS comprehension - Learn web development

Learn › CSS › Building blocks › Fundamental CSS comprehension

o — just make sure the image is square.
...that you'll need to study and combine to answer part of this assessment.
... write the necessary css to style this into a nifty little online business card, which can perhaps double as a gamer card or social media profile.
...And 6 more matches

Styling lists - Learn web development

Learn › CSS › Styling text › Styling lists

ther ingredients.</dd> <dt>pita</dt> <dd>a soft, slightly leavened flatbread.</dd> <dt>halloumi</dt> <dd>a semi-hard, unripened, brined cheese with a higher-than-usual melting point, usually made from goat/sheep milk.</dd> <dt>green salad</dt> <dd>that green healthy stuff that many of us just use to garnish kebabs.</dd> </dl> if you go to the live example now and investigate the list elements using browser developer tools, you'll notice a couple of styling defaults: the <ul> and <ol> elements have a top and bottom margin of 16px (1em) and a padding-left of 40px (2.5em.) the list items (<li> elements) have no set defaults for spacing.
... healthy stuff that many of us just use to garnish kebabs.</dd> </dl> if you go to the live example now and investigate the list elements using browser developer tools, you'll notice a couple of styling defaults: the <ul> and <ol> elements have a top and bottom margin of 16px (1em) and a padding-left of 40px (2.5em.) the list items (<li> elements) have no set defaults for spacing.
...to the live example now and investigate the list elements using browser developer tools, you'll notice a couple of styling defaults: the <ul> and <ol> elements have a top and bottom margin of 16px (1em) and a padding-left of 40px (2.5em.) the list items (<li> elements) have no set defaults for spacing.
...And 6 more matches

JavaScript basics - Learn web development

Learn › Getting started with the web › JavaScript basics

he rest of our course, download this example code and use it as a starting point.
...n have an effect on the html (along with the css, and anything else on the page).
...this dependency.
...And 6 more matches

Add a hitmap on top of an image - Learn web development

Learn › HTML › Howto › Add a hit map on top of an image

tap comfortably, at any viewport size.
...ets.
...nish appropriate alt text in the <area> elements later on.
...And 6 more matches

Cooperative asynchronous JavaScript: Timeouts and intervals - Learn web development

Learn › JavaScript › Asynchronous › Timeouts and intervals

ates a new date() object, extracts a time string out of it using tolocaletimestring(), and then displays it in the ui.
... example, you should probably use css animations to run this kind of simple animation.
...the page, sets the <body> height to 100% of the <html> height, and centers the <div> inside the <body>, horizontally and vertically.
...And 6 more matches

Looping code - Learn web development

Learn › JavaScript › Building blocks › Looping code

essive iteration of the loop, which means that you can complete a whole load of tasks that are similar but slightly different — if you've got a lot of different calculations to do, you want to do each different one, not the same one over and over again!
... body { margin: 0; } button { position: absolute; top: 5px; left: 5px; } </style> </head> <body> <button>update</button> <canvas></canvas> <script> const btn = document.queryselector('button'); const canvas = document.queryselector('canvas'); const ctx = canvas.getcontext('2d'); let width = document.documentelement.clientwidth; let height = document.documentelement.clientheight; canvas.width = width; canvas.height = height; function random(number) { return math.floor(math.random()*number); } function draw() { ctx.clearrect(0,0,width,height); for (let i = 0; i < 100; i++) { ctx.beginpath(); ctx.fillstyle = 'rgba(255,0,0,0.5)'; ctx.arc(rando...
...statement and moves onto the code after it.
...And 6 more matches

Useful string methods - Learn web development

Learn › JavaScript › First steps › Useful string methods

love', 'a happy christmas to all the family', 'you\'re all i want for christmas', 'get well soon']; for (let i = 0; i < greetings.length; i++) { let input = greetings[i]; // your conditional test needs to go inside the parentheses // in the line below, replacing what's currently there if (greetings[i]) { let listitem = document.createelement('li'); listitem.textcontent = input; list.appendchild(listitem); } } </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 98%; } body { ...
...m); } } </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 98%; } body { margin: 10px; background: #f5f9fa; } const textarea = document.getelementbyid('code'); const reset = document.getelementbyid('reset'); const solution = document.getelementbyid('solution'); let code = textarea.value; let userentry = textarea.value; function updatecode() { eval(textarea.value); } reset.addeventlistener('click', function() { textarea.value = code; userentry = textarea.value; solutionentry = jssolution; solution.value = 'show solution'; updat...
...y love\',' + '\n \'a happy christmas to all the family\',' + '\n \'you\\\'re all i want for christmas\',' + '\n \'get well soon\'];' + '\n' + '\nfor (let i = 0; i < greetings.length; i++) {' + '\n let input = greetings[i];' + '\n if (greetings[i].indexof(\'christmas\') !== -1) {' + '\n let result = input;' + '\n let listitem = document.createelement(\'li\');' + '\n listitem.textcontent = result;' + '\n list.appendchild(listitem);' + '\n }' + '\n}'; let solutionentry = jssolution; textarea.addeventlistener('input', updatecode); window.addeventlistener('load', updatecode); // stop tab key tabbing out of textarea and // make it write a tab at the caret position instead textarea.onkeydown = function(e){ if (e.keycode === 9) { e.
...And 6 more matches

Styling Vue components with CSS - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Vue styling

components in our app.
...reset.css stylesheet would work, we'll instead add them to the <style> tags in app.vue to demonstrate how this can be used.
...ard, and we have some better formatting of our to-do items.
...And 6 more matches

Gecko info for Windows accessibility vendors

Mozilla › Accessibility › Gecko info for Windows accessibility vendors

nt document into a buffer in their own process.
... document structure exposed in msaa tree bstr roles are used for important roles that have not been defined by microsoft.
... h6, iframe, q, tbody, tfoot, thead in addition, an html list uses the bullet bstr role to expose bullets and numbers that are automatically inserted into the formatting by gecko.
...And 6 more matches

Creating reftest-based unit tests

Mozilla › Creating reftest-based unit tests

nt with relevant standards.
... automated suite is very, very low.
...tend to get longer, include more steps and ultimately become a long list that actually tests a lot of things.
...And 6 more matches

The Firefox codebase: CSS Guidelines

Mozilla › Developer guide › CSS Guidelines

nd engineers.
...he css that is being written is needed, it can be the case that a common component has been already written could be reused with or without changes.
...se that a common component has been already written could be reused with or without changes.
...And 6 more matches

Limitations of chrome scripts

Mozilla › Firefox › Multiprocess Leftovers › Limitations of chrome scripts

may not be initialized when an add-on asks for access to its content.
...ther shims, this shim is always active.
... the dom window is through a message manager.
...And 6 more matches

PopupNotifications.jsm

Mozilla › JavaScript code modules › PopupNotifications.jsm

s the notification service update the active notifications as appropriate.
...ll this when using the popupnotifications object in firefox windows; firefox code takes care of this automatically.
... removes the specified notification.
...And 6 more matches

nsICacheEntryDescriptor

Mozilla › Tech › XPCOM › Reference › Interface › nsICacheEntryDescriptor

netwerk/cache/nsicacheentrydescriptor.idlscriptable this interface provides a cache entry descriptor.
...thod overview void close(); void doom(); void doomandfailpendingrequests(in nsresult status); string getmetadataelement(in string key); void markvalid(); nsiinputstream openinputstream(in unsigned long offset); nsioutputstream openoutputstream(in unsigned long offset); void setdatasize(in unsigned long size); void setexpirationtime(in pruint32 expirationtime); void setmetadataelement(in string key, in string value); void visitmetadata(in nsicachemetadatavisitor visitor); attributes attribute type description accessgranted nscacheaccessmode get the access granted to this descriptor.
...e(in pruint32 expirationtime); void setmetadataelement(in string key, in string value); void visitmetadata(in nsicachemetadatavisitor visitor); attributes attribute type description accessgranted nscacheaccessmode get the access granted to this descriptor.
...And 6 more matches

nsIFeedTextConstruct

Mozilla › Tech › XPCOM › Reference › Interface › nsIFeedTextConstruct

toolkit/components/feeds/public/nsifeedtextconstruct.idlscriptable this interface represents rss or atom feed text fields that may contain plain text, html, or xhtml.
... 2 / thunderbird 2 / seamonkey 1.1) implemented by: @mozilla.org/feed-textconstruct;1, but users usually don't need to create instances of this directly.
...nderbird 2 / seamonkey 1.1) implemented by: @mozilla.org/feed-textconstruct;1, but users usually don't need to create instances of this directly.
...And 6 more matches

nsIMacDockSupport

Mozilla › Tech › XPCOM › Reference › Interface › nsIMacDockSupport

base/content/browser.js#1562 this is seen here: if you were to copy and follow that example you would replace the default native menu.
...r docksupport = cc['@mozilla.org/widget/macdocksupport;1'].getservice(ci.nsimacdocksupport); console.log('docksupport:', docksupport); var win = services.wm.getmostrecentwindow('navigator:browser'); var macmenu = win.document.createelementns('http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul', 'menupopup'); macmenu.setattribute('id', 'mymacmenu'); var macmenuitem = win.document.createelementns('http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul', 'menuitem'); macmenuitem.setattribute('label', 'show most recent window'); macmenuitem.setattribute('id', 'mymacmenuitem'); macmenuitem.addeventlistener('command', function(){ var docksupport = cc['@mozilla.org/widget/macdocksupport;1'].getservice(ci.nsimacdocksupport); docksupport.activateapplication(true); services.wm.getm...
...ute('label', 'show most recent window'); macmenuitem.setattribute('id', 'mymacmenuitem'); macmenuitem.addeventlistener('command', function(){ var docksupport = cc['@mozilla.org/widget/macdocksupport;1'].getservice(ci.nsimacdocksupport); docksupport.activateapplication(true); services.wm.getmostrecentwindow(null).focus() }) macmenu.appendchild(macmenuitem); var mainpopupset = win.document.getelementbyid('mainpopupset'); mainpopupset.appendchild(macmenu); let dockmenuelement = macmenu; //document.getelementbyid("menu_mac_dockmenu");66 let nativemenu = cc["@mozilla.org/widget/standalonenativemenu;1"].createinstance(ci.nsistandalonenativemenu); console.log('dockmenuelement:', dockmenuelement); nativemenu.init(dockmenuelement); docksupport.dockmenu = nativemenu; this replaces the default menu...
...And 6 more matches

nsITreeBoxObject

Mozilla › Tech › XPCOM › Reference › Interface › nsITreeBoxObject

void invalidaterange(in long startindex, in long endindex); void invalidatecolumnrange(in long startindex, in long endindex, in nsitreecolumn col); long getrowat(in long x, in long y); void getcellat(in long x, in long y, out long row, out nsitreecolumn col, out acstring childelt); void getcoordsforcellitem(in long row, in nsitreecolumn col, in acstring element, out long x, out long y, out long width, out long height); boolean iscellcropped(in long row, in nsitreecolumn col); void rowcountchanged(in long index, in long count); void beginupdatebatch(); void endupdatebatch(); void clearstyleandimagecaches(); attributes attribute type description columns nsitreecolumns readonl...
...e description columns nsitreecolumns readonly: obtain the columns.
...inate system is the client coordinate system for the document this boxobject lives in, and the units are css pixels.
...And 6 more matches

nsITreeView

Mozilla › Tech › XPCOM › Reference › Interface › nsITreeView

mdatatransfer datatransfer ); parameters row the index of the row.
... row the index of the row.
...n col ); parameters row the index of the row.
...And 6 more matches

XPCOM Interface Reference by grouping

Mozilla › Tech › XPCOM › Reference › Reference by grouping

habetical sorting, this page attempts to group them by function.
...tains elements associated with the view pane or the content of the "browser window" proper.
...e content of the "browser window" proper.
...And 6 more matches

Address Book examples

Mozilla › Thunderbird › Address Book Examples

use the address book manager to get an nsisimpleenumerator, then progress through the enumerator, looking for nsiabitem, nsiabcollection or nsiabdirectory interfaces as you require.
...encodeuricomponent("mystr") the search queries use lisp syntax with operators enumerated in nsabquerystringtoexpression.cpp.
...card to save the card in the database.
...And 6 more matches

CSS Flexbox Inspector: Examine Flexbox layouts - Firefox Developer Tools

Tools › Page Inspector › How to › Examine Flexbox layouts

the flexbox inspector allows you to examine css flexbox layouts using the firefox devtools, which is useful for discovering flex containers on a page, examining and modifying them, debugging layout issues, and more.
...uts using the firefox devtools, which is useful for discovering flex containers on a page, examining and modifying them, debugging layout issues, and more.
...it, a number of features are made available in the devtools to provide easy access to flexbox layout features.
...And 6 more matches

Animating CSS properties - Firefox Developer Tools

Tools › Performance › Scenarios › Animating CSS properties

ry from one property to another, and animating expensive css properties can result in jank as the browser struggles to hit a smooth frame rate.
...rate and waterfall can give you insight into the work the browser's doing in a css animation, to help diagnose performance problems.
...ying a css property can vary from one property to another.
...And 6 more matches

CanvasRenderingContext2D.drawFocusIfNeeded() - Web APIs

Web › API › CanvasRenderingContext2D › drawFocusIfNeeded

the canvasrenderingcontext2d.drawfocusifneeded() method of the canvas 2d api draws a focus ring around the current or given path, if the specified element is focused.
... the canvasrenderingcontext2d.drawfocusifneeded() method of the canvas 2d api draws a focus ring around the current or given path, if the specified element is focused.
... the canvasrenderingcontext2d.drawfocusifneeded() method of the canvas 2d api draws a focus ring around the current or given path, if the specified element is focused.
...And 6 more matches

CanvasRenderingContext2D - Web APIs

Web › API › CanvasRenderingContext2D

the canvasrenderingcontext2d interface, part of the canvas api, provides the 2d rendering context for the drawing surface of a <canvas> element.
...canvas api, provides the 2d rendering context for the drawing surface of a <canvas> element.
... see the interface's properties and methods in the sidebar and below.
...And 6 more matches

Manipulating video using canvas - Web APIs

Web › API › Canvas API › Manipulating video using canvas

by combining the capabilities of the video element with a canvas, you can manipulate video data in real time to incorporate a variety of visual effects to the video being displayed.
...div> <video id="video" src="media/video.mp4" controls="true" crossorigin="anonymous"/> </div> <div> <canvas id="c1" width="160" height="96"></canvas> <canvas id="c2" width="160" height="96"></canvas> </div> <script type="text/javascript" src="processor.js"></script> </body> </html> the key bits to take away from this are: this document establishes two canvas elements, with the ids c1 and c2.
...nsists of three methods.
...And 6 more matches

Basic animations - Web APIs

Web › API › Canvas API › Tutorial › Basic animations

« previousnext » since we're using javascript to control <canvas> elements, it's also very easy to make (interactive) animations.
...r system.
...x.arc(150, 150, 105, 0, math.pi * 2, false); // earth orbit ctx.stroke(); ctx.drawimage(sun, 0, 0, 300, 300); window.requestanimationframe(draw); } init(); <canvas id="canvas" width="300" height="300"></canvas> screenshotlive sample an animated clock this example draws an animated clock, showing your current time.
...And 6 more matches

Canvas API - Web APIs

Web › API › Canvas API

the canvas api provides a means for drawing graphics via javascript and the html <canvas> element.
... the canvas api provides a means for drawing graphics via javascript and the html <canvas> element.
...be used for animation, game graphics, data visualization, photo manipulation, and real-time video processing.
...And 6 more matches

DOMTokenList - Web APIs

Web › API › DOMTokenList

the domtokenlist interface represents a set of space-separated tokens.
... the domtokenlist interface represents a set of space-separated tokens.
... the domtokenlist interface represents a set of space-separated tokens.
...And 6 more matches

DataTransferItem.webkitGetAsEntry() - Web APIs

Web › API › DataTransferItem › webkitGetAsEntry

turn value a filesystementry-based object describing the dropped item.
...the dropped item.
...rtical-align: middle; text-align: center; color: black; font: bold 2em "arial", sans-serif; width: 300px; height: 100px; } body { font: 14px "arial", sans-serif; } javascript content first, let's look at the recursive scanfiles() function.
...And 6 more matches

Document.forms - Web APIs

Web › API › Document › forms

the forms read-only property of the document interface returns an htmlcollection listing all the <form> elements contained in the document.
... the forms read-only property of the document interface returns an htmlcollection listing all the <form> elements contained in the document.
... the forms read-only property of the document interface returns an htmlcollection listing all the <form> elements contained in the document.
...And 6 more matches

Document.hasFocus() - Web APIs

Web › API › Document › hasFocus

the hasfocus() method of the document interface returns a boolean value indicating whether the document or any element inside the document has focus.
... the hasfocus() method of the document interface returns a boolean value indicating whether the document or any element inside the document has focus.
... the hasfocus() method of the document interface returns a boolean value indicating whether the document or any element inside the document has focus.
...And 6 more matches

FileList - Web APIs

Web › API › FileList

an object of this type is returned by the files property of the html <input> element; this lets you access the list of files selected with the <input type="file"> element.
... an object of this type is returned by the files property of the html <input> element; this lets you access the list of files selected with the <input type="file"> element.
...files selected with the <input type="file"> element.
...And 6 more matches

FileSystemDirectoryReader.readEntries() - Web APIs

Web › API › FileSystemDirectoryReader › readEntries

ding from the directory.
...er: a fileerror object describing the error which occurred.
...rtical-align: middle; text-align: center; color: black; font: bold 2em "arial", sans-serif; width: 300px; height: 100px; } body { font: 14px "arial", sans-serif; } javascript content first, let's look at the recursive scanfiles() function.
...And 6 more matches

Using FormData Objects - Web APIs

Web › API › FormData › Using FormData Objects

object from scratch you can build a formdata object yourself, instantiating it then appending fields to it by calling its append() method, like this: var formdata = new formdata(); formdata.append("username", "groucho"); formdata.append("accountnum", 123456); // number 123456 is immediately converted to a string "123456" // html file input, chosen by user formdata.append("userfile", fileinputelement.files[0]); // javascript file-like object var content = '<a id="a"><b id="b">hey!</b></a>'; // the body of the new file...
...present data that isn't necessarily in a javascript-native format.
...support files on the user's system.
...And 6 more matches

Using microtasks in JavaScript with queueMicrotask() - Web APIs

Web › API › HTML DOM API › Microtask guide

a task is any javascript code which is scheduled to be run by the standard mechanisms such as initially starting to run a program, an event callback being run, or an interval or timeout being fired.
...e simultaneously reducing the risk of user-discernible delays in operations.
...is.cache[url] = data; this.data = data; this.dispatchevent(new event("load")); }); } }; the problem introduced here is that by using a task in one branch of the if...else statement (in the case in which the image is available in the cache) but having promises involved in the else clause, we have a situation in which the order of operations can vary; for example, as seen below.
...And 6 more matches

KeyframeEffect - Web APIs

Web › API › KeyframeEffect

he keyframeeffect interface of the web animations api lets us create sets of animatable properties and values, called keyframes.
...ace of the web animations api lets us create sets of animatable properties and values, called keyframes.
...ons api lets us create sets of animatable properties and values, called keyframes.
...And 6 more matches

LargestContentfulPaint - Web APIs

Web › API › LargestContentfulPaint

the largestcontentfulpaint interface of the largest contentful paint api provides details about the largest image or text paint before user input on a web page.
... the largestcontentfulpaint interface of the largest contentful paint api provides details about the largest image or text paint before user input on a web page.
...tfulpaint interface of the largest contentful paint api provides details about the largest image or text paint before user input on a web page.
...And 6 more matches

Using the MediaStream Recording API - Web APIs

Web › API › MediaStream Recording API › Using the MediaStream Recording API

give a mention to the checkbox hack, which abuses the fact that you can click on the <label> of a checkbox to toggle it checked/unchecked.
...herefore be focusable/clickable: label { font-family: 'notocoloremoji'; font-size: 3rem; position: absolute; top: 2px; right: 3px; z-index: 5; cursor: pointer; } then we hide the actual checkbox, because we don't want it cluttering up our ui: input[type=checkbox] { position: absolute; top: -100px; } next, we style the information screen (wrapped in an <aside> element) how we want it, give it fixed position so that it doesn't appear in the layout flow and affect the main ui, transform it to the position we want it to sit in by default, and give it a transition for smooth showing/hiding: aside { position: fixed; top: 0; left: 0; text-shadow: 1px 1px 1px black; width: 100%; height: 100%; transform: translatex(100%); transition: 0.6s all;...
... position: fixed; top: 0; left: 0; text-shadow: 1px 1px 1px black; width: 100%; height: 100%; transform: translatex(100%); transition: 0.6s all; background-color: #999; background-image: linear-gradient(to top right, rgba(0,0,0,0), rgba(0,0,0,0.5)); } last, we write a rule to say that when the checkbox is checked (when we click/focus the label), the adjacent <aside> element will have its horizontal translation value changed and transition smoothly into view: input[type=checkbox]:checked ~ aside { transform: translatex(0); } basic app setup to grab the media stream we want to capture, we use getusermedia().
...And 6 more matches

Node.localName - Web APIs

Web › API › Node › localName

the node.localname read-only property returns the local part of the qualified name of this node.
... the node.localname read-only property returns the local part of the qualified name of this node.
...rfaces.
...And 6 more matches

Node.nodeType - Web APIs

Web › API › Node › nodeType

the read-only node.nodetype property is an integer that identifies what the node is.
....nodetype property is an integer that identifies what the node is.
... integer that identifies what the node is.
...And 6 more matches

ParentNode.append() - Web APIs

Web › API › ParentNode › append

ntnode.append() can append several nodes and strings, whereas node.appendchild() can only append one node.
...des and strings, whereas node.appendchild() can only append one node.
...ild() can only append one node.
...And 6 more matches

ParentNode.querySelector() - Web APIs

Web › API › ParentNode › querySelector

the parentnode mixin defines the queryselector() method as returning an element representing the first element matching the specified group of selectors which are descendants of the object on which the method was called.
... the parentnode mixin defines the queryselector() method as returning an element representing the first element matching the specified group of selectors which are descendants of the object on which the method was called.
...de mixin defines the queryselector() method as returning an element representing the first element matching the specified group of selectors which are descendants of the object on which the method was called.
...And 6 more matches

Using Pointer Events - Web APIs

Web › API › Pointer events › Using Pointer Events

this guide demonstrates how to use pointer events and the html <canvas> element to build a multi-touch enabled drawing application.
...e contact with the surface, but it could, of course, also be a stylus, mouse, or other method of pointing at a location.
...ication.
...And 6 more matches

Selection - Web APIs

Web › API › Selection

returns the node in which the selection begins.
...turns the node in which the selection ends.
...ification notes, the selection api was initially created by netscape and allowed multiple ranges (for instance, to allow the user to select a column from a <table>).
...And 6 more matches

TextTrack: cuechange event - Web APIs

Web › API › TextTrack › cuechange event

the cuechange event fires when a texttrack has changed the currently displaying cues.
...n the texttrack you can set up a listener for the cuechange event on a texttrack using the addeventlistener() method: track.addeventlistener('cuechange', function () { let cues = track.activecues; // array of current cues }); or you can just set the oncuechange event handler property: track.oncuechange = function () { let cues = track.activecues; // array of current cues } on the track element the underlying texttrack, indicated by the track property, receives a cuechange event every time the currently-presented cue is changed.
...ray of current cues }); or you can just set the oncuechange event handler property: track.oncuechange = function () { let cues = track.activecues; // array of current cues } on the track element the underlying texttrack, indicated by the track property, receives a cuechange event every time the currently-presented cue is changed.
...And 6 more matches

Multi-touch interaction - Web APIs

Web › API › Touch events › Multi-touch interaction

.
...ed to cache touch points for processing outside of the event where they were fired.
... processing outside of the event where they were fired.
...And 6 more matches

WebGLRenderingContext.texSubImage2D() - Web APIs

Web › API › WebGLRenderingContext › texSubImage2D

ringcontext.texsubimage2d() method of the webgl api specifies a sub-rectangle of the current texture.
...ure.
...format, type, arraybufferview?
...And 6 more matches

Creating 3D objects using WebGL - Web APIs

Web › API › WebGL API › Tutorial › Creating 3D objects using WebGL

« previousnext » let's take our square plane into three dimensions by adding five more faces to create a cube.
...ertices.
...) { const c = facecolors[j]; // repeat each color four times for the four vertices of the face colors = colors.concat(c, c, c, c); } const colorbuffer = gl.createbuffer(); gl.bindbuffer(gl.array_buffer, colorbuffer); gl.bufferdata(gl.array_buffer, new float32array(colors), gl.static_draw); define the element array once the vertex arrays are generated, we need to build the element array.
...And 6 more matches

Using Web Workers - Web APIs

Web › API › Web Workers API › Using web workers

essage event handler.
... listeners[event.data.querymethodlistener].apply(instance, event.data.querymethodarguments); } else { this.defaultlistener.call(instance, event.data); } } } // your custom "queryable" worker var mytask = new queryableworker('my_task.js'); // your custom "listeners" mytask.addlistener('printstuff', function (result) { document.getelementbyid('firstlink').parentnode.appendchild(document.createtextnode('the difference is ' + result + '!')); }); mytask.addlistener('doalert', function (time, unit) { alert('worker waited for ' + time + ' ' + unit + ' :-)'); }); </script> </head> <body> <ul> <li><a id="firstlink" href="javascript:mytask.sendquery('getdifference', 5, 3);">what is the difference between 5 and 3?<...
... = 0; i < uint8array.length; ++i) { uint8array[i] = i; } worker.postmessage(uint8array.buffer, [uint8array.buffer]); note: for more information on transferable objects, performance, and feature-detection for this method, read transferable objects: lightning fast!
...And 6 more matches

Window.getDefaultComputedStyle() - Web APIs

Web › API › Window › getDefaultComputedStyle

the getdefaultcomputedstyle() method gives the default computed values of all the css properties of an element, ignoring author styling.
... the getdefaultcomputedstyle() method gives the default computed values of all the css properties of an element, ignoring author styling.
... the getdefaultcomputedstyle() method gives the default computed values of all the css properties of an element, ignoring author styling.
...And 6 more matches

Using XMLHttpRequest - Web APIs

Web › API › XMLHttpRequest › Using XMLHttpRequest

/* ...or as arraybuffer (legacy)...: this.send(ui8data.buffer); */ }; } /*\ |*| |*| :: ajax form submit framework :: |*| |*| https://developer.mozilla.org/docs/dom/xmlhttprequest/using_xmlhttprequest |*| |*| this framework is released under the gnu public license, version 3 or later.
...t && otarget.enctype ?
...on\/x-www-form-urlencoded"; this.technique = bispost ?
...And 6 more matches

-moz-context-properties - CSS: Cascading Style Sheets

Web › CSS › -moz-context-properties

the -moz-context-properties property can be used within privileged contexts in firefox to share the values of specified properties of the element with a child svg image.
... the -moz-context-properties property can be used within privileged contexts in firefox to share the values of specified properties of the element with a child svg image.
... the -moz-context-properties property can be used within privileged contexts in firefox to share the values of specified properties of the element with a child svg image.
...And 6 more matches

::first-letter (:first-letter) - CSS: Cascading Style Sheets

Web › CSS › ::first-letter

the ::first-letter css pseudo-element applies styles to the first letter of the first line of a block-level element, but only when not preceded by other content (such as images or inline tables).
... the ::first-letter css pseudo-element applies styles to the first letter of the first line of a block-level element, but only when not preceded by other content (such as images or inline tables).
... immediately follows the first letter is included in the match.
...And 6 more matches

:checked - CSS: Cascading Style Sheets

Web › CSS › :checked

the :checked css pseudo-class selector represents any radio (<input type="radio">), checkbox (<input type="checkbox">), or option (<option> in a <select>) element that is checked or toggled to an on state.
... the :checked css pseudo-class selector represents any radio (<input type="radio">), checkbox (<input type="checkbox">), or option (<option> in a <select>) element that is checked or toggled to an on state.
...resents any radio (<input type="radio">), checkbox (<input type="checkbox">), or option (<option> in a <select>) element that is checked or toggled to an on state.
...And 6 more matches

:has() - CSS: Cascading Style Sheets

Web › CSS › :has

the :has() css pseudo-class represents an element if any of the selectors passed as parameters (relative to the :scope of the given element) match at least one element.
... the :has() css pseudo-class represents an element if any of the selectors passed as parameters (relative to the :scope of the given element) match at least one element.
... = document.queryselector('a:has(> img)'); syntax :has( <relative-selector-list> )where <relative-selector-list> = <relative-selector>#where <relative-selector> = <combinator>?
...And 6 more matches

:host - CSS: Cascading Style Sheets

Web › CSS › :host

the :host css pseudo-class selects the shadow host of the shadow dom containing the css it is used inside — in other words, this allows you to select a custom element from inside its shadow dom.
...side — in other words, this allows you to select a custom element from inside its shadow dom.
...m.
...And 6 more matches

:target - CSS: Cascading Style Sheets

Web › CSS › :target

the :target css pseudo-class represents a unique element (the target element) with an id matching the url's fragment.
... the :target css pseudo-class represents a unique element (the target element) with an id matching the url's fragment.
... the :target css pseudo-class represents a unique element (the target element) with an id matching the url's fragment.
...And 6 more matches

Using CSS transitions - CSS: Cascading Style Sheets

Web › CSS › CSS Transitions › Using CSS transitions

css transitions provide a way to control animation speed when changing css properties.
...x1"); el.classname = "box"; } return el; } var intervalid = window.setinterval(updatetransition, 7000); the shorthand css syntax is written as follows: div { transition: <property> <duration> <timing-function> <delay>; } examples simple example this example performs a four-second font size transition with a two-second delay between the time the user mouses over the element and the beginning of the animation effect: #delay { font-size: 14px; transition-property: font-size; transition-duration: 4s; transition-delay: 2s; } #delay:hover { font-size: 36px; } multiple animated properties example html content <body> <p>the box below combines transitions for: width, height, background-color, transform.
...#">contact us</a> <a href="#">links</a> </nav> then we build the css to implement the look and feel of our menu.
...And 6 more matches

Cubic Bezier Generator - CSS: Cascading Style Sheets

Web › CSS › Tools › Cubic Bezier Generator

"updatecanvas();return true;" type="text" maxlength=6 id="x2" value="0.14" class='field'> <label for="y2">y2 = </label><input onchange="updatecanvas();return true;" type="text" maxlength=6 id="y2" value="0.53" class='field'> <br> <output id="output">log</output> </form> </html> .field { width: 40px; } function updatecanvas() { var x1 = document.getelementbyid('x1').value; var y1 = document.getelementbyid('y1').value; var x2 = document.getelementbyid('x2').value; var y2 = document.getelementbyid('y2').value; drawbeziercurve(x1, y1, x2, y2); } const radius = 4; // place needed to draw the rulers const rulers = 30.5; const margin = 10.5; const basic_scale_size = 5; // size of 0.1 tick on the rulers var scaling; //limitation: scaling...
...const radius = 4; // place needed to draw the rulers const rulers = 30.5; const margin = 10.5; const basic_scale_size = 5; // size of 0.1 tick on the rulers var scaling; //limitation: scaling is computed once: if canvas.height/canvas.width change it won't be recalculated var dragsm = 0; // drag state machine: 0 = nodrag, others = object being dragged function initcanvas() { // get the canvas element using the dom var canvas = document.getelementbyid('bezier'); // make sure we don't execute when canvas isn't supported if (canvas.getcontext) { // use getcontext to use the canvas for drawing var ctx = canvas.getcontext('2d'); scaling = math.min(canvas.height - rulers - margin, canvas.width - rulers - margin); canvas.onmousedown = mousedown; ...
...sult ?
...And 6 more matches

Viewport concepts - CSS: Cascading Style Sheets

Web › CSS › Viewport concepts

port or smaller, and the document is the website, which can be much taller or wider than the viewport.
...recap, the viewport is basically the part of the document that is currently visible.
...eight of the window and document in chrome or firefox, you may get: document.documentelement.clientwidth /* 1200 */ window.innerwidth /* 1200 */ window.outerwidth /* 1200 */ document.documentelement.clientheight /* 800 */ window.innerheight /* 800 */ window.outerheight /* 900 */ there are several dom properties that can help you query viewport size, and other similar lengths: the document element's element.clientwidth is the inner width of a document in css pixels, including padding (but not borders, margins, or vertical scrollbars, if present).
...And 6 more matches

background-attachment - CSS: Cascading Style Sheets

Web › CSS › background-attachment

word values */ background-attachment: scroll; background-attachment: fixed; background-attachment: local; /* global values */ background-attachment: inherit; background-attachment: initial; background-attachment: unset; the background-attachment property is specified as one of the keyword values from the list below.
...ed; background-attachment: local; /* global values */ background-attachment: inherit; background-attachment: initial; background-attachment: unset; the background-attachment property is specified as one of the keyword values from the list below.
...initial; background-attachment: unset; the background-attachment property is specified as one of the keyword values from the list below.
...And 6 more matches

background-size - CSS: Cascading Style Sheets

Web › CSS › background-size

the background-size css property sets the size of the element's background image.
...cond sets the height.
...rinsic dimensions and proportions.
...And 6 more matches

box-flex - CSS: Cascading Style Sheets

Web › CSS › box-flex

box-flex: unset; -webkit-box-flex: inherit; -webkit-box-flex: initial; -webkit-box-flex: unset; syntax the box-flex property is specified as a <number>.
...ebkit-box-flex: inherit; -webkit-box-flex: initial; -webkit-box-flex: unset; syntax the box-flex property is specified as a <number>.
...-flex: unset; syntax the box-flex property is specified as a <number>.
...And 6 more matches

column-span - CSS: Cascading Style Sheets

Web › CSS › column-span

the column-span css property makes it possible for an element to span across all columns when its value is set to all.
... the column-span css property makes it possible for an element to span across all columns when its value is set to all.
... the column-span css property makes it possible for an element to span across all columns when its value is set to all.
...And 6 more matches

<image> - CSS: Cascading Style Sheets

Web › CSS › image

the <image> css data type represents a two-dimensional image.
...spect ratio, like a css gradient.
...d by css properties like width, height, or background-size; and (3) its default size, determined by the kind of property the image is used with: kind of object (css property) default object size background-image the size of the element's background positioning area list-style-image the size of a 1em character border-image-source the size of the element's border image area cursor the browser-defined size matching the usual cursor size on the client's system mask-image ?
...And 6 more matches

min-width - CSS: Cascading Style Sheets

Web › CSS › min-width

the min-width css property sets the minimum width of an element.
...width css property sets the minimum width of an element.
...yword values */ min-width: max-content; min-width: min-content; min-width: fit-content(20em); /* global values */ min-width: inherit; min-width: initial; min-width: unset; values <length> defines the min-width as an absolute value.
...And 6 more matches

translateZ() - CSS: Cascading Style Sheets

Web › CSS › transform-function › translateZ

the translatez() css function repositions an element along the z-axis in 3d space, i.e., closer to or farther away from the viewer.
...or farther away from the viewer.
...away from the viewer.
...And 6 more matches

Media events - Developer guides

Web › Guide › Events › Media events

various events are sent when handling media that are embedded in html documents using the <audio> and <video> elements; this section lists them and provides some helpful information about using them.
...he duration is known.
...ty; for example, this event is sent if the media has already been loaded (or partially loaded), and the load() method is called to reload it.
...And 6 more matches

Parsing and serializing XML - Developer guides

Web › Guide › Parsing and serializing XML

using one of the following approaches to create an xml document (which is an instance of document.
...an xml document (which is an instance of document.
...dom trees this example converts an xml fragment in a string into a dom tree using a domparser: var smystring = '<a id="a"><b id="b">hey!</b></a>'; var oparser = new domparser(); var odom = oparser.parsefromstring(smystring, "application/xml"); // print the name of the root element or error message console.log(odom.documentelement.nodename == "parsererror" ?
...And 6 more matches

HTML attribute: required - HTML: Hypertext Markup Language

Web › HTML › Attributes › required

the boolean required attribute which, if present, indicates that the user must specify a value for the input before the owning form can be submitted.
...ttribute which, if present, indicates that the user must specify a value for the input before the owning form can be submitted.
...t have to be the one with the attribute is applied.
...And 6 more matches

<li> - HTML: Hypertext Markup Language

Web › HTML › Element › li

the html <li> element is used to represent an item in a list.
... the html <li> element is used to represent an item in a list.
...his interactive example is stored in a github repository.
...And 6 more matches

Array.prototype.pop() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › pop

the pop() method removes the last element from an array and returns that element.
...pop() method removes the last element from an array and returns that element.
...ength of the array.
...And 6 more matches

TypedArray.prototype.slice() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › slice

hub repository.
...ptional zero-based index at which to begin extraction.
...t which to begin extraction.
...And 6 more matches

WebAssembly.Table() constructor - JavaScript

Web › JavaScript › Reference › Global Objects › WebAssembly › Table › Table

the webassembly.table() constructor creates a new table object of the given size and element type.
... the webassembly.table() constructor creates a new table object of the given size and element type.
...bly.table() constructor creates a new table object of the given size and element type.
...And 6 more matches

WebAssembly.Table - JavaScript

Web › JavaScript › Reference › Global Objects › WebAssembly › Table

.
...from both javascript and webassembly.
...xpanded in the future.
...And 6 more matches

<math> - MathML

Web › MathML › Element › math

the top-level element in mathml is <math>.
... the top-level element in mathml is <math>.
... the top-level element in mathml is <math>.
...And 6 more matches

SVG Core Attributes - SVG: Scalable Vector Graphics

Web › SVG › Attribute › Core

the svg core attributes are all the common attributes that can be specified on any svg element.
... the svg core attributes are all the common attributes that can be specified on any svg element.
...be specified on any svg element.
...And 6 more matches

alignment-baseline - SVG: Scalable Vector Graphics

Web › SVG › Attribute › alignment-baseline

the alignment-baseline attribute specifies how an object is aligned with respect to its parent.
...igned with the corresponding baseline of the parent.
...for example, this allows alphabetic baselines in roman text to stay aligned across font size changes.
...And 6 more matches

overflow - SVG: Scalable Vector Graphics

Web › SVG › Attribute › overflow

the overflow attribute sets what to do when an element's content is too big to fit in its block formatting context.
...matting context.
...fect (i.e., a clipping rectangle is not created).
...And 6 more matches

path - SVG: Scalable Vector Graphics

Web › SVG › Attribute › path

the path attribute has two different meanings, either it defines a text path along which the characters of a text are rendered, or a motion path along which a referenced element is animated.
... the path attribute has two different meanings, either it defines a text path along which the characters of a text are rendered, or a motion path along which a referenced element is animated.
...0 q10,10 10,40 q10,70 45,70 q70,70 75,50" /> <text> <textpath path="m10,90 q90,90 90,45 q90,10 50,10 q10,10 10,40 q10,70 45,70 q70,70 75,50"> quick brown fox jumps over the lazy dog.
...And 6 more matches

<glyph> - SVG: Scalable Vector Graphics

Web › SVG › Element › glyph

a <glyph> defines a single glyph in an svg font.
... a <glyph> defines a single glyph in an svg font.
... a <glyph> defines a single glyph in an svg font.
...And 6 more matches

<image> - SVG: Scalable Vector Graphics

Web › SVG › Element › image

the <image> svg element includes images inside svg documents.
...ement includes images inside svg documents.
...les displayed with <image> are treated as an image: external resources aren't loaded, :visited styles aren't applied, and they cannot be interactive.
...And 6 more matches

Web › SVG › Element › svg

the svg element is a container that defines a new coordinate system and viewport.
... the svg element is a container that defines a new coordinate system and viewport.
... the svg element is a container that defines a new coordinate system and viewport.
...And 6 more matches

SVG 1.1 Support in Firefox - SVG: Scalable Vector Graphics

Web › SVG › SVG 1.1 Support in Firefox

you can find some basic examples of svg syntax and usage in the w3c svg test suite.
... you can find some basic examples of svg syntax and usage in the w3c svg test suite.
... the w3c svg test suite.
...And 6 more matches

SVG fonts - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › SVG fonts

ed only in safari and android browser.
...ideographic="400" hanging="500"> <font-face-src> <font-face-name name="super sans bold"/> </font-face-src> </font-face> <missing-glyph><path d="m0,0h200v200h-200z"/></missing-glyph> <glyph unicode="!" horiz-adv-x="300"><!-- outline of exclam.
...t with the <font> element.
...And 6 more matches

Texts - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › Texts

» when talking about text in svg we have to differentiate two almost completely separate topics.
...ed to put arbitrary text in svg documents: <text x="10" y="10">hello world!</text> the x and y attributes determine, where in the viewport the text will appear.
...ext is the font in which it is displayed.
...And 6 more matches

xml:base - XML: Extensible Markup Language

Web › XML › xml:base

xml:base is like the html <base> element, but can specify the base uri per element as well as the entire document.
... xml:base is like the html <base> element, but can specify the base uri per element as well as the entire document.
... xml:base is like the html <base> element, but can specify the base uri per element as well as the entire document.
...And 6 more matches

Interacting with page scripts - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Guides › Content Scripts › Interacting with page scripts

rted api, so it could be removed or changed in a future version of the sdk.
... the "page.html" file adds two buttons and assigns an event listener to each: one listener displays a property of the cloned object, and the other listener displays a property of the assigned object: <html> <head> </head> <body> <input id="works" type="button" value="i will work"/> <input id="fails" type="button" value="i will not work"/> <script> var works = document.getelementbyid("works"); works.addeventlistener("click", function() { alert(clonedcontentscriptobject.greeting); }, false); var fails = document.getelementbyid("fails"); fails.addeventlistener("click", function() { alert(assignedcontentscriptobject.greeting); }, false); </script> </body> </html> if you run the example, clicking "i will work" displays th...
...tation = "hello, "; function greetme(user) { return salutation + user; } exportfunction(greetme, unsafewindow, {defineas: "greetme"}); finally, the "page.html" file adds a button and a page script that calls the exported function when the user pushes the button: <html> <head> </head> <body> <input id="test" type="button" value="click me"/> <script> var test = document.getelementbyid("test"); test.addeventlistener("click", function() { alert(window.greetme("page script")); }, false); </script> </body> </html> exportfunction() works by structured cloning the arguments and return value of the function from one scope to the other.
...And 5 more matches

Porting the Library Detector - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Guides › Porting the Library Detector

the library detector adds an icon representing that library to the status bar.
...each test also contains a chrome:// url pointing to the icon associated with its library.
...he xul library detector displayed the detailed information about each library on mouseover in a tooltip: we can't do this using a widget, so instead will use a panel.
...And 5 more matches

panel - Archive of obsolete content

Archive › Add-ons › Add-on SDK › High-Level APIs › panel

-on approved on amo.
...er // entered.
... self.port.emit("text-entered", text); textarea.value = ''; } }, false); // listen for the "show" event being sent from the // main add-on code.
...And 5 more matches

Canvas code snippets - Archive of obsolete content

Archive › Add-ons › Code snippets › Canvas

vas, x, y) { var cx = canvas.getcontext('2d'); var pixel = cx.getimagedata(x, y, 1, 1); return { r: pixel.data[0], g: pixel.data[1], b: pixel.data[2], a: pixel.data[3] }; } chaining methods this class provides jquery-style chained access to 2d context methods and properties.
...ods) { let method = m; canvas2dcontext.prototype[method] = function() { return this.ctx[method].apply(this.ctx, arguments); }; } for (let p of props) { let prop = p; canvas2dcontext.prototype[prop] = function(value) { if (value === undefined) return this.ctx[prop]; this.ctx[prop] = value; return this; }; } }; var canvas = document.getelementbyid('canvas'); // use context to get access to underlying context var ctx = canvas2dcontext(canvas) .strokestyle('rgb(30, 110, 210)') .transform(10, 3, 4, 5, 1, 0) .strokerect(2, 10, 15, 20) .context; // use property name as a function (but without arguments) to get the value var strokestyle = canvas2dcontext(canvas) .strokestyle('rgb(50, 110, 210)') .strokestyle(); code usable on...
...reader; var blob = yield new promise(accept => canvas.toblob(accept, type, options)); reader.readasarraybuffer(blob); yield new promise(accept => { reader.onloadend = accept }); return yield os.file.writeatomic(path, new uint8array(reader.result), { tmppath: path + '.tmp' }); }); } loading a remote page onto a canvas element the following class first creates a hidden iframe element and attaches a listener to the frame's load event.
...And 5 more matches

Toolbar - Archive of obsolete content

Archive › Add-ons › Code snippets › Toolbar

es to remove your button, it doesn't show up again every time they start the application.
...your button by default only once, at first run, or when an extension update adds a new button.
... only add your button by default if it adds real value to the user and will be a frequent entry point to your extension.
...And 5 more matches

Windows - Archive of obsolete content

Archive › Add-ons › Code snippets › Windows

ndow("navigator:browser"); var b = newwindow.gbrowser; the code generate a typeerror from firefox console.
...ponents.classes is undefined and the components object is deprecated.
...ts object is deprecated.
...And 5 more matches

Supporting search suggestions in search plugins - Archive of obsolete content

Archive › Add-ons › Supporting search suggestions in search plugins

has been retrieved, it's displayed in a popup box that appears under the search bar, which lets the user select a suggested search term.
... continues to type, a new set of suggestions is requested from the search engine, and the displayed list is refreshed.
...n handling search suggestions is actually implemented on the server side.
...And 5 more matches

Example Sticky Notes - Archive of obsolete content

Archive › Mozilla › XBL › XBL 1.0 Reference › Example Sticky Notes

wnloads or initializations.
...d you address a particular binding by its id: -moz-binding: url(notes.xml#default) this id is local within the binding file (not visible in the target document dom tree).
...re not mandatory but recommended.
...And 5 more matches

allowevents - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › allowevents

« xul reference home allowevents type: boolean if true, events are passed to children of the element.
... « xul reference home allowevents type: boolean if true, events are passed to children of the element.
... « xul reference home allowevents type: boolean if true, events are passed to children of the element.
...And 5 more matches

flex - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › flex

« xul reference home flex type: string (representing an integer) indicates the flexibility of the element, which indicates how an element's container distributes remaining empty space among its children.
... « xul reference home flex type: string (representing an integer) indicates the flexibility of the element, which indicates how an element's container distributes remaining empty space among its children.
... « xul reference home flex type: string (representing an integer) indicates the flexibility of the element, which indicates how an element's container distributes remaining empty space among its children.
...And 5 more matches

findbar - Archive of obsolete content

Archive › Mozilla › XUL › Findbar

« xul reference home [ examples | attributes | properties | methods | related ] in gecko 1.9, the findbar widget moved into toolkit, so it's available to any xul application, as well as extensions.
... [ examples | attributes | properties | methods | related ] in gecko 1.9, the findbar widget moved into toolkit, so it's available to any xul application, as well as extensions.
...es | properties | methods | related ] in gecko 1.9, the findbar widget moved into toolkit, so it's available to any xul application, as well as extensions.
...And 5 more matches

MenuItems - Archive of obsolete content

Archive › Mozilla › XUL › PopupGuide › MenuItems

features of the menuitem element the menuitem element has a number of features beyond just being a label for a menu command.
... features of the menuitem element the menuitem element has a number of features beyond just being a label for a menu command.
...element the menuitem element has a number of features beyond just being a label for a menu command.
...And 5 more matches

Additional Navigation - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Additional Navigation

ect of a triple is a common way to filter out specific items.
...t = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/obselisk.jpg) when evaluating the triple, the template builder will iterate over the three potential results found so far.
... wouldn't be particularly useful.
...And 5 more matches

Bindings - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Bindings

« previousnext » we can add more triples to the previous example to show more information.
... triples to the previous example to show more information.
... do this all we need to do is add the necessary data to the rdf datasource and add another <triple> element to the template's statements.
...And 5 more matches

Building Trees - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Building Trees

« previousnext » the most common element to use with a template is the tree.
...<tree id="photoslist" flex="1" datasources="template-guide-photos5.rdf" ref="http://www.xulplanet.com/rdf/myphotos" flags="dont-build-content"> <treecols> <treecol id="name" label="name" flex="1"/> <treecol id="date" label="date" flex="1"/> </treecols> <template> <treechildren> <treeitem uri="rdf:*"> <treerow> <treecell label="rdf:http://purl.org/dc/elements/1.1/title"/> <treecell label="rdf:http://purl.org/dc/elements/1.1/date"/> </treerow> </treeitem> </treechildren> </template> </tree> note: the tree columns (treecols) are declared outside the template as static content, since they only need to be declared once.
.../dc/elements/1.1/date"/> </treerow> </treeitem> </treechildren> </template> </tree> note: the tree columns (treecols) are declared outside the template as static content, since they only need to be declared once.
...And 5 more matches

Sorting Results - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Sorting Results

lumn of the tree.
...le or description.
..."integer" for numbers which will allow sorting numerically.
...And 5 more matches

XPCOM Examples - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › XPCOM Examples

atasource.
...nction getwindowforresource, which can be used to get the window given a resource.
...ce.
...And 5 more matches

box - Archive of obsolete content

Archive › Mozilla › XUL › box

column - Archive of obsolete content

Archive › Mozilla › XUL › column

commandset - Archive of obsolete content

Archive › Mozilla › XUL › commandset

« xul reference home [ examples | attributes | properties | methods | related ] this element is not displayed and serves as a container for command elements.
... « xul reference home [ examples | attributes | properties | methods | related ] this element is not displayed and serves as a container for command elements.
...pe: comma-separated list a comma-separated list of event names that the command updater will update upon.
...And 5 more matches

member - Archive of obsolete content

Archive › Mozilla › XUL › member

« xul reference home [ examples | attributes | properties | methods | related ] used within a rule's conditions element to match elements that are containers or are contained within another element.
...home [ examples | attributes | properties | methods | related ] used within a rule's conditions element to match elements that are containers or are contained within another element.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties child type: ?
...And 5 more matches

promptBox - Archive of obsolete content

Archive › Mozilla › XUL › promptBox

b may have multiple prompts on it; the tabmodalpromptshowing attribute on the tabbrowser will tell you how many prompts a given tab has.
...on the tabbrowser will tell you how many prompts a given tab has.
... a given tab has.
...And 5 more matches

row - Archive of obsolete content

Archive › Mozilla › XUL › row

rule - Archive of obsolete content

Archive › Mozilla › XUL › rule

stack - Archive of obsolete content

Archive › Mozilla › XUL › stack

titlebar - Archive of obsolete content

Archive › Mozilla › XUL › titlebar

« xul reference home [ examples | attributes | properties | methods | related ] boxes created with the titlebar element behave just like a normal window titlebar: when the element is clicked and dragged, the window moves with it.
... « xul reference home [ examples | attributes | properties | methods | related ] boxes created with the titlebar element behave just like a normal window titlebar: when the element is clicked and dragged, the window moves with it.
... examples | attributes | properties | methods | related ] boxes created with the titlebar element behave just like a normal window titlebar: when the element is clicked and dragged, the window moves with it.
...And 5 more matches

triple - Archive of obsolete content

Archive › Mozilla › XUL › triple

« xul reference home [ examples | attributes | properties | methods | related ] a triple can be included inside a rule's conditions element.
...luded inside a rule's conditions element.
....
...And 5 more matches

Why RSS Content Module is Popular - Including HTML Contents - Archive of obsolete content

Archive › RSS › Article › Why RSS Content Module is Popular - Including HTML Contents

rss has long had the <description> element that can be used to include the contents of an <item>.
... rss has long had the <description> element that can be used to include the contents of an <item>.
...the <description> element that can be used to include the contents of an <item>.
...And 5 more matches

-ms-scroll-chaining - Archive of obsolete content

Archive › Web › CSS › -ms-scroll-chaining

the -ms-scroll-chaining css property is a microsoft extension that specifies the scrolling behavior that occurs when a user hits the scroll limit during a manipulation.
... the -ms-scroll-chaining css property is a microsoft extension that specifies the scrolling behavior that occurs when a user hits the scroll limit during a manipulation.
...-scroll-chaining css property is a microsoft extension that specifies the scrolling behavior that occurs when a user hits the scroll limit during a manipulation.
...And 5 more matches

-ms-scroll-translation - Archive of obsolete content

Archive › Web › CSS › -ms-scroll-translation

the -ms-scroll-translation css property is a microsoft extension that specifies whether vertical-to-horizontal scroll wheel translation occurs on the specified element.
... the -ms-scroll-translation css property is a microsoft extension that specifies whether vertical-to-horizontal scroll wheel translation occurs on the specified element.
...nslation occurs on the specified element.
...And 5 more matches

Descendants and Filters - Archive of obsolete content

Archive › Web › E4X tutorial › Descendants and Filters

« previousnext » accessing descendants in many cases, the node that you're interested in is not the direct child of the top xml element.
... « previousnext » accessing descendants in many cases, the node that you're interested in is not the direct child of the top xml element.
...e that you're interested in is not the direct child of the top xml element.
...And 5 more matches

caret - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › caret

reen to indicate where text input will be inserted.
...xt input will be inserted.
...cal line or a character-sized box that flashes, but this can vary.
...And 5 more matches

Web forms — Working with user data - Learn web development

Learn › Forms

uired to handle things like validation and creating custom form controls.
...ting custom form controls.
...g on a computer/tablet/other device where you don't have the ability to create your own files, you could try out (most of) the code examples in an online coding program such as jsbin or glitch.
...And 5 more matches

Arrays - Learn web development

Learn › JavaScript › First steps › Arrays

ger to write out, less efficient, and more error-prone.
... learn about the real basics of arrays by entering some examples into browser developer console.
...selector('.output p'); let total = 0; list.innerhtml = ''; totalbox.textcontent = ''; // number 1 'underpants:6.99' 'socks:5.99' 't-shirt:14.99' 'trousers:31.99' 'shoes:23.99'; for (let i = 0; i <= 0; i++) { // number 2 // number 3 // number 4 // number 5 let itemtext = 0; const listitem = document.createelement('li'); listitem.textcontent = itemtext; list.appendchild(listitem); } totalbox.textcontent = 'total: $' + total.tofixed(2); </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> const textarea = document.getelementbyid('code'); const reset = document.getelementbyid('reset'); const solu...
...And 5 more matches

HTML performance features - Learn web development

Learn › Performance › HTML

eo> embed is too large, or when a webpage is not optimized for mobile devices.
...obile devices.
...y html performance features that can drastically improve the quality of your webpage.
...And 5 more matches

Starting our Svelte Todo list app - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Svelte Todo list beginning

is will contain our list of todos.
...s</span> </button> here, aria-pressed tells assistive technology (like screen readers) that the button can be in one of two states: pressed or unpressed.
... put our styles in place, though, any element with this class will be hidden from sighted users and still available to screen reader users — this is because these words are not needed by sighted users; they are there to provide more information about what the button does for screenreader users that do not have the extra visual context to help them.
...And 5 more matches

Handling common JavaScript problems - Learn web development

Learn › Tools and testing › Cross browser testing › JavaScript

u turn it off when the user stops using it.
...ure for performing asynchronous operations and making sure those operations are complete before code that relies on their results is used for something else.
...s geolocation or not by using something like the following: if("geolocation" in navigator) { navigator.geolocation.getcurrentposition(function(position) { // show the location on a map, perhaps using the google maps api }); } else { // give the user a choice of static maps instead perhaps } you could also write such a test for a css feature, for example by testing for the existence of element.style.property (e.g.
...And 5 more matches

Mozilla's Section 508 Compliance

Mozilla › Accessibility › Mozilla s Section 508 Compliance

ting system that are identified as accessibility features where the application programming interface for those accessibility features has been documented by the manufacturer of the operating system and is available to the product developer.
...cus changes.
... that assistive technology can track focus and focus changes.
...And 5 more matches

SVG Guidelines

Mozilla › Developer guide › SVG Guidelines

nts definition examples this path: <path d=" m5,5 l1,1z "> can be cut down to this: <path d="m5,5 l1,1z"> similarly, this polygon: <polygon points=" 0,0 4,4 4,0 "/> can be cut down to this: <polygon points="0,0 4,4 4,0"/> line breaks you should only use line breaks for logical separation or if they help make the file readable.
...ted tool, and are usually context aware.
...y context aware.
...And 5 more matches

JS_DefineProperties

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS DefineProperties

x, js::handleobject obj, const jspropertyspec *ps); name type description cx jscontext * the context in which to define the properties.
... which to define the properties.
...rst element of an array containing names, ids, flags, and getproperty and setproperty method for the properties to create.
...And 5 more matches

JSAPI reference

Mozilla › Projects › SpiderMonkey › JSAPI reference

dded in spidermonkey 17 jsfun_constructor added in spidermonkey 17 jsprop_redefine_nonconfigurable added in spidermonkey 38 jsprop_resolving added in spidermonkey 45 jsprop_ignore_enumerate added in spidermonkey 38 jsprop_ignore_readonly added in spidermonkey 38 jsprop_ignore_permanent added in spidermonkey 38 jsprop_ignore_value added in spidermonkey 38 js_alreadyhasownelement added in spidermonkey 1.8 js_alreadyhasownproperty added in spidermonkey 1.8 js_alreadyhasownucproperty added in spidermonkey 1.8 js_alreadyhasownpropertybyid added in spidermonkey 1.8.1 js_defineproperty js_defineucproperty js_definepropertybyid added in spidermonkey 1.8.1 js_defineproperties js_enumerate js_forwardgetpropertyto added in spidermonkey 17 js_forwardgetelementto added in ...
...e since jsapi 26 js_getucpropertyattributes obsolete since jsapi 26 js_getpropertyattrsgetterandsetter obsolete since jsapi 26 js_getucpropertyattrsgetterandsetter obsolete since jsapi 26 js_getpropertyattrsgetterandsetterbyid obsolete since jsapi 26 js_lookupproperty obsolete since jsapi 37 js_lookupucproperty obsolete since jsapi 37 js_lookuppropertybyid obsolete since jsapi 37 js_lookupelement obsolete since jsapi 37 js_lookuppropertywithflags obsolete since jsapi 31 js_lookuppropertywithflagsbyid obsolete since jsapi 31 js_newpropertyiterator obsolete since jsapi 36 js_nextproperty obsolete since jsapi 36 js_setpropertyattributes obsolete since jsapi 26 js_setucpropertyattributes obsolete since jsapi 26 the following functions behave like js_getproperty and js_getpropertybyid ...
...javascript 1.8.5 jsxmlobjectops method types: in js 1.8.5, jsxmlobjectops has been made private.
...And 5 more matches

Parser API

Mozilla › Projects › SpiderMonkey › Parser API

et and const are spidermonkey-specific.
...terns can only be identifiers in the base case, not arbitrary expressions.
...cific.
...And 5 more matches

nsIBoxObject

Mozilla › Tech › XPCOM › Reference › Interface › nsIBoxObject

layout/xul/base/public/nsiboxobject.idlscriptable please add a summary to this article.
... layout/xul/base/public/nsiboxobject.idlscriptable please add a summary to this article.
...wstring propertyname); obsolete since gecko 1.9 wstring getproperty(in wstring propertyname); nsisupports getpropertyassupports(in wstring propertyname); void removeproperty(in wstring propertyname); void setproperty(in wstring propertyname, in wstring propertyvalue); void setpropertyassupports(in wstring propertyname, in nsisupports value); attributes attribute type description element nsidomelement read only.
...And 5 more matches

nsIDOMNSHTMLDocument

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMNSHTMLDocument

to enable or disable editing for the entire document at once.
... domstring initially the host name of the document's url, but may be changed to the parent (but not top-level) domain in order to facilitate data exchange between documents from different sites in the same domain.
... name of the document's url, but may be changed to the parent (but not top-level) domain in order to facilitate data exchange between documents from different sites in the same domain.
...And 5 more matches

nsITreeColumns

Mozilla › Tech › XPCOM › Reference › Interface › nsITreeColumns

the nsitreecolumns interface represents the tree columns.
... the nsitreecolumns interface represents the tree columns.
...th long an alias for count (for the benefit of scripts which treat this as an array).
...And 5 more matches

nsITreeContentView

Mozilla › Tech › XPCOM › Reference › Interface › nsITreeContentView

the nsitreecontentview interface is implemented by tree views that are backed by dom content.
...e nsitreecontentview interface is implemented by tree views that are backed by dom content.
...s typically reached by calling queryinterface on a nsitreeview.
...And 5 more matches

nsIWebBrowserChromeFocus

Mozilla › Tech › XPCOM › Reference › Interface › nsIWebBrowserChromeFocus

embedding/browser/webbrowser/nsiwebbrowserchromefocus.idlscriptable implemented by the same object as nsiembeddingsitewindow.
... embedding/browser/webbrowser/nsiwebbrowserchromefocus.idlscriptable implemented by the same object as nsiembeddingsitewindow.
... embedding/browser/webbrowser/nsiwebbrowserchromefocus.idlscriptable implemented by the same object as nsiembeddingsitewindow.
...And 5 more matches

nsIWindowMediator

Mozilla › Tech › XPCOM › Reference › Interface › nsIWindowMediator

tion returned is different from the position given.
...indow> element.) if null, all windows will be enumerated.
... return winutil.getouterwindowwithid(aouterwindowid); } } getxulwindowenumerator() identical to getenumerator() except it returns nsixulwindow instead of nsidomwindow.
...And 5 more matches

WebIDL bindings

Mozilla › WebIDL bindings

hey will be in the compartment of the passed-in jscontext.
... return values become a js::mutablehandle<js::value> out param appended to the argument list.
...ll be in the compartment of the passed-in jscontext.
...And 5 more matches

Flash Activation: Browser Comparison - Plugins

Plugins › Flash Activation: Browser Comparison

attempts to use flash.
...k on the flash object or the location bar icon to activate flash: users have the choice to allow flash just for the current session, or to remember their choice: google chrome in-page ui is displayed when the site attempts to use flash without fallback content: a user can click the plugin element to show a prompt for allowing flash: if the site provides fallback content for an object element, chrome will display that content and will not prompt the user to enable flash.
... flash just for the current session, or to remember their choice: google chrome in-page ui is displayed when the site attempts to use flash without fallback content: a user can click the plugin element to show a prompt for allowing flash: if the site provides fallback content for an object element, chrome will display that content and will not prompt the user to enable flash.
...And 5 more matches

CSS Grid Inspector: Examine grid layouts - Firefox Developer Tools

Tools › Page Inspector › How to › Examine grid layouts

allows you to examine css grid layouts using the firefox devtools, discovering grids present on a page, examining and modifying them, debugging layout issues, and more.
...es shown in the screenshots appearing in this article are jen simmons' futurismo and variations on a grid experiments, and a live named grid area example from rachel andrew.
...de available in the devtools to provide easy access to grid features.
...And 5 more matches

Paint Flashing Tool - Firefox Developer Tools

Tools › Paint Flashing Tool

eness when the browser renders a web page it parses the html and css, determines how to lay it out, and then paints it to actually display the content on the screen.
... the html and css, determines how to lay it out, and then paints it to actually display the content on the screen.
...es the browser repaint the new part of the page coming into view at the bottom of the screen, and also the scrollbar at the top-right to deactivate paint flashing, click the "highlight painted area" icon in the toolbox again.
...And 5 more matches

AnalyserNode.getByteFrequencyData() - Web APIs

Web › API › AnalyserNode › getByteFrequencyData

nt8array (unsigned byte array) passed into it.
...ency data is composed of integers on a scale from 0 to 255.
...a scale from 0 to 255.
...And 5 more matches

AnalyserNode.getByteTimeDomainData() - Web APIs

Web › API › AnalyserNode › getByteTimeDomainData

the getbytetimedomaindata() method of the analysernode interface copies the current waveform, or time-domain, data into a uint8array (unsigned byte array) passed into it.
... the getbytetimedomaindata() method of the analysernode interface copies the current waveform, or time-domain, data into a uint8array (unsigned byte array) passed into it.
... the getbytetimedomaindata() method of the analysernode interface copies the current waveform, or time-domain, data into a uint8array (unsigned byte array) passed into it.
...And 5 more matches

AnalyserNode.getFloatFrequencyData() - Web APIs

Web › API › AnalyserNode › getFloatFrequencyData

loat32array(analyser.frequencybincount); // float32array should be the same length as the frequencybincount void analyser.getfloatfrequencydata(dataarray); // fill the float32array with data returned from getfloatfrequencydata() parameters array the float32array that the frequency domain data will be copied to.
...should be the same length as the frequencybincount void analyser.getfloatfrequencydata(dataarray); // fill the float32array with data returned from getfloatfrequencydata() parameters array the float32array that the frequency domain data will be copied to.
...uencybincount void analyser.getfloatfrequencydata(dataarray); // fill the float32array with data returned from getfloatfrequencydata() parameters array the float32array that the frequency domain data will be copied to.
...And 5 more matches

AnalyserNode.getFloatTimeDomainData() - Web APIs

Web › API › AnalyserNode › getFloatTimeDomainData

the getfloattimedomaindata() method of the analysernode interface copies the current waveform, or time-domain, data into a float32array array passed into it.
... the getfloattimedomaindata() method of the analysernode interface copies the current waveform, or time-domain, data into a float32array array passed into it.
... the getfloattimedomaindata() method of the analysernode interface copies the current waveform, or time-domain, data into a float32array array passed into it.
...And 5 more matches

ChildNode.before() - Web APIs

Web › API › ChildNode › before

list of this childnode's parent, just before this childnode.
...t before this childnode.
...are inserted as equivalent text nodes.
...And 5 more matches

ChildNode - Web APIs

Web › API › ChildNode

the childnode mixin contains methods and properties that are common to all types of node objects that can have a parent.
...ring objects are inserted as equivalent text nodes.
...eplacewith() replaces this childnode in the children list of its parent with a set of node or domstring objects.
...And 5 more matches

Using the W3C DOM Level 1 Core - Web APIs

Web › API › Document Object Model › Using the W3C DOM Level 1 Core

ce from the w3c's dom level 1 spec.
... the author wants to change the header of the above document and write two paragraphs instead of one.
...hs instead of one.
...And 5 more matches

DragEvent - Web APIs

Web › API › DragEvent

the dragevent interface is a dom event that represents a drag and drop interaction.
...during a drag and drop interaction.
...security model that is coordinated by the browser during drag-and-drops.
...And 5 more matches

EventListener - Web APIs

Web › API › EventListener

ject with a handleevent() property function.
...t() property function.
...r inherits, any properties.
...And 5 more matches

EventSource: message event - Web APIs

Web › API › EventSource › message event

erface messageevent event handler property eventsource.onmessage examples in this basic example, an eventsource is created to receive events from the server; a page with the name sse.php is responsible for generating the events.
... event handler property eventsource.onmessage examples in this basic example, an eventsource is created to receive events from the server; a page with the name sse.php is responsible for generating the events.
...property eventsource.onmessage examples in this basic example, an eventsource is created to receive events from the server; a page with the name sse.php is responsible for generating the events.
...And 5 more matches

Using the Gamepad API - Web APIs

Web › API › Gamepad API › Using the Gamepad API

s: the gamepadinfo paragraph that the connection info is written into, the ball that we want to move, the start variable that acts as the id for requestanimation frame, the a and b variables that act as position modifiers for moving the ball, and the shorthand variables that will be used for the requestanimationframe() and cancelanimationframe() cross browser forks.
...o is written into, the ball that we want to move, the start variable that acts as the id for requestanimation frame, the a and b variables that act as position modifiers for moving the ball, and the shorthand variables that will be used for the requestanimationframe() and cancelanimationframe() cross browser forks.
...nd gamepaddisconnected events in order to display the state of all gamepads connected to the system.
...And 5 more matches

GlobalEventHandlers.onclick - Web APIs

Web › API › GlobalEventHandlers › onclick

the onclick property of the globaleventhandlers mixin is the eventhandler for processing click events on a given element.
... the onclick property of the globaleventhandlers mixin is the eventhandler for processing click events on a given element.
... using the click event to trigger an action, also consider adding this same action to the keydown event, to allow the use of that same action by people who don't use a mouse or a touch screen.
...And 5 more matches

IntersectionObserver.root - Web APIs

Web › API › IntersectionObserver › root

the intersectionobserver interface's read-only root property identifies the element or document whose bounds are treated as the bounding box of the viewport for the element which is the observer's target.
... the intersectionobserver interface's read-only root property identifies the element or document whose bounds are treated as the bounding box of the viewport for the element which is the observer's target.
...nt or document whose bounds are treated as the bounding box of the viewport for the element which is the observer's target.
...And 5 more matches

IntersectionObserver.unobserve() - Web APIs

Web › API › IntersectionObserver › unobserve

the intersectionobserver method unobserve() instructs the intersectionobserver to stop observing the specified target element.
... the intersectionobserver method unobserve() instructs the intersectionobserver to stop observing the specified target element.
... the intersectionobserver method unobserve() instructs the intersectionobserver to stop observing the specified target element.
...And 5 more matches

MediaDevices.ondevicechange - Web APIs

Web › API › MediaDevices › ondevicechange

{ float:left; width: 48%; margin-right: 2% } .right { float:right; width: 48%; margin-left: 2% } .devicelist { border: 1px solid black; list-style-type: none; margin-top: 2px; padding: 6px; } javascript content other code below is other code which, while needed to make this example work, isn'tt related directly to ondevicechange, so we won't go into any detail.
...th: 48%; margin-right: 2% } .right { float:right; width: 48%; margin-left: 2% } .devicelist { border: 1px solid black; list-style-type: none; margin-top: 2px; padding: 6px; } javascript content other code below is other code which, while needed to make this example work, isn'tt related directly to ondevicechange, so we won't go into any detail.
... .right { float:right; width: 48%; margin-left: 2% } .devicelist { border: 1px solid black; list-style-type: none; margin-top: 2px; padding: 6px; } javascript content other code below is other code which, while needed to make this example work, isn'tt related directly to ondevicechange, so we won't go into any detail.
...And 5 more matches

MutationObserver.MutationObserver() - Web APIs

Web › API › MutationObserver › MutationObserver

cribing each change that occurred; and the mutationobserver which invoked the callback.
...nvoked the callback.
... callback function function callback(mutationlist, observer) { mutationlist.foreach( (mutation) => { switch(mutation.type) { case 'childlist': /* one or more children have been added to and/or removed from the tree.
...And 5 more matches

Node.baseURI - Web APIs

Web › API › Node › baseURI

the baseuri read-only property returns the absolute base url of a node.
... the baseuri read-only property returns the absolute base url of a node.
...ged: when an html <base> tag is found in the document when the document is new (created dynamically) see the base urls section of the html living standard for details.
...And 5 more matches

Node.nextSibling - Web APIs

Web › API › Node › nextSibling

the node.nextsibling read-only property returns the node immediately following the specified one in their parent's childnodes, or returns null if the specified node is the last child in the parent element.
... their parent's childnodes, or returns null if the specified node is the last child in the parent element.
...ibling notes gecko-based browsers insert text nodes into a document to represent whitespace in the source markup.
...And 5 more matches

Node.replaceChild() - Web APIs

Web › API › Node › replaceChild

se.
... new node to replace oldchild.
...ed.
...And 5 more matches

ParentNode.prepend() - Web APIs

Web › API › ParentNode › prepend

...nodestoprepend); parameters nodestoprepend one or more nodes to insert before the first child node currently in the parentnode.
...odestoprepend one or more nodes to insert before the first child node currently in the parentnode.
...ert before the first child node currently in the parentnode.
...And 5 more matches

getBBox() - Web APIs

Web › API › SVGGraphicsElement › getBBox

the svggraphicselement.getbbox() allows us to determine the coordinates of the smallest rectangle in which the object fits.
... the svggraphicselement.getbbox() allows us to determine the coordinates of the smallest rectangle in which the object fits.
... the svggraphicselement.getbbox() allows us to determine the coordinates of the smallest rectangle in which the object fits.
...And 5 more matches

TouchEvent - Web APIs

Web › API › TouchEvent

ith a touch-sensitive surface changes.
... only a boolean value indicating whether or not the meta key was down when the touch event was fired.
...s above 1.0 indicate an outward unpinch (zoom in).
...And 5 more matches

WebGL2RenderingContext - Web APIs

Web › API › WebGL2RenderingContext

the webgl2renderingcontext interface provides the opengl es 3.0 rendering context for the drawing surface of an html <canvas> element.
... the webgl2renderingcontext interface provides the opengl es 3.0 rendering context for the drawing surface of an html <canvas> element.
... the webgl2renderingcontext interface provides the opengl es 3.0 rendering context for the drawing surface of an html <canvas> element.
...And 5 more matches

WebGLRenderingContext.getParameter() - Web APIs

Web › API › WebGLRenderingContext › getParameter

pname a glenum specifying which parameter value to return.
... possible values.
...8_astc_12x12_khr gl.cull_face glboolean gl.cull_face_mode glenum gl.front, gl.back or gl.front_and_back.
...And 5 more matches

Keyframe Formats - Web APIs

Web › API › Web Animations API › Keyframe Formats

element.animate(), keyframeeffect.keyframeeffect(), and keyframeeffect.setkeyframes() all accept objects formatted to represent a set of keyframes.
...ameeffect(), and keyframeeffect.setkeyframes() all accept objects formatted to represent a set of keyframes.
...nt ways to format keyframes: an array of objects (keyframes) consisting of properties and values to iterate over.
...And 5 more matches

Using the Web Storage API - Web APIs

Web › API › Web Storage API › Using the Web Storage API

ot.
...n be retrieved from storage using storage.getitem().
...is takes the key of the data item as an argument, and returns the data value.
...And 5 more matches

Window.requestAnimationFrame() - Web APIs

Web › API › Window › requestAnimationFrame

in time when requestanimationframe() starts to execute callback functions.
...lback functions.
... can pass this value to window.cancelanimationframe() to cancel the refresh callback request.
...And 5 more matches

Using the aria-describedby attribute - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the aria-describedby attribute

description the aria-describedby attribute is used to indicate the ids of the elements that describe the object.
...scribedby attribute is used to indicate the ids of the elements that describe the object.
...be the object.
...And 5 more matches

ARIA: timer role - Accessibility

Web › Accessibility › ARIA › Roles › ARIA timer role

the timer role indicates to assistive technologies that an element is a numerical counter listing the amount of elapsed time from a starting point or the remaining time until an end point.
... the timer role indicates to assistive technologies that an element is a numerical counter listing the amount of elapsed time from a starting point or the remaining time until an end point.
...listing the time remaining or elapsed time.
...And 5 more matches

ARIA: banner role - Accessibility

Web › Accessibility › ARIA › Roles › Banner Role

a banner role represents general and informative content frequently placed at the beginning of the page.
...search icon, photo related to the page, or slogan.
...nverts the container element upon which it is applied into a header.
...And 5 more matches

ARIA: document role - Accessibility

Web › Accessibility › ARIA › Roles › Document Role

generally used in complex composite widgets or applications, the document role can inform assistive technologies to switch context to a reading mode: the document role tells assistive technologies with reading or browse modes to use the document mode to read the content contained within this element.
...pplication roles.
...n application role or other interactive widget role, the document role is used to indicate a section of a complex composit widget that an assistive technology user should read using its browse or virtual reading mode, if available.
...And 5 more matches

ARIA: Listitem role - Accessibility

Web › Accessibility › ARIA › Roles › Listitem role

item role can be used to identify an item inside a list of items.
...r.
...e technologies using the list and listitem containers respectively.
...And 5 more matches

ARIA: Navigation Role - Accessibility

Web › Accessibility › ARIA › Roles › Navigation Role

on.
...he html <nav> element, navigation landmarks provide a way to identify groups (e.g.
...to identify groups (e.g.
...And 5 more matches

Alerts - Accessibility

Web › Accessibility › ARIA › forms › alerts

or notification.
...s default ‘alert’ function).
...ld(oldalert); } } function addalert(amsg) { removeoldalert(); var newalert = document.createelement("div"); newalert.setattribute("role", "alert"); newalert.setattribute("id", "alert"); var msg = document.createtextnode(amsg); newalert.appendchild(msg); document.body.appendchild(newalert); } function checkvalidity(aid, asearchterm, amsg) { var elem = document.getelementbyid(aid); var invalid = (elem.value.indexof(asearchterm) < 0); if (invalid) { elem.setattribute("aria-invalid", "true"); addalert(amsg); } else { elem.setattribute("aria-invalid", "false"); removeoldalert(); } } </script> the checkvalidity function the primary method in javascript used for form validation is the checkvalidity function.
...And 5 more matches

Cognitive accessibility - Accessibility

Web › Accessibility › Cognitive accessibility

cognitive impairments includes: delivering content in more than one way, such as by text-to-speech or by video; providing easily-understood content, such as text written using plain-language standards; focusing attention on important content; minimizing distractions, such as unnecessary content or advertisements; providing consistent web page layout and navigation; incorporating familiar elements, such as underlined links that are blue when not visited and purple when visited; dividing processes into logical, essential steps with progress indicators; making website authentication as easy as possible without compromising security; and making forms easy to complete, such as with clear error messages and simple error recovery.
...d what they need.
...are repeated on multiple web pages.
...And 5 more matches

-moz-user-input - CSS: Cascading Style Sheets

Web › CSS › -moz-user-input

in mozilla applications, -moz-user-input determines if an element will accept user input.
... in mozilla applications, -moz-user-input determines if an element will accept user input.
...nitial value of -moz-user-input is enabled.
...And 5 more matches

Introduction to the CSS basic box model - CSS: Cascading Style Sheets

Web › CSS › CSS Box Model › Introduction to the CSS box model

when laying out a document, the browser's rendering engine represents each element as a rectangular box according to the standard css basic box model.
... rectangular box according to the standard css basic box model.
... border edge, and margin edge.
...And 5 more matches

Relationship of grid layout to other layout methods - CSS: Cascading Style Sheets

Web › CSS › CSS Grid Layout › Relationship of Grid Layout

color: #d9480f; } <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> </div> .wrapper { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } we now have the ability to create a grid with a flexible number of flexible tracks, but see items laid out on the grid aligned by rows and columns at the same time.
...ne</div> <div>two</div> <div>three</div> </div> .wrapper { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } we now have the ability to create a grid with a flexible number of flexible tracks, but see items laid out on the grid aligned by rows and columns at the same time.
...ted to span to row line 3.
...And 5 more matches

Using the :target pseudo-class in selectors - CSS: Cascading Style Sheets

Web › CSS › CSS Selectors › Using the :target pseudo-class in selectors

when a url points at a specific piece of a document, it can be difficult for the user to notice.
... containing a fragment identifier.
...r.mozilla.org/en/docs/using_the_:target_selector#example contains the fragment identifier #example.
...And 5 more matches

<display-legacy> - CSS: Cascading Style Sheets

Web › CSS › display-legacy

css 2 used a single-keyword syntax for the display property, requiring separate keywords for block-level and inline-level variants of the same layout mode.
... css 2 used a single-keyword syntax for the display property, requiring separate keywords for block-level and inline-level variants of the same layout mode.
... css 2 used a single-keyword syntax for the display property, requiring separate keywords for block-level and inline-level variants of the same layout mode.
...And 5 more matches

height - CSS: Cascading Style Sheets

Web › CSS › height

the height css property specifies the height of an element.
...ue */ height: auto; /* <length> values */ height: 120px; height: 10em; /* <percentage> value */ height: 75%; /* global values */ height: inherit; height: initial; height: unset; values <length> defines the height as an absolute value.
...aining block's height.
...And 5 more matches

mask-border-slice - CSS: Cascading Style Sheets

Web › CSS › mask-border-slice

the mask-border-slice css property divides the image set by mask-border-source into regions.
... slice measured from the bottom.
... lines, set a given distance from their respective sides, control the size of the regions.
...And 5 more matches

mask-border-source - CSS: Cascading Style Sheets

Web › CSS › mask-border-source

the mask-border-source css property sets the source image used to create an element's mask border.
... */ mask-border-source: none; /* <image> values */ mask-border-source: url(image.jpg); mask-border-source: linear-gradient(to top, red, yellow); /* global values */ mask-border-source: inherit; mask-border-source: initial; mask-border-source: unset; values none no mask border is used.
...values */ mask-border-source: url(image.jpg); mask-border-source: linear-gradient(to top, red, yellow); /* global values */ mask-border-source: inherit; mask-border-source: initial; mask-border-source: unset; values none no mask border is used.
...And 5 more matches

mask-border - CSS: Cascading Style Sheets

Web › CSS › mask-border

the mask-border css shorthand property lets you create a mask along the edge of an element's border.
...; values <'mask-border-source'> the source image.
...lues may be specified.
...And 5 more matches

mask-clip - CSS: Cascading Style Sheets

Web › CSS › mask-clip

the mask-clip css property determines the area which is affected by a mask.
... clipped to the padding box.
...he viewbox attribute and the dimension of the reference box is set to the width and height values of the viewbox attribute.
...And 5 more matches

mask-image - CSS: Cascading Style Sheets

Web › CSS › mask-image

the mask-image css property sets the image that is used as mask layer for an element.
...skyblue), linear-gradient(rgba(0, 0, 0, 1.0), transparent); /* global values */ mask-image: inherit; mask-image: initial; mask-image: unset; syntax values none this keyword is interpreted as a transparent black image layer.
...0), transparent); /* global values */ mask-image: inherit; mask-image: initial; mask-image: unset; syntax values none this keyword is interpreted as a transparent black image layer.
...And 5 more matches

mask-origin - CSS: Cascading Style Sheets

Web › CSS › mask-origin

n-box; mask-origin: fill-box; mask-origin: stroke-box; mask-origin: view-box; /* multiple values */ mask-origin: padding-box, content-box; mask-origin: view-box, fill-box, border-box; /* non-standard keyword values */ -webkit-mask-origin: content; -webkit-mask-origin: padding; -webkit-mask-origin: border; /* global values */ mask-origin: inherit; mask-origin: initial; mask-origin: unset; for elements rendered as a single box, this property specifies the mask positioning area.
...yword values */ -webkit-mask-origin: content; -webkit-mask-origin: padding; -webkit-mask-origin: border; /* global values */ mask-origin: inherit; mask-origin: initial; mask-origin: unset; for elements rendered as a single box, this property specifies the mask positioning area.
...e padding edge, 100% 100% is the lower right corner.
...And 5 more matches

max-height - CSS: Cascading Style Sheets

Web › CSS › max-height

the max-height css property sets the maximum height of an element.
...none; max-height: max-content; max-height: min-content; max-height: fit-content(20em); /* global values */ max-height: inherit; max-height: initial; max-height: unset; values <length> defines the max-height as an absolute value.
...select a max-height for the specified element.
...And 5 more matches

max-width - CSS: Cascading Style Sheets

Web › CSS › max-width

the max-width css property sets the maximum width of an element.
...ax-width: none; max-width: max-content; max-width: min-content; max-width: fit-content(20em); /* global values */ max-width: inherit; max-width: initial; max-width: unset; values <length> defines the max-width as an absolute value.
...and select a max-width for the specified element.
...And 5 more matches

object-fit - CSS: Cascading Style Sheets

Web › CSS › object-fit

the object-fit css property sets how the content of a replaced element, such as an <img> or <video>, should be resized to fit its container.
... the object-fit css property sets how the content of a replaced element, such as an <img> or <video>, should be resized to fit its container.
... the object-fit css property sets how the content of a replaced element, such as an <img> or <video>, should be resized to fit its container.
...And 5 more matches

outline-offset - CSS: Cascading Style Sheets

Web › CSS › outline-offset

the outline-offset css property sets the amount of space between an outline and the edge or border of an element.
...in a github repository.
...xamples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 5 more matches

overflow - CSS: Cascading Style Sheets

Web › CSS › overflow

the overflow css shorthand property sets the desired behavior for an element's overflow — i.e.
... the overflow css shorthand property sets the desired behavior for an element's overflow — i.e.
... visible content is not clipped and may be rendered outside the padding box.
...And 5 more matches

page-break-inside - CSS: Cascading Style Sheets

Web › CSS › page-break-inside

this property has been replaced by the break-inside property.
...operty.
...-inside.
...And 5 more matches

perspective - CSS: Cascading Style Sheets

Web › CSS › perspective

the perspective css property determines the distance between the z=0 plane and the user in order to give a 3d-positioned element some perspective.
...st.
...values */ perspective: inherit; perspective: initial; perspective: unset; values none indicates that no perspective transform is to be applied.
...And 5 more matches

touch-action - CSS: Cascading Style Sheets

Web › CSS › touch-action

the touch-action css property sets how an element's region can be manipulated by a touchscreen user (for example, by zooming features built into the browser).
...ior in pointermove and pointerup listeners for the remaining gestures.
...owser handling of gestures by calling preventdefault(), but should also use touch-action to ensure the browser knows the intent of the application before any event listeners have been invoked.
...And 5 more matches

<ins> - HTML: Hypertext Markup Language

Web › HTML › Element › ins

the html <ins> element represents a range of text that has been added to a document.
... the html <ins> element represents a range of text that has been added to a document.
...ed in a github repository.
...And 5 more matches

data-* - HTML: Hypertext Markup Language

Web › HTML › Global attributes › data-*

data attributes, that allow proprietary information to be exchanged between the html and its dom representation by scripts.
...ow proprietary information to be exchanged between the html and its dom representation by scripts.
...d between the html and its dom representation by scripts.
...And 5 more matches

CSP: object-src - HTTP

Web › HTTP › Headers › Content-Security-Policy › object-src

the http content-security-policy object-src directive specifies valid sources for the <object>, <embed>, and <applet> elements.
... the http content-security-policy object-src directive specifies valid sources for the <object>, <embed>, and <applet> elements.
... the http content-security-policy object-src directive specifies valid sources for the <object>, <embed>, and <applet> elements.
...And 5 more matches

JavaScript technologies overview - JavaScript

Web › JavaScript › JavaScript technologies overview

introduction whereas html defines a webpage's structure and content and css sets the formatting and appearance, javascript adds interactivity to a webpage and creates rich web applications.
...ssed and manipulated by using methods on the objects.
...on of the dom event architecture, as well as specific events in dom events.
...And 5 more matches

Array.prototype.join() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › join

the join() method creates and returns a new string by concatenating all of the elements in an array (or an array-like object), separated by commas or a specified separator string.
...at item will be returned without using the separator.
...s stored in a github repository.
...And 5 more matches

Set.prototype.forEach() - JavaScript

Web › JavaScript › Reference › Global Objects › Set › forEach

ovided function once for each value in the set object, in insertion order.
...the source for this interactive example is stored in a github repository.
... thisarg value to use as this when executing callback.
...And 5 more matches

delete operator - JavaScript

Web › JavaScript › Reference › Operators › delete

// delete the own property within the // foo object.
... the // foo object.
... in the // prototype chain.
...And 5 more matches

Critical rendering path - Web Performance

Web › Performance › Critical rendering path

ted asset is handled.
...g the location and size of all the render tree elements.
...m and cssom trees are combined into the render tree.
...And 5 more matches

visibility - SVG: Scalable Vector Graphics

Web › SVG › Attribute › visibility

the visibility attribute lets you control the visibility of graphical elements.
... the visibility attribute lets you control the visibility of graphical elements.
... the visibility attribute lets you control the visibility of graphical elements.
...And 5 more matches

<feDiffuseLighting> - SVG: Scalable Vector Graphics

Web › SVG › Element › feDiffuseLighting

position and surface geometry of the input bump map.
...p.
...ter primitive can be combined with a texture image using the multiply term of the arithmetic operator of the <fecomposite> filter primitive.
...And 5 more matches

<missing-glyph> - SVG: Scalable Vector Graphics

Web › SVG › Element › missing-glyph

the <missing-glyph> svg element's content is rendered, if for a given character the font doesn't define an appropriate <glyph>.
... the <missing-glyph> svg element's content is rendered, if for a given character the font doesn't define an appropriate <glyph>.
... the <missing-glyph> svg element's content is rendered, if for a given character the font doesn't define an appropriate <glyph>.
...And 5 more matches

Getting started - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › Getting Started

ll="red" /> <circle cx="150" cy="100" r="80" fill="green" /> <text x="150" y="125" font-size="60" text-anchor="middle" fill="white">svg</text> </svg> copy the code and paste it in a file demo1.svg.
... filled in with white.
...hor where we want the midpoint to be: in this case, the midpoint should correspond to the center of the green circle.
...And 5 more matches

Other content in SVG - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › Other content in SVG

« previousnext » apart from graphic primitives like rectangles and circles, svg offers a set of elements to embed other types of content in images as well.
... « previousnext » apart from graphic primitives like rectangles and circles, svg offers a set of elements to embed other types of content in images as well.
... « previousnext » apart from graphic primitives like rectangles and circles, svg offers a set of elements to embed other types of content in images as well.
...And 5 more matches

Paths - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › Paths

« previousnext » the <path> element is the most powerful element in the svg library of basic shapes.
... can create similar-looking shapes, <polyline>s require a lot of small straight lines to simulate curves, and don't scale well to larger sizes.
... (or) l dx dy there are two abbreviated forms for drawing horizontal and vertical lines.
...And 5 more matches

Patterns - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › Patterns

« previousnext » patterns patterns are arguably one of the more confusing fill types to use in svg.
..." 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" width="200" height="200"/> </svg> screenshotlive sample inside the <pattern> element, you can include any of the other basic shapes you've included before, and each of them can be styled using any of the styles you've learned before, including gradients and opacity.
...)" fill-opacity="0.5"/> </pattern> </defs> <rect fill="url(#pattern)" stroke="black" width="200" height="200"/> </svg> screenshotlive sample inside the <pattern> element, you can include any of the other basic shapes you've included before, and each of them can be styled using any of the styles you've learned before, including gradients and opacity.
...And 5 more matches

<xsl:preserve-space> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › preserve-space

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:preserve-space> element defines the elements in the source document for which whitespace should be preserved.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:preserve-space> element defines the elements in the source document for which whitespace should be preserved.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:preserve-space> element defines the elements in the source document for which whitespace should be preserved.
...And 5 more matches

Overview - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Tutorials › Annotator › Overview

new annotation.
...el shows a list of all stored annotations.
...le to notify the user when the add-on's storage quota is full.
...And 4 more matches

Examples and demos from articles - Archive of obsolete content

Archive › Add-ons › Code snippets › From articles

idaemon.
...xample, to get a preview of an image before uploading it.
...ith full-size images shown only when mouse goes over previews.
...And 4 more matches

Displaying web content in an extension without security issues - Archive of obsolete content

Archive › Add-ons › Displaying web content in an extension without security issues

l open as a content document despite having extended privileges.
...ens as a tab in the browser — so displaying your extension in a browser tab is a bad choice.
...cted document and can execute without restrictions): <iframe type="content" onclick="handleclick(event);"/> and the event handler would look like that: function handlebrowserclick(event) { // only react to left mouse clicks if (event.button != 0) return; // default action on link clicks is to go to this link, cancel it event.preventdefault(); if (event.target instanceof htmlanchorelement && event.target.href) openlinkinbrowser(event.target.href); } safe html manipulation functions when it comes to displaying the data, it is tempting to generate some html code and to insert it into the document via innerhtml.
...And 4 more matches

XUL user interfaces - Archive of obsolete content

Archive › Beginner tutorials › XUL user interfaces

max-width: 8em; } /* the status bar */ statusbar { width: 100%; border: 1px inset -moz-dialog; margin: 4px; padding: 0px 4px; } #status { padding: 4px; } #status[warning] { color: red; } make a new text file, script7.js.
...: 1px inset -moz-dialog; margin: 4px; padding: 0px 4px; } #status { padding: 4px; } #status[warning] { color: red; } make a new text file, script7.js.
...g: 0px 4px; } #status { padding: 4px; } #status[warning] { color: red; } make a new text file, script7.js.
...And 4 more matches

Defining Cross-Browser Tooltips - Archive of obsolete content

Archive › Misc top level › Defining Cross-Browser Tooltips

vior in this regard.
... alt text should not.
...wser can find the image and that it supports the image format used; if either of these is not true, and the image cannot be displayed, then the alt text should be displayed in place of the missing image.
...And 4 more matches

Notes on HTML Reflow - Archive of obsolete content

Archive › Misc top level › Notes on HTML Reflow

the details on this page are obsolete.
...ng objects are called frames : a frame corresponds to the geometric information for (roughly) a single element in the content model; the frames are arranged into a hierarchy that parallels the containment hierarchy in the content model.
...del; for example, text that wraps is broken into several frames, one per wrapped line.
...And 4 more matches

Using XML Data Islands in Mozilla - Archive of obsolete content

Archive › Misc top level › Using XML Data Islands in Mozilla

ml data inline in html documents using the <xml> tag.
...ike this: <script id="purchase-order" type="application/xml"> <purchaseorder xmlns="http://example.mozilla.org/purchaseorderml"> <lineitem> <name>line item 1</name> <price>1.25</price> </lineitem> <lineitem> <name>line item 2</name> <price>2.48</price> </lineitem> </purchaseorder> </script> the xml source text can then be retrieved like this: var ordersource = document.getelementbyid("purchase-order").textcontent; the xml source text can be parsed into a dom tree using the domparser api: var parser = new domparser(); var doc = parser.parsefromstring(ordersource, "application/xml"); the html5 data block-based way shown here works in firefox, opera, webkit-based browsers such as chrome and safari, and ie9 while ie's xml data islands work only in ie.
...tle>xml data block demo</title> <script id="purchase-order" type="application/xml"> <purchaseorder xmlns="http://example.mozilla.org/purchaseorderml"> <lineitem> <name>line item 1</name> <price>1.25</price> </lineitem> <lineitem> <name>line item 2</name> <price>2.48</price> </lineitem> </purchaseorder> </script> <script> function rundemo() { var ordersource = document.getelementbyid("purchase-order").textcontent; var parser = new domparser(); var doc = parser.parsefromstring(ordersource, "application/xml"); var lineitems = doc.getelementsbytagnamens("http://example.mozilla.org/purchaseorderml", "lineitem"); var firstprice = lineitems[0].getelementsbytagnamens("http://example.mozilla.org/purchaseorderml", "price")[0].textcontent; document.body.textcontent = "the...
...And 4 more matches

Adding the structure - Archive of obsolete content

Archive › Mozilla › Creating a Mozilla extension › Adding the structure

« previousnext » the ui for our extension is an icon in the status bar.
... « previousnext » the ui for our extension is an icon in the status bar.
... id="statusbar-icon" mode="normal" value="0"/> </statusbarpanel> <statusbarpanel class="statusbarpanel-iconic" id="tinderbox-status" status="none"/> <statusbarpanel class="statusbarpanel-iconic" id="offline-status"/> <statusbarpanel class="statusbarpanel-iconic" id="security-button" onclick="browserpageinfo(null, 'securitytab')"/> </statusbar> the statusbar xul element defines a horizontal status bar where informative messages about an application's state can be displayed.
...And 4 more matches

Space Manager High Level Design - Archive of obsolete content

Archive › Mozilla › Space Manager High Level Design

overview the space manager and associated classes and structures are used by block and line layout to manage rectangular regions that are occupied and available, for correct handling of floated elements and the elements that flow around them.
... overview the space manager and associated classes and structures are used by block and line layout to manage rectangular regions that are occupied and available, for correct handling of floated elements and the elements that flow around them.
... overview the space manager and associated classes and structures are used by block and line layout to manage rectangular regions that are occupied and available, for correct handling of floated elements and the elements that flow around them.
...And 4 more matches

right - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › right

« xul reference home right type: string (representing an integer) for elements placed directly within a stack, specifies the pixel position of the right edge of the element relative to the right edge of the stack.
...xul reference home right type: string (representing an integer) for elements placed directly within a stack, specifies the pixel position of the right edge of the element relative to the right edge of the stack.
...nteger) for elements placed directly within a stack, specifies the pixel position of the right edge of the element relative to the right edge of the stack.
...And 4 more matches

PopupEvents - Archive of obsolete content

Archive › Mozilla › XUL › PopupGuide › PopupEvents

popup events there are several events related to popups and menus.
... event will be fired when the ui is updated and the popup is visible.
..., is needed if you wish to open a submenu programmatically.
...And 4 more matches

Recursive Generation - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Recursive Generation

s to be created.
...uilder can be said to generate content from the graph recursively.
...again using a new parent and starting point.
...And 4 more matches

Using Recursive Templates - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Using Recursive Templates

uld display one level for the two groups, and use another level for each person.
...<action> <vbox uri="?" class="indent"> <label value="?name"/> </vbox> </action> </template> </groupbox> in this simplified example, the xpath expression just gets the list of child elements of the reference node.
...class="indent"> <label value="?name"/> </vbox> </action> </template> </groupbox> in this simplified example, the xpath expression just gets the list of child elements of the reference node.
...And 4 more matches

Creating toolbar buttons (Customize Toolbar Window) - Archive of obsolete content

Archive › Mozilla › XUL › Toolbars › Creating toolbar buttons

lette"> <toolbarbutton id="myextension-button" class="toolbarbutton-1" label="&toolbarbutton.label;" tooltiptext="&toolbarbutton.tooltip;" onclick="myextension.onclick(event);"/> </toolbarpalette> onclick: function(event) { switch(event.button) { case 0: // left click break; case 1: // middle click break; case 2: // right click break; } } to add more buttons, put more <toolbarbutton> elements inside the <toolbarpalette> element.
...ass="toolbarbutton-1" label="&toolbarbutton.label;" tooltiptext="&toolbarbutton.tooltip;" onclick="myextension.onclick(event);"/> </toolbarpalette> onclick: function(event) { switch(event.button) { case 0: // left click break; case 1: // middle click break; case 2: // right click break; } } to add more buttons, put more <toolbarbutton> elements inside the <toolbarpalette> element.
...dle click break; case 2: // right click break; } } to add more buttons, put more <toolbarbutton> elements inside the <toolbarpalette> element.
...And 4 more matches

Creating a Wizard - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Creating a Wizard

ay to create wizards easily.
...to help the user perform a complex task.
... the last page, the operation is carried out.
...And 4 more matches

Persistent Data - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Persistent Data

conveniently, xul provides such a mechanism to save the state of a window.
...ethod has the advantage that it works with mozilla user profiles, so that each user can have different settings.
...o save the state of any element.
...And 4 more matches

RDF Datasources - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › RDF Datasources

url for the ref attribute, you can select a specific directory to be returned.
...tribute, you can select a specific directory to be returned.
...ress books and searching and so on.
...And 4 more matches

conditions - Archive of obsolete content

Archive › Mozilla › XUL › conditions

« xul reference home [ examples | attributes | properties | methods | related ] this element should appear directly inside a rule element and is used to define conditions for the rule.
... « xul reference home [ examples | attributes | properties | methods | related ] this element should appear directly inside a rule element and is used to define conditions for the rule.
...a rule element and is used to define conditions for the rule.
...And 4 more matches

deck - Archive of obsolete content

Archive › Mozilla › XUL › deck

« xul reference home [ examples | attributes | properties | methods | related ] an element that displays only one of its children at a time.
...eck selectedindex="2"> <description value="this is the first page"/> <button label="this is the second page"/> <box> <description value="this is the third page"/> <button label="this is also the third page"/> </box> </deck> attributes selectedindex type: integer gets and sets the index of the currently selected panel.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties selectedindex type: integer returns the index of the currently selected item.
...And 4 more matches

listcols - Archive of obsolete content

Archive › Mozilla › XUL › listcols

popupset - Archive of obsolete content

Archive › Mozilla › XUL › popupset

query - Archive of obsolete content

Archive › Mozilla › XUL › query

textnode - Archive of obsolete content

Archive › Mozilla › XUL › textnode

« xul reference home [ examples | attributes | properties | methods | related ] normally when substituting rdf resources in template rules, you place the rdf property name inside an attribute value preceded with rdf:.
...« xul reference home [ examples | attributes | properties | methods | related ] normally when substituting rdf resources in template rules, you place the rdf property name inside an attribute value preceded with rdf:.
...home [ examples | attributes | properties | methods | related ] normally when substituting rdf resources in template rules, you place the rdf property name inside an attribute value preceded with rdf:.
...And 4 more matches

toolbaritem - Archive of obsolete content

Archive › Mozilla › XUL › toolbaritem

treechildren - Archive of obsolete content

Archive › Mozilla › XUL › treechildren

Extentsions FAQ - Archive of obsolete content

Archive › Newsgroup summaries › mozilla-dev-extensions › Extentsions FAQ

he toolbar customisation window, like you would when adding buttons to the toolbars." option #4 install toolbar control <http://webdesigns.ms11.net/chromeditp.html> asking for help with getting an extension to process windows messages.
...o the toolbars." option #4 install toolbar control <http://webdesigns.ms11.net/chromeditp.html> asking for help with getting an extension to process windows messages.
...e size of the stack.
...And 4 more matches

SAX - Archive of obsolete content

Archive › SAX

ed objects implementing sax handler interfaces, depending on what kind of information they need to get from the parser.
...sion handler for lexical events (e.g.
...handler startdocument: function() { print("startdocument"); }, enddocument: function() { print("enddocument"); }, startelement: function(uri, localname, qname, /*nsisaxattributes*/ attributes) { var attrs = []; for(var i=0; i<attributes.length; i++) { attrs.push(attributes.getqname(i) + "='" + attributes.getvalue(i) + "'"); } print("startelement: namespace='" + uri + "', localname='" + localname + "', qname='" + qname + "', attributes={" + attrs.join(",") + "}"); }, endelement: function(uri, localname, qname) { print("endelement: namespace='" + uri + "', localname='" + localname + "', qname='" + qname + "'"); }, characters: function(value) { print("characters: " + value); }, processing...
...And 4 more matches

Theme changes in Firefox 4 - Archive of obsolete content

Archive › Themes › Theme changes in Firefox 4

ecific skin resource files.
...tual icon size used by add-on toolbar buttons the iconsize attribute of the browser's toolbar elements now has a different default value on each toolbar independently.
...e value does not necessarily reflect the user preference in the toolbar customization palette anymore.
...And 4 more matches

Implementation Status - Archive of obsolete content

Archive › Web › XForms › Implementation Status

supported 3.2.4 node-set binding attributes supported 3.2.5 model item property attributes partial in some cases a loop error can occur on valid bindings 302168; 3.3.1 model supported 3.3.2 instance partial instance element with two child element does not trigger exception 337302; 3.3.3 submission partial no support for @indent and complex schema validation 278761; 278762; 3.3.4 bind partial using the index() function in binds does not work.
... 4.6.7 sequence: value change with focus change supported 4.6.8 sequence: activating a trigger supported 4.6.9 sequence: submission supported 4.7 resolving id references in xforms unsupported 4.7.1 references to elements within a repeat element unsupported 4.7.2 references to elements within a bind element unsupported 4.8 dom interface for access to instance data supported 4.8.1 getinstancedocument() supported 4.8.2 rebuild() support...
...ties section title status notes bugs 6.1.1 type partial limited to types mentioned above 6.1.2 readonly supported 6.1.3 required supported 6.1.4 relevant partial relevancy applied via a bind to an element fails to apply to child attributes 342319; 6.1.5 calculate supported 6.1.6 constraint supported 6.1.7 p3ptype unsupported 279049; 6.2.1 atomic datatype partial we will support simpletype's using length, minlength, maxlength, patt...
...And 4 more matches

Styling Abbreviations and Acronyms - Archive of obsolete content

Archive › Web Standards › Styling Abbreviations and Acronyms

summary: the html elements abbr and acronym are useful accessibility aids, but their styling can come as a surprise to authors.
... summary: the html elements abbr and acronym are useful accessibility aids, but their styling can come as a surprise to authors.
... summary: the html elements abbr and acronym are useful accessibility aids, but their styling can come as a surprise to authors.
...And 4 more matches

Building up a basic demo with Babylon.js - Game development

Games › Techniques › 3D on the web › Building up a basic demo with Babylon.js

l structure here's the html structure we will use: <!doctype html> <html> <head> <meta charset="utf-8"> <title>mdn games: babylon.js demo</title> <style> html,body,canvas { margin: 0; padding: 0; width: 100%; height: 100%; font-size: 0; } </style> </head> <body> <script src="babylon.js"></script> <canvas id="render-canvas"></canvas> <script> var canvas = document.getelementbyid("render-canvas"); /* all our javascript code goes here */ </script> </body> </html> it contains some basic information like the document <title>, and some css to set the width and height of the <canvas> element (which babylon.js will use to render the content on) to fill the entire available viewport space.
...nvas"></canvas> <script> var canvas = document.getelementbyid("render-canvas"); /* all our javascript code goes here */ </script> </body> </html> it contains some basic information like the document <title>, and some css to set the width and height of the <canvas> element (which babylon.js will use to render the content on) to fill the entire available viewport space.
... the document <title>, and some css to set the width and height of the <canvas> element (which babylon.js will use to render the content on) to fill the entire available viewport space.
...And 4 more matches

GLSL Shaders - Game development

Games › Techniques › 3D on the web › GLSL Shaders

body> <script id="vertexshader" type="x-shader/x-vertex"> // vertex shader's code goes here </script> <script id="fragmentshader" type="x-shader/x-fragment"> // fragment shader's code goes here </script> <script> // scene setup goes here </script> </body> </html> it contains some basic information like the document <title>, and some css to set the width and height of the <canvas> element that three.js will insert on the page to be the full size of the viewport.
... </script> <script id="fragmentshader" type="x-shader/x-fragment"> // fragment shader's code goes here </script> <script> // scene setup goes here </script> </body> </html> it contains some basic information like the document <title>, and some css to set the width and height of the <canvas> element that three.js will insert on the page to be the full size of the viewport.
...ode instead of creating everything from scratch we can reuse the building up a basic demo with three.js source code of the cube.
...And 4 more matches

Create the Canvas and draw on it - Game development

Games › Tutorials › 2D Breakout game pure JavaScript › Create the Canvas and draw on it

« previousnext » this is the 1st step out of 10 of the gamedev canvas tutorial.
... find the source code as it should look after completing this lesson at gamedev-canvas-workshop/lesson1.html.
...canvas workshop</title> <style> * { padding: 0; margin: 0; } canvas { background: #eee; display: block; margin: 0 auto; } </style> </head> <body> <canvas id="mycanvas" width="480" height="320"></canvas> <script> // javascript code goes here </script> </body> </html> we have a charset defined, <title> and some basic css in the header.
...And 4 more matches

Block (CSS) - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Block › CSS

a block on a webpage is an html element that appears on a new line, i.e.
... a block on a webpage is an html element that appears on a new line, i.e.
... a block on a webpage is an html element that appears on a new line, i.e.
...And 4 more matches

IDL - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › IDL

e description language) is a generic language used to specified objects' interfaces apart from any specific programming language.
... a generic language used to specified objects' interfaces apart from any specific programming language.
...st attributes have two faces: the content attribute and the idl (interface definition language) attribute.
...And 4 more matches

Accessible multimedia - Learn web development

Learn › Accessibility › Multimedia

avascript, an understanding of what accessibility is.
...d what needs to be done to ensure its accessibility, ranging from simple text content to data tables, images, native controls such as form elements and buttons, and even more complex markup structures (with wai-aria attributes).
...rovide this to some degree, but it still isn't ideal.
...And 4 more matches

Define terms with HTML - Learn web development

Learn › HTML › Howto › Define terms with HTML

se use cases, html provides tags to mark descriptions and words described, so that your meaning gets across properly to your readers.
...or providing an inline expansion.
...> <span id="ff"> <dfn aria-describedby="ff">firefox</dfn> is the web browser created by the mozilla foundation.
...And 4 more matches

Mozilla splash page - Learn web development

Learn › HTML › Multimedia and embedding › Mozilla splash page

ey're ready to be used.
... shows the panda in more of a close up shot.
...re of a close up shot.
...And 4 more matches

Fetching data from the server - Learn web development

Learn › JavaScript › Client-side web APIs › Fetching data

ed across browsers for quite a long time.
... copy of ajax-start.html and the four text files — verse1.txt, verse2.txt, verse3.txt, and verse4.txt — in a new directory on your computer.
...fine our updatedisplay() function.
...And 4 more matches

Adding a new todo form: Vue events, methods, and models - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Vue methods events models

utton type="submit"> add </button> </form> </template> so we now have a form component into which we can enter the title of a new todo item (which will become a label for the corresponding todoitem when it is eventually rendered).
...evious one, inside your <script> element: import todoform from './components/todoform'; you also need to register the new component in your app component — update the components property of the component object so that it looks like this: components: { todoitem, todoform } finally for this section, render your todoform component inside your app by adding the <to-do-form /> element inside your app's <template>, like so: <template> <div id="app"> <h1>my to-do list</h1> <to-do-form></to-do-form> <ul> <li v-for="item in todoitems" :key="item.id"> <to-do-item :label="item.label" :done="item.done" :id="item.id"></to-do-item> </li> </ul> </div> </template> now when you view your running site, you should see the new form displayed.
... use a computed property, which we'll cover later.
...And 4 more matches

Listening to events on all tabs

Mozilla › Developer guide › Listening to events on all tabs

vents.
... the nsirequest object representing the associated request.
...ated with webprogress.
...And 4 more matches

Profiling with the Firefox Profiler

Mozilla › Performance › Profiling with the Built-in Profiler

thread of the compositor process.
...ive profiling, you may want to consider a non-sampling profiler.
...want to consider a non-sampling profiler.
...And 4 more matches

Localization Use Cases

Mozilla › Projects › L20n › Localization Use Cases

legł awarii", feminine: "{{ brandshortname }} uległa awarii", neutral: "{{ brandshortname }} uległo awarii" }> this will give us, depending on the current branding, the following messages: firefox os uległ awarii boot2gecko uległo awarii isolation let's look at how the settings app formats sizes.
...ral: "{{ brandshortname }} uległo awarii" }> this will give us, depending on the current branding, the following messages: firefox os uległ awarii boot2gecko uległo awarii isolation let's look at how the settings app formats sizes.
...agehelper.showformatedsize (sic): function showformatedsize(element, l10nid, size) { if (size === undefined || isnan(size)) { element.textcontent = ''; return; } // kb - 3 kb (nearest ones), mb, gb - 1.2 mb (nearest tenth) var fixeddigits = (size < 1024 * 1024) ?
...And 4 more matches

AsyncTestUtils extended framework

Mozilla › Projects › MailNews › AsyncTestUtils Extended Framework

, and 5 days ago.
...lly generated random subject) force all the messages to have the same subject you pass in.
... of recipients, where each recipient is a list whose first element is a (display) name and second element is an email address.
...And 4 more matches

JS_DefineConstDoubles

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS DefineConstDoubles

cx jscontext * the context in which to define the new properties.
...bject * object for which to create new properties.
...each property is set to jsprop_readonly | jsprop_permanent.
...And 4 more matches

Avoiding leaks in JavaScript XPCOM components

Mozilla › Tech › XPCOM › Guide › Avoiding leaks in JavaScript components

me, and would then expect the added properties to still be there.
...s being displayed.
...tion _filterradiogroup(anode) { switch (anode.localname) { case "radio": return nodefilter.filter_accept; case "template": case "radiogroup": return nodefilter.filter_reject; default: return nodefilter.filter_skip; } } var iterator = this.ownerdocument.createtreewalker(this, nodefilter.show_element, _filterradiogroup, true); while (iterator.nextnode()) radiochildren.push(iterator.currentnode); return this.mradiochildren = radiochildren; in this example, the iterator object is an xpcom object that is wrapped so the javascript code can use it.
...And 4 more matches

nsIEditor

Mozilla › Tech › XPCOM › Reference › Interface › nsIEditor

and attributes used when editing page content.
...ributes used when editing page content.
....0 / thunderbird 18.0 / seamonkey 2.15) method overview [noscript] void init(in nsidomdocument doc, in nsicontent aroot, in nsiselectioncontroller aselcon, in unsigned long aflags); void setattributeorequivalent(in nsidomelement element, in astring sourceattrname, in astring sourceattrvalue, in boolean asuppresstransaction); void removeattributeorequivalent(in nsidomelement element, in domstring sourceattrname, in boolean asuppresstransaction); void postcreate(); void predestroy(in boolean adestroyingframes); selected content removal void deleteselection(in short action, in short stripwrappers); document info and file methods void resetmodificationcount(); long getmodificationcount(); void incr...
...And 4 more matches

Add to iPhoto

Mozilla › js-ctypes › Examples › Add to iPhoto

and accepts these parameters: a cfarrayref providing a list of cfurl objects for the files to open in the application.
... core of the extension itself.
...to object in the extension's code.
...And 4 more matches

3D view - Firefox Developer Tools

Tools › 3D View

our page presented in a 3d view in which nested blocks of html are increasingly "tall," projecting outward from the bottom of the page.
...f html are increasingly "tall," projecting outward from the bottom of the page.
...page.
...And 4 more matches

Tips - Firefox Developer Tools

Tools › Tips

all its descendants.
... breadcrumb button to scroll the selection into view in the inspector.
...e to see all event listeners attached to it.
...And 4 more matches

CSSKeywordValue.CSSKeywordValue() - Web APIs

Web › API › CSSKeywordValue › CSSKeywordValue

skeywordvalue object which represents css keywords and other identifiers.
... keywords and other identifiers.
...les the following example resets the css display property to its defaults, setting the inline style attribute to style="display: initial" if viewed in the developer tools inspector.
...And 4 more matches

CSSKeywordValue - Web APIs

Web › API › CSSKeywordValue

keywordvalue.csskeywordvalue() creates a new csskeywordvalue object.
... new csskeywordvalue object.
...s inherits methods from cssstylevalue.
...And 4 more matches

CSSStyleSheet - Web APIs

Web › API › CSSStyleSheet

which maintains an up-to-date list of all of the rules in the style sheet.
...document's document.stylesheets list automatically by the browser, when a stylesheet is loaded for a document.
...esheet objects is coming to the web platform soon and is already supported in blink).
...And 4 more matches

CanvasRenderingContext2D.createPattern() - Web APIs

Web › API › CanvasRenderingContext2D › createPattern

hing to the canvas directly.
...y.
...t be assigned to the canvasrenderingcontext2d.fillstyle or canvasrenderingcontext2d.strokestyle properties, after which it is applied to any subsequent drawing.
...And 4 more matches

Compositing example - Web APIs

Web › API › Canvas API › Tutorial › Compositing › Example

this sample program demonstrates a number of compositing operations.
... this sample program demonstrates a number of compositing operations.
... 0.33 }; // resize canvas canvas1.width = width; canvas1.height = height; canvas2.width = width; canvas2.height = height; lightmix() colorsphere(); runcomposite(); return; }; and this code, runcomposite(), handles the bulk of the work, relying on a number of utility functions to do the hard parts.
...And 4 more matches

Hit regions and accessibility - Web APIs

Web › API › Canvas API › Tutorial › Hit regions and accessibility

« previousnext » the <canvas> element on its own is just a bitmap and does not provide information about any drawn objects.
...ngle</a>, both of which are semi-opaque, so the full circle can be seen underneath.</p> </canvas> see the video how nvda reads this example by steve faulkner.
...="false" aria-label="start game"></canvas> hit regions whether the mouse coordinates are within a particular area on the canvas, is a common problem to solve.
...And 4 more matches

EventSource - Web APIs

Web › API › EventSource

send messages with an event field, which will create ad-hoc events keyed to that value.
...ent field, which will create ad-hoc events keyed to that value.
... create ad-hoc events keyed to that value.
...And 4 more matches

GlobalEventHandlers.onanimationiteration - Web APIs

Web › API › GlobalEventHandlers › onanimationiteration

the sequence of animation instructions is completed by executing the last animation step.
...of animation instructions is completed by executing the last animation step.
...he box to migrate from the top-left corner of the container to the bottom-right corner.
...And 4 more matches

GlobalEventHandlers.oninvalid - Web APIs

Web › API › GlobalEventHandlers › oninvalid

the oninvalid property of the globaleventhandlers mixin is an eventhandler that processes invalid events.
... the oninvalid property of the globaleventhandlers mixin is an eventhandler that processes invalid events.
... the oninvalid property of the globaleventhandlers mixin is an eventhandler that processes invalid events.
...And 4 more matches

Image() - Web APIs

Web › API › HTMLImageElement › Image

the image() constructor creates a new htmlimageelement instance.
... the image() constructor creates a new htmlimageelement instance.
... the image() constructor creates a new htmlimageelement instance.
...And 4 more matches

File drag and drop - Web APIs

Web › API › HTML Drag and Drop API › File drag and drop

html drag and drop interfaces enable web applications to drag and drop files on a web page.
...drop repository (pull requests and/or issues are welcome).
...ging and dropping files.
...And 4 more matches

IntersectionObserver - Web APIs

Web › API › IntersectionObserver

the intersectionobserver interface of the intersection observer api provides a way to asynchronously observe changes in the intersection of a target element with an ancestor element or with a top-level document's viewport.
... the intersectionobserver interface of the intersection observer api provides a way to asynchronously observe changes in the intersection of a target element with an ancestor element or with a top-level document's viewport.
...port.
...And 4 more matches

KeyframeEffect.KeyframeEffect() - Web APIs

Web › API › KeyframeEffect › KeyframeEffect

the keyframeeffect() constructor of the web animations api returns a new keyframeeffect object instance, and also allows you to clone an existing keyframe effect object instance.
... api returns a new keyframeeffect object instance, and also allows you to clone an existing keyframe effect object instance.
...w keyframeeffect object instance, and also allows you to clone an existing keyframe effect object instance.
...And 4 more matches

KeyframeEffect.setKeyframes() - Web APIs

Web › API › KeyframeEffect › setKeyframes

existingkeyframeeffect.setkeyframes(keyframes); parameters keyframes a keyframe object or null.
...nt ways to format keyframes: an array of objects (keyframes) consisting of properties and values to iterate over.
... 2000); note: offset values, if provided, must be between 0.0 and 1.0 (inclusive) and arranged in ascending order.
...And 4 more matches

MediaError.message - Web APIs

Web › API › MediaError › message

essage; value a domstring providing a detailed, specific explanation of what went wrong and possibly how it might be fixed.
...ric description of the mediaerror.code property's value, but instead goes deeper into the specifics of this particular error and its circumstances.
...or handler for it, then lets the user click buttons to choose whether to assign a valid audio file or a missing file to the element's src attribute.
...And 4 more matches

Using the Media Capabilities API - Web APIs

Web › API › Media Capabilities API › Using the Media Capabilities API

d set of encoding parameters.
...n> <option>2500</option> <option>800</option> </select> </li> </ul> <p><input type="button" value="test this video configuration" id="tryit"></p> </form> <ul id="results"></ul> javascript let mc = { videoconfiguration : new object(), tryit: function () { mc.createconfiguration(); mc.testit(); }, createconfiguration: function () { var size = document.getelementbyid('size').value.split('x'); mc.videoconfiguration = { type: 'file', video: { contenttype: document.getelementbyid('codec').value, width: size[0], height: size[1], bitrate: document.getelementbyid('bitrate').value, framerate: document.getelementbyid('framerate').value, } } }, testit: function () { let content = ''; na...
...nttype: document.getelementbyid('codec').value, width: size[0], height: size[1], bitrate: document.getelementbyid('bitrate').value, framerate: document.getelementbyid('framerate').value, } } }, testit: function () { let content = ''; navigator.mediacapabilities.decodinginfo(mc.videoconfiguration).then(result => { var li = document.createelement('li'), mcv = mc.videoconfiguration.video; content = 'a ' + mcv.width + 'x' + mcv.height + ', ' + mcv.contenttype + ' at ' + mcv.framerate + 'fps and ' + mcv.bitrate + ' bps video ' + (result.supported ?
...And 4 more matches

Node.appendChild() - Web APIs

Web › API › Node › appendChild

py of the node before appending it under the new parent.
...e automatically kept in sync.
...s and appending strings.
...And 4 more matches

Node.namespaceURI - Web APIs

Web › API › Node › namespaceURI

the node.namespaceuri read-only property returns the namespace uri of the node, or null if the node is not in a namespace.
...== "browser" && node.namespaceuri == "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul") { // this is a xul browser } notes this is not a computed value that is the result of a namespace lookup based on an examination of the namespace declarations in scope.
...that is the result of a namespace lookup based on an examination of the namespace declarations in scope.
...And 4 more matches

Node.setUserData() - Web APIs

Web › API › Node › setUserData

the node.setuserdata() method allows a user to attach (or remove) data to an element, without needing to modify the dom.
...e convenience of associating data with specific nodes without needing to alter the structure of a document and in a standard fashion, but it also means that extra steps may need to be taken if one wishes to serialize the information or include the information upon clone, import, or rename operations.
...e (null if being deleted), the destination node (the newly created node or null if none).if no handler is desired, one must specify null.
...And 4 more matches

OffscreenCanvas - Web APIs

Web › API › OffscreenCanvas

nsfertoimagebitmap() method can be called to save the most recent rendered image.
...nts with the given imagebitmap.
...isplay the imagebitmap on the canvas and transfer its ownership to the canvas.
...And 4 more matches

PointerEvent - Web APIs

Web › API › PointerEvent

the event, the amount of pressure that was applied on the contact surface, etc.
...on of input devices (such as a mouse, pen or contact point on a touch-enable surface).
...ent fired, look at the event's type property.
...And 4 more matches

ResizeObserverEntry.target - Web APIs

Web › API › ResizeObserverEntry › target

the target read-only property of the resizeobserverentry interface returns a reference to the element or svgelement that is being observed.
... the target read-only property of the resizeobserverentry interface returns a reference to the element or svgelement that is being observed.
... the target read-only property of the resizeobserverentry interface returns a reference to the element or svgelement that is being observed.
...And 4 more matches

SVGAngle - Web APIs

Web › API › SVGAngle

the svgangle interface is used to represent a value that can be an <angle> or <number> value.
... the svgangle interface is used to represent a value that can be an <angle> or <number> value.
...is used to represent a value that can be an <angle> or <number> value.
...And 4 more matches

SVGDocument - Web APIs

Web › API › SVGDocument

svg document interface when an "svg" element is embedded inline as a component of a document from another namespace, such as when an "svg" element is embedded inline within an xhtml document, then an svgdocument object will not exist; instead, the root object in the document object hierarchy will be a document object of a different type, such as an htmldocument object.
... the document object hierarchy will be a document object of a different type, such as an htmldocument object.
...t object hierarchy will be a document object of a different type, such as an htmldocument object.
...And 4 more matches

Using server-sent events - Web APIs

Web › API › Server-sent events › Using server-sent events

ed with both the url and an options dictionary.
...an options dictionary.
...e client script is on example.com: const evtsource = new eventsource("//api.example.com/ssedemo.php", { withcredentials: true } ); once you've instantiated your event source, you can begin listening for messages from the server by attaching a handler for the message event: evtsource.onmessage = function(event) { const newelement = document.createelement("li"); const eventlist = document.getelementbyid("list"); newelement.innerhtml = "message: " + event.data; eventlist.appendchild(newelement); } this code listens for incoming messages (that is, notices from the server that do not have an event field on them) and appends the message text to a list in the document's html.
...And 4 more matches

StylePropertyMapReadOnly - Web APIs

Web › API › StylePropertyMapReadOnly

the stylepropertymapreadonly interface of the the css typed object model api provides a read-only representation of a css declaration block that is an alternative to cssstyledeclaration.
...of the stylepropertymapreadonly object.
...preadonly.has() indicates whether the specified property is in the stylepropertymapreadonly object.
...And 4 more matches

Touch events - Web APIs

Web › API › Touch events

a <canvas> with more than one finger at a time.
... stylus or other contact method.
...rtup() { var el = document.getelementbyid("canvas"); el.addeventlistener("touchstart", handlestart, false); el.addeventlistener("touchend", handleend, false); el.addeventlistener("touchcancel", handlecancel, false); el.addeventlistener("touchmove", handlemove, false); } document.addeventlistener("domcontentloaded", startup); this simply sets up all the event listeners for our <canvas> element so we can handle the touch events as they occur.
...And 4 more matches

WebGLRenderingContext.canvas - Web APIs

Web › API › WebGLRenderingContext › canvas

the webglrenderingcontext.canvas property is a read-only reference to the htmlcanvaselement or offscreencanvas object that is associated with the context.
... the webglrenderingcontext.canvas property is a read-only reference to the htmlcanvaselement or offscreencanvas object that is associated with the context.
... the webglrenderingcontext.canvas property is a read-only reference to the htmlcanvaselement or offscreencanvas object that is associated with the context.
...And 4 more matches

Web Video Text Tracks Format (WebVTT) - Web APIs

Web › API › WebVTT API

web video text tracks format (webvtt) is a format for displaying timed text tracks (such as subtitles or captions) using the <track> element.
... note this translation was done by kyle so that some friends can watch it with their parents.
...le so that some friends can watch it with their parents.
...And 4 more matches

WindowOrWorkerGlobalScope.setInterval() - Web APIs

Web › API › WindowOrWorkerGlobalScope › setInterval

ting two colors the following example calls the flashtext() function once a second until the stop button is pressed.
...amap = []; this.rate = nrate || 100; this.play = function () { if (btyping) { return; } if (bstart) { var aitems = document.queryselectorall(sselector); if (aitems.length === 0) { return; } for (var nitem = 0; nitem < aitems.length; nitem++) { asheets.push(new sheet(aitems[nitem])); /* uncomment the following line if you have previously hidden your elements via css: */ // aitems[nitem].style.visibility = "visible"; } bstart = false; } nintervid = setinterval(typewrite, this.rate); btyping = true; }; this.pause = function () { clearinterval(nintervid); btyping = false; }; this.terminate = function () { ocurrent.nodevalue += spart; spart = ""; for (nidx; nidx < asheets.length; scroll(ash...
...se; } nintervid = setinterval(typewrite, this.rate); btyping = true; }; this.pause = function () { clearinterval(nintervid); btyping = false; }; this.terminate = function () { ocurrent.nodevalue += spart; spart = ""; for (nidx; nidx < asheets.length; scroll(asheets[nidx++], 0, false)); clean(); }; } /* usage: */ var otwexample1 = new typewriter(/* elements: */ '#article, h1, #info, #copyleft', /* frame rate (optional): */ 15); /* default frame rate is 100: */ var otwexample2 = new typewriter('#controls'); /* you can also change the frame rate value modifying the "rate" property; for example: */ // otwexample2.rate = 150; onload = function () { otwexample1.play(); otwexample2.play(); }; </script> <style type="text/css"> span.intlink, a, a:vi...
...And 4 more matches

XMLSerializer.serializeToString() - Web APIs

Web › API › XMLSerializer › serializeToString

due to the content not being well-formed.
...following types are also permitted as descendants of the root node, in addition to node and attr: documenttype document documentfragment element comment text processinginstruction attr if any other type is encountered, a typeerror exception is thrown.
... a typeerror exception is thrown.
...And 4 more matches

msRegionOverflow - Web APIs

Web › API › msRegionOverflow

it will not work for every user.
...syntax string = object.msregionoverflow values type:domstring overflow: the region element's content overflows the region's content box.
...one in the region chain, it means that the content fits without overflowing.
...And 4 more matches

Using the log role - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the log role

description this technique demonstrates how to use the log role and describes the effect it has on browsers and assistive technology.
...tive technology.
...live region and these are announced when the user is idle.
...And 4 more matches

Using the presentation role - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the presentation role

this technique demonstrates how to use the presentation role and describes the effect it has on browsers and assistive technology.
... this technique demonstrates how to use the presentation role and describes the effect it has on browsers and assistive technology.
... this technique demonstrates how to use the presentation role and describes the effect it has on browsers and assistive technology.
...And 4 more matches

x-ms-aria-flowfrom - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › x-ms-aria-flowfrom

non-standard this feature is non-standard and is not on a standards track.
...acing the web: it will not work for every user.
...cifies the id of the previous element in an alternative reading order, allowing assistive technology to override the general default of reading in document source order.
...And 4 more matches

ARIA: grid role - Accessibility

Web › Accessibility › ARIA › Roles › Grid Role

="2a" tabindex="-1">2a</button> </td> <td tabindex="-1"> <button id="2b" tabindex="-1">2b</button> </td>  </tr> </tbody> </table> description a grid widget contains one or more rows with one or more cells of thematically related interactive content.
...ng elements.
...rids) and grouping other widgets (layout grids).
...And 4 more matches

ARIA: Main role - Accessibility

Web › Accessibility › ARIA › Roles › Main role

and labeling sections of a page, structural information conveyed visually through layout can be represented programmatically.
... be represented programmatically.
... a page.
...And 4 more matches

Operable - Accessibility

Web › Accessibility › Understanding WCAG › Operable

informative <title>, the content of which describes the page's content/purpose.
... of related links, etc.
...re a page is one step in a process, so should only logically have links to the previous and next steps.
...And 4 more matches

Understandable - Accessibility

Web › Accessibility › Understanding WCAG › Understandable

success criteria how to conform to the criteria practical resource 3.1.1 language of page (a) the default human language of each web page should be detectable via code.
...he lang attribute on the page's <html> element, giving it a value equal to the language code that best represents the language the page is written in.
... the language code that best represents the language the page is written in.
...And 4 more matches

-moz-orient - CSS: Cascading Style Sheets

Web › CSS › -moz-orient

the -moz-orient css property specifies the orientation of the element to which it's applied.
... the -moz-orient css property specifies the orientation of the element to which it's applied.
... the -moz-orient css property specifies the orientation of the element to which it's applied.
...And 4 more matches

-webkit-box-reflect - CSS: Cascading Style Sheets

Web › CSS › -webkit-box-reflect

the -webkit-box-reflect css property lets you reflect the content of an element in one specific direction.
...it-box-reflect: right; /* offset value */ -webkit-box-reflect: below 10px; /* mask value */ -webkit-box-reflect: below 0 linear-gradient(transparent, white); /* global values */ -webkit-box-reflect: inherit; -webkit-box-reflect: initial; -webkit-box-reflect: unset; note: this feature is not intended to be used by web sites.
...nded to be used by web sites.
...And 4 more matches

::first-line (:first-line) - CSS: Cascading Style Sheets

Web › CSS › ::first-line

the ::first-line css pseudo-element applies styles to the first line of a block-level element.
... the ::first-line css pseudo-element applies styles to the first line of a block-level element.
...element applies styles to the first line of a block-level element.
...And 4 more matches

:nth-of-type() - CSS: Cascading Style Sheets

Web › CSS › :nth-of-type

the :nth-of-type() css pseudo-class matches elements of a given type (tag name), based on their position among a group of siblings.
... the :nth-of-type() css pseudo-class matches elements of a given type (tag name), based on their position among a group of siblings.
... the :nth-of-type() css pseudo-class matches elements of a given type (tag name), based on their position among a group of siblings.
...And 4 more matches

CSS Flow Layout - CSS: Cascading Style Sheets

Web › CSS › CSS Flow Layout

normal flow, or flow layout, is the way that block and inline elements are displayed on a page before any changes are made to their layout.
... normal flow, or flow layout, is the way that block and inline elements are displayed on a page before any changes are made to their layout.
...page before any changes are made to their layout.
...And 4 more matches

Realizing common layouts using CSS Grid Layout - CSS: Cascading Style Sheets

Web › CSS › CSS Grid Layout › Realizing common layouts using CSS Grid Layout

is type of layout, with content, sidebars, a header and a footer.
... use a flexbox to display the navigation as a column.
...es named col-start.
...And 4 more matches

Questions about CSS - CSS: Cascading Style Sheets

Web › CSS › FAQ

cascading style sheets (css) is a rule-based language allowing developers to define styles to apply to html elements (or other markup structures).
... cascading style sheets (css) is a rule-based language allowing developers to define styles to apply to html elements (or other markup structures).
...le sheets (css) is a rule-based language allowing developers to define styles to apply to html elements (or other markup structures).
...And 4 more matches

Pseudo-classes - CSS: Cascading Style Sheets

Web › CSS › Pseudo-classes

a css pseudo-class is a keyword added to a selector that specifies a special state of the selected element(s).
... a css pseudo-class is a keyword added to a selector that specifies a special state of the selected element(s).
... when the user's pointer hovers over it.
...And 4 more matches

Universal selectors - CSS: Cascading Style Sheets

Web › CSS › Universal selectors

the css universal selector (*) matches elements of any type.
... the css universal selector (*) matches elements of any type.
... the css universal selector (*) matches elements of any type.
...And 4 more matches

backdrop-filter - CSS: Cascading Style Sheets

Web › CSS › backdrop-filter

the backdrop-filter css property lets you apply graphical effects such as blurring or color shifting to the area behind an element.
... the backdrop-filter css property lets you apply graphical effects such as blurring or color shifting to the area behind an element.
... the backdrop-filter css property lets you apply graphical effects such as blurring or color shifting to the area behind an element.
...And 4 more matches

border-image-outset - CSS: Cascading Style Sheets

Web › CSS › border-image-outset

the border-image-outset css property sets the distance by which an element's border image is set out from its border box.
... the border-image-outset css property sets the distance by which an element's border image is set out from its border box.
...t.
...And 4 more matches

clip - CSS: Cascading Style Sheets

Web › CSS › clip

the clip css property defines a visible portion of an element.
... the clip css property defines a visible portion of an element.
... the clip css property defines a visible portion of an element.
...And 4 more matches

filter - CSS: Cascading Style Sheets

Web › CSS › filter

the filter css property applies graphical effects like blur or color shift to an element.
... the filter css property applies graphical effects like blur or color shift to an element.
...-rotate(90deg); filter: invert(75%); filter: opacity(25%); filter: saturate(30%); filter: sepia(60%); /* multiple filters */ filter: contrast(175%) brightness(3%); /* use no filter */ filter: none; /* global values */ filter: inherit; filter: initial; filter: unset; with a function, use the following: filter: <filter-function> [<filter-function>]* | none for a reference to an svg <filter> element, use the following: filter: url(file.svg#filter-element-id) interpolation if both the beginning and end filters have a function list of the same length without <url>, each of their filter functions is interpolated according to its specific rules.
...And 4 more matches

isolation - CSS: Cascading Style Sheets

Web › CSS › isolation

the isolation css property determines whether an element must create a new stacking context.
...property is especially helpful when used in conjunction with mix-blend-mode.
... isolation: isolate; /* global values */ isolation: inherit; isolation: initial; isolation: unset; the isolation property is specified as one of the keyword values listed below.
...And 4 more matches

list-style-position - CSS: Cascading Style Sheets

Web › CSS › list-style-position

ts the position of the ::marker relative to a list item.
...ource for this interactive example is stored in a github repository.
...u'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 4 more matches

margin-left - CSS: Cascading Style Sheets

Web › CSS › margin-left

the margin-left css property sets the margin area on the left side of an element.
...ion computed value of auto comment inline, inline-block, inline-table any static or relative 0 inline layout mode block, inline, inline-block, block, table, inline-table, list-item, table-caption any static or relative 0, except if both margin-left and margin-right are set to auto.
...e, list-item, table-caption any static or relative 0, except if both margin-left and margin-right are set to auto.
...And 4 more matches

margin-right - CSS: Cascading Style Sheets

Web › CSS › margin-right

the margin-right css property sets the margin area on the right side of an element.
...ion computed value of auto comment inline, inline-block, inline-table any static or relative 0 inline layout mode block, inline, inline-block, block, table, inline-table, list-item, table-caption any static or relative 0, except if both margin-left and margin-right are set to auto.
...e, list-item, table-caption any static or relative 0, except if both margin-left and margin-right are set to auto.
...And 4 more matches

mask-position - CSS: Cascading Style Sheets

Web › CSS › mask-position

position: 25% 75%; mask-position: 0px 0px; mask-position: 10% 8em; /* multiple values */ mask-position: top right; mask-position: 1rem 1rem, center; /* global values */ mask-position: inherit; mask-position: initial; mask-position: unset; syntax one or more <position> values, separated by commas.
...p right; mask-position: 1rem 1rem, center; /* global values */ mask-position: inherit; mask-position: initial; mask-position: unset; syntax one or more <position> values, separated by commas.
...position: inherit; mask-position: initial; mask-position: unset; syntax one or more <position> values, separated by commas.
...And 4 more matches

mask-repeat - CSS: Cascading Style Sheets

Web › CSS › mask-repeat

e syntax: horizontal | vertical */ mask-repeat: repeat space; mask-repeat: repeat repeat; mask-repeat: round space; mask-repeat: no-repeat round; /* multiple values */ mask-repeat: space round, no-repeat; mask-repeat: round repeat, space, repeat-x; /* global values */ mask-repeat: inherit; mask-repeat: initial; mask-repeat: unset; by default, the repeated images are clipped to the size of the element, but they can be scaled to fit (using round) or evenly distributed from end to end (using space).
...represents the vertical behavior.
...tch until each repetition is 300px wide, and then another image will be added.
...And 4 more matches

overscroll-behavior-y - CSS: Cascading Style Sheets

Web › CSS › overscroll-behavior-y

n the vertical boundary of a scrolling area is reached.
...area is reached.
...al valueautoapplies tonon-replaced block-level elements and non-replaced inline-block elementsinheritednocomputed valueas specifiedanimation typediscrete syntax the overscroll-behavior-y property is specified as a keyword chosen from the list of values below.
...And 4 more matches

rotate - CSS: Cascading Style Sheets

Web › CSS › rotate

of transform functions to specify in the transform property.
...x, y, or z axis name plus angle */ rotate: x 90deg; rotate: y 0.25turn; rotate: z 1.57rad; /* vector plus angle value */ rotate: 1 1 1 90deg; values angle value an <angle> specifying the angle to rotate the affected element through, around the z axis.
...rad; /* vector plus angle value */ rotate: 1 1 1 90deg; values angle value an <angle> specifying the angle to rotate the affected element through, around the z axis.
...And 4 more matches

scroll-snap-coordinate - CSS: Cascading Style Sheets

Web › CSS › scroll-snap-coordinate

the scroll-snap-coordinate css property defines the x and y coordinate positions within an element that will align with its nearest ancestor scroll container's scroll-snap-destination for each respective axis.
...ap-destination for each respective axis.
... scroll-snap-coordinate: 50px 50px; /* single coordinate */ scroll-snap-coordinate: 100px 100px, 100px bottom; /* multiple coordinates */ /* global values */ scroll-snap-coordinate: inherit; scroll-snap-coordinate: initial; scroll-snap-coordinate: unset; if the element has been transformed, the snap coordinates are likewise transformed, thus aligning the snap points with the element as it is displayed.
...And 4 more matches

shape-outside - CSS: Cascading Style Sheets

Web › CSS › shape-outside

,1,1,1,1,0.3 c1,0.7,0.5,1,0.5,1 z'); /* <url> value */ shape-outside: url(image.png); /* <gradient> value */ shape-outside: linear-gradient(45deg, rgba(255, 255, 255, 0) 150px, red 150px); /* global values */ shape-outside: initial; shape-outside: inherit; shape-outside: unset; the shape-outside property is specified using the values from the list below, which define the float area for float elements.
...png); /* <gradient> value */ shape-outside: linear-gradient(45deg, rgba(255, 255, 255, 0) 150px, red 150px); /* global values */ shape-outside: initial; shape-outside: inherit; shape-outside: unset; the shape-outside property is specified using the values from the list below, which define the float area for float elements.
...x, red 150px); /* global values */ shape-outside: initial; shape-outside: inherit; shape-outside: unset; the shape-outside property is specified using the values from the list below, which define the float area for float elements.
...And 4 more matches

text-justify - CSS: Cascading Style Sheets

Web › CSS › text-justify

the text-justify css property sets what type of justification should be applied to text when text-align: justify; is set on an element.
... words using spaces, like english or korean.
...tedyescomputed valueas specifiedanimation typediscrete formal syntax auto | inter-character | inter-word | none examples <p class="none"><code>text-justify: none</code> —<br>lorem ipsum dolor sit amet, consectetur adipiscing elit.
...And 4 more matches

transform - CSS: Cascading Style Sheets

Web › CSS › transform

the transform css property lets you rotate, scale, skew, or translate an element.
...it modifies the coordinate space of the css visual formatting model.
...this interactive example is stored in a github repository.
...And 4 more matches

Writing forward-compatible websites - Developer guides

Web › Guide › Writing forward-compatible websites

anets and other non-public websites; if we can't see your code, we can't see that it broke.
... we can't see that it broke.
... it's not always possible to follow all of these, but following as many of them as possible will help future-proof your website.
...And 4 more matches

HTML attribute: crossorigin - HTML: Hypertext Markup Language

Web › HTML › Attributes › crossorigin

the crossorigin attribute, valid on the <audio>, <img>, <link>, <script>, and <video> elements, provides support for cors, defining how the element handles crossorigin requests, thereby enabling the configuration of the cors requests for the element's fetched data.
... the crossorigin attribute, valid on the <audio>, <img>, <link>, <script>, and <video> elements, provides support for cors, defining how the element handles crossorigin requests, thereby enabling the configuration of the cors requests for the element's fetched data.
... the crossorigin attribute, valid on the <audio>, <img>, <link>, <script>, and <video> elements, provides support for cors, defining how the element handles crossorigin requests, thereby enabling the configuration of the cors requests for the element's fetched data.
...And 4 more matches

HTML attribute: max - HTML: Hypertext Markup Language

Web › HTML › Attributes › max

the max attribute defines the maximum value that is acceptable and valid for the input containing the attribute.
... the max attribute defines the maximum value that is acceptable and valid for the input containing the attribute.
...e max attribute is present by is not specified or is invalid, no max value is applied.
...And 4 more matches

HTML attribute: multiple - HTML: Hypertext Markup Language

Web › HTML › Attributes › multiple

file input type, the user can select one or more files.
...n any way that their chosen platform allows (e.g.
...t type="submit" value="submit"> </p> </form> note the difference in appearance between the example with multiple set and the other file input without.
...And 4 more matches

HTML attribute: readonly - HTML: Hypertext Markup Language

Web › HTML › Attributes › readonly

the boolean readonly attribute, when present, makes the element not mutable, meaning the user can not edit the control.
... the boolean readonly attribute, when present, makes the element not mutable, meaning the user can not edit the control.
... the boolean readonly attribute, when present, makes the element not mutable, meaning the user can not edit the control.
...And 4 more matches

<frame> - HTML: Hypertext Markup Language

Web › HTML › Element › frame

<frame> is an html element which defines a particular area in which another html document can be displayed.
... <frame> is an html element which defines a particular area in which another html document can be displayed.
... <frame> is an html element which defines a particular area in which another html document can be displayed.
...And 4 more matches

<input type="checkbox"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › checkbox

<input> elements of type checkbox are rendered by default as boxes that are checked (ticked) when activated, like you might see in an official government paper form.
...e server to represent its unchecked state (e.g.
...ng to use as the value of the checkbox when submitting the form, if the checkbox is currently toggled on checked a boolean attribute indicating whether or not this checkbox is checked by default (when the page loads).
...And 4 more matches

<input type="radio"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › radio

<input> elements of type radio are generally used in radio groups—collections of radio buttons describing a set of related options.
...choice3" name="contact" value="mail"> <label for="contactchoice3">mail</label> </div> <div> <button type="submit">submit</button> </div> </form> here you see the three radio buttons, each with the name set to contact and each with a unique value that uniquely identifies that individual radio button within the group.
...unction(event) { var data = new formdata(form); var output = ""; for (const entry of data) { output = output + entry[0] + "=" + entry[1] + "\r"; }; log.innertext = output; event.preventdefault(); }, false); try this example out and see how there's never more than one result for the contact group.
...And 4 more matches

<slot> - HTML: Hypertext Markup Language

Web › HTML › Element › slot

the html <slot> element—part of the web components technology suite—is a placeholder inside a web component that you can fill with your own markup, which lets you create separate dom trees and present them together.
...e—is a placeholder inside a web component that you can fill with your own markup, which lets you create separate dom trees and present them together.
...ries flow content, phrasing content permitted content transparent events slotchange tag omission none, both the starting and ending tag are mandatory.
...And 4 more matches

<wbr> - HTML: Hypertext Markup Language

Web › HTML › Element › wbr

the html <wbr> element represents a word break opportunity—a position within text where the browser may optionally break a line, though its line-breaking rules would not otherwise create a break at that location.
...reate a break at that location.
...pository.
...And 4 more matches

class - HTML: Hypertext Markup Language

Web › HTML › Global attributes › class

the class global attribute is a space-separated list of the case-sensitive classes of the element.
... the class global attribute is a space-separated list of the case-sensitive classes of the element.
... the class global attribute is a space-separated list of the case-sensitive classes of the element.
...And 4 more matches

dir - HTML: Hypertext Markup Language

Web › HTML › Global attributes › dir

the dir global attribute is an enumerated attribute that indicates the directionality of the element's text.
... request.
...that are written from the left to the right (like english); rtl, which means right to left and is to be used for languages that are written from the right to the left (like arabic); auto, which lets the user agent decide.
...And 4 more matches

is - HTML: Hypertext Markup Language

Web › HTML › Global attributes › is

the is global attribute allows you to specify that a standard html element should behave like a defined custom built-in element (see using custom elements for more details).
... the is global attribute allows you to specify that a standard html element should behave like a defined custom built-in element (see using custom elements for more details).
... the is global attribute allows you to specify that a standard html element should behave like a defined custom built-in element (see using custom elements for more details).
...And 4 more matches

title - HTML: Hypertext Markup Language

Web › HTML › Global attributes › title

the title global attribute contains text representing advisory information related to the element it belongs to.
... the title global attribute contains text representing advisory information related to the element it belongs to.
...ated to the element it belongs to.
...And 4 more matches

CSP: script-src - HTTP

Web › HTTP › Headers › Content-Security-Policy › script-src

the http content-security-policy (csp) script-src directive specifies valid sources for javascript.
...de blob and filesystem from source directives.
...) and similar methods for creating code from strings.
...And 4 more matches

CSP: style-src - HTTP

Web › HTTP › Headers › Content-Security-Policy › style-src

de blob and filesystem from source directives.
...) and similar methods for creating code from strings.
... the single quotes.
...And 4 more matches

Expressions and operators - JavaScript

Web › JavaScript › Guide › Expressions and Operators

perator (,) simply evaluates both of its operands and returns the value of the last operand.
...oop, to allow multiple variables to be updated each time through the loop.
...2; // implicitly creates window.x var y = 43; var myobj = {h: 4}; // create object with property h delete x; // returns true (can delete if created implicitly) delete y; // returns false (cannot delete if declared with var) delete math.pi; // returns false (cannot delete non-configurable properties) delete myobj.h; // returns true (can delete user-defined properties) deleting array elements since arrays are just objects, it's technically possible to delete elements from them.
...And 4 more matches

Loops and iteration - JavaScript

Web › JavaScript › Guide › Loops and iteration

ly, the condition is assumed to be true.) the statement executes.
...date expression incrementexpression is executed.
...ical</option> <option>opera</option> </select> </p> <p><input id="btn" type="button" value="how many are selected?" /></p> </form> <script> function howmany(selectobject) { let numberselected = 0; for (let i = 0; i < selectobject.options.length; i++) { if (selectobject.options[i].selected) { numberselected++; } } return numberselected; } let btn = document.getelementbyid('btn'); btn.addeventlistener('click', function() { alert('number of options selected: ' + howmany(document.selectform.musictypes)); }); </script> do...while statement the do...while statement repeats until a specified condition evaluates to false.
...And 4 more matches

Array.prototype.concat() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › concat

rray.concat([value1[, value2[, ...[, valuen]]]]) parameters valuen optional arrays and/or values to concatenate into a new array.
.../or values to concatenate into a new array.
...ents in the object on which it is called, followed in order by, for each argument, the elements of that argument (if the argument is an array) or the argument itself (if the argument is not an array).
...And 4 more matches

Array.prototype.length - JavaScript

Web › JavaScript › Reference › Global Objects › Array › length

the length property of an object which is an instance of type array sets or returns the number of elements in that array.
...rangeerror: invalid array length console.log(namelistc.length); //rangeerror: invalid array length var namelistb = []; namelistb.length = math.pow(2,32)-1; //set array length less than 2 to the 32nd power console.log(namelistb.length); //4294967295 you can set the length property to truncate an array at any time.
... namelistb = []; namelistb.length = math.pow(2,32)-1; //set array length less than 2 to the 32nd power console.log(namelistb.length); //4294967295 you can set the length property to truncate an array at any time.
...And 4 more matches

Array.prototype.reverse() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › reverse

the reverse() method reverses an array in place.
... the reverse() method reverses an array in place.
...ment becomes the last, and the last array element becomes the first.
...And 4 more matches

Map - JavaScript

Web › JavaScript › Reference › Global Objects › Map

the map object holds key-value pairs and remembers the original insertion order of the keys.
... constructor map() creates a new map object.
...get map[@@species] the constructor function that is used to create derived objects.
...And 4 more matches

SharedArrayBuffer.prototype.slice() - JavaScript

Web › JavaScript › Reference › Global Objects › SharedArrayBuffer › slice

you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...ptional zero-based index at which to begin extraction.
...t which to begin extraction.
...And 4 more matches

String.prototype.split() - JavaScript

Web › JavaScript › Reference › Global Objects › String › split

haracter; this is used to split a delimited string.
...and separator are both empty strings, an empty array is returned.
...rray is returned.
...And 4 more matches

TypedArray.prototype.indexOf() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › indexOf

the indexof() method returns the first index at which a given element can be found in the typed array, or -1 if it is not present.
...-1 if it is not present.
...me algorithm as array.prototype.indexof().
...And 4 more matches

TypedArray.prototype.lastIndexOf() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › lastIndexOf

the lastindexof() method returns the last index at which a given element can be found in the typed array, or -1 if it is not present.
...ng at fromindex.
...ototype.lastindexof().
...And 4 more matches

WeakRef - JavaScript

Web › JavaScript › Reference › Global Objects › WeakRef

ned.
... target of a weakref, it will always only ever be the original target object or undefined when that target has been reclaimed.
... target object or undefined when that target has been reclaimed.
...And 4 more matches

<mtable> - MathML

Web › MathML › Element › mtable

the mathml <mtable> element allows you to create tables or matrices.
... the mathml <mtable> element allows you to create tables or matrices.
... the mathml <mtable> element allows you to create tables or matrices.
...And 4 more matches

Web video codec guide - Web media technologies

Web › Media › Formats › Video codecs

including specific capabilities and compatibility issues you may need to be aware of.
...crifices you're able to make are entirely up to you and/or your design team.
...e of modern processors.
...And 4 more matches

clip - SVG: Scalable Vector Graphics

Web › SVG › Attribute › clip

the clip attribute is a presentation attribute defining the visible region of an element.
... the clip attribute is a presentation attribute defining the visible region of an element.
... defining the visible region of an element.
...And 4 more matches

viewBox - SVG: Scalable Vector Graphics

Web › SVG › Attribute › viewBox

the viewbox attribute defines the position and dimension, in user space, of an svg viewport.
...t of coordinate 0,0 in the center of the viewport the value 50% is resolve to 5 which means the center of the circle is in the bottom/right corner of the viewport.
... 0,0 in the center of the viewport the value 50% is resolve to 5 which means the center of the circle is in the bottom/right corner of the viewport.
...And 4 more matches

<cursor> - SVG: Scalable Vector Graphics

Web › SVG › Element › cursor

note: the css cursor property should be used instead of this element.
... note: the css cursor property should be used instead of this element.
... note: the css cursor property should be used instead of this element.
...And 4 more matches

<filter> - SVG: Scalable Vector Graphics

Web › SVG › Element › filter

the <filter> svg element defines a custom filter effect by grouping atomic filter primitives.
... the <filter> svg element defines a custom filter effect by grouping atomic filter primitives.
... the <filter> svg element defines a custom filter effect by grouping atomic filter primitives.
...And 4 more matches

<g> - SVG: Scalable Vector Graphics

Web › SVG › Element › g

the <g> svg element is a container used to group other svg elements.
... the <g> svg element is a container used to group other svg elements.
... the <g> svg element is a container used to group other svg elements.
...And 4 more matches

<linearGradient> - SVG: Scalable Vector Graphics

Web › SVG › Element › linearGradient

the <lineargradient> element lets authors define linear gradients that can be applied to fill or stroke of graphical elements.
... the <lineargradient> element lets authors define linear gradients that can be applied to fill or stroke of graphical elements.
... the <lineargradient> element lets authors define linear gradients that can be applied to fill or stroke of graphical elements.
...And 4 more matches

<metadata> - SVG: Scalable Vector Graphics

Web › SVG › Element › metadata

the <metadata> svg element adds metadata to svg content.
... the <metadata> svg element adds metadata to svg content.
... the <metadata> svg element adds metadata to svg content.
...And 4 more matches

<radialGradient> - SVG: Scalable Vector Graphics

Web › SVG › Element › radialGradient

the <radialgradient> element lets authors define radial gradients that can be applied to fill or stroke of graphical elements.
... the <radialgradient> element lets authors define radial gradients that can be applied to fill or stroke of graphical elements.
... the <radialgradient> element lets authors define radial gradients that can be applied to fill or stroke of graphical elements.
...And 4 more matches

<symbol> - SVG: Scalable Vector Graphics

Web › SVG › Element › symbol

the <symbol> element is used to define graphical template objects which can be instantiated by a <use> element.
... the <symbol> element is used to define graphical template objects which can be instantiated by a <use> element.
...ttribute determines the x coordinate of the symbol.
...And 4 more matches

<tref> - SVG: Scalable Vector Graphics

Web › SVG › Element › tref

the textual content for a <text> svg element can be either character data directly embedded within the <text> element or the character data content of a referenced element, where the referencing is specified with a <tref> element.
... the textual content for a <text> svg element can be either character data directly embedded within the <text> element or the character data content of a referenced element, where the referencing is specified with a <tref> element.
... the textual content for a <text> svg element can be either character data directly embedded within the <text> element or the character data content of a referenced element, where the referencing is specified with a <tref> element.
...And 4 more matches

Introduction - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › Introduction

veral competing formats had been submitted to the w3c and failed to be fully ratified.
...pported by all major browsers.
...terface available for it, and not requiring third-party extensions.
...And 4 more matches

SVG In HTML Introduction - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › SVG In HTML Introduction

late the picture in the same way you would script regular html.
...> <lineargradient id="gradient"> <stop class="begin" offset="0%"/> <stop class="end" offset="100%"/> </lineargradient> <rect x="0" y="0" width="100" height="100" style="fill:url(#gradient)" /> <circle cx="50" cy="50" r="30" style="fill:url(#gradient)" /> </svg> </body> </html> discussion the page is mainly regular html, css and javascript.
...adient"> <stop class="begin" offset="0%"/> <stop class="end" offset="100%"/> </lineargradient> <rect x="0" y="0" width="100" height="100" style="fill:url(#gradient)" /> <circle cx="50" cy="50" r="30" style="fill:url(#gradient)" /> </svg> </body> </html> discussion the page is mainly regular html, css and javascript.
...And 4 more matches

Index - XPath

Web › XPath › Index

ming xml with xslt document.
... attribute axe, xpath the attribute axis indicates the attributes of the context node.
...s not specify an axis, the child axis is understood by default.
...And 4 more matches

<xsl:attribute> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › attribute

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:attribute> element creates an attribute in the output document, using any values that can be accessed from the stylesheet.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:attribute> element creates an attribute in the output document, using any values that can be accessed from the stylesheet.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:attribute> element creates an attribute in the output document, using any values that can be accessed from the stylesheet.
...And 4 more matches

Understanding WebAssembly text format - WebAssembly

WebAssembly › Understanding the text format

e regions of linear memory with bytes, elem sections can be used to initialize regions of tables with functions: (module (table 2 funcref) (elem (i32.const 0) $f1 $f2) (func $f1 (result i32) i32.const 42) (func $f2 (result i32) i32.const 13) ...
...s needs to be declared at the start of the section, and specifies at what index in the table function references start to be populated.
...xes 0 and 1.
...And 4 more matches

page-worker - Archive of obsolete content

Archive › Add-ons › Add-on SDK › High-Level APIs › page-worker

code like this: pageworker = require("sdk/page-worker").page({ contentscript: "console.log(document.body.innerhtml);", contenturl: "./myfile.html" }); you can load a new page by setting the page worker's contenturl property.
...orage api.
...ferably, usually) the port api.
...And 3 more matches

window/utils - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs › window utils

: var { ci } = require('chrome'); var utils = require('sdk/window/utils'); var browserwindow = utils.getmostrecentbrowserwindow(); var window = browserwindow.content; // `window` object for the current webpage utils.gettoplevelwindow(window) == browserwindow // => true parameters window : nsidomwindow returns nsidomwindow getwindowdocshell(window) returns the nsidocshell for the tabbrowser element.
...ument hosted by the given window parameters window: nsidomwindow returns string: this document's title.
... given window parameters window: nsidomwindow returns string: this document's title.
...And 3 more matches

Intercepting Page Loads - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › Intercepting Page Loads

're planning on implementing any of these.
... want to remove it when we do not need it anymore.
...inally, the actual code for the handler, which is very simple: _onpageload : function(event) { // this is the content document of the loaded page.
...And 3 more matches

Block and Line Layout Cheat Sheet - Archive of obsolete content

Archive › Mozilla › Firefox › Block and Line Layout Cheat Sheet

the frame has had its initial reflow.
...s the structure that is "filled in" by a frame during reflow, and is used to communicate the frame's desired size information back to its container.
... by a frame during reflow, and is used to communicate the frame's desired size information back to its container.
...And 3 more matches

Using microformats - Archive of obsolete content

Archive › Mozilla › Firefox › Using microformats

it is replaced by the new one.
...e of the microformat to add to the microformat module.
... to the microformat module.
...And 3 more matches

Mozilla Application Framework in Detail - Archive of obsolete content

Archive › Mozilla › Mozilla Application Framework › Mozilla Application Framework in Detail

feel" of the native os.
...s, it will already possess a wealth of technical expertise that will be relevant for creating xul applications.
... even further by allowing you to even create your own custom interface widgets.
...And 3 more matches

New Security Model for Web Services - Archive of obsolete content

Archive › Mozilla › New Security Model for Web Services

cific verification header.
...ns file a more robust solution is to rely on getting a file named "web-scripts-access.xml" in the root directory of the server that the sandboxed script requests to communicate with.
...ution is to rely on getting a file named "web-scripts-access.xml" in the root directory of the server that the sandboxed script requests to communicate with.
...And 3 more matches

XML in Mozilla - Archive of obsolete content

Archive › Mozilla › XML in Mozilla

nology documentation xhtml w3c recommendation xml base w3c recommendation xlink (simple xlinks only) obsolete since gecko 2.0 w3c recommendation fixptr obsolete since gecko 1.9.1 w3c "proposal" xpointer framework obsolete since gecko 1.9.1 w3c recommendation xpointer element() scheme obsolete since gecko 1.9.1 w3c recommendation xpointer xmlns() scheme obsolete since gecko 1.9.1 w3c recommendation xpointer fixptr() scheme obsolete since gecko 1.9.1 this scheme is simply a wrapper for fixptr xpointer xpath1() scheme obsolete since gecko 1.9.1 internet-draft document.load(), documen...
...ll also notice not all xhtml features are supported when you exercise the html code path.
...l//en -//w3c//dtd xhtml 1.1//en -//w3c//dtd xhtml 1.0 strict//en -//w3c//dtd xhtml 1.0 frameset//en -//w3c//dtd xhtml basic 1.0//en -//w3c//dtd xhtml 1.1 plus mathml 2.0//en -//w3c//dtd xhtml 1.1 plus mathml 2.0 plus svg 1.1//en -//w3c//dtd svg 20001102//en -//wapforum//dtd xhtml mobile 1.0//en xml linking and pointing xml linking support includes xml base and simple xlinks.
...And 3 more matches

collapse - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › collapse

« xul reference home collapse type: one of the values below determines which side of the splitter is collapsed when its grippy is clicked.
... « xul reference home collapse type: one of the values below determines which side of the splitter is collapsed when its grippy is clicked.
...y is clicked.
...And 3 more matches

label - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › label

« xul reference home label type: string the label that will appear on the element.
... « xul reference home label type: string the label that will appear on the element.
... « xul reference home label type: string the label that will appear on the element.
...And 3 more matches

orient - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › orient

« xul reference home orient type: one of the values below used to specify whether the children of the element are oriented horizontally or vertically.
... « xul reference home orient type: one of the values below used to specify whether the children of the element are oriented horizontally or vertically.
... « xul reference home orient type: one of the values below used to specify whether the children of the element are oriented horizontally or vertically.
...And 3 more matches

Deprecated and defunct markup - Archive of obsolete content

Archive › Mozilla › XUL › Deprecated and defunct markup

{many elements on this page are wrongly marked as deprecated, this page needs review} the following xul tags and attribute should be considered deprecated, if not defunct.
... {many elements on this page are wrongly marked as deprecated, this page needs review} the following xul tags and attribute should be considered deprecated, if not defunct.
...his page needs review} the following xul tags and attribute should be considered deprecated, if not defunct.
...And 3 more matches

command - Archive of obsolete content

Archive › Mozilla › XUL › Events › command

the command event is executed when an element is activated.
... the command event is executed when an element is activated.
... the command event is executed when an element is activated.
...And 3 more matches

Introduction - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Introduction

.
...es are supported by default, rdf, xml and sqlite databases, however, processors may be written to support other types of datasources.
...rocessors may be written to support other types of datasources.
...And 3 more matches

RDF Modifications - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › RDF Modifications

djust the source of a 'triple'.
...hed.
...g a new result, removing an old result, or by changing the value of some part of the result.
...And 3 more matches

Rule Compilation - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Rule Compilation

query tag (new to ff3; ff2 only worked with rdf datasources and had no query tag), which you would place directly inside the <template>.
... while the second rule might apply only to results that are magazines.
... </rule> <rule> -- rule content goes here -- </rule> </template> </vbox> query/rule compilation and lazy content generation when the template builder starts processing, and after it has started the datasource loading, it first must compile the query and rules.
...And 3 more matches

Simple Example - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Simple Example

« previousnext » let's look a more useful example, this time for a template that will show a list of photos.
...ee images.
...le" object="?title"/> </query> the seed is set in a similar manner as the previous examples, effectively creating a single result with the ?start variable set to the reference resource 'http://www.xulplanet.com/rdf/myphotos'.
...And 3 more matches

XML Assignments - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › XML Assignments

ir name.
...des syntax to retrieve this using the built-in string-length method.
...retrieve this using the built-in string-length method.
...And 3 more matches

Tree Widget Changes - Archive of obsolete content

Archive › Mozilla › XUL › Tree Widget Changes

this describes changes in xul trees api for gecko 1.8.
...nger required on treecol elements just to get them to work.
...can modify the columns by just adjusting the treecol attributes directly.
...And 3 more matches

Adding Buttons - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Adding Buttons

, we will look at how to add some simple buttons to a window.
...ow.
...ted so far has had nothing in it, so it isn't very interesting yet.
...And 3 more matches

Features of a Window - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Features of a Window

al name of the window.
...e' is important to open the window as a chrome file.
...should have noticed that whenever elements were added to a window, the window's width expanded to fit the new elements.
...And 3 more matches

Introduction - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Introduction

nd modified quickly and easily.
...antages of other xml languages.
...kboxes toolbars with buttons or other content menus on a menu bar or pop up menus tabbed dialogs trees for hierarchical or tabular information keyboard shortcuts the displayed content can be created from the contents of a xul file or with data from a datasource.
...And 3 more matches

Modifying the Default Skin - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Modifying the Default Skin

« previousnext » as of firefox 69, you must set the toolkit.legacyuserprofilecustomizations.stylesheets preference to true in about:config in order to load userchrome.css or usercontent.css files.
...the style sheets associated with it.
...erlying code for mozilla calls them skins and the user interface calls them themes, they're both referring to the same thing).
...And 3 more matches

More Button Features - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › More Button Features

e 'skin' (in this case, the appearance of the image) to be changed without changing the xul file.
....png" orient="vertical" dir="reverse"/> the example here shows all four types of alignment of buttons.
...m, and it will be rendered inside the button.
...And 3 more matches

More Menu Features - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › More Menu Features

« previousnext » in this section, we'll look at creating submenus and checked menus creating submenus you can create submenus inside other menus (nested menus) using the existing elements.
... « previousnext » in this section, we'll look at creating submenus and checked menus creating submenus you can create submenus inside other menus (nested menus) using the existing elements.
... « previousnext » in this section, we'll look at creating submenus and checked menus creating submenus you can create submenus inside other menus (nested menus) using the existing elements.
...And 3 more matches

Toolbars - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Toolbars

« previousnext » a toolbar is usually placed along the top of a window and contains a number of buttons that perform common functions.
... « previousnext » a toolbar is usually placed along the top of a window and contains a number of buttons that perform common functions.
...r has been placed inside the toolbox.
...And 3 more matches

Updating Commands - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Updating Commands

« previousnext » in this section, we will look at how to update commands.
...forcommand("cmd_paste"); if (controller && controller.iscommandenabled("cmd_paste")){ controller.docommand(command); } the code above first retrieves the controller for the 'cmd_paste' command from the command dispatcher.
...ke the command on the necessary controller when called.
...And 3 more matches

binding - Archive of obsolete content

Archive › Mozilla › XUL › binding

broadcaster - Archive of obsolete content

Archive › Mozilla › XUL › broadcaster

« xul reference home [ examples | attributes | properties | methods | related ] a broadcaster is used when you want multiple elements to share one or more attribute values, or when you want elements to respond to a state change.
... « xul reference home [ examples | attributes | properties | methods | related ] a broadcaster is used when you want multiple elements to share one or more attribute values, or when you want elements to respond to a state change.
... on the broadcaster.
...And 3 more matches

dialogheader - Archive of obsolete content

Archive › Mozilla › XUL › dialogheader

« xul reference home [ examples | attributes | properties | methods | related ] a heading row for a dialog box.
... « xul reference home [ examples | attributes | properties | methods | related ] a heading row for a dialog box.
....0"?> <?xml-stylesheet href="chrome://global/skin/global.css" type="text/css"?> <dialog id="donothing" title="dialog example" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <dialogheader title="my dialog" description="example dialog"/>  </dialog> attributes crop type: one of the values below if the label of the element is too big to fit in its given space, the text will be cropped on the side specified by the crop attribute.
...And 3 more matches

hbox - Archive of obsolete content

Archive › Mozilla › XUL › hbox

tabpanel - Archive of obsolete content

Archive › Mozilla › XUL › tabpanel

template - Archive of obsolete content

Archive › Mozilla › XUL › template

treecols - Archive of obsolete content

Archive › Mozilla › XUL › treecols

treeseparator - Archive of obsolete content

Archive › Mozilla › XUL › treeseparator

vbox - Archive of obsolete content

Archive › Mozilla › XUL › vbox

Windows and menus in XULRunner - Archive of obsolete content

Archive › Mozilla › XULRunner › Windows and menus in XULRunner

pplication.
... each window or dialog should be created in its own xul file.
...: <?xml version="1.0"?> <?xml-stylesheet href="chrome://basicapp/skin/main.css" type="text/css"?> <!doctype window system "chrome://basicapp/locale/main.dtd"> <window id="main" title="&title;" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <script src="main.js"/> ...
...And 3 more matches

Why RSS Slash is Popular - Counting Your Comments - Archive of obsolete content

Archive › RSS › Article › Why RSS Slash is Popular - Counting Your Comments

anonymous coward, and the recognition of the slashdot effect, a phenomena that adorns its name.
... <title>first article!</title> <guid>d77d2e80-0487-4e8c-a35d-a93f12a0ff7d:2005/05/15/112</guid> <pubdate>sun, 15 may 2005 08:14:11 -0500</lastbuilddate></pubdate> <link>http://www.example.com/blog/2005/05/15/112</link> <slash:comments>118</slash:comments> </item> </channel> </rss> the <slash:comments> element is it reason that the rss slash module is popular.
...d>d77d2e80-0487-4e8c-a35d-a93f12a0ff7d:2005/05/15/112</guid> <pubdate>sun, 15 may 2005 08:14:11 -0500</lastbuilddate></pubdate> <link>http://www.example.com/blog/2005/05/15/112</link> <slash:comments>118</slash:comments> </item> </channel> </rss> the <slash:comments> element is it reason that the rss slash module is popular.
...And 3 more matches

Syndicating content with RSS - Archive of obsolete content

Archive › RSS › Getting Started › Syndicating

.
... or an internet television show, you are syndicating.
... special <link> element to html page(s).
...And 3 more matches

:-moz-system-metric() - Archive of obsolete content

Archive › Web › CSS › :-moz-system-metric

sub-page to this page.
...rome code).
...ement if the computer's user interface supports images in menus.:-moz-system-metric(mac-graphite-theme):-moz-system-metric(mac-graphite-theme) will match an element if the user has chosen the "graphite" appearance in the "appearance" prefpane of the mac os x system preferences.:-moz-system-metric(scrollbar-end-backward)the :-moz-system-metric(scrollbar-end-backward) css pseudo-class will match an element if the computer's user interface includes a backward arrow button at the end of scrollbars.:-moz-system-metric(scrollbar-end-forward)the :-moz-system-metric(scrollbar-end-forward) css pseudo-class will match an element if the computer's user interface includes a forward arrow button at the end of scrollbars.:-moz-system-metric(scrollbar-start-backward)the :-moz-system-metric(scrollbar-start-backw...
...And 3 more matches

New in JavaScript 1.3 - Archive of obsolete content

Archive › Web › JavaScript › New in JavaScript › 1.3

th, day, [,hours [, minutes [, seconds [, milliseconds ]]]]) additional method parameters: setmonth(month[, date]) sethours(hours[, min[, sec[, ms]]]) setminutes(min[, sec[, ms]]) setseconds(sec[, ms]) the length of an array (property length) is now an unsigned, 32-bit integer.
...) setminutes(min[, sec[, ms]]) setseconds(sec[, ms]) the length of an array (property length) is now an unsigned, 32-bit integer.
... ms]]) setseconds(sec[, ms]) the length of an array (property length) is now an unsigned, 32-bit integer.
...And 3 more matches

RFE to the XForms API - Archive of obsolete content

Archive › Web › XForms › RFE › XForms API

introduction this page contains requests for enhancement to the xforms api.
... introduction this page contains requests for enhancement to the xforms api.
...ge contains requests for enhancement to the xforms api.
...And 3 more matches

Building up a basic demo with the PlayCanvas engine - Game development

Games › Techniques › 3D on the web › Building up a basic demo with PlayCanvas › engine

ture here's the html structure we will use.
...00%; height: 100%; } </style> </head> <body> <script src="playcanvas-latest.js"></script> <canvas id="application-canvas"></canvas> <script> var canvas = document.getelementbyid("application-canvas"); /* all our javascript code goes here */ </script> </body> </html> it contains some basic information like the document <title>, and some css to set the width and height of the <canvas> element that playcanvas will use to 100% so that it will fill the entire available viewport space.
...canvas"></canvas> <script> var canvas = document.getelementbyid("application-canvas"); /* all our javascript code goes here */ </script> </body> </html> it contains some basic information like the document <title>, and some css to set the width and height of the <canvas> element that playcanvas will use to 100% so that it will fill the entire available viewport space.
...And 3 more matches

Initialize the framework - Game development

Games › Tutorials › 2D breakout game Phaser › Initialize the framework

s the first of 16 tutorials to learn how to use gamedev phaser.
...r this section at gamedev-phaser-content-kit/demos/lesson01.html.
...ownload page, below the links for the v3 download.
...And 3 more matches

Plug-in Development Overview - Gecko Plugin API Reference

Gecko Plugin API Reference › Plug-in Development Overview

so see making plug-ins scriptable for more information about making plug-ins accessible from the browser.
...html elements to use, see using html to display plug-ins.
...g-ins.
...And 3 more matches

Block - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Block

the term block can have several meanings depending on the context.
... the term block can have several meanings depending on the context.
... the term block can have several meanings depending on the context.
...And 3 more matches

XInclude - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › XInclude

s.
...esolvable into a single xml document.
...avior completely.) note also that if you wish to allow xml:base, you will need the xml:base function, and the line beginning var href = ...
...And 3 more matches

CSS building blocks - Learn web development

Learn › CSS › Building blocks

test your understanding.
... how conflicts are resolved.
...of values that are allowed for that property.
...And 3 more matches

What is CSS? - Learn web development

Learn › CSS › First steps › What is CSS

nd underlined to distinguish them from the rest of the text.
...can be used to create layout — for example turning a single column of text into a layout with a main content area and a sidebar for related information.
...layout — for example turning a single column of text into a layout with a main content area and a sidebar for related information.
...And 3 more matches

What is a URL? - Learn web development

Learn › Common questions › What is a URL

in the building; and, finally, the anchor represents the actual person to whom you've addressed your mail.
...o whom you've addressed your mail.
... the browser's address bar to get to the resource behind it.
...And 3 more matches

Creating hyperlinks - Learn web development

Learn › HTML › Introduction to HTML › Creating hyperlinks

the file (in which case you can try to deal with it later on).
...earning: creating your own example link create an html document using your local code editor and our getting started template.
...ur local code editor and our getting started template.
...And 3 more matches

Marking up a letter - Learn web development

Learn › HTML › Introduction to HTML › Marking up a letter

previous overview: introduction to html next we all learn to write a letter sooner or later; it is also a useful example to test our text formatting skills.
... help section at the bottom of this page.
...uding doctype, and <html>, <head> and <body> elements.
...And 3 more matches

Structuring a page of content - Learn web development

Learn › HTML › Introduction to HTML › Structuring a page of content

page.
... area containing two columns — a main block to contain the welcome text, and a sidebar to contain image thumbnails.
...the provided css to the page by adding another <link> element just below the existing one provided at the start.
...And 3 more matches

Making asynchronous programming easier with async and await - Learn web development

Learn › JavaScript › Asynchronous › Async await

eal example.
...romises and how they work, but let's convert this to use async/await to see how much simpler it makes things: async function myfetch() { let response = await fetch('coffee.jpg'); if (!response.ok) { throw new error(`http error!
..., bringing the second half of the function out into a new block to make it more flexible: async function myfetch() { let response = await fetch('coffee.jpg'); if (!response.ok) { throw new error(`http error!
...And 3 more matches

Introducing asynchronous JavaScript - Learn web development

Learn › JavaScript › Asynchronous › Introducing

ticle.
...xample (see it live here, and see the source): const btn = document.queryselector('button'); btn.addeventlistener('click', () => { alert('you clicked me!'); let pelem = document.createelement('p'); pelem.textcontent = 'this is a newly-added paragraph.'; document.body.appendchild(pelem); }); in this block, the lines are executed one after the other: we grab a reference to a <button> element that is already available in the dom.
...); pelem.textcontent = 'this is a newly-added paragraph.'; document.body.appendchild(pelem); }); in this block, the lines are executed one after the other: we grab a reference to a <button> element that is already available in the dom.
...And 3 more matches

Image gallery - Learn web development

Learn › JavaScript › Building blocks › Image gallery

rab the zip file for the example, unzip it somewhere on your computer, and do the exercise locally to begin with.
... into a working program.
...y a darkening effect to the image via a semi-transparent background color), and a <button> that is used to control the darkening effect.
...And 3 more matches

Object building practice - Learn web development

Learn › JavaScript › Objects › Object building practice

g the way we'll make use of some nifty objects, and show you a couple of nice techniques like bouncing balls off walls, and checking whether they have hit each other (otherwise known as collision detection).
... use of some nifty objects, and show you a couple of nice techniques like bouncing balls off walls, and checking whether they have hit each other (otherwise known as collision detection).
...ow you a couple of nice techniques like bouncing balls off walls, and checking whether they have hit each other (otherwise known as collision detection).
...And 3 more matches

Multimedia: Images - Learn web development

Learn › Performance › Multimedia

ore advanced formats like high efficiency image file format (heif) or av1 still image file format (avif).
...iency image file format (heif) or av1 still image file format (avif).
... then there is also online services that you can use as image cdns that will automate the serving of the correct image format on-the-fly, according to the type of device or browser requesting the image.
...And 3 more matches

Framework main features - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Main features

avascript that brings html-like syntax to a javascript environment.
...s html-like syntax to a javascript environment.
...er> <h1>hello, {subject}!</h1> </header> ); this expression represents an html <header> element with a <h1> element inside.
...And 3 more matches

Componentizing our React app - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › React components

show a sensible way of breaking our todo list app into components.
...turn something.
...at) should have a value of true; the rest should be false: <todo name="eat" completed={true} /> <todo name="sleep" completed={false} /> <todo name="repeat" completed={false} /> as before, we must go back to todo.js to actually use these props.
...And 3 more matches

React interactivity: Events and state - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › React interactivity events state

he case study app interactive.
...rs directly on the elements in our jsx, like this: <button type="button" onclick={() => alert("hi!")} > say hi!
...() component function, create a function named handlesubmit().
...And 3 more matches

Beginning our React todo list - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › React todo list beginning

<button type="button" classname="btn"> edit <span classname="visually-hidden">repeat</span> </button> <button type="button" classname="btn btn__danger"> delete <span classname="visually-hidden">repeat</span> </button> </div> </li> </ul> </div> ); } now open public/index.html and change the <title> element’s text to todomatic.
...index.html and change the <title> element’s text to todomatic.
...s</span> </button> here, aria-pressed tells assistive technology (like screen readers) that the button can be in one of two states: pressed or unpressed.
...And 3 more matches

Accessibility information for UI designers and developers

Mozilla › Accessibility › Accessibility information for UI designers

can use the labels instead.
... 2 times the font size set letter spacing (tracking) to at least 0.12 times the font size set word spacing to at least 0.16 times the font size this does not mean that your page needs to offer controls to make such changes, merely that if someone does these things in a custom stylesheet, they should not break the interface.
....12 times the font size set word spacing to at least 0.16 times the font size this does not mean that your page needs to offer controls to make such changes, merely that if someone does these things in a custom stylesheet, they should not break the interface.
...And 3 more matches

A bird's-eye view of the Mozilla framework

Mozilla › Bird s Eye View of the Mozilla Framework

nents, and specifies the mechanism clients use to query an xpcom component for one of its interfaces, and to release the interface when it’s no longer needed.
...ne of its interfaces, and to release the interface when it’s no longer needed.
...javascript client example suppose the javascript service in figure 2 is getlink() in help.js, which responds to the user clicking on a link in thecontents panel within thehelp viewer window by obtaining the link from thecontents panel elements stored in a dom tree.
...And 3 more matches

PR_NEXT_LINK

Mozilla › Projects › NSPR › Reference › PR NEXT LINK

returns the next element in a list.
... returns the next element in a list.
... returns the next element in a list.
...And 3 more matches

PR_PREV_LINK

Mozilla › Projects › NSPR › Reference › PR PREV LINK

returns the preceding element in a list.
... returns the preceding element in a list.
... returns the preceding element in a list.
...And 3 more matches

JS_DefineFunctions

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS DefineFunctions

name type description cx jscontext * the context in which to define functions.
... onlydefinelateproperties define only properties which have a jsprop_define_late flag.
...e no jsprop_define_late flag.
...And 3 more matches

Gecko object attributes

Mozilla › Tech › Accessibility › AT-APIs › Gecko › Attrs

ction you can obtain object attributes by nsiaccessible.getattributes() method.
...n by a descendent with the same object attribute.
...ch apply only to substrings in a text object.
...And 3 more matches

nsIDOMChromeWindow

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMChromeWindow

this interface is implemented on the window object in chrome.
...t button of the document to the window by using this method.
...cument to the window by using this method.
...And 3 more matches

nsIDocShell

Mozilla › Tech › XPCOM › Reference › Interface › nsIDocShell

docshell/base/nsidocshell.idlscriptable ???
...nts disallow scripting, unless the only reason for js being disabled in this docshell is a parent docshell having a document that is in design mode.
...coding for the container frame.
...And 3 more matches

nsIMsgSearchSession

Mozilla › Tech › XPCOM › Reference › Interface › nsIMsgSearchSession

boolean isstringattribute(in nsmsgsearchattribvalue attrib); void addallscopes(in nsmsgsearchscopevalue attrib); void search(in nsimsgwindow awindow); void interruptsearch(); void pausesearch(); void resumesearch(); [noscript] nsmsgsearchtype setsearchparam(in nsmsgsearchtype type, in voidptr param); [noscript] void addresultelement(in nsmsgresultelement element); boolean matchhdr(in nsimsgdbhdr amsghdr, in nsimsgdatabase adatabase); void addsearchhit(in nsimsgdbhdr header, in nsimsgfolder folder); attributes attribute type description searchterms nsisupportsarray readonly: numsearchterms unsigned long readonly: runningadapter nsimsgsearchad...
...g., to reparse a local folder) and wants to pause the timer while running the url.
...nts to pause the timer while running the url.
...And 3 more matches

nsIXULBrowserWindow

Mozilla › Tech › XPCOM › Reference › Interface › nsIXULBrowserWindow

s than those listed here, which are only the ones available to c++ code.
...hose listed here, which are only the ones available to c++ code.
...ault status.
...And 3 more matches

XPCOM Interface Reference

Mozilla › Tech › XPCOM › Reference › Interface

anagernsicookiemanager2nsicookiepermissionnsicookiepromptservicensicookieservicensicookiestoragensicrashreporternsicryptohmacnsicryptohashnsicurrentcharsetlistenernsicyclecollectorlistenernsidbchangelistenernsidbfolderinfonsidnslistenernsidnsrecordnsidnsrequestnsidnsservicensidomcanvasrenderingcontext2dnsidomchromewindownsidomclientrectnsidomdesktopnotificationnsidomdesktopnotificationcenternsidomelementnsidomeventnsidomeventgroupnsidomeventlistenernsidomeventtargetnsidomfilensidomfileerrornsidomfileexceptionnsidomfilelistnsidomfilereadernsidomfontfacensidomfontfacelistnsidomgeogeolocationnsidomgeopositionnsidomgeopositionaddressnsidomgeopositioncallbacknsidomgeopositioncoordsnsidomgeopositionerrornsidomgeopositionerrorcallbacknsidomgeopositionoptionsnsidomglobalpropertyinitializernsidomhtmlaudio...
...nsidomeventnsidomeventgroupnsidomeventlistenernsidomeventtargetnsidomfilensidomfileerrornsidomfileexceptionnsidomfilelistnsidomfilereadernsidomfontfacensidomfontfacelistnsidomgeogeolocationnsidomgeopositionnsidomgeopositionaddressnsidomgeopositioncallbacknsidomgeopositioncoordsnsidomgeopositionerrornsidomgeopositionerrorcallbacknsidomgeopositionoptionsnsidomglobalpropertyinitializernsidomhtmlaudioelementnsidomhtmlformelementnsidomhtmlmediaelementnsidomhtmlsourceelementnsidomhtmltimerangesnsidomjswindownsidommousescrolleventnsidommoznetworkstatsnsidommoznetworkstatsdatansidommoznetworkstatsmanagernsidommoztoucheventnsidomnshtmldocumentnsidomnavigatordesktopnotificationnsidomnodensidomofflineresourcelistnsidomorientationeventnsidomparsernsidomprogresseventnsidomserializernsidomsimplegestureeventnsi...
...listnsidomorientationeventnsidomparsernsidomprogresseventnsidomserializernsidomsimplegestureeventnsidomstoragensidomstorage2nsidomstorageeventobsoletensidomstorageitemnsidomstoragelistnsidomstoragemanagernsidomstoragewindownsidomuserdatahandlernsidomwindownsidomwindow2nsidomwindowinternalnsidomwindowutilsnsidomxpathevaluatornsidomxpathexceptionnsidomxpathexpressionnsidomxpathresultnsidomxulcontrolelementnsidomxulelementnsidomxullabeledcontrolelementnsidomxulselectcontrolelementnsidomxulselectcontrolitemelementnsidatasignatureverifiernsidebugnsidebug2nsidevicemotionnsidevicemotiondatansidevicemotionlistenernsidialogcreatornsidialogparamblocknsidictionarynsidirindexnsidirindexlistenernsidirindexparsernsidirectoryenumeratornsidirectoryiteratornsidirectoryservicensidirectoryserviceprovidernsidirector...
...And 3 more matches

Mozilla

in which we do so.
...e this document has migrated to using c++ in mozilla code.
...ators in the mozilla source tree.
...And 3 more matches

Initialization and Destruction - Plugins

Plugins › Guide › Initialization and Destruction

tance->pdata).
...oked, either np_embed or np_full.
...r content.
...And 3 more matches

Plug-in Development Overview - Plugins

Plugins › Guide › Plug-in Development Overview

so see making plug-ins scriptable for more information about making plug-ins accessible from the browser.
...html elements to use, see using html to display plug-ins.
...g-ins.
...And 3 more matches

All keyboard shortcuts - Firefox Developer Tools

Tools › Keyboard shortcuts

lbox is in a separate window and not in foreground) ctrl + shift + i or f12 cmd + opt + i or f12 ctrl + shift + i or f12 close toolbox (if the toolbox is in a separate window and in foreground) ctrl + shift + i or f12 cmd + opt + i or f12 ctrl + shift + i or f12 open web console 1 ctrl + shift + k cmd + opt + k ctrl + shift + k toggle "pick an element from the page" (opens the toolbox and/or focus the inspector tab) ctrl + shift + c cmd + opt + c ctrl + shift + c open style editor shift + f7 shift + f7 * shift + f7 open profiler shift + f5 shift + f5 * shift + f5 open network monitor 2 ctrl + shift + e cmd + opt + e ctrl + shift + e toggle responsive design mode ctrl + ...
... / ctrl + y indent tab tab tab unindent shift + tab shift + tab shift + tab move line(s) up alt + up alt + up alt + up move line(s) down alt + down alt + down alt + down comment/uncomment line(s) ctrl + / cmd + / ctrl + / page inspector command windows macos linux inspect element ctrl + shift + c cmd + shift + c ctrl + shift + c node picker these shortcuts work while the node picker is active.
... down alt + down alt + down comment/uncomment line(s) ctrl + / cmd + / ctrl + / page inspector command windows macos linux inspect element ctrl + shift + c cmd + shift + c ctrl + shift + c node picker these shortcuts work while the node picker is active.
...And 3 more matches

Taking screenshots - Firefox Developer Tools

Tools › Taking screenshots

you can use the developer tools to take a screenshot of the entire page, or of a single element in the page.
... default, the screenshot icon is not enabled.
...ed.
...And 3 more matches

AnimationEvent() - Web APIs

Web › API › AnimationEvent › AnimationEvent

the animationevent() constructor returns a newly created animationevent, representing an event in relation with an animation.
... the animationevent() constructor returns a newly created animationevent, representing an event in relation with an animation.
...it defaults to "".
...And 3 more matches

AudioContext.createMediaStreamSource() - Web APIs

Web › API › AudioContext › createMediaStreamSource

parameters stream a mediastream to serve as an audio source to be fed into an audio processing graph for use and manipulation.
...xample in this example, we grab a media (audio + video) stream from navigator.getusermedia, feed the media into a <video> element to play then mute the audio, but then also feed the audio into a mediastreamaudiosourcenode.
... audio sound more bass heavy!
...And 3 more matches

AudioTrackList.onremovetrack - Web APIs

Web › API › AudioTrackList › onremovetrack

the audiotracklist onremovetrack event handler is called when the removetrack event occurs, indicating that an audio track has been removed from the media element, and therefore also from the audiotracklist.
... the audiotracklist onremovetrack event handler is called when the removetrack event occurs, indicating that an audio track has been removed from the media element, and therefore also from the audiotracklist.
...property identifies the track that was removed from the media element's audiotracklist.
...And 3 more matches

BaseAudioContext.createStereoPanner() - Web APIs

Web › API › BaseAudioContext › createStereoPanner

od of the baseaudiocontext interface creates a stereopannernode, which can be used to apply stereo panning to an audio source.
...to an audio source.
...e the music is playing pans the music across to the left and right speakers of the output, respectively.
...And 3 more matches

CanvasRenderingContext2D.arcTo() - Web APIs

Web › API › CanvasRenderingContext2D › arcTo

ine two straight segments: one from the starting point to a first control point, and another from there to a second control point.
...canvas> javascript the arc begins at the point specified by moveto(): (230, 20).
...esult of a large radius if you use a relatively large radius, the arc may appear in a place you didn't expect.
...And 3 more matches

CanvasRenderingContext2D.canvas - Web APIs

Web › API › CanvasRenderingContext2D › canvas

the canvasrenderingcontext2d.canvas property, part of the canvas api, is a read-only reference to the htmlcanvaselement object that is associated with a given context.
... the canvasrenderingcontext2d.canvas property, part of the canvas api, is a read-only reference to the htmlcanvaselement object that is associated with a given context.
... the canvasrenderingcontext2d.canvas property, part of the canvas api, is a read-only reference to the htmlcanvaselement object that is associated with a given context.
...And 3 more matches

Advanced animations - Web APIs

Web › API › Canvas API › Tutorial › Advanced animations

drawing a ball we are going to use a ball for our animation studies, so let's first draw that ball onto the canvas.
...rc() method.
...hod: if (ball.y + ball.vy > canvas.height || ball.y + ball.vy < 0) { ball.vy = -ball.vy; } if (ball.x + ball.vx > canvas.width || ball.x + ball.vx < 0) { ball.vx = -ball.vx; } first demo let's see how it looks in action so far.
...And 3 more matches

Optimizing canvas - Web APIs

Web › API › Canvas API › Tutorial › Optimizing canvas

« previousnext » the <canvas> element is one of the most widely used tools for rendering 2d graphics on the web.
... « previousnext » the <canvas> element is one of the most widely used tools for rendering 2d graphics on the web.
...ves or repeating objects on an offscreen canvas if you find yourself repeating some of the same drawing operations on each animation frame, consider offloading them to an offscreen canvas.
...And 3 more matches

Pixel manipulation with canvas - Web APIs

Web › API › Canvas API › Tutorial › Pixel manipulation with canvas

l array that getimagedata() provides us.
...th="300" height="227" style="float:left"></canvas> <div id="color" style="width:200px;height:50px;float:left"></div> var img = new image(); img.src = 'https://mdn.mozillademos.org/files/5397/rhino.jpg'; var canvas = document.getelementbyid('canvas'); var ctx = canvas.getcontext('2d'); img.onload = function() { ctx.drawimage(img, 0, 0); img.style.display = 'none'; }; var color = document.getelementbyid('color'); function pick(event) { var x = event.layerx; var y = event.layery; var pixel = ctx.getimagedata(x, y, 1, 1); var data = pixel.data; var rgba = 'rgba(' + data[0] + ', ' + data[1] + ', ' + data[2] + ', ' + (data[3] / 255) + ')'; color.style.background = rgba; color.textcontent = rgba; } canvas.addeventlistener('mousemove', pick); painting pixel data int...
...on wikipedia for more information.
...And 3 more matches

CharacterData - Web APIs

Web › API › CharacterData

ter-events: all;} properties inherits properties from its parent, node, and implements the childnode and nondocumenttypechildnode interface.
...erits properties from its parent, node, and implements the childnode and nondocumenttypechildnode interface.
...ace.
...And 3 more matches

Document.createDocumentFragment() - Web APIs

Web › API › Document › createDocumentFragment

entfragment into which dom nodes can be added to build an offscreen dom tree.
...ever part of the main dom tree.
...ion and geometry).
...And 3 more matches

Document.createTreeWalker() - Web APIs

Web › API › Document › createTreeWalker

the document.createtreewalker() creator method returns a newly created treewalker object.
...ilter.show_cdata_section 8 shows cdatasection nodes.
... 8 shows cdatasection nodes.
...And 3 more matches

Document.getBoxObjectFor() - Web APIs

Web › API › Document › getBoxObjectFor

returns a boxobject (x, y, width, height) for a specified element.
... returns a boxobject (x, y, width, height) for a specified element.
... returns a boxobject (x, y, width, height) for a specified element.
...And 3 more matches

Events and the DOM - Web APIs

Web › API › Document Object Model › Events

how the various event interfaces relate to one another.
...llent diagram that clearly explains the three phases of event flow through the dom in the dom level 3 events draft.
...lick="alert('hello world!')"> the javascript code in the attribute is passed the event object via the event parameter.
...And 3 more matches

Example - Web APIs

Web › API › Document Object Model › Using the W3C DOM Level 1 Core › Example

<html> <head> <title>my document</title> <script type="text/javascript"> function change() { // document.getelementsbytagname("h1") returns a nodelist of the h1 // elements in the document, and the first is number 0: var header = document.getelementsbytagname("h1").item(0); // the firstchild of the header is a text node: header.firstchild.data = "a dynamic document"; // now the header is "a dynamic document".
... function change() { // document.getelementsbytagname("h1") returns a nodelist of the h1 // elements in the document, and the first is number 0: var header = document.getelementsbytagname("h1").item(0); // the firstchild of the header is a text node: header.firstchild.data = "a dynamic document"; // now the header is "a dynamic document".
...he header is a text node: header.firstchild.data = "a dynamic document"; // now the header is "a dynamic document".
...And 3 more matches

FullscreenOptions.navigationUI - Web APIs

Web › API › FullscreenOptions › navigationUI

the fullscreenoptions dictionary's navigationui property is used when calling requestfullscreen() to specify to what extent the user agent should include its standard user interface while the element is presented in full-screen mode.
...d include its standard user interface while the element is presented in full-screen mode.
... navigationui: value }; value the value of the navigationui property must be one of the following strings.
...And 3 more matches

GlobalEventHandlers.onanimationcancel - Web APIs

Web › API › GlobalEventHandlers › onanimationcancel

e animation is removed, or when the animating node is hidden—either directly or because any of its containing nodes are hidden—using css.
...s removed, or when the animating node is hidden—either directly or because any of its containing nodes are hidden—using css.
...opped or the page is closed.
...And 3 more matches

GlobalEventHandlers.ondrag - Web APIs

Web › API › GlobalEventHandlers › ondrag

a global event handler for the drag event.
... a global event handler for the drag event.
... a global event handler for the drag event.
...And 3 more matches

GlobalEventHandlers.ondragover - Web APIs

Web › API › GlobalEventHandlers › ondragover

a global event handler for the dragover event.
... a global event handler for the dragover event.
... a global event handler for the dragover event.
...And 3 more matches

GlobalEventHandlers.ondragstart - Web APIs

Web › API › GlobalEventHandlers › ondragstart

a global event handler for the dragstart event.
... a global event handler for the dragstart event.
... a global event handler for the dragstart event.
...And 3 more matches

GlobalEventHandlers.ondrop - Web APIs

Web › API › GlobalEventHandlers › ondrop

a global event handler for the drop event.
... a global event handler for the drop event.
... a global event handler for the drop event.
...And 3 more matches

GlobalEventHandlers.onerror - Web APIs

Web › API › GlobalEventHandlers › onerror

rs: when a javascript runtime error (including syntax errors and exceptions thrown within handlers) occurs, an error event using interface errorevent is fired at window and window.onerror() is invoked (as well as handlers attached by window.addeventlistener (not only capturing)).
...d exceptions thrown within handlers) occurs, an error event using interface errorevent is fired at window and window.onerror() is invoked (as well as handlers attached by window.addeventlistener (not only capturing)).
... load, and the onerror() handler on the element is invoked.
...And 3 more matches

GlobalEventHandlers.onpointercancel - Web APIs

Web › API › GlobalEventHandlers › onpointercancel

the onpointercancel property of the globaleventhandlers mixin is an eventhandler that processes pointercancel events.
... the onpointercancel property of the globaleventhandlers mixin is an eventhandler that processes pointercancel events.
... the onpointercancel property of the globaleventhandlers mixin is an eventhandler that processes pointercancel events.
...And 3 more matches

GlobalEventHandlers.onpointerenter - Web APIs

Web › API › GlobalEventHandlers › onpointerenter

the onpointerenter property of the globaleventhandlers mixin is an eventhandler that processes pointerenter events.
... the onpointerenter property of the globaleventhandlers mixin is an eventhandler that processes pointerenter events.
... the onpointerenter property of the globaleventhandlers mixin is an eventhandler that processes pointerenter events.
...And 3 more matches

GlobalEventHandlers.onpointermove - Web APIs

Web › API › GlobalEventHandlers › onpointermove

the onpointermove property of the globaleventhandlers mixin is an eventhandler that processes pointermove events.
... the onpointermove property of the globaleventhandlers mixin is an eventhandler that processes pointermove events.
... the onpointermove property of the globaleventhandlers mixin is an eventhandler that processes pointermove events.
...And 3 more matches

GlobalEventHandlers.onpointerout - Web APIs

Web › API › GlobalEventHandlers › onpointerout

the onpointerout property of the globaleventhandlers mixin is an eventhandler that processes pointerout events.
... the onpointerout property of the globaleventhandlers mixin is an eventhandler that processes pointerout events.
... the onpointerout property of the globaleventhandlers mixin is an eventhandler that processes pointerout events.
...And 3 more matches

GlobalEventHandlers.onpointerover - Web APIs

Web › API › GlobalEventHandlers › onpointerover

the onpointerover property of the globaleventhandlers mixin is an eventhandler that processes pointerover events.
... the onpointerover property of the globaleventhandlers mixin is an eventhandler that processes pointerover events.
... the onpointerover property of the globaleventhandlers mixin is an eventhandler that processes pointerover events.
...And 3 more matches

GlobalEventHandlers.onpointerup - Web APIs

Web › API › GlobalEventHandlers › onpointerup

the onpointerup property of the globaleventhandlers mixin is an eventhandler that processes pointerup events.
... the onpointerup property of the globaleventhandlers mixin is an eventhandler that processes pointerup events.
... the onpointerup property of the globaleventhandlers mixin is an eventhandler that processes pointerup events.
...And 3 more matches

accessKeyLabel - Web APIs

Web › API › HTMLElement › accessKeyLabel

the htmlelement.accesskeylabel read-only property returns a string that represents the element's assigned access key (if any); otherwise it returns an empty string.
... the htmlelement.accesskeylabel read-only property returns a string that represents the element's assigned access key (if any); otherwise it returns an empty string.
... the htmlelement.accesskeylabel read-only property returns a string that represents the element's assigned access key (if any); otherwise it returns an empty string.
...And 3 more matches

HTMLFormControlsCollection - Web APIs

Web › API › HTMLFormControlsCollection

the htmlformcontrolscollection interface represents a collection of html form control elements.
... the htmlformcontrolscollection interface represents a collection of html form control elements.
... the htmlformcontrolscollection interface represents a collection of html form control elements.
...And 3 more matches

IntersectionObserver.IntersectionObserver() - Web APIs

Web › API › IntersectionObserver › IntersectionObserver

re it's syntactically correct, the thresholds are checked to ensure that they're all in the range 0.0 and 1.0 inclusive, and the threshold list is sorted in ascending numeric order.
...he intersectionobserver for which the callback is being invoked.
...be considered the viewport.
...And 3 more matches

IntersectionObserver.rootMargin - Web APIs

Web › API › IntersectionObserver › rootMargin

the intersectionobserver interface's read-only rootmargin property is a string with syntax similar to that of the css margin property.
... the intersectionobserver interface's read-only rootmargin property is a string with syntax similar to that of the css margin property.
...corresponding side in the root element's bounding box before the intersection test is performed.
...And 3 more matches

MediaStreamAudioSourceNode - Web APIs

Web › API › MediaStreamAudioSourceNode

easily rely on the order matching between any two browsers or browser versions.
...xample in this example, we grab a media (audio + video) stream from navigator.getusermedia, feed the media into a <video> element to play then mute the audio, but then also feed the audio into a mediastreamaudiosourcenode.
... audio sound more bass heavy!
...And 3 more matches

MediaStreamTrackAudioSourceNode - Web APIs

Web › API › MediaStreamTrackAudioSourceNode

eamtrackaudiosourcenode object instance with the specified options.
...xample in this example, we grab a media (audio + video) stream from navigator.getusermedia, feed the media into a <video> element to play then mute the audio, but then also feed the audio into a mediastreamaudiosourcenode.
... audio sound more bass heavy!
...And 3 more matches

msPlayToSource - Web APIs

Web › API › MsPlayToSource

non-standard this feature is non-standard and is not on a standards track.
...he behavior may change in the future.
...specific to internet explorer and microsoft edge.
...And 3 more matches

MutationObserver.observe() - Web APIs

Web › API › MutationObserver › observe

match the given options.
...ng the moved node or subtree for changes.
...s that if you keep track of the mutationrecord objects describing the changes that occur, you should be able to "undo" the changes, rewinding the dom back to its initial state.
...And 3 more matches

Node.cloneNode() - Web APIs

Web › API › Node › cloneNode

to another node that is part of the document (using node.appendchild() or a similar method).
...ment (using node.appendchild() or a similar method).
...se.
...And 3 more matches

Node.firstChild - Web APIs

Web › API › Node › firstChild

rst child in the tree, or null if the node has no children.
... show '#text' because a text node is inserted to maintain the whitespace between the end of the opening <p> and <span> tags.
... any whitespace will create a #text node, from a single space to multiple spaces, returns, tabs, and so on.
...And 3 more matches

Node.isEqualNode() - Web APIs

Web › API › Node › isEqualNode

the node.isequalnode() method tests whether two nodes are equal.
...he types of the nodes.
...qualnode = node.isequalnode(othernode); othernode: the node to compare equality with.
...And 3 more matches

Node.nodeName - Web APIs

Web › API › Node › nodeName

syntax var str = node.nodename; value a domstring.
...nodename; value a domstring.
...ment.tagname entity the entity name entityreference the name of entity reference notation the notation name processinginstruction the value of processinginstruction.target text "#text" example given the following markup: <div id="d1">hello world</div> <input type="text" id="t"> and the following script: var div1 = document.getelementbyid("d1"); var text_field = document.getelementbyid("t"); text_field.value = div1.nodename; in xhtml (or any other xml format), text_field's value would read "div".
...And 3 more matches

NodeList.prototype.forEach() - Web APIs

Web › API › NodeList › forEach

the foreach() method of the nodelist interface calls the callback given in parameter once for each value pair in the list, in insertion order.
... the foreach() method of the nodelist interface calls the callback given in parameter once for each value pair in the list, in insertion order.
...elist.
...And 3 more matches

PasswordCredential - Web APIs

Web › API › PasswordCredential › PasswordCredential

the passwordcredential constructor creates a new passwordcredential object.
... mycredential = new passwordcredential(htmlformelement) parameters either of the following: passwordcredentialdata a passwordcredentialdata dictionary containing the following fields: iconurl: (optional) the url of a user's avatar image.
...ial(htmlformelement) parameters either of the following: passwordcredentialdata a passwordcredentialdata dictionary containing the following fields: iconurl: (optional) the url of a user's avatar image.
...And 3 more matches

PublicKeyCredentialCreationOptions.pubKeyCredParams - Web APIs

Web › API › PublicKeyCredentialCreationOptions › pubKeyCredParams

the pubkeycredparams property of the publickeycredentialcreationoptions dictionary is an array whose elements are objects describing the desired features of the credential to be created.
... the pubkeycredparams property of the publickeycredentialcreationoptions dictionary is an array whose elements are objects describing the desired features of the credential to be created.
...ray whose elements are objects describing the desired features of the credential to be created.
...And 3 more matches

ResizeObserver - Web APIs

Web › API › ResizeObserver

the resizeobserver interface reports changes to the dimensions of an element's content or border box, or the bounding box of an svgelement.
...nt.
...d when resizing via a callback function.
...And 3 more matches

ResizeObserverEntry - Web APIs

Web › API › ResizeObserverEntry

the resizeobserverentry interface represents the object passed to the resizeobserver() constructor's callback function, which allows you to access the new dimensions of the element or svgelement being observed.
... the resizeobserverentry interface represents the object passed to the resizeobserver() constructor's callback function, which allows you to access the new dimensions of the element or svgelement being observed.
...bserver() constructor's callback function, which allows you to access the new dimensions of the element or svgelement being observed.
...And 3 more matches

SVGTransformList - Web APIs

Web › API › SVGTransformList

ges made to the item are immediately reflected in the list.
...ultiple svgtransform objects in this example we create a function that will apply three different transformations to the svg element that has been clicked on.
...licked on.
...And 3 more matches

ScrollToOptions - Web APIs

Web › API › ScrollToOptions

the scrolltooptions dictionary of the cssom view spec contains properties specifying where an element should be scrolled to, and whether the scrolling should be smooth.
... the scrolltooptions dictionary of the cssom view spec contains properties specifying where an element should be scrolled to, and whether the scrolling should be smooth.
... the scrolltooptions dictionary of the cssom view spec contains properties specifying where an element should be scrolled to, and whether the scrolling should be smooth.
...And 3 more matches

StereoPannerNode.pan - Web APIs

Web › API › StereoPannerNode › pan

l left pan) and 1 (full right pan).
...atestereopanner(); pannode.pan.value = -0.5; returned value an a-rate audioparam containing the panning to apply.
...e the music is playing pans the music across to the left and right speakers of the output, respectively.
...And 3 more matches

StereoPannerNode - Web APIs

Web › API › StereoPannerNode

pannernode() creates a new instance of a stereopannernode object.
...ts parent, audionode.
...e the music is playing pans the music across to the left and right speakers of the output, respectively.
...And 3 more matches

SubmitEvent.submitter - Web APIs

Web › API › SubmitEvent › submitter

the read-only submitter property found on the submitevent interface specifies the submit button or other element that was invoked to cause the form to be submitted.
... the read-only submitter property found on the submitevent interface specifies the submit button or other element that was invoked to cause the form to be submitted.
... the read-only submitter property found on the submitevent interface specifies the submit button or other element that was invoked to cause the form to be submitted.
...And 3 more matches

TextTrackList.onremovetrack - Web APIs

Web › API › TextTrackList › onremovetrack

the texttracklist onremovetrack event handler is called when the removetrack event occurs, indicating that a text track has been removed from the media element, and therefore also from the texttracklist.
... the texttracklist onremovetrack event handler is called when the removetrack event occurs, indicating that a text track has been removed from the media element, and therefore also from the texttracklist.
...ck property identifies the track that was removed from the media element's texttracklist.
...And 3 more matches

TrackEvent - Web APIs

Web › API › TrackEvent

the trackevent interface, which is part of the html dom specification, is used for events which represent changes to a set of available tracks on an html media element; these events are addtrack and removetrack.
...f available tracks on an html media element; these events are addtrack and removetrack.
...onfuse trackevent with the rtctrackevent interface, which is used for tracks which are part of an rtcpeerconnection.
...And 3 more matches

TransitionEvent() - Web APIs

Web › API › TransitionEvent › TransitionEvent

the transitionevent() constructor returns a newly created transitionevent, representing an event in relation with an transition.
... the transitionevent() constructor returns a newly created transitionevent, representing an event in relation with an transition.
... defaults to "".
...And 3 more matches

VideoTrackList.onremovetrack - Web APIs

Web › API › VideoTrackList › onremovetrack

the videotracklist onremovetrack event handler is called when the removetrack event occurs, indicating that a video track has been removed from the media element, and therefore also from the videotracklist.
... the videotracklist onremovetrack event handler is called when the removetrack event occurs, indicating that a video track has been removed from the media element, and therefore also from the videotracklist.
...property identifies the track that was removed from the media element's videotracklist.
...And 3 more matches

VisualViewport - Web APIs

Web › API › VisualViewport

w.
...sualviewport.onscroll property.
...dow.visualviewport; function resizehandler() { if (viewport.scale > 1.3) bottombar.style.display = "none"; else bottombar.style.display = "block"; } window.visualviewport.addeventlistener('resize', resizehandler); simulating position: device-fixed this example, also taken from the visual viewport readme, shows how to use this api to simulate position: device-fixed, which fixes elements to the visual viewport.
...And 3 more matches

WebGL2RenderingContext.texSubImage3D() - Web APIs

Web › API › WebGL2RenderingContext › texSubImage3D

rraybufferview?
...th, format, type, imagebitmap?
...ormat, type, imagedata?
...And 3 more matches

WebGLRenderingContext.getUniform() - Web APIs

Web › API › WebGLRenderingContext › getUniform

rogram a webglprogram containing the uniform attribute.
...ttribute.
...aining the location of the uniform attribute to get.
...And 3 more matches

A basic 2D WebGL animation example - Web APIs

Web › API › WebGL API › Basic 2D animation example

t vertexcount; // rendering data shared with the // scalers.
...ter getting the webgl context, gl, we need to begin by building the shader program.
..."); console.log(gl.getprograminfolog(program)); } return program; } first, gl.createprogram() is called to create a new, empty, glsl program.
...And 3 more matches

Movement, orientation, and motion: A WebXR example - Web APIs

Web › API › WebXR Device API › Movement and motion

are storage for matrices used during the rendering of the scene.
... is set to "exit webxr" to indicate its new function after starting the scene, and a handler is installed for the end event, so we get notified when the xrsession ends.
...as> found in our html—as well as its webgl rendering context—which will be used as the drawing surface for the scene.
...And 3 more matches

Migrating from webkitAudioContext - Web APIs

Web › API › Web Audio API › Migrating from webkitAudioContext

e standard, like so: var gainnode = context.creategain(); gainnode.gain.settargetattime(0.0, 10.0, 1.0); enumerated values that changed the original webkitaudiocontext api used c-style number based enumerated values in the api.
...d by the engine, and are merely used for informational purposes.
...ely used for informational purposes.
...And 3 more matches

Using the group role - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the group role

sers and assistive technology.
... technology products which can then notify the user about it.
...ucts which can then notify the user about it.
...And 3 more matches

ARIA: Region role - Accessibility

Web › Accessibility › ARIA › Roles › Region role

rved for sections of content sufficiently important that users will likely want to navigate to the section easily and to have it listed in a summary of the page.
...lementary, or navigation.
...ledby referencing a visible header.
...And 3 more matches

ARIA: img role - Accessibility

Web › Accessibility › ARIA › Roles › Role Img

the aria img role can be used to identify multiple elements inside page content that should be considered as a single image.
... the aria img role can be used to identify multiple elements inside page content that should be considered as a single image.
... in a visual manner.
...And 3 more matches

::-webkit-progress-bar - CSS: Cascading Style Sheets

Web › CSS › ::-webkit-progress-bar

the ::-webkit-progress-bar css pseudo-element represents the entire bar of a <progress> element.
... the ::-webkit-progress-bar css pseudo-element represents the entire bar of a <progress> element.
... the ::-webkit-progress-bar css pseudo-element represents the entire bar of a <progress> element.
...And 3 more matches

::placeholder - CSS: Cascading Style Sheets

Web › CSS › ::placeholder

the ::placeholder css pseudo-element represents the placeholder text in an <input> or <textarea> element.
... the ::placeholder css pseudo-element represents the placeholder text in an <input> or <textarea> element.
...text is defined as 18.66px and bold or larger, or 24px or larger.
...And 3 more matches

:active - CSS: Cascading Style Sheets

Web › CSS › :active

the :active css pseudo-class represents an element (such as a button) that is being activated by the user.
... the :active css pseudo-class represents an element (such as a button) that is being activated by the user.
...tive css pseudo-class represents an element (such as a button) that is being activated by the user.
...And 3 more matches

:first-of-type - CSS: Cascading Style Sheets

Web › CSS › :first-of-type

the :first-of-type css pseudo-class represents the first element of its type among a group of sibling elements.
... the :first-of-type css pseudo-class represents the first element of its type among a group of sibling elements.
... the :first-of-type css pseudo-class represents the first element of its type among a group of sibling elements.
...And 3 more matches

:hover - CSS: Cascading Style Sheets

Web › CSS › :hover

the :hover css pseudo-class matches when the user interacts with an element with a pointing device, but does not necessarily activate it.
... the :hover css pseudo-class matches when the user interacts with an element with a pointing device, but does not necessarily activate it.
... the :hover css pseudo-class matches when the user interacts with an element with a pointing device, but does not necessarily activate it.
...And 3 more matches

:indeterminate - CSS: Cascading Style Sheets

Web › CSS › :indeterminate

the :indeterminate css pseudo-class represents any form element whose state is indeterminate, such as checkboxes which have their html indeterminate attribute set to true, radio buttons which are members of a group in which all radio buttons are unchecked, and indeterminate <progress> elements.
... the :indeterminate css pseudo-class represents any form element whose state is indeterminate, such as checkboxes which have their html indeterminate attribute set to true, radio buttons which are members of a group in which all radio buttons are unchecked, and indeterminate <progress> elements.
...whose state is indeterminate, such as checkboxes which have their html indeterminate attribute set to true, radio buttons which are members of a group in which all radio buttons are unchecked, and indeterminate <progress> elements.
...And 3 more matches

:last-of-type - CSS: Cascading Style Sheets

Web › CSS › :last-of-type

the :last-of-type css pseudo-class represents the last element of its type among a group of sibling elements.
... the :last-of-type css pseudo-class represents the last element of its type among a group of sibling elements.
... the :last-of-type css pseudo-class represents the last element of its type among a group of sibling elements.
...And 3 more matches

:visited - CSS: Cascading Style Sheets

Web › CSS › :visited

o-class, and how they can be used: allowable css properties are color, background-color, border-color, border-bottom-color, border-left-color, border-right-color, border-top-color, column-rule-color, outline-color, text-decoration-color, and text-emphasis-color.
...iving standard selectors level 4the definition of ':visited' in that specification.
... full support 18firefox android full support 4opera android full support 10.1safari ios full support 1samsung internet android full support 1.0:visited no longer matches <link> elementschrome full support 1notes full support 1notes notes chromium has never matched <link> elements with link pseudo-classes.edge full support 12firefox full support 70ie no support ...
...And 3 more matches

Coordinate systems - CSS: Cascading Style Sheets

Web › CSS › CSSOM View › Coordinate systems

to change the definitions and orientations of these coordinate systems using css properties such as transform.
...ways (0, 0), regardless of the content of the document or any scrolling that may have been done.
...en done.
...And 3 more matches

CSS Animations tips and tricks - CSS: Cascading Style Sheets

Web › CSS › CSS Animations › Tips

css animations make it possible to do incredible things with the elements that make up your documents and apps.
... might want to do that aren't obvious, or clever ways to do things that you might not come up with right away.
...clever ways to do things that you might not come up with right away.
...And 3 more matches

Box alignment for block, absolutely positioned and table layout - CSS: Cascading Style Sheets

Web › CSS › CSS Box Alignment › Box Alignment In Block Abspos Tables

the box alignment specification details how alignment works in various layout methods.
...n the contents of the box within its container.
...if a content distribution method such as space-between, space-around or space-evenly is requested then the fallback alignment will be used, as the content is treated as a single alignment subject.
...And 3 more matches

Typical use cases of Flexbox - CSS: Cascading Style Sheets

Web › CSS › CSS Flexible Box Layout › Typical Use Cases of Flexbox

-end.
...hrink from a flex basis of 0.
...ty set to row-reverse.
...And 3 more matches

Basic Concepts of grid layout - CSS: Cascading Style Sheets

Web › CSS › CSS Grid Layout › Basic Concepts of Grid Layout

css grid layout introduces a two-dimensional grid system to css.
...o lay out major page areas or small user interface elements.
....
...And 3 more matches

Using z-index - CSS: Cascading Style Sheets

Web › CSS › CSS Positioning › Understanding z index › Adding z-index

the first part of this article, stacking without the z-index property, explains how stacking is arranged by default.
... the first part of this article, stacking without the z-index property, explains how stacking is arranged by default.
...ith the z-axis, imagine the page as a stack of layers, each one having a number.
...And 3 more matches

Overview of CSS Shapes - CSS: Cascading Style Sheets

Web › CSS › CSS Shapes › Overview of CSS Shapes

ed in the <basic-shape> datatype.
...to shape-outside.
...erated content as the floated item in the examples above we have used images or a visible element to define the shape, meaning that you can see the shape on the page.
...And 3 more matches

Child combinator - CSS: Cascading Style Sheets

Web › CSS › Child combinator

the child combinator (>) is placed between two css selectors.
... the child combinator (>) is placed between two css selectors.
... the child combinator (>) is placed between two css selectors.
...And 3 more matches

Shorthand properties - CSS: Cascading Style Sheets

Web › CSS › Shorthand properties

e).
...rovides a universal shorthand property, all, which applies its value to every property in the document.
... purpose is to change the properties' inheritance model to one of: css provides four special universal property values for controlling inheritance.
...And 3 more matches

Syntax - CSS: Cascading Style Sheets

Web › CSS › Syntax

the basic goal of the cascading stylesheet (css) language is to allow a browser engine to paint elements of the page with specific features, like colors, positioning, or decorations.
...eature must be handled by the engine.
...it prevents forgetting to add it when extending the block with another declaration.
...And 3 more matches

animation-delay - CSS: Cascading Style Sheets

Web › CSS › animation-delay

the animation-delay css property specifies the amount of time to wait from applying the animation to an element before beginning to perform the animation.
...active-examples and send us a pull request.
...value causes the animation to begin immediately, but partway through its cycle.
...And 3 more matches

background-blend-mode - CSS: Cascading Style Sheets

Web › CSS › background-blend-mode

the background-blend-mode css property sets how an element's background images should blend with each other and with the element's background color.
... value */ background-blend-mode: normal; /* two values, one per background */ background-blend-mode: darken, luminosity; /* global values */ background-blend-mode: initial; background-blend-mode: inherit; background-blend-mode: unset; values <blend-mode> the blending mode to be applied.
.../* two values, one per background */ background-blend-mode: darken, luminosity; /* global values */ background-blend-mode: initial; background-blend-mode: inherit; background-blend-mode: unset; values <blend-mode> the blending mode to be applied.
...And 3 more matches

background-image - CSS: Cascading Style Sheets

Web › CSS › background-image

the background-image css property sets one or more background images on an element.
...t.
...eader will not announce its presence and therefore convey nothing to its users.
...And 3 more matches

border-image-slice - CSS: Cascading Style Sheets

Web › CSS › border-image-slice

the border-image-slice css property divides the image specified by border-image-source into regions.
... lines, set a given distance from their respective sides, control the size of the regions.
... slice measured from the bottom.
...And 3 more matches

border-image-source - CSS: Cascading Style Sheets

Web › CSS › border-image-source

the border-image-source css property sets the source image used to create an element's border image.
...ge-source: url(image.jpg); border-image-source: linear-gradient(to top, red, yellow); /* global values */ border-image-source: inherit; border-image-source: initial; border-image-source: unset; values none no border image is used.
...r-image-source: linear-gradient(to top, red, yellow); /* global values */ border-image-source: inherit; border-image-source: initial; border-image-source: unset; values none no border image is used.
...And 3 more matches

box-decoration-break - CSS: Cascading Style Sheets

Web › CSS › box-decoration-break

the box-decoration-break css property specifies how an element's fragments should be rendered when broken across multiple lines, columns, or pages.
...perties: background border border-image box-shadow clip-path margin padding syntax /* keyword values */ box-decoration-break: slice; box-decoration-break: clone; /* global values */ box-decoration-break: initial; box-decoration-break: inherit; box-decoration-break: unset; the box-decoration-break property is specified as one of the keyword values listed below.
...dependently with the specified border, padding, and margin wrapping each fragment.
...And 3 more matches

box-ordinal-group - CSS: Cascading Style Sheets

Web › CSS › box-ordinal-group

this is a property of the original css flexible box layout module draft, and has been replaced by a newer standard.
...o an ordinal group.
...roup: 5; /* global values */ box-ordinal-group: inherit; box-ordinal-group: initial; box-ordinal-group: unset; ordinal groups may be used in conjunction with the box-direction property to control the order in which the direct children of a box appear.
...And 3 more matches

break-inside - CSS: Cascading Style Sheets

Web › CSS › break-inside

olumn, or region breaks should behave inside a generated box.
...x, the property is ignored.
...es */ break-inside: auto; break-inside: avoid; break-inside: avoid-page; break-inside: avoid-column; break-inside: avoid-region; /* global values */ break-inside: inherit; break-inside: initial; break-inside: unset; each possible break point (in other words, each element boundary) is affected by three properties: the break-after value of the previous element, the break-before value of the next element, and the break-inside value of the containing element.
...And 3 more matches

clamp() - CSS: Cascading Style Sheets

Web › CSS › clamp

-sum>#{3} )where <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*where <calc-product> = <calc-value> [ '*' <calc-value> | '/' <number> ]*where <calc-value> = <number> | <dimension> | <percentage> | ( <calc-sum> ) examples min, max, and clamp comparison in this example we have a simple responsive example that makes use of min(), max(), and clamp() for some of the sizes.
...n in this example we have a simple responsive example that makes use of min(), max(), and clamp() for some of the sizes.
...that value instead.
...And 3 more matches

direction - CSS: Cascading Style Sheets

Web › CSS › direction

le is stored in a github repository.
...dn/interactive-examples and send us a pull request.
... inheritance follows the document tree, and table cells are inside of rows but not inside of columns.
...And 3 more matches

image() - CSS: Cascading Style Sheets

Web › CSS › imagefunction

milar fashion to the <url> function, but with added functionality including specifying the image's directionality, specifying fallback images for when the preferred image is not supported, displaying just a part of that image defined by a media fragment, and specifying a solid color as a fallback in case none of the specified images are able to be rendered.
...al zero or more <url>s or <string>s specifying the image sources, with optional image fragment identifiers.
...nd image() is the ability to add a media fragment identifier — a starting point along the x and y axis, along with a width and height — onto the image source to display only a section of the source image.
...And 3 more matches

mask-border-outset - CSS: Cascading Style Sheets

Web › CSS › mask-border-outset

the mask-border-outset css property specifies the distance by which an element's mask border is set out from its border box.
... the top, the second to the left and right, the third to the bottom.
..., the third to the bottom.
...And 3 more matches

mask-size - CSS: Cascading Style Sheets

Web › CSS › mask-size

; mask-size: 3em 25%; mask-size: auto 6px; mask-size: auto auto; /* multiple values */ /* do not confuse this with mask-size: auto auto */ mask-size: auto, auto; mask-size: 50%, 25%, 25%; mask-size: 6px, auto, contain; /* global values */ mask-size: inherit; mask-size: initial; mask-size: unset; note: if the value of this property is not set in a mask shorthand property that is applied to the element after the mask-size css property, the value of this property is then reset to its initial value by the shorthand property.
...ion from the specified dimension and the intrinsic proportion.
...ntrinsic proportion.
...And 3 more matches

min-height - CSS: Cascading Style Sheets

Web › CSS › min-height

the min-height css property sets the minimum height of an element.
...ht css property sets the minimum height of an element.
...es */ min-height: max-content; min-height: min-content; min-height: fit-content(20em); /* global values */ min-height: inherit; min-height: initial; min-height: unset; values <length> defines the min-height as an absolute value.
...And 3 more matches

offset-anchor - CSS: Cascading Style Sheets

Web › CSS › offset-anchor

the offset-anchor css property specifies the point inside the box of an element travelling along an offset-path that is actually moving along the path.
... /* <percentage> values */ offset-anchor: 25% 75%; /* <length> values */ offset-anchor: 0 0; offset-anchor: 1cm 2cm; offset-anchor: 10ch 8em; /* edge offsets values */ offset-anchor: bottom 10px right 20px; offset-anchor: right 3em bottom 10px; /* global values */ offset-anchor: inherit; offset-anchor: initial; offset-anchor: unset; values auto offset-anchor is given the same value as the element's transform-origin, unless offset-path is none, in which case it takes its value from offset-position.
...offset-anchor: right 3em bottom 10px; /* global values */ offset-anchor: inherit; offset-anchor: initial; offset-anchor: unset; values auto offset-anchor is given the same value as the element's transform-origin, unless offset-path is none, in which case it takes its value from offset-position.
...And 3 more matches

offset-path - CSS: Cascading Style Sheets

Web › CSS › offset-path

the offset-path css property specifies a motion path for an element to follow and defines the element's positioning within the parent container or svg coordinate system.
...ferences the id of an svg shape -- circle, ellipse, line, path, polygon, polyline, or rect -- using the shape's geometry as the path.
...shape> specifies a css shape including circle(), ellipse(), inset(), polygon(), or path().
...And 3 more matches

offset-rotate - CSS: Cascading Style Sheets

Web › CSS › offset-rotate

the offset-rotate css property defines the orientation/direction of the element as it is positioned along the offset-path.
...f the spec called this property motion-rotation.
...set-rotate: auto 45deg; /* follow the path direction but facing the opposite direction of `auto` */ offset-rotate: reverse; /* keep a constant rotation regardless the position on the path */ offset-rotate: 90deg; offset-rotate: .5turn; auto the element is rotated by the angle of the direction of the offset-path, relative to the positive x-axis.
...And 3 more matches

overscroll-behavior - CSS: Cascading Style Sheets

Web › CSS › overscroll-behavior

-behavior property is specified as one or two keywords chosen from the list of values below.
... on the x and y axes respectively.
...rflow behavior is observed inside the element this value is set on (e.g.
...And 3 more matches

padding - CSS: Cascading Style Sheets

Web › CSS › padding

the padding css shorthand property sets the padding area on all four sides of an element at once.
... the padding css shorthand property sets the padding area on all four sides of an element at once.
...ding area on all four sides of an element at once.
...And 3 more matches

width - CSS: Cascading Style Sheets

Web › CSS › width

the width css property sets an element's width.
... initial; width: unset; the width property is specified as either: one of the following keyword values: min-content, max-content, fit-content, auto.
...width.
...And 3 more matches

z-index - CSS: Cascading Style Sheets

Web › CSS › z-index

the z-index css property sets the z-order of a positioned element and its descendants or flex items.
... the z-index css property sets the z-order of a positioned element and its descendants or flex items.
...lish a new local stacking context.
...And 3 more matches

Getting Started - Developer guides

Web › Guide › AJAX › Getting Started

pt will request an html document, test.html, which contains the text "i'm a test." then we'll alert() the contents of the response.
...onse was received and ok, then alert()s the contents of the test.html file.
...ment that we'll request later on.
...And 3 more matches

WAI ARIA Live Regions/API Support - Developer guides

Web › Guide › AJAX › WAI ARIA Live Regions API Support

msaa's create/destroy at the request of screen reader vendors, who avoid those events because they cause crashes on some important system -- show/hide are the equivalent of those events.
...n event in a page, the author can get the following object attributes from the event object, if they are defined on some ancestor element (closest ancestor wins): object attribute name possible values default value if not specified meaning aria markup if required container-live "off" | "polite" | "assertive" "off" interruption policy aria-live on ancestor element container-relevant "[additions] [removals] [text]" | "all" "additions text" what types of mutations are possibly relevant?
...cestor element container-relevant "[additions] [removals] [text]" | "all" "additions text" what types of mutations are possibly relevant?
...And 3 more matches

Web Audio playbackRate explained - Developer guides

Web › Guide › Audio and video delivery › WebAudio playbackRate explained

the playbackrate property of the <audio> and <video> elements allows us to change the speed, or rate, at which a piece of web audio or video is playing.
... the playbackrate property of the <audio> and <video> elements allows us to change the speed, or rate, at which a piece of web audio or video is playing.
...o> and <video> elements allows us to change the speed, or rate, at which a piece of web audio or video is playing.
...And 3 more matches

Creating and triggering events - Developer guides

Web › Guide › Events › Creating and triggering events

der approach to creating events uses apis inspired by java.
...the event.
...atch it; optionally, with data: <form> <textarea></textarea> </form> const form = document.queryselector('form'); const textarea = document.queryselector('textarea'); // create a new event, allow bubbling, and provide any data you want to pass to the "detail" property const eventawesome = new customevent('awesome', { bubbles: true, detail: { text: () => textarea.value } }); // the form element listens for the custom "awesome" event and then consoles the output of the passed text() method form.addeventlistener('awesome', e => console.log(e.detail.text())); // as the user types, the textarea inside the form dispatches/triggers the event to fire, and uses itself as the starting point textarea.addeventlistener('input', e => e.target.dispatchevent(eventawesome)); creating and dispatching...
...And 3 more matches

Overview of events and handlers - Developer guides

Web › Guide › Events › Overview of Events and Handlers

owsers use as the registration method for the function which will handle those data structures a method called addeventlistener which expects as arguments a string event type name and the handler function.
..._click_handler = function (ev){ var objkind = (ev instanceof event) ?
...tanceof event) ?
...And 3 more matches

Index - Developer guides

Web › Guide › Index

e regions/api support ajax, accessibility firefox 3 contains important improvements to the way the mozilla engine exposes live changes in a document.
...ats, although with the adoption of mp3 and mp4 formats in firefox and opera, this is changing fast.
... adding captions and subtitles to html5 video html5, media, webvtt, captions, subtitles, track in other articles we looked at how to build a cross browser video player using the htmlmediaelement and window.fullscreen apis, and also at how to style the player.
...And 3 more matches

<data> - HTML: Hypertext Markup Language

Web › HTML › Element › data

the html <data> element links a given piece of content with a machine-readable translation.
... the html <data> element links a given piece of content with a machine-readable translation.
...itory.
...And 3 more matches

<frameset> - HTML: Hypertext Markup Language

Web › HTML › Element › frameset

the html <frameset> element is used to contain <frame> elements.
... the html <frameset> element is used to contain <frame> elements.
... the html <frameset> element is used to contain <frame> elements.
...And 3 more matches

<isindex> - HTML: Hypertext Markup Language

Web › HTML › Element › isindex

summary <isindex> was an obsolete html element that put a text field in a page for querying the document.
...e line text input for entering a query string.
...ut for entering a query string.
...And 3 more matches

<legend> - HTML: Hypertext Markup Language

Web › HTML › Element › legend

the html <legend> element represents a caption for the content of its parent <fieldset>.
...t represents a caption for the content of its parent <fieldset>.
...e to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 3 more matches

<map> - HTML: Hypertext Markup Language

Web › HTML › Element › map

the html <map> element is used with <area> elements to define an image map (a clickable link area).
...define an image map (a clickable link area).
...if you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...And 3 more matches

itemscope - HTML: Hypertext Markup Language

Web › HTML › Global attributes › itemscope

itemscope is a boolean global attribute that defines the scope of associated metadata.
... itemscope is a boolean global attribute that defines the scope of associated metadata.
... metadata.
...And 3 more matches

spellcheck - HTML: Hypertext Markup Language

Web › HTML › Global attributes › spellcheck

the spellcheck global attribute is an enumerated attribute defines whether the element may be checked for spelling errors.
...l attribute is an enumerated attribute defines whether the element may be checked for spelling errors.
... errors.
...And 3 more matches

List of default Accept values - HTTP

Web › HTTP › Content negotiation › List of default Accept values

this article documents the default values for the http accept header for specific inputs and browser versions.
...ockwave-flash, application/msword, */* see ie and the accept header (ieinternals' msdn blog).
... chrome image/webp,image/apng,image/*,*/*;q=0.8 source internet explorer 8 or earlier */* see ie and the accept header (ieinternals' msdn blog) internet explorer 9 image/png,image/svg+xml,image/*;q=0.8, */*;q=0.5 see fiddler is better with internet explorer 9 (ieinternals' msdn blog) values for a video when a video is requested, via the <video> html element, most browsers use specific values.
...And 3 more matches

CSP: base-uri - HTTP

Web › HTTP › Headers › Content-Security-Policy › base-uri

the http content-security-policy base-uri directive restricts the urls which can be used in a document's <base> element.
... the http content-security-policy base-uri directive restricts the urls which can be used in a document's <base> element.
...de blob and filesystem from source directives.
...And 3 more matches

JavaScript data types and data structures - JavaScript

Web › JavaScript › Data structures

*, and % with bigints—just like with numbers.
...bigint is not strictly equal to a number, but it is loosely so.
...bigint behaves like a number in cases where it is converted to boolean: if, ||, &&, boolean, !.
...And 3 more matches

Array.prototype.reduce() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › Reduce

the reduce() method executes a reducer function (that you provide) on each element of the array, resulting in single output value.
...(cur) current index (idx) source array (src) your reducer function's returned value is assigned to the accumulator, whose value is remembered across each iteration throughout the array, and ultimately becomes the final, single resulting value.
...parameters callback a function to execute on each element in the array (except for the first, if no initialvalue is supplied).
...And 3 more matches

Array.prototype.reduceRight() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › ReduceRight

lso array.prototype.reduce() for left-to-right.
...(accumulator, currentvalue[, index[, array]])[, initialvalue]) parameters callback function to execute on each value in the array, taking four arguments: accumulator the value previously returned in the last invocation of the callback, or initialvalue, if supplied.
... of the callback, or initialvalue, if supplied.
...And 3 more matches

Array.of() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › of

the array.of() method creates a new array instance from a variable number of arguments, regardless of number or type of the arguments.
...e handling of integer arguments: array.of(7) creates an array with a single element, 7, whereas array(7) creates an empty array with a length property of 7 (note: this implies an array of 7 empty slots, not slots with actual undefined values).
...of integer arguments: array.of(7) creates an array with a single element, 7, whereas array(7) creates an empty array with a length property of 7 (note: this implies an array of 7 empty slots, not slots with actual undefined values).
...And 3 more matches

Array.prototype.unshift() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › unshift

the unshift() method adds one or more elements to the beginning of an array and returns the new length of the array.
... the unshift() method adds one or more elements to the beginning of an array and returns the new length of the array.
... the unshift() method adds one or more elements to the beginning of an array and returns the new length of the array.
...And 3 more matches

Function.prototype.apply() - JavaScript

Web › JavaScript › Reference › Global Objects › Function › apply

ty, and integer ("index") properties in the range (0..length - 1).
...or a custom object like { 'length': 2, '0': 'eat', '1': 'bananas' }.
......
...And 3 more matches

Map.prototype.set() - JavaScript

Web › JavaScript › Reference › Global Objects › Map › set

the set() method adds or updates an element with a specified key and a value to a map object.
... the set() method adds or updates an element with a specified key and a value to a map object.
...th a specified key and a value to a map object.
...And 3 more matches

Object.freeze() - JavaScript

Web › JavaScript › Reference › Global Objects › Object › freeze

ict mode).
... a frozen object, values cannot be changed, the writable and configurable attributes are set to false.
...s not create a frozen copy.
...And 3 more matches

String.prototype.big() - JavaScript

Web › JavaScript › Reference › Global Objects › String › big

the big() method creates a <big> html element that causes a string to be displayed in a big font.
... the big() method creates a <big> html element that causes a string to be displayed in a big font.
... the big() method creates a <big> html element that causes a string to be displayed in a big font.
...And 3 more matches

String.prototype.fontcolor() - JavaScript

Web › JavaScript › Reference › Global Objects › String › fontcolor

the fontcolor() method creates a <font> html element that causes a string to be displayed in the specified font color.
... the fontcolor() method creates a <font> html element that causes a string to be displayed in the specified font color.
...r.
...And 3 more matches

TypedArray.from() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › from

and send us a pull request.
... parameters source an array-like or iterable object to convert to a typed array.
...nvert to a typed array.
...And 3 more matches

TypedArray.of() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › of

the typedarray.of() method creates a new typed array from a variable number of arguments.
... the typedarray.of() method creates a new typed array from a variable number of arguments.
...f() method creates a new typed array from a variable number of arguments.
...And 3 more matches

WeakRef.prototype.deref() - JavaScript

Web › JavaScript › Reference › Global Objects › WeakRef › deref

if the target object has been garbage-collected.
...j = ref.deref(); return value the target object of the weakref, or undefined if the object has been garbage-collected.
...he target object of the weakref, or undefined if the object has been garbage-collected.
...And 3 more matches

Property accessors - JavaScript

Web › JavaScript › Reference › Operators › Property Accessors

iernames", not "identifiers", so reserved words can be used but are not recommended).
...e not recommended).
...ponential() // or 77.0.toexponential() // because 77.
...And 3 more matches

this - JavaScript

Web › JavaScript › Reference › Operators › this

38 in the last example (c2), because an object was returned during construction, the new object that this was bound to simply gets discarded.
...s not exactly dead because it gets executed, but it can be eliminated with no outside effects.) as a dom event handler when a function is used as an event handler, its this is set to the element on which the listener is placed (some browsers do not follow this convention for listeners added dynamically with methods other than addeventlistener()).
...low this convention for listeners added dynamically with methods other than addeventlistener()).
...And 3 more matches

Authoring MathML - MathML

Web › MathML › Authoring

t insert one line in your document header: <script src="https://fred-wang.github.io/mathml.css/mspace.js"></script> if you need more complex constructions, you might instead consider using the heavier mathjax library as a mathml polyfill: <script src="https://fred-wang.github.io/mathjax.js/mpadded-min.js"></script> note that these two scripts perform feature detection of the mspace or mpadded elements (see the browser compatibility table on these pages).
...between one of the fallback above: <script src="https://fred-wang.github.io/mathml-warning.js/mpadded-min.js"></script> if you don't want to use this link to github but instead to integrate these polyfills or others in your own project, you might need the detection scripts to verify the level of mathml support.
....js"></script> if you don't want to use this link to github but instead to integrate these polyfills or others in your own project, you might need the detection scripts to verify the level of mathml support.
...And 3 more matches

<mo> - MathML

Web › MathML › Element › mo

the mathml <mo> element represents an operator in a broad sense.
... the mathml <mo> element represents an operator in a broad sense.
...s parentheses).
...And 3 more matches

Media container formats (file types) - Web media technologies

Web › Media › Formats › Containers

with avi and/or mpeg-2 fallback) these suggestions make a number of assumptions.
...ke a number of assumptions.
...ity, it's worth considering providing more than one version of media files, using the <source> element to specify each source within the <audio> or <video> element.
...And 3 more matches

CSS and JavaScript animation performance - Web Performance

Web › Performance › CSS JavaScript animation performance

e, we analyse the performance differences between css- and javascript-based animation.
... requestanimationframe the requestanimationframe() api provides an efficient way to make animations in javascript.
...imationframe the fact is that, in most cases, the performance of css-based animations is almost the same as javascripted animations — in firefox at least.
...And 3 more matches

Structural overview of progressive web apps - Progressive web apps (PWAs)

Web › Progressive web apps › Structural overview

ly different approach to server- or client-side rendering can be achieved with the streams api.
... the <head> section contains basic information about the app, including its title, description, and the needed references to its css file, web manifest, the main application javascript file (app.js, in which the app is initialized) as well as an additional javascript code file.
...ferences to its css file, web manifest, the main application javascript file (app.js, in which the app is initialized) as well as an additional javascript code file.
...And 3 more matches

Applying SVG effects to HTML content - SVG: Scalable Vector Graphics

Web › SVG › Applying SVG effects to HTML content

rget { mask: url(#mask-1); } p { width: 300px; border: 1px solid #000; display: inline-block; } note that in the css, the mask is specified using a url to the id #mask-1, which is the id of the svg mask specified below it.
...cy="0.25" r="0.25" id="circle"/> <rect x="0.5" y="0.2" width="0.5" height="0.8"/> </clippath> </svg> .target { clip-path: url(#clipping-path-1); } p { width: 300px; border: 1px solid #000; display: inline-block; } this establishes a clipping area made of a circle and rectangle, assigns it the id #clipping-path-1, then references it in the css.
...ade of a circle and rectangle, assigns it the id #clipping-path-1, then references it in the css.
...And 3 more matches

SVG Conditional Processing Attributes - SVG: Scalable Vector Graphics

Web › SVG › Attribute › Conditional Processing

the svg conditional processing attributes are all the attributes that can be specified on some svg elements to control whether or not the element on which it appears should be rendered.
... the attributes that can be specified on some svg elements to control whether or not the element on which it appears should be rendered.
...ents to control whether or not the element on which it appears should be rendered.
...And 3 more matches

clip-path - SVG: Scalable Vector Graphics

Web › SVG › Attribute › clip-path

the clip-path presentation attribute defines or associates a clipping path with the element it is related to.
... the clip-path presentation attribute defines or associates a clipping path with the element it is related to.
... the clip-path presentation attribute defines or associates a clipping path with the element it is related to.
...And 3 more matches

clipPathUnits - SVG: Scalable Vector Graphics

Web › SVG › Attribute › clipPathUnits

the clippathunits attribute indicates which coordinate system to use for the contents of the <clippath> element.
... the clippathunits attribute indicates which coordinate system to use for the contents of the <clippath> element.
... xlink:href="#r1" fill="red" /> <use clip-path="url(#myclip1)" xlink:href="#r2" fill="red" /> <use clip-path="url(#myclip1)" xlink:href="#r3" fill="red" />  <use clip-path="url(#myclip2)" xlink:href="#r4" fill="red" /> </svg> clippath for <clippath>, clippathunits define the coordinate system in use for the content of the element.
...And 3 more matches

cursor - SVG: Scalable Vector Graphics

Web › SVG › Attribute › cursor

filter - SVG: Scalable Vector Graphics

Web › SVG › Attribute › filter

the filter attribute specifies the filter effects defined by the <filter> element that shall be applied to its element.
... the filter attribute specifies the filter effects defined by the <filter> element that shall be applied to its element.
... the filter attribute specifies the filter effects defined by the <filter> element that shall be applied to its element.
...And 3 more matches

lang - SVG: Scalable Vector Graphics

Web › SVG › Attribute › lang

the lang attribute specifies the primary language used in contents and attributes containing text content of particular elements.
... the lang attribute specifies the primary language used in contents and attributes containing text content of particular elements.
...to <glyph> elements.
...And 3 more matches

maskContentUnits - SVG: Scalable Vector Graphics

Web › SVG › Attribute › maskContentUnits

the maskcontentunits attribute indicates which coordinate system to use for the contents of the <mask> element.
... the maskcontentunits attribute indicates which coordinate system to use for the contents of the <mask> element.
...mask="url(#mymask1)" xlink:href="#r1" fill="red" /> <use mask="url(#mymask1)" xlink:href="#r2" fill="red" /> <use mask="url(#mymask1)" xlink:href="#r3" fill="red" />  <use mask="url(#mymask2)" xlink:href="#r4" fill="red" /> </svg> mask for <mask>, maskcontentunits defines the coordinate system in use for the content of the element.
...And 3 more matches

vector-effect - SVG: Scalable Vector Graphics

Web › SVG › Attribute › vector-effect

the vector-effect property specifies the vector effect to use when drawing an object.
... the vector-effect property specifies the vector effect to use when drawing an object.
...e the outline with a specified paint.
...And 3 more matches

writing-mode - SVG: Scalable Vector Graphics

Web › SVG › Attribute › writing-mode

the writing-mode attribute specifies whether the initial inline-progression-direction for a <text> element shall be left-to-right, right-to-left, or top-to-bottom.
... the writing-mode attribute specifies whether the initial inline-progression-direction for a <text> element shall be left-to-right, right-to-left, or top-to-bottom.
... the writing-mode attribute specifies whether the initial inline-progression-direction for a <text> element shall be left-to-right, right-to-left, or top-to-bottom.
...And 3 more matches

Content type - SVG: Scalable Vector Graphics

Web › SVG › Content type

the frequency unit identifiers are: hz: hertz khz: kilo hertz frequency values may not be negative.
...r> is represented as a number or an svganimatedinteger.
...e the following iri: http://example.com/somedrawing.svg an iri can also address a particular element within an xml document by including an iri fragment identifier as part of the iri.
...And 3 more matches

<altGlyphDef> - SVG: Scalable Vector Graphics

Web › SVG › Element › altGlyphDef

the <altglyphdef> svg element defines a substitution representation for glyphs.
... the <altglyphdef> svg element defines a substitution representation for glyphs.
... the <altglyphdef> svg element defines a substitution representation for glyphs.
...And 3 more matches

<defs> - SVG: Scalable Vector Graphics

Web › SVG › Element › defs

the <defs> element is used to store graphical objects that will be used at a later time.
... the <defs> element is used to store graphical objects that will be used at a later time.
... the <defs> element is used to store graphical objects that will be used at a later time.
...And 3 more matches

<discard> - SVG: Scalable Vector Graphics

Web › SVG › Element › discard

the <discard> svg element allows authors to specify the time at which particular elements are to be discarded, thereby reducing the resources required by an svg user agent.
... the <discard> svg element allows authors to specify the time at which particular elements are to be discarded, thereby reducing the resources required by an svg user agent.
... the <discard> svg element allows authors to specify the time at which particular elements are to be discarded, thereby reducing the resources required by an svg user agent.
...And 3 more matches

<hatchpath> - SVG: Scalable Vector Graphics

Web › SVG › Element › hatchpath

the <hatchpath> svg element defines a hatch path used by the <hatch> element.
... the <hatchpath> svg element defines a hatch path used by the <hatch> element.
... the <hatchpath> svg element defines a hatch path used by the <hatch> element.
...And 3 more matches

<mpath> - SVG: Scalable Vector Graphics

Web › SVG › Element › mpath

the <mpath> sub-element for the <animatemotion> element provides the ability to reference an external <path> element as the definition of a motion path.
... the <mpath> sub-element for the <animatemotion> element provides the ability to reference an external <path> element as the definition of a motion path.
... the <mpath> sub-element for the <animatemotion> element provides the ability to reference an external <path> element as the definition of a motion path.
...And 3 more matches

Web › SVG › Element › script

the svg script element allows to add scripts to an svg document.
... the svg script element allows to add scripts to an svg document.
... the svg script element allows to add scripts to an svg document.
...And 3 more matches

<stop> - SVG: Scalable Vector Graphics

Web › SVG › Element › stop

the svg <stop> element defines a color and its position to use on a gradient.
... the svg <stop> element defines a color and its position to use on a gradient.
... the svg <stop> element defines a color and its position to use on a gradient.
...And 3 more matches

Web › SVG › Element › style

the svg <style> element allows style sheets to be embedded directly within svg content.
... the svg <style> element allows style sheets to be embedded directly within svg content.
... the svg <style> element allows style sheets to be embedded directly within svg content.
...And 3 more matches

<text> - SVG: Scalable Vector Graphics

Web › SVG › Element › text

the svg <text> element draws a graphics element consisting of text.
... the svg <text> element draws a graphics element consisting of text.
... the svg <text> element draws a graphics element consisting of text.
...And 3 more matches

SVG as an Image - SVG: Scalable Vector Graphics

Web › SVG › SVG as an Image

svg images can be used as an image format, in a number of contexts.
... svg images can be used as an image format, in a number of contexts.
... svg images can be used as an image format, in a number of contexts.
...And 3 more matches

Positions - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › Positions

« previousnext » in this article, we examine how scalable vector graphics (svg) represents the positions and sizes of objects within a drawing context, including coordinate system and what a "pixel" measurement means in a scalable context.
... that is, the top left corner of the document is considered to be the point (0,0), or point of origin.
... top left corner, with the positive x direction being to the right, and the positive y direction being to the bottom.
...And 3 more matches

Axes - XPath

Web › XPath › Axes

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes there are thirteen different axes in the xpath specification.
...section at the end of transforming xml with xslt document.
...e.
...And 3 more matches

<xsl:output> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › output

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:output> element controls the characteristics of the output document.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:output> element controls the characteristics of the output document.
...ement controls the characteristics of the output document.
...And 3 more matches

Content Scripts - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Guides › Content Scripts

ve problems getting your add-on approved on amo.
...ipt, but there are two important differences: first, if you define an event listener by passing it as a string into setattribute(), then the listener is evaluated in the page's context, so it will not have access to any variables defined in the content script.
...on most pages, but will fail on pages which also assign to onclick: <html> <head> </head> <body> <script> window.onclick = function() { window.alert("it's my click now!"); } </script> </body> </html> for these reasons, it's better to add event listeners using addeventlistener(), defining the listener as a function: var themessage = "hello from content script!"; anelement.onclick = function() { alert(themessage); }; anotherelement.addeventlistener("click", function() { alert(themessage); }); communicating with the add-on to enable add-on scripts and content scripts to communicate with each other, each end of the conversation has access to a port object.
...And 2 more matches

frame/hidden-frame - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs › frame hidden-frame

experimental creates firefox frames (i.e.
...s a new hidden frame.
...nregisters a frame, unloading any content that was loaded in it.
...And 2 more matches

SVG General - Archive of obsolete content

Archive › Add-ons › Code snippets › SVG General

on this page you will find some simple, general information on svg markup.
...er.
...//www.w3.org/2000/svg">  </svg> note: it is recommended that you do not use dtd's with svg documents.
...And 2 more matches

Index of archived content - Archive of obsolete content

Archive › Index of archived content

dows and dialogs appendix a: add-on performance appendix b: install and uninstall scripts appendix c: avoiding using eval in add-ons appendix d: loading scripts appendix e: dom building and insertion (html & xul) appendix f: monitoring dom changes connecting to remote content custom xul elements with xbl getting started with firefox extensions handling preferences intercepting page loads introduction javascript object management local storage mozilla documentation roadmap observer notifications setting up a development environment the box model ...
...pt generators in firefox window.importdialog() writing javascript for xhtml xforms building mozilla xforms community developing mozilla xforms implementation status mozilla xforms specials mozilla xforms user interface xforms alert element xforms group element xforms help element xforms hint element xforms input element xforms label element xforms message element xforms output element xforms range element xforms repeat element xforms secret element xforms select element ...
...ms group element xforms help element xforms hint element xforms input element xforms label element xforms message element xforms output element xforms range element xforms repeat element xforms secret element xforms select element xforms select1 element xforms submit element xforms switch module xforms textarea element xforms trigger element xforms upload element other resources requests for enhancement rfe to the custom controls rfe to the custom controls interfaces ...
...And 2 more matches

Monitoring downloads - Archive of obsolete content

Archive › Mozilla › Monitoring downloads

he full source url of the file.
...ofd", components.interfaces.nsifile); this.dbfile.append("downloadlogger.sqlite"); // get access to the storage service and open the database this.storageservice = components.classes["@mozilla.org/storage/service;1"] .getservice(components.interfaces.mozistorageservice); var dbconn = this.storageservice.opendatabase(this.dbfile); var loglist = document.getelementbyid("loglist"); var statement = dbconn.createstatement("select * from items"); // get all items in table try { while (statement.executestep()) { var row = document.createelement('listitem'); // add the cells to the row var cell = document.createelement('listcell'); var sourcestr = statement.getstring(0); row.setattribute("tooltiptext", sourcestr)...
...createelement('listitem'); // add the cells to the row var cell = document.createelement('listcell'); var sourcestr = statement.getstring(0); row.setattribute("tooltiptext", sourcestr); sourcestr = sourcestr.slice(sourcestr.lastindexof("/")+1); cell.setattribute("label", sourcestr); // source row.appendchild(cell); cell = document.createelement('listcell'); cell.setattribute("label", (statement.getint64(1) / 1024).tofixed(1) + "kb"); // size cell.setattribute("style", "text-align:right"); row.appendchild(cell); var thedate = new date(statement.getint64(2) / 1000); // start time cell = document.createelement('listcell'); var datestr = thedate.tolocalestring(); cell.setattribute(...
...And 2 more matches

PyDOM - Archive of obsolete content

Archive › Mozilla › PyDOM

op-level window has something like: <window ...
...xpandos'.
...ight look like: <button id="some-button" label="click here" onclick="event.target.foo += 1; print 'foo is now', event.target.foo"/> note that (a) we have stuck an arbitrary attribute on a dom element and (b) in all cases (e.g., event handler and top-level script), the dom node needs to be explicitly specified - the globals are the window itself.
...And 2 more matches

Event Handlers - Archive of obsolete content

Archive › Mozilla › XBL › XBL 1.0 Reference › Event Handlers

event handlers are defined using handler elements.
....
...ction attribute or by specifying the script as a child of the handler element.
...And 2 more matches

Flexgroup - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › Flexgroup

"flexgroup" is used to group flexible elements together and should be set to an integer.
... "flexgroup" is used to group flexible elements together and should be set to an integer.
... "flexgroup" is used to group flexible elements together and should be set to an integer.
...And 2 more matches

id - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › id

« xul reference home id type: unique id a unique identifier so that you can identify the element with.
... « xul reference home id type: unique id a unique identifier so that you can identify the element with.
... « xul reference home id type: unique id a unique identifier so that you can identify the element with.
...And 2 more matches

resizeafter - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › resizeafter

« xul reference home resizeafter type: one of the values below this attribute indicates which element to the right or below the splitter should be resized when the splitter is repositioned.
... « xul reference home resizeafter type: one of the values below this attribute indicates which element to the right or below the splitter should be resized when the splitter is repositioned.
... « xul reference home resizeafter type: one of the values below this attribute indicates which element to the right or below the splitter should be resized when the splitter is repositioned.
...And 2 more matches

uri - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › uri

« xul reference home uri type: string for template-generated content, the attribute should be placed on the element where content generation should begin.
... « xul reference home uri type: string for template-generated content, the attribute should be placed on the element where content generation should begin.
... « xul reference home uri type: string for template-generated content, the attribute should be placed on the element where content generation should begin.
...And 2 more matches

value - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › value

« xul reference home value type: string the string attribute allows you to associate a data value with an element.
... « xul reference home value type: string the string attribute allows you to associate a data value with an element.
... « xul reference home value type: string the string attribute allows you to associate a data value with an element.
...And 2 more matches

Methods - Archive of obsolete content

Archive › Mozilla › XUL › Method

« xul reference home acceptdialog additemtoselection addpane addprogresslistener addsession addtab addtabsprogresslistener advance advanceselectedtab appendcustomtoolbar appendgroup appenditem appendnotification blur cancel canceldialog centerwindowonscreen checkadjacentelement clearresults clearselection click close collapsetoolbar contains decrease decreasepage docommand ensureelementisvisible ensureindexisvisible ensureselectedelementisvisible expandtoolbar extra1 extra2 focus getbrowseratindex getbrowserfordocument getbrowserfortab getbrowserindexfordocument getbutton getdefaultsession geteditor getelementsbyattribute getelementsbyattributens getformattedstring gethtmleditor getindexoffirstvi...
...goforward goforwardgroup gohome goto gotoindex goup hidepopup increase increasepage insertitem insertitemat invertselection loadgroup loadonetab loadtabs loaduri loaduriwithflags makeeditable movebyoffset moveto movetoalertposition onsearchcomplete ontextentered ontextreverted openpopup openpopupatscreen opensubdialog openwindow preferenceforelement reload reloadalltabs reloadtab reloadwithflags removeallitems removeallnotifications removealltabsbut removecurrentnotification removecurrenttab removeitemat removeitemfromselection removenotification removeprogresslistener removesession removetab removetabsprogresslistener removetransientnotifications replacegroup reset rewind scrollbyindex scrollbypix...
...session removetab removetabsprogresslistener removetransientnotifications replacegroup reset rewind scrollbyindex scrollbypixels scrolltoindex select selectall selectitem selectitemrange selecttabatindex setselectionrange showpane showpopup sizeto startediting stop stopediting swapdocshells syncsessions timedselect toggleitemselection related dom element methods dom:element.addeventlistener dom:element.appendchild dom:element.comparedocumentposition dom:element.dispatchevent dom:element.getattribute dom:element.getattributenode dom:element.getattributenodens dom:element.getattributens dom:element.getelementsbytagname dom:element.getelementsbytagnamens dom:element.getfeature fixme: brokenlink dom:element.getuserdata dom:...
...And 2 more matches

Property - Archive of obsolete content

Archive › Mozilla › XUL › Property

node firstordinalcolumn firstpermanentchild flex focused focuseditem forcecomplete group handlectrlpageupdown handlectrltab hasuservalue height hidden hideseconds highlightnonmatches homepage hour hourleadingzero id ignoreblurwhilesearching image increment inputfield inverted is24hourclock ispm issearching iswaiting itemcount label labelelement lastpermanentchild lastselected left linkedpanel listboxobject locked markupdocumentviewer max maxheight maxlength maxrows maxwidth menu menuboxobject menupopup min minheight minresultsforpopup minwidth minute minuteleadingzero mode month monthleadingzero name next nomatch notificationshidden object observes onfirstpage onlastpage ...
...minute minuteleadingzero mode month monthleadingzero name next nomatch notificationshidden object observes onfirstpage onlastpage open ordinal orient pack pagecount pageid pageincrement pageindex pagestep parentcontainer palette persist persistence placeholder pmindicator popup popupboxobject popupopen position predicate preferenceelements preferencepanes preferences priority radiogroup readonly readonly ref resource resultspopup scrollboxobject scrollincrement scrollheight scrollwidth searchbutton searchcount searchlabel searchparam searchsessions second secondleadingzero securityui selected selectedbrowser selectedcount selectedindex selecteditem selecteditems selectedpan...
...ings style subject suppressonselect tabcontainer tabindex tabs tabscrolling tabpanels tag textlength textvalue timeout title toolbarname toolbarset tooltip tooltiptext top treeboxobject type uri useraction value valuenumber view webbrowserefind webnavigation webprogress width wizardpages wraparound year yearleadingzero related dom element properties dom:element.attributes dom:element.baseuri dom:element.childelementcount dom:element.childnodes dom:element.children dom:element.clientheight dom:element.clientleft dom:element.clienttop dom:element.clientwidth dom:element.clonenode dom:element.firstchild dom:element.firstelementchild dom:element.lastchild dom:element.lastelementchild dom:element.localnam...
...And 2 more matches

Sorting and filtering a custom tree view - Archive of obsolete content

Archive › Mozilla › XUL › Sorting and filtering a custom tree view

sort(this)" class="sortdirectionindicator"/> <splitter class="tree-splitter"/> <treecol id="weapon" label="weapon" flex="1" persist="width ordinal hidden" onclick="sort(this)" class="sortdirectionindicator"/> </treecols> <treechildren id="tree-children"/> </tree> </window> sort.js var table = null; var data = null; var tree; var filtertext = ""; function init() { tree = document.getelementbyid("tree"); loadtable(); } //this function is called every time the tree is sorted, filtered, or reloaded function loadtable() { //remember scroll position.
...h({name: "shredder", description: "armored man", weapon: "blades"}); data.push({name: "casey jones", description: "goalie masked man", weapon: "hockey stick"}); data.push({name: "april o'neil", description: "journalist", weapon: "none"}); } if (filtertext == "") { //show all of them table = data; } else { //filter out the ones we want to display table = []; data.foreach(function(element) { //we'll match on every property for (var i in element) { if (prepareforcomparison(element[i]).indexof(filtertext) != -1) { table.push(element); break; } } }); } sort(); //restore scroll position if (topvisiblerow) { settopvisiblerow(topvisiblerow); } } //generic custom tree view stuff function treeview(table) { this.rowcount = table.length; this.getcell...
...orcomparison(a["name"]) < prepareforcomparison(b["name"])) return -1; } return 0; } table.sort(columnsort); //setting these will make the sort option persist tree.setattribute("sortdirection", order == 1 ?
...And 2 more matches

Additional Template Attributes - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Additional Template Attributes

« previousnext » referencing templates all the templates used so far have had the template placed inside the root element with the datasources attribute.
... referencing templates all the templates used so far have had the template placed inside the root element with the datasources attribute.
...template among two different parts of the user interface.
...And 2 more matches

Accesskey display rules - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Accesskey display rules

each controls of xul can have an accesskey which is specified by accesskey attribute or accesskey property (see accesskey attribute document for the detail).
... each controls of xul can have an accesskey which is specified by accesskey attribute or accesskey property (see accesskey attribute document for the detail).
... each controls of xul can have an accesskey which is specified by accesskey attribute or accesskey property (see accesskey attribute document for the detail).
...And 2 more matches

Custom Tree Views - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Custom Tree Views

terfaces changed in gecko 1.8.
...ct which implements the nsitreeview interface.
... each cell.
...And 2 more matches

Numeric Controls - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Numeric Controls

« previousnext » xul has two elements used for the entry of numeric values or ranges, and well as two elements for entering dates and times.
... « previousnext » xul has two elements used for the entry of numeric values or ranges, and well as two elements for entering dates and times.
...xtbox is focused.
...And 2 more matches

Scrolling Menus - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Scrolling Menus

« previousnext » this section will describe scrolling menus and how to use the mechanism with other elements.
... mouse over the arrows, the menu will scroll up and down.
...e arrows, the menu will scroll up and down.
...And 2 more matches

Tree Box Objects - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Tree Box Objects

et boxobject = tree.boxobject; boxobject.queryinterface("components.interfaces.nsitreeboxobject"); scrolling the tree you can also scroll the tree using four different methods, similar to those available for listboxes.
...ace("components.interfaces.nsitreeboxobject"); scrolling the tree you can also scroll the tree using four different methods, similar to those available for listboxes.
...hing to note is that the coordinates are measured from the upper left corner of the containing document, not the edge of the tree itself.
...And 2 more matches

XUL Tutorial - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial

this tutorial describes xul, the xml user-interface language.
... this tutorial describes xul, the xml user-interface language.
...as created for the mozilla application and is used to describe its user interface.
...And 2 more matches

XUL FAQ - Archive of obsolete content

Archive › Mozilla › XUL › XUL FAQ

ension) often proves useful.
...ng to create a xul ide/editor is at wikimo:xul:ide.
...efwindow-based options window: does each prefpane have a unique id?
...And 2 more matches

action - Archive of obsolete content

Archive › Mozilla › XUL › action

« xul reference home [ examples | attributes | properties | methods | related ] used to specify the content that should be generated for each matching result from a query.
... « xul reference home [ examples | attributes | properties | methods | related ] used to specify the content that should be generated for each matching result from a query.
...ndants may use variables in place of attribute values.
...And 2 more matches

dropmarker - Archive of obsolete content

Archive › Mozilla › XUL › dropmarker

« xul reference home [ examples | attributes | properties | methods | related ] a dropmarker is a button with an arrow which will reveal more details when pressed.
... « xul reference home [ examples | attributes | properties | methods | related ] a dropmarker is a button with an arrow which will reveal more details when pressed.
...ods | related ] a dropmarker is a button with an arrow which will reveal more details when pressed.
...And 2 more matches

groupbox - Archive of obsolete content

Archive › Mozilla › XUL › groupbox

progressmeter - Archive of obsolete content

Archive › Mozilla › XUL › progressmeter

ies accessibletype, max, mode, value examples <progressmeter mode="determined" value="82"/> <progressmeter mode="undetermined"/>  <progressmeter mode="determined" id="myprogress"/> <button label="example" onmouseover="setloading(true)" onmouseout="setloading(false)"/> function setloading(state){ document.getelementbyid('myprogress').mode = (state) ?
...e the amount of the bar that is filled in.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessibletype type: integer a value indicating the type of accessibility object for the element.
...And 2 more matches

spacer - Archive of obsolete content

Archive › Mozilla › XUL › spacer

« xul reference home [ examples | attributes | properties | methods | related ] an element that takes up space but does not display anything.
...is usually used to place spacing within a container.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , ...
...And 2 more matches

spinbuttons - Archive of obsolete content

Archive › Mozilla › XUL › spinbuttons

« xul reference home [ examples | attributes | properties | methods | related ] spin buttons are two arrows, one to increase a value and one to decrease a value.
... « xul reference home [ examples | attributes | properties | methods | related ] spin buttons are two arrows, one to increase a value and one to decrease a value.
... methods | related ] spin buttons are two arrows, one to increase a value and one to decrease a value.
...And 2 more matches

statusbar - Archive of obsolete content

Archive › Mozilla › XUL › statusbar

i suggest using the add-on bar instead.
... usually placed along the bottom of a window.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessibletype type: integer a value indicating the type of accessibility object for the element.
...And 2 more matches

toolbargrippy - Archive of obsolete content

Archive › Mozilla › XUL › toolbargrippy

« xul reference home [ examples | attributes | properties | methods | related ] not in firefox the notch on the side of a toolbar which can be used to collapse and expand it.
...s | attributes | properties | methods | related ] not in firefox the notch on the side of a toolbar which can be used to collapse and expand it.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessible type: nsiaccessible returns the accessibility object for the element.
...And 2 more matches

toolbarset - Archive of obsolete content

Archive › Mozilla › XUL › toolbarset

« xul reference home [ examples | attributes | properties | methods | related ] firefox only this element is used as a container for custom toolbars, which are added in the custom toolbar dialog.
... « xul reference home [ examples | attributes | properties | methods | related ] firefox only this element is used as a container for custom toolbars, which are added in the custom toolbar dialog.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , ...
...And 2 more matches

wizardpage - Archive of obsolete content

Archive › Mozilla › XUL › wizardpage

Dialogs in XULRunner - Archive of obsolete content

Archive › Mozilla › XULRunner › Dialogs in XULRunner

re used so frequently that the os can provide a default implementation.
...alogheader title="my dialog" description="example dialog"/> <groupbox flex="1"> <caption label="select favorite fruit"/> <radiogroup> <radio id="1" label="oranges because they are fruity"/> <radio id="2" selected="true" label="strawberries because of color"/> <radio id="3" label="bananna because it pre packaged"/> </radiogroup> </groupbox> </dialog> xul window elements have a special method to open dialogs, called window.opendialog().
...l method to open dialogs, called window.opendialog().
...And 2 more matches

Why Well-Formed Web RSS Module is Popular - Syndicating Your Comments - Archive of obsolete content

Archive › RSS › Article › Why Well-Formed Web RSS Module is Popular - Syndicating Your Comments

there aren't many blogs out there that don't allow commenting of blog posts.
... commenting of blog posts.
...e.com/feed/rss/54320/comments</wfw:commentrss> </item> <item> <title>huh?!</title> <guid>d77d2e80-0487-4e8c-a35d-a93f12a0ff7d:article:54319</guid> <pubdate>sun, 15 may 2005 08:14:11 -0500</pubdate> <link>http://www.example.com/article/54319</link> <wfw:commentrss>http://www.example.com/feed/rss/54319/comments</wfw:commentrss> </item> </channel> </rss> the <wfw:commentrss> element is the reason that the well-formed web rss module is popular.
...And 2 more matches

Table Reflow Internals - Archive of obsolete content

Archive › Table Reflow Internals

hange font (ctrl+/-), a preference changes, etc.
...elements) reflows reflowee and passes a reflow state (in) and a reflow metrics (in/out) review of reflow the reflow state: is a node in a tree structurally equivalent to the frame tree of reflow participants contains: reflow type, avail size, various computed values, resolved style structs possible request for preferred size and more.
... ↓ nstablecell frame ↓ nsblock frame table reflow outer table reflows table and caption (if present) table reflows row groups in multiple passes pass 1 - unconstrained width, height and requests max elem width.
...And 2 more matches

Building a Theme - Archive of obsolete content

Archive › Themes › Building a Theme

ill report xml errors to you.
...ns, menus, toolbars, trees, etc.
...ling on its own - if you try to start up with an empty theme, firefox will be unusable, as the button elements will be drawn as plain text.
...And 2 more matches

Making sure your theme works with RTL locales - Archive of obsolete content

Archive › Themes › Making sure your theme works with RTL locales

="icons"] #back-button:-moz-locale-dir(rtl) { -moz-image-region: rect(0px 516px 34px 480px); } this specifies the default, left-to-right version of the button, then offers an override if the user's interface is being rendered in right-to-left mode.
...e works, so you can use it as an example.
...back-button { -moz-image-region: rect(0px 398px 34px 360px); } toolbar[iconsize="large"][mode="icons"] #back-button[chromedir="rtl"] { -moz-image-region: rect(0px 516px 34px 478px); } this way, if chromedir is "rtl", the second rule will override the first, and the theme will work in rtl.
...And 2 more matches

-ms-content-zoom-chaining - Archive of obsolete content

Archive › Web › CSS › -ms-content-zoom-chaining

the -ms-content-zoom-chaining css property is a microsoft extension specifying the zoom behavior that occurs when a user hits the zoom limit during page manipulation.
... the -ms-content-zoom-chaining css property is a microsoft extension specifying the zoom behavior that occurs when a user hits the zoom limit during page manipulation.
...vior that occurs when a user hits the zoom limit during page manipulation.
...And 2 more matches

-ms-content-zoom-limit-max - Archive of obsolete content

Archive › Web › CSS › -ms-content-zoom-limit-max

the -ms-content-zoom-limit-max css property is a microsoft extension that specifies the selected elements' maximum zoom factor.
... the -ms-content-zoom-limit-max css property is a microsoft extension that specifies the selected elements' maximum zoom factor.
... the -ms-content-zoom-limit-max css property is a microsoft extension that specifies the selected elements' maximum zoom factor.
...And 2 more matches

-ms-scroll-limit-x-max - Archive of obsolete content

Archive › Web › CSS › -ms-scroll-limit-x-max

the -ms-scroll-limit-x-max css property is a microsoft extension that specifies the maximum value for the element.scrollleft property.
... the -ms-scroll-limit-x-max css property is a microsoft extension that specifies the maximum value for the element.scrollleft property.
... the -ms-scroll-limit-x-max css property is a microsoft extension that specifies the maximum value for the element.scrollleft property.
...And 2 more matches

-ms-scroll-limit-y-max - Archive of obsolete content

Archive › Web › CSS › -ms-scroll-limit-y-max

the -ms-scroll-limit-y-max css property is a microsoft extension that specifies the maximum value for the element.scrolltop property.
... the -ms-scroll-limit-y-max css property is a microsoft extension that specifies the maximum value for the element.scrolltop property.
... the -ms-scroll-limit-y-max css property is a microsoft extension that specifies the maximum value for the element.scrolltop property.
...And 2 more matches

Examples - Archive of obsolete content

Archive › Web › Properly Using CSS and JavaScript in XHTML Documents › Examples

t/javascript">  </script> </head> <body> <h1>problem 2 - comments in xhtml</h1> <p> this document is valid xhtml 1.0 strict served as <code>application/xhtml+xml</code>.
... sum += i; } alert('sum = ' + sum); // --> </script> </head> <body> <h1>problem 2 - comments in xhtml</h1> <p> this document is valid xhtml 1.0 strict served as <code>application/xhtml+xml</code>.
...  </style> </head> <body> <h1>example 1 - xhtml 1.0 strict as text/html</h1> <p> this document is valid xhtml 1.0 strict served as <code>text/html</code>.
...And 2 more matches

XForms API Reference - Archive of obsolete content

Archive › Web › XForms › API Reference

this page is the beginning of the xforms api reference.
... this page is the beginning of the xforms api reference.
... this page is the beginning of the xforms api reference.
...And 2 more matches

RDF in Mozilla FAQ - Archive of obsolete content

Archive › Web Standards › RDF in Mozilla FAQ

y.
...ly.xul"> ...
...es="rdf:null"> ...
...And 2 more matches

2D maze game with device orientation - Game development

Games › Tutorials › HTML5 Gamedev Phaser Device Orientation

r game = new phaser.game(320, 480, phaser.canvas, 'game'); the line above will initialize the phaser instance — the arguments are the width of the canvas, height of the canvas, rendering method (we're using canvas, but there are also webgl and auto options available) and the optional id of the dom container we want to put the canvas in.
...nce — the arguments are the width of the canvas, height of the canvas, rendering method (we're using canvas, but there are also webgl and auto options available) and the optional id of the dom container we want to put the canvas in.
... this.game.scale.scalemode = phaser.scalemanager.show_all; this.game.scale.pagealignhorizontally = true; this.game.scale.pagealignvertically = true; this.game.state.start('preloader'); } }; the main ball object is defined and we're adding two variables called _width and _height that are the width and the height of the game canvas — they will help us position the elements on the screen.
...And 2 more matches

Accessibility tree (AOM) - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › AOM

the accessibility tree, or accessibility object model (aom), contains accessibility-related information for most html elements.
... the accessibility tree, or accessibility object model (aom), contains accessibility-related information for most html elements.
...tform-specific accessibility apis for assistive technologies, such as screen readers.
...And 2 more matches

Selector (CSS) - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › CSS Selector

a css selector is the part of a css rule that describes what elements in a document the rule will match.
... a css selector is the part of a css rule that describes what elements in a document the rule will match.
...ents will have the rule's specified style applied to them.
...And 2 more matches

Tag - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Tag

in html, a tag is used for creating an element.
... in html, a tag is used for creating an element.
... in html, a tag is used for creating an element.
...And 2 more matches

Assessment: Accessibility troubleshooting - Learn web development

Learn › Accessibility › Accessibility troubleshooting

les that comprise the example.
... changing the assigned colors?
...ier for screenreader users to navigate?
...And 2 more matches

Handling different text directions - Learn web development

Learn › CSS › Building blocks › Handling different text directions

r web design.
... vertically.
...mode property is in reality setting the direction in which block-level elements are displayed on the page — either from top-to-bottom, right-to-left, or left-to-right.
...And 2 more matches

Test your skills: floats - Learn web development

Learn › CSS › CSS layout › Floats skills

the aim of this task is to get you working with the css float and clear properties covered in our lesson on floats.
... material you have just covered.
...float the two elements with a class of float1 and float2 left and right respectively.
...And 2 more matches

How CSS works - Learn web development

Learn › CSS › First steps › How CSS works

ail in the next section.
...taches style to them as required (this intermediate step is called a render tree).
...en applied to it.
...And 2 more matches

Use CSS to solve common problems - Learn web development

Learn › CSS › Howto

the following links provide solutions to common problems you may face when working with css.
... the following links provide solutions to common problems you may face when working with css.
... the following links provide solutions to common problems you may face when working with css.
...And 2 more matches

How can we design for all types of users? - Learn web development

Learn › Common questions › Design for all types of users

pretending that you're asking for "16 pixels when the user sets a zoom factor of 100%".
...ternet explorer 8, which we still have to cater to because it's still around.
... to because it's still around.
...And 2 more matches

Introduction to HTML - Learn web development

Learn › HTML › Introduction to HTML

at its heart, html is a fairly simple language made up of elements, which can be applied to pieces of text to give them different meaning in a document (is it a paragraph?
...t you create your own files, you can try out (most of) the code examples in an online coding program such as jsbin or glitch.
...the following articles, which will take you through all the basic theory of html and provide ample opportunity for you to test out some skills.
...And 2 more matches

CSS performance optimization - Learn web development

Learn › Performance › CSS

imations, and handle animating properties that do not trigger a reflow (and therefore also a repaint) very well.
...o a repaint) very well.
...pacity, position: fixed, will-change, and filter.
...And 2 more matches

Perceived performance - Learn web development

Learn › Performance › Perceived performance

doesn't mean it's useful content or that the user has content to consume.
... other reflows images or other assets causing content to be pushed down or jump to a different location, like the loading of third party advertisements, can make the page feel like it is still loading and is bad for perceived performance.
...art form, and can greatly improve the user experience.
...And 2 more matches

Dynamic behavior in Svelte: working with variables and props - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Svelte variables props

ndex of the current item.
... should render just like they did before, except that now we're passing them in from the app.svelte component.
...ls svelte to generate the code to call event.preventdefault() before running the handler.
...And 2 more matches

Chrome registration

Mozilla › Chrome Registration

what is chrome?
... what is chrome?
...on platformversion>=version indicates that the instruction should only be applied if the extension is installed into an application using the gecko version identified.
...And 2 more matches

HTML parser threading

Mozilla › Gecko › HTML parser threading

able passes the byte data to the decoder whose output is accumulated into a linked list of nshtml5owningutf16buffer objects.
...when it gets deleted.
...e parser core if they don't make it as far a tree op.
...And 2 more matches

MathML Torture Test

Mozilla › MathML Project › MathML Torture Test

i> <mtext> </mtext> <mi>b</mi> <mtext>'s</mtext> </mrow> </mover> </mover> </mrow> <munder> <mo>&underbrace;</mo> <mrow> <mi>k</mi> <mo>+</mo> <mi>&ell;</mi> <mtext> elements</mtext> </mrow> </munder> </munder> <mo stretchy="false">}</mo> </mrow> </math> </td> </tr> <tr> <td>23</td> <td><img src="https://udn.realityripple.com/samples/45/c73ac26e1d.png" width="213" height="108" alt="texbook, 18.42" /></td> <td> <math display="block"> <mrow> <mo>(</mo> <mta...
... <mtext> </mtext> <mi>𞸜</mi> <mtext>'s</mtext> </mrow> </mover> </mover> </mrow> <munder> <mo>&underbrace;</mo> <mrow> <mi>𞸟</mi> <mo>+</mo> <mi>&ell;</mi> <mtext> elements</mtext> </mrow> </munder> </munder> <mo stretchy="false">}</mo> </mrow> </math> </td> <td> <math dir="rtl" display="block"> <mrow> <mo stretchy="false">{</mo> <munder> <mrow> <mover> <mrow> <mpadded width="0em"><mphantom><mo>(</mo></mph...
... <mtext> </mtext> <mi>𞸜</mi> <mtext>'s</mtext> </mrow> </mover> </mover> </mrow> <munder> <mo>&underbrace;</mo> <mrow> <mi>𞸟</mi> <mo>+</mo> <mi>&ell;</mi> <mtext> elements</mtext> </mrow> </munder> </munder> <mo stretchy="false">}</mo> </mrow> </math> </td> <td> <math display="block"> <mrow> <mo stretchy="false">{</mo> <munder> <mrow> <mover> <mrow> <mpadded width="0em"><mphantom><mo>(</mo></mphantom></mp...
...And 2 more matches

MathML Demo: <mspace> - space

Mozilla › MathML Project › mspace

mathml demo: <mspace> - space the background color of <mspace> elements has been set to yellow for easier viewing.
... mathml demo: <mspace> - space the background color of <mspace> elements has been set to yellow for easier viewing.
... demo: <mspace> - space the background color of <mspace> elements has been set to yellow for easier viewing.
...And 2 more matches

PR_INSERT_AFTER

Mozilla › Projects › NSPR › Reference › PR INSERT AFTER

inserts an element after another element in a circular list.
... inserts an element after another element in a circular list.
... inserts an element after another element in a circular list.
...And 2 more matches

PR_INSERT_BEFORE

Mozilla › Projects › NSPR › Reference › PR INSERT BEFORE

inserts an element before another element in a circular list.
... inserts an element before another element in a circular list.
... inserts an element before another element in a circular list.
...And 2 more matches

Python binding for NSS

Mozilla › Projects › NSS › Python binding for NSS

s an alternative to openssl and used extensively by major software projects.
...nerated html documentation provided with each release.
... generating a print representation of complex objects.
...And 2 more matches

JS_HasArrayLength

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS HasArrayLength

hp receives the current value of the length property.
...rent value of the length property.
...n failure, js_hasarraylength returns js_false, and the value left in *lengthp is undefined.
...And 2 more matches

nsIControllers

Mozilla › Tech › XPCOM › Reference › Interface › nsIControllers

content/xul/document/public/nsicontrollers.idlscriptable represents a list of nsicontroller elements.
... content/xul/document/public/nsicontrollers.idlscriptable represents a list of nsicontroller elements.
... content/xul/document/public/nsicontrollers.idlscriptable represents a list of nsicontroller elements.
...And 2 more matches

nsIDragService

Mozilla › Tech › XPCOM › Reference › Interface › nsIDragService

he cursor would be positioned.
...n within the image.
...e not used and the image is instead determined from the source node adomnode, and the offset calculated so that the initial location for the image appears in the same screen position as where the element is located.
...And 2 more matches

nsIVariant

Mozilla › Tech › XPCOM › Reference › Interface › nsIVariant

s utf16 then the high bits are lost.
... was utf8 then it is converted to utf16 and the high bits are discarded.
...ays and interface pointers cannot be converted to a string.
...And 2 more matches

Building a Thunderbird extension 3: install manifest

Mozilla › Thunderbird › Thunderbird extensions › Building a Thunderbird extension 3: install manifest

>1.0</em:version>: this is the version number of your extension.
...store the extension author's name.
...the id does not change and is always the same even for different versions of thunderbird.
...And 2 more matches

DOM Inspector FAQ - Firefox Developer Tools

Tools › Add-ons › DOM Inspector › DOM Inspector FAQ

ed by the original document.
...for tabpanel and tabbox as well as tab.
...u can use the beginning-of-string and end-of-string markers; e.g., searching nodes for "^tab$" will return only nodes whose names are exactly "tab".
...And 2 more matches

DOM Inspector internals - Firefox Developer Tools

Tools › Add-ons › DOM Inspector › Internals

seamonkey and firefox, respectively.) there are several overlays from the resources/contents/ directory that do not fall into the category of host-integration overlays.
... that it contains almost no visible elements.
...bar, with some exceptions.
...And 2 more matches

Debugger.Script - Firefox Developer Tools

Tools › Debugger-API › Debugger.Script

to a jsscript, they are distinguished by their format property being "js".
... of the following is represented by a single jsscript object: the body of a function—that is, all the code in the function that is not contained within some nested function.
...de, throw a typeerror.
...And 2 more matches

Aggregate view - Firefox Developer Tools

Tools › Memory › Aggregate view

o a box labeled "filter" at the top-right of the pane.
...t the top-right of the pane.
...in a function at line 35 of "alloc.js", or in functions called by that function we can use the disclosure triangle to drill down the call tree, to find the exact place your code made those allocations.
...And 2 more matches

Page inspector keyboard shortcuts - Firefox Developer Tools

Tools › Page Inspector › Keyboard shortcuts

command windows macos linux inspect element ctrl + shift + c cmd + shift + c ctrl + shift + c node picker these shortcuts work while the node picker is active.
... command windows macos linux inspect element ctrl + shift + c cmd + shift + c ctrl + shift + c node picker these shortcuts work while the node picker is active.
... command windows macos linux inspect element ctrl + shift + c cmd + shift + c ctrl + shift + c node picker these shortcuts work while the node picker is active.
...And 2 more matches

ANGLE_instanced_arrays - Web APIs

Web › API › ANGLE instanced arrays

used in the gl.getvertexattrib() method: ext.vertex_attrib_array_divisor_angle returns a glint describing the frequency divisor used for instanced rendering when used in the gl.getvertexattrib() as the pname parameter.
...le returns a glint describing the frequency divisor used for instanced rendering when used in the gl.getvertexattrib() as the pname parameter.
...for instanced rendering when used in the gl.getvertexattrib() as the pname parameter.
...And 2 more matches

AudioTrack.enabled - Web APIs

Web › API › AudioTrack › enabled

bled; audiotrack.enabled = true | false; value the enabled property is a boolean whose value is true if the track is enabled; enabled tracks produce audio while the media is playing.
...s a boolean whose value is true if the track is enabled; enabled tracks produce audio while the media is playing.
... } else if (track.kind === "commentary") { audiotrackcommentary = track; } } if (audiotrackmain && audiotrackcommentary) { var commentaryenabled = audiotrackcommentary.enabled; audiotrackcommentary.enabled = audiotrackmain.enabled; audiotrackmain.enabled = commentaryenabled; } } the swapcommentarymain() function above finds within the audio tracks of the <video> element "main-video" the audio tracks whose kind values are "main" and "commentary".
...And 2 more matches

CanvasCaptureMediaStreamTrack.canvas - Web APIs

Web › API › CanvasCaptureMediaStreamTrack › canvas

the canvascapturemediastreamtrack canvas read-only property returns the htmlcanvaselement from which frames are being captured.
... the canvascapturemediastreamtrack canvas read-only property returns the htmlcanvaselement from which frames are being captured.
... the canvascapturemediastreamtrack canvas read-only property returns the htmlcanvaselement from which frames are being captured.
...And 2 more matches

CanvasRenderingContext2D.addHitRegion() - Web APIs

Web › API › CanvasRenderingContext2D › addHitRegion

the canvasrenderingcontext2d method addhitregion() adds a hit region to the bitmap.
... rule.
... the even-odd winding rule.
...And 2 more matches

Transformations - Web APIs

Web › API › Canvas API › Tutorial › Transformations

xt section.
...r to understand and use.
... to move the canvas by using the translate() method.
...And 2 more matches

DOMImplementation.createDocument() - Web APIs

Web › API › DOMImplementation › createDocument

ns an xmldocument.
...iednamestr is a domstring containing the qualified name, that is an optional prefix and colon plus the local root element name, of the document to be created.
...plus the local root element name, of the document to be created.
...And 2 more matches

DOMTokenList.forEach() - Web APIs

Web › API › DOMTokenList › forEach

the foreach() method of the domtokenlist interface calls the callback given in parameter once for each value pair in the list, in insertion order.
... the foreach() method of the domtokenlist interface calls the callback given in parameter once for each value pair in the list, in insertion order.
...each() method of the domtokenlist interface calls the callback given in parameter once for each value pair in the list, in insertion order.
...And 2 more matches

DataTransfer.clearData() - Web APIs

Web › API › DataTransfer › clearData

datatransfer.cleardata([format]); parameters format optional a string which specifies the type of data to remove.
... which specifies the type of data to remove.
...op zone</span> <div>status: <span id="status">drag to start</span></div> <div>data is: <span id="data">uninitialized</span></div> css span.tweaked { display: inline-block; margin: 1em 0; padding: 1em 2em; } #source { color: blue; border: 1px solid black; } #target { border: 1px solid black; } javascript window.addeventlistener('domcontentloaded', function () { // select html elements var draggable = document.getelementbyid('source'); var dropable = document.getelementbyid('target'); var status = document.getelementbyid('status'); var data = document.getelementbyid('data'); var dropped = false; // register event handlers draggable.addeventlistener('dragstart', dragstarthandler); draggable.addeventlistener('dragend', dragendhandler); dropable.addeventlistene...
...And 2 more matches

DataTransfer.dropEffect - Web APIs

Web › API › DataTransfer › dropEffect

the datatransfer.dropeffect property controls the feedback (typically visual) the user is given during a drag and drop operation.
...a new location.
...n.
...And 2 more matches

Document.exitFullscreen() - Web APIs

Web › API › Document › exitFullscreen

the document method exitfullscreen() requests that the element on this document which is currently being presented in full-screen mode be taken out of full-screen mode, restoring the previous state of the screen.
... the document method exitfullscreen() requests that the element on this document which is currently being presented in full-screen mode be taken out of full-screen mode, restoring the previous state of the screen.
...which is resolved once the user agent has finished exiting full-screen mode.
...And 2 more matches

Document.fullscreen - Web APIs

Web › API › Document › fullscreen

nly property reports whether or not the document is currently displaying content in full-screen mode.
...hrow if it is modified (even in strict mode); the setter is a no-operation and it will be ignored.
...lean value which is true if the document is currently displaying an element in full-screen mode; otherwise, the value is false.
...And 2 more matches

Document.fullscreenEnabled - Web APIs

Web › API › Document › fullscreenEnabled

the read-only fullscreenenabled property on the document interface indicates whether or not full-screen mode is available.
...n any of its documents, and if all <iframe> elements which contain the document have their allowfullscreen attribute set.
...ain the document have their allowfullscreen attribute set.
...And 2 more matches

Document.releaseCapture() - Web APIs

Web › API › Document › releaseCapture

the releasecapture() method releases mouse capture if it's currently enabled on an element within this document.
... the releasecapture() method releases mouse capture if it's currently enabled on an element within this document.
... the releasecapture() method releases mouse capture if it's currently enabled on an element within this document.
...And 2 more matches

Comparison of Event Targets - Web APIs

Web › API › Event › Comparison of Event Targets

event targets it's easy to get confused about which target to examine when writing an event handler.
... event targets it's easy to get confused about which target to examine when writing an event handler.
...on-standard { background-color: #902d37; } </style> </head> <body> <table> <thead> <tr> <td class="standard">original target dispatching the event <small>event.target</small></td> <td class="standard">target who's event listener is being processed <small>event.currenttarget</small></td> <td class="standard">identify other element (if any) involved in the event <small>event.relatedtarget</small></td> <td class="non-standard">if there was a retargetting of the event for some reason <small> event.explicitoriginaltarget</small> contains the target before retargetting (never contains anonymous targets)</td> <td class="non-standard">if there was a retargetting of the event for some reason <small> event.o...
...And 2 more matches

Event.currentTarget - Web APIs

Web › API › Event › currentTarget

the currenttarget read-only property of the event interface identifies the current target for the event, as the event traverses the dom.
... the currenttarget read-only property of the event interface identifies the current target for the event, as the event traverses the dom.
...e event traverses the dom.
...And 2 more matches

File and Directory Entries API - Web APIs

Web › API › File and Directory Entries API

values you desire.
... asynchronous api will not block and functions and the api will not return values; instead, you will need to supply a callback function to handle the response whenever it arrives.
...etting access to a file system there are two ways to get access to file systems defined in the current specification draft: when handling a drop event for drag and drop, you can call datatransferitem.webkitgetasentry() to get the filesystementry for a dropped item.
...And 2 more matches

GeolocationCoordinates.longitude - Web APIs

Web › API › GeolocationCoordinates › longitude

enwich meridian.
...global positioning system (gps).
... simple example, we fetch the user's location and display the resulting coordinates once they're returned.
...And 2 more matches

GlobalEventHandlers.oninput - Web APIs

Web › API › GlobalEventHandlers › oninput

the oninput property of the globaleventhandlers mixin is an eventhandler that processes input events on the <input>, <select>, and <textarea> elements.
... the oninput property of the globaleventhandlers mixin is an eventhandler that processes input events on the <input>, <select>, and <textarea> elements.
... the oninput property of the globaleventhandlers mixin is an eventhandler that processes input events on the <input>, <select>, and <textarea> elements.
...And 2 more matches

GlobalEventHandlers.ontouchcancel - Web APIs

Web › API › GlobalEventHandlers › ontouchcancel

the ontouchcancel property of the globaleventhandlers mixin is an eventhandler that processes touchcancel events.
...ndlers mixin is an eventhandler that processes touchcancel events.
... is an eventhandler that processes touchcancel events.
...And 2 more matches

GlobalEventHandlers.ontouchend - Web APIs

Web › API › GlobalEventHandlers › ontouchend

a global event handler for the touchend event.
... a global event handler for the touchend event.
... a global event handler for the touchend event.
...And 2 more matches

GlobalEventHandlers.ontouchmove - Web APIs

Web › API › GlobalEventHandlers › ontouchmove

a global event handler for the touchmove event.
... a global event handler for the touchmove event.
... a global event handler for the touchmove event.
...And 2 more matches

GlobalEventHandlers.ontouchstart - Web APIs

Web › API › GlobalEventHandlers › ontouchstart

the ontouchstart property of the globaleventhandlers mixin is an eventhandler that processes touchstart events.
...enthandlers mixin is an eventhandler that processes touchstart events.
...mixin is an eventhandler that processes touchstart events.
...And 2 more matches

IntersectionObserverEntry.intersectionRatio - Web APIs

Web › API › IntersectionObserverEntry › intersectionRatio

the intersectionobserverentry interface's read-only intersectionratio property tells you how much of the target element is currently visible within the root's intersection ratio, as a value between 0.0 and 1.0.
... the intersectionobserverentry interface's read-only intersectionratio property tells you how much of the target element is currently visible within the root's intersection ratio, as a value between 0.0 and 1.0.
...in the root's intersection rectangle.
...And 2 more matches

IntersectionObserverEntry - Web APIs

Web › API › IntersectionObserverEntry

the intersectionobserverentry interface of the intersection observer api describes the intersection between the target element and its root container at a specific moment of transition.
...he target element and its root container at a specific moment of transition.
...tersectionobserverentry are delivered to an intersectionobserver callback in its entries parameter; otherwise, these objects can only be obtained by calling intersectionobserver.takerecords().
...And 2 more matches

KeyframeEffectOptions - Web APIs

Web › API › KeyframeEffectOptions

the keyframeeffectoptions dictionary, part of the web animations api, is used by element.animate(), keyframeeffectreadonly() and keyframeeffect() to describe timing properties for animation effects.
...ue but result in translatex(-200px) rotate(20deg).
...g).
...And 2 more matches

MediaError.code - Web APIs

Web › API › MediaError › code

the read-only property mediaerror.code returns a numeric value which represents the kind of error that occurred on a media element.
... previously been available.
...spite having previously been determined to be usable, an error occurred while trying to decode the media resource, resulting in an error.
...And 2 more matches

MediaStreamTrack: mute event - Web APIs

Web › API › MediaStreamTrack › mute event

nts.
...ples in this example, event handlers are established for the mute and unmute events in order to detect when the media is not flowing from the source for the mediastreamtrack referenced by musictrack.
...eamtrack referenced by musictrack.
...And 2 more matches

MediaStreamTrack: unmute event - Web APIs

Web › API › MediaStreamTrack › unmute event

e way to silence a track) is actually managed using the mediastreamtrack.enabled property, for which there are no events.
...this example, event handlers are established for the mute and unmute events in order to detect when the media is not flowing from the source for the mediastreamtrack stored in the variable musictrack.
...stored in the variable musictrack.
...And 2 more matches

Node.isSameNode() - Web APIs

Web › API › Node › isSameNode

ence the same object).
...ssamenode = node.issamenode(othernode) parameters othernode the node to test against.
... parameters othernode the node to test against.
...And 2 more matches

NodeList - Web APIs

Web › API › NodeList

ircumvented by using array.prototype.foreach() — see this document's example.
...lists, there are 2 varieties of nodelist: live and static.
...nodelist[i] (which instead returns undefined when i is out-of-bounds).
...And 2 more matches

ParentNode.children - Web APIs

Web › API › ParentNode › children

the parentnode property children is a read-only property that returns a live htmlcollection which contains all of the child elements of the node upon which it was called.
... the parentnode property children is a read-only property that returns a live htmlcollection which contains all of the child elements of the node upon which it was called.
...contains all of the child elements of the node upon which it was called.
...And 2 more matches

RTCPeerConnection.addTrack() - Web APIs

Web › API › RTCPeerConnection › addTrack

= ev.streams[0]; } else { if (!inboundstream) { inboundstream = new mediastream(); videoelem.srcobject = inboundstream; } inboundstream.addtrack(ev.track); } } here, the track event handler adds the track to the first stream specified by the event, if a stream is specified.
... peer: async opencall(pc) { const gumstream = await navigator.mediadevices.getusermedia( {video: true, audio: true}); for (const track of gumstream.gettracks()) { pc.addtrack(track, gumstream); } } the remote peer might then use a track event handler that looks like this: pc.ontrack = ({streams: [stream]} => videoelem.srcobject = stream; this sets the video element's current stream to the one that contains the track that's been added to the connection.
...is called when an offer message is received from the remote peer.
...And 2 more matches

RTCTrackEvent - Web APIs

Web › API › RTCTrackEvent

preceiver (which is specified by the event's receiver property).
...ent handler property.
...nd you call addtrack() to add a track to the far end of the connection, thereby triggering a track event on the remote peer.
...And 2 more matches

Range.getBoundingClientRect() - Web APIs

Web › API › Range › getBoundingClientRect

the range.getboundingclientrect() method returns a domrect object that bounds the contents of the range; this is a rectangle enclosing the union of the bounding rectangles for all the elements in the range.
... the range.getboundingclientrect() method returns a domrect object that bounds the contents of the range; this is a rectangle enclosing the union of the bounding rectangles for all the elements in the range.
...highlight" rectangle behind the contents of a range.
...And 2 more matches

ResizeObserverEntry.borderBoxSize - Web APIs

Web › API › ResizeObserverEntry › borderBoxSize

the borderboxsize read-only property of the resizeobserverentry interface returns an array containing the new border box size of the observed element when the callback is run.
... the borderboxsize read-only property of the resizeobserverentry interface returns an array containing the new border box size of the observed element when the callback is run.
... the borderboxsize read-only property of the resizeobserverentry interface returns an array containing the new border box size of the observed element when the callback is run.
...And 2 more matches

ResizeObserverEntry.contentRect - Web APIs

Web › API › ResizeObserverEntry › contentRect

the contentrect read-only property of the resizeobserverentry interface returns a domrectreadonly object containing the new size of the observed element when the callback is run.
...is is better supported than resizeobserverentry.borderboxsize or resizeobserverentry.contentboxsize, but it is left over from an earlier implementation of the resize observer api, is still included in the spec for web compat reasons, and may be deprecated in future versions.
...izeobserverentry.contentboxsize, but it is left over from an earlier implementation of the resize observer api, is still included in the spec for web compat reasons, and may be deprecated in future versions.
...And 2 more matches

Response.redirected - Web APIs

Web › API › Response › redirected

owing redirects, which shows this being done.
...is as simple as checking this flag on the response object.
...s described under disallowing redirects below.
...And 2 more matches

cx - Web APIs

Web › API › SVGCircleElement › cx

the cx read-only property of the svgcircleelement interface reflects the cx attribute of a <circle> element and by that defines the x-coordinate of the circleʼs center.
... the cx read-only property of the svgcircleelement interface reflects the cx attribute of a <circle> element and by that defines the x-coordinate of the circleʼs center.
...center.
...And 2 more matches

cy - Web APIs

Web › API › SVGCircleElement › cy

the cy read-only property of the svgcircleelement interface reflects the cy attribute of a <circle> element and by that defines the y-coordinate of the circleʼs center.
... the cy read-only property of the svgcircleelement interface reflects the cy attribute of a <circle> element and by that defines the y-coordinate of the circleʼs center.
...center.
...And 2 more matches

r - Web APIs

Web › API › SVGCircleElement › r

the r read-only property of the svgcircleelement interface reflects the r attribute of a <circle> element and by that defines the radius of the circle.
... the r read-only property of the svgcircleelement interface reflects the r attribute of a <circle> element and by that defines the radius of the circle.
...fines the radius of the circle.
...And 2 more matches

SVGFilterPrimitiveStandardAttributes - Web APIs

Web › API › SVGFilterPrimitiveStandardAttributes

"181" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfilterprimitivestandardattributes</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties svgfilterprimitivestandardattributes.x read only an svganimatedlength corresponding to the x attribute of the given element.
...baseline="middle">svgfilterprimitivestandardattributes</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties svgfilterprimitivestandardattributes.x read only an svganimatedlength corresponding to the x attribute of the given element.
... properties svgfilterprimitivestandardattributes.x read only an svganimatedlength corresponding to the x attribute of the given element.
...And 2 more matches

ShadowRoot.host - Web APIs

Web › API › ShadowRoot › host

the host read-only property of the shadowroot returns a reference to the dom element the shadowroot is attached to.
... the host read-only property of the shadowroot returns a reference to the dom element the shadowroot is attached to.
... the host read-only property of the shadowroot returns a reference to the dom element the shadowroot is attached to.
...And 2 more matches

StylePropertyMapReadOnly.get() - Web APIs

Web › API › StylePropertyMapReadOnly › get

perties and values.
...d="regurgitation"></dl> we add a bit of css, including a custom property and an inhertable property: p { font-weight: bold; } a { --colour: red; color: var(--colour); } we use the element's computedstylemap() to return a stylepropertymapreadonly object.
..."></dl> we add a bit of css, including a custom property and an inhertable property: p { font-weight: bold; } a { --colour: red; color: var(--colour); } we use the element's computedstylemap() to return a stylepropertymapreadonly object.
...And 2 more matches

Text.wholeText - Web APIs

Web › API › Text › wholeText

</a> is tricky.</p> you decide you don’t like the middle sentence, so you remove it: para.removechild(para.childnodes[1]); later, you decide to rephrase things to, “thru-hiking is great, but casting a ballot is tricky.” while preserving the hyperlink.
...on’t like the middle sentence, so you remove it: para.removechild(para.childnodes[1]); later, you decide to rephrase things to, “thru-hiking is great, but casting a ballot is tricky.” while preserving the hyperlink.
...holetext comes in: if you have multiple adjacent text nodes, you can access the contents of all of them using wholetext.
...And 2 more matches

Touch.clientX - Web APIs

Web › API › Touch › clientX

the touch object's touch.clientx and touch.clienty properties.
...enty properties.
...ouch.clientx property is the horizontal coordinate of a touch point relative to the browser's viewport excluding any scroll offset.
...And 2 more matches

Touch.clientY - Web APIs

Web › API › Touch › clientY

the touch object's touch.clientx and touch.clienty properties.
...enty properties.
...ouch.clientx property is the horizontal coordinate of a touch point relative to the browser's viewport excluding any scroll offset.
...And 2 more matches

Touch.radiusX - Web APIs

Web › API › Touch › radiusX

closely circumscribes the touching area (e.g.
...he touching area (e.g.
...e.
...And 2 more matches

TouchEvent.targetTouches - Web APIs

Web › API › TouchEvent › targetTouches

the targettouches read-only property is a touchlist listing all the touch objects for touch points that are still in contact with the touch surface and whose touchstart event occurred inside the same target element as the current target element.
...ch points that are still in contact with the touch surface and whose touchstart event occurred inside the same target element as the current target element.
...ntact with the touch surface and whose touchstart event occurred inside the same target element as the current target element.
...And 2 more matches

UIEvent.layerX - Web APIs

Web › API › UIEvent › layerX

the uievent.layerx read-only property returns the horizontal coordinate of the event relative to the current layer.
... the uievent.layerx read-only property returns the horizontal coordinate of the event relative to the current layer.
...owcoords(event)"> <p>to display the mouse coordinates please click anywhere on the page.</p> <div id="d1"> <span>this is an un-positioned div so clicking it will return layerx/layery values almost the same as pagex/pagey values.</span> </div> <div id="d2"> <span>this is a positioned div so clicking it will return layerx/layery values that are relative to the top-left corner of this positioned element.
...And 2 more matches

UIEvent.layerY - Web APIs

Web › API › UIEvent › layerY

the uievent.layery read-only property returns the vertical coordinate of the event relative to the current layer.
... the uievent.layery read-only property returns the vertical coordinate of the event relative to the current layer.
...owcoords(event)"> <p>to display the mouse coordinates please click anywhere on the page.</p> <div id="d1"> <span>this is an un-positioned div so clicking it will return layerx/layery values almost the same as pagex/pagey values.</span> </div> <div id="d2"> <span>this is a positioned div so clicking it will return layerx/layery values that are relative to the top-left corner of this positioned element.
...And 2 more matches

VideoPlaybackQuality.droppedVideoFrames - Web APIs

Web › API › VideoPlaybackQuality › droppedVideoFrames

the read-only droppedvideoframes property of the videoplaybackquality interface returns the number of video frames which have been dropped rather than being displayed since the last time the media was loaded into the htmlvideoelement.
...frames property of the videoplaybackquality interface returns the number of video frames which have been dropped rather than being displayed since the last time the media was loaded into the htmlvideoelement.
... video stream to avoid dropping frames.
...And 2 more matches

VideoPlaybackQuality - Web APIs

Web › API › VideoPlaybackQuality

a videoplaybackquality object is returned by the htmlvideoelement.getvideoplaybackquality() method and contains metrics that can be used to determine the playback quality of a video.
... video.
...amp containing the time in miliseconds between the start of the navigation and the creation of the object.
...And 2 more matches

Visual Viewport API - Web APIs

Web › API › Visual Viewport API

perties of the window's visual viewport.
...ual viewport.
...ewport without affecting the layout viewport.
...And 2 more matches

WebGLRenderingContext.bindBuffer() - Web APIs

Web › API › WebGLRenderingContext › bindBuffer

the webglrenderingcontext.bindbuffer() method of the webgl api binds a given webglbuffer to a target.
...deringcontext.bindbuffer() method of the webgl api binds a given webglbuffer to a target.
...ttempt to bind the buffer to another target will throw an invalid_operation error and the current buffer binding will remain the same.
...And 2 more matches

WebGLRenderingContext.bufferData() - Web APIs

Web › API › WebGLRenderingContext › bufferData

fer?
...ta(target, arraybufferview srcdata, usage); // webgl2: void gl.bufferdata(target, arraybufferview srcdata, usage, srcoffset, length); parameters target a glenum specifying the binding point (target).
...contents are intended to be respecified repeatedly by reading data from webgl, and used many times as the source for webgl drawing and image specification commands.
...And 2 more matches

WebGL tutorial - Web APIs

Web › API › WebGL API › Tutorial

webgl enables web content to use an api based on opengl es 2.0 to perform 3d rendering in an html <canvas> in browsers that support it without the use of plug-ins.
... webgl enables web content to use an api based on opengl es 2.0 to perform 3d rendering in an html <canvas> in browsers that support it without the use of plug-ins.
...l <canvas> in browsers that support it without the use of plug-ins.
...And 2 more matches

Writing WebSocket client applications - Web APIs

Web › API › WebSockets API › Writing WebSocket client applications

reasonably complex data to the server.
...gh the server function sendtext() { // construct a msg object containing the data the server needs to process the message from the chat client.
...e data the server needs to process the message from the chat client.
...And 2 more matches

Web Audio API - Web APIs

Web › API › Web Audio API

es are linked into chains and simple webs by their inputs and outputs.
...cution of the audio processing, or decoding.
... using the audiocontext.decodeaudiodata() method, or created with raw data using audiocontext.createbuffer().
...And 2 more matches

self.createImageBitmap() - Web APIs

Web › API › WindowOrWorkerGlobalScope › createImageBitmap

bal scope in both windows and workers.
... windows and workers.
...rs.
...And 2 more matches

Using the aria-invalid attribute - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the aria-invalid attribute

te that the value entered into an input field does not conform to the format expected by the application.this may include formats such as email addresses or telephone numbers.
... an input field does not conform to the format expected by the application.this may include formats such as email addresses or telephone numbers.
...te the fields immediately on blur; the application could wait until the form is submitted (though this is not necessarily recommended).
...And 2 more matches

Using the aria-label attribute - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the aria-label attribute

the aria-label attribute is used to define a string that labels the current element.
... the aria-label attribute is used to define a string that labels the current element.
... the aria-label attribute is used to define a string that labels the current element.
...And 2 more matches

ARIA: alert role - Accessibility

Web › Accessibility › ARIA › Roles › Alert Role

the alert role can be used to tell the user an element has been dynamically updated.
...ment has been dynamically updated.
...role is added.
...And 2 more matches

ARIA: Complementary role - Accessibility

Web › Accessibility › ARIA › Roles › Complementary role

the complementary landmark role is used to designate a supporting section that relates to the main content, yet can stand alone when separated.
... --> </div> this is a sidebar containing links to event sponsors.
...used by assistive technology to quickly identify and navigate to large sections of the document.
...And 2 more matches

ARIA: Mark role - Accessibility

Web › Accessibility › ARIA › Roles › Mark role

the mark landmark role semantically denotes html elements containing text that is marked/highlighted for reference purposes.
... the mark landmark role semantically denotes html elements containing text that is marked/highlighted for reference purposes.
... the mark landmark role semantically denotes html elements containing text that is marked/highlighted for reference purposes.
...And 2 more matches

ARIA: Suggestion role - Accessibility

Web › Accessibility › ARIA › Roles › Suggestion role

the suggestion landmark role semantically denotes a single proposed change to an editable document.
... the suggestion landmark role semantically denotes a single proposed change to an editable document.
...tes a single proposed change to an editable document.
...And 2 more matches

Perceivable - Accessibility

Web › Accessibility › Understanding WCAG › Perceivable

text alternative mechanisms for the argument against longdesc.
...of the button (e.g., <button>upload image</button>).
...odating their differing needs.
...And 2 more matches

-moz-image-rect - CSS: Cascading Style Sheets

Web › CSS › -moz-image-rect

this places the four segments of our image in a two-by-two box grid.
...click event when the container receives a mouse click.
...r prevstyle = window.getcomputedstyle(document.getelementbyid("box4"), null).getpropertyvalue("background-image"); // now that we've saved the last one, start rotating for (var i=1; i<=4; i++) { var curid = "box" + i; // shift the background images var curstyle = window.getcomputedstyle(document.getelementbyid(curid), null).getpropertyvalue("background-image"); document.getelementbyid(curid).style.backgroundimage = prevstyle; prevstyle = curstyle; } } this uses window.getcomputedstyle() to fetch the style of each element, shifting it to the following element.
...And 2 more matches

-moz-image-region - CSS: Cascading Style Sheets

Web › CSS › -moz-image-region

for certain xul elements and pseudo-elements that use an image from the list-style-image property, this property specifies a region of the image that is used in place of the whole image.
... for certain xul elements and pseudo-elements that use an image from the list-style-image property, this property specifies a region of the image that is used in place of the whole image.
...n any background, see -moz-image-rect().
...And 2 more matches

::marker - CSS: Cascading Style Sheets

Web › CSS › ::marker

the ::marker css pseudo-element selects the marker box of a list item, which typically contains a bullet or number.
... the ::marker css pseudo-element selects the marker box of a list item, which typically contains a bullet or number.
... the ::marker css pseudo-element selects the marker box of a list item, which typically contains a bullet or number.
...And 2 more matches

::part() - CSS: Cascading Style Sheets

Web › CSS › ::part

the ::part css pseudo-element represents any element within a shadow tree that has a matching part attribute.
... the ::part css pseudo-element represents any element within a shadow tree that has a matching part attribute.
... the ::part css pseudo-element represents any element within a shadow tree that has a matching part attribute.
...And 2 more matches

:dir() - CSS: Cascading Style Sheets

Web › CSS › :dir

the :dir() css pseudo-class matches elements based on the directionality of the text contained in them.
... the :dir() css pseudo-class matches elements based on the directionality of the text contained in them.
...dir() pseudo-class uses only the semantic value of the directionality, i.e., the one defined in the document itself.
...And 2 more matches

:empty - CSS: Cascading Style Sheets

Web › CSS › :empty

the :empty css pseudo-class represents any element that has no children.
... the :empty css pseudo-class represents any element that has no children.
... the :empty css pseudo-class represents any element that has no children.
...And 2 more matches

:focus - CSS: Cascading Style Sheets

Web › CSS › :focus

the :focus css pseudo-class represents an element (such as a form input) that has received focus.
... the :focus css pseudo-class represents an element (such as a form input) that has received focus.
... the :focus css pseudo-class represents an element (such as a form input) that has received focus.
...And 2 more matches

:fullscreen - CSS: Cascading Style Sheets

Web › CSS › :fullscreen

the :fullscreen css pseudo-class matches every element which is currently in full-screen mode.
... the :fullscreen css pseudo-class matches every element which is currently in full-screen mode.
... the :fullscreen css pseudo-class matches every element which is currently in full-screen mode.
...And 2 more matches

:is() (:matches(), :any()) - CSS: Cascading Style Sheets

Web › CSS › :is

note: :matches() was renamed to :is() in csswg issue #3258.
...ore compact form.
...ny(header, main, footer) p:hover { color: red; cursor: pointer; } :matches(header, main, footer) p:hover { color: red; cursor: pointer; } syntax :is( <complex-selector-list> )where <complex-selector-list> = <complex-selector>#where <complex-selector> = <compound-selector> [ <combinator>?
...And 2 more matches

:only-of-type - CSS: Cascading Style Sheets

Web › CSS › :only-of-type

the :only-of-type css pseudo-class represents an element that has no siblings of the same type.
... the :only-of-type css pseudo-class represents an element that has no siblings of the same type.
... the :only-of-type css pseudo-class represents an element that has no siblings of the same type.
...And 2 more matches

:where() - CSS: Cascading Style Sheets

Web › CSS › :where

the :where() css pseudo-class function takes a selector list as its argument, and selects any element that can be selected by one of the selectors in that list.
...ide content.
...e(section.where-styling, aside.where-styling, footer.where-styling) a { color: orange; } however, what if we later want to override the color of links in the footers using a simple selector?
...And 2 more matches

Detecting CSS animation support - CSS: Cascading Style Sheets

Web › CSS › CSS Animations › Detecting CSS animation support

e a similar effect.
...ue; break; } } } for starters we define a few variables.
... keyframes = '@' + keyframeprefix + 'keyframes rotate { '+ 'from {' + keyframeprefix + 'transform:rotate( 0deg ) }'+ 'to {' + keyframeprefix + 'transform:rotate( 360deg ) }'+ '}'; if( document.stylesheets && document.stylesheets.length ) { document.stylesheets[0].insertrule( keyframes, 0 ); } else { var s = document.createelement( 'style' ); s.innerhtml = keyframes; document.getelementsbytagname( 'head' )[ 0 ].appendchild( s ); } } this code looks at the value of animation; if it's false, we know we need to use our javascript fallback code to perform our animation.
...And 2 more matches

Mastering margin collapsing - CSS: Cascading Style Sheets

Web › CSS › CSS Box Model › Mastering margin collapsing

the top and bottom margins of blocks are sometimes combined (collapsed) into a single margin whose size is the largest of the individual margins (or just one of them, if they are equal), a behavior known as margin collapsing.
... ends up outside its parent (according to the rules above) whether or not the parent's margin is zero.
... parent (according to the rules above) whether or not the parent's margin is zero.
...And 2 more matches

Basic Concepts of Multicol - CSS: Cascading Style Sheets

Web › CSS › CSS Columns › Basic Concepts of Multicol

multiple-column layout, usually referred to as multicol, is a specification for laying out content into a set of column boxes much like columns in a newspaper.
... columns.
... happens in the same way that content is fragmented into pages when we work with css paged media, for example by creating a print stylesheet.
...And 2 more matches

Handling content breaks in multicol - CSS: Cascading Style Sheets

Web › CSS › CSS Columns › Handling content breaks in multicol

uld not be ideal.
... breaks inside boxes, for example inside a figure element.
...ol breaks inside boxes use the break-inside property.
...And 2 more matches

Cross-browser Flexbox mixins - CSS: Cascading Style Sheets

Web › CSS › CSS Flexible Box Layout › Mixins

guide to css3 flexbox: flexbox playground | note: mixins are not currently supported natively in browsers.
...d natively in browsers.
...lengths are invalid.
...And 2 more matches

Flow Layout and Writing Modes - CSS: Cascading Style Sheets

Web › CSS › CSS Flow Layout › Flow Layout and Writing Modes

sentences start and the end is where a line of text ends before it would begin to wrap onto a new line.
...evel box will display as if it has display: inline-block.
...ay as if it has display: inline-block.
...And 2 more matches

CSS Grid Layout and Progressive Enhancement - CSS: Cascading Style Sheets

Web › CSS › CSS Grid Layout › CSS Grid and Progressive Enhancement

ns have been rolled out in browsers in the past.
...grid containers grid items grid item display as this behavior is detailed in the specification, you are safe to rely on using these overrides in your support for older browsers.
...display when an element has a parent set to display: grid it is blockified, as defined in the css display specification.
...And 2 more matches

Stacking with floated blocks - CSS: Cascading Style Sheets

Web › CSS › CSS Positioning › Understanding z index › Stacking and float

for floated blocks, the stacking order is a bit different.
... for floated blocks, the stacking order is a bit different.
...ositioned elements, in order of appearance in the html actually, as you can see in the example below, the background and border of the non-positioned block (div #4) is completely unaffected by floating blocks, but the content is affected.
...And 2 more matches

Stacking context example 1 - CSS: Cascading Style Sheets

Web › CSS › CSS Positioning › Understanding z index › Stacking context example 1

cking context example 1 let's start with a basic example.
...ccurrence.
...hy.
...And 2 more matches

Stacking without the z-index property - CSS: Cascading Style Sheets

Web › CSS › CSS Positioning › Understanding z index › Stacking without z-index

when the z-index property is not specified on any element, elements are stacked in the following order (from bottom to top): the background and borders of the root element descendant non-positioned blocks, in order of appearance in the html descendant positioned elements, in order of appearance in the html keep in mind, when the order property alters rendering from the "order of appearance in the html" within flex containers, it similarly affects the order for stacking context.
...om to top): the background and borders of the root element descendant non-positioned blocks, in order of appearance in the html descendant positioned elements, in order of appearance in the html keep in mind, when the order property alters rendering from the "order of appearance in the html" within flex containers, it similarly affects the order for stacking context.
...ers of the root element descendant non-positioned blocks, in order of appearance in the html descendant positioned elements, in order of appearance in the html keep in mind, when the order property alters rendering from the "order of appearance in the html" within flex containers, it similarly affects the order for stacking context.
...And 2 more matches

Basic concepts of CSS Scroll Snap - CSS: Cascading Style Sheets

Web › CSS › CSS Scroll Snap › Basic concepts

an be helpful in creating a more app-like experience on mobile or even on the desktop for some types of applications.
...snap specification are scroll-snap-type and scroll-snap-align.
...se the scroll-padding property or its equivalent longhand values to set some padding.
...And 2 more matches

Layout mode - CSS: Cascading Style Sheets

Web › CSS › Layout mode

a css layout mode, sometimes simply called layout, is an algorithm that determines the position and size of boxes based on the way they interact with their sibling and ancestor boxes.
... to take them out of it.
... block layout, designed for laying out boxes such as paragraphs and inline layout, which lays out inline items such as text.
...And 2 more matches

Media queries - CSS: Cascading Style Sheets

Web › CSS › Media Queries

nt size on small devices, increase the padding between paragraphs when a page is viewed in portrait mode, or bump up the size of buttons on touchscreens.
...ncrease the padding between paragraphs when a page is viewed in portrait mode, or bump up the size of buttons on touchscreens.
...in css, use the @media at-rule to conditionally apply part of a style sheet based on the result of a media query.
...And 2 more matches

Privacy and the :visited selector - CSS: Cascading Style Sheets

Web › CSS › Privacy and the :visited selector

, but could also be used to guess a lot of information about the user's identity.
...ted links.
...ain circumstances: the window.getcomputedstyle method, and similar functions such as element.queryselector, will always return values indicating that a user has never visited any of the links on a page.
...And 2 more matches

attr() - CSS: Cascading Style Sheets

Web › CSS › attr

note: the attr() function can be used with any css property, but support for properties other than content is experimental, and support for the type-or-unit parameter is sparse.
... note: the attr() function can be used with any css property, but support for properties other than content is experimental, and support for the type-or-unit parameter is sparse.
... note: the attr() function can be used with any css property, but support for properties other than content is experimental, and support for the type-or-unit parameter is sparse.
...And 2 more matches

backface-visibility - CSS: Cascading Style Sheets

Web › CSS › backface-visibility

the backface-visibility css property sets whether the back face of an element is visible when turned towards the user.
... the backface-visibility css property sets whether the back face of an element is visible when turned towards the user.
...ned towards the user.
...And 2 more matches

border-bottom-left-radius - CSS: Cascading Style Sheets

Web › CSS › border-bottom-left-radius

the border-bottom-left-radius css property rounds the bottom-left corner of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse defining the curvature of the corner.
...ing can be a circle or an ellipse, or if one of the value is 0 no rounding is done and the corner is square.
...tage> denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse.
...And 2 more matches

border-bottom-right-radius - CSS: Cascading Style Sheets

Web › CSS › border-bottom-right-radius

the border-bottom-right-radius css property rounds the top-left corner of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse defining the curvature of the corner.
...ing can be a circle or an ellipse, or if one of the value is 0 no rounding is done and the corner is square.
...tage> denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse.
...And 2 more matches

border-top-left-radius - CSS: Cascading Style Sheets

Web › CSS › border-top-left-radius

the border-top-left-radius css property rounds the top-left corner of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse defining the curvature of the corner.
...ing can be a circle or an ellipse, or if one of the value is 0,no rounding is done and the corner is square.
...tage> denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse.
...And 2 more matches

border-top-right-radius - CSS: Cascading Style Sheets

Web › CSS › border-top-right-radius

the border-top-right-radius css property rounds the top-right corner of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse defining the curvature of the corner.
...ing can be a circle or an ellipse, or if one of the value is 0 no rounding is done and the corner is square.
...tage> denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse.
...And 2 more matches

break-after - CSS: Cascading Style Sheets

Web › CSS › break-after

ter: avoid-page; break-after: page; break-after: left; break-after: right; break-after: recto; break-after: verso; /* column break values */ break-after: avoid-column; break-after: column; /* region break values */ break-after: avoid-region; break-after: region; /* global values */ break-after: inherit; break-after: initial; break-after: unset; each possible break point (in other words, each element boundary) is affected by three properties: the break-after value of the previous element, the break-before value of the next element, and the break-inside value of the containing element.
...eak-after value of the previous element, the break-before value of the next element, and the break-inside value of the containing element.
...t in the flow is taken (i.e., the break-before value has precedence over the break-after value, which itself has precedence over the break-inside value).
...And 2 more matches

break-before - CSS: Cascading Style Sheets

Web › CSS › break-before

age; break-before: page; break-before: left; break-before: right; break-before: recto; break-before: verso; /* column break values */ break-before: avoid-column; break-before: column; /* region break values */ break-before: avoid-region; break-before: region; /* global values */ break-before: inherit; break-before: initial; break-before: unset; each possible break point (in other words, each element boundary) is affected by three properties: the break-after value of the previous element, the break-before value of the next element, and the break-inside value of the containing element.
...eak-after value of the previous element, the break-before value of the next element, and the break-inside value of the containing element.
...t in the flow is taken (i.e., the break-before value has precedence over the break-after value, which itself has precedence over the break-inside value).
...And 2 more matches

color-adjust - CSS: Cascading Style Sheets

Web › CSS › color-adjust

the color-adjust css property sets what, if anything, the user agent may do to optimize the appearance of the element on the output device.
... the color-adjust css property sets what, if anything, the user agent may do to optimize the appearance of the element on the output device.
...e output device.
...And 2 more matches

counter-set - CSS: Cascading Style Sheets

Web › CSS › counter-set

the counter-set css property sets a css counter to a given value.
...t property is specified as either one of the following: a <custom-ident> naming the counter, followed optionally by an <integer>.
...wed optionally by an <integer>.
...And 2 more matches

inherit - CSS: Cascading Style Sheets

Web › CSS › inherit

the inherit css keyword causes the element for which it is specified to take the computed value of the property from its parent element.
...nt.
...g the css shorthand all.
...And 2 more matches

list-style-type - CSS: Cascading Style Sheets

Web › CSS › list-style-type

the list-style-type css property sets the marker (such as a disc, character, or custom counter style) of a list item element.
...property sets the marker (such as a disc, character, or custom counter style) of a list item element.
... disc, character, or custom counter style) of a list item element.
...And 2 more matches

margin-bottom - CSS: Cascading Style Sheets

Web › CSS › margin-bottom

the margin-bottom css property sets the margin area on the bottom of an element.
... bottom of an element.
...property is specified as the keyword auto, or a <length>, or a <percentage>.
...And 2 more matches

margin-top - CSS: Cascading Style Sheets

Web › CSS › margin-top

the margin-top css property sets the margin area on the top of an element.
...n the top of an element.
...property is specified as the keyword auto, or a <length>, or a <percentage>.
...And 2 more matches

mask-border-repeat - CSS: Cascading Style Sheets

Web › CSS › mask-border-repeat

the mask-border-repeat css property sets how the edge regions of a source image are adjusted to fit the dimensions of an element's mask border.
...chieve the proper fit.
...image's edge regions are tiled (repeated) to fill the gap between each border.
...And 2 more matches

mask-border-width - CSS: Cascading Style Sheets

Web › CSS › mask-border-width

the mask-border-width css property sets the width of an element's mask border.
... border, specified as a multiple of the corresponding border-width.
...rresponding border-width.
...And 2 more matches

mask-composite - CSS: Cascading Style Sheets

Web › CSS › mask-composite

hile all layers below it are referred to as destination.
...s destination.
...ource is placed over the destination.
...And 2 more matches

mask-mode - CSS: Cascading Style Sheets

Web › CSS › mask-mode

that the luminance values of the mask layer image should be used as the mask values.
...r image should be used as the mask values.
...e mask values.
...And 2 more matches

offset - CSS: Cascading Style Sheets

Web › CSS › offset

the offset css shorthand property sets all the properties required for animating an element along a defined path.
...e.svg) 30deg; offset: url(circle.svg) 50px 20deg; /* including offset anchor */ offset: ray(45deg closest-side) / 40px 20px; offset: url(arc.svg) 2cm / 0.5cm 3cm; offset: url(arc.svg) 30deg / 50px 100px; formal definition initial valueas each of the properties of the shorthand:offset-position: autooffset-path: noneoffset-distance: 0offset-anchor: autooffset-rotate: autoapplies totransformable elementsinheritednopercentagesas each of the properties of the shorthand:offset-position: refertosizeofcontainingblockoffset-distance: refer to the total path lengthoffset-anchor: relativetowidthandheightcomputed valueas each of the properties of the shorthand:offset-position: for <length> the absolute value, otherwise a percentageoffset-path: as specifiedoffset-distance: for <length> the absolute value,...
...he shorthand:offset-position: a positionoffset-path: as <angle>, <basic-shape> or <path()>offset-distance: a length, percentage or calc();offset-anchor: a positionoffset-rotate: as <angle>, <basic-shape> or <path()>creates stacking contextyes formal syntax [ <'offset-position'>?
...And 2 more matches

outline-color - CSS: Cascading Style Sheets

Web › CSS › outline-color

the outline-color css property sets the color of an element's outline.
...ine-color property is specified as any one of the values listed below.
...ne of the values listed below.
...And 2 more matches

outline - CSS: Cascading Style Sheets

Web › CSS › outline

lid; /* color | style */ outline: #f66 dashed; /* style | width */ outline: inset thick; /* color | style | width */ outline: green solid 3px; /* global values */ outline: inherit; outline: initial; outline: unset; the outline property may be specified using one, two, or three of the values listed below.
...width */ outline: green solid 3px; /* global values */ outline: inherit; outline: initial; outline: unset; the outline property may be specified using one, two, or three of the values listed below.
...ee outline-color.
...And 2 more matches

Guide to scroll anchoring - CSS: Cascading Style Sheets

Web › CSS › overflow-anchor › Guide to scroll anchoring

as a user of the web, you are probably familiar with the problem that scroll anchoring solves.
...pt out of the new behavior.
...pported browser the scroll anchoring behavior will happen, and they should see fewer content jumps.
...And 2 more matches

overscroll-behavior-x - CSS: Cascading Style Sheets

Web › CSS › overscroll-behavior-x

contain; overscroll-behavior-x: none; /* global values */ overscroll-behavior-x: inherit; overscroll-behavior-x: initial; overscroll-behavior-x: unset; syntax the overscroll-behavior-x property is specified as a keyword chosen from the list of values below.
...unset; syntax the overscroll-behavior-x property is specified as a keyword chosen from the list of values below.
...rflow behavior is observed inside the element this value is set on (e.g.
...And 2 more matches

revert - CSS: Cascading Style Sheets

Web › CSS › revert

the revert css keyword reverts the cascaded value of the property from its current value to the value the property would have had if no changes had been made by the current style origin to the current element.
...o the user agent's default style.
... css specifications.
...And 2 more matches

scale - CSS: Cascading Style Sheets

Web › CSS › scale

the scale css property allows you to specify scale transforms individually and independently of the transform property.
...ou to specify scale transforms individually and independently of the transform property.
...ransform functions to specify in the transform value.
...And 2 more matches

scroll-margin-inline - CSS: Cascading Style Sheets

Web › CSS › scroll-margin-inline

the scroll-margin-inline shorthand property sets the scroll margins of an element in the inline dimension.
...iner.
... box-sizing: border-box; border: 1px solid #000; scroll-snap-type: x mandatory; } the main parts relevant to the scroll snapping are overflow-x: scroll, which makes sure the contents will scroll and not be hidden, and scroll-snap-type: x mandatory, which dictates that scroll snapping must occur along the horizontal axis, and the scrolling will always come to rest on a snap point.
...And 2 more matches

scroll-margin - CSS: Cascading Style Sheets

Web › CSS › scroll-margin

the scroll-margin shorthand property sets all of the scroll margins of an element at once, assigning values much like the margin property does for margins of an element.
...main visible.
... box-sizing: border-box; border: 1px solid #000; scroll-snap-type: x mandatory; } the main parts relevant to the scroll snapping are overflow-x: scroll, which makes sure the contents will scroll and not be hidden, and scroll-snap-type: x mandatory, which dictates that scroll snapping must occur along the horizontal axis, and the scrolling will always come to rest on a snap point.
...And 2 more matches

<shape> - CSS: Cascading Style Sheets

Web › CSS › shape

the <shape> css data type defines the specific form (shape) of a region.
...ich has been deprecated in favor of clip-path.
... <shape> data type is specified using the rect() function, which produces a region in the form of a rectangle.
...And 2 more matches

text-decoration-skip - CSS: Cascading Style Sheets

Web › CSS › text-decoration-skip

the text-decoration-skip css property sets what parts of an element’s content any text decoration affecting the element must skip over.
... the text-decoration-skip css property sets what parts of an element’s content any text decoration affecting the element must skip over.
...paces; text-decoration-skip: leading-spaces trailing-spaces; text-decoration-skip: objects edges box-decoration; /* global values */ text-decoration-skip: inherit; text-decoration-skip: initial; text-decoration-skip: unset; syntax values none nothing is skipped.
...And 2 more matches

text-underline-offset - CSS: Cascading Style Sheets

Web › CSS › text-underline-offset

the text-underline-offset css property sets the offset distance of an underline text decoration line (applied using text-decoration) from its original position.
...fied as a single value from the list below.
...mended to use em units so the offset scales with the font size.
...And 2 more matches

zoom - CSS: Cascading Style Sheets

Web › CSS › zoom

the non-standard zoom css property can be used to control the magnification level of an element.
... the non-standard zoom css property can be used to control the magnification level of an element.
....
...And 2 more matches

Challenge solutions - Developer guides

Web › Guide › CSS › Getting Started › Challenge solutions

} lists lower roman numerals challenge add a rule to your stylesheet, to number the oceans using roman numerals from i to v.
...e to your stylesheet that places the image in the top right of your document.
...image in the top right of your document.
...And 2 more matches

Mutation events - Developer guides

Web › Guide › Events › Mutation events

n event listeners.
... i.e.
...ttributenamechanged domcharacterdatamodified domelementnamechanged domnodeinserted domnodeinsertedintodocument domnoderemoved domnoderemovedfromdocument domsubtreemodified mutation observers alternatives examples domnoderemovedfromdocument var isdescendant = function (desc, root) { return !!desc && (desc === root || isdescendant(desc.parentnode, root)); }; var onremove = function (element, callback) { var observer = new mutationobserver(function (mutations) { _.foreach(mutations, function (mutation) { _.foreach(mutation.removednodes, function (removed) { if (isdescendant(element, removed)) { callback(); // allow garbage collection observer.disconnect(); observer...
...And 2 more matches

HTML attribute: min - HTML: Hypertext Markup Language

Web › HTML › Attributes › min

the min attribute defines the minimum value that is acceptable and valid for the input containing the attribute.
... the min attribute defines the minimum value that is acceptable and valid for the input containing the attribute.
...g the attribute.
...And 2 more matches

Date and time formats used in HTML - HTML: Hypertext Markup Language

Web › HTML › Date and time formats

certain html elements use date and/or time values.
... certain html elements use date and/or time values.
... certain html elements use date and/or time values.
...And 2 more matches

<strike> - HTML: Hypertext Markup Language

Web › HTML › Element › strike

obsolete since html5this feature is obsolete.
... obsolete since html5this feature is obsolete.
... obsolete since html5this feature is obsolete.
...And 2 more matches

contenteditable - HTML: Hypertext Markup Language

Web › HTML › Global attributes › contenteditable

the contenteditable global attribute is an enumerated attribute indicating if the element should be editable by the user.
...e user.
...w editing.
...And 2 more matches

contextmenu - HTML: Hypertext Markup Language

Web › HTML › Global attributes › contextmenu

the contextmenu attribute is obsolete and will be removed from all browsers the contextmenu global attribute is the id of a <menu> to use as the contextual menu for this element.
... <menuitem label="twitter" onclick="shareviatwitter()"></menuitem> <menuitem label="facebook" onclick="shareviafacebook()"></menuitem> </menu> </menu> <ol> <li> anywhere in the example you can share the page on twitter and facebook using the share menu from your context menu.
...label="change image" onclick="changeimage()"></menuitem> </menu> </li> </ol> </body> javascript function shareviatwitter() { window.open("https://twitter.com/intent/tweet?text=" + "hurray!
...And 2 more matches

x-ms-acceleratorkey - HTML: Hypertext Markup Language

Web › HTML › Global attributes › x-ms-acceleratorkey

non-standard this feature is non-standard and is not on a standards track.
... non-standard this feature is non-standard and is not on a standards track.
...ibly declares that an accelerator key has been assigned to an element: the element is activated via javascript when the key(s) are pressed on a keyboard.
...And 2 more matches

Microdata - HTML: Hypertext Markup Language

Web › HTML › Microdata

experience for users.
...pairs to assign values to its properties.
...n was made to solve transliteration problems between the cyrillic and latin alphabets.
...And 2 more matches

CSP: media-src - HTTP

Web › HTTP › Headers › Content-Security-Policy › media-src

the http content-security-policy (csp) media-src directive specifies valid sources for loading media using the <audio> and <video> elements.
...e blob and filesystem from source directives.
...milar methods for creating code from strings.
...And 2 more matches

Feature-Policy - HTTP

Web › HTTP › Headers › Feature-Policy

the http feature-policy header provides a mechanism to allow and deny the use of browser features in its own frame, and in content within any <iframe> elements in the document.
...ather information about the acceleration of the device through the accelerometer interface.
... controls whether the current document is allowed to gather information about the amount of light in the environment around the device through the ambientlightsensor interface.
...And 2 more matches

JavaScript modules - JavaScript

Web › JavaScript › Guide › Modules

no support no supportsee implementation notes.see implementation notes.user must explicitly enable this feature.user must explicitly enable this feature.
...xamples in this guide have basically the same structure; the above should start getting pretty familiar.
...s.js — contains functions related to setting up the canvas: create() — creates a canvas with a specified width and height inside a wrapper <div> with a specified id, which is itself appended inside a specified parent element.
...And 2 more matches

Text formatting - JavaScript

Web › JavaScript › Guide › Text formatting

« previousnext » this chapter introduces how to work with strings and text in javascript.
... « previousnext » this chapter introduces how to work with strings and text in javascript.
... « previousnext » this chapter introduces how to work with strings and text in javascript.
...And 2 more matches

Intl.ListFormat.prototype.formatToParts() - JavaScript

Web › JavaScript › Reference › Global Objects › Intl › ListFormat › formatToParts

array of values to be formatted according to a locale.
... contains the formatted parts from the list.
...y gives the content, as a string, of the token.
...And 2 more matches

Map.prototype.delete() - JavaScript

Web › JavaScript › Reference › Global Objects › Map › delete

the delete() method removes the specified element from a map object by key.
... the delete() method removes the specified element from a map object by key.
...specified element from a map object by key.
...And 2 more matches

Math.max() - JavaScript

Web › JavaScript › Reference › Global Objects › Math › max

as a method of an instanced math object).
... comparant because almost every other value is bigger, that's why when no arguments are given, -infinity is returned.
... array, by comparing each value: var arr = [1,2,3]; var max = arr.reduce(function(a, b) { return math.max(a, b); }); the following function uses function.prototype.apply() to get the maximum of an array.
...And 2 more matches

String.prototype.fontsize() - JavaScript

Web › JavaScript › Reference › Global Objects › String › fontsize

the fontsize() method creates a <font> html element that causes a string to be displayed in the specified font size.
... the fontsize() method creates a <font> html element that causes a string to be displayed in the specified font size.
...ml element that causes a string to be displayed in the specified font size.
...And 2 more matches

String.prototype.small() - JavaScript

Web › JavaScript › Reference › Global Objects › String › small

the small() method creates a <small> html element that causes a string to be displayed in a small font.
... the small() method creates a <small> html element that causes a string to be displayed in a small font.
...n a <small> tag: "<small>str</small>".
...And 2 more matches

TypedArray.prototype.includes() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › includes

the includes() method determines whether a typed array includes a certain element, returning true or false as appropriate.
... false as appropriate.
...ame algorithm as array.prototype.includes().
...And 2 more matches

TypedArray.prototype.reduce() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › reduce

lease clone https://github.com/mdn/interactive-examples and send us a pull request.
...est.
...eing processed in the typed array.
...And 2 more matches

TypedArray.prototype.reduceRight() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › reduceRight

rray.prototype.reduceright().
... syntax typedarray.reduceright(callback[, initialvalue]) parameters callback function to execute on each value in the typed array, taking four arguments: previousvalue the value previously returned in the last invocation of the callback, or initialvalue, if supplied (see below).
...processed in the typed array.
...And 2 more matches

TypedArray.prototype.toLocaleString() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › toLocaleString

the tolocalestring() method returns a string representing the elements of the typed array.
... the tolocalestring() method returns a string representing the elements of the typed array.
... the tolocalestring() method returns a string representing the elements of the typed array.
...And 2 more matches

WeakMap.prototype.set() - JavaScript

Web › JavaScript › Reference › Global Objects › WeakMap › set

the set() method adds a new element with a specified key and value to a weakmap object.
...et() method adds a new element with a specified key and value to a weakmap object.
... the source for this interactive example is stored in a github repository.
...And 2 more matches

Spread syntax (...) - JavaScript

Web › JavaScript › Reference › Operators › Spread syntax

spread syntax (...) allows an iterable such as an array expression or string to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected, or an object expression to be expanded in places where zero or more key-value pairs (for object literals) are expected.
...and send us a pull request.
...ion calls: myfunction(...iterableobj); for array literals or strings: [...iterableobj, '4', 'five', 6]; for object literals (new in ecmascript 2018): let objclone = { ...obj }; rest syntax (parameters) rest syntax looks exactly like spread syntax.
...And 2 more matches

<maction> - MathML

Web › MathML › Element › maction

the mathml <maction> element provides a possibility to bind actions to (sub-) expressions.
... the mathml <maction> element provides a possibility to bind actions to (sub-) expressions.
... the mathml <maction> element provides a possibility to bind actions to (sub-) expressions.
...And 2 more matches

Web audio codec guide - Web media technologies

Web › Media › Formats › Audio codecs

latency 5 ms to 66.5 ms browser compatibility feature chrome edge firefox internet explorer opera safari opus support 33 14 15 no 20 11[2] this information refers to support for opus in html <audio> and <video> elements, and not to webrtc.
...quirements [1] the specified sample rates are effective sample rates.
...dth latency at least 100 ms browser compatibility feature chrome edge firefox internet explorer opera safari vorbis support 4 17 3.5 no 11.5 no this information refers to support for vorbis in html <audio> and <video> elements, and not to webrtc.
...And 2 more matches

OpenSearch description format

Web › OpenSearch

site describe a search engine for itself, so that a browser or other client application can use that search engine.
...ng search suggestions in search plugins.
...insert the search terms entered by the user in the search bar.
...And 2 more matches

baseline-shift - SVG: Scalable Vector Graphics

Web › SVG › Attribute › baseline-shift

the baseline-shift attribute allows repositioning of the dominant-baseline relative to the dominant-baseline of the parent text content element.
...s repositioning of the dominant-baseline relative to the dominant-baseline of the parent text content element.
...the dominant-baseline of the parent text content element.
...And 2 more matches

class - SVG: Scalable Vector Graphics

Web › SVG › Attribute › class

« svg attribute reference home assigns a class name or set of class names to an element.
... « svg attribute reference home assigns a class name or set of class names to an element.
... « svg attribute reference home assigns a class name or set of class names to an element.
...And 2 more matches

clip-rule - SVG: Scalable Vector Graphics

Web › SVG › Attribute › clip-rule

« svg attribute reference home the clip-rule attribute only applies to graphics elements that are contained within a <clippath> element.
...g attribute reference home the clip-rule attribute only applies to graphics elements that are contained within a <clippath> element.
...ied to the clipping path because clip-rule is specified on the <path> element that defines the clipping shape: <g> <clippath id="myclip"> <path d="..." clip-rule="evenodd" /> </clippath> <rect clip-path="url(#myclip)" ...
...And 2 more matches

color-interpolation - SVG: Scalable Vector Graphics

Web › SVG › Attribute › color-interpolation

imations, and alpha compositing.
... linear interpolation is used.
... the color-interpolation on the parent.
...And 2 more matches

data-* - SVG: Scalable Vector Graphics

Web › SVG › Attribute › data-*

the data-* svg attributes are called custom data attributes.
... the data-* svg attributes are called custom data attributes.
... the data-* svg attributes are called custom data attributes.
...And 2 more matches

direction - SVG: Scalable Vector Graphics

Web › SVG › Attribute › direction

the direction attribute specifies the inline-base direction of a <text> or <tspan> element.
...atin or arabic characters rotated 90 degrees clockwise relative to a top-to-bottom inline-base direction.
...lative to a top-to-bottom inline-base direction.
...And 2 more matches

height - SVG: Scalable Vector Graphics

Web › SVG › Attribute › height

the height attribute defines the vertical length of an element in the user coordinate system.
... the height attribute defines the vertical length of an element in the user coordinate system.
...> default value auto (treated as 0) animatable yes note: starting with svg2, height is a geometry property meaning this attribute can also be used as a css property for rectangles.
...And 2 more matches

marker-end - SVG: Scalable Vector Graphics

Web › SVG › Attribute › marker-end

the marker-end attribute defines the arrowhead or polymarker that will be drawn at the final vertex of the given shape.
... the marker-end attribute defines the arrowhead or polymarker that will be drawn at the final vertex of the given shape.
...of marker-start and marker-end are both not none, then two markers will be rendered on that final vertex.
...And 2 more matches

marker-start - SVG: Scalable Vector Graphics

Web › SVG › Attribute › marker-start

the marker-start attribute defines the arrowhead or polymarker that will be drawn at the first vertex of the given shape.
... the marker-start attribute defines the arrowhead or polymarker that will be drawn at the first vertex of the given shape.
...arker-start and marker-end are both not none, then two markers will be rendered on that final vertex.
...And 2 more matches

refX - SVG: Scalable Vector Graphics

Web › SVG › Attribute › refX

the refx attribute defines the x coordinate of an element’s reference point.
... the refx attribute defines the x coordinate of an element’s reference point.
...ced at the left edge of the shape.
...And 2 more matches

refY - SVG: Scalable Vector Graphics

Web › SVG › Attribute › refY

the refy attribute defines the y coordinate of an element’s reference point.
... the refy attribute defines the y coordinate of an element’s reference point.
...aced at the top edge of the shape.
...And 2 more matches

width - SVG: Scalable Vector Graphics

Web › SVG › Attribute › width

the width attribute defines the horizontal length of an element in the user coordinate system.
... the width attribute defines the horizontal length of an element in the user coordinate system.
...age> default value auto (treated as 0) animatable yes note: starting with svg2, width is a geometry property meaning this attribute can also be used as a css property for rectangles.
...And 2 more matches

x - SVG: Scalable Vector Graphics

Web › SVG › Attribute › x

the x attribute defines a x-axis coordinate in the user coordinate system.
... animatable yes feoffset for <feoffset>, x defines the minimum x coordinate for the rendering area of the primitive.
... yes fespecularlighting for <fespecularlighting>, x defines the minimum x coordinate for the rendering area of the primitive.
...And 2 more matches

xml:lang - SVG: Scalable Vector Graphics

Web › SVG › Attribute › xml:lang

the xml:lang attribute specifies the primary language used in contents and attributes containing text content of particular elements.
... the xml:lang attribute specifies the primary language used in contents and attributes containing text content of particular elements.
...ml:lang attribute specifies the primary language used in contents and attributes containing text content of particular elements.
...And 2 more matches

y - SVG: Scalable Vector Graphics

Web › SVG › Attribute › y

the y attribute defines a y-axis coordinate in the user coordinate system.
... animatable yes feoffset for <feoffset>, y defines the minimum y coordinate for the rendering area of the primitive.
... yes fespecularlighting for <fespecularlighting>, y defines the minimum y coordinate for the rendering area of the primitive.
...And 2 more matches

<altGlyphItem> - SVG: Scalable Vector Graphics

Web › SVG › Element › altGlyphItem

the <altglyphitem> element provides a set of candidates for glyph substitution by the <altglyph> element.
... the <altglyphitem> element provides a set of candidates for glyph substitution by the <altglyph> element.
... the <altglyphitem> element provides a set of candidates for glyph substitution by the <altglyph> element.
...And 2 more matches

<animateMotion> - SVG: Scalable Vector Graphics

Web › SVG › Element › animateMotion

the svg <animatemotion> element let define how an element moves along a motion path.
... the svg <animatemotion> element let define how an element moves along a motion path.
... the svg <animatemotion> element let define how an element moves along a motion path.
...And 2 more matches

<animateTransform> - SVG: Scalable Vector Graphics

Web › SVG › Element › animateTransform

the animatetransform element animates a transformation attribute on its target element, thereby allowing animations to control translation, scaling, rotation, and/or skewing.
... the animatetransform element animates a transformation attribute on its target element, thereby allowing animations to control translation, scaling, rotation, and/or skewing.
... the animatetransform element animates a transformation attribute on its target element, thereby allowing animations to control translation, scaling, rotation, and/or skewing.
...And 2 more matches

<color-profile> - SVG: Scalable Vector Graphics

Web › SVG › Element › color-profile

the <color-profile> element allows describing the color profile used for the image.
... the <color-profile> element allows describing the color profile used for the image.
... the <color-profile> element allows describing the color profile used for the image.
...And 2 more matches

<feColorMatrix> - SVG: Scalable Vector Graphics

Web › SVG › Element › feColorMatrix

the <fecolormatrix> svg filter element changes colors based on a transformation matrix.
... r5 a positive real number x, boosting the redness on every pixel of the new image by x.
...n every pixel of the new image by x.
...And 2 more matches

<feComponentTransfer> - SVG: Scalable Vector Graphics

Web › SVG › Element › feComponentTransfer

emapping of data for each pixel.
...s like brightness adjustment, contrast adjustment, color balance or thresholding.
...at the children <fefuncr>, <fefuncb>, <fefuncg>, and <fefunca> return.
...And 2 more matches

<feSpecularLighting> - SVG: Scalable Vector Graphics

Web › SVG › Element › feSpecularLighting

direction.
...age which contains the specular reflection part of the lighting calculation.
...art of the lighting calculation.
...And 2 more matches

<font-face-src> - SVG: Scalable Vector Graphics

Web › SVG › Element › font-face-src

the <font-face-src> svg element corresponds to the src descriptor in css @font-face rules.
... the <font-face-src> svg element corresponds to the src descriptor in css @font-face rules.
... the <font-face-src> svg element corresponds to the src descriptor in css @font-face rules.
...And 2 more matches

<font-face-uri> - SVG: Scalable Vector Graphics

Web › SVG › Element › font-face-uri

the <font-face-uri> svg element points to a remote definition of the current font.
... the <font-face-uri> svg element points to a remote definition of the current font.
... the <font-face-uri> svg element points to a remote definition of the current font.
...And 2 more matches

<font-face> - SVG: Scalable Vector Graphics

Web › SVG › Element › font-face

the <font-face> svg element corresponds to the css @font-face rule.
... the <font-face> svg element corresponds to the css @font-face rule.
... the <font-face> svg element corresponds to the css @font-face rule.
...And 2 more matches

<font> - SVG: Scalable Vector Graphics

Web › SVG › Element › font

the <font> svg element defines a font to be used for text layout.
... the <font> svg element defines a font to be used for text layout.
... the <font> svg element defines a font to be used for text layout.
...And 2 more matches

<pattern> - SVG: Scalable Vector Graphics

Web › SVG › Element › pattern

the <pattern> element defines a graphics object which can be redrawn at repeated x- and y-coordinate intervals ("tiled") to cover an area.
... the <pattern> element defines a graphics object which can be redrawn at repeated x- and y-coordinate intervals ("tiled") to cover an area.
... the <pattern> element defines a graphics object which can be redrawn at repeated x- and y-coordinate intervals ("tiled") to cover an area.
...And 2 more matches

Gradients in SVG - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › Gradients

« previousnext » perhaps more exciting than just fills and strokes is the fact that you can also create and apply gradients as either fills or strokes.
...-color: red; } .stop2 { stop-color: black; stop-opacity: 0; } .stop3 { stop-color: blue; } ]]></style> </defs> <rect id="rect1" x="10" y="10" rx="15" ry="15" width="100" height="100"/> <rect x="10" y="120" rx="15" ry="15" width="100" height="100" fill="url(#gradient2)"/> </svg> screenshotlive sample above is an example of a linear gradient being applied to a <rect> element.
... is assigned furthest down the xml tree.
...And 2 more matches

Subresource Integrity - Web security

Web › Security › Subresource Integrity

ird-party having injected any additional content into those files — and without any other changes of any kind at all having been made to those files.
... origin; for example: access-control-allow-origin: * examples in the following examples, assume that oqvuafxrkap7fdgccy5uykm6+r9gqq8k/uxy9rx7hnqlgyl1kpzqho1wx4jwy8wc is already known to be the expected sha-384 hash (digest) of a particular script example-framework.js, and there’s a copy of the script hosted at https://example.com/example-framework.js.
...origin: * examples in the following examples, assume that oqvuafxrkap7fdgccy5uykm6+r9gqq8k/uxy9rx7hnqlgyl1kpzqho1wx4jwy8wc is already known to be the expected sha-384 hash (digest) of a particular script example-framework.js, and there’s a copy of the script hosted at https://example.com/example-framework.js.
...And 2 more matches

Tutorials

Web › Tutorials

you to the practicalities of web development.
...et up the tools you need to construct a simple webpage and publish your own simple code.
...ve reference for html elements, and how the different browsers support them.
...And 2 more matches

<xsl:param> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › param

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:param> element establishes a parameter by name and, optionally, a default value for that parameter.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:param> element establishes a parameter by name and, optionally, a default value for that parameter.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:param> element establishes a parameter by name and, optionally, a default value for that parameter.
...And 2 more matches

<xsl:strip-space> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › strip-space

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:strip-space> element defines the elements in the source document for which whitespace should be removed.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:strip-space> element defines the elements in the source document for which whitespace should be removed.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:strip-space> element defines the elements in the source document for which whitespace should be removed.
...And 2 more matches

<xsl:template> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › template

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:template> element defines an output producing template.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:template> element defines an output producing template.
... xpath functions, xpath axes the <xsl:template> element defines an output producing template.
...And 2 more matches

Using the Mozilla JavaScript interface to XSL Transformations - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Using the Mozilla JavaScript interface to XSL Transformations

nt.load is asynchronous, so all processing happens in the // onload handler testtransform.addeventlistener("load", onload, false); testtransform.load("test-transform.xml"); function onload() { processor.importstylesheet(testtransform); } xsltprocessor.importstylesheet() requires one argument, a dom node.
... testtransform.addeventlistener("load", onload, false); testtransform.load("test-transform.xml"); function onload() { processor.importstylesheet(testtransform); } xsltprocessor.importstylesheet() requires one argument, a dom node.
...t.
...And 2 more matches

Communicating With Other Scripts - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Guides › Content Scripts › Communicating With Other Scripts

cludes a button and a page script: <html> <head> <meta charset="utf-8"> </head> <body> <input id="message" type="button" value="send a message"/> <script type="text/javascript" src="page-script.js"></script> </body> </html> the content script "content-script.js" adds an event listener to the button, that sends a custom event containing a message: var messenger = document.getelementbyid("message"); messenger.addeventlistener("click", sendcustomevent, false); function sendcustomevent() { var greeting = {"greeting" : "hello world"}; var event = document.createevent('customevent'); event.initcustomevent("addon-message", true, true, greeting); document.documentelement.dispatchevent(event); } finally, the page script "page-script.js" listens for the message and logs the...
... }, false); after firefox 30: clone the message object this technique depends on being able to share the message payload between the content script scope and the page script scope.
...neinto() function: var messenger = document.getelementbyid("message"); messenger.addeventlistener("click", sendcustomevent, false); function sendcustomevent() { var greeting = {"greeting" : "hello world"}; var cloned = cloneinto(greeting, document.defaultview); var event = document.createevent('customevent'); event.initcustomevent("addon-message", true, true, cloned); document.documentelement.dispatchevent(event); } messaging from page script to content script sending messages using custom dom events from the page script to the content script is just the same, but in reverse.
...js") }); the web page "talk.html" creates and dispatches a custom dom event, using initcustomevent()'s detail parameter to supply the payload: <!doctype html> <html> <head></head> <body> <script> function sendmessage() { var event = document.createevent('customevent'); event.initcustomevent("addon-message", true, true, { hello: 'world' }); document.documentelement.dispatchevent(event); } </script> <button onclick="sendmessage()">send message</button> </body> </html> finally, the content script "listen.js" listens for the new event and retrieves the payload from its detail attribute: window.addeventlistener("addon-message", function(event) { console.log(json.stringify(event.detail)); }, false); ...

XUL Migration Guide - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Guides › XUL Migration Guide

s modules that implement some basic user interface components including buttons, dialogs, and context menu items.
...e as new versions of firefox are released, we call them the "supported" apis.
...tton api, which is only available from firefox 29 onwards.
...window/utils module gives you direct access to chrome windows, including the browser's chrome window.

addon-page - Archive of obsolete content

Archive › Add-ons › Add-on SDK › High-Level APIs › addon-page

create a page that does not contain navigational elements.
... create a page that does not contain navigational elements.
... in a browser tab.
...nec.

frame/utils - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs › frame utils

experimental provides helper functions for working with platform internals like frames and browsers.
... experimental provides helper functions for working with platform internals like frames and browsers.
...rame even further.
...for this frame, and all the following options are ignored.

Annotator - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Tutorials › Annotator

ith firefox.
...ion button or toggle button apis, and for a more complex widget try the toolbar or sidebar apis.
...oggle button apis, and for a more complex widget try the toolbar or sidebar apis.
...apis.

Bootstrapped extensions - Archive of obsolete content

Archive › Add-ons › Bootstrapped extensions

dbootstrappedmanifestlocation() and nsicomponentmanager.removebootstrappedmanifestlocation().
...nentmanager.removebootstrappedmanifestlocation().
... manually if you decide to go ahead and try to develop a bootstrapped extension that modifies the application's user interface, here are a few suggestions to get you started.
...pplication ui elements by their id by calling document.getelementbyid(), then manipulate them to inject your ui.

Downloading Files - Archive of obsolete content

Archive › Add-ons › Code snippets › Downloading Files

svc.get("desk", ci.nsifile); targetfile.append("file.bin"); var obj_uri = services.io.newuri(aurltodownload, null, null); // obtain the privacy context of the browser window that the url // we are downloading comes from.
...file); targetfile.append("file.bin"); var obj_uri = services.io.newuri(aurltodownload, null, null); // obtain the privacy context of the browser window that the url // we are downloading comes from.
...nd("file.bin"); var obj_uri = services.io.newuri(aurltodownload, null, null); // obtain the privacy context of the browser window that the url // we are downloading comes from.
...r privacy = privatebrowsingutils.privacycontextfromwindow(aurlsourcewindow); var progresselement = document.getelementbyid("progress_element"); persist.progresslistener = { onprogresschange: function(awebprogress, arequest, acurselfprogress, amaxselfprogress, acurtotalprogress, amaxtotalprogress) { var percentcomplete = math.round((acurtotalprogress / amaxtotalprogress) * 100); progresselement.textcontent = percentcomplete +"%"; }, onstatechange: function(awebprogress, arequest, astateflags, astatus) { // do something } } persist.saveuri(obj_uri, null, null, null, "", targetfile, privacy); downloading files that require credentials before calling nsiwebbrowserpersist.saveuri(), you need to set the progresslistener property of the nsiwebbrowserpersist instance to an object ...

Label and description - Archive of obsolete content

Archive › Add-ons › Code snippets › Label and description

line breaking under normal conditions, a description will not break long-running text and the text may be cropped or hidden.
... line breaking under normal conditions, a description will not break long-running text and the text may be cropped or hidden.
...itionally permitted to wrap at spaces.
...-wrap instead of -pre-wrap.

LookupPrefix - Archive of obsolete content

Archive › Add-ons › Code snippets › LookupPrefix

tml#lookupnamespaceprefixalgo // (the above had a few apparent 'bugs' in the pseudo-code which were corrected here) if (node.lookupprefix && htmlmode !== 'text/html') { // shouldn't use this in text/html for mozilla as will return null return node.lookupprefix(namespaceuri); } if (namespaceuri === null || namespaceuri === '') { return null; } switch (node.nodetype) { case 1: // node.element_node return _lookupnamespaceprefix(namespaceuri, node); case 9: // node.document_node return _lookupnamespaceprefix(namespaceuri, node.documentelement); case 6: // node.entity_node case 12: // node.notation_node case 11: // node.document_fragment_node case 10: // node.document_type_node return null; // type is unknown case 2: // node.attribute_node if (node.ownerelement) ...
... case 9: // node.document_node return _lookupnamespaceprefix(namespaceuri, node.documentelement); case 6: // node.entity_node case 12: // node.notation_node case 11: // node.document_fragment_node case 10: // node.document_type_node return null; // type is unknown case 2: // node.attribute_node if (node.ownerelement) { return _lookupnamespaceprefix(namespaceuri, node.ownerelement); } return null; default: if (node.parentnode) { // entityreferences may have to be skipped to get to it return _lookupnamespaceprefix(namespaceuri, node.parentnode); } return null; } } // private function for lookupprefix only function _lookupnamespaceprefix (namespaceuri, originalelement) { var xmlnspattern = /^xmlns:(.*)$/; if (originalelement.namespaceuri && orig...
... } return null; default: if (node.parentnode) { // entityreferences may have to be skipped to get to it return _lookupnamespaceprefix(namespaceuri, node.parentnode); } return null; } } // private function for lookupprefix only function _lookupnamespaceprefix (namespaceuri, originalelement) { var xmlnspattern = /^xmlns:(.*)$/; if (originalelement.namespaceuri && originalelement.namespaceuri === namespaceuri && originalelement.prefix && originalelement.lookupnamespaceuri(originalelement.prefix) === namespaceuri) { return originalelement.prefix; } if (originalelement.attributes && originalelement.attributes.length) { for (var i=0; i < originalelement.attributes.length; i++) { var att = originalelement.attributes[i]; xmlnspattern.lastindex = 0; var localn...
...pattern.lastindex = 0; var localname = att.localname || att.name.substr(att.name.indexof(':')+1); // latter test for ie which doesn't support localname if (localname.indexof(':') !== -1) { // for firefox when in html mode localname = localname.substr(att.name.indexof(':')+1); } if ( xmlnspattern.test(att.name) && att.value === namespaceuri && lookupnamespaceuri(originalelement, localname) === namespaceuri ) { return localname; } } } if (originalelement.parentnode) { // entityreferences may have to be skipped to get to it return _lookupnamespaceprefix(namespaceuri, originalelement.parentnode); } return null; } ...

QuerySelector - Archive of obsolete content

Archive › Add-ons › Code snippets › QuerySelector

queryselector, or following the jquery style of chaining by returning 'this' within each prototype method of $()): htmldocument.prototype.$ = function (selector) { // only for html return this.queryselector(selector); }; example: <h1>test!</h1> <script> htmldocument.prototype.$ = function (selector) { return this.queryselector(selector); }; alert(document.$('h1')); // [object htmlheadingelement] </script> xuldocument.prototype.$ = function (selector) { // only for xul return this.queryselector(selector); }; example: <label value="test!"/> <script type="text/javascript"><![cdata[ xuldocument.prototype.$ = function (selector) { // only for xul return this.queryselector(selector); }; alert(document.$('label')); // [object xulelement] ]]></script> document.prototype.$ = functio...
...function (selector) { // only for xul return this.queryselector(selector); }; alert(document.$('label')); // [object xulelement] ]]></script> document.prototype.$ = function (selector) { // only for plain xml return this.queryselector(selector); }; var foo = document.implementation.createdocument('somens', 'foo', null); // create an xml document <foo xmlns="somens"/> var bar = foo.createelementns('somens', 'bar'); // add <bar xmlns="somens"/> foo.documentelement.appendchild(bar); alert(foo.$('bar').nodename); // gives 'bar' element.prototype.$ = function (selector) { // works for html, xul, and plain xml return this.queryselector(selector); }; html example: <h1><a>test!<a/></h1> <script> element.prototype.$ = function (selector) { return this.queryselector(selector); }; alert(...
... 'bar'); // add <bar xmlns="somens"/> foo.documentelement.appendchild(bar); alert(foo.$('bar').nodename); // gives 'bar' element.prototype.$ = function (selector) { // works for html, xul, and plain xml return this.queryselector(selector); }; html example: <h1><a>test!<a/></h1> <script> element.prototype.$ = function (selector) { return this.queryselector(selector); }; alert(document.getelementsbytagname('h1')[0].$('a').nodename); // 'a' xul example: <hbox><vbox/></hbox> <script type="text/javascript"><![cdata[ element.prototype.$ = function (selector) { return this.queryselector(selector); }; var xulns = 'http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul'; alert(document.getelementsbytagnamens(xulns, 'hbox')[0].$('vbox').nodename); // vbox ]]></script> xml example: <f...
.../hbox> <script type="text/javascript"><![cdata[ element.prototype.$ = function (selector) { return this.queryselector(selector); }; var xulns = 'http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul'; alert(document.getelementsbytagnamens(xulns, 'hbox')[0].$('vbox').nodename); // vbox ]]></script> xml example: <foo xmlns="somens"><bar/></foo> in document earlier var foo = document.getelementsbytagnamens('somens', 'foo')[0]; alert(foo.$('bar')); note that for plain xml, the # 'id' selector will not work with an 'id' attribute (since a such-named attribute need not necessarily be of type id in xml, though it is in html and xul), nor will it work with xml:id.

JavaScript Daemons Management - Archive of obsolete content

Archive › Add-ons › Code snippets › Timers › Daemons

lem.style.top = math.sin(oletter.pos) * ndist + "px"; oletter.elem.style.left = math.cos(oletter.pos) * ndist * 5 + "px"; } } function prepare () { // build letters list // http://tyleregeto.com/text-animation-in-javascript this.textcontent = ""; aletters.length = 0; for (var ospan, oletter, nletter = 0, nlen = stext.length; nletter < nlen; nletter++) { ospan = document.createelement("span"); ospan.textcontent = stext[nletter]; oletter = { "elem": ospan, "parent": this }; aletters.push(oletter); oletter.pos = math.random() * 50; oletter.elem.style.position = "relative"; this.appendchild(ospan); } } var nmaxdist = 25, aletters = [], stext = "do you feel lucky, punk?", orecompose = new daemon(document.createelement("p"), perform, 33, 30, prepare);...
... "perform": function () { [custom code] }, // required |*| }, 200, 30); |*| \*/ var stext = "do you feel lucky, punk?", ounhide = daemon.buildaround({ // http://tyleregeto.com/text-animation-in-javascript "letters": [], "numletters": 0, "clock": 0, "interval": 0.0, "delta": 33, "letters": [], "pool": ["0","1","2","3","4","5","6","7","8","9"], "target": document.createelement("p"), "create": function () { // build letters list this.target.textcontent = ""; this.letters.length = 0; for (var ospan, oletter, nletter = 0, nlen = stext.length; nletter < nlen; nletter++) { ospan = document.createelement("span"); ospan.textcontent = stext[nletter]; oletter = { "elem": ospan, "parent": this.target }; this.letters.push(oletter); ...
...lem.style.top = math.sin(oletter.pos) * ndist + "px"; oletter.elem.style.left = math.cos(oletter.pos) * ndist * 5 + "px"; } } function prepare () { // build letters list // http://tyleregeto.com/text-animation-in-javascript this.textcontent = ""; aletters.length = 0; for (var ospan, oletter, nletter = 0, nlen = stext.length; nletter < nlen; nletter++) { ospan = document.createelement("span"); ospan.textcontent = stext[nletter]; oletter = { "elem": ospan, "parent": this }; aletters.push(oletter); oletter.pos = math.random() * 50; oletter.elem.style.position = "relative"; this.appendchild(ospan); } } var nmaxdist = 25, aletters = [], stext = "do you feel lucky, punk?", orecompose = new daemon.safe(document.createelement("p"), perform, 33, 30, prep...
...erform": function () { [custom code] }, // required |*| }, 200, 30); |*| \*/ var stext = "do you feel lucky, punk?", ounhide = daemon.safe.buildaround({ // http://tyleregeto.com/text-animation-in-javascript "letters": [], "numletters": 0, "clock": 0, "interval": 0.0, "delta": 33, "letters": [], "pool": ["0","1","2","3","4","5","6","7","8","9"], "target": document.createelement("p"), "create": function () { // build letters list this.target.textcontent = ""; this.letters.length = 0; for (var ospan, oletter, nletter = 0, nlen = stext.length; nletter < nlen; nletter++) { ospan = document.createelement("span"); ospan.textcontent = stext[nletter]; oletter = { "elem": ospan, "parent": this.target }; this.letters.push(oletter); ...

Tree - Archive of obsolete content

Archive › Add-ons › Code snippets › Tree

ew = tree.treeboxobject.view; for (var i = 0; i < treeview.rowcount; i++) { if (treeview.iscontainer(i) && treeview.iscontaineropen(i)) treeview.toggleopenstate(i); } getting the text from the selected row assuming the given <tree>: <tree id="my-tree" seltype="single" onselect="ontreeselected()"> use the following javascript: function ontreeselected(){ var tree = document.getelementbyid("my-tree"); var cellindex = 0; var celltext = tree.view.getcelltext(tree.currentindex, tree.columns.getcolumnat(cellindex)); alert(celltext); } getting the tree item from the focused row assuming <tree id="my-tree">, you can use the following to get the tree item: var view = document.getelementbyid("my-tree").view; var sel = view.selection.currentindex; //returns -1 if the tree ...
... the tree is not focused var treeitem = view.getitematindex(sel); note that the current index may be unselected (for example, a multi-select tree).
...ng similar.
...you can add the event handler to the <tree> element.

getAttributeNS - Archive of obsolete content

Archive › Add-ons › Code snippets › getAttributeNS

as some browsers do not support getattributens, the following might be used to work on them as well.
... as some browsers do not support getattributens, the following might be used to work on them as well.
... && attrs2[i].nodevalue === ns ) { // e.g., 'xmlns:xlink' and 'http://www.w3.org/1999/xlink' return attrs[j].nodevalue; } } thisitem = thisitem.parentnode; } } } return ''; // if not found (some implementations return 'null' but this is not standard) } alert(getattributenswrapper (someelement, 'http://www.w3.org/1999/xlink', 'href')); // gets xlink:href, xl:href, etc.
...w3.org/1999/xlink' return attrs[j].nodevalue; } } thisitem = thisitem.parentnode; } } } return ''; // if not found (some implementations return 'null' but this is not standard) } alert(getattributenswrapper (someelement, 'http://www.w3.org/1999/xlink', 'href')); // gets xlink:href, xl:href, etc.

Extension Etiquette - Archive of obsolete content

Archive › Add-ons › Extension etiquette

ing multiple menu items, and a tools menu item should not be created for options and preferences (for options and preferences, see the add-on manager).
...enu items.
... itself.
... into their own globals, such as commonjs modules, javascript modules, or sandboxes, to avoid most global variable and prototype conflicts.

Listening to events in Firefox extensions - Archive of obsolete content

Archive › Add-ons › Listening to events in Firefox extensions

them.
...er("event", callback, false) where b is the browser or tabbrowser you wish to watch for events from.
...he cached page, the pagehide event from each frame fires before the pagehide event in the main document.
...of these progress events from web pages.

JavaScript Object Management - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › JavaScript Object Management

ivide it into multiple objects and files.
...he window has loaded completely, but before it's displayed to the user.
...ndow being loaded, or opening new windows, alerts or dialogs.
... changes you need to make to the build system in order to include the files in the modules folder.

Creating reusable content with CSS and XBL - Archive of obsolete content

Archive › Beginner tutorials › Using XBL from stylesheets

xbl bindings the structure provided by markup languages and css is not ideal for complex applications where parts need to be self-contained and reusable.
...o be self-contained and reusable.
...st link those files from the document as a whole.
...gatekeeper/there.is.only.xul" xmlns:html="http://www.w3.org/1999/xhtml"> <binding id="square"> <resources> <stylesheet src="bind6.css"/> </resources> <content> <html:div anonid="square"/> <xul:button anonid="button" type="button"> <children/> </xul:button> </content> <implementation> <field name="square"><![cdata[ document.getanonymouselementbyattribute(this, "anonid", "square") ]]></field> <field name="button"><![cdata[ document.getanonymouselementbyattribute(this, "anonid", "button") ]]></field> <method name="dodemo"> <body><![cdata[ this.square.style.backgroundcolor = "#cf4" this.square.style.marginleft = "20em" this.button.setattribute("disabled", "true") settimeout...

Case Sensitivity in class and id Names - Archive of obsolete content

Archive › Case Sensitivity in class and id Names

summary: although css is itself case-insensitive, class and id names are defined to be case-sensitive in html 4.01.
...sitivity as a way of creating distinct identifiers, unless they are designing solely for a truly standards-compliant browser such as netscape 6.
...cape 6.
...ensitive?

Creating a dynamic status bar extension - Archive of obsolete content

Archive › Creating a dynamic status bar extension

freshinformation() so that its variable scope includes the variables used by that function.
...' samplepanel.label = 'goog: ' + fieldarray[1]; samplepanel.tooltiptext = 'chg: ' + fieldarray[4] + ' | ' + 'open: ' + fieldarray[5] + ' | ' + 'low: ' + fieldarray[6] + ' | ' + 'high: ' + fieldarray[7] + ' | ' + 'vol: ' + fieldarray[8]; } } the first thing we do here is get the status bar panel into the variable samplepanel by calling the document.getelementbyid() dom function.
...ult returned by the web server into the variable output from the xmlhttprequest.responsetext property.
...'t need since we know which stock we're looking at.

Visualizing an audio spectrum - Archive of obsolete content

Archive › Misc top level › Visualizing Audio Spectrum

this example calculates and displays fast fourier transform (fft) spectrum data for the playing audio.
...dio element in global variables; the function for the mozaudioavailable event does an fft of the samples and displays them in a canvas.
...sis on an audio stream, rather than the code shown below.
... before drawing spectrum ctx.clearrect(0,0, canvas.width, canvas.height); for (var i = 0; i < fft.spectrum.length; i++ ) { // multiply spectrum by a zoom value magnitude = fft.spectrum[i] * 4000; // draw rectangle bars for each frequency bin ctx.fillrect(i * 4, canvas.height, 3, -magnitude); } } var audio = document.getelementbyid('audio-element'); audio.addeventlistener('mozaudioavailable', audioavailable, false); audio.addeventlistener('loadedmetadata', loadedmetadata, false); // fft from dsp.js, see below var fft = function(buffersize, samplerate) { this.buffersize = buffersize; this.samplerate = samplerate; this.spectrum = new float32array(buffersize/2); ...

Supporting per-window private browsing - Archive of obsolete content

Archive › Mozilla › Supporting per-window private browsing

be added to the permanent download history).
... to do this, import resource://gre/modules/privatebrowsingutils.jsm and use privatebrowsingutils.getprivacycontextfromwindow(win), passing a window object that is related to the content in question.
...se privatebrowsingutils.getprivacycontextfromwindow(win), passing a window object that is related to the content in question.
...ample, if an add-on adds a context menu item that accesses an api that requires an nsiloadcontext, the most relevant window is the one that owns the element being targeted by the context menu (element.ownerdocument.defaultview).

Properties - Archive of obsolete content

Archive › Mozilla › XPInstall › Reference › InstallVersion Object › Properties

properties major most siginificant element of the installversion object.
... properties major most siginificant element of the installversion object.
... properties major most siginificant element of the installversion object.
... properties major most siginificant element of the installversion object.

browser.type - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › browser.type

ce home type type: one of the values below.
....
...attribute must be set before the element is inserted into the document.
...ccess the chrome above it.

dir - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › dir

« xul reference home dir type: one of the values below the direction in which the child elements of the element are placed.
... « xul reference home dir type: one of the values below the direction in which the child elements of the element are placed.
... « xul reference home dir type: one of the values below the direction in which the child elements of the element are placed.
...or scales, the scale's values are ordered from left to right (for horizontal scales) or from top to bottom (for vertical scales) for other elements, the elements are placed left to right or top to bottom in the order they appear in the xul code.

pack - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › pack

« xul reference home pack type: one of the values below the pack attribute specifies where child elements of the box are placed when the box is larger that the size of the children.
...the size of the children.
...ed to specify the position in the opposite direction.
...f pack using the style property -moz-box-pack.

preference-editable - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › preference-editable

« xul reference home preference-editable mozilla 1.8 type: boolean if true, the element may be used as one that modifies a preference in a prefwindow.
... « xul reference home preference-editable mozilla 1.8 type: boolean if true, the element may be used as one that modifies a preference in a prefwindow.
... « xul reference home preference-editable mozilla 1.8 type: boolean if true, the element may be used as one that modifies a preference in a prefwindow.
... « xul reference home preference-editable mozilla 1.8 type: boolean if true, the element may be used as one that modifies a preference in a prefwindow.

resizebefore - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › resizebefore

« xul reference home resizebefore type: one of the values below this attribute indicates which element to the left or above the splitter should be resized when the splitter is repositioned.
... « xul reference home resizebefore type: one of the values below this attribute indicates which element to the left or above the splitter should be resized when the splitter is repositioned.
... « xul reference home resizebefore type: one of the values below this attribute indicates which element to the left or above the splitter should be resized when the splitter is repositioned.
... resizebefore type: one of the values below this attribute indicates which element to the left or above the splitter should be resized when the splitter is repositioned.

textbox.onblur - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › textbox.onblur

« xul reference home onblur type: script code this event is sent when a textbox loses keyboard focus.
...x loses keyboard focus.
...is event has evolved over time.
...ent inside the textbox binding.

textbox.onfocus - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › textbox.onfocus

« xul reference home onfocus type: script code this event is sent when a textbox receives keyboard focus.
...eceives keyboard focus.
...is event has evolved over time.
...ent inside the textbox binding.

Menus - Archive of obsolete content

Archive › Mozilla › XUL › Firefox menus

an extension will often wish to attach a new command to a menu.
....
...go/history' menu.
... views the selection source selection context-viewpartialsource-mathml views the mathml source mathml context-viewsource views the source context-viewinfo views the page info context-metadata views the properties context-spell-check-enabled spell check enabled checkbox context-inspect inspects the element ...

insertItem - Archive of obsolete content

Archive › Mozilla › XUL › Method › insertItem

« xul reference home insertitem( id, beforenode, wrapper, beforepermanent ) not in seamonkey 1.x return type: element add an item with the given id to the toolbar.
...bar.
...manent argument is true, the item is added to the beginning of the toolbar before the first permanent item.
... item in another element.

insertItemAt - Archive of obsolete content

Archive › Mozilla › XUL › Method › insertItemAt

« xul reference home insertitemat( index, label, value ) return type: element this method creates a new item and inserts it at the specified position.
... « xul reference home insertitemat( index, label, value ) return type: element this method creates a new item and inserts it at the specified position.
... « xul reference home insertitemat( index, label, value ) return type: element this method creates a new item and inserts it at the specified position.
...tionally set a value.

MenuButtons - Archive of obsolete content

Archive › Mozilla › XUL › PopupGuide › MenuButtons

menu buttons menus may be attached to buttons in several ways.
...to 'menu' creates a button that will open a menu when pressed.
...oolbarbutton> here, the 'save' button has a type of 'menu-button', so a small arrow button will appear which will open the menu when pressed.
...icates to the user that the command is carried out when the main button is pressed.

PopupKeys - Archive of obsolete content

Archive › Mozilla › XUL › PopupGuide › PopupKeys

handling keys within menus when using a menupopup element, a keyboard listener is attached to the window that will handle keypresses for the menu.
...n't be a need to handle keys yourself.
... the focus remains where it was before the menu was open.
...ke with a menu, when a panel is opened, the focus is removed from any element that has it.

tag - Archive of obsolete content

Archive › Mozilla › XUL › Property › tag

« xul reference tag type: tag name this may be set to a tag name.
... « xul reference tag type: tag name this may be set to a tag name.
... « xul reference tag type: tag name this may be set to a tag name.
...conditions will only match if the template builder is parsing content for an element directly inside this tag.

Multiple Rule Example - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Multiple Rule Example

play the description.
...tos5.rdf" ref="http://www.xulplanet.com/rdf/myphotos"> <template> <rule> <conditions> <content uri="?start"/> <member container="?start" child="?photo"/> <triple subject="?photo" predicate="http://purl.org/dc/elements/1.1/title" object="?title"/> <triple subject="?photo" predicate="http://purl.org/dc/elements/1.1/description" object="?description"/> <triple subject="?photo" predicate="http://purl.org/dc/elements/1.1/date" object="?date"/> </conditions> <action> <hbox uri="?photo" class="box-padded"> <vbox> <label value="?title"/> <image src="?photo"/> </vbox> <groupbox> ...
... <groupbox> <caption label="photo details"/> <label value="?description"/> <label value="date: ?date"/> </groupbox> </hbox> </action> </rule> <rule> <conditions> <content uri="?start"/> <member container="?start" child="?photo"/> <triple subject="?photo" predicate="http://purl.org/dc/elements/1.1/title" object="?phototitle"/> </conditions> <action> <vbox uri="?photo" class="box-padded"> <label value="?phototitle"/> <image src="?photo"/> </vbox> </action> </rule> </template> </vbox> in this example, the first rule matches only those photos with title, description, and date properties.
...hough the builder actually generates mutliple matches for one resource, in many cases it isn't necessary to be aware of this detail when creating templates.

Creating a Skin - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Creating a Skin

border-top: 1px solid white; border-bottom: 1px solid #666666; border-left: 1px solid white; border-right: 1px solid #666666; } caption { background-color: lightblue; } the inner box of the window (which actually surrounds all of the window content) has been changed to have a medium blue color.
...solid #666666; } caption { background-color: lightblue; } the inner box of the window (which actually surrounds all of the window content) has been changed to have a medium blue color.
...opensearch { list-style-image: url("chrome://editor/skin/icons/btn1.gif"); -moz-image-region: rect(48px 16px 64px 0); -moz-box-orient: vertical; } #savesearch { list-style-image: url("chrome://editor/skin/icons/btn1.gif"); -moz-image-region: rect(80px 16px 96px 0); -moz-box-orient: vertical; } mozilla provides a custom style property -moz-image-region which can be used to make an element use part of an image.
...setting margins: tabbox { margin: 4px; } toolbarbutton { margin-left: 3px; margin-right: 3px; } after those changes, the find files dialog now looks like the image.

Using Visual Studio as your XUL IDE - Archive of obsolete content

Archive › Mozilla › XUL › Using Visual Studio as your XUL IDE

compared to a simple text-editor, visual studio gives you some special features when writing xul: intellisense / autocompletion for elements and attributes validation syntax coloring (okay, more sophisticated editors like notepad++ provide this as well) before you can use all of this, you have to adjust visual studio a little.
... some instructions for installing the schema, but there is an easier way.
...l add the menu item xml to the main menu.
...e schema based on the namespace, so make sure your window element uses the correct xul namespace http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul.

XUL Reference - Archive of obsolete content

Archive › Mozilla › XUL › XUL Reference

« xul reference « alphabetical list of all xul elements action arrowscrollbox assign bbox binding bindings box broadcaster broadcasterset button browser checkbox caption clicktoscroll colorpicker column columns commandset command conditions content datepicker deck description dialog dialogheader dropmarker editor grid grippy groupbox hbox iframe image key keyset label listbox listcell listcol listcols listhead listheader listitem member menu menubar menuitem menulist menupopup menuseparator notification notificationbox observes overlay page panel param popupset preference preferences prefpane prefwindow progressmeter query queryset radio radiogroup resizer richlistbox richlistitem row rows rule scale script ...
...tbox textbox (firefox autocomplete) textbox (mozilla autocomplete) timepicker titlebar toolbar toolbarbutton toolbargrippy toolbaritem toolbarpalette toolbarseparator toolbarset toolbarspacer toolbarspring toolbox tooltip tree treecell treechildren treecol treecols treeitem treerow treeseparator triple vbox where window wizard wizardpage categorical list of all xul elements « xul reference « windows window wizard wizardpage titlebar window structure --- menus and popups --- toolbars toolbar toolbarbutton toolbargrippy toolbaritem toolbarpallete toolbarseperator toolbarspring tabs and grouping tab tabbox tabpanel tabpanels tabs controls --- text and images label caption image lists --- trees ...
...ndow structure --- menus and popups --- toolbars toolbar toolbarbutton toolbargrippy toolbaritem toolbarpallete toolbarseperator toolbarspring tabs and grouping tab tabbox tabpanel tabpanels tabs controls --- text and images label caption image lists --- trees --- layout --- templates --- scripting --- helper elements other xul lists dialog overlay page window wizard wizardpage preference preferences prefpane prefwindow browser tabbrowser editor iframe titlebar resizer statusbar statusbarpanel dialogheader notification notificationbox menubar menu menuitem menuseparator menupopup panel tooltip popupset toolbar toolbarbutton toolbargrippy toolbaritem toolbarpalette tool...
...rollbox action assign binding bindings conditions content member param query queryset rule template textnode triple where script commandset command broadcaster broadcasterset observes key keyset stringbundle stringbundleset arrowscrollbox dropmarker grippy scrollbar scrollcorner spinbuttons all attributes all properties all methods attributes defined for all xul elements style classes event handlers deprecated/defunct markup ...

assign - Archive of obsolete content

Archive › Mozilla › XUL › assign

« xul reference home [ examples | attributes | properties | methods | related ] for xml templates, specifies an additional variable to assign a value to.
... examples (example needed) attributes expr type: string for xml queries, an xpath expression which returns results.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , ...
... ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattr...

bbox - Archive of obsolete content

Archive › Mozilla › XUL › bbox

« xul reference home [ examples | attributes | properties | methods | related ] a horizontal box that is baseline aligned.
... « xul reference home [ examples | attributes | properties | methods | related ] a horizontal box that is baseline aligned.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , ...
... ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattr...

broadcasterset - Archive of obsolete content

Archive › Mozilla › XUL › broadcasterset

« xul reference home [ examples | attributes | properties | methods | related ] a container element for broadcaster elements.
... « xul reference home [ examples | attributes | properties | methods | related ] a container element for broadcaster elements.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , ...
... ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattr...

grippy - Archive of obsolete content

Archive › Mozilla › XUL › grippy

« xul reference home [ examples | attributes | properties | methods | related ] an element that may be used inside a splitter which can be used to collapse a sibling element of the splitter.
... « xul reference home [ examples | attributes | properties | methods | related ] an element that may be used inside a splitter which can be used to collapse a sibling element of the splitter.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , ...
... ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattr...

listcol - Archive of obsolete content

Archive › Mozilla › XUL › listcol

lexible --> <listbox> <listhead> <listheader label="first"/> <listheader label="last"/> </listhead> <listcols> <listcol flex="1"/> <listcol/> </listcols> <listitem> <listcell label="buck"/> <listcell label="rogers"/> </listitem> <listitem> <listcell label="john"/> <listcell label="painter"/> </listitem> </listbox> attributes inherited from xul element align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, remove...
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , ...
... ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattr...
...haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattributenode(), removeattributens(), removechild(), removeeventlistener(), replacechild(), setattribute(), setattributenode(), setattributenodens(), setattributens(), setuserdata related elements listbox, listcell, listcols, listhead, listheader, listitem ...

queryset - Archive of obsolete content

Archive › Mozilla › XUL › queryset

« xul reference home [ examples | attributes | properties | methods | related ] a container for query elements when more than one query is used.
... « xul reference home [ examples | attributes | properties | methods | related ] a container for query elements when more than one query is used.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , ...
... ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattr...

script - Archive of obsolete content

Archive › Mozilla › XUL › script

« xul reference home [ examples | attributes | properties | methods | related ] much like the html script element, this is used to declare a script to be used by the xul window.
...ould set this to application/javascript.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , ...
... ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattr...

scrollcorner - Archive of obsolete content

Archive › Mozilla › XUL › scrollcorner

« xul reference home [ examples | attributes | properties | methods | related ] this element is used for the small box where the horizontal and vertical scrollbars meet.
... « xul reference home [ examples | attributes | properties | methods | related ] this element is used for the small box where the horizontal and vertical scrollbars meet.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , ...
... ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattr...

stringbundleset - Archive of obsolete content

Archive › Mozilla › XUL › stringbundleset

« xul reference home [ examples | attributes | properties | methods | related ] a container for stringbundle elements.
... « xul reference home [ examples | attributes | properties | methods | related ] a container for stringbundle elements.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , ...
... ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattr...

toolbarpalette - Archive of obsolete content

Archive › Mozilla › XUL › toolbarpalette

an overlay that overlays the toolbarpalette with the idbrowsertoolbarpalette.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , ...
... ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattr...
...haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattributenode(), removeattributens(), removechild(), removeeventlistener(), replacechild(), setattribute(), setattributenode(), setattributenodens(), setattributens(), setuserdata related elements toolbar, toolbarbutton, toolbargrippy, toolbaritem, toolbarseparator, toolbarset, toolbarspacer, toolbarspring, toolbox ...

toolbarseparator - Archive of obsolete content

Archive › Mozilla › XUL › toolbarseparator

elated ] creates a separator between groups of toolbar items.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessibletype type: integer a value indicating the type of accessibility object for the element.
...s, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattr...
...hildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattributenode(), removeattributens(), removechild(), removeeventlistener(), replacechild(), setattribute(), setattributenode(), setattributenodens(), setattributens(), setuserdata related elements toolbar, toolbarbutton, toolbargrippy, toolbaritem, toolbarpalette, toolbarset, toolbarspacer, toolbarspring, toolbox ...

toolbarspacer - Archive of obsolete content

Archive › Mozilla › XUL › toolbarspacer

« xul reference home [ examples | attributes | properties | methods | related ] firefox only a space between toolbar items.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessibletype type: integer a value indicating the type of accessibility object for the element.
... ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattr...
...haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattributenode(), removeattributens(), removechild(), removeeventlistener(), replacechild(), setattribute(), setattributenode(), setattributenodens(), setattributens(), setuserdata related elements toolbar, toolbarbutton, toolbargrippy, toolbaritem, toolbarpalette, toolbarseparator, toolbarset, toolbarspring, toolbox interfaces nsiaccessibleprovider ...

toolbarspring - Archive of obsolete content

Archive › Mozilla › XUL › toolbarspring

« xul reference home [ examples | attributes | properties | methods | related ] firefox only a flexible space between toolbar items.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessibletype type: integer a value indicating the type of accessibility object for the element.
...s, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattr...
...hildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattributenode(), removeattributens(), removechild(), removeeventlistener(), replacechild(), setattribute(), setattributenode(), setattributenodens(), setattributens(), setuserdata related elements toolbar, toolbarbutton, toolbargrippy, toolbaritem, toolbarpalette, toolbarseparator, toolbarset, toolbarspacer, toolbox interfaces nsiaccessibleprovider ...

where - Archive of obsolete content

Archive › Mozilla › XUL › where

« xul reference home [ examples | attributes | properties | methods | related ] indicate a condition that must match for a template result to be used.
...the string value of subject must come after value alphabetically startswith the value of subject must start with the value endswith the value of subject must end with the value contains the value of subject must contain the value as a substring subject type: string the variable or string to compare.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , ...
... ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattr...

2006-09-29 - Archive of obsolete content

Archive › Newsgroup summaries › mozilla-dev-tech-layout › 2006-09-29

summary: mozilla.dev.tech.layout september 22-29, 2006 announcements no announcements for this week.
... summary: mozilla.dev.tech.layout september 22-29, 2006 announcements no announcements for this week.
...ncements no announcements for this week.
...* compute the size that a frame will occupy.

What is RSS - Archive of obsolete content

Archive › RSS › Getting Started › What is RSS

group already used 1.0 with their rdf-based rss 1.0.
.../> </item> </channel> </rss> the observant reader may have noticed that the news web site and blogger examples were the same type of rss.
...iced that the news web site and blogger examples were the same type of rss.
.../blogger rss uses the <link> element and the internet radio/internet television rss uses the <enclosure> element.

Summary of Changes - Archive of obsolete content

Archive › Using Web Standards in your Web Pages › Summary of Changes

this section outlines all of the element and practice updates described in this article.
...nd practice updates described in this article.
... proprietary or deprecated feature w3c feature or recommended replacement deprecated font html 4.01 span plus css1 color: ; font-family: ; font-size: ; deprecated center or align="center" css1 text-align: center; for in-line elements like text or image deprecated center or align="center" css1 margin-left: auto; margin-right: auto; for block-level elements deprecated bgcolor css1 background-color: ; non-standard embed html 4.01 object deprecated applet html 4.01 object non-standard marquee html 4.01 div plus scripting non-standard bgsound html 4.01 object proprietary or deprecated feature w3c feature or recommended replacement ie5+ id_attribute_value document...
... 4.01 object deprecated applet html 4.01 object non-standard marquee html 4.01 div plus scripting non-standard bgsound html 4.01 object proprietary or deprecated feature w3c feature or recommended replacement ie5+ id_attribute_value document.all.id_attribute_value document.all[id_attribute_value] dom level 2: document.getelementbyid(id_attribute_value) ie5+ formname.inputname.value dom level 1: document.forms["formname"].inputname.value ie5+ inputname.value dom level 1: document.forms["formname"].inputname.value ie5+ formctrlname dom level 1: document.forms["formname"].formctrlname ie5+ document.forms(0) dom level 1: document.forms[0] ...

-moz-binding - Archive of obsolete content

Archive › Web › CSS › -moz-binding

the -moz-binding css property is used by mozilla-based applications to attach an xbl binding to a dom element.
...erty is used by mozilla-based applications to attach an xbl binding to a dom element.
...inding to a dom element.
...alue */ -moz-binding: url(http://www.example.org/xbl/htmlbindings.xml#checkbox); /* global values */ -moz-binding: inherited; -moz-binding: initial; -moz-binding: unset; values <url> the url for the xbl binding (including the fragment identifier).

-moz-stack-sizing - Archive of obsolete content

Archive › Web › CSS › -moz-stack-sizing

-moz-stack-sizing is an extended css property.
...the stack far to the right will widen the stack so the child remains visible.
...ck from resizing automatically to accommodate its children, you can set -moz-stack-sizing to ignore on the child element.
...ut not others.

-ms-accelerator - Archive of obsolete content

Archive › Web › CSS › -ms-accelerator

the -ms-accelerator css property is a microsoft extension that sets or retrieves a string indicating whether the object represents a keyboard shortcut.
...d valueas specifiedanimation typediscrete syntax /* the object is not a keyboard shortcut (the default) */ -ms-accelerator: false /* the object is a keyboard shortcut */ -ms-accelerator: true values false the object is not a keyboard shortcut.
...ax /* the object is not a keyboard shortcut (the default) */ -ms-accelerator: false /* the object is a keyboard shortcut */ -ms-accelerator: true values false the object is not a keyboard shortcut.
...formal syntax false | true examples this example uses the -ms-accelerator attribute in a <u> element to specify that the "n" in the <label> element is a keyboard shortcut.

-ms-content-zoom-limit-min - Archive of obsolete content

Archive › Web › CSS › -ms-content-zoom-limit-min

the -ms-content-zoom-limit-min css property is a microsoft extension that specifies the minimum zoom factor.
... the -ms-content-zoom-limit-min css property is a microsoft extension that specifies the minimum zoom factor.
...arger values zoom in.
...ueas specifiedanimation typediscrete syntax values <percentage> the minimum zoom factor.

-ms-content-zoom-limit - Archive of obsolete content

Archive › Web › CSS › -ms-content-zoom-limit

the -ms-content-zoom-limit css shorthand property is a microsoft extension that specifies values for the -ms-content-zoom-limit-min and -ms-content-zoom-limit-max properties.
... the -ms-content-zoom-limit css shorthand property is a microsoft extension that specifies values for the -ms-content-zoom-limit-min and -ms-content-zoom-limit-max properties.
...om limit values, in order, separated by spaces.
... -ms-content-zoom-limit-min value of the -ms-content-zoom-limit-min property.

-ms-content-zoom-snap-points - Archive of obsolete content

Archive › Web › CSS › -ms-content-zoom-snap-points

the -ms-content-zoom-snap-points css property is a microsoft extension that specifies where zoom snap-points are located.
... the -ms-content-zoom-snap-points css property is a microsoft extension that specifies where zoom snap-points are located.
...d the interval is set to 100%.
...h snap-point is listed separately—100%, 200%, 300%, and so on.

-ms-content-zoom-snap-type - Archive of obsolete content

Archive › Web › CSS › -ms-content-zoom-snap-type

the -ms-content-zoom-snap-type css property is a microsoft extension that specifies how zooming is affected by defined snap-points.
... the -ms-content-zoom-snap-type css property is a microsoft extension that specifies how zooming is affected by defined snap-points.
...tory indicates that the motion of the content after the contact is picked up is always adjusted so that it lands on a snap-point.
...e contact is picked up is always adjusted so that it lands on a snap-point.

-ms-content-zoom-snap - Archive of obsolete content

Archive › Web › CSS › -ms-content-zoom-snap

the -ms-content-zoom-snap css shorthand property is a microsoft extension that specifies values for the -ms-content-zoom-snap-type and -ms-content-zoom-snap-points properties.
... the -ms-content-zoom-snap css shorthand property is a microsoft extension that specifies values for the -ms-content-zoom-snap-type and -ms-content-zoom-snap-points properties.
... values, in order, separated by spaces.
...tent-zoom-snap-type value of the -ms-content-zoom-snap-type property.

-ms-scroll-limit-x-min - Archive of obsolete content

Archive › Web › CSS › -ms-scroll-limit-x-min

the -ms-scroll-limit-x-min css property is a microsoft extension that specifies the minimum value for the element.scrollleft property.
... the -ms-scroll-limit-x-min css property is a microsoft extension that specifies the minimum value for the element.scrollleft property.
... the -ms-scroll-limit-x-min css property is a microsoft extension that specifies the minimum value for the element.scrollleft property.
...ue0applies tonon-replaced block-level elements and non-replaced inline-block elementsinheritednocomputed valueas specifiedanimation typediscrete syntax values <length> the minimum value for the scrollleft property.

-ms-scroll-limit-y-min - Archive of obsolete content

Archive › Web › CSS › -ms-scroll-limit-y-min

the -ms-scroll-limit-y-min css property is a microsoft extension that specifies the minimum value for the element.scrolltop property.
... the -ms-scroll-limit-y-min css property is a microsoft extension that specifies the minimum value for the element.scrolltop property.
... the -ms-scroll-limit-y-min css property is a microsoft extension that specifies the minimum value for the element.scrolltop property.
...lue0applies tonon-replaced block-level elements and non-replaced inline-block elementsinheritednocomputed valueas specifiedanimation typediscrete syntax values <length> the minimum value for the scrolltop property.

-ms-scrollbar-3dlight-color - Archive of obsolete content

Archive › Web › CSS › -ms-scrollbar-3dlight-color

the -ms-scrollbar-3dlight-color css property is a microsoft extension specifying the color of the top and left edges of the scroll box and scroll arrows of a scroll bar.
...]?
...com/workshop/samples/author/dhtml/refs/scrollbarcolor.htm <!doctype html> <html> <head> <title>scrollbar-3dlight-color</title> <style> .blue3dlight { -ms-scrollbar-3dlight-color: blue; scrollbar-3dlight-color: blue; /* use the standard when available.
...ollbarcolor.htm <!doctype html> <html> <head> <title>scrollbar-3dlight-color</title> <style> .blue3dlight { -ms-scrollbar-3dlight-color: blue; scrollbar-3dlight-color: blue; /* use the standard when available.

-ms-scrollbar-darkshadow-color - Archive of obsolete content

Archive › Web › CSS › -ms-scrollbar-darkshadow-color

the -ms-scrollbar-darkshadow-color css property is a microsoft extension that specifies the color of a scroll bar's gutter.
...) | hsl( <hue>, <percentage>, <percentage>, <alpha-value>?
...t sets the -ms-scrollbar-darkshadow-color property for a <textarea> element.
...color property for a <textarea> element.

-ms-scrollbar-shadow-color - Archive of obsolete content

Archive › Web › CSS › -ms-scrollbar-shadow-color

the -ms-scrollbar-shadow-color css property is a microsoft extension that specifies the color of the bottom and right edges of the scroll box and scroll arrows of a scroll bar.
... ]?
...umber> | <percentage><hue> = <number> | <angle> examples the following example shows how to create a style rule that sets the -ms-scrollbar-shadow-color property for a <textarea> element.
...> | <angle> examples the following example shows how to create a style rule that sets the -ms-scrollbar-shadow-color property for a <textarea> element.

-ms-scrollbar-track-color - Archive of obsolete content

Archive › Web › CSS › -ms-scrollbar-track-color

the -ms-scrollbar-track-color css property is a microsoft extension that specifies the color of the track element of a scrollbar.
... the -ms-scrollbar-track-color css property is a microsoft extension that specifies the color of the track element of a scrollbar.
... the -ms-scrollbar-track-color css property is a microsoft extension that specifies the color of the track element of a scrollbar.
...> ]?

Namespaces - Archive of obsolete content

Archive › Web › E4X tutorial › Namespaces

« previousnext » e4x and namespaces oftentimes, xml documents will contain elements from a variety of namespaces.
...w.w3.org/1999/xhtml"> some text <label xmlns="http://www.mozilla.org/keymaster/gat...re.is.only.xul">more text</label> </p> name() using name() on an xml object returns a qname object (qualified name).
...y.xul">more text</label> </p> name() using name() on an xml object returns a qname object (qualified name).
...lobal constructor available in javascript implementations supporting e4x.

JSObject - Archive of obsolete content

Archive › Web › LiveConnect › LiveConnect Reference › JSObject

sions.
...what's the problem with == ?) eval evaluates a javascript expression.
... a javascript expression.
...blic static jsobject getwindow(applet applet) removemember method.

ParallelArray - Archive of obsolete content

Archive › Web › ParallelArray

ble data-parallelism in web applications.
...arallelism in web applications.
...r functions available on parallelarray attempted to execute in parallel, though they may fall back to sequential execution if necessary.
...all back to sequential execution if necessary.

Troubleshooting XForms Forms - Archive of obsolete content

Archive › Web › XForms › Form Troubleshooting

ding your file directly from the filesystem, make sure that has .xhtml or .xml as the file ending.
...ust use a prefix bound to the namespace.
...must always be specified if the namespace is not the empty namespace.
..., xf:repeat, xf:input or other elements that set the context node.

Requests For Enhancement - Archive of obsolete content

Archive › Web › XForms › RFE

werful web apps and reduce the need for javascript by 90%.
...t it can work with any xml host language.
...easons: xul, in many cases, is much better suited for application development than xhtml.
...etter suited for application development than xhtml.

Building up a basic demo with Three.js - Game development

Games › Techniques › 3D on the web › Building up a basic demo with Three.js

body { margin: 0; padding: 0; } canvas { width: 100%; height: 100%; } </style> </head> <body> <script src="three.min.js"></script> <script> var width = window.innerwidth; var height = window.innerheight; /* all our javascript code goes here */ </script> </body> </html> it contains some basic information like the document <title>, and some css to set the width and height of the <canvas> element, that three.js will insert on the page to 100% to fill the entire available viewport space.
...min.js"></script> <script> var width = window.innerwidth; var height = window.innerheight; /* all our javascript code goes here */ </script> </body> </html> it contains some basic information like the document <title>, and some css to set the width and height of the <canvas> element, that three.js will insert on the page to 100% to fill the entire available viewport space.
...fferently than the css one.
...ating a new webgl renderer, setting its size to fit the whole available space on the screen, and appending the dom structure to the page.

Mobile touch controls - Game development

Games › Techniques › Control mechanisms › Mobile touch

be done in pure javascript.
...n that object.
...pointer) { // do something when dragging } we can pull the ship around and do something in the meantime, and react when the drag is stopped.
...something in the meantime, and react when the drag is stopped.

Gecko FAQ - Gecko Redirect 1

Gecko › FAQ

gside their own within their finished products.
...dards is the gecko development project working to support, and to what extent does it support them?
...he areas noted below and open bugs documented in bugzilla: html 4.0 - full support except for: elements: bdo, basefont attributes: shape attribute on the a element, abbr, axis, headers, scope-row, scope-col, scope-rowgroup, scope-colgroup, charoff, datasrc, datafld, dataformat, datapagesize, summary, event, dir, align on table columns, label attribute of option, alternate text of area elements, longdesc various metadata attributes: cite, datetime, lang, hreflang bidirectional text layout, which is only used in hebrew and arabic (ibm has begun work to add bidi support in a future release) style sheets css 1 - full support, except for: the application of styles to html column elements the ability to turn off author styles the names of certain mozill...
...inks to lists of reported bugs related to the standards mentioned above; be aware that these raw lists of open in-process bugs will inevitably include some duplicate, out of date, unreproducible, invalid, and incorrectly tagged reports: the links themselves are probably outdated too.

Intrinsic Size - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Intrinsic Size

in css, the intrinsic size of an element is the size it would be based on its content, if no external factors were applied to it.
... in css, the intrinsic size of an element is the size it would be based on its content, if no external factors were applied to it.
...n its content, if no external factors were applied to it.
... account the min-content and max-content size of an element.

jQuery - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › jQuery

jquery is a javascript library that focuses on simplifying dom manipulation, ajax calls, and event handling.
... jquery is a javascript library that focuses on simplifying dom manipulation, ajax calls, and event handling.
...tion() to assign an element(s) to an event.
...ign it to an event api called .action().

Speculative parsing - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › speculative parsing

rt of the incoming file that was already scanned for scripts, style sheets and images.
...ripts, style sheets and images.
....
...ript>document.write("<div></div");</script> is bad.

Grids - Learn web development

Learn › CSS › CSS layout › Grids

basics (study introduction to html), and an idea of how css works (study introduction to css and styling boxes.) objective: to understand the fundamental concepts behind grid layout systems, and how to implement a grid layout using css grid.
...ea of how css works (study introduction to css and styling boxes.) objective: to understand the fundamental concepts behind grid layout systems, and how to implement a grid layout using css grid.
...roperties: grid-column grid-row these let you specify the start and end lines at once, separated by a / — a forward slash character.
... note: you can also use the value -1 to target the end column or row line, and count inwards from the end using negative values.

Beginner's guide to media queries - Learn web development

Learn › CSS › CSS layout › Media queries

esign that works well in this orientation may not work as well when viewed on a phone or tablet in portrait mode.
...elow code into the bottom of your step1.html css.
... } } this css gives us a two-column layout inside the article, of the article content and related information in the aside element.
...en step 3 in the browser, or view the source.

Multiple-column layout - Learn web development

Learn › CSS › CSS layout › Multiple-column Layout

m tincidunt eget purus in interdum.
...ontes, nascetur ridiculus mus.</p> </div> something to take note of is that the rule does not take up any width of its own.
...does not take up any width of its own.
...ide of the rule you will need to increase the column-gap size.

Responsive design - Learn web development

Learn › CSS › CSS layout › Responsive Design

add in a breakpoint and change the design at the point where the content starts to look bad.
...op.
...the most appropriate image for each device, ensuring that a user will download an image size appropriate for the device they are using.
...d.

Using data attributes - Learn web development

Learn › HTML › Howto › Use data attributes

html5 is designed with extensibility in mind for data that should be associated with a particular element but need not have any defined meaning.
... html5 is designed with extensibility in mind for data that should be associated with a particular element but need not have any defined meaning.
... html5 is designed with extensibility in mind for data that should be associated with a particular element but need not have any defined meaning.
...s to consider are internet explorer support and performance.

Multimedia and Embedding - Learn web development

Learn › HTML › Multimedia and embedding

have the ability to create your own files, you could try out (most of) the code examples in an online coding program such as jsbin or glitch.
...ere are other types of multimedia to consider, but it is logical to start with the humble <img> element used to embed a simple image in a webpage.
...ok at how to use the html5 <video> and <audio> elements to embed video and audio on our pages, including basics, providing access to different file formats to different browsers, adding captions and subtitles, and how to add fallbacks for older browsers.
...ng access to different file formats to different browsers, adding captions and subtitles, and how to add fallbacks for older browsers.

Function return values - Learn web development

Learn › JavaScript › Building blocks › Return values

d their return values substituted for the function calls, before the line itself is then executed.
...before the line itself is then executed.
...rary.html file from github.
...nal test.

Silly story generator - Learn web development

Learn › JavaScript › First steps › Silly story generator

t.
...an example of what the finished program should output: to give you more of an idea, have a look at the finished example (no peeking at the source code!) steps to complete the following sections describe what you need to do.
...ust before the closing </body> tag.
... don't need to edit the html in any way, except to apply the javascript to your html.

Working with Svelte stores - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Svelte stores

er ms milliseconds.
... stores to abstract away the inner workings of the store itself.
...le.js file will weight a little less than 22kb.
...implement cross-component state management using stores.

Getting started with Vue - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Vue getting started

h this tutorial, you might want to keep the vue guide and api documentation open in other tabs, so you can refer to them if you want more information on any sub topic.
...emplate for managing the layout of your application — this template is for managing static html that sits outside of your vue app.
...setup), you should see your app.
...see the logo removed from the rendered site almost instantly.

Mozilla accessibility architecture

Mozilla › Accessibility › Accessibility architecture

taccblah() traversal methods mentioned above all have default implementations in nsaccessible.
...mplementations use a class called nsaccessibletreewalker to do the real work.
... an html combo box doesn't have a dom node or anonymous content for its s textfield, button or list.
...to be invalidated.

mozbrowsercontextmenu

Mozilla › Gecko › Chrome › API › Browser API › mozbrowsercontextmenu

more menusystem objects (see the menusystem object, below), containing details of the standard menu(s) that will be shown.
...ntaining details of the standard menu(s) that will be shown.
... is bigger than 0 x 0, or false if not.
...presenting the action of a form, in the case of a form context menu.

Chrome-only CSS reference

Mozilla › Gecko › Chrome › CSS

note: most of the css properties exposed to the web in general are also usable in chrome stylesheets: see the css documentation for a list of these.
...t color is selected.:-moz-lwtheme-darktextthe :-moz-lwtheme-darktext pseudo-class matches in chrome documents when :-moz-lwtheme is true and a lightweight theme with a dark text color is selected.::-moz-tree-cellactivated by the properties attribute.::-moz-tree-cell-textactivated by the properties attribute.::-moz-tree-cell-text(hover)the :-moz-tree-cell-text(hover) css pseudo-class will match an element if the mouse cursor is presently hovering over text in a tree cell.::-moz-tree-columnactivated by the properties attribute.::-moz-tree-drop-feedbackactivated by the properties attribute.::-moz-tree-imageactivated by the properties attribute.::-moz-tree-indentationactivated by the properties attribute.::-moz-tree-lineactivated by the properties attribute.::-moz-tree-progressmeteractivated when the...
...ated by the properties attribute.::-moz-tree-drop-feedbackactivated by the properties attribute.::-moz-tree-imageactivated by the properties attribute.::-moz-tree-indentationactivated by the properties attribute.::-moz-tree-lineactivated by the properties attribute.::-moz-tree-progressmeteractivated when the type attribute is set to progressmeter.
...attribute.::-moz-tree-indentationactivated by the properties attribute.::-moz-tree-lineactivated by the properties attribute.::-moz-tree-progressmeteractivated when the type attribute is set to progressmeter.

Gecko Keypress Event

Mozilla › Gecko › Gecko keypress event

the characters).
...ut.
... numeral, the key may be one of the numeral keys in the top row of a french azerty keyboard layout (or similar).
...r similar).

Mozilla Style System

Mozilla › Mozilla style system

tyle sheets, a single style rule processor for all user css style sheets, and a single style rule processor for all author css style sheets.
...gle style rule processor for all user css style sheets, and a single style rule processor for all author css style sheets.
...es the data represented by a css style rule, we create a new nsistylerule object; keeping the old one around briefly helps to determine what changed and how we need to handle that change.
...esented by a css style rule, we create a new nsistylerule object; keeping the old one around briefly helps to determine what changed and how we need to handle that change.

PR_REMOVE_AND_INIT_LINK

Mozilla › Projects › NSPR › Reference › PR REMOVE AND INIT LINK

removes an element from a circular list and initializes the linkage.
... removes an element from a circular list and initializes the linkage.
... removes an element from a circular list and initializes the linkage.
... removes an element from a circular list and initializes the linkage.

JSAPI User Guide

Mozilla › Projects › SpiderMonkey › JSAPI User Guide

n) provide spidermonkey as a prebuilt package.
...tion wants to provide; see custom objects below.
...age collector can reach all the objects, numbers, and strings that are still being used.
... switch (jsval_to_int(id)) { case my_color: *vp = .

JSFunctionSpec

Mozilla › Projects › SpiderMonkey › JSAPI reference › JSFunctionSpec

on's name in self-hosted javascript code.
... description jsfunctionspec defines the attributes for a single js function to associate with an object.
...le js function to associate with an object.
...associate with an object.

JS_AlreadyHasOwnProperty

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS AlreadyHasOwnProperty

ect obj, const char *name, bool *foundp); boo js_alreadyhasownucproperty(jscontext *cx, js::handleobject obj, const char16_t *name, size_t namelen, bool *foundp); boo js_alreadyhasownpropertybyid(jscontext *cx, js::handleobject obj, js::handleid id, bool *foundp); // added in spidermonkey 1.8.1 boo js_alreadyhasownelement(jscontext *cx, js::handleobject obj, uint32_t index, bool *foundp); name type description cx jscontext * pointer to a js context.
...har * or const char16_t *or js::handleid (in js_alreadyhasownproperty, alreadyhasownucproperty, and js_alreadyhasownpropertybyid) the name of the property to search for.
...:handleid (in js_alreadyhasownproperty, alreadyhasownucproperty, and js_alreadyhasownpropertybyid) the name of the property to search for.
...*foundp to true and returns true.

JS_InitClass

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS InitClass

.
...rtyspec * either null or a pointer to the first element of an array of jspropertyspecs, terminated by the null jspropertyspec, which can be written {0, 0, 0, 0, 0}.
...nter to the first element of an array of jsfunctionspecs, terminated by js_fs_end.
...ropertyspec * either null or a pointer to the first element of an array of jspropertyspecs, terminated by the null jspropertyspec.

nsICacheMetaDataVisitor

Mozilla › Tech › XPCOM › Reference › Interface › nsICacheMetaDataVisitor

netwerk/cache/nsicacheentrydescriptor.idlscriptable this interface is used for visiting the meta data elements for a specified cache entry.
... netwerk/cache/nsicacheentrydescriptor.idlscriptable this interface is used for visiting the meta data elements for a specified cache entry.
... netwerk/cache/nsicacheentrydescriptor.idlscriptable this interface is used for visiting the meta data elements for a specified cache entry.
...acheentrydescriptor.idlscriptable this interface is used for visiting the meta data elements for a specified cache entry.

nsIComponentRegistrar

Mozilla › Tech › XPCOM › Reference › Interface › nsIComponentRegistrar

s and is registered.
...tractid if one exists and is registered.
...ration can be queryinterfaced for the nsisupportsid interface.
...atecontractids() this method returns an enumerator over the list of registered contractids.

nsIMessageListener

Mozilla › Tech › XPCOM › Reference › Interface › nsIMessageListener

er interface.
...ge() this is for js only.
...roadcastasyncmessage sendasyncmessage sendsyncmessage.
...l for the window app.

nsIMicrosummaryObserver

Mozilla › Tech › XPCOM › Reference › Interface › nsIMicrosummaryObserver

face provides methods for observing changes to micrummaries.
...mmary microsummary); methods oncontentloaded() called when an observed microsummary updates its content.
...oncontentloaded() called when an observed microsummary updates its content.
...mary updates its content.

nsISyncMessageSender

Mozilla › Tech › XPCOM › Reference › Interface › nsISyncMessageSender

essage.
... object.
...essage.
... object.

nsIUpdate

Mozilla › Tech › XPCOM › Reference › Interface › nsIUpdate

replace patch.
...minor update, such as a security update.
...uch as a security update.
... in unsigned long index ); parameters index the index of the patch to retrieve.

nsIUpdatePatch

Mozilla › Tech › XPCOM › Reference › Interface › nsIUpdatePatch

toolkit/mozapps/update/nsiupdateservice.idlscriptable an interface that describes an object representing a patch file that can be downloaded and applied to a version of this application so that it can be updated.
... file in bytes.
... state astring the state of this patch.
... complete patch containing all the replacement files to update to the new version.

nsIXULTemplateQueryProcessor

Mozilla › Tech › XPCOM › Reference › Interface › nsIXULTemplateQueryProcessor

s from: nsisupports last changed in gecko 1.9 (firefox 3) a query processor takes a template query and generates results for it given a datasource and a reference point.
... begin at the node referred by the reference variable and end at a list of that node's children.
...atasource that holds a table that can only produce one set of results.
...erence variable may be specified in a template by setting the "container" attribute on the <template> element to the variable to use.

nsIXULTemplateResult

Mozilla › Tech › XPCOM › Reference › Interface › nsIXULTemplateResult

s.
...nremoved() indicate that the output for a result has been removed and that the result is no longer being used by the builder.
...d hasbeenremoved(); parameters none.
...hed() indicate that a particular rule of a query has matched and that output will be generated for it.

Index

Mozilla › Thunderbird › Index

ays are provided by the extension.
... building a thunderbird extension 5: xul extensions, thunderbird thunderbird's user interface is written in xul and javascript.
...underbird_extension_techniques">common thunderbird extension techniques thunderbird no summary!
...apps.thunderbird and mozilla.dev.extensions include useful tips for thunderbird add-on developers.

Declaring types

Mozilla › js-ctypes › Using js-ctypes › Declaring types

t is a pointer to itself.
...e more accurate, use the define technique: var struct = ctypes.structtype('struct'); struct.define([{ next: struct.ptr }]); arrays to declare a new array type, you use the ctypes.arraytype() method.when declaring a new array type, you provide a ctype indicating the type of each element in the array as well as an optional array length.
... type of each element in the array as well as an optional array length.
... a new type representing an array of unspecified length, in which each entry is a pointer to a file record.

Drawing and Event Handling - Plugins

Plugins › Guide › Drawing and Event Handling

tscape page */ uint32 width; /* maximum window size */ uint32 height; nprect cliprect; /* clipping rectangle in port coordinates */ #ifdef xp_unix void * ws_info; /* platform-dependent additional data */ #endif /* xp_unix */ npwindowtype type; /* whether this is a window or a drawable */ } npwindow; the window parameter is a platform-specific handle to a native window element in the browser window hierarchy on windows and unix.
...ect, which contains the coordinates of the instance's area and various platform-specific data.
...e browser calls npp_setwindow after creating the instance so that the plug-in can begin drawing immediately.
..., call npn_setvalue to set nppvplugintransparentbool to false.

Scripting plugins - Plugins

Plugins › Guide › Scripting plugins

« previousnext » xxx: dummy p element this document describes the new cross-browser npapi extensions, commonly called npruntime, that have been developed by a group of browser and plugin vendors, including the mozilla foundation, adobe, apple, opera, and sun microsystems (see press release).
...echanism needs to return the appropriate npobject (which is created by calling npn_createobject) when the browser requests it by calling: npp_getvalue(npp, nppvpluginscriptablenpobject, ...); accessing browser objects from a plugin a plugin that wishes to access objects in the browser window that loaded the plugin can do this by getting the npobject for the browser's window object, or the dom element that loaded the plugin.
...wser objects from a plugin a plugin that wishes to access objects in the browser window that loaded the plugin can do this by getting the npobject for the browser's window object, or the dom element that loaded the plugin.
...he browser object, and from there, the functions in this api can be used to get and set properties, and to call methods on those browser objects.

Browser Console - Firefox Developer Tools

Tools › Browser Console

hile the web console executes code in the scope of the content window it's attached to, the browser console executes code in the scope of the chrome window of the browser.
...he command ctrl + alt + r (windows, linux) or cmd + alt + r (mac) this command restarts the browser with the same tabs open as before the restart.
...th the same tabs open as before the restart.
...window.document.getelementbyid("appmenuprimarypane"); var makethetea = gbrowser.ownerdocument.defaultview.document.createelementns("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul", "menuitem"); makethetea.setattribute("label", "a nice cup of tea?"); parent.appendchild(makethetea); on macos, this similar code will add a new item to the "tools" menu: var parent = window.document.getelementbyid("menu_toolspopup"); var makethetea = gbrowser.ownerdocument.defaultview.document.createelementns("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul", "menuitem"); makethetea.setattribute("label", "a nice cup of tea?"); parent.appendchild(makethetea); ...

Debugger.Object - Firefox Developer Tools

Tools › Debugger-API › Debugger.Object

that the debugger can use the == operator to recognize when two debugger.object instances refer to the same debuggee object, and place its own properties on a debugger.object instance to store metadata about particular debuggee objects.
... on a debugger.object instance to store metadata about particular debuggee objects.
...() {}); // display name: h/< } var s = f(function () {}); // display name: s< parameternames if the referent is a debuggee function, the names of the its parameters, as an array of strings.
...s an array of strings.

Debugger.Object - Firefox Developer Tools

Tools › Debugger.Object

that the debugger can use the == operator to recognize when two debugger.object instances refer to the same debuggee object, and place its own properties on a debugger.object instance to store metadata about particular debuggee objects.
...es on a debugger.object instance to store metadata about particular debuggee objects.
...) {}); // display name: h/< } var s = f(function () {}); // display name: s< parameternames if the referent is a debuggee function, the names of the its parameters, as an array of strings.
... as an array of strings.

Tree map view - Firefox Developer Tools

Tools › Memory › Tree map view

ry.
...divided by the script's origin.
...t also includes a separate rectangle for code that can't be correlated with a file, such as jit-optimized code.
...le, such as jit-optimized code.

Use the Inspector from the Web Console - Firefox Developer Tools

Tools › Page Inspector › How to › Use the Inspector from the Web Console

the element that's currently selected in the page inspector can be referenced in the web console using the variable $0.
... the element that's currently selected in the page inspector can be referenced in the web console using the variable $0.
... the element that's currently selected in the page inspector can be referenced in the web console using the variable $0.
... the element that's currently selected in the page inspector can be referenced in the web console using the variable $0.

Animation - Web APIs

Web › API › Animation

nfinish gets and sets the event handler for the finish event.
...r that fires when the animation is removed (i.e., put into an active replace state).
...d.
...eason, modern browsers have implemented the part of the web animations spec that automatically removes overriding forward filling animations, unless the developer explicitly specifies to keep them.

AnimationEvent - Web APIs

Web › API › AnimationEvent

tion.
...mation has been running, in seconds, when this event fired, excluding any time the animation was paused.
...y time the animation was paused.
...n was paused.

AudioContext - Web APIs

Web › API › AudioContext

ontext passing the audio from the audiodestinationnode to the audio subsystem.
...e audiodestinationnode to the audio subsystem.
...iocontext.outputlatency read only returns an estimation of the output latency of the current audio context.
...cy of the current audio context.

AudioTrack - Web APIs

Web › API › AudioTrack

the audiotrack interface represents a single audio track from one of the html media elements, <audio> or <video>.
...ring if unknown.
...the language is specified as a bcp 47 (rfc 5646) language code, such as "en-us" or "pt-br".
...s.

AudioTrackList: change event - Web APIs

Web › API › AudioTrackList › change event

the change event is fired when an audio track is enabled or disabled, for example by changing the track's enabled property.
... the change event is fired when an audio track is enabled or disabled, for example by changing the track's enabled property.
...addeventlistener(): const videoelement = document.queryselector('video'); videoelement.audiotracks.addeventlistener('change', (event) => { console.log(`'${event.type}' event fired`); }); // changing the value of `enabled` will trigger the `change` event const toggletrackbutton = document.queryselector('.toggle-track'); toggletrackbutton.addeventlistener('click', () => { const track = videoelement.audiotracks[0]; track.enabled = !track.enabled; }); using the onchange event handler property: const videoelement = document.queryselector('video'); videoelement.audiotracks.onchange = (event) => { console.log(`'${event.type}' event fired`); }; // changing the value of `enabled` will trigger the `change` event const toggletrackbutton = document.queryselector('.toggle-track'); toggletrac...
...the onchange event handler property: const videoelement = document.queryselector('video'); videoelement.audiotracks.onchange = (event) => { console.log(`'${event.type}' event fired`); }; // changing the value of `enabled` will trigger the `change` event const toggletrackbutton = document.queryselector('.toggle-track'); toggletrackbutton.addeventlistener('click', () => { const track = videoelement.audiotracks[0]; track.enabled = !track.enabled; }); specifications specification status html living standardthe definition of 'change' in that specification.

AudioTrackList.onaddtrack - Web APIs

Web › API › AudioTrackList › onaddtrack

the audiotracklist property onaddtrack is an event handler which is called when the addtrack event occurs, indicating that a new audio track has been added to the media element whose audio tracks the audiotracklist represents.
...-added track.
...acklist.onaddtrack = eventhandler; value set onaddtrack to a function that accepts as input a trackevent object which indicates in its track property which audio track has been added to the media.
...naddtrack to a function that accepts as input a trackevent object which indicates in its track property which audio track has been added to the media.

CSSImageValue - Web APIs

Web › API › CSSImageValue

the cssimagevalue interface of the css typed object model api represents values for properties that take an image, for example background-image, list-style-image, or border-image-source.
... the cssimagevalue interface of the css typed object model api represents values for properties that take an image, for example background-image, list-style-image, or border-image-source.
..., but not linear-gradient() or element() .
...ement <button>magic wand</button> we add some css, including a background image requesting a binary file: button { display: inline-block; min-height: 100px; min-width: 100px; background: no-repeat 5% center url(https://mdn.mozillademos.org/files/16793/magicwand.png) aqua; } we get the element's style map.

CSSUnparsedValue.forEach() - Web APIs

Web › API › CSSUnparsedValue › forEach

the cssunparsedvalue.foreach() method executes a provided function once for each element of the cssunparsedvalue.
... the cssunparsedvalue.foreach() method executes a provided function once for each element of the cssunparsedvalue.
... the cssunparsedvalue.foreach() method executes a provided function once for each element of the cssunparsedvalue.
...xecutes a provided function once for each element of the cssunparsedvalue.

CanvasImageSource - Web APIs

Web › API › CanvasImageSource

canvasimagesource provides a mechanism for other interfaces to be used as image sources for some methods of the canvasdrawimage and canvasfillstrokestyles interfaces.
...magesource provides a mechanism for other interfaces to be used as image sources for some methods of the canvasdrawimage and canvasfillstrokestyles interfaces.
...s a mechanism for other interfaces to be used as image sources for some methods of the canvasdrawimage and canvasfillstrokestyles interfaces.
...ther interfaces to be used as image sources for some methods of the canvasdrawimage and canvasfillstrokestyles interfaces.

CanvasRenderingContext2D.filter - Web APIs

Web › API › CanvasRenderingContext2D › filter

fects such as blurring and grayscaling.
...00% means completely sepia.
...('hello world', 50, 100); result applying multiple filters you can combine as many filters as you like.
...ny filters as you like.

CanvasRenderingContext2D.setLineDash() - Web APIs

Web › API › CanvasRenderingContext2D › setLineDash

d when stroking lines.
...array of values that specify alternating lengths of lines and gaps which describe the pattern.
... get copied and concatenated.
... line dash patterns.

Drawing text - Web APIs

Web › API › Canvas API › Tutorial › Drawing text

es two methods to render text: filltext(text, x, y [, maxwidth]) fills a given text at the given (x,y) position.
...lltext example the text is filled using the current fillstyle.
...e code <canvas id="canvas" width="400" height="200" class="playable-canvas"></canvas> <div class="playable-buttons"> <input id="edit" type="button" value="edit" /> <input id="reset" type="button" value="reset" /> </div> <textarea id="code" class="playable-code"> ctx.font = "48px serif"; ctx.textbaseline = "hanging"; ctx.stroketext("hello world", 0, 100);</textarea> var canvas = document.getelementbyid('canvas'); var ctx = canvas.getcontext('2d'); var textarea = document.getelementbyid('code'); var reset = document.getelementbyid('reset'); var edit = document.getelementbyid('edit'); var code = textarea.value; function drawcanvas() { ctx.clearrect(0, 0, canvas.width, canvas.height); eval(textarea.value); } reset.addeventlistener('click', function() { textarea.value = code; drawcanv...
...text measurements in the case you need to obtain more details about the text, the following method allows you to measure it.

Canvas tutorial - Web APIs

Web › API › Canvas API › Tutorial

<canvas> is an html element which can be used to draw graphics via scripting (usually javascript).
... <canvas> is an html element which can be used to draw graphics via scripting (usually javascript).
...d graphics, starting with the basics.
...u can do with canvas, and will provide code snippets that may get you started in building your own content.

ChildNode.replaceWith() - Web APIs

Web › API › ChildNode › replaceWith

domstring objects.
...nserted as equivalent text nodes.
...d childnode.replacewith((node or domstring)...
...de); } else if (currentnode.parentnode){ currentnode.parentnode.removechild(currentnode); } // the value of "i" below is after the decrement if (!i) // if currentnode is the first argument (currentnode === arguments[0]) parent.replacechild(currentnode, this); else // if currentnode isn't the first parent.insertbefore(currentnode, this.nextsibling); } } if (!element.prototype.replacewith) element.prototype.replacewith = replacewithpolyfill; if (!characterdata.prototype.replacewith) characterdata.prototype.replacewith = replacewithpolyfill; if (!documenttype.prototype.replacewith) documenttype.prototype.replacewith = replacewithpolyfill; specification specification status comment domthe definition of 'childnode.replacewit...

console.log() - Web APIs

Web › API › Console › log

cript objects with which to replace substitution strings within msg.
...n msg.
...mat of the output.
... for details.

Console.table() - Web APIs

Web › API › Console › table

displays tabular data as a table.
... collections of primitive types the data argument may be an array or an object.
...strings console.table(["apples", "oranges", "bananas"]); // an object whose properties are strings function person(firstname, lastname) { this.firstname = firstname; this.lastname = lastname; } var me = new person("john", "smith"); console.table(me); collections of compound types if the elements in the array, or properties in the object, are themselves arrays or objects, then their elements or properties are enumerated in the row, one per column: // an array of arrays var people = [["john", "smith"], ["jane", "doe"], ["emily", "jones"]] console.table(people); // an array of objects function person(firstname, lastname) { this.firstname = firstname; this.lastname = lastname; } var john = new person("john", "smith"); var jane = new person("jane", "doe"); var emily = new per...
...); note that if the array contains objects, then the columns are labeled with the property name.

DataTransferItemList.DataTransferItem() - Web APIs

Web › API › DataTransferItemList › DataTransferItem

atatransferitem object at the specified index in the item list.
...ex is less than zero or greater than or equal to the number of items in the list (as indicated by the list's length property, undefined is returned.
...tion drop_handler(ev) { console.log("drop"); ev.preventdefault(); var data = ev.datatransfer.items; // loop through the dropped items and log their data for (var i = 0; i < data.length; i++) { if ((data[i].kind == 'string') && (data[i].type.match('^text/plain'))) { // this item is the target node data[i].getasstring(function (s){ ev.target.appendchild(document.getelementbyid(s)); }); } else if ((data[i].kind == 'string') && (data[i].type.match('^text/html'))) { // drag data item is html data[i].getasstring(function (s){ console.log("...
...ver"); ev.preventdefault(); // set the dropeffect to move ev.datatransfer.dropeffect = "move" } function dragend_handler(ev) { console.log("dragend"); var datalist = ev.datatransfer.items; // clear any remaining drag data datalist.clear(); } html <div> <p id="source" ondragstart="dragstart_handler(event);" ondragend="dragend_handler(event);" draggable="true"> select this element, drag it to the drop zone and then release the selection to move the element.</p> </div> <div id="target" ondrop="drop_handler(event);" ondragover="dragover_handler(event);">drop zone</div> css div { margin: 0em; padding: 2em; } #source { color: blue; border: 1px solid black; } #target { border: 1px solid black; } result drag and drop demo link specifications specif...

DataTransferItemList.add() - Web APIs

Web › API › DataTransferItemList › add

exceptions notsupportederror a string data parameter was provided, and the list already contains an item whose kind is "plain unicode string" and whose type is equal to the specified type parameter.
...the list already contains an item whose kind is "plain unicode string" and whose type is equal to the specified type parameter.
...drop zone and then release the selection to move the element.</p> </div> <div id="target" ondrop="drop_handler(event);" ondragover="dragover_handler(event);">drop zone</div> css div { margin: 0em; padding: 2em; } #source { color: blue; border: 1px solid black; } #target { border: 1px solid black; } javascript function dragstart_handler(ev) { console.log("dragstart"); // add this element's id to the drag payload so the drop handler will // know which element to add to its tree var datalist = ev.datatransfer.items; datalist.add(ev.target.id, "text/plain"); // add some other items to the drag payload datalist.add("<p>...
...n drop_handler(ev) { console.log("drop"); ev.preventdefault(); var data = event.datatransfer.items; // loop through the dropped items and log their data for (var i = 0; i < data.length; i++) { if ((data[i].kind == 'string') && (data[i].type.match('^text/plain'))) { // this item is the target node data[i].getasstring(function (s){ ev.target.appendchild(document.getelementbyid(s)); }); } else if ((data[i].kind == 'string') && (data[i].type.match('^text/html'))) { // drag data item is html data[i].getasstring(function (s){ console.log("...

DataTransferItemList.clear() - Web APIs

Web › API › DataTransferItemList › clear

g drop, the drag data store is in read-only mode, and this method silently does nothing.
...es nothing.
...se the selection to move the element.</p> </div> <div id="target" ondrop="drop_handler(event);" ondragover="dragover_handler(event);">drop zone</div> css div { margin: 0em; padding: 2em; } #source { color: blue; border: 1px solid black; } #target { border: 1px solid black; } javascript function dragstart_handler(ev) { console.log("dragstart"); // add this element's id to the drag payload so the drop handler will // know which element to add to its tree var datalist = ev.datatransfer.items; datalist.add(ev.target.id, "text/plain"); // add some other items to the drag payload datalist.add("<p>...
...n drop_handler(ev) { console.log("drop"); ev.preventdefault(); var data = event.datatransfer.items; // loop through the dropped items and log their data for (var i = 0; i < data.length; i++) { if ((data[i].kind == 'string') && (data[i].type.match('^text/plain'))) { // this item is the target node data[i].getasstring(function (s){ ev.target.appendchild(document.getelementbyid(s)); }); } else if ((data[i].kind == 'string') && (data[i].type.match('^text/html'))) { // drag data item is html data[i].getasstring(function (s){ console.log("...

DataTransferItemList.length - Web APIs

Web › API › DataTransferItemList › length

= datatransferitemlist.length; value the number of drag data items in the list, or 0 if the list is empty or disabled.
...he list, or 0 if the list is empty or disabled.
...tion drop_handler(ev) { console.log("drop"); ev.preventdefault(); var data = ev.datatransfer.items; // loop through the dropped items and log their data for (var i = 0; i < data.length; i++) { if ((data[i].kind == 'string') && (data[i].type.match('^text/plain'))) { // this item is the target node data[i].getasstring(function (s){ ev.target.appendchild(document.getelementbyid(s)); }); } else if ((data[i].kind == 'string') && (data[i].type.match('^text/html'))) { // drag data item is html data[i].getasstring(function (s){ console.log("...
...ver"); ev.preventdefault(); // set the dropeffect to move ev.datatransfer.dropeffect = "move" } function dragend_handler(ev) { console.log("dragend"); var datalist = ev.datatransfer.items; // clear any remaining drag data datalist.clear(); } html <div> <p id="source" ondragstart="dragstart_handler(event);" ondragend="dragend_handler(event);" draggable="true"> select this element, drag it to the drop zone and then release the selection to move the element.</p> </div> <div id="target" ondrop="drop_handler(event);" ondragover="dragover_handler(event);">drop zone</div> css div { margin: 0em; padding: 2em; } #source { color: blue; border: 1px solid black; } #target { border: 1px solid black; } result drag and drop demo link specifications specif...

DataTransferItemList.remove() - Web APIs

Web › API › DataTransferItemList › remove

ta list to remove.
...the list, the list is left unchanged.
...n drop_handler(ev) { console.log("drop"); ev.preventdefault(); var data = event.datatransfer.items; // loop through the dropped items and log their data for (var i = 0; i < data.length; i++) { if ((data[i].kind == 'string') && (data[i].type.match('^text/plain'))) { // this item is the target node data[i].getasstring(function (s){ ev.target.appendchild(document.getelementbyid(s)); }); } else if ((data[i].kind == 'string') && (data[i].type.match('^text/html'))) { // drag data item is html data[i].getasstring(function (s){ console.log("...
..."); var datalist = ev.datatransfer.items; for (var i = 0; i < datalist.length; i++) { datalist.remove(i); } // clear any remaining drag data datalist.clear(); } html <h1>example uses of <code>datatransferitemlist</code> methods and property</h1> <div> <p id="source" ondragstart="dragstart_handler(event);" ondragend="dragend_handler(event);" draggable="true"> select this element, drag it to the drop zone and then release the selection to move the element.</p> </div> <div id="target" ondrop="drop_handler(event);" ondragover="dragover_handler(event);">drop zone</div> css div { margin: 0em; padding: 2em; } #source { color: blue; border: 1px solid black; } #target { border: 1px solid black; } specifications specification ...

Document: animationend event - Web APIs

Web › API › Document › animationend event

the animationend event is fired when a css animation has completed.
... the animationend event is fired when a css animation has completed.
...a css animation has completed.
...not fired.

Document.createNSResolver() - Web APIs

Web › API › Document › createNSResolver

the context of the node where it appeared within the document.
...upnamespaceuri on nodes in resolving the namespaceuri from a given prefix using the current information available in the node's hierarchy at the time lookupnamespaceuri is called.
...ion available in the node's hierarchy at the time lookupnamespaceuri is called.
...led.

Document.currentScript - Web APIs

Web › API › Document › currentScript

the document.currentscript property returns the <script> element whose script is currently being processed and isn't a javascript module.
... the document.currentscript property returns the <script> element whose script is currently being processed and isn't a javascript module.
... the document.currentscript property returns the <script> element whose script is currently being processed and isn't a javascript module.
...script property returns the <script> element whose script is currently being processed and isn't a javascript module.

Document: dragenter event - Web APIs

Web › API › Document › dragenter event

the dragenter event is fired when a dragged element or text selection enters a valid drop target.
... the dragenter event is fired when a dragged element or text selection enters a valid drop target.
... the dragenter event is fired when a dragged element or text selection enters a valid drop target.
... the dragenter event is fired when a dragged element or text selection enters a valid drop target.

Document.height - Web APIs

Web › API › Document › height

note: starting in gecko 6.0, document.height is no longer supported.
... note: starting in gecko 6.0, document.height is no longer supported.
...ing in gecko 6.0, document.height is no longer supported.
...o longer supported.

Document.onfullscreenchange - Web APIs

Web › API › Document › onfullscreenchange

fullscreenchangehandler; value an event handler which is invoked whenever the document receives a fullscreenchange event, indicating that the document is transitioning into or out of full-screen mode.
...screenchange event, indicating that the document is transitioning into or out of full-screen mode.
...pecify whether the transition is into or out of full-screen mode, so your event handler should look at the value of document.fullscreenelement.
...ment.fullscreenelement.

DocumentFragment.querySelector() - Web APIs

Web › API › DocumentFragment › querySelector

the documentfragment.queryselector() method returns the first element, or null if no matches are found, within the documentfragment (using depth-first pre-order traversal of the document's nodes) that matches the specified group of selectors.
... the documentfragment.queryselector() method returns the first element, or null if no matches are found, within the documentfragment (using depth-first pre-order traversal of the document's nodes) that matches the specified group of selectors.
...ches are found, within the documentfragment (using depth-first pre-order traversal of the document's nodes) that matches the specified group of selectors.
...used several times in the document, it returns the first matching element.

DocumentOrShadowRoot.getSelection() - Web APIs

Web › API › DocumentOrShadowRoot › getSelection

if it does.
...n object as a string, call its tostring() method directly: var selectedtext = selobj.tostring(); selobj is a selection object.
...ctedtext is a string (selected text).
...ed text).

How to create a DOM tree - Web APIs

Web › API › Document Object Model › How to create a DOM tree

ntry="usa"/> <address street="123 west st" city="seattle" state="wa" country="usa"/> <address street="321 south avenue" city="denver" state="co" country="usa"/> </person> </people> the w3c dom api, supported by mozilla, can be used to create an in-memory representation of this document like so: var doc = document.implementation.createdocument("", "", null); var peopleelem = doc.createelement("people"); var personelem1 = doc.createelement("person"); personelem1.setattribute("first-name", "eric"); personelem1.setattribute("middle-initial", "h"); personelem1.setattribute("last-name", "jung"); var addresselem1 = doc.createelement("address"); addresselem1.setattribute("street", "321 south st"); addresselem1.setattribute("city", "denver"); addresselem1.setattribute("state", "co"); addres...
...personelem1.setattribute("middle-initial", "h"); personelem1.setattribute("last-name", "jung"); var addresselem1 = doc.createelement("address"); addresselem1.setattribute("street", "321 south st"); addresselem1.setattribute("city", "denver"); addresselem1.setattribute("state", "co"); addresselem1.setattribute("country", "usa"); personelem1.appendchild(addresselem1); var addresselem2 = doc.createelement("address"); addresselem2.setattribute("street", "123 main st"); addresselem2.setattribute("city", "arlington"); addresselem2.setattribute("state", "ma"); addresselem2.setattribute("country", "usa"); personelem1.appendchild(addresselem2); var personelem2 = doc.createelement("person"); personelem2.setattribute("first-name", "jed"); personelem2.setattribute("last-name", "brown"); var addresselem3 ...
... addresselem2.setattribute("street", "123 main st"); addresselem2.setattribute("city", "arlington"); addresselem2.setattribute("state", "ma"); addresselem2.setattribute("country", "usa"); personelem1.appendchild(addresselem2); var personelem2 = doc.createelement("person"); personelem2.setattribute("first-name", "jed"); personelem2.setattribute("last-name", "brown"); var addresselem3 = doc.createelement("address"); addresselem3.setattribute("street", "321 north st"); addresselem3.setattribute("city", "atlanta"); addresselem3.setattribute("state", "ga"); addresselem3.setattribute("country", "usa"); personelem2.appendchild(addresselem3); var addresselem4 = doc.createelement("address"); addresselem4.setattribute("street", "123 west st"); addresselem4.setattribute("city", "seattle"); addresselem4.s...
...te", "ga"); addresselem3.setattribute("country", "usa"); personelem2.appendchild(addresselem3); var addresselem4 = doc.createelement("address"); addresselem4.setattribute("street", "123 west st"); addresselem4.setattribute("city", "seattle"); addresselem4.setattribute("state", "wa"); addresselem4.setattribute("country", "usa"); personelem2.appendchild(addresselem4); var addresselem5 = doc.createelement("address"); addresselem5.setattribute("street", "321 south avenue"); addresselem5.setattribute("city", "denver"); addresselem5.setattribute("state", "co"); addresselem5.setattribute("country", "usa"); personelem2.appendchild(addresselem5); peopleelem.appendchild(personelem1); peopleelem.appendchild(personelem2); doc.appendchild(peopleelem); see also the dom chapter of the xul tutorial.

Event.target - Web APIs

Web › API › Event › target

t interface is a reference to the object onto which the event was dispatched.
...ed.
...et when the event handler is called during the bubbling or capturing phase of the event.
...event.target; value eventtarget example the event.target property can be used in order to implement event delegation.

EventSource() - Web APIs

Web › API › EventSource › EventSource

he remote resource serving the events/messages.
...g the events/messages.
....
...tion.

EventSource.onmessage - Web APIs

Web › API › EventSource › onmessage

the onmessage property of the eventsource interface is an eventhandler called when a message event is received, that is when a message is coming from the source.
... the onmessage property of the eventsource interface is an eventhandler called when a message event is received, that is when a message is coming from the source.
... the onmessage property of the eventsource interface is an eventhandler called when a message event is received, that is when a message is coming from the source.
...erface is an eventhandler called when a message event is received, that is when a message is coming from the source.

File.webkitRelativePath - Web APIs

Web › API › File › webkitRelativePath

the file.webkitrelativepath is a read-only property that contains a usvstring which specifies the file's path relative to the directory selected by the user in an <input> element with its webkitdirectory attribute set.
...elected.
... or more directories.
...enerated and displayed.

GlobalEventHandlers.onanimationend - Web APIs

Web › API › GlobalEventHandlers › onanimationend

res when a css animation reaches the end of its active period (which is calculated as animation-duration * animation-iteration-count) + animation-delay).
...s animation reaches the end of its active period (which is calculated as animation-duration * animation-iteration-count) + animation-delay).
...get to that shortly.
... function log(msg, event) { let logbox = document.getelementbyid("log"); logbox.innerhtml += msg; if (event) { logbox.innerhtml += " <code>"+ event.animationname + "</code> at time " + event.elapsedtime.tofixed(2) + " seconds."; } logbox.innerhtml += "\n"; }; then we set up the event handlers for the animationstart and animationend events: let box = document.getelementbyid("box"); box.onanimationstart = function(event) { log("animation started", event); } box.onanimationend = function(event) { log("animation stopped", event); }; finally, we set up a handler for a click on the button that runs the animation: document.getelementbyid("play").addeventlistener("click", function(event) { document.getelementbyid("box").classname = "slideanimation"; event.

GlobalEventHandlers.onanimationstart - Web APIs

Web › API › GlobalEventHandlers › onanimationstart

an event handler for the animationstart event.
... an event handler for the animationstart event.
...get to that shortly.
... function log(msg, event) { let logbox = document.getelementbyid("log"); logbox.innerhtml += msg; if (event) { logbox.innerhtml += " <code>"+ event.animationname + "</code> at time " + event.elapsedtime.tofixed(2) + " seconds."; } logbox.innerhtml += "\n"; }; then we set up the event handlers for the animationstart and animationend events: let box = document.getelementbyid("box"); box.onanimationstart = function(event) { log("animation started", event); } box.onanimationend = function(event) { log("animation stopped", event); }; finally, we set up a handler for a click on the button that runs the animation: document.getelementbyid("play").addeventlistener("click", function(event) { document.getelementbyid("box").classname = "slideanimation"; event.

GlobalEventHandlers.oncuechange - Web APIs

Web › API › GlobalEventHandlers › oncuechange

the oncuechange property of the globaleventhandlers mixin is the eventhandler for processing cuechange events.
... the oncuechange property of the globaleventhandlers mixin is the eventhandler for processing cuechange events.
... the oncuechange property of the globaleventhandlers mixin is the eventhandler for processing cuechange events.
...thandlers mixin is the eventhandler for processing cuechange events.

GlobalEventHandlers.ondblclick - Web APIs

Web › API › GlobalEventHandlers › ondblclick

the ondblclick property of the globaleventhandlers mixin is an eventhandler that processes dblclick events on the given element.
... the ondblclick property of the globaleventhandlers mixin is an eventhandler that processes dblclick events on the given element.
...handlers mixin is an eventhandler that processes dblclick events on the given element.
...ction, this will be the element upon which the event was triggered.

GlobalEventHandlers.onfocus - Web APIs

Web › API › GlobalEventHandlers › onfocus

the onfocus property of the globaleventhandlers mixin is an eventhandler that processes focus events on the given element.
... the onfocus property of the globaleventhandlers mixin is an eventhandler that processes focus events on the given element.
... the onfocus property of the globaleventhandlers mixin is an eventhandler that processes focus events on the given element.
...y must be given the tabindex attribute (see building keyboard accessibility back in for more details).

GlobalEventHandlers.onmouseout - Web APIs

Web › API › GlobalEventHandlers › onmouseout

the onmouseout property of the globaleventhandlers mixin is an eventhandler that processes mouseout events.
... the onmouseout property of the globaleventhandlers mixin is an eventhandler that processes mouseout events.
... the onmouseout property of the globaleventhandlers mixin is an eventhandler that processes mouseout events.
...in is an eventhandler that processes mouseout events.

GlobalEventHandlers.onpointerdown - Web APIs

Web › API › GlobalEventHandlers › onpointerdown

the globaleventhandlers event handler onpointerdown is used to specify the event handler for the pointerdown event, which is fired when the pointing device is initially pressed.
...he pointerdown event isn't canceled through a call to preventdefault(), most user agents will fire a mousedown event, so that sites not using pointer events will work.
...n event for the target element, document, or window.
... be handled twice if we had a handler for those events in case pointer event support is missing.

GlobalEventHandlers.onsubmit - Web APIs

Web › API › GlobalEventHandlers › onsubmit

argument.
...oninvalid and onsubmit event handlers on a form.
....
...>please fill out all fields.</p> <label for="city">city</label> <input type="text" id="city" required> <button type="submit">submit</button> </form> <p id="thanks" hidden>your data has been received.

HTMLCollection - Web APIs

Web › API › HTMLCollection

the htmlcollection interface represents a generic collection (array-like object similar to arguments) of elements (in document order) and offers methods and properties for selecting from the list.
... the htmlcollection interface represents a generic collection (array-like object similar to arguments) of elements (in document order) and offers methods and properties for selecting from the list.
...ex is out of range.
...tmlcollection also exposes its members directly as properties by both name and index.

msSetVideoRectangle - Web APIs

Web › API › HTMLVideoElement › msSetVideoRectangle

non-standard this feature is non-standard and is not on a standards track.
...o not use it on production sites facing the web: it will not work for every user.
...s proprietary method is specific to internet explorer and microsoft edge.
...oelement.mssetvideorectangle(); parameters left a number representing left-side position.

IntersectionObserverEntry.boundingClientRect - Web APIs

Web › API › IntersectionObserverEntry › boundingClientRect

the intersectionobserverentry interface's read-only boundingclientrect property returns a domrectreadonly which in essence describes a rectangle describing the smallest rectangle that contains the entire target element.
... the intersectionobserverentry interface's read-only boundingclientrect property returns a domrectreadonly which in essence describes a rectangle describing the smallest rectangle that contains the entire target element.
...nly which in essence describes a rectangle describing the smallest rectangle that contains the entire target element.
... part of the target element whose intersection change is being described.

IntersectionObserverEntry.intersectionRect - Web APIs

Web › API › IntersectionObserverEntry › intersectionRect

the intersectionobserverentry interface's read-only intersectionrect property is a domrectreadonly object which describes the smallest rectangle that contains the entire portion of the target element which is currently visible within the intersection root.
... the intersectionobserverentry interface's read-only intersectionrect property is a domrectreadonly object which describes the smallest rectangle that contains the entire portion of the target element which is currently visible within the intersection root.
... element that's currently visible within the root's intersection rectangle.
...target's ancestors' clip rectangles, with the exception of the intersection root itself.

IntersectionObserverEntry.isIntersecting - Web APIs

Web › API › IntersectionObserverEntry › isIntersecting

the intersectionobserverentry interface's read-only isintersecting property is a boolean value which is true if the target element intersects with the intersection observer's root.
...rue if the target element intersects with the intersection observer's root.
...he transition is from intersecting to not-intersecting.
...k is used to update a counter of how many targeted elements are currently intersecting with the intersection root.

IntersectionObserverEntry.target - Web APIs

Web › API › IntersectionObserverEntry › target

the intersectionobserverentry interface's read-only target property indicates which targeted element has changed its amount of intersection with the intersection root.
... the intersectionobserverentry interface's read-only target property indicates which targeted element has changed its amount of intersection with the intersection root.
... indicates which targeted element has changed its amount of intersection with the intersection root.
...tionobserver.observe() experienced a change in intersection with the root.

KeyboardLayoutMap.forEach() - Web APIs

Web › API › KeyboardLayoutMap › forEach

the foreach() method of the keyboardlayoutmap interface executes a provided function once for each element of the map.
... the foreach() method of the keyboardlayoutmap interface executes a provided function once for each element of the map.
... the foreach() method of the keyboardlayoutmap interface executes a provided function once for each element of the map.
... interface executes a provided function once for each element of the map.

KeyboardLayoutMap - Web APIs

Web › API › KeyboardLayoutMap

f a given object's own enumerable property [key, value] pairs, in the same order as that provided by a for...in loop (the difference being that a for-in loop enumerates properties in the prototype chain as well).
...hat contains the keys for each index in the array.
...size read only returns the number of elements in the keyboardlayoutmap object.
... contains the values for each index in the keyboardlayoutmap object.

LayoutShiftAttribution - Web APIs

Web › API › LayoutShiftAttribution

the layoutshiftattribution interface of the layout instability api provides debugging information about elements which have shifted.
... the layoutshiftattribution interface of the layout instability api provides debugging information about elements which have shifted.
... the layoutshiftattribution interface of the layout instability api provides debugging information about elements which have shifted.
...ut instability api provides debugging information about elements which have shifted.

MSCandidateWindowShow - Web APIs

Web › API › MSCandidateWindowShow

ointer to an ihtmleventobj interface for the current event.
...is event fires after the positioning information of the ime candidate window has been determined.
...nly register for this event once per element (the handler will remain valid for the lifetime of the element).
...owclientrect() function to find out where the candidate window is and position the suggestion ui away from it: var context = document.getelementbyid("mysearchbox").msgetinputcontext(); context.addeventlistener("mscandidatewindowshow", candidatewindowshowhandler); function candidatewindowshowhandler(e) { var imerect = context.getcandidatewindowclientrect(); var suggestionrect = document.getelementbyid("mysuggestionlist").getboundingclientrect(); // check if the two rects intersect, and position them away from each other.

MediaDevices.getUserMedia() - Web APIs

Web › API › MediaDevices › getUserMedia

d to deal with this.
...ity concern associated with getusermedia() if used unexpectedly or without security being carefully managed, it can only be used in secure contexts.
...nto the address bar) cannot call getusermedia().
...ideo.onloadedmetadata = function(e) { video.play(); }; }) .catch(function(err) { console.log(err.name + ": " + err.message); }); frame rate lower frame-rates may be desirable in some cases, like webrtc transmissions with bandwidth restrictions.

MediaKeyStatusMap - Web APIs

Web › API › MediaKeyStatusMap

the mediakeystatusmap interface of the encryptedmediaextensions api is a read-only map of media key statuses by key ids.
...ion order.
...given key, or undefined if there is none.
...akeystatusmap.keys() read only returns a new iterator object containing keys for each element in the status map, in insertion order.

MediaSource - Web APIs

Web › API › MediaSource

the mediasource interface of the media source extensions api represents a source of media data for an htmlmediaelement object.
... the mediasource interface of the media source extensions api represents a source of media data for an htmlmediaelement object.
...ead only returns a sourcebufferlist object containing a subset of the sourcebuffer objects contained within mediasource.sourcebuffers — the list of objects providing the selected video track, enabled audio tracks, and shown/hidden text tracks.
...ource.sourcebuffers list.

MediaStream.onaddtrack - Web APIs

Web › API › MediaStream › onaddtrack

the mediastream.onaddtrack property is an eventhandler which specifies a function to be called when the addtrack event occurs on a mediastream instance.
...andler which specifies a function to be called when the addtrack event occurs on a mediastream instance.
...track event which has occurred.
... representing the track which was added is specified in the event's track property.

MediaStream.onremovetrack - Web APIs

Web › API › MediaStream › onremovetrack

the mediastream.onremovetrack property is an eventhandler which specifies a function to be called when the removetrack event occurs on a mediastream instance.
...hich specifies a function to be called when the removetrack event occurs on a mediastream instance.
...ccepts as input a mediastreamtrackevent object representing the removetrack event which has occurred.
...senting the removetrack event which has occurred.

MouseEvent.pageX - Web APIs

Web › API › MouseEvent › pageX

s how to access the mouse position information in every available coordinate system.
...tion in every available coordinate system.
...y; } box.addeventlistener("mousemove", updatedisplay, false); box.addeventlistener("mouseenter", updatedisplay, false); box.addeventlistener("mouseleave", updatedisplay, false); the javascript code uses addeventlistener() to register the function updatedisplay() as the event handler for the mousemove, mouseenter, and mouseleave events.
... y coordinates with the values of pagex and pagey.

MutationEvent - Web APIs

Web › API › MutationEvent

n event listeners.
... i.e.
...llowing is a list of all mutation events, as defined in dom level 3 events specification: domattrmodified domattributenamechanged domcharacterdatamodified domelementnamechanged domnodeinserted domnodeinsertedintodocument domnoderemoved domnoderemovedfromdocument domsubtreemodified usage you can register a listener for mutation events using eventtarget.addeventlistener() as follows: element.addeventlistener("domnodeinserted", function (event) { // ...
...mdocument domsubtreemodified usage you can register a listener for mutation events using eventtarget.addeventlistener() as follows: element.addeventlistener("domnodeinserted", function (event) { // ...

Node.lastChild - Web APIs

Web › API › Node › lastChild

the node.lastchild read-only property returns the last child of the node.
... the node.lastchild read-only property returns the last child of the node.
... the node.lastchild read-only property returns the last child of the node.
... the node.lastchild read-only property returns the last child of the node.

ParentNode.replaceChildren() - Web APIs

Web › API › ParentNode › replaceChildren

we give each of the buttons a click event handler, which collects together the selected options you want to transfer in one constant, and the existing options in the list you are transferring to in another constant.
..., which collects together the selected options you want to transfer in one constant, and the existing options in the list you are transferring to in another constant.
... you want to transfer in one constant, and the existing options in the list you are transferring to in another constant.
...isting options in the list you are transferring to in another constant.

RTCDataChannel: message event - Web APIs

Web › API › RTCDataChannel › message event

note: the message event uses as its event object type the messageevent interface defined by the html specification.
...ace defined by the html specification.
...es and acts on them by adding the data contained within the message to the current document as a new <p> (paragraph) element.
...child(textnode); document.body.appendchild(newparagraph); }, false); lines 2-4 create the new paragraph element and add the message data to it as a new text node.

RTCDataChannel.onclose - Web APIs

Web › API › RTCDataChannel › onclose

nel is created, then handlers for the open and close events are set up to enable and disable user interface objects based on the state of the channel.
...s are set up to enable and disable user interface objects based on the state of the channel.
... this way, the message entry field and the send button are only enabled for use when the connection is actually open.
...e only enabled for use when the connection is actually open.

RTCIceTransport: selectedcandidatepairchange event - Web APIs

Web › API › RTCIceTransport › selectedcandidatepairchange event

interface event event handler property onselectedcandidatepairchange examples this example creates an event handler for selectedcandidatepairchange that updates a display providing the user information about the progress of the ice negotiation for an rtcpeerconnection called pc.
...edcandidatepairchange examples this example creates an event handler for selectedcandidatepairchange that updates a display providing the user information about the progress of the ice negotiation for an rtcpeerconnection called pc.
...", ev => { let pair = icetransport.getselectedcandidatepair(); localprotoelem.innertext = pair.local.protocol.touppercase(); remoteprotoelem.innertext = pair.remote.protocol.touppercase(); }, false) this can also be done by setting the onselectedcandidatepairchange event handler property directly.
... localprotoelem.innertext = pair.local.protocol.touppercase(); remoteprotoelem.innertext = pair.remote.protocol.touppercase(); }, false) this can also be done by setting the onselectedcandidatepairchange event handler property directly.

RTCPeerConnection.ontrack - Web APIs

Web › API › RTCPeerConnection › ontrack

cribing the new track and how it's being used.
...resenting the new track, the rtcrtpreceiver and rtcrtptransceiver, and a list of mediastream objects which indicates which stream or streams the track is part of..
...ist of mediastream objects which indicates which stream or streams the track is part of..
...ment which will be used to display the incoming video.

RTCPeerConnection: track event - Web APIs

Web › API › RTCPeerConnection › track event

o the peer connection.
... a new track event handler.
...rconnection({ iceservers: [ { urls: "turn:fake.turnserver.url", username: "someusername", credential: "somepassword" } ] }); pc.addeventlistener("track", e => { videoelement.srcobject = e.streams[0]; hangupbutton.disabled = false; }, false); the event handler assigns the new track's first stream to an existing <video> element, identified using the variable videoelement.
... ] }); pc.addeventlistener("track", e => { videoelement.srcobject = e.streams[0]; hangupbutton.disabled = false; }, false); the event handler assigns the new track's first stream to an existing <video> element, identified using the variable videoelement.

Range.extractContents() - Web APIs

Web › API › Range › extractContents

tml id attributes are also cloned, which can lead to an invalid document if a partially-selected node is extracted and appended to the document.
...one or more item, and then click "swap" to move them to the opposite container.
...them to the opposite container.
...t1">123456</p> <button id="swap">swap selected item(s)</button> <p id="list2">abcdef</p> css body { pointer-events: none; } p { border: 1px solid; font-size: 2em; padding: .3em; } button { font-size: 1.2em; padding: .5em; pointer-events: auto; } javascript const list1 = document.getelementbyid('list1'); const list2 = document.getelementbyid('list2'); const button = document.getelementbyid('swap'); button.addeventlistener('click', e => { selection = window.getselection(); for (let i = 0; i < selection.rangecount; i++) { const range = selection.getrangeat(i); if (range.commonancestorcontainer === list1 || range.commonancestorcontainer.parentnode === list1) { const documentfragment = range.extractcontents(); list2.appendchild(documentfragment); ...

Range.selectNodeContents() - Web APIs

Web › API › Range › selectNodeContents

de of the start and end of the range will be the reference node.
...decontents(), and selection.addrange() are used to select the content.
...select the content.
...ranges() are used to deselect it.

ResizeObserverEntry.contentBoxSize - Web APIs

Web › API › ResizeObserverEntry › contentBoxSize

the contentboxsize read-only property of the resizeobserverentry interface returns an array containing the new content box size of the observed element when the callback is run.
... the contentboxsize read-only property of the resizeobserverentry interface returns an array containing the new content box size of the observed element when the callback is run.
...contentboxsize read-only property of the resizeobserverentry interface returns an array containing the new content box size of the observed element when the callback is run.
...e an object containing the new content box size of the observed element.

SVGRect - Web APIs

Web › API › SVGRect

dth="75" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="38.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgrect</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties svgrect.x the exact effect of this coordinate depends on each element.
...nospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgrect</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties svgrect.x the exact effect of this coordinate depends on each element.
...ach element.
...each element.if the attribute is not specified, the effect is as if a value of 0 were specified.

SVGTests - Web APIs

Web › API › SVGTests

the svgtests interface is used to reflect conditional processing attributes and is mixed into other interfaces for elements that support these attributes.
... the svgtests interface is used to reflect conditional processing attributes and is mixed into other interfaces for elements that support these attributes.
...face is used to reflect conditional processing attributes and is mixed into other interfaces for elements that support these attributes.
...se attributes.

Storage - Web APIs

Web › API › Storage

alled setstyles() that grabs the data items using storage.getitem() and uses those values to update page styles.
...es those values to update page styles.
...ction, populatestorage(), which uses storage.setitem() to set the item values, then runs setstyles().
...item('bgcolor', document.getelementbyid('bgcolor').value); localstorage.setitem('font', document.getelementbyid('font').value); localstorage.setitem('image', document.getelementbyid('image').value); } function setstyles() { var currentcolor = localstorage.getitem('bgcolor'); var currentfont = localstorage.getitem('font'); var currentimage = localstorage.getitem('image'); document.getelementbyid('bgcolor').value = currentcolor; document.getelementbyid('font').value = currentfont; document.getelementbyid('image').value = currentimage; htmlelem.style.backgroundcolor = '#' + currentcolor; pelem.style.fontfamily = currentfont; imgelem.setattribute('src', currentimage); } note: to see this running as a complete working example, see our web storage demo.

StylePropertyMapReadOnly.forEach() - Web APIs

Web › API › StylePropertyMapReadOnly › forEach

the stylepropertymapreadonly.foreach() method executes a provided function once for each element of stylepropertymapreadonly.
... the stylepropertymapreadonly.foreach() method executes a provided function once for each element of stylepropertymapreadonly.
... the stylepropertymapreadonly.foreach() method executes a provided function once for each element of stylepropertymapreadonly.
... a provided function once for each element of stylepropertymapreadonly.

TextTrack - Web APIs

Web › API › TextTrack

the texttrack interface—part of the api for handling webvtt (text tracks on media presentations)—describes and controls the text track associated with a particular <track> element.
... and end times.
...such as captions or subtitles, the active cues are currently being displayed.
...document from the ietf, just like the html lang attribute.

TextTrackList.onaddtrack - Web APIs

Web › API › TextTrackList › onaddtrack

the texttracklist property onaddtrack is an event handler which is called when the addtrack event occurs, indicating that a new text track has been added to the media element whose text tracks the texttracklist represents.
...y-added track.
...racklist.onaddtrack = eventhandler; value set onaddtrack to a function that accepts as input a trackevent object which indicates in its track property which video track has been added to the media.
...onaddtrack to a function that accepts as input a trackevent object which indicates in its track property which video track has been added to the media.

TransitionEvent - Web APIs

Web › API › TransitionEvent

so inherits properties from its parent event.
... is a domstring containing the name css property associated with the transition.
...nsition.
...nevent.elapsedtime read only is a float giving the amount of time the transition has been running, in seconds, when this event fired.

URL API - Web APIs

Web › API › URL API

url urlsearchparams older versions of the specification included an interface called urlutilsreadonly, which has since been merged into the workerlocation interface.
...he key's name, and the second column having the value.
...he value.
...g the table.

VideoTrack - Web APIs

Web › API › VideoTrack

the videotrack interface represents a single video track from a <video> element.
... the videotrack interface represents a single video track from a <video> element.
...tring if unknown.
... the language is specified as a bcp 47 (rfc 5646) language code, such as "en-us" or "pt-br".

VideoTrackList: change event - Web APIs

Web › API › VideoTrackList › change event

the change event is fired when a video track is made active or inactive, for example by changing the track's selected property.
... the change event is fired when a video track is made active or inactive, for example by changing the track's selected property.
...ddeventlistener(): const videoelement = document.queryselector('video'); videoelement.videotracks.addeventlistener('change', (event) => { console.log(`'${event.type}' event fired`); }); // changing the value of `selected` will trigger the `change` event const toggletrackbutton = document.queryselector('.toggle-track'); toggletrackbutton.addeventlistener('click', () => { const track = videoelement.videotracks[0]; track.selected = !track.selected; }); using the onchange event handler property: const videoelement = document.queryselector('video'); videoelement.videotracks.onchange = (event) => { console.log(`'${event.type}' event fired`); }; // changing the value of `selected` will trigger the `change` event const toggletrackbutton = document.queryselector('.toggle-track'); togglet...
...he onchange event handler property: const videoelement = document.queryselector('video'); videoelement.videotracks.onchange = (event) => { console.log(`'${event.type}' event fired`); }; // changing the value of `selected` will trigger the `change` event const toggletrackbutton = document.queryselector('.toggle-track'); toggletrackbutton.addeventlistener('click', () => { const track = videoelement.videotracks[0]; track.selected = !track.selected; }); specifications specification status html living standardthe definition of 'change' in that specification.

VideoTrackList.onaddtrack - Web APIs

Web › API › VideoTrackList › onaddtrack

the videotracklist property onaddtrack is an event handler which is called when the addtrack event occurs, indicating that a new video track has been added to the media element whose video tracks the videotracklist represents.
...-added track.
...acklist.onaddtrack = eventhandler; value set onaddtrack to a function that accepts as input a trackevent object which indicates in its track property which video track has been added to the media.
...naddtrack to a function that accepts as input a trackevent object which indicates in its track property which video track has been added to the media.

WebGL2RenderingContext.getBufferSubData() - Web APIs

Web › API › WebGL2RenderingContext › getBufferSubData

writes them to an arraybuffer or sharedarraybuffer.
...edarraybuffer.
...r used for storing uniform blocks.
... an invalid_operation error is generated if: zero is bound to target target is transform_feedback_buffer, and any transform feedback object is currently active.

WebGL2RenderingContext.texImage3D() - Web APIs

Web › API › WebGL2RenderingContext › texImage3D

the webglrenderingcontext.teximage3d() method of the webgl api specifies a three-dimensional texture image.
...ebgl api specifies a three-dimensional texture image.
...height, depth, border, format, type, glintptr offset); void gl.teximage3d(target, level, internalformat, width, height, depth, border, format, type, htmlcanvaselement source); void gl.teximage3d(target, level, internalformat, width, height, depth, border, format, type, htmlimageelement source); void gl.teximage3d(target, level, internalformat, width, height, depth, border, format, type, htmlvideoelement source); void gl.teximage3d(target, level, internalformat, width, height, depth, border, format, type, imagebitmap source); void gl.teximage3d(target, level, internalformat, width, height, depth, border, format, type, imagedata source); void gl.teximage3d(target, level, internalformat, width, height, depth, border, format, type, arraybufferview?
...d_short gl.short gl.unsigned_int gl.int gl.half_float gl.float gl.unsigned_int_2_10_10_10_rev gl.unsigned_int_10f_11f_11f_rev gl.unsigned_int_5_9_9_9_rev gl.unsigned_int_24_8 gl.float_32_unsigned_int_24_8_rev (pixels must be null) source one of the following objects can be used as a pixel source for the texture: arraybufferview, imagebitmap, imagedata, htmlimageelement, htmlcanvaselement, htmlvideoelement.

WebGLRenderingContext.bufferSubData() - Web APIs

Web › API › WebGLRenderingContext › bufferSubData

data); void gl.buffersubdata(target, offset, arraybufferview srcdata); // webgl2: void gl.buffersubdata(target, dstbyteoffset, arraybufferview srcdata, srcoffset, length); parameters target a glenum specifying the binding point (target).
...ffset, arraybufferview srcdata); // webgl2: void gl.buffersubdata(target, dstbyteoffset, arraybufferview srcdata, srcoffset, length); parameters target a glenum specifying the binding point (target).
... buffer used for pixel transfer operations.
... specifying the element index offset where to start reading the buffer.

WebGLRenderingContext.getVertexAttrib() - Web APIs

Web › API › WebGLRenderingContext › getVertexAttrib

ng the index of the vertex attribute.
...b_array_buffer_binding: returns the currently bound webglbuffer.
...ently bound webglbuffer.
...gl.vertex_attrib_array_type: returns a glenum representing the array type.

Basic scissoring - Web APIs

Web › API › WebGL API › By example › Basic scissoring

pplies this is a simple demonstration of a rendering with scissor().
... scissor().
...d changed several times during graphics operations before finally being written to the screen.
... background-color : black; } window.addeventlistener("load", function setupwebgl (evt) { "use strict" window.removeeventlistener(evt.type, setupwebgl, false); var paragraph = document.queryselector("p"); var canvas = document.queryselector("canvas"); // the following two lines set the size (in css pixels) of // the drawing buffer to be identical to the size of the // canvas html element, as determined by css.

Boilerplate 1 - Web APIs

Web › API › WebGL API › By example › Boilerplate 1

ty function to make webgl initialization easier.
...ntext by now you are quite used to seeing the same pieces of html, css, and javascript repeated again and again.
...s contains rules for body, canvas, and button.
... buffer, clears it black, and returns the initialized context.

Canvas size and WebGL - Web APIs

Web › API › WebGL API › By example › Canvas size and WebGL

« previousnext » this webgl example explores the effect of setting (or not setting) the canvas size to its element size in css pixels, as it appears in the browser window.
... « previousnext » this webgl example explores the effect of setting (or not setting) the canvas size to its element size in css pixels, as it appears in the browser window.
... set to the styled element size, determined by css.
...oes not seem to support html5 canvas.</canvas> <canvas>your browser does not seem to support html5 canvas.</canvas> body { text-align : center; } canvas { display : inline-block; width : 120px; height : 80px; margin : auto; padding : 0; border : none; background-color : black; } window.addeventlistener("load", function() { "use strict" var firstcanvas = document.getelementsbytagname("canvas")[0], secondcanvas = document.getelementsbytagname("canvas")[1]; firstcanvas.width = firstcanvas.clientwidth; firstcanvas.height = firstcanvas.clientheight; [firstcanvas, secondcanvas].foreach(function(canvas) { var gl = canvas.getcontext("webgl") || canvas.getcontext("experimental-webgl"); if (!gl) { document.queryselector("p").innerhtml = ...

Detect WebGL - Web APIs

Web › API › WebGL API › By example › Detect WebGL

« previousnext » this example demonstrates how to detect a webgl rendering context and reports the result to the user.
...load event handler, to make sure // dom is fully loaded and styled before trying to manipulate it.
...aragraph = document.queryselector("p"), button = document.queryselector("button"); // adding click event handler to button.
...eryselector("button"); // adding click event handler to button.

Animating textures in WebGL - Web APIs

Web › API › WebGL API › Tutorial › Animating textures in WebGL

et started.
...h.
... in the video video.addeventlistener('playing', function() { playing = true; checkready(); }, true); video.addeventlistener('timeupdate', function() { timeupdate = true; checkready(); }, true); video.src = url; video.play(); function checkready() { if (playing && timeupdate) { copyvideo = true; } } return video; } first we create a video element.
...format = gl.rgba; const srctype = gl.unsigned_byte; gl.bindtexture(gl.texture_2d, texture); gl.teximage2d(gl.texture_2d, level, internalformat, srcformat, srctype, video); } you've seen this code before.

WebGL model view projection - Web APIs

Web › API › WebGL API › WebGL model view projection

le will create a custom webglbox object that will draw a 2d box on the screen.
...l.float, false, 0, 0); // setup the color uniform that will be shared across all triangles gl.uniform4fv(this.colorlocation, settings.color); // draw the triangles to the screen gl.drawarrays(gl.triangles, 0, 6); } the shaders are the bits of code written in glsl that take our data points and ultimately render them to the screen.
...e program through the custom function mdn.createwebglprogramfromids().
...s().

Web Animations API Concepts - Web APIs

Web › API › Web Animations API › Web Animations API Concepts

nother, or we can use variables, loops, and callbacks to create interactive animations that adapt and react to changing inputs.
...future—e.g.
...tures we had in flash.
...s more straightforward, declarative animations like those css creates.

Window: animationend event - Web APIs

Web › API › Window › animationend event

the animationend event is fired when a css animation has completed.
... the animationend event is fired when a css animation has completed.
...a css animation has completed.
...s not fired.

Window.getSelection() - Web APIs

Web › API › Window › getSelection

use a selection object as a string, call its tostring() method directly: var selectedtext = selobj.tostring(); selobj is a selection object.
...ectly: var selectedtext = selobj.tostring(); selobj is a selection object.
...works identically to window.getselection().
...getselection().

msGetRegionContent - Web APIs

Web › API › msGetRegionContent

s facing the web: it will not work for every user.
...sponding to the content from the region flow that is positioned in the region.
...ax var retval = element.msgetregioncontent(); parameters retval [out, reval] type: msrangecollection the name of the property to enable.
...); parameters retval [out, reval] type: msrangecollection the name of the property to enable.

Using the article role - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the article role

g posts, newspaper or magazine articles and use-submitted comments.
...e articles and use-submitted comments.
...ts user-submitted comments could represent the comments as articles nested within the article for the web log entry.
...user agents and assistive technology when the user navigates an element assigned the role of article, assistive technologies that typically intercept standard keyboard events should switch to document browsing mode, as opposed to passing keyboard events through to the web application.

Using the status role - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the status role

description this technique demonstrates how to use the status role and describes the effect it has on browsers and assistive technology.
... object, and it should be ensured that this object does not receive focus.
...ld be ensured that this object does not receive focus.
...age controls what appears in the status, the relationship should be made explicit via the aria-controls attribute.

Using ARIA: Roles, states, and properties - Accessibility

Web › Accessibility › ARIA › ARIA Techniques

aria defines semantics that can be applied to elements, with these divided into roles (defining a type of user interface element) and states and properties that are supported by a role.
... aria defines semantics that can be applied to elements, with these divided into roles (defining a type of user interface element) and states and properties that are supported by a role.
... aria defines semantics that can be applied to elements, with these divided into roles (defining a type of user interface element) and states and properties that are supported by a role.
... aria defines semantics that can be applied to elements, with these divided into roles (defining a type of user interface element) and states and properties that are supported by a role.

ARIA: heading role - Accessibility

Web › Accessibility › ARIA › Roles › heading role

the heading role defines this element as a heading to a page or section.
...age or section.
...quired javascript features required event handlers none.
...attribute should only be used to retrofit accessibility on legacy code that you cannot make major changes to.

-moz-outline-radius-bottomleft - CSS: Cascading Style Sheets

Web › CSS › -moz-outline-radius-bottomleft

in mozilla applications, the -moz-outline-radius-bottomleft css property can be used to round the bottom-left corner of an element's outline.
...-outline-radius-bottomleft css property can be used to round the bottom-left corner of an element's outline.
...oz-outline-radius-bottomleft is either a css <length> or a percentage of the corresponding dimensions of the border box.
...ction may be used as well.

-moz-outline-radius-bottomright - CSS: Cascading Style Sheets

Web › CSS › -moz-outline-radius-bottomright

in mozilla applications, the -moz-outline-radius-bottomright css property can be used to round the bottom-right corner of an element's outline.
...line-radius-bottomright css property can be used to round the bottom-right corner of an element's outline.
...outline-radius-bottomright is either a css <length> or a percentage of the corresponding dimensions of the border box.
...on may be used as well.

-moz-outline-radius-topleft - CSS: Cascading Style Sheets

Web › CSS › -moz-outline-radius-topleft

in mozilla applications, the -moz-outline-radius-topleft css property can be used to round the top-left corner of an element's outline.
...ns, the -moz-outline-radius-topleft css property can be used to round the top-left corner of an element's outline.
...lue of -moz-outline-radius-topleft is either a css <length> or a percentage of the corresponding dimensions of the border box.
...alc() function may be used as well.

-moz-outline-radius-topright - CSS: Cascading Style Sheets

Web › CSS › -moz-outline-radius-topright

in mozilla applications, the -moz-outline-radius-topright css property can be used to round the top-right corner of an element's outline.
...the -moz-outline-radius-topright css property can be used to round the top-right corner of an element's outline.
... of -moz-outline-radius-topright is either a css <length> or a percentage of the corresponding dimensions of the border box.
...() function may be used as well.

:-moz-focusring - CSS: Cascading Style Sheets

Web › CSS › :-moz-focusring

the :-moz-focusring css pseudo-class is a mozilla extension that is similar to the :focus pseudo-class, but it only matches an element if it's currently focused and a focus ring or other indicator should be drawn around it.
... the :-moz-focusring css pseudo-class is a mozilla extension that is similar to the :focus pseudo-class, but it only matches an element if it's currently focused and a focus ring or other indicator should be drawn around it.
...depend on operating system settings and other factors, so the precise behavior of this pseudo-class will vary from platform to platform.
...from platform to platform.

::-webkit-scrollbar - CSS: Cascading Style Sheets

Web › CSS › ::-webkit-scrollbar

the ::-webkit-scrollbar css pseudo-element affects the style of the scrollbar of an element.
... the ::-webkit-scrollbar css pseudo-element affects the style of the scrollbar of an element.
...g handle.
...ible otherwise if width/height is specified) */ .mostly-customized-scrollbar::-webkit-scrollbar { width: 5px; height: 8px; background-color: #aaa; /* or add it to the track */ } /* add a thumb */ .mostly-customized-scrollbar::-webkit-scrollbar-thumb { background: #000; } <div class="visible-scrollbar"> etiam sagittis sem sed lacus laoreet, eu fermentum eros auctor.

::selection - CSS: Cascading Style Sheets

Web › CSS › ::selection

the ::selection css pseudo-element applies styles to the part of a document that has been highlighted by the user (such as clicking and dragging the mouse across text).
...ust have a contrast ratio of 4.5:1, or 3:1 for larger text such as headings.
... understanding wcag 2.0 specifications specification status comment css pseudo-elements level 4the definition of '::selection' in that specification.
...el 4the definition of '::selection' in that specification.

:any-link - CSS: Cascading Style Sheets

Web › CSS › :any-link

the :any-link css pseudo-class selector represents an element that acts as the source anchor of a hyperlink, independent of whether it has been visited.
... the :any-link css pseudo-class selector represents an element that acts as the source anchor of a hyperlink, independent of whether it has been visited.
... the :any-link css pseudo-class selector represents an element that acts as the source anchor of a hyperlink, independent of whether it has been visited.
... the :any-link css pseudo-class selector represents an element that acts as the source anchor of a hyperlink, independent of whether it has been visited.

:disabled - CSS: Cascading Style Sheets

Web › CSS › :disabled

the :disabled css pseudo-class represents any disabled element.
... the :disabled css pseudo-class represents any disabled element.
... the :disabled css pseudo-class represents any disabled element.
...xt" placeholder="name" disabled> <input type="text" placeholder="address" disabled> <input type="text" placeholder="zip code" disabled> </fieldset> </form> css input[type="text"]:disabled { background: #ccc; } javascript // wait for the page to finish loading document.addeventlistener('domcontentloaded', function () { // attach `change` event listener to checkbox document.getelementbyid('billing-checkbox').onchange = togglebilling; }, false); function togglebilling() { // select the billing text fields var billingitems = document.queryselectorall('#billing input[type="text"]'); // toggle the billing text fields for (var i = 0; i < billingitems.length; i++) { billingitems[i].disabled = !billingitems[i].disabled; } } result specifications specifi...

:enabled - CSS: Cascading Style Sheets

Web › CSS › :enabled

the :enabled css pseudo-class represents any enabled element.
... the :enabled css pseudo-class represents any enabled element.
... the :enabled css pseudo-class represents any enabled element.
... activated (selected, clicked on, typed into, etc.) or accept focus.

:first-child - CSS: Cascading Style Sheets

Web › CSS › :first-child

the :first-child css pseudo-class represents the first element among a group of sibling elements.
... the :first-child css pseudo-class represents the first element among a group of sibling elements.
... the :first-child css pseudo-class represents the first element among a group of sibling elements.
...2</li> <li>item 3 <ul> <li>item 3.1</li> <li>item 3.2</li> <li>item 3.3</li> </ul> </li> </ul> css ul li { color: blue; } ul li:first-child { color: red; font-weight: bold; } result specifications specification status comment selectors level 4the definition of ':first-child' in that specification.

:focus-visible - CSS: Cascading Style Sheets

Web › CSS › :focus-visible

the :focus-visible pseudo-class applies while an element matches the :focus pseudo-class and the ua (user agent) determines via heuristics that the focus should be made evident on the element.
...pports similar functionality through an older, prefixed pseudo-class — :-moz-focusring.
...nly">:focus only</button><br> <input class="focus-visible-only" value=":focus-visible only"><br> <button class="focus-visible-only">:focus-visible only</button> input, button { margin: 10px; } .focus-only:focus { outline: 2px solid black; } .focus-visible-only:focus-visible { outline: 4px dashed darkorange; } selectively showing the focus indicator a custom control, such as a custom element button, can use :focus-visible to selectively apply a focus indicator only on keyboard-focus.
...t least 3 to 1.

:in-range - CSS: Cascading Style Sheets

Web › CSS › :in-range

the :in-range css pseudo-class represents an <input> element whose current value is within the range limits specified by the min and max attributes.
...in the range limits specified by the min and max attributes.
...when it has a range specified, and its value is inside that range */ input:in-range { background-color: rgba(0, 255, 0, 0.25); } this pseudo-class is useful for giving the user a visual indication that a field's current value is within the permitted limits.
...ackground-color: rgba(255, 0, 0, 0.25); border: 2px solid red; } input:in-range + label::after { content: 'okay.'; } input:out-of-range + label::after { content: 'out of range!'; } result specifications specification status comment html living standardthe definition of ':in-range' in that specification.

:last-child - CSS: Cascading Style Sheets

Web › CSS › :last-child

the :last-child css pseudo-class represents the last element among a group of sibling elements.
... the :last-child css pseudo-class represents the last element among a group of sibling elements.
... the :last-child css pseudo-class represents the last element among a group of sibling elements.
.../li> <li>item 3 <ul> <li>item 3.1</li> <li>item 3.2</li> <li>item 3.3</li> </ul> </li> </ul> css ul li { color: blue; } ul li:last-child { border: 1px solid red; color: red; } result specifications specification status comment selectors level 4the definition of ':last-child' in that specification.

:link - CSS: Cascading Style Sheets

Web › CSS › :link

the :link css pseudo-class represents an element that has not yet been visited.
... the :link css pseudo-class represents an element that has not yet been visited.
... yet */ a:link { color: red; } styles defined by the :link pseudo-class will be overridden by any subsequent link-related pseudo-class (:active, :hover, or :visited) that has at least equal specificity.
...specification.

:nth-last-of-type() - CSS: Cascading Style Sheets

Web › CSS › :nth-last-of-type

the :nth-last-of-type() css pseudo-class matches elements of a given type, based on their position among a group of siblings, counting from the end.
... the :nth-last-of-type() css pseudo-class matches elements of a given type, based on their position among a group of siblings, counting from the end.
... <p> element among any group of siblings, counting backwards from the last one */ p:nth-last-of-type(4n) { color: lime; } note: this pseudo-class is essentially the same as :nth-of-type, except it counts items backwards from the end, not forwards from the beginning.
...mphasized.</em> <span>wow, this span gets limed!!!</span> <strike>this is struck through.</strike> <span>here is one last span.</span> </div> css span:nth-last-of-type(2) { background-color: lime; } result specifications specification status comment selectors level 4the definition of ':nth-last-of-type' in that specification.

:only-child - CSS: Cascading Style Sheets

Web › CSS › :only-child

the :only-child css pseudo-class represents an element without any siblings.
... the :only-child css pseudo-class represents an element without any siblings.
... <div>i am an only child.</div> </div> <div> <div>i am the 1st sibling.</div> <div>i am the 2nd sibling.</div> <div>i am the 3rd sibling, <div>but this is an only child.</div></div> </div> css div:only-child { color: red; } div { display: inline-block; margin: 6px; outline: 1px solid; } result a list example html <ol> <li>first <ul> <li>this list has just one element.</li> </ul> </li> <li>second <ul> <li>this list has three elements.</li> <li>this list has three elements.</li> <li>this list has three elements.</li> </ul> </li> </ol> css li li { list-style-type: disc; } li:only-child { color: red; list-style-type: square; } result specifications specification status comment selector...
... <li>this list has three elements.</li> <li>this list has three elements.</li> </ul> </li> </ol> css li li { list-style-type: disc; } li:only-child { color: red; list-style-type: square; } result specifications specification status comment selectors level 4the definition of ':only-child' in that specification.

:out-of-range - CSS: Cascading Style Sheets

Web › CSS › :out-of-range

the :out-of-range css pseudo-class represents an <input> element whose current value is outside the range limits specified by the min and max attributes.
... range limits specified by the min and max attributes.
...t has a range specified, and its value is outside that range */ input:out-of-range { background-color: rgba(255, 0, 0, 0.25); } this pseudo-class is useful for giving the user a visual indication that a field's current value is outside the permitted limits.
...d-color: rgba(255, 0, 0, 0.25); border: 2px solid red; } input:in-range + label::after { content: 'okay.'; } input:out-of-range + label::after { content: 'out of range!'; } result specifications specification status comment html living standardthe definition of ':out-of-range' in that specification.

@charset - CSS: Cascading Style Sheets

Web › CSS › @charset

the @charset css at-rule specifies the character encoding used in the style sheet.
... the @charset css at-rule specifies the character encoding used in the style sheet.
...css at-rule specifies the character encoding used in the style sheet.
...der (and stop as soon as one yields a result) : the value of the unicode byte-order character placed at the beginning of the file.

display-mode - CSS: Cascading Style Sheets

Web › CSS › @media › display-mode

description fallback display mode fullscreen all of the available display area is used and no user agent chrome is shown.
...en all of the available display area is used and no user agent chrome is shown.
...lone application.
...plication having a different window, its own icon in the application launcher, etc.

Resizing background images with background-size - CSS: Cascading Style Sheets

Web › CSS › CSS Backgrounds and Borders › Resizing background images

the background-size css property lets you resize the background image of an element, overriding the default behavior of tiling the image at its full size by specifying the width and/or height of the image.
...verriding the default behavior of tiling the image at its full size by specifying the width and/or height of the image.
...ain and cover.
...px solid; color: pink; resize: both; overflow: scroll; } result cover the cover value specifies that the background image should be sized so that it is as small as possible while ensuring that both dimensions are greater than or equal to the corresponding size of the container.

CSS Backgrounds and Borders - CSS: Cascading Style Sheets

Web › CSS › CSS Backgrounds and Borders

styles in the css backgrounds and borders module allow filling backgrounds with color or an image (clipped or resized), or modifying them in other ways.
...der-left border-left-color border-left-style border-left-width border-radius border-right border-right-color border-right-style border-right-width border-style border-top border-top-color border-top-left-radius border-top-right-radius border-top-style border-top-width border-width box-shadow tools using multiple backgrounds explains how to set one or more backgrounds on an element.
...der-right-width border-style border-top border-top-color border-top-left-radius border-top-right-radius border-top-style border-top-width border-width box-shadow tools using multiple backgrounds explains how to set one or more backgrounds on an element.
...ng css an overview of how css color can be used in html, including for borders.

Using CSS counters - CSS: Cascading Style Sheets

Web › CSS › CSS Lists and Counters › Using CSS counters

not be "none", "inherit", or "initial"; otherwise the declaration is ignored.
...(name, style)'.
...of section counter, and a colon before the content of each h3 */ } html <h3>introduction</h3> <h3>body</h3> <h3>conclusion</h3> result nesting counters a css counter can be especially useful for making outlined lists, because a new instance of the counter is automatically created in child elements.
...e of the counter is automatically created in child elements.

Understanding CSS z-index - CSS: Cascading Style Sheets

Web › CSS › CSS Positioning › Understanding z index

in the most basic cases, html pages can be considered two-dimensional, because text, images, and other elements are arranged on the page without overlapping.
... in the most basic cases, html pages can be considered two-dimensional, because text, images, and other elements are arranged on the page without overlapping.
...e z position of each layer is expressed as an integer representing the stacking order for rendering.
...ct.

Basic Shapes - CSS: Cascading Style Sheets

Web › CSS › CSS Shapes › Basic Shapes

basic shapes, as it defines each shape's coordinate system.
...t seem very useful as simply floating an item will give you a rectangular shape around it.
... is set to the first value, the left and right are set to the second, and the bottom is set to the third.
...e an ellipse with an x radius of 40%, a y radius of 50% and the position being left.

Shapes from box values - CSS: Cascading Style Sheets

Web › CSS › CSS Shapes › From box values

that you can have something in your page with a curved border, and your shape can follow the created shape.
...ur content around the edges defined by these values.
...ow.
...this is by nature only going to work with very simple shapes that can be defined using the well-supported border-radius property.

Class selectors - CSS: Cascading Style Sheets

Web › CSS › Class selectors

the css class selector matches elements based on the contents of their class attribute.
... the css class selector matches elements based on the contents of their class attribute.
... the css class selector matches elements based on the contents of their class attribute.
... the css class selector matches elements based on the contents of their class attribute.

Using media queries - CSS: Cascading Style Sheets

Web › CSS › Media Queries › Using media queries

ul when you want to modify your site or app depending on a device's general type (such as print vs.
...milar.
..., as specified in the web app manifest's display member defined in the web app manifest spec.
...res instead.

Mozilla CSS extensions - CSS: Cascading Style Sheets

Web › CSS › Mozilla Extensions

mozilla applications such as firefox support a number of special mozilla extensions to css, including properties, values, pseudo-elements and pseudo-classes, at-rules, and media queries.
... mozilla extensions to css, including properties, values, pseudo-elements and pseudo-classes, at-rules, and media queries.
...r-textfield spinner-upbutton statusbar statusbarpanel tab tabpanels tab-scroll-arrow-back tab-scroll-arrow-forward textfield textfield-multiline toolbar toolbarbutton-dropdown toolbox tooltip treeheadercell treeheadersortarrow treeitem treetwisty treetwistyopen treeview window background-image gradients -moz-linear-gradient -moz-radial-gradient elements -moz-element sub-images -moz-image-rect() border-color -moz-use-text-colorobsolete since gecko 52 (removed in bug 1306214); use currentcolor instead.
... -moz-urdu overflow -moz-scrollbars-none -moz-scrollbars-horizontal -moz-scrollbars-vertical -moz-hidden-unscrollable text-align -moz-center -moz-left -moz-right text-decoration -moz-anchor-decoration -moz-user-select -moz-all -moz-none width, min-width, and max-width -moz-min-content -moz-fit-content -moz-max-content -moz-available pseudo-elements and pseudo-classes a – d ::-moz-anonymous-block eg@:- bug 331432 ::-moz-anonymous-positioned-block :-moz-any :-moz-any-link [matches :link and :visited] :-moz-broken ::-moz-canvas ::-moz-color-swatch ::-moz-cell-content :-moz-drag-over f – i :-moz-first-node ::-moz-focus-inner ::-moz-focus-outer :-moz-focusring :-moz-full-screen :-moz-full-screen-ancestor :-moz...

Selector list - CSS: Cascading Style Sheets

Web › CSS › Selector list

the css selector list (,) selects all the matching nodes.
... the css selector list (,) selects all the matching nodes.
... the css selector list (,) selects all the matching nodes.
... the css selector list (,) selects all the matching nodes.

Type selectors - CSS: Cascading Style Sheets

Web › CSS › Type selectors

the css type selector matches elements by node name.
... the css type selector matches elements by node name.
... the css type selector matches elements by node name.
... the css type selector matches elements by node name.

WebKit CSS extensions - CSS: Cascading Style Sheets

Web › CSS › WebKit Extensions

webkit-any() :-webkit-any-link* :-webkit-autofill :-webkit-autofill-strong-password :-webkit-drag :-webkit-full-page-media :-webkit-full-screen* :-webkit-full-screen-ancestor :-webkit-full-screen-document :-webkit-full-screen-controls-hidden * now standard.
...bkit-drag :-webkit-full-page-media :-webkit-full-screen* :-webkit-full-screen-ancestor :-webkit-full-screen-document :-webkit-full-screen-controls-hidden * now standard.
...t-media-controls-play-button ::-webkit-media-controls-timeline ::-webkit-media-controls-time-remaining-display ::-webkit-media-controls-toggle-closed-captions-button ::-webkit-media-controls-volume-control-container ::-webkit-media-controls-volume-control-hover-background ::-webkit-media-controls-volume-slider ::-webkit-meter-bar ::-webkit-meter-even-less-good-value ::-webkit-meter-inner-element ::-webkit-meter-optimum-value ::-webkit-meter-suboptimum-value -webkit-media-text-track-container ::-webkit-outer-spin-button ::-webkit-progress-bar ::-webkit-progress-inner-element ::-webkit-progress-value ::-webkit-search-cancel-button ::-webkit-search-results-button ::-webkit-slider-runnable-track ::-webkit-slider-thumb note: generally, if there is an invalid pseudo-element or p...
... ::-webkit-outer-spin-button ::-webkit-progress-bar ::-webkit-progress-inner-element ::-webkit-progress-value ::-webkit-search-cancel-button ::-webkit-search-results-button ::-webkit-slider-runnable-track ::-webkit-slider-thumb note: generally, if there is an invalid pseudo-element or pseudo-class within in a chain or group of selectors, the whole selector list is invalid.

aspect-ratio - CSS: Cascading Style Sheets

Web › CSS › aspect-ratio

ich will be used in the calculation of auto sizes and some other layout functions.
...io, otherwise the box has no preferred aspect ratio.
...sions of the box specified by box-sizing.
...by box-sizing.

background-position - CSS: Cascading Style Sheets

Web › CSS › background-position

d-position: bottom 10px right; background-position: top right 10px; /* global values */ background-position: inherit; background-position: initial; background-position: unset; the background-position property is specified as one or more <position> values, separated by commas.
...t puts the right edge of the 300px-wide image in the center of the container) it's worth mentioning that if your background-size is equal to the container size for a given axis, then a percentage position for that axis will have no effect because the "container-image difference" will be zero.
...entage> ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ center | [ left | right ] <length-percentage>?
... ] <length-percentage>?

background-repeat - CSS: Cascading Style Sheets

Web › CSS › background-repeat

repeated.
...he vertical behavior.
...tion is 300px wide, and then another image will be added.
... specification status comment css backgrounds and borders module level 3the definition of 'background-repeat' in that specification.

background - CSS: Cascading Style Sheets

Web › CSS › background

guideline 1.1 explanations understanding success criterion 1.1.1 | w3c understanding wcag 2.0 formal definition initial valueas each of the properties of the shorthand:background-image: nonebackground-position: 0% 0%background-size: auto autobackground-repeat: repeatbackground-origin: padding-boxbackground-clip: border-boxbackground-attachment: scrollbackground-color: transparentapplies toall elements.
...ntage> ] | [ center | [ left | right ] <length-percentage>?
...t-y | [ repeat | space | round | no-repeat ]{1,2}<attachment> = scroll | fixed | local<box> = border-box | padding-box | content-boxwhere <image> = <url> | <image()> | <image-set()> | <element()> | <paint()> | <cross-fade()> | <gradient><length-percentage> = <length> | <percentage>where <image()> = image( <image-tags>?
...t | space | round | no-repeat ]{1,2}<attachment> = scroll | fixed | local<box> = border-box | padding-box | content-boxwhere <image> = <url> | <image()> | <image-set()> | <element()> | <paint()> | <cross-fade()> | <gradient><length-percentage> = <length> | <percentage>where <image()> = image( <image-tags>?

border-block-start-width - CSS: Cascading Style Sheets

Web › CSS › border-block-start-width

the border-block-start-width css property defines the width of the logical block-start border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation.
... you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...e examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
..., and border-inline-end-width, which define the other border widths of the element.

border-bottom-width - CSS: Cascading Style Sheets

Web › CSS › border-bottom-width

the border-bottom-width css property sets the width of the bottom border of an element.
...thick a thick border note: because the specification doesn't define the exact thickness denoted by each keyword, the precise result when using one of them is implementation-specific.
...he values are constant within a single document.
...t within a single document.

border-end-end-radius - CSS: Cascading Style Sheets

Web › CSS › border-end-end-radius

the border-end-end-radius css property defines a logical border radius on an element, which maps to a physical border radius that depends on on the element's writing-mode, direction, and text-orientation.
...tage> denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse.
...axes of the ellipse.
...lowed by the css <length> data type.

border-end-start-radius - CSS: Cascading Style Sheets

Web › CSS › border-end-start-radius

the border-end-start-radius css property defines a logical border radius on an element, which maps to a physical border radius depending on the element's writing-mode, direction, and text-orientation.
...tage> denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse.
...axes of the ellipse.
...lowed by the css <length> data type.

border-image-repeat - CSS: Cascading Style Sheets

Web › CSS › border-image-repeat

the border-image-repeat css property defines how the edge regions of a source image are adjusted to fit the dimensions of an element's border image.
...chieve the proper fit.
...he source image's edge regions are tiled (repeated) to fill the gap between each border.
...y out various border repetition rules on me!</div> <select id="repetition"> <option value="stretch">stretch</option> <option value="repeat">repeat</option> <option value="round">round</option> <option value="space">space</option> <option value="stretch repeat">stretch repeat</option> <option value="space round">space round</option> </select> javascript var repetition = document.getelementbyid("repetition"); repetition.addeventlistener("change", function (evt) { document.getelementbyid("bordered").style.borderimagerepeat = evt.target.value; }); results specifications specification status comment css backgrounds and borders module level 3the definition of 'border-image-repeat' in that specification.

border-image-width - CSS: Cascading Style Sheets

Web › CSS › border-image-width

the border-image-width css property sets the width of an element's border image.
... the border-image-width css property sets the width of an element's border image.
... of the border, specified as a multiple of the corresponding border-width.
...ultiple of the corresponding border-width.

border-inline-end-color - CSS: Cascading Style Sheets

Web › CSS › border-inline-end-color

the border-inline-end-color css property defines the color of the logical inline-end border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation.
...thub repository.
...he interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...lor: #663399; related properties are border-block-start-color, border-block-end-color, and border-inline-start-color, which define the other border colors of the element.

border-inline-end-width - CSS: Cascading Style Sheets

Web › CSS › border-inline-end-width

the border-inline-end-width css property defines the width of the logical inline-end border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation.
...f you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...ve examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...and border-inline-start-width, which define the other border widths of the element.

border-inline-end - CSS: Cascading Style Sheets

Web › CSS › border-inline-end

thub.com/mdn/interactive-examples and send us a pull request.
...hich border-inline-end maps depends on the element's writing mode, directionality, and text orientation.
...of the properties of the shorthand:border-width: as each of the properties of the shorthand:border-top-width: mediumborder-right-width: mediumborder-bottom-width: mediumborder-left-width: mediumborder-style: as each of the properties of the shorthand:border-top-style: noneborder-right-style: noneborder-bottom-style: noneborder-left-style: nonecolor: varies from one browser to anotherapplies toall elementsinheritednocomputed valueas each of the properties of the shorthand:border-width: as each of the properties of the shorthand:border-bottom-width: the absolute length or 0 if border-bottom-style is none or hiddenborder-left-width: the absolute length or 0 if border-left-style is none or hiddenborder-right-width: the absolute length or 0 if border-right-style is none or hiddenborder-top-width: the ...
...of the properties of the shorthand:border-width: as each of the properties of the shorthand:border-top-width: mediumborder-right-width: mediumborder-bottom-width: mediumborder-left-width: mediumborder-style: as each of the properties of the shorthand:border-top-style: noneborder-right-style: noneborder-bottom-style: noneborder-left-style: nonecolor: varies from one browser to anotherapplies toall elementsinheritednocomputed valueas each of the properties of the shorthand:border-width: as each of the properties of the shorthand:border-bottom-width: the absolute length or 0 if border-bottom-style is none or hiddenborder-left-width: the absolute length or 0 if border-left-style is none or hiddenborder-right-width: the absolute length or 0 if border-right-style is none or hiddenborder-top-width: the ...

border-inline-start-style - CSS: Cascading Style Sheets

Web › CSS › border-inline-start-style

the border-inline-start-style css property defines the style of the logical inline start border of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation.
...tive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...://github.com/mdn/interactive-examples and send us a pull request.
...tyle: groove; related properties are border-block-start-style, border-block-end-style, and border-inline-end-style, which define the other border styles of the element.

border-left-width - CSS: Cascading Style Sheets

Web › CSS › border-left-width

the border-left-width css property sets the width of the left border of an element.
...thick a thick border note: because the specification doesn't define the exact thickness denoted by each keyword, the precise result when using one of them is implementation-specific.
...ck, and the values are constant within a single document.
...e constant within a single document.

border-right-width - CSS: Cascading Style Sheets

Web › CSS › border-right-width

the border-right-width css property sets the width of the right border of an element.
...thick a thick border note: because the specification doesn't define the exact thickness denoted by each keyword, the precise result when using one of them is implementation-specific.
...k, and the values are constant within a single document.
... constant within a single document.

border-start-end-radius - CSS: Cascading Style Sheets

Web › CSS › border-start-end-radius

the border-start-end-radius css property defines a logical border radius on an element, which maps to a physical border radius depending on the element's writing-mode, direction, and text-orientation.
...tage> denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse.
...axes of the ellipse.
...lowed by the css <length> data type.

border-start-start-radius - CSS: Cascading Style Sheets

Web › CSS › border-start-start-radius

the border-start-start-radius css property defines a logical border radius on an element, which maps to a physical border radius that depends on the element's writing-mode, direction, and text-orientation.
...tage> denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse.
...axes of the ellipse.
...lowed by the css <length> data type.

border-style - CSS: Cascading Style Sheets

Web › CSS › border-style

the border-style shorthand css property sets the line style for all four sides of an element's border.
... displays two straight lines that add up to the pixel size defined by border-width.
... displays a border with an extruded appearance.
... displays a border that makes the element appear embossed.

border-top-width - CSS: Cascading Style Sheets

Web › CSS › border-top-width

the border-top-width css property sets the width of the top border of an element.
...thick a thick border note: because the specification doesn't define the exact thickness denoted by each keyword, the precise result when using one of them is implementation-specific.
...rn thin ≤ medium ≤ thick, and the values are constant within a single document.
......

box-align - CSS: Cascading Style Sheets

Web › CSS › box-align

warning: this is a property of the original css flexible box layout module draft, and has been replaced by a newer standard.
... a perpendicular direction.
...this only applies if the box's orientation is horizontal.
...at there is no extra space in the box.

box-orient - CSS: Cascading Style Sheets

Web › CSS › box-orient

this is a property of the original css flexible box layout module draft, and has been replaced by a newer standard.
... the box lays out its contents horizontally.
...xis (html) the box displays its children along the inline axis.
... axis.

color - CSS: Cascading Style Sheets

Web › CSS › color

the color css property sets the foreground color value of an element's text and text decorations, and sets the currentcolor value.
... indirect value on other properties and is the default for other color properties, such as border-color.
... 100% 50% / 0.6); color: hsl(30.0 100% 50% / 60%); color: hsla(30.2 100% 50% / 60%); /* global values */ color: inherit; color: initial; color: unset; the color property is specified as a single <color> value.
...g), a ratio of 4.5:1 is required for text content and 3:1 for larger text such as headings.

column-count - CSS: Cascading Style Sheets

Web › CSS › column-count

the column-count css property breaks an element's content into the specified number of columns.
...request.
... 12prefixed prefixed implemented with the vendor prefix: -webkit-firefox full support 52 full support 52 no support 1.5 — 74prefixed notes prefixed implemented with the vendor prefix: -moz-notes prior to version 37, multiple columns didn't work with display: table-caption elements.ie full support 10opera full support 11.1 full support 11.1 full support 15prefixed prefixed implemented with the vendor prefix: -webkit-safari full support 9 ...
... prefixed implemented with the vendor prefix: -webkit-firefox android full support 52 full support 52 full support 4prefixed notes prefixed implemented with the vendor prefix: -moz-notes prior to version 37, multiple columns didn't work with display: table-caption elements.opera android full support 11.1 full support 11.1 full support 14prefixed prefixed implemented with the vendor prefix: -webkit-safari ios full support 9 full support 9 ...

drop-shadow() - CSS: Cascading Style Sheets

Web › CSS › filter-function › drop-shadow

the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...-radius color) the drop-shadow() function accepts a parameter of type <shadow> (defined in the box-shadow property), with the exception that the inset keyword and spread parameters are not allowed.
...shadow property), with the exception that the inset keyword and spread parameters are not allowed.
...arameters are not allowed.

font-kerning - CSS: Cascading Style Sheets

Web › CSS › font-kerning

sted below.
...ne.inheritedyescomputed valueas specifiedanimation typediscrete formal syntax auto | normal | none examples enabling and disabling kerning html <div id="kern"></div> <div id="nokern"></div> <textarea id="input">av t.
...ion typediscrete formal syntax auto | normal | none examples enabling and disabling kerning html <div id="kern"></div> <div id="nokern"></div> <textarea id="input">av t.
... | none examples enabling and disabling kerning html <div id="kern"></div> <div id="nokern"></div> <textarea id="input">av t.

font-weight - CSS: Cascading Style Sheets

Web › CSS › font-weight

500; font-weight: 600; font-weight: 700;// bold font-weight: 800; font-weight: 900; /* global values */ font-weight: inherit; font-weight: initial; font-weight: unset; the font-weight property is specified using any one of the values listed below.
...specified using any one of the values listed below.
...ok for available weights greater than the target, in ascending order.
...ssibility concerns people experiencing low vision conditions may have difficulty reading text set with a font-weight value of 100 (thin/hairline) or 200 (extra light), especially if the font has a low contrast color ratio.

gap (grid-gap) - CSS: Cascading Style Sheets

Web › CSS › gap

<'row-gap'> followed optionally by a value for <'column-gap'>.
...row-gap'> and <'column-gap'> are each specified as a <length> or a <percentage>.
...id lines, relative to the dimension of the element.
...he shorthand:row-gap: normalcolumn-gap: normalapplies tomulti-column elements, flex containers, grid containersinheritednocomputed valueas each of the properties of the shorthand:row-gap: as specified, with <length>s made absolute, and normal computing to zero except on multi-column elementscolumn-gap: as specified, with <length>s made absolute, and normal computing to zero except on multi-column elementsanimation typeas each of the properties of the shorthand:row-gap: a length, percentage or calc();column-gap: a length, percentage or calc(); formal syntax <'row-gap'> <'column-gap'>?

mask-border-mode - CSS: Cascading Style Sheets

Web › CSS › mask-border-mode

yword values */ mask-border-mode: luminance; mask-border-mode: alpha; /* global values */ mask-border-mode: inherit; mask-border-mode: initial; mask-border-mode: unset; values luminance the luminance values of the mask border image are used as the mask values.
...e; mask-border-mode: alpha; /* global values */ mask-border-mode: inherit; mask-border-mode: initial; mask-border-mode: unset; values luminance the luminance values of the mask border image are used as the mask values.
... /* global values */ mask-border-mode: inherit; mask-border-mode: initial; mask-border-mode: unset; values luminance the luminance values of the mask border image are used as the mask values.
...-border-mode: inherit; mask-border-mode: initial; mask-border-mode: unset; values luminance the luminance values of the mask border image are used as the mask values.

mask-type - CSS: Cascading Style Sheets

Web › CSS › mask-type

the mask-type css property sets whether an svg <mask> element is used as a luminance or an alpha mask.
... the mask-type css property sets whether an svg <mask> element is used as a luminance or an alpha mask.
... the mask-type css property sets whether an svg <mask> element is used as a luminance or an alpha mask.
... values listed below.

max-inline-size - CSS: Cascading Style Sheets

Web › CSS › max-inline-size

the max-inline-size css property defines the horizontal or vertical maximum size of an element's block depending on its writing mode.
... the max-inline-size css property defines the horizontal or vertical maximum size of an element's block depending on its writing mode.
...line-size css property defines the horizontal or vertical maximum size of an element's block depending on its writing mode.
...ment's block depending on its writing mode.

offset-distance - CSS: Cascading Style Sheets

Web › CSS › offset-distance

the offset-distance css property specifies a position along an offset-path for an element to be placed.
... the offset-distance css property specifies a position along an offset-path for an element to be placed.
...dle of the offset-path */ offset-distance: 50%; /* a fixed length positioned along the path */ offset-distance: 40px; <length-percentage> a length that specifies how far the element is along the path (defined with offset-path).
...to the total path lengthcomputed valuefor <length> the absolute value, otherwise a percentageanimation typea length, percentage or calc(); formal syntax <length-percentage>where <length-percentage> = <length> | <percentage> examples using offset-distance in an animation the motion aspect in css motion path typically comes from animating the offset-distance property.

outline-width - CSS: Cascading Style Sheets

Web › CSS › outline-width

the css outline-width property sets the thickness of an element's outline.
... the css outline-width property sets the thickness of an element's outline.
... outline specified as a <length>.
...ox).

overscroll-behavior-block - CSS: Cascading Style Sheets

Web › CSS › overscroll-behavior-block

behavior-block: none; /* global values */ overscroll-behavior-block: inherit; overscroll-behavior-block: initial; overscroll-behavior-block: unset; syntax the overscroll-behavior-block property is specified as a keyword chosen from the list of values below.
...t; syntax the overscroll-behavior-block property is specified as a keyword chosen from the list of values below.
...rflow behavior is observed inside the element this value is set on (e.g.
...lement this value is set on (e.g.

overscroll-behavior-inline - CSS: Cascading Style Sheets

Web › CSS › overscroll-behavior-inline

ior-inline: none; /* global values */ overscroll-behavior-inline: inherit; overscroll-behavior-inline: initial; overscroll-behavior-inline: unset; syntax the overscroll-behavior-inline property is specified as a keyword chosen from the list of values below.
...; syntax the overscroll-behavior-inline property is specified as a keyword chosen from the list of values below.
...rflow behavior is observed inside the element this value is set on (e.g.
...lement this value is set on (e.g.

padding-bottom - CSS: Cascading Style Sheets

Web › CSS › padding-bottom

the padding-bottom css property sets the height of the padding area on the bottom of an element.
... the padding-bottom css property sets the height of the padding area on the bottom of an element.
...f an element.
...adding-bottom property is specified as a single value chosen from the list below.

padding-left - CSS: Cascading Style Sheets

Web › CSS › padding-left

the padding-left css property sets the width of the padding area to the left of an element.
... the padding-left css property sets the width of the padding area to the left of an element.
... of an element.
... padding-left property is specified as a single value chosen from the list below.

padding-right - CSS: Cascading Style Sheets

Web › CSS › padding-right

the padding-right css property sets the width of the padding area on the right of an element.
... the padding-right css property sets the width of the padding area on the right of an element.
... of an element.
...padding-right property is specified as a single value chosen from the list below.

padding-top - CSS: Cascading Style Sheets

Web › CSS › padding-top

the padding-top css property sets the height of the padding area on the top of an element.
... the padding-top css property sets the height of the padding area on the top of an element.
...f an element.
...e padding-top property is specified as a single value chosen from the list below.

perspective-origin - CSS: Cascading Style Sheets

Web › CSS › perspective-origin

his interactive example is stored in a github repository.
... also valid */ perspective-origin: y-position x-position; /* global values */ perspective-origin: inherit; perspective-origin: initial; perspective-origin: unset; values x-position indicates the position of the abscissa of the vanishing point.
... a shortcut for the 0 length value.
...ngth-percentage> indicating the position as an absolute length value or relative to the height of the element.

row-gap (grid-row-gap) - CSS: Cascading Style Sheets

Web › CSS › row-gap

the row-gap css property sets the size of the gap (gutter) between an element's grid rows.
... prefixed property as in the interactive example above.
...ngth> values */ row-gap: 20px; row-gap: 1em; row-gap: 3vmin; row-gap: 0.5cm; /* <percentage> value */ row-gap: 10%; /* global values */ row-gap: inherit; row-gap: initial; row-gap: unset; values <length-percentage> is the width of the gutter separating the rows.
...the width of the gutter separating the rows.

ruby-align - CSS: Cascading Style Sheets

Web › CSS › ruby-align

the ruby-align css property defines the distribution of the different ruby elements over the base.
...: space-around; /* global values */ ruby-align: inherit; ruby-align: initial; ruby-align: unset; syntax values start is a keyword indicating that the ruby will be aligned with the start of the base text.
... start is a keyword indicating that the ruby will be aligned with the start of the base text.
... text html <ruby> <rb>this is a long text to check</rb> <rp>（</rp><rt>short ruby</rt><rp>）</rp> </ruby> css ruby { ruby-align: start; } result ruby aligned at the center of the base text html <ruby> <rb>this is a long text to check</rb> <rp>（</rp><rt>short ruby</rt><rp>）</rp> </ruby> css ruby { ruby-align: center; } result extra space distributed between ruby elements html <ruby> <rb>this is a long text to check</rb> <rp>（</rp><rt>short ruby</rt><rp>）</rp> </ruby> css ruby { ruby-align: space-between; } result extra space distributed between and around ruby elements html <ruby> <rb>this is a long text to check</rb> <rp>（</rp><rt>short ruby</rt><rp>）</rp> </ruby> css ruby { ruby-align: space-around; } result specifications ...

scroll-margin-inline-end - CSS: Cascading Style Sheets

Web › CSS › scroll-margin-inline-end

n/interactive-examples and send us a pull request.
... box-sizing: border-box; border: 1px solid #000; scroll-snap-type: x mandatory; } the main parts relevant to the scroll snapping are overflow-x: scroll, which makes sure the contents will scroll and not be hidden, and scroll-snap-type: x mandatory, which dictates that scroll snapping must occur along the horizontal axis, and the scrolling will always come to rest on a snap point.
...stify-content: center; scroll-snap-align: end; } .scroller > div:nth-child(2n) { background-color: #fff; color: #663399; } the most relevant part here is scroll-snap-align: end, which specifies that the right-hand edges (the "ends" along the x axis, in our case) are the designated snap points.
...s that the right-hand edges (the "ends" along the x axis, in our case) are the designated snap points.

scroll-margin-inline-start - CSS: Cascading Style Sheets

Web › CSS › scroll-margin-inline-start

e-examples and send us a pull request.
... box-sizing: border-box; border: 1px solid #000; scroll-snap-type: x mandatory; } the main parts relevant to the scroll snapping are overflow-x: scroll, which makes sure the contents will scroll and not be hidden, and scroll-snap-type: x mandatory, which dictates that scroll snapping must occur along the horizontal axis, and the scrolling will always come to rest on a snap point.
...-content: center; scroll-snap-align: start; } .scroller > div:nth-child(2n) { background-color: #fff; color: #663399; } the most relevant part here is scroll-snap-align: start, which specifies that the left-hand edges (the "starts" along the x axis, in our case) are the designated snap points.
...t the left-hand edges (the "starts" along the x axis, in our case) are the designated snap points.

text-align - CSS: Cascading Style Sheets

Web › CSS › text-align

the text-align css property sets the horizontal alignment of a block element or table-cell box.
...supported by the browser.applies toblock containersinheritedyescomputed valueas specified, except for the match-parent value which is calculated against its parent's direction value and results in a computed value of either left or rightanimation typediscrete formal syntax start | end | left | right | center | justify | match-parent examples left alignment html <p class="example"> integer elementum massa at nulla placerat varius.
...mples left alignment html <p class="example"> integer elementum massa at nulla placerat varius.
... result centered text html <p class="example"> integer elementum massa at nulla placerat varius.

text-decoration-color - CSS: Cascading Style Sheets

Web › CSS › text-decoration-color

cope of the property's value.
...his interactive example is stored in a github repository.
...ect, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...t and background color values.

text-decoration-thickness - CSS: Cascading Style Sheets

Web › CSS › text-decoration-thickness

the text-decoration-thickness css property sets the stroke thickness of the decoration line that is used on text in an element, such as a line-through, underline, or overline.
...ser default.
...centage> of 1em in the current font.
...ges in the font.

text-decoration - CSS: Cascading Style Sheets

Web › CSS › text-decoration

for text-decoration-line, text-decoration-color, text-decoration-style, and the newer text-decoration-thickness property.
...ecoration-color, text-decoration-style, and the newer text-decoration-thickness property.
...wer text-decoration-thickness property.
...he color of the decoration.

matrix3d() - CSS: Cascading Style Sheets

Web › CSS › transform-function › matrix3d

us coordinates on ℝℙ3 this transformation applies to the 3d space and can't be represented on the plane.
... a generic 3d affine transformation can't be represented using a cartesian-coordinate matrix, as translations are not linear transformations.
... a 3d cube created from dom elements and transforms, which can be hovered/focused to apply a matrix3d() transform to it.
...v class="face front">1</div> <div class="face back">2</div> <div class="face right">3</div> <div class="face left">4</div> <div class="face top">5</div> <div class="face bottom">6</div> </section> css #example-element { width: 100px; height: 100px; transform-style: preserve-3d; transition: transform 1.5s; transform: rotate3d(1, 1, 1, 30deg); margin: 50px auto; } #example-element:hover, #example-element:focus { transform: rotate3d(1, 1, 1, 30deg) matrix3d(1,0,0,0,0,1,6,0,0,0,1,0,50,100,0,1.1); } .face { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; position: absolute; backface-visibility: inherit; font-size: 60px; color: #fff; } .front { background: rgba(90,90,90,.7); transform: translatez(50px); } .

rotate() - CSS: Cascading Style Sheets

Web › CSS › transform-function › rotate

the rotate() css function defines a transformation that rotates an element around a fixed point on the 2d plane, without deforming it.
... the rotate() css function defines a transformation that rotates an element around a fixed point on the 2d plane, without deforming it.
... the rotate() css function defines a transformation that rotates an element around a fixed point on the 2d plane, without deforming it.
... sin(a) -sin(a) cos(a) 0 0] examples basic example html <div>normal</div> <div class="rotated">rotated</div> css div { width: 80px; height: 80px; background-color: skyblue; } .rotated { transform: rotate(45deg); /* equal to rotatez(45deg) */ background-color: pink; } result combining rotation with another transformation if you want apply multiple transformations to an element, be careful about the order in which you specify your transformations.

scale() - CSS: Cascading Style Sheets

Web › CSS › transform-function › scale

the scale() css function defines a transformation that resizes an element on the 2d plane.
...ount of scaling is defined by a vector, it can resize the horizontal and vertical dimensions at different scales.
...esult is a <transform-function> data type.
...ntax the scale() function is specified with either one or two values, which represent the amount of scaling to be applied in each direction.

scaleX() - CSS: Cascading Style Sheets

Web › CSS › transform-function › scaleX

the scalex() css function defines a transformation that resizes an element along the x-axis (horizontally).
... the scalex() css function defines a transformation that resizes an element along the x-axis (horizontally).
... the scalex() css function defines a transformation that resizes an element along the x-axis (horizontally).
...is not isotropic, and the angles of the element are not conserved.

scaleY() - CSS: Cascading Style Sheets

Web › CSS › transform-function › scaleY

the scaley() css function defines a transformation that resizes an element along the y-axis (vertically).
... the scaley() css function defines a transformation that resizes an element along the y-axis (vertically).
... the scaley() css function defines a transformation that resizes an element along the y-axis (vertically).
...served.

scaleZ() - CSS: Cascading Style Sheets

Web › CSS › transform-function › scaleZ

the scalez() css function defines a transformation that resizes an element along the z-axis.
...es a transformation that resizes an element along the z-axis.
...pository.
...ove interactive examples, perspective: 550px; (to create a 3d space) and transform-style: preserve-3d; (so the children, the 6 sides of the cube, are also positioned in the 3d space), have been set on the cube.

skew() - CSS: Cascading Style Sheets

Web › CSS › transform-function › skew

the skew() css function defines a transformation that skews an element on the 2d plane.
... skews an element on the 2d plane.
...e proportionate to the specified angle and the distance to the origin; thus, the farther from the origin a point is, the greater will be the value added it.
...m the origin a point is, the greater will be the value added it.

transform-origin - CSS: Cascading Style Sheets

Web › CSS › transform-origin

the transform-origin css property sets the origin for an element's transformations.
...d in a github repository.
... the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
... which would make the statement invalid) describing how far from the user eye the z=0 origin is set.

Media buffering, seeking, and time ranges - Developer guides

Web › Guide › Audio and video delivery › buffering seeking time ranges

a timeranges object, which will tell us which chunks of media have been downloaded.
...eturns 15 myaudio.buffered.end(1); // returns 19 to try out and visualize buffered time ranges we can write a little bit of html: <p> <audio id="my-audio" controls> <source src="music.mp3" type="audio/mpeg"> </audio> </p> <p> <canvas id="my-canvas" width="300" height="20"> </canvas> </p> and a little bit of javascript: window.onload = function(){ var myaudio = document.getelementbyid('my-audio'); var mycanvas = document.getelementbyid('my-canvas'); var context = mycanvas.getcontext('2d'); context.fillstyle = 'lightgray'; context.fillrect(0, 0, mycanvas.width, mycanvas.height); context.fillstyle = 'red'; context.strokestyle = 'white'; var inc = mycanvas.width / myaudio.duration; // display timeranges myaudio.addeventlistener('seeked'...
...px; } #buffered-amount { display: block; height: 100%; background-color: #777; width: 0; } .progress { margin-top: -20px; height: 20px; position: relative; width: 300px; } #progress-amount { display: block; height: 100%; background-color: #595; width: 0; } and the following javascript provides our functionality: window.onload = function(){ var myaudio = document.getelementbyid('my-audio'); myaudio.addeventlistener('progress', function() { var duration = myaudio.duration; if (duration > 0) { for (var i = 0; i < myaudio.buffered.length; i++) { if (myaudio.buffered.start(myaudio.buffered.length - 1 - i) < myaudio.currenttime) { document.getelementbyid("buffered-amount").style.width = (myaudio.buffered.end(myaudio.buffered.
...io.buffered.length - 1 - i) < myaudio.currenttime) { document.getelementbyid("buffered-amount").style.width = (myaudio.buffered.end(myaudio.buffered.length - 1 - i) / duration) * 100 + "%"; break; } } } }); myaudio.addeventlistener('timeupdate', function() { var duration = myaudio.duration; if (duration > 0) { document.getelementbyid('progress-amount').style.width = ((myaudio.currenttime / duration)*100) + "%"; } }); } the progress event is fired as data is downloaded, this is a good event to react to if we want to display download or buffering progress.

Using device orientation with 3D transforms - Developer guides

Web › Guide › Events › Using device orientation with 3D transforms

this article provides tips on how to use device orientation information in tandem with css 3d transforms.
...is basically to use the alpha, gamma, and beta values as rotatez, rotatex and rotatey values.
...e alpha - 180 the y axis of the screen coordinate system is inverted, such that translatey(100px) moves an element 100px down, so the rotatey value should be -gamma finally, the order of the three different rotations is very important to accurately convert an orientation to a 3d rotation: rotatez, then rotatex and then rotatey.
...elem.style.transform = "rotatez(" + ( e.alpha - 180 ) + "deg) " + "rotatex(" + e.beta + "deg) " + "rotatey(" + ( -e.gamma ) + "deg)"; }); orientation compensation compensating the orientation of the device can be useful to create parallax effects or augmented reality.

Introduction to Web development - Developer guides

Web › Guide › Introduction to Web development

you get started.
...) set of links to learning resources, see the mdn learning pages.
... html the basics of hypertext mark-up langage (html) — what exactly is html?
...html) — what exactly is html?

Standard metadata names - HTML: Hypertext Markup Language

Web › HTML › Element › meta › name

the <meta> element can be used to provide document metadata in terms of name-value pairs, with the name attribute giving the metadata name, and the content attribute giving the value.
... name attribute giving the metadata name, and the content attribute giving the value.
...truly compatible with it can result in unreadable content; all major browsers default to light mode if not otherwise configured.
...er metadata names the whatwg wiki metaextensions page contains a large set of non-standard metadata names that have not been formally accepted yet; however, some of the names included there are already used quite commonly in practice — including the following: creator: the name of the creator of the document, such as an organization or institution.

<ruby> - HTML: Hypertext Markup Language

Web › HTML › Element › ruby

the html <ruby> element represents a ruby annotation.
...itory.
... content categories flow content, phrasing content, palpable content.
...ow content, phrasing content, palpable content.

draggable - HTML: Hypertext Markup Language

Web › HTML › Global attributes › draggable

the draggable global attribute is an enumerated attribute that indicates whether the element can be dragged, either with native browser behavior or the html drag and drop api.
... the draggable global attribute is an enumerated attribute that indicates whether the element can be dragged, either with native browser behavior or the html drag and drop api.
... the draggable global attribute is an enumerated attribute that indicates whether the element can be dragged, either with native browser behavior or the html drag and drop api.
...: the element cannot be dragged.

MIME types (IANA media types) - HTTP

Web › HTTP › Basics of HTTP › MIME types

o attachment, and propose a "save as" dialog.
...plain or application/octet-stream mime types.
...n for each format links to a longer description of the format, its capabilities, and detailed browser compatibility information; including which versions introduced support and specific special features that may have been introduced later.
... common incorrect server configurations: rar-compressed files.

Content negotiation - HTTP

Web › HTTP › Content negotiation

ng different representations of a resource at the same uri, so that the user agent can specify which is best suited for the user (for example, which language of a document, which image format, or which content encoding).
...ated lists of mime types, each combined with a quality factor, a parameter indicating the relative degree of preference between the different mime types.
...uality factor, a parameter indicating the relative degree of preference between the different mime types.
...work appropriately.

CSP: child-src - HTTP

Web › HTTP › Headers › Content-Security-Policy › child-src

the http content-security-policy (csp) child-src directive defines the valid sources for web workers and nested browsing contexts loaded using elements such as <frame> and <iframe>.
...e blob and filesystem from source directives.
...milar methods for creating code from strings.
...gle quotes.

CSP: form-action - HTTP

Web › HTTP › Headers › Content-Security-Policy › form-action

de blob and filesystem from source directives.
...) and similar methods for creating code from strings.
... the single quotes.
... of the violating code to be included in the violation report.

CSP: frame-src - HTTP

Web › HTTP › Headers › Content-Security-Policy › frame-src

the http content-security-policy (csp) frame-src directive specifies valid sources for nested browsing contexts loading using elements such as <frame> and <iframe>.
...e blob and filesystem from source directives.
...milar methods for creating code from strings.
...gle quotes.

CSP: navigate-to - HTTP

Web › HTTP › Headers › Content-Security-Policy › navigate-to

de blob and filesystem from source directives.
...) and similar methods for creating code from strings.
... the single quotes.
...by that root script.

CSP: script-src-attr - HTTP

Web › HTTP › Headers › Content-Security-Policy › script-src-attr

the http content-security-policy (csp) script-src-attr directive specifies valid sources for javascript inline event handlers.
...de blob and filesystem from source directives.
...) and similar methods for creating code from strings.
... the single quotes.

CSP: script-src-elem - HTTP

Web › HTTP › Headers › Content-Security-Policy › script-src-elem

the http content-security-policy (csp) script-src-elem directive specifies valid sources for javascript <script> elements, but not inline script event handlers like onclick.
...de blob and filesystem from source directives.
...) and similar methods for creating code from strings.
... the single quotes.

CSP: style-src-attr - HTTP

Web › HTTP › Headers › Content-Security-Policy › style-src-attr

the http content-security-policy (csp) style-src-attr directive specifies valid sources for inline styles applied to individual dom elements.
...de blob and filesystem from source directives.
...) and similar methods for creating code from strings.
... the single quotes.

CSP: style-src-elem - HTTP

Web › HTTP › Headers › Content-Security-Policy › style-src-elem

the http content-security-policy (csp) style-src-elem directive specifies valid sources for stylesheets <style> elements and <link> elements with rel="stylesheet".
...de blob and filesystem from source directives.
...) and similar methods for creating code from strings.
... the single quotes.

Feature-Policy: fullscreen - HTTP

Web › HTTP › Headers › Feature-Policy › fullscreen

the http feature-policy header fullscreen directive controls whether the current document is allowed to use element.requestfullscreen().
... is enabled, the returned promise rejects with a typeerror.
...texts.
...header to define a feature policy: feature-policy: fullscreen 'self' https://example.com with an <iframe> element fastcorp inc.

Referrer-Policy - HTTP

Web › HTTP › Headers › Referrer-Policy

d the origin, path, and query string when performing any request, regardless of security.
...efully consider the impact of this setting.
...e, you can set the referrer policy for the entire document with a <meta> element with a name of referrer: <meta name="referrer" content="origin"> or set it for individual requests with the referrerpolicy attribute on <a>, <area>, <img>, <iframe>, <script>, or <link> elements: <a href="http://example.com" referrerpolicy="origin"> alternatively, a noreferrer link relation on an a, area, or link element can be set: <a href="http://example.com" rel="noreferrer"> integration with css css can fetch resources referenced from stylesheets.
... a, area, or link element can be set: <a href="http://example.com" rel="noreferrer"> integration with css css can fetch resources referenced from stylesheets.

Redirections in HTTP - HTTP

Web › HTTP › Redirections

.
...till fresh and can be used.
...ree ways to trigger redirections, several ways can be used at the same time.
...lock for the content you want to redirect: server { listen 80; server_name example.com; return 301 $scheme://www.example.com$request_uri; } to apply a redirect to a directory or only certain pages, use the rewrite directive: rewrite ^/images/(.*)$ https://images.example.com/$1 redirect; rewrite ^/images/(.*)$ https://images.example.com/$1 permanent; iis in iis, you use the <httpredirect> element to configure redirections.

CSS Houdini

Web › Houdini

for that first rendering cycle to be complete.
...e complete.
...gureable components: no pre-processors, post-processors or javascript frameworks needed.
... designed to improve the extensibility of css, this api enables developers to write their own layout algorithms, like masonry or line snapping.

SyntaxError: missing variable name - JavaScript

Web › JavaScript › Reference › Errors › No variable name

e names there are a few variable names that are reserved keywords.
...are reserved keywords.
...riables pay special attention to commas when declaring multiple variables.
... declaring multiple variables.

Array.from() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › from

ce for this interactive example is stored in a github repository.
...e [, mapfn [, thisarg]]) parameters arraylike an array-like or iterable object to convert to an array.
...of the array.
...// [[1, 2], [2, 4], [4, 8]] const mapper = new map([['1', 'a'], ['2', 'b']]); array.from(mapper.values()); // ['a', 'b']; array.from(mapper.keys()); // ['1', '2']; array from an array-like object (arguments) function f() { return array.from(arguments); } f(1, 2, 3); // [ 1, 2, 3 ] using arrow functions and array.from() // using an arrow function as the map function to // manipulate the elements array.from([1, 2, 3], x => x + x); // [2, 4, 6] // generate a sequence of numbers // since the array is initialized with `undefined` on each position, // the value of `v` below will be `undefined` array.from({length: 5}, (v, i) => i); // [0, 1, 2, 3, 4] sequence generator (range) // sequence generator function (commonly referred to as "range", e.g.

Map.prototype.forEach() - JavaScript

Web › JavaScript › Reference › Global Objects › Map › forEach

servable by callback is determined according to the usual rules for determining the this seen by a function.
...in the case when it was deleted and re-added before foreach has finished.
...ed before foreach has finished.
...be visited.

String.prototype.codePointAt() - JavaScript

Web › JavaScript › Reference › Global Objects › String › codePointAt

the codepointat() method returns a non-negative integer that is the unicode code point value.
...in a github repository.
...active examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
... strings to include the codepointat() function as specified in ecmascript 2015 for browsers without native support.

String.prototype.link() - JavaScript

Web › JavaScript › Reference › Global Objects › String › link

the link() method creates a string representing the code for an <a> html element to be used as a hypertext link to another url.
...) method creates a string representing the code for an <a> html element to be used as a hypertext link to another url.
...g that specifies the href attribute of the <a> tag; it should be a valid url (relative or absolute), with any & characters escaped as &, and any " characters escaped as ".
... a valid url (relative or absolute), with any & characters escaped as &, and any " characters escaped as ".

Symbol.toStringTag - JavaScript

Web › JavaScript › Reference › Global Objects › Symbol › toStringTag

alidatorclass { get [symbol.tostringtag]() { return 'validator'; } } object.prototype.tostring.call(new validatorclass()); // "[object validator]" tostringtag available on all dom prototype objects due to a webidl spec change in mid-2020, browsers are adding a symbol.tostringtag property to all dom prototype objects.
...ngtag]() { return 'validator'; } } object.prototype.tostring.call(new validatorclass()); // "[object validator]" tostringtag available on all dom prototype objects due to a webidl spec change in mid-2020, browsers are adding a symbol.tostringtag property to all dom prototype objects.
...ng.call(new validatorclass()); // "[object validator]" tostringtag available on all dom prototype objects due to a webidl spec change in mid-2020, browsers are adding a symbol.tostringtag property to all dom prototype objects.
...tostringtag available on all dom prototype objects due to a webidl spec change in mid-2020, browsers are adding a symbol.tostringtag property to all dom prototype objects.

TypedArray.prototype.copyWithin() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › copyWithin

the copywithin() method copies the sequence of array elements within the array to the position starting at target.
...s one of the typed array types here.
...example is stored in a github repository.
...e examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

TypedArray.prototype.join() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › join

the join() method joins all elements of an array into a string.
...oin().
... example is stored in a github repository.
...active examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

TypedArray.prototype.subarray() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › subarray

the subarray() method returns a new typedarray on the same arraybuffer store and with the same element types as for this typedarray object.
...ffset is inclusive and the end offset is exclusive.
...stored in a github repository.
...interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

display - Web app manifests

Web › Manifest › display

description fallback display mode fullscreen all of the available display area is used and no user agent chrome is shown.
...en all of the available display area is used and no user agent chrome is shown.
...lone application.
...plication having a different window, its own icon in the application launcher, etc.

<mfenced> - MathML

Web › MathML › Element › mfenced

the deprecated mathml <mfenced> element used to provide the possibility to add custom opening and closing parentheses (such as brackets) and separators (such as commas or semicolons) to an expression.
... the deprecated mathml <mfenced> element used to provide the possibility to add custom opening and closing parentheses (such as brackets) and separators (such as commas or semicolons) to an expression.
...close="}" separators=";;,"> <mi>a</mi> <mi>b</mi> <mi>c</mi> <mi>d</mi> <mi>e</mi> </mfenced> </math> all excess is ignored (,) sample rendering: rendering in your browser: a b c d e <math> <mfenced open="[" close="]" separators="||||,"> <mi>a</mi> <mi>b</mi> <mi>c</mi> <mi>d</mi> <mi>e</mi> </mfenced> </math> specifications the <mfenced> element is no longer part of the latest mathml standard.
...d</mi> <mi>e</mi> </mfenced> </math> all excess is ignored (,) sample rendering: rendering in your browser: a b c d e <math> <mfenced open="[" close="]" separators="||||,"> <mi>a</mi> <mi>b</mi> <mi>c</mi> <mi>d</mi> <mi>e</mi> </mfenced> </math> specifications the <mfenced> element is no longer part of the latest mathml standard.

<mlabeledtr> - MathML

Web › MathML › Element › mlabeledtr

the mathml <mlabeledtr> element is used to represent a label in a row either on the left or on the right side (determined using the side attribute on the <mtable> element).
... the mathml <mlabeledtr> element is used to represent a label in a row either on the left or on the right side (determined using the side attribute on the <mtable> element).
... the mathml <mlabeledtr> element is used to represent a label in a row either on the left or on the right side (determined using the side attribute on the <mtable> element).
... the mathml <mlabeledtr> element is used to represent a label in a row either on the left or on the right side (determined using the side attribute on the <mtable> element).

<mstyle> - MathML

Web › MathML › Element › mstyle

the mathml <mstyle> element is used change the style of its children.
... the mathml <mstyle> element is used change the style of its children.
... size below scriptminsize in order to avoid unreadable small font sizes and depends on the multiplier specified in scriptsizemultiplier.
...ble small font sizes and depends on the multiplier specified in scriptsizemultiplier.

<mtd> - MathML

Web › MathML › Element › mtd

the mathml <mtd> element represents a cell in a table or a matrix.
... the mathml <mtd> element represents a cell in a table or a matrix.
... the mathml <mtd> element represents a cell in a table or a matrix.
... the mathml <mtd> element represents a cell in a table or a matrix.

<mtr> - MathML

Web › MathML › Element › mtr

the mathml <mtr> element represents a row in a table or a matrix.
... the mathml <mtr> element represents a row in a table or a matrix.
... the mathml <mtr> element represents a row in a table or a matrix.
... the mathml <mtr> element represents a row in a table or a matrix.

Lazy loading - Web Performance

Web › Performance › Lazy loading

lesheet" media="print"> it is possible to perform some css optimizations to achieve that.
...="preload">, the css font-display property, and the font loading api.
...images that are within the visual viewport that haven't yet loaded.
... incompatible browsers: loading-attribute-polyfill intersection observer api intersection observers allow the user to know when an observed element enters or exits the browser’s viewport.

How to make PWAs re-engageable using Notifications and Push - Progressive web apps (PWAs)

Web › Progressive web apps › Re-engageable Notifications Push

they can work without push, but are very useful when combined with them.
...w let's move to the subscription part — the app first sends the subscription details as json to the server using fetch.
...ion details as json to the server using fetch.
... method: 'post', headers: { 'content-type': 'application/json' }, body: json.stringify({ subscription: subscription }), }); then the globaleventhandlers.onclick function on the subscribe button is defined: document.getelementbyid('doit').onclick = function() { const payload = document.getelementbyid('notification-payload').value; const delay = document.getelementbyid('notification-delay').value; const ttl = document.getelementbyid('notification-ttl').value; fetch('./sendnotification', { method: 'post', headers: { 'content-type': 'application/json' }, body: json.stringify({ subscription: subscription, payload: payload, delay: delay, ttl: ttl, }), ...

Mobile first - Progressive web apps (PWAs)

Web › Progressive web apps › Responsive › Mobile first

display: table; } nav { display: table-caption; caption-side: bottom; } this is a rather nice hacky bit of css you can use to make the navigation menu display at the bottom, even though it is at the top in the source order.
... in the source order.
...ure both of these were not direct children of the <article>, otherwise the following would not work: #bottom, #top { font-size: 0.8em; position:absolute; right: 1em; text-decoration: none; } #top { color: white; top: 0.5em; } #bottom { bottom: 0.5em; } i also set their parents to be positioned relatively, so they would become the positioning contexts of the absolutely positioned elements (you don't want them to be positioned relative to the <body> element.) adding a mobile first layout the above layout is fine for narrower layouts, but it doesn't work very well when you get wider than about 480px.
...narrow screen devices: if(window.matchmedia("(min-width: 481px)").matches) { require('three'); } we can, therefore, save the bandwidth for browsers that don't need it.

SVG Event Attributes - SVG: Scalable Vector Graphics

Web › SVG › Attribute › Events

event attributes always have their name starting with "on" followed by the name of the event for which they are intended.
...owed by the name of the event for which they are intended.
...cript to run when the event of the given type is dispatched to the element on which the attributes are specified.
..., following the same requirements as for html event attributes.

attributeType - SVG: Scalable Vector Graphics

Web › SVG › Attribute › attributeType

the attributetype attribute specifies the namespace in which the target attribute and its associated values are defined.
.../rect> </svg> usage notes value css | xml | auto default value auto animatable no css this value specifies that the value of attributename is the name of a css property defined as animatable.
... css this value specifies that the value of attributename is the name of a css property defined as animatable.
...of attributename is the name of an xml attribute defined as animatable in the default xml namespace for the target element.

dur - SVG: Scalable Vector Graphics

Web › SVG › Attribute › dur

the dur attribute indicates the simple duration of an animation.
...e> this value specifies the length of the simple duration.
...imple duration.
...this value specifies the simple duration as the intrinsic media duration.

dx - SVG: Scalable Vector Graphics

Web › SVG › Attribute › dx

the dx attribute indicates a shift along the x-axis on the position of an element or its content.
... the dx attribute indicates a shift along the x-axis on the position of an element or its content.
... glyphs, the remaining glyphs use a value of 0.
...shadow.

dy - SVG: Scalable Vector Graphics

Web › SVG › Attribute › dy

the dy attribute indicates a shift along the y-axis on the position of an element or its content.
... the dy attribute indicates a shift along the y-axis on the position of an element or its content.
...phes, the remaining glyphes use a value of 0.
...shadow.

fill - SVG: Scalable Vector Graphics

Web › SVG › Attribute › fill

the fill attribute has two different meanings.
... the fill attribute has two different meanings.
... the fill attribute has two different meanings.
...lor (or any svg paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.

filterUnits - SVG: Scalable Vector Graphics

Web › SVG › Attribute › filterUnits

the filterunits attribute defines the coordinate system for the attributes x, y, width and height.
... and height.
... usage notes value userspaceonuse | objectboundingbox default value objectboundingbox animatable yes userspaceonuse x, y, width and height represent values in the current coordinate system that results from taking the current user coordinate system in place at the time when the <filter> element is referenced (i.e., the user coordinate system for the element referencing the <filter> element via a filter attribute).
...values in the current coordinate system that results from taking the current user coordinate system in place at the time when the <filter> element is referenced (i.e., the user coordinate system for the element referencing the <filter> element via a filter attribute).

mask - SVG: Scalable Vector Graphics

Web › SVG › Attribute › mask

the mask attribute is a presentation attribute mainly used to bind a given <mask> element with the element the attribute belongs to.
...ircle cx="50" cy="50" r="20" fill="yellow" /> <circle cx="50" cy="50" r="45" fill="red" mask="url(#mymask)"/> </svg> since svg2, the mask attribute is defined as a css property and is a shorthand for many other properties: mask-image, mask-mode, mask-repeat, mask-position, mask-clip, mask-origin, mask-size, and mask-composite.
... r="45" fill="red" mask="url(#mymask)"/> </svg> since svg2, the mask attribute is defined as a css property and is a shorthand for many other properties: mask-image, mask-mode, mask-repeat, mask-position, mask-clip, mask-origin, mask-size, and mask-composite.
...<pattern>, <polygon>, <polyline>, <rect>, <svg>, <symbol>, <text>, <use> usage notes value see the css property mask default value none animatable yes specifications specification status comment css masking module level 1the definition of 'mask' in that specification.

maskUnits - SVG: Scalable Vector Graphics

Web › SVG › Attribute › maskUnits

the maskunits attribute indicates which coordinate system to use for the geometry properties of the <mask> element.
... the maskunits attribute indicates which coordinate system to use for the geometry properties of the <mask> element.
...f="#r1" fill="red" /> <use mask="url(#mymask1)" xlink:href="#r2" fill="red" /> <use mask="url(#mymask1)" xlink:href="#r3" fill="red" />  <use mask="url(#mymask2)" xlink:href="#r4" fill="red" /> </svg> mask for <mask>, maskunits defines the coordinate system in use for the geometry attributes (x, y, width and height) of the element.
...dingbox default value objectboundingbox animatable yes userspaceonuse this value indicates that all coordinates for the geometry attributes refer to the user coordinate system as defined when the mask was created.

patternUnits - SVG: Scalable Vector Graphics

Web › SVG › Attribute › patternUnits

the patternunits attribute indicates which coordinate system to use for the geometry properties of the <pattern> element.
... the patternunits attribute indicates which coordinate system to use for the geometry properties of the <pattern> element.
... </pattern>  <rect x="10" y="10" width="80" height="80" fill="url(#p1)" />  <rect x="110" y="10" width="80" height="80" fill="url(#p2)" /> </svg> pattern for <pattern>, patternunits defines the coordinate system in use for the geometry properties (x, y, width and height) of the element.
...gbox default value objectboundingbox animatable yes userspaceonuse this value indicates that all coordinates for the geometry properties refer to the user coordinate system as defined when the pattern was applied.

primitiveUnits - SVG: Scalable Vector Graphics

Web › SVG › Attribute › primitiveUnits

the primitiveunits attribute specifies the coordinate system for the various length values within the filter primitives and for the attributes that define the filter primitive subregion.
...rimitive subregion.
...filter> usage notes value userspaceonuse | objectboundingbox default value userspaceonuse animatable yes userspaceonuse this value indicates that any length values within the filter definitions represent values in the current user coordinate system in place at the time when the <filter> element is referenced (i.e., the user coordinate system for the element referencing the <filter> element via a filter attribute).
...itions represent values in the current user coordinate system in place at the time when the <filter> element is referenced (i.e., the user coordinate system for the element referencing the <filter> element via a filter attribute).

requiredExtensions - SVG: Scalable Vector Graphics

Web › SVG › Attribute › requiredExtensions

no <list-of-extensions> the value is a list of references (iri references in svg 1, url references in svg 2) which identify the required extensions, with the individual values separated by white space.
...amed extensions are supported by the user agent.
... attribute evaluates to true; otherwise, the current element and its children are skipped and thus will not be rendered.
...otherwise, the current element and its children are skipped and thus will not be rendered.

result - SVG: Scalable Vector Graphics

Web › SVG › Attribute › result

the result attribute defines the assigned name for this filter primitive.
...s filter primitive.
...tor="g"/> </filter> <circle cx="100" cy="100" r="100" style="filter: url(#displacementfilter)"/> </svg> usage notes value <filter-primitive-reference> default value none animatable yes <filter-primitive-reference> this value is a <custom-ident> and defines the name for the filter primitive.
...lue <filter-primitive-reference> default value none animatable yes <filter-primitive-reference> this value is a <custom-ident> and defines the name for the filter primitive.

rotate - SVG: Scalable Vector Graphics

Web › SVG › Attribute › rotate

the rotate attribute specifies how the animated element rotates as it travels along a path specified in an <animatemotion> element.
... the rotate attribute specifies how the animated element rotates as it travels along a path specified in an <animatemotion> element.
...ibute specifies how the animated element rotates as it travels along a path specified in an <animatemotion> element.
...s it travels along the path.

startOffset - SVG: Scalable Vector Graphics

Web › SVG › Attribute › startOffset

the startoffset attribute defines an offset from the start of the path for the initial current text position along the path after converting the path to the <textpath> element's coordinate system.
... the startoffset attribute defines an offset from the start of the path for the initial current text position along the path after converting the path to the <textpath> element's coordinate system.
... <text> <textpath href="#path2" startoffset="40"> quick brown fox jumps over the lazy dog.
...measured in the current user coordinate system for the <textpath> element.

systemLanguage - SVG: Scalable Vector Graphics

Web › SVG › Attribute › systemLanguage

the systemlanguage attribute represents a list of supported language tags.
..., <set>, <svg>, <switch>, <text>, <textpath>, <tref>, <tspan>, <unknown>, <use>, and <video> usage notes value <language-tags> default value none animatable no <language-tags> the value is a set of comma-separated tokens, each of which must be a language-tag value, as defined in bcp 47.
...es value <language-tags> default value none animatable no <language-tags> the value is a set of comma-separated tokens, each of which must be a language-tag value, as defined in bcp 47.
...e-tags> default value none animatable no <language-tags> the value is a set of comma-separated tokens, each of which must be a language-tag value, as defined in bcp 47.

u1 - SVG: Scalable Vector Graphics

Web › SVG › Attribute › u1

the u1 attribute specifies list of unicode characters (refer to the description of the unicode attribute of the <glyph> element for a description of how to express individual unicode characters) and/or ranges of unicode characters, which identify a set of possible first glyphs in a kerning pair.
... the u1 attribute specifies list of unicode characters (refer to the description of the unicode attribute of the <glyph> element for a description of how to express individual unicode characters) and/or ranges of unicode characters, which identify a set of possible first glyphs in a kerning pair.
...cifies list of unicode characters (refer to the description of the unicode attribute of the <glyph> element for a description of how to express individual unicode characters) and/or ranges of unicode characters, which identify a set of possible first glyphs in a kerning pair.
...h the same unicode attribute value but different glyph-name values), then all such glyphs are included in the set.

u2 - SVG: Scalable Vector Graphics

Web › SVG › Attribute › u2

the u2 attribute specifies list of unicode characters (refer to the description of the unicode attribute of the <glyph> element for a description of how to express individual unicode characters) and/or ranges of unicode characters, which identify a set of possible second glyphs in a kerning pair.
... the u2 attribute specifies list of unicode characters (refer to the description of the unicode attribute of the <glyph> element for a description of how to express individual unicode characters) and/or ranges of unicode characters, which identify a set of possible second glyphs in a kerning pair.
...ifies list of unicode characters (refer to the description of the unicode attribute of the <glyph> element for a description of how to express individual unicode characters) and/or ranges of unicode characters, which identify a set of possible second glyphs in a kerning pair.
... the same unicode attribute value but different glyph-name values), then all such glyphs are included in the set.

xlink:show - SVG: Scalable Vector Graphics

Web › SVG › Attribute › xlink:show

the xlink:show attribute indicates how a linked resource should be opened and is meant for xlink-aware processors.
...t attribute has priority, since it can express a wider range of values.
...e default value replace animatable no new this value specifies that the referenced resource is opened in a new window or tab.
...l <a> element with target set to _blank.

xml:space - SVG: Scalable Vector Graphics

Web › SVG › Attribute › xml:space

svg supports the built-in xml xml:space attribute to handle whitespace characters inside elements.
... svg supports the built-in xml xml:space attribute to handle whitespace characters inside elements.
... svg supports the built-in xml xml:space attribute to handle whitespace characters inside elements.
...side elements.

z - SVG: Scalable Vector Graphics

Web › SVG › Attribute › z

the z attribute defines the location along the z-axis for a light source in the coordinate system established by the primitiveunits attribute on the <filter> element, assuming that, in the initial coordinate system, the positive z-axis comes out towards the person viewing the content and assuming that one unit along the z-axis equals one unit in x and y.
... the z attribute defines the location along the z-axis for a light source in the coordinate system established by the primitiveunits attribute on the <filter> element, assuming that, in the initial coordinate system, the positive z-axis comes out towards the person viewing the content and assuming that one unit along the z-axis equals one unit in x and y.
...> <rect x="0" y="0" width="200" height="200" style="filter: url(#diffuselighting1);" /> <rect x="0" y="0" width="200" height="200" style="filter: url(#diffuselighting2); transform: translatex(220px);" /> </svg> fepointlight for <fepointlight>, z defines the location along the z-axis for the light source in the coordinate system established by the primitiveunits attribute on the <filter> element.
...along the z-axis for the light source in the coordinate system established by the primitiveunits attribute on the <filter> element.

<feBlend> - SVG: Scalable Vector Graphics

Web › SVG › Element › feBlend

the <feblend> svg filter primitive composes two objects together ruled by a certain blending mode.
... the <feblend> svg filter primitive composes two objects together ruled by a certain blending mode.
...editing software when blending two layers.
...o layers.

<feDisplacementMap> - SVG: Scalable Vector Graphics

Web › SVG › Element › feDisplacementMap

m in2 to spatially displace the image from in.
...formula for the transformation looks like this: p'(x,y) ← p( x + scale * (xc(x,y) - 0.5), y + scale * (yc(x,y) - 0.5)) where p(x,y) is the input image, in, and p'(x,y) is the destination.
...gnated by xchannelselector and ychannelselector.
...ctor.

<feDistantLight> - SVG: Scalable Vector Graphics

Web › SVG › Element › feDistantLight

the <fedistantlight> filter primitive defines a distant light source that can be used within a lighting filter primitive: <fediffuselighting> or <fespecularlighting>.
... the <fedistantlight> filter primitive defines a distant light source that can be used within a lighting filter primitive: <fediffuselighting> or <fespecularlighting>.
...light> filter primitive defines a distant light source that can be used within a lighting filter primitive: <fediffuselighting> or <fespecularlighting>.
...t light source that can be used within a lighting filter primitive: <fediffuselighting> or <fespecularlighting>.

<feFlood> - SVG: Scalable Vector Graphics

Web › SVG › Element › feFlood

the <feflood> svg filter primitive fills the filter subregion with the color and opacity defined by flood-color and flood-opacity.
... the <feflood> svg filter primitive fills the filter subregion with the color and opacity defined by flood-color and flood-opacity.
...or and opacity defined by flood-color and flood-opacity.
...olor and flood-opacity.

<feFuncA> - SVG: Scalable Vector Graphics

Web › SVG › Element › feFuncA

the <fefunca> svg filter primitive defines the transfer function for the alpha component of the input graphic of its parent <fecomponenttransfer> element.
... the <fefunca> svg filter primitive defines the transfer function for the alpha component of the input graphic of its parent <fecomponenttransfer> element.
... the <fefunca> svg filter primitive defines the transfer function for the alpha component of the input graphic of its parent <fecomponenttransfer> element.
...ve defines the transfer function for the alpha component of the input graphic of its parent <fecomponenttransfer> element.

<feFuncB> - SVG: Scalable Vector Graphics

Web › SVG › Element › feFuncB

the <fefuncb> svg filter primitive defines the transfer function for the blue component of the input graphic of its parent <fecomponenttransfer> element.
... the <fefuncb> svg filter primitive defines the transfer function for the blue component of the input graphic of its parent <fecomponenttransfer> element.
... the <fefuncb> svg filter primitive defines the transfer function for the blue component of the input graphic of its parent <fecomponenttransfer> element.
...ive defines the transfer function for the blue component of the input graphic of its parent <fecomponenttransfer> element.

<feFuncG> - SVG: Scalable Vector Graphics

Web › SVG › Element › feFuncG

the <fefuncg> svg filter primitive defines the transfer function for the green component of the input graphic of its parent <fecomponenttransfer> element.
... the <fefuncg> svg filter primitive defines the transfer function for the green component of the input graphic of its parent <fecomponenttransfer> element.
... the <fefuncg> svg filter primitive defines the transfer function for the green component of the input graphic of its parent <fecomponenttransfer> element.
...ve defines the transfer function for the green component of the input graphic of its parent <fecomponenttransfer> element.

<feFuncR> - SVG: Scalable Vector Graphics

Web › SVG › Element › feFuncR

the <fefuncr> svg filter primitive defines the transfer function for the red component of the input graphic of its parent <fecomponenttransfer> element.
... the <fefuncr> svg filter primitive defines the transfer function for the red component of the input graphic of its parent <fecomponenttransfer> element.
... the <fefuncr> svg filter primitive defines the transfer function for the red component of the input graphic of its parent <fecomponenttransfer> element.
...tive defines the transfer function for the red component of the input graphic of its parent <fecomponenttransfer> element.

<feGaussianBlur> - SVG: Scalable Vector Graphics

Web › SVG › Element › feGaussianBlur

the <fegaussianblur> svg filter primitive blurs the input image by the amount specified in stddeviation, which defines the bell-curve.
... the <fegaussianblur> svg filter primitive blurs the input image by the amount specified in stddeviation, which defines the bell-curve.
...e by the amount specified in stddeviation, which defines the bell-curve.
...n, which defines the bell-curve.

<feMerge> - SVG: Scalable Vector Graphics

Web › SVG › Element › feMerge

the <femerge> svg element allows filter effects to be applied concurrently instead of sequentially.
... the <femerge> svg element allows filter effects to be applied concurrently instead of sequentially.
... the <femerge> svg element allows filter effects to be applied concurrently instead of sequentially.
... <femergenode in="blur2" /> <femergenode in="sourcegraphic" /> </femerge> </filter> <rect x="40" y="40" width="100" height="100" style="stroke: #000000; fill: green; filter: url(#feoffset);" /> </svg> result attributes global attributes core attributes presentation attributes filter primitive attributes class style specific attributes none dom interface this element implements the svgfemergeelement interface.

<feMorphology> - SVG: Scalable Vector Graphics

Web › SVG › Element › feMorphology

the <femorphology> svg filter primitive is used to erode or dilate the input image.
... the <femorphology> svg filter primitive is used to erode or dilate the input image.
... input image.
...cially in fattening or thinning effects.

<feOffset> - SVG: Scalable Vector Graphics

Web › SVG › Element › feOffset

the <feoffset> svg filter primitive allows to offset the input image.
... the <feoffset> svg filter primitive allows to offset the input image.
...he input image as a whole is offset by the values specified in the dx and dy attributes.
...t by the values specified in the dx and dy attributes.

<fePointLight> - SVG: Scalable Vector Graphics

Web › SVG › Element › fePointLight

the <fepointlight> filter primitive defines a light source which allows to create a point light effect.
... the <fepointlight> filter primitive defines a light source which allows to create a point light effect.
...es a light source which allows to create a point light effect.
...te a point light effect.

<feSpotLight> - SVG: Scalable Vector Graphics

Web › SVG › Element › feSpotLight

the <fespotlight> svg filter primitive defines a light source which allows to create a spotlight effect.
... the <fespotlight> svg filter primitive defines a light source which allows to create a spotlight effect.
...an be used within a lighting filter primitive: <fediffuselighting> or <fespecularlighting>.
...rimitive: <fediffuselighting> or <fespecularlighting>.

<feTile> - SVG: Scalable Vector Graphics

Web › SVG › Element › feTile

the <fetile> svg filter primitive allows to fill a target rectangle with a repeated, tiled pattern of an input image.
... the <fetile> svg filter primitive allows to fill a target rectangle with a repeated, tiled pattern of an input image.
...th a repeated, tiled pattern of an input image.
...an input image.

<feTurbulence> - SVG: Scalable Vector Graphics

Web › SVG › Element › feTurbulence

the <feturbulence> svg filter primitive creates an image using the perlin turbulence function.
... the <feturbulence> svg filter primitive creates an image using the perlin turbulence function.
...will fill the entire filter primitive subregion.
...subregion.

<font-face-format> - SVG: Scalable Vector Graphics

Web › SVG › Element › font-face-format

the <font-face-format> svg element describes the type of font referenced by its parent <font-face-uri>.
... the <font-face-format> svg element describes the type of font referenced by its parent <font-face-uri>.
... the <font-face-format> svg element describes the type of font referenced by its parent <font-face-uri>.
... the <font-face-format> svg element describes the type of font referenced by its parent <font-face-uri>.

<foreignObject> - SVG: Scalable Vector Graphics

Web › SVG › Element › foreignObject

the <foreignobject> svg element includes elements from a different xml namespace.
...e: auto; animatable: yes x the x coordinate of the foreignobject.
...ht are geometry properties, meaning those attributes can also be used as css properties for that element.
...-live, aria-modal, aria-multiline, aria-multiselectable, aria-orientation, aria-owns, aria-placeholder, aria-posinset, aria-pressed, aria-readonly, aria-relevant, aria-required, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesnonepermitted contentany elements or character data specifications specification status comment scalable vector graphics (svg) 2the definition of '<foreignobject>' in that specification.

<glyphRef> - SVG: Scalable Vector Graphics

Web › SVG › Element › glyphRef

the glyphref element provides a single possible glyph to the referencing <altglyph> substitution.
... the glyphref element provides a single possible glyph to the referencing <altglyph> substitution.
... the glyphref element provides a single possible glyph to the referencing <altglyph> substitution.
...phref element provides a single possible glyph to the referencing <altglyph> substitution.

<hkern> - SVG: Scalable Vector Graphics

Web › SVG › Element › hkern

the <hkern> svg element allows to fine-tweak the horizontal distance between two glyphs.
... the <hkern> svg element allows to fine-tweak the horizontal distance between two glyphs.
... the <hkern> svg element allows to fine-tweak the horizontal distance between two glyphs.
... the <hkern> svg element allows to fine-tweak the horizontal distance between two glyphs.

<tspan> - SVG: Scalable Vector Graphics

Web › SVG › Element › tspan

the svg <tspan> element defines a subtext within a <text> element or another <tspan> element.
...t</tspan> a banana!
...<percentage> ; default value: none; animatable: yes y the y coordinate of the starting point of the text baseline.
...-level, aria-live, aria-modal, aria-multiline, aria-multiselectable, aria-orientation, aria-owns, aria-placeholder, aria-posinset, aria-pressed, aria-readonly, aria-relevant, aria-required, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriestext content element, text content child elementpermitted contentcharacter data and any number of the following elements, in any order:descriptive elements<a>, <altglyph>, <animate>, <animatecolor>, <set>, <tref>, <tspan> specifications specification status comment scalable vector graphics (svg) 2the definition of '<tspan>' in that specification.

<vkern> - SVG: Scalable Vector Graphics

Web › SVG › Element › vkern

the <vkern> svg element allows to fine-tweak the vertical distance between two glyphs in top-to-bottom fonts.
... the <vkern> svg element allows to fine-tweak the vertical distance between two glyphs in top-to-bottom fonts.
... the <vkern> svg element allows to fine-tweak the vertical distance between two glyphs in top-to-bottom fonts.
... the <vkern> svg element allows to fine-tweak the vertical distance between two glyphs in top-to-bottom fonts.

Linking - SVG: Scalable Vector Graphics

Web › SVG › Linking

the target attribute on the svg <a> element doesn't work in mozilla firefox 1.5.
...ocuments are embedded within a parent html document using the tag: page1.html: <html> <body> <p>this is a svg button:</p> <object width="100" height="50" type="image/svg+xml" data="button.svg"/> </body> </html> button.svg: <?xml version="1.1" encoding="utf-8"?> <svg xmlns="http://www.w3.org/2000/svg"> <a xlink:href="page2.html" target="_top"> <g>  </g> </a> </svg> the specification says that the browser should navigate to the html document page2.html when the button graphics are clicked.
...l version="1.1" encoding="utf-8"?> <svg xmlns="http://www.w3.org/2000/svg"> <a xlink:href="page2.html" target="_top"> <g>  </g> </a> </svg> the specification says that the browser should navigate to the html document page2.html when the button graphics are clicked.
...tml will be loaded into the frame where the svg button was (i.e.

Fills and Strokes - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › Fills and Strokes

gradient and pattern versions of those shown below.
... inserted inline with the element via the style attribute: <rect x="10" height="180" y="10" width="180" style="stroke: black; fill: red;"/> or it can be moved to a special style section that you include.
...10" height="180" y="10" width="180" style="stroke: black; fill: red;"/> or it can be moved to a special style section that you include.
...ndalone="no"?> <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg" version="1.1"> <defs> <style type="text/css"><![cdata[ #myrect { stroke: black; fill: red; } ]]></style> </defs> <rect x="10" height="180" y="10" width="180" id="myrect"/> </svg> moving styles to an area like this can make it easier to adjust properties on large groups of elements.

key - XPath

Web › XPath › Functions › key

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the key function returns a node-set of nodes that have the given value for the given key.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the key function returns a node-set of nodes that have the given value for the given key.
...exslt functions, xpath functions, xpath axes the key function returns a node-set of nodes that have the given value for the given key.
... the key function returns a node-set of nodes that have the given value for the given key.

position - XPath

Web › XPath › Functions › position

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the position function returns a number equal to the context position from the expression evaluation context.
...n from the expression evaluation context.
...hat a node's position in a context is not zero-based.
...ot zero-based.

The Netscape XSLT/XPath Reference - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Transforming XML with XSLT › The Netscape XSLT XPath Reference

the following is an alphabetized and annotated list of the elements, axes, and functions from the w3c's 1.0 recommendation for xslt, as well as from the appropriate sections of the xpath recommendation.
... the following is an alphabetized and annotated list of the elements, axes, and functions from the w3c's 1.0 recommendation for xslt, as well as from the appropriate sections of the xpath recommendation.
...he xslt processor is ongoing, and this document will be updated as functionality is expanded.
...d) xsl:with-param (supported) axes ancestor ancestor-or-self attribute child descendant descendant-or-self following following-sibling namespace (not supported) parent preceding preceding-sibling self functions boolean() (supported) ceiling() (supported) concat() (supported) contains() (supported) count() (supported) current() (supported) document() (supported) element-available() (supported) false() (supported) floor() (supported) format-number() (supported) function-available() (supported) generate-id() (supported) id() (partially supported) key() (supported) lang() (supported) last() (supported) local-name() (supported) name() (supported) namespace-uri() (supported) normalize-space() (supported) not() (supported) number() (supp...

Transforming XML with XSLT - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Transforming XML with XSLT

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes an overview the separation of content and presentation is a key design feature of xml.
... name is apt.
...converting it on the fly into html which can then be displayed by the browser).
...pported) xsl:with-param (supported) axes ancestor ancestor-or-self attribute child descendant descendant-or-self following following-sibling namespace (not supported) parent preceding preceding-sibling self functions boolean() (supported) ceiling() (supported) concat() (supported) contains() (supported) count() (supported) current() (supported) document() (supported) element-available() (supported) false() (supported) floor() (supported) format-number() (supported) function-available() (supported) generate-id() (supported) id() (partially supported) key() (supported) lang() (supported) last() (supported) local-name() (supported) name() (supported) namespace-uri() (supported) normalize-space() (supported) not() (supported) number() (supported) position...

Communicating using "port" - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Guides › Content Scripts › using port

"});" var pagemod = require('sdk/page-mod').pagemod({ include: ['*'], contentscript: pagemodscript, onattach: function(worker) { worker.port.on('click', function(html) { worker.port.emit('warning', 'do not click this again'); }); } }); in the add-on above there are two user-defined messages: click is sent from the page-mod to the add-on, when the user clicks an element in the page warning sends a silly string back to the page-mod port.emit() the port.emit() function sends a message from the "main.js", or another add-on module, to a content script, or vice versa.
...con: "./icon-16.png", onclick: function() { console.log("sending 'get-first-para'"); pageworker.port.emit("get-first-para"); } }); the content script "listener.js" listens for "get-first-para".
...he first message, then the listener will still receive the second message.

Communicating using "postMessage" - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Guides › Content Scripts › using postMessage

he content script wants to send mouseout events as well as mouseover.
... " self.postmessage({" + " kind: 'mouseover'," + " element: event.target.tostring()" + " });" + "}, false);" + "window.addeventlistener('mouseout', function(event) {" + " self.postmessage({" + " kind: 'mouseout'," + " element: event.target.tostring()" + " });" + " }, false);" var pagemod = require('sdk/page-mod').pagemod({ include: ['*'], contentscript: pagemodscript, onattach: function(worker) { worker.on('message', function(message) { switch(message.kind) { case 'mouseover': console.log('mouseover: ' + message.element); break; case '...
...;" + " }, false);" var pagemod = require('sdk/page-mod').pagemod({ include: ['*'], contentscript: pagemodscript, onattach: function(worker) { worker.on('message', function(message) { switch(message.kind) { case 'mouseover': console.log('mouseover: ' + message.element); break; case 'mouseout': console.log('mouseout: ' + message.element); break; } }); } }); implementing the same add-on with user-defined events is shorter and more readable: var pagemodscript = "window.addeventlistener('mouseover', function(event) {" + " self.port.emit('mouseover', event.target.tostring());" + "}, false);" + "window.addeventlistener('mouseout', function(event) {" +...

dev/panel - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs › dev panel

anel.html", onready: function() { this.postmessage("message from the add-on"); } }); // export the constructor exports.mypanel = mypanel; // create a new tool, initialized // with the new constructor const mytool = new tool({ panels: { mypanel: mypanel } }); in the panel document script: // my-panel.js window.addeventlistener("message", function(event) { var content = document.getelementbyid("content"); content.textcontent = event.data; }); note that at the moment you have to pass an array of ports into postmessage, even if you don't need to use them: // main.js // require the sdk modules const { panel } = require("dev/panel"); const { tool } = require("dev/toolbox"); const { class } = require("sdk/core/heritage"); const mypanel = class({ extends: panel, label: "my pan...
... dispose: function() { this.debuggee = null; }, onready: function() { this.debuggee.start(); this.postmessage("port", [this.debuggee]); } }); // export the constructor exports.mypanel = mypanel; // create a new tool, initialized // with the new constructor const mytool = new tool({ panels: { mypanel: mypanel } }); in my-panel.js: // my-panel.js var content = document.getelementbyid("content"); window.addeventlistener("message", function(event) { var debuggee = event.ports[0]; console.log(debuggee); debuggee.onmessage = function(event) { content.textcontent = json.stringify(event.data); } debuggee.postmessage({ "to":"root", "type":"listtabs" }); }); if you do this, don't forget to call start() on the port before passing it over to the panel d...
...e this: <html> <head> <meta charset="utf-8"> <link href="./my-panel.css"rel="stylesheet"></link> <script src="resource://sdk/dev/volcan.js"></script> </head> <body> <div id = "content"></div> </body> <script src="./my-panel.js"></script> </html> here's a script that uses volcan.js to get the selected tab and display its url: // my-panel.js var content = document.getelementbyid("content"); window.addeventlistener("message", function(event) { var debuggee = event.ports[0]; volcan.connect(debuggee).

Displaying annotations - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Tutorials › Annotator › Displaying annotations

firefox 38.
...toolbar or sidebar apis.
...ements of web pages that have annotations associated with them, and a panel to display the annotations.

Display a Popup - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Tutorials › Display a Popup

e.
... the user // entered.
...lf.port.emit("text-entered", text); textarea.value = ''; } }, false); // listen for the "show" event being sent from the // main add-on code.

LookupNamespaceURI - Archive of obsolete content

Archive › Add-ons › Code snippets › LookupNamespaceURI

312019, this method does not work with dynamically assigned namespaces (e.g., those set with node.prefix).
...turn lookupnamespaceurihelper(this, prefix); } function lookupnamespaceurihelper (node, prefix) { // adapted directly from http://www.w3.org/tr/dom-level-3-core/namespaces-algorithms.html#lookupnamespaceurialgo var i, att, htmlmode = document.contenttype, // mozilla only xmlnspattern = /^xmlns:(.*)$/; switch (node.nodetype) { case 1: // element_node (could also just test for node.element_node, etc., if supported in all browsers) if (node.namespaceuri != null && node.prefix === prefix) { // note: prefix could be "null" in the case we are looking for default namespace return node.namespaceuri; } if (node.attributes.length) { for (i...
... } } if (node.parentnode && node.parentnode.nodetype !== 9) { // entityreferences may have to be skipped to get to it return lookupnamespaceurihelper(node.parentnode, prefix); } return null; case 9: // document_node return lookupnamespaceurihelper(node.documentelement, prefix); case 6: // entity_node case 12: // notation_node case 10: // document_type_node case 11: // document_fragment_node return null; // unknown case 2: // attribute_node if (node.ownerelement) { return lookupnamespaceurihelper(node.ownerelement, prefix); } ...

On page load - Archive of obsolete content

Archive › Add-ons › Code snippets › On page load

ul documents: application uri to overlay firefox chrome://browser/content/browser.xul thunderbird chrome://messenger/content/messenger.xul navigator from seamonkey chrome://navigator/content/navigator.xul attaching a script attach a script to your overlay (see "attaching a script to an overlay") that adds a load event listener to appcontent element (browsers) or messagepane (mail): window.addeventlistener("load", function load(event){ window.removeeventlistener("load", load, false); //remove listener, no longer needed myextension.init(); },false); var myextension = { init: function() { var appcontent = document.getelementbyid("appcontent"); // browser if(appcontent){ appcontent.addeventlistener("domcontentloaded"...
...ion load(event){ window.removeeventlistener("load", load, false); //remove listener, no longer needed myextension.init(); },false); var myextension = { init: function() { var appcontent = document.getelementbyid("appcontent"); // browser if(appcontent){ appcontent.addeventlistener("domcontentloaded", myextension.onpageload, true); } var messagepane = document.getelementbyid("messagepane"); // mail if(messagepane){ messagepane.addeventlistener("load", function(event) { myextension.onpageload(event); }, true); } }, onpageload: function(aevent) { var doc = aevent.originaltarget; // doc is document that triggered "onload" event // do something with the loaded page.
... }, onpageload: function(aevent) { var doc = aevent.originaltarget; // doc is document that triggered the event var win = doc.defaultview; // win is the window for the doc // test desired conditions and do something // if (doc.nodename != "#document") return; // only documents // if (win != win.top) return; //only top window.

Rosetta - Archive of obsolete content

Archive › Add-ons › Code snippets › Rosetta

oscript.getattribute("type").tolowercase(), obaton = document.createcomment(" the previous code has been automatically translated from \"" + smimetype + "\" to \"text/ecmascript\".
...efscript = oscript; oreq.open("get", oscript.src, true); oreq.send(null); } function parsescript (oscript) { if (oscript.hasattribute("type") && !rignoremimes.test(oscript.getattribute("type").tolowercase())) { oscript.hasattribute("src") ?
...s a short list of the mime types associated to some programming languages: language mime type bash text/x-shellscript java text/x-java-source c text/x-c, text/x-csrc c++ text/x-c++, text/x-c++src python text/x-python there are no limitations to the mime types that can be used for the type attribute of the <script> element.

Tabbox - Archive of obsolete content

Archive › Add-ons › Code snippets › Tabbox

although it may still work in some browsers, its use is discouraged since it could be removed at any time.
...id using it.
...ing the tabbox, tabs, and tabpanels widgets with id's the same as their nodename, this function will correctly remove the current tab and tab panel for the onclosetab tabs event: function removetab(){ var tabbox = document.getelementbyid("tabbox"); var currentindex = tabbox.selectedindex; if(currentindex>=0){ var tabs=document.getelementbyid("tabs"); var tabpanels=document.getelementbyid("tabpanels"); tabpanels.removechild(tabpanels.childnodes[currentindex]); tabs.removeitemat(currentindex); /*work around if last tab is removed, widget fails to advance to next tab*/ if(-1 == tabbox.selectedindex && tabs.childnodes.length>0){ tabbox.selectedindex=0; } } creating a close tab button to have a tab close button, you must configure the style.

Inline options - Archive of obsolete content

Archive › Add-ons › Inline Options

.options2" type="radio" title="options 2"> <radiogroup> <radio value="false" label="disabled"/> <radio value="true" label="enabled"/> </radiogroup> </setting>  <setting title="do something" type="control"> <button id="myaddon-button" label="click me" oncommand="alert('thank you!');"/> </setting> setting element changed notifications most of the setting elements (it might be all i havent really looked), support oninputchanged attribute.
...ement changed notifications most of the setting elements (it might be all i havent really looked), support oninputchanged attribute.
...ear.

User Notifications and Alerts - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › User Notifications and Alerts

manding immediate action before anything else can be done.
...acceptbutton.callback = function() { that.acceptrequest(); }; // similarly for decline button.
...hat affects z-indexing.

Adding preferences to an extension - Archive of obsolete content

Archive › Adding preferences to an extension

tion: function() { // because we may be called as a callback, we can't rely on // "this" referring to the right object, so we need to reference // it by its full name var symbol = stockwatcher.tickersymbol; var fullurl = "http://quote.yahoo.com/d/quotes.csv?f=sl1d1t1c1ohgv&e=.csv&s=" + symbol; function inforeceived() { var samplepanel = document.getelementbyid('stockwatcher2'); var output = httprequest.responsetext; if (output.length) { // remove any whitespace from the end of the string output = output.replace(/\w*$/, ""); // build the tooltip string var fieldarray = output.split(","); samplepanel.label = symbol + ": " + fieldarray[1]; samplepanel.tooltiptext = "chg: " + fieldar...
...d="symbol" maxlength="4"/> </hbox> </prefpane> </prefwindow> the <preferences> block establishes all the settings we implement as well as their types.
...block.

XML data - Archive of obsolete content

Archive › Beginner tutorials › XML data

ery similar to the original data in the xml file.
...ture.
...gin: 1em 0; } the most common values for the display property are: block displayed like html's div (for headings, paragraphs) inline displayed like html's span (for emphasis within text) add your own style rules that specify the font, spacing and other details in the same way as for html.

Localizing an extension - Archive of obsolete content

Archive › Localizing an extension

ode: <stringbundleset id="stringbundleset"> <stringbundle id="string-bundle" src="chrome://stockwatcher2/locale/stockwatcher2.properties"/> </stringbundleset> this establishes a new string bundle, referenced by the id "string-bundle", whose keys and values are to be loaded from the stockwatcher2.properties file we've already created.
...t code now we're ready to revise the javascript code to load the strings from the string bundle instead of using literal strings.
...elementbyid("string-bundle"); var changestring = stringsbundle.getstring('changestring') + " "; var openstring = stringsbundle.getstring('openstring') + " "; var lowstring = stringsbundle.getstring('lowstring') + " "; var highstring = stringsbundle.getstring('highstring') + " "; var volumestring = stringsbundle.getstring('volumestring') + " "; this code gets a reference to the string bundle element we added to stockwatcher2.xul by calling document.getelementbyid(), specifying the id "string-bundle".

Images, Tables, and Mysterious Gaps - Archive of obsolete content

Archive › Misc top level › Images, Tables, and Mysterious Gaps

he placement of a line box within a table cell.
...ce.
... authored in xhtml strict or html strict will trigger the "standards" rendering mode, so we're going to go through two basic ways to address the problem in strict documents, and a number of ways to call on these "fixes." setting images to be blocks the first choice, and one that will work for most graphically-intense designs, is to convert the image from being an inline element to a block-level element.

No Proxy For configuration - Archive of obsolete content

Archive › Misc top level › No Proxy For configuration

roxy for" is an optional field, part of "manual proxy configuration".
...field, part of "manual proxy configuration".
... "manual proxy configuration".

Editor Embedding Guide - Archive of obsolete content

Archive › Mozilla › Editor Embedding Guide

dered list from selection or inserts new list if there is no selection.
...note see also cmd_removelist cmd_ul makes unordered list from selection or inserts new list if there is no selection.
...ir.

Menu - Archive of obsolete content

Archive › Mozilla › Jetpack › UI › Menu

n the label.
... a new contextmenuset whose context menus are those that arise from nodes that match the given css selector(s).
... "a[href], img".

Porting NSPR to Unix Platforms - Archive of obsolete content

Archive › Mozilla › Porting NSPR to Unix Platforms

fg</tt> tool as follows: cd mozilla/nsprpub/pr/include gmake gencfg gencfg > foo.bar then you use the macro values in <tt>foo.bar</tt> as a basis for the <tt>_xxxos.cfg</tt> file.
...le.
...three thread context switch macros.

Extensions - Archive of obsolete content

Archive › Mozilla › Prism › Extensions

ased extension.
...code snippet will look something like this: <em:targetapplication> <!– prism –> <description> <em:id>prism@developer.mozilla.org</em:id> <em:minversion>0.8</em:minversion> <em:maxversion>1.0.0.*</em:maxversion> </description> </em:targetapplication> in addition to the install manifest changes, you may want to expose your extension into the prism ui.
...oper.mozilla.org</em:id> <em:minversion>0.8</em:minversion> <em:maxversion>1.0.0.*</em:maxversion> </description> </em:targetapplication> in addition to the install manifest changes, you may want to expose your extension into the prism ui.

Proxy UI - Archive of obsolete content

Archive › Mozilla › Proxy UI

references > advanced tab > networking tab > connection button.
... of the network.proxy.type.
...avior default value: "no proxy" is selected all other "type" radio buttons are enabled, but not selected.

RDF Datasource How-To - Archive of obsolete content

Archive › Mozilla › RDF Datasource How-To

." statements from one datasource can be combined with statements from another datasource using a composite datasource.
...u absolutely must invent your own." this will allow your datasource to be integrated with other datasources with a minimum of effort.
...ns contained in the datasource will be made available to the tree control for display.

Same origin policy for XBL - Archive of obsolete content

Archive › Mozilla › Same origin policy for XBL

e loaded.
...ipal the principal originating the load is determined using the following steps: for external stylesheets (<link>, <?xml-stylesheet?>, user sheets, and ua sheets), it depends on where the sheet is loaded from, just like it would for an html document loaded from a similar source.
...pal originating the load is determined using the following steps: for external stylesheets (<link>, <?xml-stylesheet?>, user sheets, and ua sheets), it depends on where the sheet is loaded from, just like it would for an html document loaded from a similar source.

accesskey - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › accesskey

« xul reference home attribute of: button, checkbox, caption, description, label, listitem, menu, menuitem, menulist, tab, radio, toolbarbutton, textbox accesskey type: character this should be set to a character that is used as a shortcut key.
... « xul reference home attribute of: button, checkbox, caption, description, label, listitem, menu, menuitem, menulist, tab, radio, toolbarbutton, textbox accesskey type: character this should be set to a character that is used as a shortcut key.
...ters that appears in the label attribute for the element.

button.type - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › button.type

if this attribute is not present, a normal button is created.
....
...the button to open and close the menu.

equalsize - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › equalsize

« xul reference home equalsize type: one of the values below this attribute can be used to make the children of the element equal in size.
... « xul reference home equalsize type: one of the values below this attribute can be used to make the children of the element equal in size.
... « xul reference home equalsize type: one of the values below this attribute can be used to make the children of the element equal in size.

eventnode - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › eventnode

« xul reference home eventnode type: one of the values below indicates where keyboard navigation events are listened to.
...listened to.
...element inside it must have the focus for the keyboard navigation to apply.

ordinal - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › ordinal

« xul reference home ordinal type: string (representing an integer) an integer which specifies the position of the element within its parent.
... « xul reference home ordinal type: string (representing an integer) an integer which specifies the position of the element within its parent.
... « xul reference home ordinal type: string (representing an integer) an integer which specifies the position of the element within its parent.

position - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › position

« xul reference home position type: string (representing an integer) when an element is in an overlay, the position is an index where the child is inserted.
... « xul reference home position type: string (representing an integer) when an element is in an overlay, the position is an index where the child is inserted.
... « xul reference home position type: string (representing an integer) when an element is in an overlay, the position is an index where the child is inserted.

rows - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › rows

« xul reference home rows type: integer the number of rows to display in the element.
... « xul reference home rows type: integer the number of rows to display in the element.
... « xul reference home rows type: integer the number of rows to display in the element.

targets - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › targets

« xul reference home targets type: comma-separated list of element ids a comma-separated list of element ids that the command updater will update upon.
... « xul reference home targets type: comma-separated list of element ids a comma-separated list of element ids that the command updater will update upon.
... « xul reference home targets type: comma-separated list of element ids a comma-separated list of element ids that the command updater will update upon.

template - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › template

« xul reference home template type: id for template generated elements, this attribute may optionally be placed on the root node (the element with the datasources attribute) to refer to a template that exists elsewhere in the xul code.
... « xul reference home template type: id for template generated elements, this attribute may optionally be placed on the root node (the element with the datasources attribute) to refer to a template that exists elsewhere in the xul code.
... generated elements, this attribute may optionally be placed on the root node (the element with the datasources attribute) to refer to a template that exists elsewhere in the xul code.

tooltip - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › tooltip

« xul reference home tooltip type: id should be set to the value of the id of the tooltip or panel element that should be used as a tooltip window when the mouse hovers over the element for a moment.
... « xul reference home tooltip type: id should be set to the value of the id of the tooltip or panel element that should be used as a tooltip window when the mouse hovers over the element for a moment.
... « xul reference home tooltip type: id should be set to the value of the id of the tooltip or panel element that should be used as a tooltip window when the mouse hovers over the element for a moment.

wait-cursor - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › wait-cursor

« xul reference home wait-cursor type: boolean set this attribute to true to have the cursor switch to a waiting cursor while the mouse is hovering over the element.
... « xul reference home wait-cursor type: boolean set this attribute to true to have the cursor switch to a waiting cursor while the mouse is hovering over the element.
... « xul reference home wait-cursor type: boolean set this attribute to true to have the cursor switch to a waiting cursor while the mouse is hovering over the element.

Working With Directories - Archive of obsolete content

Archive › Mozilla › XUL › FileGuide › Directories

eady exists, it won't be recreated.
...ifiedtime > lastmod.lastmodifiedtime) lastmod = item; } return lastmod; } this example iterates through the files in the home directory and looks for the file with the latest modification time (the last file in that directory that was written to).
...e with the latest modification time.

appendItem - Archive of obsolete content

Archive › Mozilla › XUL › Method › appendItem

« xul reference home appenditem( label, value ) return type: element creates a new item and adds it to the end of the existing list of items.
... « xul reference home appenditem( label, value ) return type: element creates a new item and adds it to the end of the existing list of items.
... « xul reference home appenditem( label, value ) return type: element creates a new item and adds it to the end of the existing list of items.

appendNotification - Archive of obsolete content

Archive › Mozilla › XUL › Method › appendNotification

« xul reference home appendnotification( label , value , image , priority , buttons, eventcallback ) return type: element create a new notification and display it.
...back ) return type: element create a new notification and display it.
... the buttons argument is an array of button descriptions.

removeItemAt - Archive of obsolete content

Archive › Mozilla › XUL › Method › removeItemAt

« xul reference home removeitemat( index ) return type: element removes the child item in the element at the specified index.
... « xul reference home removeitemat( index ) return type: element removes the child item in the element at the specified index.
...pecified index.

controllers - Archive of obsolete content

Archive › Mozilla › XUL › Property › controllers

« xul reference controllers type: nsicontrollers a controllers list attached to the element.
... « xul reference controllers type: nsicontrollers a controllers list attached to the element.
... the element.

deck.selectedPanel - Archive of obsolete content

Archive › Mozilla › XUL › Property › deck.selectedPanel

« xul reference do not hide panels; the deck element only understands visible panels.
... « xul reference do not hide panels; the deck element only understands visible panels.
... « xul reference do not hide panels; the deck element only understands visible panels.

Attribute Substitution - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Attribute Substitution

point out is that since the only characters that can separate a variable are a caret, a space or the end of the attribute, this means that any other character is valid as a variable name.
...aps hyphens to separate words.
....

XUL Accesskey FAQ and Policies - Archive of obsolete content

Archive › Mozilla › XUL › XUL Accesskey FAQ and Policies

what is an accesskey?
...pt has an accesskey elsewhere in mozilla, and use the same accesskey.
... buttons tree items list items column headers are there any crucial bugs i should know about?

page - Archive of obsolete content

Archive › Mozilla › XUL › page

« xul reference home [ examples | attributes | properties | methods | related ] similar to a window, except it should be used for xul files that are to be loaded into an iframe.
... align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , ...
... ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattr...

Getting started with XULRunner - Archive of obsolete content

Archive › Mozilla › XULRunner › Getting started with XULRunner

te powerful and can even be used on mobile devices.</description> </window> note: make sure there is no extra whitespace at the beginning of the xml/xul file the application also has a javascript file.
...e at the beginning of the xml/xul file the application also has a javascript file.
...the application also has a javascript file.

XUL Explorer - Archive of obsolete content

Archive › Mozilla › XUL Explorer

w xul inline or in a separate popup window.
...rror console.
...n startup.

xbDesignMode.js - Archive of obsolete content

Archive › Mozilla › xbDesignMode.js

rtions created by the initial developer are copyright (c) 2003 * the initial developer.
... * contributor(s): doron rosenberg <doron@netscape.com> (original author) * * * * ***** end license block ***** */ /* xbdesignmode a javascript wrapper for browsers that support designmode */ function xbdesignmode(aiframe){ this.meditordocument = null; this.miframeelement = null; // argument is a string, therefore an id if ( (typeof(aiframe) == "string") && (document.getelementbyid(aiframe).tagname.tolowercase()=="iframe") ){ this.miframeelement = document.getelementbyid(aiframe); } else if( (typeof(aiframe)=="object") && (aiframe.tagname.tolowercase() == "iframe") ){ this.miframeelement = aiframe; } else { throw "argument isn't an id of an iframe or an iframe reference"; } if (this.miframeelement.contentdocument){ // gecko this.meditordocum...
...ame.tolowercase()=="iframe") ){ this.miframeelement = document.getelementbyid(aiframe); } else if( (typeof(aiframe)=="object") && (aiframe.tagname.tolowercase() == "iframe") ){ this.miframeelement = aiframe; } else { throw "argument isn't an id of an iframe or an iframe reference"; } if (this.miframeelement.contentdocument){ // gecko this.meditordocument = this.miframeelement.contentdocument; this.meditordocument.designmode = "on"; } else { // ie this.meditordocument = this.miframeelement.contentwindow.document; this.meditordocument.designmode = "on"; // ie needs to reget the document element after designmode was set this.meditordocument = this.miframeelement.contentwindow.document; } } xbdesignmode.prototype.execcommand = function (acomm...

NPWindow - Archive of obsolete content

Archive › Plugins › Reference › NPWindow

width; /* maximum window size */ uint32_t height; nprect cliprect; /* clipping rectangle coordinates */ #ifdef xp_unix void * ws_info; /* platform-dependent additional data */ #endif /* xp_unix */ npwindowtype type; /* window or drawable target */ } npwindow; fields the data structure has the following fields: window platform-specific handle to a native window element in the netscape window hierarchy on windows (hwnd) and unix (x window id).
...us relative to the origin of the drawable).
... np_port structure unix/x11: not used.

Atomic RSS - Archive of obsolete content

Archive › RSS › Module › Atom

"getting started" box, if there is no "getting started" article yet written, should be populated with another feature article or tutorial, should one exist.
...ments into rss, adding the advantages of atom to rss while maintaining backwards compatibility.
...ng backwards compatibility.

Proposal - Archive of obsolete content

Archive › RSS › Proposal

sform must already exist on the machine running newsgator; stylesheets will not be downloaded or installed automatically.
... ipradio/podcasting works better with rss.
...opment rsshints a module that adds elements to a feed that help an aggregator process them.

Theme changes in Firefox 3.5 - Archive of obsolete content

Archive › Themes › Theme changes in Firefox 3.5

ft this page is not complete.
... before that change, opaque windows always had a shadow and transparent windows never had a shadow.
...r had a shadow.

-ms-ime-align - Archive of obsolete content

Archive › Web › CSS › -ms-ime-align

the -ms-ime-align css property is a microsoft extension aligning the input method editor (ime) candidate window box relative to the element on which the ime composition is active.
...sufficient size to allow basic text input.
...wing some keys to be sent to the app for suggestion list navigation.

-ms-scroll-limit - Archive of obsolete content

Archive › Web › CSS › -ms-scroll-limit

the -ms-scroll-limit css property is a microsoft extension that specifies values for the -ms-scroll-limit-x-min, -ms-scroll-limit-y-min, -ms-scroll-limit-x-max, and -ms-scroll-limit-y-max properties.
...a microsoft extension that specifies values for the -ms-scroll-limit-x-min, -ms-scroll-limit-y-min, -ms-scroll-limit-x-max, and -ms-scroll-limit-y-max properties.
...operty.

-ms-scroll-rails - Archive of obsolete content

Archive › Web › CSS › -ms-scroll-rails

the -ms-scroll-rails css property is a microsoft extension that specifies whether scrolling locks to the primary axis of motion.
... the -ms-scroll-rails css property is a microsoft extension that specifies whether scrolling locks to the primary axis of motion.
... elementsinheritednocomputed valueas specifiedanimation typediscrete syntax values none the content moves exactly with the user's finger.

-ms-scroll-snap-points-x - Archive of obsolete content

Archive › Web › CSS › -ms-scroll-snap-points-x

the -ms-scroll-snap-points-x css property is a microsoft extension that specifies where snap-points will be located along the x-axis.
... the -ms-scroll-snap-points-x css property is a microsoft extension that specifies where snap-points will be located along the x-axis.
...e; -ms-scroll-limit-x-min: 100%; -ms-scroll-limit-x-max: 500%; -ms-scroll-snap-type: proximity; -ms-scroll-snap-points-x: snaplist(100%, 200%, 300%, 400%, 500%); -ms-overflow-style: none; width: 480px; height: 270px; overflow: auto; } specifications not part of any specification.

-ms-scroll-snap-points-y - Archive of obsolete content

Archive › Web › CSS › -ms-scroll-snap-points-y

the -ms-scroll-snap-points-y css property is a microsoft extension that specifies where snap-points will be located along the y-axis.
... the -ms-scroll-snap-points-y css property is a microsoft extension that specifies where snap-points will be located along the y-axis.
...e; -ms-scroll-limit-y-min: 100%; -ms-scroll-limit-y-max: 500%; -ms-scroll-snap-type: proximity; -ms-scroll-snap-points-y: snaplist(100%, 200%, 300%, 400%, 500%); -ms-overflow-style: none; width: 480px; height: 270px; overflow: auto; } specifications not part of any specification.

-ms-scroll-snap-x - Archive of obsolete content

Archive › Web › CSS › -ms-scroll-snap-x

the -ms-scroll-snap-x css shorthand property is a microsoft extension that specifies values for the -ms-scroll-snap-type and -ms-scroll-snap-points-x properties.
... the -ms-scroll-snap-x css shorthand property is a microsoft extension that specifies values for the -ms-scroll-snap-type and -ms-scroll-snap-points-x properties.
...s in the following example have the same effect.

-ms-scroll-snap-y - Archive of obsolete content

Archive › Web › CSS › -ms-scroll-snap-y

the -ms-scroll-snap-x css shorthand property is a microsoft extension that specifies values for the -ms-scroll-snap-type and -ms-scroll-snap-points-y properties.
... the -ms-scroll-snap-x css shorthand property is a microsoft extension that specifies values for the -ms-scroll-snap-type and -ms-scroll-snap-points-y properties.
...orthand property.

-ms-scrollbar-base-color - Archive of obsolete content

Archive › Web › CSS › -ms-scrollbar-base-color

the -ms-scrollbar-base-color css property is a microsoft extension that specifies the base color of the main elements of a scroll bar.
... the -ms-scrollbar-base-color css property is a microsoft extension that specifies the base color of the main elements of a scroll bar.
... the -ms-scrollbar-base-color css property is a microsoft extension that specifies the base color of the main elements of a scroll bar.

E4X for templating - Archive of obsolete content

Archive › Web › E4X › E4X for templating

.length); } return strs.getstringfromname(msg); } for example, <toolbarbutton label={$s('mytoolbar.label')}/> conditionals function _if (cond, h, _else) { if (cond && cond != undefined) { // we need undefined condition for e4x return h(cond); } else if (_else) { return _else(cond); } return ''; // empty string allows conditions in attribute as well as element content } for example: {_if(elems.length(), function () <description>{elems[0]}</description>, function _else () <label>no data</label> )} note that the simple xmllist() constructor (<></>) may be useful to still be able to use an expression closure (i.e., without needing return statements and braces): {_if(elems.length(), function () <> <markup/> <markup/> </>)} note...
... ++it; } } else { for (k in arr) { if (it < min) { ++it; continue; } if (it > max) { break; } ret+=h(k, arr[k], it, lev); ++it; } } return ret; } the following real case example iterates over an array of the lines in an e4x child element to produce an xmllist of multiple vbox's representing each line: <vbox> {foreach(e(someel.somechild[0]).split('\n'), function (line) <description>{line}</description> )} </vbox> the following example shows iteration over an e4x object itself: {foreach(elems, function (k, elem, iter) <> <row>{k}: {elem}</row> <row><image src="chrome://myext/skin/images/fillerrow.jpg" /></row> </>)...
...of multiple vbox's representing each line: <vbox> {foreach(e(someel.somechild[0]).split('\n'), function (line) <description>{line}</description> )} </vbox> the following example shows iteration over an e4x object itself: {foreach(elems, function (k, elem, iter) <> <row>{k}: {elem}</row> <row><image src="chrome://myext/skin/images/fillerrow.jpg" /></row> </>)} or if the e4x child element had its own children and text: {foreach(elems, function (k, elem, iter) <> <row>{k}: {elem.text()} {elem.somechild}</row> <row><image src="chrome://myext/skin/images/fillerrow.jpg" /></row> </>)} sorting /* @param {xmllist} xmllist the xmllist to sort @param {function} h the sorting handler */ function sort (xmllist, h) { var k, arr=[], ret = <></>; for (k in xmllist) { ...

LiveConnect Overview - Archive of obsolete content

Archive › Web › LiveConnect › LiveConnect Overview

ckages.
...orld"); working with java arrays when any java method creates an array and you reference that array in javascript, you are working with a javaarray.
...script, you are working with a javaarray.

JavaArray - Archive of obsolete content

Archive › Web › LiveConnect Reference › JavaArray

rray is a wrapper for the instance; all references to the array instance are made through the javaarray.
... array instance are made through the javaarray.
...n addition, the tostring method is inherited from the object object and returns the following value: [object javaarray] you must specify a class object, such as one returned by java.lang.object.forname, for the componenttype parameter of newinstance when you use this method to create an array.

Window.importDialog() - Archive of obsolete content

Archive › Web › Window.importDialog

e dialog's parent; can be null.
...guments a javascript object containing data to pass to the dialog.
...tension/content/dialog.xul", myobject); notes the xul passed to importdialog() is very similar to xul passed to window.opendialog(), with some limitations and caveats: only <dialog> top level elements are permitted.

RFE to the Custom Controls Interfaces - Archive of obsolete content

Archive › Web › XForms › RFE › Custom Controls Interfaces

introduction this page contains requests for enhancement to the custom control interfaces.
...r with custom controls mechanism.
... - used to obtain the nsixformsaccessors interface nsixformsuiwidget - used by the xforms processor to update the value/state of an xforms element when its bound node's value/state is changed our current mechanism that allows authors to build custom controls assumes that the controls will be bound to instance nodes of simple content type.

Correctly Using Titles With External Stylesheets - Archive of obsolete content

Archive › Web Standards › Correctly Using Titles With External Stylesheets

external stylesheets are often associated with html documents using the <link rel="stylesheeet"> element, but it is important to use the element's title attribute properly.
... external stylesheets are often associated with html documents using the <link rel="stylesheeet"> element, but it is important to use the element's title attribute properly.
...therefore, given the above example, only one of the two preferred stylesheets will be applied to the document.

Displaying a graphic with audio samples - Archive of obsolete content

Archive › Web Standards › Displaying the Mozilla logo with the Audio Samples

the following example shows how to take samples from an audio stream and display them behind an image (in this case, the mozilla logo), giving the impression that the image is built from the samples.
...tml> <html> <head> <title>javascript spectrum example</title> </head> <body> <audio id="audio-element" src="revolve.ogg" controls="true" style="width: 512px;"> </audio> <div><canvas id="fft" width="512" height="200"></canvas></div> <img id="mozlogo" style="display:none" src="mozilla2.png"></img> <script> var canvas = document.getelementbyid('fft'), ctx = canvas.getcontext('2d'), channels, rate, framebufferlength, fft; function loadedmetadata() { channels = audio.mozchannels; rate = audio.mozsamplerate; framebufferlength = audio.mozframebufferlength; fft = new fft(framebufferlength / channels, rate); } ...
...fillrect (0,0, canvas.width, canvas.height); ctx.fillstyle = "rgb(255,255,255)"; for (var i = 0; i < signal.length; i++ ) { // multiply spectrum by a zoom value magnitude = signal[i] * 1000; // draw rectangle bars for each frequency bin ctx.fillrect(i * 4, canvas.height, 3, -magnitude); } ctx.drawimage(document.getelementbyid('mozlogo'),0,0, canvas.width, canvas.height); } var audio = document.getelementbyid('audio-element'); audio.addeventlistener('mozaudioavailable', audioavailable, false); audio.addeventlistener('loadedmetadata', loadedmetadata, false); </script> </body> </html> ...

Async scripts for asm.js - Game development

Games › Techniques › Async scripts

game doesn't need to be compiled on subsequent loads (starting in firefox 28).
...var script = document.createelement('script'); script.src = "file.js"; document.body.appendchild(script); (scripts created from script default to async.) the default html shell emscripten generates produces the latter.
...ment.createelement('script'); script.innerhtml = "code"; document.body.appendchild(script); both are counted as 'inline' scripts and get compiled and then run immediately.

Crisp pixel art look with image-rendering - Game development

Games › Techniques › Crisp pixel art look

ows you to use the images in their original, smaller size, thus saving download time.
...in most browsers.
...as: <canvas id="game" width="128" height="128"></canvas> css to size the canvas and render a crisp image: canvas { width: 512px; height: 512px; image-rendering: -moz-crisp-edges; image-rendering: -webkit-crisp-edges; image-rendering: pixelated; image-rendering: crisp-edges; } and some javascript to set up the canvas and load the image: // get canvas context var ctx = document.getelementbyid('game').getcontext('2d'); // load image var image = new image(); image.onload = function () { // draw the image into the canvas ctx.drawimage(image, 0, 0); } image.src = 'https://udn.realityripple.com/samples/11/a2954fe197.png'; this code used together produces the following result: note: you can check out the original code on github (and a live example.) ...

Tiles and tilemaps overview - Game development

Games › Techniques › Tilemaps

mplementation: static maps.
...d at a time.
...ring behind the top of a tree) and a tile (the bush) being rendered over different terrain types.

Flex Container - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Flex Container

a flexbox layout is defined using the flex or inline-flex values of the display property on the parent item.
... a flexbox layout is defined using the flex or inline-flex values of the display property on the parent item.
... a flexbox layout is defined using the flex or inline-flex values of the display property on the parent item.

HTML - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › HTML

was released in 1999 and became an iso standard in 2000.
...sed in 1999 and became an iso standard in 2000.
...t and syntax an html document is a plaintext document structured with elements.

Screen reader - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Screen reader

u can also toggle voiceover on and off with fn+command + f5.
...ver both reads aloud and displays content.
...ontent.

Shadow tree - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Shadow tree

ch is attached to a standard dom node that serves as a host.
...ctionality, but require the use of a special shadow dom api to access.
... the use of a special shadow dom api to access.

Property (CSS) - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › property › CSS

a css property is a characteristic (like color) whose associated value defines one aspect of how the browser should display the element.
... a css property is a characteristic (like color) whose associated value defines one aspect of how the browser should display the element.
...lement.

MDN Web Docs Glossary: Definitions of Web-related terms

Glossary

t dom (document object model) domain domain name domain sharding dominator dos attack dtls (datagram transport layer security) dtmf (dual-tone multi-frequency signaling) dynamic programming language dynamic typing e ecma ecmascript effective connection type element empty element encapsulation encryption endianness engine entity entity header event exception expando f fallback alignment falsy favicon fetch directive fetch metadata request header firefox os firewall first contentful p...
...light request prerender presto primitive privileged privileged code progressive enhancement progressive web apps promise property property (css) property (javascript) protocol prototype prototype-based programming proxy server pseudo-class pseudo-element pseudocode public-key cryptography python q quality values quaternion quic r rail random number generator raster image rdf real user monitoring (rum) recursion reference reflow regular expression rendering engine r...
... round trip time (rtt) routers rss rtcp (rtp control protocol) rtf rtl (right to left) rtp (real-time transport protocol) and srtp (secure rtp) rtsp: real-time streaming protocol ruby s safe same-origin policy scm scope screen reader script-supporting element scroll container scrollport sctp sdp search engine second-level domain secure sockets layer (ssl) selector (css) self-executing anonymous function semantics seo serialization server server timing session hijacking sgml shadow tree shim ...

What is accessibility? - Learn web development

Learn › Accessibility › What is accessibility

on of accessibility for people with cognitive impairments includes: delivering content in more than one way, such as by text-to-speech or by video; easily-understood content, such as text written using plain-language standards; focusing attention on important content; minimizing distractions, such as unnecessary content or advertisements; consistent webpage layout and navigation; familiar elements, such as underlined links blue when not visited and purple when visited; dividing processes into logical, essential steps with progress indicators; website authentication as easy as possible without compromising security; and making forms easy to complete, such as with clear error messages and simple error recovery.
...ble should be fairly minimal.
...rmation, or javascript.

Overflowing content - Learn web development

Learn › CSS › Building blocks › Overflowing content

pected when designing the site, or the text may be larger.
...oids making overflowing content invisible.
...atic overflow.

Test your skills: Grid Layout - Learn web development

Learn › CSS › CSS layout › Grid skills

this aim of this task is to get you working with css grid layout, and test that you understand how a grid and grid items behave.
...d.
...he available space equally, and a 20-pixel gap between the column and row tracks.

Learn to style HTML using CSS - Learn web development

Learn › CSS

fferent display settings, modern layout tools like flexbox, css grid, and positioning, and some of the legacy techniques you might still want to know about.
...d positioning, and some of the legacy techniques you might still want to know about.
...chniques you might still want to know about.

Example 5 - Learn web development

Learn › Forms › How to build custom form controls › Example 5

ow) { var optlist = select.queryselector('.optlist'); optlist.classlist.toggle('hidden'); } function highlightoption(select, option) { var optionlist = select.queryselectorall('.option'); optionlist.foreach(function (other) { other.classlist.remove('highlight'); }); option.classlist.add('highlight'); }; function updatevalue(select, index) { var nativewidget = select.previouselementsibling; var value = select.queryselector('.value'); var optionlist = select.queryselectorall('.option'); optionlist.foreach(function (other) { other.setattribute('aria-selected', 'false'); }); optionlist[index].setattribute('aria-selected', 'true'); nativewidget.selectedindex = index; value.innerhtml = optionlist[index].innerhtml; highlightoption(select, optionlist[index]);...
...st = select.queryselectorall('.option'); optionlist.foreach(function (other) { other.setattribute('aria-selected', 'false'); }); optionlist[index].setattribute('aria-selected', 'true'); nativewidget.selectedindex = index; value.innerhtml = optionlist[index].innerhtml; highlightoption(select, optionlist[index]); }; function getindex(select) { var nativewidget = select.previouselementsibling; return nativewidget.selectedindex; }; // ------------- // // event binding // // ------------- // window.addeventlistener("load", function () { var form = document.queryselector('form'); form.classlist.remove("no-widget"); form.classlist.add("widget"); }); window.addeventlistener('load', function () { var selectlist = document.queryselectorall('.select'); selectlist.fore...
... = document.queryselector('form'); form.classlist.remove("no-widget"); form.classlist.add("widget"); }); window.addeventlistener('load', function () { var selectlist = document.queryselectorall('.select'); selectlist.foreach(function (select) { var optionlist = select.queryselectorall('.option'), selectedindex = getindex(select); select.tabindex = 0; select.previouselementsibling.tabindex = -1; updatevalue(select, selectedindex); optionlist.foreach(function (option, index) { option.addeventlistener('mouseover', function () { highlightoption(select, option); }); option.addeventlistener('click', function (event) { updatevalue(select, index); }); }); select.addeventlistener('click', function (event) { t...

Structuring the web with HTML - Learn web development

Learn › HTML

to build websites, you should know about html — the fundamental technology used to define the structure of a webpage.
... to build websites, you should know about html — the fundamental technology used to define the structure of a webpage.
...n then move on to learning about more advanced topics such as: css, and how to use it to style html (for example alter your text size and fonts used, add borders and drop shadows, layout your page with multiple columns, add animations and other visual effects.) javascript, and how to use it to add dynamic functionality to web pages (for example find your location and plot it on a map, make ui elements appear/disappear when you toggle a button, save users' data locally on their computers, and much much more.) modules this topic contains the following modules, in a suggested order for working through them.

Test your skills: Events - Learn web development

Learn › JavaScript › Building blocks › Test your skills: Events

the examples below, if there is an error in your code it will be outputted into the results panel on the page, to help you try to figure out the answer (or into the browser's javascript console, in the case of the downloadable version).
...e page, to help you try to figure out the answer (or into the browser's javascript console, in the case of the downloadable version).
...s as inputs: x — the x coordinate of the circle.

Test your skills: Loops - Learn web development

Learn › JavaScript › Building blocks › Test your skills: Loops

e live editable versions of these tasks because of the risk of creating infinite loops and crashing the assessment page!
...assessment page!
...ome examples that make use of it, and we'd like you to do some research into what dom apis you need to successfully answer the questions.

What went wrong? Troubleshooting JavaScript - Learn web development

Learn › JavaScript › First steps › What went wrong

f the loworhi constant to a text string, but it's not working because loworhi does not contain what it's supposed to.
... print the value of loworhi to the console as soon as we have tried to set it in line 48.
...g further up our file, we can find the paragraph in question: <p class="loworhi"></p> so we need a class selector here, which begins with a dot (.), but the selector being passed into the queryselector() method in line 48 has no dot.

Adding features to our bouncing balls demo - Learn web development

Learn › JavaScript › Objects › Adding bouncing balls features

x-finished.html, style.css, and main-finished.js from our last article in a new directory in your local computer.
...ball and call the draw(), update(), and collisiondetect() functions for each one, make it so that these functions are only called if the current ball exists.
...date(), and collisiondetect() functions for each one, make it so that these functions are only called if the current ball exists.

Aprender y obtener ayuda - Learn web development

Learn › Learning and getting help

s the art of effective web searches — what search terms do you need to use in your favorite search engine to find the articles you need?
...could search for "responsive web design".
...other keywords as modifiers, for example "<video> element autoplay attribute", or "date.settime parameters".

Web performance resources - Learn web development

Learn › Performance › Web Performance Basics

server (or cdn).
...hat is required for any content that is rendered above the fold, or what you see in the browser viewport before scrolling.
...ed above the fold, or what you see in the browser viewport before scrolling.

Using Vue computed properties - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Vue computed properties

roperty.
...) { const numberfinisheditems = this.todoitems.filter(item =>item.done).length return `${numberfinisheditems} out of ${this.todoitems.length} items completed` } } now we can add {{listsummary}} directly to our template; we'll add this inside an <h2> element, just above our <ul>.
... currently, we're not actually tracking the "done" data in any fashion, so the number of completed items does not change.

Debugging Frame Reflow

Mozilla › Debugging › Debugging Frame Reflow

g capabilities implemented in nsframe.cpp.
...mputed height is 4470 twips (c=9180,4470).
...ilable height for the outer table frame is unconstrained.

Inner and outer windows

Mozilla › Developer guide › Inner and outer windows

slightly more complex when you consider that documents can contain other documents.
....
... more abstract inner and outer windows, which are real objects that you don't directly interact with when working with the dom.

Error codes returned by Mozilla APIs

Mozilla › Errors

undleservice has been set with a badly encoded property file.
...aracter_err (0x80530005) an invalid character was used in a tag or attribute name.
...57001c) ns_error_xpc_js_threw_null (0x8057001d) ns_error_xpc_js_threw_string (0x8057001e) ns_error_xpc_js_threw_number (0x8057001f) ns_error_xpc_javascript_error (0x80570020) ns_error_xpc_javascript_error_with_details (0x80570021) ns_error_xpc_cant_convert_primitive_to_array (0x80570022) ns_error_xpc_cant_convert_object_to_array (0x80570023) ns_error_xpc_not_enough_elements_in_array (0x80570024) ns_error_xpc_cant_get_array_info (0x80570025) ns_error_xpc_not_enough_chars_in_string (0x80570026) ns_error_xpc_security_manager_veto (0x80570027) ns_error_xpc_interface_not_scriptable (0x80570028) ns_error_xpc_interface_not_from_nsisupports (0x80570029) ns_error_xpc_cant_get_jsobject_of_dom_object (0x8057002a) ns_error_xpc_cant_set_read_only_con...

Cross Process Object Wrappers

Mozilla › Firefox › Multiprocess Leftovers › Cross Process Object Wrappers

to them.
... process can synchronously pass objects (such as event listener functions) into functions defined in the cpow.
...: event.target }); }, false); // chrome script /* load the frame script, then listen for the message.

Firefox UI considerations for web developers

Mozilla › Firefox › UI considerations

to manage in some way.
...ntil it obtains an icon to use: a global "top sites" list is checked.
...o size attribute are assumed to be the standard classic iphone size of 57x57 pixels.

mozbrowserfindchange

Mozilla › Gecko › Chrome › API › Browser API › mozbrowserfindchange

d this feature is non-standard and is not on a standards track.
...tandard and is not on a standards track.
...track.

mozbrowseropenwindow

Mozilla › Gecko › Chrome › API › Browser API › mozbrowseropenwindow

may also be large incompatibilities between implementations and the behavior may change in the future.
... read only boolean whether the event normally bubbles or not.
...n anonymous javascript object with the following properties: url a domstring representing the url of the document loaded within the frameelement property.

Embedding the editor

Mozilla › Gecko › Embedding Mozilla › Embedding the editor

ng requires that the composer code is agnostic to where its ui is coming from; communication between the core editor and the ui needs to go through one or more interfaces that insulate the editor from its host application.
...iple <iframe>s (consider a frameset document, or a document itself containing an <html:iframe>).
... composer should go through this interface.

Getting from Content to Layout

Mozilla › Getting from Content to Layout

gecko maintains two separate representations of a document in memory: the content tree and the frame tree.
...t all nodes in the document.
...se notifications and does the following: dispatches "restyle events" which trigger the reprocessing of relevant css selectors and any restyling that needs to occur.

MathML Accessibility in Mozilla

Mozilla › MathML Project › a11y

__________ ∑ f ( p ) = ∫, subscript t > 1, f ( t ) d π ( t ) see webkit's bug 146407 sum.
... a comma ...
...end set __________ { a , ...

DMD

Mozilla › Performance › DMD

place/dmd/../../../../memory/replace/dmd/dmd.cpp:1286) #02: malloc (/home/njn/moz/mi5/go64dmd/memory/build/../../../memory/build/replace_malloc.c:153) #03: moz_xmalloc (/home/njn/moz/mi5/memory/mozalloc/mozalloc.cpp:84) #04: nscyclecollectingautorefcnt::incr(void*, nscyclecollectionparticipant*) (/home/njn/moz/mi5/go64dmd/dom/xul/../../dist/include/nsisupportsimpl.h:250) #05: nsxulelement::create(nsxulprototypeelement*, nsidocument*, bool, bool,mozilla::dom::element**) (/home/njn/moz/mi5/dom/xul/nsxulelement.cpp:287) #06: nsxblcontentsink::createelement(char16_t const**, unsigned int, mozilla::dom::nodeinfo*, unsigned int, nsicontent**, bool*, mozilla::dom::fromparser) (/home/njn/moz/mi5/dom/xbl/nsxblcontentsink.cpp:874) #07: nscomptr<nsicontent>::startassignment() (/home/...
.../dom/xul/nsxulelement.cpp:287) #06: nsxblcontentsink::createelement(char16_t const**, unsigned int, mozilla::dom::nodeinfo*, unsigned int, nsicontent**, bool*, mozilla::dom::fromparser) (/home/njn/moz/mi5/dom/xbl/nsxblcontentsink.cpp:874) #07: nscomptr<nsicontent>::startassignment() (/home/njn/moz/mi5/go64dmd/dom/xml/../../dist/include/nscomptr.h:753) #08: nsxmlcontentsink::handlestartelement(char16_t const*, char16_t const**, unsigned int, unsigned int, bool) (/home/njn/moz/mi5/dom/xml/nsxmlcontentsink.cpp:1007) } } it tells you that there were 150 heap blocks that were allocated from the program point indicated by the "allocated at" stack trace, that these blocks took up 21,600 bytes, that all 150 blocks had a size of 144 bytes, and that 1,200 of those bytes were "slop" (wasted s...
...mdfuncs::report(void const*) (/home/njn/moz/mi5/go64dmd/memory/replace/dmd/../../../../memory/replace/dmd/dmd.cpp:1646) #02: windowsmallocsizeof(void const*) (/home/njn/moz/mi5/dom/base/nswindowmemoryreporter.cpp:189) #03: nsattrandchildarray::sizeofexcludingthis(unsigned long (*)(void const*)) const (/home/njn/moz/mi5/dom/base/nsattrandchildarray.cpp:880) #04: mozilla::dom::fragmentorelement::sizeofexcludingthis(unsigned long (*)(void const*)) const (/home/njn/moz/mi5/dom/base/fragmentorelement.cpp:2337) #05: nsinode::sizeofincludingthis(unsigned long (*)(void const*)) const (/home/njn/moz/mi5/go64dmd/parser/html/../../../dom/base/nsinode.h:307) #06: mozilla::dom::nodeinfo::nodetype() const (/home/njn/moz/mi5/go64dmd/dom/base/../../dist/include/mozilla/dom/nodeinfo.h:127) ...

Investigating CSS Performance

Mozilla › Performance › Investigating CSS Performance

http://people.mozilla.org/~jmuizelaar/css-perf.patch this patch instruments a bunch of key places and should give an estimate of the order of magnitude of the different parents.
...timation of the amount of work being done during restyle: resolvestyleforcount this is incremented everytime that we do style resolution on an element contentenumfunccount this is incremented roughly for every rule that we test against time during restyle can be spent in a bunch of places.
...orcount this is incremented everytime that we do style resolution on an element contentenumfunccount this is incremented roughly for every rule that we test against time during restyle can be spent in a bunch of places.

Scroll-linked effects

Mozilla › Performance › Scroll-linked effects

here something changes based on the scroll position, for example updating a positioning property with the aim of producing a parallax scrolling effect.
...something we want to avoid.
... } else if (math.abs(destination - window.scrolly) < 200) { scrollto(window.scrollx, window.scrolly + ((destination - window.scrolly) / 2)); settimeout(snap, 20, destination); } } var timeoutid = null; addeventlistener("scroll", function() { if (timeoutid) cleartimeout(timeoutid); timeoutid = settimeout(snap, 200, parseint(document.getelementbyid('snaptarget').style.top)); }, true); </script> <div id="snaptarget" class="snaptarget" style="position: relative; top: 200px; width: 100%; height: 200px; background-color: green"></div> </body> in this example, there is a scroll event listener which detects if the scroll position is within 200 pixels of the top of the "snaptarget" div.

accessibility.tabfocus

Mozilla › Preferences › Preference reference › accessibility.tabfocus

the preference accessibility.tabfocus controls what elements receive focus when the user presses the tab key.
...y.
...dows and linux); 2 (mac os x) exists by default: no application support:gecko 1.7 status: active introduction: bugs: bug 140612 values 1 give focus only to text fields (default on mac osx) 2 give focus to all form elements except text fields.

Midas

Mozilla › Projects › Midas

n html document.
...voked, a few more methods of the document object become available.
...ection or at the insertion point if there is no selection.

PR_APPEND_LINK

Mozilla › Projects › NSPR › Reference › PR APPEND LINK

appends an element to the end of a list.
... appends an element to the end of a list.
... appends an element to the end of a list.

PR_INSERT_LINK

Mozilla › Projects › NSPR › Reference › PR INSERT LINK

inserts an element at the head of the list.
... inserts an element at the head of the list.
... inserts an element at the head of the list.

PR_REMOVE_LINK

Mozilla › Projects › NSPR › Reference › PR REMOVE LINK

removes an element from a circular list.
... removes an element from a circular list.
... removes an element from a circular list.

An overview of NSS Internals

Mozilla › Projects › NSS › An overview of NSS Internals

ographic operations, nss conforms to a standard called pkcs#11.
...those modules.
...s important to note that nss requires strict cleanup for all handles returned by nss.

Index

Mozilla › Projects › NSS › Index

ographic operations, nss conforms to a standard called pkcs#11.
...those modules.
...s important to note that nss requires strict cleanup for all handles returned by nss.

JIT Optimization Outcomes

Mozilla › Projects › SpiderMonkey › JIT Optimization Outcomes

flow the array's length, the optimization strategy may fail.
... the range attributes of an inline array creation.
...enericproxy icgetpropstub_argumentslength icsetpropstub_slot icsetpropstub_genericproxy icsetpropstub_domproxyshadowed icsetpropstub_domproxyunshadowed icsetpropstub_callsetter icsetpropstub_addslot icsetpropstub_setunboxed icgetelemstub_readslot icgetelemstub_callgetter icgetelemstub_readunboxed icgetelemstub_dense icgetelemstub_densehole icgetelemstub_typedarray icgetelemstub_argselement icgetelemstub_argselementstrict icsetelemstub_dense icsetelemstub_typedarray icnamestub_readslot icnamestub_callgetter call inlining outcomes optimization outcomes of attempts to inline function calls.

JS_ClearNonGlobalObject

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS ClearNonGlobalObject

obj jsobject * object from which to delete all properties.
... object from which to delete all properties.
... description js_clearnonglobalobject removes all of obj's own properties, except the special __proto__ and __parent__ properties, in a single operation.

JS_ClearScope

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS ClearScope

xt.
...object * object from which to delete all properties.
...ties.

JS_PushArguments

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS PushArguments

of the c programming language.
...ion * * none.
...xample, if format is "biob", then there must be four arguments after format.

Secure Development Guidelines

Mozilla › Security › Secure Development Guidelines

v) { foo(argv[1]); } bbv: stack overflow before the stack overflow bbv: stack overflow after the stack overflow bbv: heap overflow dynamic memory malloc() calloc() heapalloc() mmap() not on the stack segment!
...bv: stack overflow before the stack overflow bbv: stack overflow after the stack overflow bbv: heap overflow dynamic memory malloc() calloc() heapalloc() mmap() not on the stack segment!
... the stack overflow bbv: stack overflow after the stack overflow bbv: heap overflow dynamic memory malloc() calloc() heapalloc() mmap() not on the stack segment!

Components.utils.cloneInto

Mozilla › Tech › XPCOM › Language Bindings › Components.utils.cloneInto

hould be cloned.
...ame mechanism as that used in components.utils.exportfunction: // add-on script var addonscriptobject = { greetme: function() { alert("hello from add-on"); } }; contentwindow.addonscriptobject = cloneinto(addonscriptobject, contentwindow, {clonefunctions: true}); // page script var test = document.getelementbyid("test"); test.addeventlistener("click", function() { window.addonscriptobject.greetme(); }, false); cloning objects that contain dom elements by default, if the object you clone contains objects that are reflected from c++, such as dom elements, the cloning operation will fail with an error.
...apreflectors:true} flag, then the object you clone is allowed to contain these objects: // add-on script var addonscriptobject = { body: contentwindow.document.body }; contentwindow.addonscriptobject = cloneinto(addonscriptobject, contentwindow, {wrapreflectors: true}); // page script var test = document.getelementbyid("test"); test.addeventlistener("click", function() { console.log(window.addonscriptobject.body.innerhtml); }, false); access to these objects in the target scope is subject to the normal security checks.

Components.utils.exportFunction

Mozilla › Tech › XPCOM › Language Bindings › Components.utils.exportFunction

s to the argument that are made in the exported function will affect the original object that was passed in: // privileged scope: for example, a content script function changemyname(user) { user.name = "bill"; } exportfunction(changemyname, contentwindow, { defineas: "changemyname" }); // less-privileged scope: for example, a page script var user = {name: "jim"}; var test = document.getelementbyid("test"); test.addeventlistener("click", function() { console.log(user.name); // "jim" window.changemyname(user); console.log(user.name); // "bill" }, false); note that this is subject to the normal rules of xrays: for example, an expando property added to a dom node will not be visible in the original object.
...rays: // privileged scope: for example, a content script function loguser(user) { // console.log(user.getuser()); // error console.log(user.wrappedjsobject.getuser()); // "bill" } exportfunction(loguser, contentwindow, { defineas: "loguser" }); // less-privileged scope: for example, a page script var user = {getuser: function() {return "bill";}} var test = document.getelementbyid("test"); test.addeventlistener("click", function() { window.loguser(user); }, false); passing functions as arguments if functions are given as arguments, these are also passed as xrays.
...callbacks into the exported function just works, making the allowcallbacks option redundant: // privileged scope: for example, a content script function loguser(getuser) { console.log(getuser()); // "bill" } exportfunction(loguser, unsafewindow, { defineas: "loguser" }); // less-privileged scope: for example, a page script function getuser() { return "bill"; } var test = document.getelementbyid("test"); test.addeventlistener("click", function() { window.loguser(getuser); }, false); cross-origin checking when the exported function is called each argument, including this, is checked to make sure that the caller subsumes that argument.

nsACString

Mozilla › Tech › XPCOM › Reference › Glue classes › nsACString

string { ...
...type of this class.
...type [pruint32] type used to represent the number of bytes stored in the string.

nsAString

Mozilla › Tech › XPCOM › Reference › Glue classes › nsAString

ar_type [prunichar] storage unit for this class.
...ize_type [pruint32] type used to represent the number of double-byte units stored in the string.
...used to represent the number of double-byte units stored in the string.

nsIAccessNode

Mozilla › Tech › XPCOM › Reference › Interface › nsIAccessNode

mitivevalue for the dom node this access node is associated with.
...g for general computed style information for the node.
...ue() retrieve the computed style value for this dom node, if it is a dom element.

nsIAccessible

Mozilla › Tech › XPCOM › Reference › Interface › nsIAccessible

cross-platform interface that supports platform-specific accessibility apis like msaa and atk.
...ndex.
... provides localized string of accesskey name, such as alt+d.

nsIAccessibleTable

Mozilla › Tech › XPCOM › Reference › Interface › nsIAccessibleTable

boolean isrowselected(in long rowindex); void selectcolumn(in long columnindex); void selectrow(in long rowindex); void unselectcolumn(in long columnindex); void unselectrow(in long rowindex); attributes attribute type description caption nsiaccessible the caption accessible for the table.
...cted(in long rowindex); void selectcolumn(in long columnindex); void selectrow(in long rowindex); void unselectcolumn(in long columnindex); void unselectrow(in long rowindex); attributes attribute type description caption nsiaccessible the caption accessible for the table.
...edcolumncount unsigned long the total number of selected columns.

nsICategoryManager

Mozilla › Tech › XPCOM › Reference › Interface › nsICategoryManager

ractid(ns_categorymanager_contractid, ns_get_iid(nsicategorymanager), getter_addrefs(catmgr)); if (ns_failed(rv)) return rv; nscomptr<nsisimpleenumerator> cats; rv = catmgr->enumeratecategories(getter_addrefs(cats)); if (ns_failed(rv)) return rv; prbool hasmore; while (ns_succeeded(cats->hasmoreelements(&hasmore) && hasmore) { nscomptr<nsisupports> elem; cats->getnext(getter_addrefs(elem)); nscomptr<nsisupportscstring> category = do_queryinterface(elem, &rv); if (ns_failed(rv)) break; nsembedcstring categoryname; rv = category->getdata(categoryname); if (ns_failed(rv)) break; printf("%s\n", categoryname.get()); } return ns_ok; } this snipp...
...intf("%s\n", categoryname.get()); } return ns_ok; } this snippet shows how to print out a list of all categories in javascript.
...tring + "\n"); print out a list of app-startup entries this example prints out a list of entries of "app-startup" category.

nsIDOMWindow

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMWindow

dom/interfaces/base/nsidomwindow.idlscriptable this interface is the primary interface for a window object.
...d.
...eventtarget the window root for this window.

nsIDOMWindowInternal

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMWindowInternal

returns the maximum number of pixels that the document can be scrolled horizontally.
...ximum number of pixels that the document can be scrolled horizontally.
...t the document can be scrolled horizontally.

nsIDialogCreator

Mozilla › Tech › XPCOM › Reference › Interface › nsIDialogCreator

embedding/base/nsidialogcreator.idlscriptable please add a summary to this article.
...ing/base/nsidialogcreator.idlscriptable please add a summary to this article.
... long atype, in acstring aname, in acstring afeatures, in nsidialogparamblock aarguments, [optional] in nsidomelement aframeelement); constants constant value description unknown_dialog 0 generic_dialog 1 select_dialog 2 methods opendialog() void opendialog( in unsigned long atype, in acstring aname, in acstring afeatures, in nsidialogparamblock aarguments, in nsidomelement aframeelement optional ); parameters atype aname afeatures aarguments aframeelement optional ...

nsIMessenger

Mozilla › Tech › XPCOM › Reference › Interface › nsIMessenger

r set for the displayed message.
...splaycharset(in acstring acharset); parameters acharset the character set to use.
...r session.

nsIStringBundle

Mozilla › Tech › XPCOM › Reference › Interface › nsIStringBundle

rray, size_is(length)] in wstring params, in unsigned long length); nsisimpleenumerator getsimpleenumeration(); wstring getstringfromid(in long aid); wstring getstringfromname(in wstring aname); methods formatstringfromid() returns a formatted string with the given id from the string bundle, where each occurrence of %s (uppercase) is replaced by each successive element in the supplied array.
...g params, in unsigned long length ); parameters aid the id of the string to retrieve.
...gth)] in wstring params, in unsigned long length ); parameters aname the name of the string to retrieve.

nsITreeColumn

Mozilla › Tech › XPCOM › Reference › Interface › nsITreeColumn

native code only!
...ly!
...ecolumns the nsitreecolumns containing this column.

nsIXSLTProcessor

Mozilla › Tech › XPCOM › Reference › Interface › nsIXSLTProcessor

uri the namespaceuri of the xslt parameter.
...the value of the parameter.
...cified stylesheet into this xsltprocessor for transformations.

Building a Thunderbird extension 5: XUL

Mozilla › Thunderbird › Thunderbird extensions › Building a Thunderbird extension 5: XUL

warning: this content is for older versions of thunderbird.
... longer be relevant.
...tion/javascript" src="chrome://myfirstext/content/overlay.js"/> <statusbar id="status-bar"> <statusbarpanel id="my-panel" label="date"/> </statusbar> </overlay> the <statusbar> widget named status-bar specifies the merge point within the application window that we want to attach to.

Building a Thunderbird extension 6: Adding JavaScript

Mozilla › Thunderbird › Thunderbird extensions › Building a Thunderbird extension 6: Adding Javascript

rsions of thunderbird.
...lt will look something like this: modify xul elements with javascript save the following javascript code into the content/ folder next to your myhelloworld.xul file and name it overlay.js.
....getelementbyid("my-panel"); var date = new date(); var day = date.getday(); var datestring = date.getfullyear() + "." + (date.getmonth()+1) + "." + date.getdate(); mypanel.label = "date: " + datestring; } the first part registers a new event listener that will be executed automatically when thunderbird loads.

Using popup notifications

Mozilla › Using popup notifications

ing any secondary actions; that is, actions provided to the user through the drop-down menu.
...king on the notification icon again.
...on for the popup notification you can use a timeout to make your notification automatically disappear after some amount of time, by calling notification.remove() as shown below.

Type conversion

Mozilla › js-ctypes › Using js-ctypes › Type conversion

implicit convert in js-ctypes, data could be converted implicitly when passing to or returning from a functiontype call, or setting pointer content, an array element or a struct field.
...ct.v = ctypes.int32_t(10); // throws error float types target type source converted value any float types js number (only if fits to the size) src pointer types target type source converted value any pointer types null nullptr ctypes.voidptr_t any pointer types src any array types src.addressofelement(0) ctypes.pointertype(t) ctypes.arraytype(t) src.addressofelement(0) ctypes.arraytype(t, n) src.addressofelement(0) var mystruct = ctypes.structtype("mystructtype", [ { "v": ctypes.int16_t.ptr } ])(); mystruct.v = ctypes.int16_t.array(10)(); console.log(mystruct.v.tostring()); // 'ctypes.int16_t.ptr(ctypes.uint64("0x11d6ff400"))' mystruct.v = null; consol...
... ctypes.char.array(n) js string (only if utf8 representation fits to the array) null-terminated utf8 string ctypes.signed_char.array(n) ctypes.unsigned_char.array(n) ctypes.char16_t.array(n) js string (only if fits to the array) null-terminated utf16 string any array types js array (only if array length is same) convert each element implicitly any array types any arraybuffer object (only if array length is same in bytes) copy data ctypes.int8_t.array(n) int8array (only if array length is same in bytes) ctypes.uint8_t.array(n) uint8array (only if array length is same in bytes) uintclamped8array (only if array length is same in bytes) ctypes.int16_t.array...

Tutorial: Set a breakpoint - Firefox Developer Tools

Tools › Debugger-API › Tutorial-Breakpoint

breakpoint(0, { hit: function (frame) { console.log('hit breakpoint in ' + frame.callee.name); console.log('what = ' + frame.eval('what').return); } }); console.log('finished setting breakpoint!'); in the scratchpad, ensure that no text is selected, and press the “run” button.
...rt called from a different handler.
...buggee.

DevTools API - Firefox Developer Tools

Tools › DevToolsAPI

y loading the returned promise won't be fulfilled until something triggers the tool to load.
...s destroyed.
...nel for the tool.

DOM allocation example - Firefox Developer Tools

Tools › Memory › DOM allocation example

mory tool.
...randomint(min, max) { return math.floor(math.random() * (max - min + 1)) + min; } function createtoolbarbutton() { var toolbarbutton = document.createelement("span"); toolbarbutton.classlist.add("toolbarbutton"); // stop spidermonkey from sharing instances toolbarbutton[getrandomint(0,5000)] = "foo"; return toolbarbutton; } function createtoolbar() { var toolbar = document.createelement("div"); // stop spidermonkey from sharing instances toolbar[getrandomint(0,5000)] = "foo"; for (var i = 0; i < toolbarbuttoncount; i++) { var toolbarbutton = createtoolbarbutton(); toolbar.appendchild(toolbarbutton); } return toolbar; } function createtoolbars() { var container = document.getelementbyid("container"); for (var i = 0; i < toolbarcount; i++) { var toolbar ...
... return toolbar; } function createtoolbars() { var container = document.getelementbyid("container"); for (var i = 0; i < toolbarcount; i++) { var toolbar = createtoolbar(); container.appendchild(toolbar); } } createtoolbars(); a simple pseudocode representation of how this code operates looks like this: createtoolbars() -> createtoolbar() // called 200 times, creates 1 div element each time -> createtoolbarbutton() // called 20 times per toolbar, creates 1 span element each time in total, then, it creates 200 htmldivelement objects, and 4000 htmlspanelement objects.

Edit Shape Paths in CSS - Firefox Developer Tools

Tools › Page Inspector › How to › Edit CSS shapes

is a tool that helps you see and edit shapes created using clip-path and also the css shape-outside property and <basic-shape> values.
...e shape path editor is accessed via the css rules panel, which can be opened as described in the guide to opening the inspector.
...element, you should see the shape icon alongside any valid value, e.g.

How to - Firefox Developer Tools

Tools › Page Inspector › How to

links for various how to's can be found here.
...ious how to's can be found here.
...ere.

UI Tour - Firefox Developer Tools

Tools › Performance › UI Tour

u have made in this session and any you have imported.
...verview of the waterfall and a frame rate graph.
... overview this presents a compressed view of the waterfall: recorded operations are color-coded using the same scheme as in the main waterfall view.

Console messages - Firefox Developer Tools

Tools › Web Console › Console messages

shows the time taken to execute the reflow.
...collection of invalidating changes and recalculate their effect at once.
...to calculate the computed style to return.

Rich output - Firefox Developer Tools

Tools › Web Console › Rich output

when the web console prints objects, it includes a richer set of information than just the object's name.
...ation of the object's properties provides richer information for dom elements, and enables you to select them in the inspector type-specific rich output the web console provides rich output for many object types, including the following: object array date promise regexp window document element event examining object properties when an object is logged to the console it has a right-pointing triangle next to it, indicating that it can be expanded.
...cription: "refactor styles", datecreated: 1552404493169 } 2: object { status: "to do", description: "create feedback form", datecreated: 1552404512630 } 3: object { status: "to do", description: "normalize table", datecreated: 1552404533790 } length: 4 <prototype>: array [] debugger eval code:1:9 undefined highlighting and inspecting dom nodes if you hover the mouse over any dom element in the console output, it's highlighted on the page: in the screenshot above you'll also see a blue "target" icon next to the node in the console output: click it to switch to the inspector with that node selected.

Attr.localName - Web APIs

Web › API › Attr › localName

al part of the qualified name of an attribute.
... in previous dom specifications this api was defined within the node interface.
...ode interface.

Attr.namespaceURI - Web APIs

Web › API › Attr › namespaceURI

the attr.namespaceuri read-only property returns the namespace uri of the attribute, or null if the element is not in a namespace.
...tion of the namespace declarations in scope.
....

AudioTrackList: addtrack event - Web APIs

Web › API › AudioTrackList › addtrack event

the addtrack event is fired when a track is added to an audiotracklist.
... the addtrack event is fired when a track is added to an audiotracklist.
...es no cancelable no interface trackevent event handler property onaddtrack examples using addeventlistener(): const videoelement = document.queryselector('video'); videoelement.audiotracks.addeventlistener('addtrack', (event) => { console.log(`audio track: ${event.track.label} added`); }); using the onaddtrack event handler property: const videoelement = document.queryselector('video'); videoelement.audiotracks.onaddtrack = (event) => { console.log(`audio track: ${event.track.label} added`); }; specifications specification status html living standardthe definition of 'addtrack' in that specification.

AudioTrackList.length - Web APIs

Web › API › AudioTrackList › length

the read-only audiotracklist property length returns the number of entries in the audiotracklist, each of which is an audiotrack representing one audio track in the media element.
... the media element.
...y treating the audiotracklist as an array of objects of type audiotrack.

AudioTrackList: removetrack event - Web APIs

Web › API › AudioTrackList › removetrack event

the removetrack event is fired when a track is removed from an audiotracklist.
... the removetrack event is fired when a track is removed from an audiotracklist.
... cancelable no interface trackevent event handler property onremovetrack examples using addeventlistener(): const videoelement = document.queryselector('video'); videoelement.audiotracks.addeventlistener('removetrack', (event) => { console.log(`audio track: ${event.track.label} removed`); }); using the onremovetrack event handler property: const videoelement = document.queryselector('video'); videoelement.audiotracks.onremovetrack = (event) => { console.log(`audio track: ${event.track.label} removed`); }; specifications specification status html living standardthe definition of 'removetrack' in that specification.

BaseAudioContext.createDynamicsCompressor() - Web APIs

Web › API › BaseAudioContext › createDynamicsCompressor

verall signal level and help avoid clipping (distorting) of the audio output.
...(distorting) of the audio output.
...dioctx.createdynamicscompressor(); returns a dynamicscompressornode.

Blob.size - Web APIs

Web › API › Blob › size

the blob interface's size property returns the size of the blob or file in bytes.
...e property returns the size of the blob or file in bytes.
...= blob.size value the number of bytes of data contained within the blob (or blob-based object, such as a file).

Body.json() - Web APIs

Web › API › Body › json

d parse the data using json(), then read values out of the resulting objects as you'd expect and insert them into list items to display our product data.
...ng objects as you'd expect and insert them into list items to display our product data.
...onse => response.json()) .then(data => { for (const product of data.products) { let listitem = document.createelement('li'); listitem.appendchild( document.createelement('strong') ).textcontent = product.name; listitem.append( ` can be found in ${ product.location }.

CSS Painting API - Web APIs

Web › API › CSS Painting API

the css painting api — part of the css houdini umbrella of apis — allows developers to write javascript functions that can draw directly into an element's background, border, or content.
...of apis — allows developers to write javascript functions that can draw directly into an element's background, border, or content.
...aintrenderingcontext2d implements a subset of the canvasrenderingcontext2d api.

CanvasCaptureMediaStreamTrack.requestFrame() - Web APIs

Web › API › CanvasCaptureMediaStreamTrack › requestFrame

e is currently an issue flagged in the specification pointing out that at this time, no exceptions are being thrown if the canvas isn't origin-clean.
...ation pointing out that at this time, no exceptions are being thrown if the canvas isn't origin-clean.
...y candidate).

CanvasCaptureMediaStreamTrack - Web APIs

Web › API › CanvasCaptureMediaStreamTrack

the canvascapturemediastreamtrack interface represents the video track contained in a mediastream being generated from a <canvas> following a call to htmlcanvaselement.capturestream().
... the canvascapturemediastreamtrack interface represents the video track contained in a mediastream being generated from a <canvas> following a call to htmlcanvaselement.capturestream().
...methods of its parent, mediastreamtrack.

CanvasPattern.setTransform() - Web APIs

Web › API › CanvasPattern › setTransform

d this is just a simple code snippet which uses the settransform method to create a canvaspattern with the specified pattern transformation from an svgmatrix.
... a canvaspattern with the specified pattern transformation from an svgmatrix.
...div> <textarea id="code" class="playable-code" style="height:120px"> var img = new image(); img.src = 'https://mdn.mozillademos.org/files/222/canvas_createpattern.png'; img.onload = function() { var pattern = ctx.createpattern(img, 'repeat'); pattern.settransform(matrix.rotate(-45).scale(1.5)); ctx.fillstyle = pattern; ctx.fillrect(0, 0, 400, 400); };</textarea> var canvas = document.getelementbyid('canvas'); var ctx = canvas.getcontext('2d'); var textarea = document.getelementbyid('code'); var reset = document.getelementbyid('reset'); var edit = document.getelementbyid('edit'); var code = textarea.value; var svg1 = document.getelementbyid('svg1'); var matrix = svg1.createsvgmatrix(); function drawcanvas() { ctx.clearrect(0, 0, canvas.width, canvas.height); eval(textarea.value); }...

CanvasRenderingContext2D.clearRect() - Web APIs

Web › API › CanvasRenderingContext2D › clearRect

ting point.
...he right, and negative to the left.
...0, canvas.width, canvas.height); erasing part of a canvas this example draws a blue triangle on top of a yellowish background.

CanvasRenderingContext2D.fillRect() - Web APIs

Web › API › CanvasRenderingContext2D › fillRect

the right, and negative to the left.
...cument.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.fillstyle = 'green'; ctx.fillrect(20, 10, 150, 100); result filling the whole canvas this code snippet fills the entire canvas with a rectangle.
...); ctx.fillstyle = 'green'; ctx.fillrect(20, 10, 150, 100); result filling the whole canvas this code snippet fills the entire canvas with a rectangle.

CanvasRenderingContext2D.getLineDash() - Web APIs

Web › API › CanvasRenderingContext2D › getLineDash

the getlinedash() method of the canvas 2d api's canvasrenderingcontext2d interface gets the current line dash pattern.
... the getlinedash() method of the canvas 2d api's canvasrenderingcontext2d interface gets the current line dash pattern.
... example, setting the line dash to [5, 15, 25] will result in getting back [5, 15, 25, 5, 15, 25].

CanvasRenderingContext2D.isPointInPath() - Web APIs

Web › API › CanvasRenderingContext2D › isPointInPath

n value boolean a boolean, which is true if the specified point is contained in the current or specified path, otherwise false.
... current or specified path, otherwise false.
...ent.getelementbyid('result'); ctx.rect(10, 10, 100, 100); ctx.fill(); result.innertext = ctx.ispointinpath(30, 70); result checking a point in the specified path whenever you move the mouse, this example checks whether the cursor is in a circular path2d path.

CanvasRenderingContext2D.isPointInStroke() - Web APIs

Web › API › CanvasRenderingContext2D › isPointInStroke

olean, which is true if the point is inside the area contained by the stroking of a path, otherwise false.
...h, otherwise false.
...ctx.rect(10, 10, 100, 100); ctx.stroke(); result.innertext = ctx.ispointinstroke(50, 10); result checking a point in the specified path whenever you move the mouse, this example checks whether the cursor is in the stroke of an elliptical path2d path.

CanvasRenderingContext2D.scrollPathIntoView() - Web APIs

Web › API › CanvasRenderingContext2D › scrollPathIntoView

the canvasrenderingcontext2d.scrollpathintoview() method of the canvas 2d api scrolls the current or given path into view.
...2d api scrolls the current or given path into view.
..." width="400" height="200" class="playable-canvas"> <input id="button" type="range" min="1" max="12"> </canvas> <div class="playable-buttons"> <input id="edit" type="button" value="edit" /> <input id="reset" type="button" value="reset" /> </div> <textarea id="code" class="playable-code"> ctx.beginpath(); ctx.rect(10, 10, 30, 30); ctx.scrollpathintoview();</textarea> var canvas = document.getelementbyid("canvas"); var ctx = canvas.getcontext("2d"); var textarea = document.getelementbyid("code"); var reset = document.getelementbyid("reset"); var edit = document.getelementbyid("edit"); var code = textarea.value; function drawcanvas() { ctx.clearrect(0, 0, canvas.width, canvas.height); eval(textarea.value); } reset.addeventlistener("click", function() { textarea.value = code; drawcanv...

CanvasRenderingContext2D.stroke() - Web APIs

Web › API › CanvasRenderingContext2D › stroke

zero winding rule, which means that path intersections will still get filled.
... new thing you want to stroke.
...40); ctx.stroke(); result stroking and filling if you want to both stroke and fill a path, the order in which you perform these actions will determine the result.

A basic ray-caster - Web APIs

Web › API › Canvas API › A basic ray-caster

this article provides an interesting real-world example of using the <canvas> element to do software rendering of a 3d environment using ray-casting.
... this article provides an interesting real-world example of using the <canvas> element to do software rendering of a 3d environment using ray-casting.
..., so textures seem feasible.

Using channel messaging - Web APIs

Web › API › Channel Messaging API › Using channel messaging

main page and an iframe.
...er example in this article.
...in the iframe, we have the following javascript: var list = document.queryselector('ul'); var port2; // listen for the initial port transfer message window.addeventlistener('message', initport); // setup the transferred port function initport(e) { port2 = e.ports[0]; port2.onmessage = onmessage; } // handle messages received on port2 function onmessage(e) { var listitem = document.createelement('li'); listitem.textcontent = e.data; list.appendchild(listitem); port2.postmessage('message received by iframe: "' + e.data + '"'); } when the initial message is received from the main page via the window.postmessage method, we run the initport function.

ContentIndex.getAll() - Web APIs

Web › API › ContentIndex › getAll

example shows an asynchronous function that retrieves items within the content index and iterates over each entry, building a list for the interface.
...ieves items within the content index and iterates over each entry, building a list for the interface.
...ess our service worker registration const registration = await navigator.serviceworker.ready; // get our index entries const entries = await registration.index.getall(); // create a containing element const readinglistelem = document.createelement('div'); // test for entries if (!array.length) { // if there are no entries, display a message const message = document.createelement('p'); message.innertext = 'you currently have no articles saved for offline reading.' readinglistelem.append(message); } else { // if entries are present, display in a list of links to the content const listelem = document.createelement('ul'); for (const entry of entries) { const listitem = document.createelement('li'); const anchorelem = document.createelem...

ContentIndex - Web APIs

Web › API › ContentIndex

example shows an asynchronous function that retrieves items within the content index and iterates over each entry, building a list for the interface.
...ieves items within the content index and iterates over each entry, building a list for the interface.
...ess our service worker registration const registration = await navigator.serviceworker.ready; // get our index entries const entries = await registration.index.getall(); // create a containing element const readinglistelem = document.createelement('div'); // test for entries if (!array.length) { // if there are no entries, display a message const message = document.createelement('p'); message.innertext = 'you currently have no articles saved for offline reading.' readinglistelem.append(message); } else { // if entries are present, display in a list of links to the content const listelem = document.createelement('ul'); for (const entry of entries) { const listitem = document.createelement('li'); const anchorelem = document.createelem...

Content Index API - Web APIs

Web › API › Content Index API

example shows an asynchronous function that retrieves items within the content index and iterates over each entry, building a list for the interface.
...ieves items within the content index and iterates over each entry, building a list for the interface.
...ess our service worker registration const registration = await navigator.serviceworker.ready; // get our index entries const entries = await registration.index.getall(); // create a containing element const readinglistelem = document.createelement('div'); // test for entries if (!array.length) { // if there are no entries, display a message const message = document.createelement('p'); message.innertext = 'you currently have no articles saved for offline reading.' readinglistelem.append(message); } else { // if entries are present, display in a list of links to the content const listelem = document.createelement('ul'); for (const entry of entries) { const listitem = document.createelement('li'); const anchorelem = document.createelem...

CustomEvent - Web APIs

Web › API › CustomEvent

ginal target of the event, before any retargetings.
...as created with its shadowroot.mode closed.
...losed.

DOMImplementation.createHTMLDocument() - Web APIs

Web › API › DOMImplementation › createHTMLDocument

creates a new html document and inserts it into an <iframe> in the current document.
...e: <body> <p>click <a href="javascript:makedocument()">here</a> to create a new document and insert it below.</p> <iframe id="theframe" src="about:blank" /> </body> the javascript implementation of makedocument() follows: function makedocument() { let frame = document.getelementbyid("theframe"); let doc = document.implementation.createhtmldocument("new document"); let p = doc.createelement("p"); p.innerhtml = "this is a new paragraph."; try { doc.body.appendchild(p); } catch(e) { console.log(e); } // copy the new html document into the frame let destdocument = frame.contentdocument; let srcnode = doc.documentelement; let newnode = destdocument.importnode(srcnode, true); destdocument.replacechild(newnode, destdocument.documentelement); } the code in l...
... let srcnode = doc.documentelement; let newnode = destdocument.importnode(srcnode, true); destdocument.replacechild(newnode, destdocument.documentelement); } the code in lines 4–12 handle creating the new html document and inserting some content into it.

DOMTokenList.remove() - Web APIs

Web › API › DOMTokenList › remove

mtokenlist interface removes the specified tokens from the list.
... specified tokens from the list.
..., the html: <span class="a b c"></span> now the javascript: let span = document.queryselector("span"); let classes = span.classlist; classes.remove("c"); span.textcontent = classes; the output looks like this: to remove multiple classes at once, you can supply multiple tokens.

DOMTokenList.replace() - Web APIs

Web › API › DOMTokenList › replace

parameters oldtoken a domstring representing the token you want to replace.
...ing representing the token you want to replace.
... result = classes.replace("c", "z"); console.log(result); if (result) { span.textcontent = classes; } else { span.textcontent = 'token not replaced successfully'; } the output looks like this: polyfill the following polyfill will add the replace method to the domtokenlist class.

DataTransfer.effectAllowed - Web APIs

Web › API › DataTransfer › effectAllowed

es</title> <meta content="width=device-width"> <style> div { margin: 0em; padding: 2em; } #source { color: blue; border: 1px solid black; } #target { border: 1px solid black; } </style> <script> function dragstart_handler(ev) { console.log("dragstart: dropeffect = " + ev.datatransfer.dropeffect + " ; effectallowed = " + ev.datatransfer.effectallowed); // add this element's id to the drag payload so the drop handler will // know which element to add to its tree ev.datatransfer.setdata("text", ev.target.id); ev.datatransfer.effectallowed = "move"; } function drop_handler(ev) { console.log("drop: dropeffect = " + ev.datatransfer.dropeffect + " ; effectallowed = " + ev.datatransfer.effectallowed); ev.preventdefault(); // get the id of the target and add the mo...
...d to the drag payload so the drop handler will // know which element to add to its tree ev.datatransfer.setdata("text", ev.target.id); ev.datatransfer.effectallowed = "move"; } function drop_handler(ev) { console.log("drop: dropeffect = " + ev.datatransfer.dropeffect + " ; effectallowed = " + ev.datatransfer.effectallowed); ev.preventdefault(); // get the id of the target and add the moved element to the target's dom var data = ev.datatransfer.getdata("text"); ev.target.appendchild(document.getelementbyid(data)); } function dragover_handler(ev) { console.log("dragover: dropeffect = " + ev.datatransfer.dropeffect + " ; effectallowed = " + ev.datatransfer.effectallowed); ev.preventdefault(); // set the dropeffect to move ev.datatransfer.dropeffect = "move" } </script> <body> <h1>examp...
...datatransfer.dropeffect + " ; effectallowed = " + ev.datatransfer.effectallowed); ev.preventdefault(); // set the dropeffect to move ev.datatransfer.dropeffect = "move" } </script> <body> <h1>examples <code>datatransfer</code>.{<code>dropeffect</code>, <code>effectallowed</code>} properties</h1> <div> <p id="source" ondragstart="dragstart_handler(event);" draggable="true"> select this element, drag it to the drop zone and then release the selection to move the element.</p> </div> <div id="target" ondrop="drop_handler(event);" ondragover="dragover_handler(event);">drop zone</div> </body> </html> specifications specification status comment html living standardthe definition of 'effectallowed' in that specification.

DataTransfer.setData() - Web APIs

Web › API › DataTransfer › setData

e html> <html lang=en> <title>examples of datatransfer's setdata(), getdata() and cleardata()</title> <meta content="width=device-width"> <style> div { margin: 0em; padding: 2em; } #source { color: blue; border: 1px solid black; } #target { border: 1px solid black; } </style> <script> function dragstart_handler(ev) { console.log("dragstart"); // change the source element's background color to signify drag has started ev.currenttarget.style.border = "dashed"; // set the drag's format and data.
...ormat and data.
...fer.getdata("text"); ev.target.appendchild(document.getelementbyid(data)); // clear the drag data cache (for all formats/types) ev.datatransfer.cleardata(); } </script> <body> <h1>examples of <code>datatransfer</code>: <code>setdata()</code>, <code>getdata()</code>, <code>cleardata()</code></h1> <div> <p id="source" ondragstart="dragstart_handler(event);" draggable="true"> select this element, drag it to the drop zone and then release the selection to move the element.</p> </div> <div id="target" ondrop="drop_handler(event);" ondragover="dragover_handler(event);">drop zone</div> </body> </html> specifications specification status comment html living standardthe definition of 'setdata()' in that specification.

DataTransfer - Web APIs

Web › API › DataTransfer

the type does not exist, it is added at the end, such that the last item in the types list will be the new format.
...nd, such that the last item in the types list will be the new format.
... and property listed in this document has its own reference page and each reference page either directly includes an example of the interface or has a link to an example.

DeprecationReportBody - Web APIs

Web › API › DeprecationReportBody

e of the event handler we set up inside the reportingobserver() constructor, we can now click the button to display the report details.
... details.
...ts) { const outputelem = document.queryselector('.output'); const list = document.createelement('ul'); outputelem.appendchild(list); for(let i = 0; i < reports.length; i++) { let listitem = document.createelement('li'); let textnode = document.createtextnode('report ' + (i + 1) + ', type: ' + reports[i].type); listitem.appendchild(textnode); let innerlist = document.createelement('ul'); listitem.appendchild(innerlist); list.appendchild(listitem); for (let key in reports[i].body) { let innerlistitem = document.createelement('li'); let keyvalue = reports[i].body[key]; innerlistitem.textcontent = key + ': ' + keyvalue; innerlist.appendchild(innerlistitem); } } } the reports parameter contains an array of all the reports in the obse...

Document.createNodeIterator() - Web APIs

Web › API › Document › createNodeIterator

ilter.show_cdata_section 8 shows cdatasection nodes.
... 8 shows cdatasection nodes.
...parameter (entityreferenceexpansion) that is not part of the dom4 specification, and has therefore been removed.

Document: drag event - Web APIs

Web › API › Document › drag event

the drag event is fired every few hundred milliseconds as an element or text selection is being dragged by the user.
...deventlistener("dragend", function(event) { // reset the transparency event.target.style.opacity = ""; }, false); /* events fired on the drop targets */ document.addeventlistener("dragover", function(event) { // prevent default to allow drop event.preventdefault(); }, false); document.addeventlistener("dragenter", function(event) { // highlight potential drop target when the draggable element enters it if (event.target.classname == "dropzone") { event.target.style.background = "purple"; } }, false); document.addeventlistener("dragleave", function(event) { // reset background of potential drop target when the draggable element leaves it if (event.target.classname == "dropzone") { event.target.style.background = ""; } }, false); document.addeventlistener("drop", fu...
...target.style.background = "purple"; } }, false); document.addeventlistener("dragleave", function(event) { // reset background of potential drop target when the draggable element leaves it if (event.target.classname == "dropzone") { event.target.style.background = ""; } }, false); document.addeventlistener("drop", function(event) { // prevent default action (open as link for some elements) event.preventdefault(); // move dragged elem to the selected drop target if (event.target.classname == "dropzone") { event.target.style.background = ""; dragged.parentnode.removechild( dragged ); event.target.appendchild( dragged ); } }, false); specifications specification status comment html living standardthe definition of 'drag event' in t...

Document.evaluate() - Web APIs

Web › API › Document › evaluate

eturn.
... null, xpathresult.any_type, null); /* search the document for all h2 elements.
...sible matches.

Document: gotpointercapture event - Web APIs

Web › API › Document › gotpointercapture event

the gotpointercapture event is fired when an element captures a pointer using setpointercapture().
... the gotpointercapture event is fired when an element captures a pointer using setpointercapture().
... the gotpointercapture event is fired when an element captures a pointer using setpointercapture().

Document.onafterscriptexecute - Web APIs

Web › API › Document › onafterscriptexecute

the document.onafterscriptexecute property references a function that fires when a static <script> element finishes executing its script.
... the document.onafterscriptexecute property references a function that fires when a static <script> element finishes executing its script.
... the document.onafterscriptexecute property references a function that fires when a static <script> element finishes executing its script.

Document.onbeforescriptexecute - Web APIs

Web › API › Document › onbeforescriptexecute

fired when the code in a <script> element declared in an html document is about to start executing.
... fired when the code in a <script> element declared in an html document is about to start executing.
... fired when the code in a <script> element declared in an html document is about to start executing.

Document: pointerenter event - Web APIs

Web › API › Document › pointerenter event

the pointerenter event fires when a pointing device is moved into the hit test boundaries of an element or one of its descendants, including as a result of a pointerdown event from a device that does not support hover (see pointerdown).
...t or one of its descendants, including as a result of a pointerdown event from a device that does not support hover (see pointerdown).
... bubbles no cancelable no interface pointerevent event handler property onpointerenter examples using addeventlistener(): document.addeventlistener('pointerenter', (event) => { console.log('pointer entered element'); }); using the onpointerenter event handler property: document.onpointerenter = (event) => { console.log('pointer entered element'); }; specifications specification status pointer events obsolete ...

Document: pointerleave event - Web APIs

Web › API › Document › pointerleave event

the pointerleave event is fired when a pointing device is moved out of the hit test boundaries of an element.
...t test boundaries of an element.
...zer.

Document.readyState - Web APIs

Web › API › Document › readyState

stylesheets and frames are still loading.
...dicates that the load event is about to fire.
...amples different states of readiness switch (document.readystate) { case "loading": // the document is still loading.

Document.scripts - Web APIs

Web › API › Document › scripts

the scripts property of the document interface returns a list of the <script> elements in the document.
... the scripts property of the document interface returns a list of the <script> elements in the document.
... the scripts property of the document interface returns a list of the <script> elements in the document.

Document.styleSheetSets - Web APIs

Web › API › Document › styleSheetSets

the stylesheetsets read-only property returns a live list of all of the currently-available style sheet sets.
...tylesheetsets read-only property returns a live list of all of the currently-available style sheet sets.
...turn, sets is a list of style sheet sets that are available.

Document.title - Web APIs

Web › API › Document › title

tle, it contains that value.
...le>hello world!</title> </head> <body> <script> alert(document.title); // displays "hello world!" document.title = "goodbye world!"; alert(document.title); // displays "goodbye world!" </script> </body> </html> notes this property applies to html, svg, xul, and other documents in gecko.
...orld!" document.title = "goodbye world!"; alert(document.title); // displays "goodbye world!" </script> </body> </html> notes this property applies to html, svg, xul, and other documents in gecko.

Document.width - Web APIs

Web › API › Document › width

note: starting in gecko 6.0, document.width is no longer supported.
... note: starting in gecko 6.0, document.width is no longer supported.
...se document.body.clientwidth.

DocumentFragment.querySelectorAll() - Web APIs

Web › API › DocumentFragment › querySelectorAll

the documentfragment.queryselectorall() method returns a nodelist of elements within the documentfragment (using depth-first pre-order traversal of the document's nodes) that matches the specified group of selectors.
...documentfragment.queryselectorall() method returns a nodelist of elements within the documentfragment (using depth-first pre-order traversal of the document's nodes) that matches the specified group of selectors.
...s.

DynamicsCompressorNode.attack - Web APIs

Web › API › DynamicsCompressorNode › attack

atedynamicscompressor(); compressor.attack.value = 0; value an audioparam.
...alue = 0; value an audioparam.
...the audioparam returned is read-only, the value it represents is not.

DynamicsCompressorNode.knee - Web APIs

Web › API › DynamicsCompressorNode › knee

eatedynamicscompressor(); compressor.knee.value = 40; value an audioparam.
...lue = 40; value an audioparam.
...the audioparam returned is read-only, the value it represents is not.

DynamicsCompressorNode.ratio - Web APIs

Web › API › DynamicsCompressorNode › ratio

atedynamicscompressor(); compressor.ratio.value = 12; value an audioparam.
...lue = 12; value an audioparam.
...the audioparam returned is read-only, the value it represents is not.

DynamicsCompressorNode.release - Web APIs

Web › API › DynamicsCompressorNode › release

ynamicscompressor(); compressor.release.value = 0.25; value an audioparam.
...e = 0.25; value an audioparam.
...the audioparam returned is read-only, the value it represents is not.

DynamicsCompressorNode.threshold - Web APIs

Web › API › DynamicsCompressorNode › threshold

namicscompressor(); compressor.threshold.value = -50; value an audioparam.
...ue = -50; value an audioparam.
...the audioparam returned is read-only, the value it represents is not.

DynamicsCompressorNode - Web APIs

Web › API › DynamicsCompressorNode

m representing the amount of time, in seconds, required to increase the gain by 10 db.
...s, required to increase the gain by 10 db.
...ods no specific methods; inherits methods from its parent, audionode.

EffectTiming.easing - Web APIs

Web › API › EffectTiming › easing

the effecttiming dictionary's easing property in the web animations api specifies the timing function used to scale the time to produce easing effects, where easing is the rate of the animation's change over time.
...parameter is omitted, it is given the value end.
...rt) step-end equivalent to steps(1, end).

EffectTiming - Web APIs

Web › API › EffectTiming

the effecttiming dictionary, part of the web animations api, is used by element.animate(), keyframeeffectreadonly(), and keyframeeffect() to describe timing properties for animation effects.
...t", and "ease-in-out", or a custom "cubic-bezier" value like "cubic-bezier(0.42, 0, 0.58, 1)".
...n the iteration the animation should start.

Event.defaultPrevented - Web APIs

Web › API › Event › defaultPrevented

preventdefault() canceled the event.
...mple this example logs attempts to visit links from two <a> elements.
...pt function stoplink(event) { event.preventdefault(); } function logclick(event) { const log = document.getelementbyid('log'); if (event.target.tagname === 'a') { if (event.defaultprevented) { log.innertext = 'sorry, but you cannot visit this link!\n' + log.innertext; } else { log.innertext = 'visiting link...\n' + log.innertext; } } } const a = document.getelementbyid('link2'); a.addeventlistener('click', stoplink); document.addeventlistener('click', logclick); result specifications specification status comment domthe definition of 'event.defaultprevented()' in that specification.

Event.eventPhase - Web APIs

Web › API › Event › eventPhase

ts event phase constants these values describe which phase the event flow is currently being evaluated.
...e values describe which phase the event flow is currently being evaluated.
... <div id="d4">d4</div> </div> </div> </div> <div id="divinfo"></div> css div { margin: 20px; padding: 4px; border: thin black solid; } #divinfo { margin: 18px; padding: 8px; background-color:white; font-size:80%; } javascript let clear = false, divinfo = null, divs = null, usecapture = false; window.onload = function () { divinfo = document.getelementbyid('divinfo') divs = document.getelementsbytagname('div') chcapture = document.getelementbyid('chcapture') chcapture.onclick = function () { removelisteners() addlisteners() } clear() addlisteners() } function removelisteners() { for (let i = 0; i < divs.length; i++) { let d = divs[i] if (d.id != "divinfo") { d.removeeventlistener("click", ondivclick, true) ...

Event.preventDefault() - Web APIs

Web › API › Event › preventDefault

arget.dispatchevent(), without specifying cancelable: true has no effect.
..."> </form> </div> css we use a little bit of css for the warning box we'll draw when the user presses an invalid key: .warning { border: 2px solid #f39389; border-radius: 2px; padding: 10px; position: absolute; background-color: #fbd8d4; color: #3b3c40; } javascript and here's the javascript code that does the job.
...arcode < 97 || charcode > 122) { evt.preventdefault(); displaywarning( "please use lowercase letters only." + "\n" + "charcode: " + charcode + "\n" ); } } } the displaywarning() function presents a notification of a problem.

Using Fetch - Web APIs

Web › API › Fetch API › Using Fetch

ample' }; fetch('https://example.com/profile', { method: 'post', // or 'put' headers: { 'content-type': 'application/json', }, body: json.stringify(data), }) .then(response => response.json()) .then(data => { console.log('success:', data); }) .catch((error) => { console.error('error:', error); }); uploading a file files can be uploaded using an html <input type="file" /> input element, formdata() and fetch().
...sername', 'abc123'); formdata.append('avatar', filefield.files[0]); fetch('https://example.com/profile/avatar', { method: 'put', body: formdata }) .then(response => response.json()) .then(result => { console.log('success:', result); }) .catch(error => { console.error('error:', error); }); uploading multiple files files can be uploaded using an html <input type="file" multiple /> input element, formdata() and fetch().
...y mixin defines the following methods to extract a body (implemented by both request and response).

File.getAsDataURL() - Web APIs

Web › API › File › getAsDataURL

summary the getasdataurl provides a data: url that encodes the entire contents of the referenced file.
...etasdataurl provides a data: url that encodes the entire contents of the referenced file.
...var url = instanceoffile.getasdataurl(); returns a string representing a data: url example // fileinput is a htmlinputelement: <input type="file" id="myfileinput" multiple> var fileinput = document.getelementbyid("myfileinput"); // files is a filelist object (similar to nodelist) var files = fileinput.files; // array with acceptable file types var accept = ["image/png"]; // img is a htmlimgelement: <img id="myimg"> var img = document.getelementbyid("myimg"); // if we accept the first selected file type if (accept.indexof(files[0].mediatype) > -1) { // display the image // same as <img src="data:image/png,<imagedata>"> img.src = files[0].getasdataurl(); } specification not part of any specification.

Introduction to the File and Directory Entries API - Web APIs

Web › API › File and Directory Entries API › Introduction

allbacks.
...nd directory entries api interacts with other apis the file and directory entries api is designed to be used with other apis and elements on the web platform.
...and directory entries api is designed to be used with other apis and elements on the web platform.

FormData() - Web APIs

Web › API › FormData › FormData

the formdata() constructor creates a new formdata object.
... the formdata() constructor creates a new formdata object.
...> <div> <label for="userfile">upload file:</label> <input type="file" id="userfile" name="userfile"> </div> <input type="submit" value="submit!"> </form> note: only successful form controls are included in a formdata object, i.e.

FullscreenOptions - Web APIs

Web › API › FullscreenOptions

the fullscreenoptions dictionary is used to provide configuration options when calling requestfullscreen() on an element to place that element into full-screen mode.
... the fullscreenoptions dictionary is used to provide configuration options when calling requestfullscreen() on an element to place that element into full-screen mode.
... the fullscreenoptions dictionary is used to provide configuration options when calling requestfullscreen() on an element to place that element into full-screen mode.

GlobalEventHandlers.onblur - Web APIs

Web › API › GlobalEventHandlers › onblur

the onblur property of the globaleventhandlers mixin is the eventhandler for processing blur events.
... the onblur property of the globaleventhandlers mixin is the eventhandler for processing blur events.
...it's available on element, document, and window.

GlobalEventHandlers.onchange - Web APIs

Web › API › GlobalEventHandlers › onchange

hange property of the globaleventhandlers mixin is an eventhandler for processing change events.
... using the tab key to switch to a different control.
...ion receives an event object as its sole argument.

GlobalEventHandlers.onmouseenter - Web APIs

Web › API › GlobalEventHandlers › onmouseenter

the onmouseenter property of the globaleventhandlers mixin is the eventhandler for processing mouseenter events.
... the onmouseenter property of the globaleventhandlers mixin is the eventhandler for processing mouseenter events.
... the onmouseenter property of the globaleventhandlers mixin is the eventhandler for processing mouseenter events.

GlobalEventHandlers.onmouseleave - Web APIs

Web › API › GlobalEventHandlers › onmouseleave

the onmouseleave property of the globaleventhandlers mixin is the eventhandler for processing mouseleave events.
... the onmouseleave property of the globaleventhandlers mixin is the eventhandler for processing mouseleave events.
... the onmouseleave property of the globaleventhandlers mixin is the eventhandler for processing mouseleave events.

GlobalEventHandlers.onmouseover - Web APIs

Web › API › GlobalEventHandlers › onmouseover

the onmouseover property of the globaleventhandlers mixin is an eventhandler that processes mouseover events.
... the onmouseover property of the globaleventhandlers mixin is an eventhandler that processes mouseover events.
... the onmouseover property of the globaleventhandlers mixin is an eventhandler that processes mouseover events.

GlobalEventHandlers.onplay - Web APIs

Web › API › GlobalEventHandlers › onplay

the onplay property of the globaleventhandlers mixin is the eventhandler for processing play events.
... the onplay property of the globaleventhandlers mixin is the eventhandler for processing play events.
... the onplay property of the globaleventhandlers mixin is the eventhandler for processing play events.

GlobalEventHandlers.onpointerleave - Web APIs

Web › API › GlobalEventHandlers › onpointerleave

the global event handler for the pointerleave event, which is delivered to a node when the pointer (mouse cursor, fingertip, etc.) exits its hit test area (for example, if the cursor exits an element or window's content area).
...r example, if the cursor exits an element or window's content area).
...handler; var leavehandler = eventtarget.onpointerleave; value leavehandler the eventlistener which will be invoked to handle pointerleave events sent to the target.

GlobalEventHandlers.onscroll - Web APIs

Web › API › GlobalEventHandlers › onscroll

the onscroll property of the globaleventhandlers mixin is an eventhandler that processes scroll events.
....onscroll = functionref value functionref a function name, or a function expression.
...ent to the eventtarget.addeventlistener() method instead.

GlobalEventHandlers.onselect - Web APIs

Web › API › GlobalEventHandlers › onselect

enthandlers mixin is an eventhandler that processes select events.
... events.
...syntax target.onselect = functionref; value functionref is a function name or a function expression.

GlobalEventHandlers.ontransitioncancel - Web APIs

Web › API › GlobalEventHandlers › ontransitioncancel

an eventhandler that processes transitioncancel events.
...".
...ition is stopped before it has run to completion, e.g.

msAudioDeviceType - Web APIs

Web › API › HTMLAudioElement › msAudioDeviceType

non-standard this feature is non-standard and is not on a standards track.
...msaudiodevicetype property of the html <audio> element, is a read/write proprietary attribute, specific to internet explorer and microsoft edge.
...is a read/write proprietary attribute, specific to internet explorer and microsoft edge.

HTMLCollection.item - Web APIs

Web › API › HTMLCollection › item

the htmlcollection method item() returns the node located at the specified offset into the collection.
...he specified offset into the collection.
... syntax var element = htmlcollection.item(index) parameters index the position of the node to be returned.

HTMLFormControlsCollection.namedItem() - Web APIs

Web › API › HTMLFormControlsCollection › namedItem

the htmlformcontrolscollection.nameditem() method returns the radionodelist or the element in the collection whose name or id match the specified name, or null if no node matches.
...ode matches.
...e array bracket syntax with a string, like collection["value"] is equivalent to collection.nameditem("value").

srcdoc - Web APIs

Web › API › HTMLIFrameElement › srcdoc

the srcdoc property of the htmliframeelement specifies the content of the page.
... the srcdoc property of the htmliframeelement specifies the content of the page.
... the srcdoc property of the htmliframeelement specifies the content of the page.

Ajax navigation example - Web APIs

Web › API › History API › Example

this is an example of an ajax website composed only of three pages (first_page.php, second_page.php and third_page.php).
...sloading) { return; } oreq.abort(); closereq(); } function ajaxerror () { alert("unknown error."); } function ajaxload () { var vmsg, nstatus = this.status; switch (nstatus) { case 200: vmsg = json.parse(this.responsetext); document.title = opageinfo.title = vmsg.page; document.getelementbyid(stargetid).innerhtml = vmsg.content; if (bupdateurl) { history.pushstate(opageinfo, opageinfo.title, opageinfo.url); bupdateurl = false; } break; default: vmsg = nstatus + ": " + (ohttpstatus[nstatus] || "unknown"); switch (math.floor(nstatus / 100)) { ...
...nlen; document.links[nidx++].onclick = processlink); } const /* customizable constants */ stargetid = "ajax-content", sviewkey = "view_as", sajaxclass = "ajax-nav", /* not customizable constants */ rsearch = /\?.*$/, rhost = /^[^\?]*\?*&*/, rview = new regexp("&" + sviewkey + "\\=[^&]*|&*$", "i"), rendqstmark = /\?$/, oloadingbox = document.createelement("div"), ocover = document.createelement("div"), oloadingimg = new image(), opageinfo = { title: null, url: location.href }, ohttpstatus = /* http://www.iana.org/assignments/http-status-codes/http-status-codes.xml */ { 100: "continue", 101: "switching protocols", 102: "processing", 200: "ok", 201: "...

IntersectionObserverEntry.time - Web APIs

Web › API › IntersectionObserverEntry › time

the intersectionobserverentry interface's read-only time property is a domhighrestimestamp that indicates the time at which the intersection change occurred relative to the time at which the document was created.
...ction change occurred relative to the time at which the document was created.
...time; value a domhighrestimestamp which indicates the time at which the target element experienced the intersection change described by the intersectionobserverentry.

KeyboardEvent.code - Web APIs

Web › API › KeyboardEvent › code

keys on the keyboard to see what the keyboardevent's key and code values are for each one.</p> <div id="output"> </div> css #output { font-family: arial, helvetica, sans-serif; border: 1px solid black; } javascript window.addeventlistener("keydown", function(event) { let str = "keyboardevent: key='" + event.key + "' | code='" + event.code + "'"; let el = document.createelement("span"); el.innerhtml = str + "<br/>"; document.getelementbyid("output").appendchild(el); }, true); try it out to ensure that keystrokes go to the sample, click in the output box below before pressing keys.
... track the position of the ship within the play field.
...t of rotation applied to the ship, in degrees; it starts at 0° (pointing straight up).

KeyboardEvent.key - Web APIs

Web › API › KeyboardEvent › key

is not called: a keydown event is first fired.
... a keydown event is first fired.
...id="console-log"></pre> </div> </div> css .fx { -webkit-display: flex; display: flex; margin-left: -20px; margin-right: -20px; } .fx > div { padding-left: 20px; padding-right: 20px; } .fx > div:first-child { width: 30%; } .flex { -webkit-flex: 1; flex: 1; } #test-target { display: block; width: 100%; margin-bottom: 10px; } javascript let textarea = document.getelementbyid('test-target'), consolelog = document.getelementbyid('console-log'), btnclearconsole = document.getelementbyid('btn-clear-console'); function logmessage(message) { document.getelementbyid("console-log").innerhtml += message + "<br>"; } textarea.addeventlistener('keydown', (e) => { if (!e.repeat) logmessage(`key "${e.key}" pressed [event: keydown]`); else logmessage(`key "${e.

LinkStyle - Web APIs

Web › API › LinkStyle

the linkstyle interface provides access to the associated css style sheet of a node.
... the linkstyle interface provides access to the associated css style sheet of a node.
... the linkstyle interface provides access to the associated css style sheet of a node.

Location - Web APIs

Web › API › Location

urce with the one at the provided url (redirects to the provided url).
...e assign() method and setting the href property is that after using replace() the current page will not be saved in session history, meaning the user won't be able to use the back button to navigate to it.
... to navigate to it.

MSSiteModeEvent - Web APIs

Web › API › MSSiteModeEvent

ting up from the current target.
...rent target.
... defaultprevented gets a value that indicates whether the default action should be canceled.

msExtendedCode - Web APIs

Web › API › MediaError › msExtendedCode

non-standard this feature is non-standard and is not on a standards track.
... non-standard this feature is non-standard and is not on a standards track.
... in the event of an error, the media element's error event will be fired.

MediaKeyStatusMap.forEach() - Web APIs

Web › API › MediaKeyStatusMap › forEach

the foreach property of the mediakeystatusmap interface calls callback once for each key-value pair in the status map, in insertion order.
... the foreach property of the mediakeystatusmap interface calls callback once for each key-value pair in the status map, in insertion order.
...nterface calls callback once for each key-value pair in the status map, in insertion order.

MediaSource.readyState - Web APIs

Web › API › MediaSource › readyState

the readystate read-only property of the mediasource interface returns an enum representing the state of the current mediasource.
... the readystate read-only property of the mediasource interface returns an enum representing the state of the current mediasource.
... the readystate read-only property of the mediasource interface returns an enum representing the state of the current mediasource.

MediaSource.setLiveSeekableRange() - Web APIs

Web › API › MediaSource › setLiveSeekableRange

the setliveseekablerange() method of the mediasource interface sets the range that the user can seek to in the media element.
...etliveseekablerange() method of the mediasource interface sets the range that the user can seek to in the media element.
... if the duration of the media source is positive infinity, then the timeranges object returned by the htmlmediaelement.seekable property will have a start timestamp no greater than this value.

MediaStreamConstraints.audio - Web APIs

Web › API › MediaStreamConstraints › audio

div id="log"></div> css content body { font: 14px "open sans", "arial", sans-serif; } audio { margin-top: 20px; border: 1px solid black; width: 160px; } .button { cursor: pointer; width: 160px; border: 1px solid black; font-size: 16px; text-align: center; padding-top: 2px; padding-bottom: 4px; color: white; background-color: darkgreen; } javascript content let audioelement = document.getelementbyid("audio"); let logelement = document.getelementbyid("log"); function log(msg) { logelement.innerhtml += msg + "<br>"; } document.getelementbyid("startbutton").addeventlistener("click", function() { navigator.mediadevices.getusermedia({ audio: true }).then(stream => audioelement.srcobject = stream) .catch(err => log(err.name + ": " + err.message)); }, fals...
...).addeventlistener("click", function() { navigator.mediadevices.getusermedia({ audio: true }).then(stream => audioelement.srcobject = stream) .catch(err => log(err.name + ": " + err.message)); }, false); here we see an event handler for a click event which uses getusermedia() to obtain an audio-only stream with no specific constraints, then attaches the resulting stream to an <audio> element once the stream is returned.
...div id="log"></div> css content body { font: 14px "open sans", "arial", sans-serif; } audio { margin-top: 20px; border: 1px solid black; width: 160px; } .button { cursor: pointer; width: 160px; border: 1px solid black; font-size: 16px; text-align: center; padding-top: 2px; padding-bottom: 4px; color: white; background-color: darkgreen; } javascript content let audioelement = document.getelementbyid("audio"); let logelement = document.getelementbyid("log"); function log(msg) { logelement.innerhtml += msg + "<br>"; } document.getelementbyid("startbutton").addeventlistener("click", function() { navigator.mediadevices.getusermedia({ audio: { samplesize: 8, echocancellation: true } }).then(stream => audioelement.srcobject = stream) .catc...

MediaStreamConstraints.video - Web APIs

Web › API › MediaStreamConstraints › video

y></video><br> <div id="log"></div> css content body { font: 14px "open sans", "arial", sans-serif; } video { margin-top: 20px; border: 1px solid black; } .button { cursor: pointer; width: 160px; border: 1px solid black; font-size: 16px; text-align: center; padding-top: 2px; padding-bottom: 4px; color: white; background-color: darkgreen; } javascript content let videoelement = document.getelementbyid("video"); let logelement = document.getelementbyid("log"); function log(msg) { logelement.innerhtml += msg + "<br>"; } document.getelementbyid("startbutton").addeventlistener("click", function() { navigator.mediadevices.getusermedia({ video: true }).then(stream => videoelement.srcobject = stream) .catch(err => log(err.name + ": " + err.message)); }, fa...
...).addeventlistener("click", function() { navigator.mediadevices.getusermedia({ video: true }).then(stream => videoelement.srcobject = stream) .catch(err => log(err.name + ": " + err.message)); }, false); here we see an event handler for a click event which uses getusermedia() to obtain a video-only stream with no specific constraints, then attaches the resulting stream to a <video> element once the stream is returned.
...y></video><br> <div id="log"></div> css content body { font: 14px "open sans", "arial", sans-serif; } video { margin-top: 20px; border: 1px solid black; } .button { cursor: pointer; width: 160px; border: 1px solid black; font-size: 16px; text-align: center; padding-top: 2px; padding-bottom: 4px; color: white; background-color: darkgreen; } javascript content let videoelement = document.getelementbyid("video"); let logelement = document.getelementbyid("log"); function log(msg) { logelement.innerhtml += msg + "<br>"; } document.getelementbyid("startbutton").addeventlistener("click", function() { navigator.mediadevices.getusermedia({ video: { width: 160, height: 120, framerate: 15 } }).then(stream => videoelement.srcobject = ...

Media Session API - Web APIs

Web › API › Media Session API

the mediametadata interface lets a web site provide rich metadata to the platform ui for media that is playing.
...s a web site provide rich metadata to the platform ui for media that is playing.
...onhandler('seekbackward', function() { /* code excerpted.

MouseEvent - Web APIs

Web › API › MouseEvent

ample demonstrates simulating a click (that is programmatically generating a click event) on a checkbox using dom methods.
...ng a click (that is programmatically generating a click event) on a checkbox using dom methods.
...{ var evt = new mouseevent("click", { bubbles: true, cancelable: true, view: window }); var cb = document.getelementbyid("checkbox"); //element to click on var canceled = !cb.dispatchevent(evt); if(canceled) { // a handler called preventdefault alert("canceled"); } else { // none of the handlers called preventdefault alert("not canceled"); } } document.getelementbyid("button").addeventlistener('click', simulateclick); result specifications specification status comment css object model (cssom) view modulethe definition of 'mouseevent' in that specification.

msPlayToDisabled - Web APIs

Web › API › MsPlayToDisabled

or may change in the future.
...he future.
... msplaytodisabled is a read/write property which gets and sets if the playto device is enabled or disabled.

msPlayToPrimary - Web APIs

Web › API › MsPlayToPrimary

e.
...laytoprimary is a read/write property which gets or sets the primary dlna playto device.
...oolean value set to true indicates that the device is the primary dlna playto device, otherwise false.

Node.isConnected - Web APIs

Web › API › Node › isConnected

ly or indirectly) to the context object, for example the document object in the case of the normal dom, or the shadowroot in the case of a shadow dom.
...examples standard dom a standard dom example: let test = document.createelement('p'); console.log(test.isconnected); // returns false document.body.appendchild(test); console.log(test.isconnected); // returns true shadow dom a shadow dom example: // create a shadow root var shadow = this.attachshadow({mode: 'open'}); // create some css to apply to the shadow dom var style = document.createelement('style'); console.log(style.isconnected); // returns false style.textcontent = ` .wrapper { position: relative; } .info { font-size: 0.8rem; width: 200px; display: inline-block; border: 1px solid black; padding: 10px; background: white; border-radius: 10px; opacity: 0; transition: 0.6s all; positions: absolute; bottom: 20px; left: 10px; z-index: 3 } `; // attach the...
...ole.log(style.isconnected); // returns false style.textcontent = ` .wrapper { position: relative; } .info { font-size: 0.8rem; width: 200px; display: inline-block; border: 1px solid black; padding: 10px; background: white; border-radius: 10px; opacity: 0; transition: 0.6s all; positions: absolute; bottom: 20px; left: 10px; z-index: 3 } `; // attach the created style element to the shadow dom shadow.appendchild(style); console.log(style.isconnected); // returns true polyfill node.isconnected can be polyfilled with the following code for ie10 and edgehtml: /* * node.isconnected polyfill for ie and edgehtml * 2020-02-04 * * by eli grey, https://eligrey.com * public domain.

Node.isSupported() - Web APIs

Web › API › Node › isSupported

the node.issupported()returns a boolean flag containing the result of a test whether the dom implementation implements a specific feature and this feature is supported by the specific node.
...ssible values defined within the core dom specification are listed on the dom level 2 conformance section.
...onformance section.

Node.previousSibling - Web APIs

Web › API › Node › previousSibling

the node.previoussibling read-only property returns the node immediately preceding the specified one in its parent's childnodes list, or null if the specified node is the first in that list.
... the node.previoussibling read-only property returns the node immediately preceding the specified one in its parent's childnodes list, or null if the specified node is the first in that list.
...ole.log(document.getelementbyid("b1").previoussibling); // <img id="b0"> console.log(document.getelementbyid("b2").previoussibling.id); // "b1" notes gecko-based browsers insert text nodes into a document to represent whitespace in the source markup.

NodeIterator.whatToShow - Web APIs

Web › API › NodeIterator › whatToShow

ment tree.
...defilter.show_cdata_section 8 shows cdatasection nodes.
...in the first position of the traversal.

NodeList.entries() - Web APIs

Web › API › NodeList › entries

the nodelist.entries() method returns an iterator allowing to go through all key/value pairs contained in this object.
... the nodelist.entries() method returns an iterator allowing to go through all key/value pairs contained in this object.
... the nodelist.entries() method returns an iterator allowing to go through all key/value pairs contained in this object.

NodeList.keys() - Web APIs

Web › API › NodeList › keys

the nodelist.keys() method returns an iterator allowing to go through all keys contained in this object.
... the nodelist.keys() method returns an iterator allowing to go through all keys contained in this object.
... the nodelist.keys() method returns an iterator allowing to go through all keys contained in this object.

NodeList.values() - Web APIs

Web › API › NodeList › values

the nodelist.values() method returns an iterator allowing to go through all values contained in this object.
... the nodelist.values() method returns an iterator allowing to go through all values contained in this object.
... the nodelist.values() method returns an iterator allowing to go through all values contained in this object.

OVR_multiview2 - Web APIs

Web › API › OVR multiview2

omplete_view_targets_ovr if baseviewindex is not the same for all framebuffer attachment points where the value of framebuffer_attachment_object_type is not none, the framebuffer is considered incomplete.
...ffer is considered incomplete.
...2, 2); ext.framebuffertexturemultiviewovr(gl.draw_framebuffer, gl.color_attachment0, colortex, 0, 0, 2); const depthstenciltex = gl.createtexture(); gl.bindtexture(gl.texture_2d_array, depthstenciltex); gl.texstorage3d(gl.texture_2d_array, 1, gl.depth32f_stencil8, 512, 512, 2); ext.framebuffertexturemultiviewovr(gl.draw_framebuffer, gl.depth_stencil_attachment, depthstenciltex, 0, 0, 2); gl.drawelements(...); // draw will be broadcasted to the layers of colortex and depthstenciltex.

Page Visibility API - Web APIs

Web › API › Page Visibility API

dden !== "undefined") { // opera 12.10 and firefox 18 and later support hidden = "hidden"; visibilitychange = "visibilitychange"; } else if (typeof document.mshidden !== "undefined") { hidden = "mshidden"; visibilitychange = "msvisibilitychange"; } else if (typeof document.webkithidden !== "undefined") { hidden = "webkithidden"; visibilitychange = "webkitvisibilitychange"; } var videoelement = document.getelementbyid("videoelement"); // if the page is hidden, pause the video; // if the page is shown, play the video function handlevisibilitychange() { if (document[hidden]) { videoelement.pause(); } else { videoelement.play(); } } // warn if the browser doesn't support addeventlistener or the page visibility api if (typeof document.addeventlistener === "undefined" || hi...
...f (typeof document.addeventlistener === "undefined" || hidden === undefined) { console.log("this demo requires a browser, such as google chrome or firefox, that supports the page visibility api."); } else { // handle page visibility change document.addeventlistener(visibilitychange, handlevisibilitychange, false); // when the video pauses, set the title.
...hrome or firefox, that supports the page visibility api."); } else { // handle page visibility change document.addeventlistener(visibilitychange, handlevisibilitychange, false); // when the video pauses, set the title.

Path2D.addPath() - Web APIs

Web › API › Path2D › addPath

x to be used as the transformation matrix for the path that is added.
...parate path2d objects, each of which contains a rectangle made using the rect() method.
... contains both rectangles) using fill().

Using the Payment Request API - Web APIs

Web › API › Payment Request API › Using the Payment Request API

g availability of the payment request api you can effectively detect support for the payment request api by checking if the user's browser supports paymentrequest, i.e.
...est button depending on whether users can make payments.
...g., additional delivery instructions), the merchant can show a page with additional <input type="text"> fields after the checkout.

RTCDTMFSender: tonechange event - Web APIs

Web › API › RTCDTMFSender › tonechange event

ng rtcdtmfsender.insertdtmf()) begin and end.
...tone property.
...tmfsender.addeventlistener("tonechange", ev => { let tone = ev.tone; if (tone === "") { tone = "<none>"; } document.getelementbyid("playingtone").innertext = tone; }, false); you can also just set the ontonechange event handler property directly: dtmfsender.ontonechange = function( ev ) { let tone = ev.tone; if (tone === "") { tone = "<none>" } document.getelementbyid("playingtone").innertext = tone; }; specifications specification status comment webrtc 1.0: real-time communication between browsersthe definition of 'tonechange' in that specification.

RTCDataChannel.onmessage - Web APIs

Web › API › RTCDataChannel › onmessage

o the channel when a message is received from the other peer.
... = function; value a function which the browser will call to handle the message event.
... example this code snippet creates a peer connection, adds a data channel to it, and starts creating new <p> (paragraph) elements each time a message arrives, with the message's contents displayed inside it.

RTCDataChannel.onopen - Web APIs

Web › API › RTCDataChannel › onopen

lished or re-established.
...f, of type event.
...hannel to an existing rtcpeerconnection, mypeerconnection.

RTCPeerConnection.onaddstream - Web APIs

Web › API › RTCPeerConnection › onaddstream

e first time an event occurs may be nearly immediately after the remote end of the connection is set using rtcpeerconnection.setremotedescription(); it doesn't wait for a particular stream to be accepted or rejected using sdp negotiation.
...it for a particular stream to be accepted or rejected using sdp negotiation.
...ation.

RadioNodeList.value - Web APIs

Web › API › RadioNodeList › value

if the underlying element collection contains radio buttons, the radionodelist.value property represents the checked radio button.
...io buttons, the radionodelist.value property represents the checked radio button.
...y is equal to the new value will be set to checked.

RadioNodeList - Web APIs

Web › API › RadioNodeList

the radionodelist interface represents a collection of radio elements in a <form> or a <fieldset> element.
...dde4" stroke-width="2px" /><text x="186" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">radionodelist</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties the radionodelist interface inherits the properties of nodelist.
...n contains radio buttons, the value property represents the checked radio button.

Range.getClientRects() - Web APIs

Web › API › Range › getClientRects

the range.getclientrects() method returns a list of domrect objects representing the area of the screen occupied by the range.
... the range.getclientrects() method returns a list of domrect objects representing the area of the screen occupied by the range.
... the range.getclientrects() method returns a list of domrect objects representing the area of the screen occupied by the range.

Range.toString() - Web APIs

Web › API › Range › toString

the range.
...tring() call, so comparing range and text through an alert dialog is ineffective.
...h an alert dialog is ineffective.

RenderingContext - Web APIs

Web › API › RenderingContext

renderingcontext is a webidl typedef which can refer to any one of the interfaces that represent a graphics rendering context within a <canvas> element: canvasrenderingcontext2d, webglrenderingcontext, or webgl2renderingcontext.
... helpful from a specification and browser implementation perspective to have a shorthand that means "one of these interfaces." as such, renderingcontext is an implementation detail, and isn't something web developers directly use.
...ification and browser implementation perspective to have a shorthand that means "one of these interfaces." as such, renderingcontext is an implementation detail, and isn't something web developers directly use.

Report - Web APIs

Web › API › Report

e of the event handler we set up inside the reportingobserver() constructor, we can now click the button to display the report details.
... details.
...ts) { const outputelem = document.queryselector('.output'); const list = document.createelement('ul'); outputelem.appendchild(list); for(let i = 0; i < reports.length; i++) { let listitem = document.createelement('li'); let textnode = document.createtextnode('report ' + (i + 1) + ', type: ' + reports[i].type); listitem.appendchild(textnode); let innerlist = document.createelement('ul'); listitem.appendchild(innerlist); list.appendchild(listitem); for (let key in reports[i].body) { let innerlistitem = document.createelement('li'); let keyvalue = reports[i].body[key]; innerlistitem.textcontent = key + ': ' + keyvalue; innerlist.appendchild(innerlistitem); } } } the reports parameter contains an array of all the reports in the obse...

ResizeObserver.observe() - Web APIs

Web › API › ResizeObserver › observe

the observe() method of the resizeobserver interface starts observing the specified element or svgelement.
... the observe() method of the resizeobserver interface starts observing the specified element or svgelement.
... the observe() method of the resizeobserver interface starts observing the specified element or svgelement.

ResizeObserver.unobserve() - Web APIs

Web › API › ResizeObserver › unobserve

the unobserve() method of the resizeobserver interface ends the observing of a specified element or svgelement.
... the unobserve() method of the resizeobserver interface ends the observing of a specified element or svgelement.
... the unobserve() method of the resizeobserver interface ends the observing of a specified element or svgelement.

SVGAnimatedPathData - Web APIs

Web › API › SVGAnimatedPathData

svg animated path data interface the svganimatedpathdata interface supports elements which have a 'd' attribute which holds svg path data, and supports the ability to animate that attribute.
...gpathseglist animatednormalizedpathseglist svgpathseglist animatedpathseglist svgpathseglist normalizedpathseglist svgpathseglist pathseglist normative document svg 1.1 (2nd edition) properties this interface also inherits properties from its parent, svgpathelement.
...'d' attribute in a form which matches one-for-one with svg's syntax.

SVGFitToViewBox - Web APIs

Web › API › SVGFitToViewBox

svg fit to view box interface the svgfittoviewbox interface is used to reflect the viewbox and preserveaspectratio attributes, and is mixed in to other interfaces for elements that support these two attributes.
... normative document svg 1.1 (2nd edition) properties name type description preserveaspectratio svganimatedpreserveaspectratio corresponds to attribute preserveaspectratio on the given element.
... properties name type description preserveaspectratio svganimatedpreserveaspectratio corresponds to attribute preserveaspectratio on the given element.

SVGPoint - Web APIs

Web › API › SVGPoint

an svgpoint represents a 2d or 3d point in the svg coordinate system.
... an svgpoint represents a 2d or 3d point in the svg coordinate system.
... an svgpoint represents a 2d or 3d point in the svg coordinate system.

SVGStylable - Web APIs

Web › API › SVGStylable

svg stylable interface the svgstylable interface is implemented on all objects corresponding to svg elements that can have style, class and presentation attributes specified on them.
...ods cssvalue getpresentationattribute(in domstring name) properties readonly svganimatedstring classname readonly cssstyledeclaration style normative document svg 1.1 (2nd edition) properties name type description classname svganimatedstring corresponds to attribute class on the given element.
...rties readonly svganimatedstring classname readonly cssstyledeclaration style normative document svg 1.1 (2nd edition) properties name type description classname svganimatedstring corresponds to attribute class on the given element.

Selection.containsNode() - Web APIs

Web › API › Selection › containsNode

the node that is being looked for in the selection.
...ontainsnode(document.body, true)); find the hidden word in this example, a message appears when you select the secret word.
...dden word in this example, a message appears when you select the secret word.

Storage.getItem() - Web APIs

Web › API › Storage › getItem

containing the value of the key.
... null is returned.
...rieves three data items from local storage, then uses them to set custom styles on a page.

Using readable streams - Web APIs

Web › API › Streams API › Using readable streams

e chunk out of the stream, which you can then do anything you like with.
...eam() is invoked to read the data back out of the stream again.
...({ done, value }) { // result objects contain two properties: // done - true if the stream has already given you all its data.

SubmitEvent - Web APIs

Web › API › SubmitEvent

e form's submit action is invoked.
...ubmitevent() creates and returns a new submitevent object whose type and other options are configured as specified.
...submitted.

TextTrackList: addtrack event - Web APIs

Web › API › TextTrackList › addtrack event

the addtrack event is fired when a track is added to a texttracklist.
... the addtrack event is fired when a track is added to a texttracklist.
... no cancelable no interface trackevent event handler property onaddtrack examples using addeventlistener(): const mediaelement = document.queryselector('video, audio'); mediaelement.texttracks.addeventlistener('addtrack', (event) => { console.log(`text track: ${event.track.label} added`); }); using the onaddtrack event handler property: const mediaelement = document.queryselector('video, audio'); mediaelement.texttracks.onaddtrack = (event) => { console.log(`text track: ${event.track.label} added`); }; specifications specification status html living standardthe definition of 'addtrack' in that specification.

TextTrackList: change event - Web APIs

Web › API › TextTrackList › change event

the change event is fired when a text track is made active or inactive, or a texttracklist is otherwise changed.
... the change event is fired when a text track is made active or inactive, or a texttracklist is otherwise changed.
... bubbles no cancelable no interface event event handler property onchange examples using addeventlistener(): const mediaelement = document.queryselectorall('video, audio')[0]; mediaelement.texttracks.addeventlistener('change', (event) => { console.log(`'${event.type}' event fired`); }); using the onchange event handler property: const mediaelement = document.queryselector('video, audio'); mediaelement.texttracks.onchange = (event) => { console.log(`'${event.type}' event fired`); }; specifications specification status html living standardthe definition of 'change' in that specification.

TextTrackList.length - Web APIs

Web › API › TextTrackList › length

the read-only texttracklist property length returns the number of entries in the texttracklist, each of which is a texttrack representing one track in the media element.
... track in the media element.
... by treating the texttracklist as an array of objects of type texttrack.

TextTrackList: removeTrack event - Web APIs

Web › API › TextTrackList › removeTrack event

the removetrack event is fired when a track is removed from a texttracklist.
... the removetrack event is fired when a track is removed from a texttracklist.
... cancelable no interface trackevent event handler property onremovetrack examples using addeventlistener(): const mediaelement = document.queryselector('video, audio'); mediaelement.texttracks.addeventlistener('removetrack', (event) => { console.log(`text track: ${event.track.label} removed`); }); using the onremovetrack event handler property: const mediaelement = document.queryselector('video, audio'); mediaelement.texttracks.onremovetrack = (event) => { console.log(`text track: ${event.track.label} removed`); }; specifications specification status html living standardthe definition of 'removetrack' in that specification.

Touch.pageX - Web APIs

Web › API › Touch › pageX

properties.
... following simple code snippet, we assume the user initiates one or more touch contacts on the source element, moves the touch points and then releases all contacts with the surface.
..., we assume the user initiates one or more touch contacts on the source element, moves the touch points and then releases all contacts with the surface.

Touch.pageY - Web APIs

Web › API › Touch › pageY

properties.
... following simple code snippet, we assume the user initiates one or more touch contacts on the source element, moves the touch points and then releases all contacts with the surface.
..., we assume the user initiates one or more touch contacts on the source element, moves the touch points and then releases all contacts with the surface.

Touch.screenX - Web APIs

Web › API › Touch › screenX

ates how to access the touch object's touch.screenx and touch.screeny properties.
... of a touch point relative to the screen in css pixels.
...the screen in css pixels.

TouchEvent.touches - Web APIs

Web › API › TouchEvent › touches

touches is a read-only touchlist listing all the touch objects for touch points that are currently in contact with the touch surface, regardless of whether or not they've changed or what their target element was at touchstart time.
...d or what their target element was at touchstart time.
...the touchevent.touches property is a touchlist object and containing a list of touch objects for every point of contact currently touching the surface.

TreeWalker.currentNode - Web APIs

Web › API › TreeWalker › currentNode

the treewalker.currentnode property represents the node on which the treewalker is currently pointing at.
...alker.currentnode property represents the node on which the treewalker is currently pointing at.
...represents the node on which the treewalker is currently pointing at.

TreeWalker.whatToShow - Web APIs

Web › API › TreeWalker › whatToShow

ment tree.
...defilter.show_cdata_section 8 shows cdatasection nodes.
...since entities are not part of the document tree, they do not appear when traversing over the document tree.

UIEvent.pageY - Web APIs

Web › API › UIEvent › pageY

howcoords(event)"> <p>to display the mouse coordinates please click anywhere on the page.</p> <div id="d1"> <span>this is an un-positioned div so clicking it will return layerx/layery values almost the same as pagex/pagey values.</span> </div> <div id="d2"> <span>this is a positioned div so clicking it will return layerx/layery values that are relative to the top-left corner of this positioned element.
...o clicking it will return layerx/layery values that are relative to the top-left corner of this positioned element.
... in the document, including page scrolling.</span> <span>make the page scroll more!

VideoPlaybackQuality.corruptedVideoFrames - Web APIs

Web › API › VideoPlaybackQuality › corruptedVideoFrames

the videoplaybackquality interface's read-only corruptedvideoframes property the number of corrupted video frames that have been received since the <video> element was last loaded or reloaded.
... the videoplaybackquality interface's read-only corruptedvideoframes property the number of corrupted video frames that have been received since the <video> element was last loaded or reloaded.
...video frame.

VideoPlaybackQuality.totalVideoFrames - Web APIs

Web › API › VideoPlaybackQuality › totalVideoFrames

the videoplaybackquality interface's totalvideoframes read-only property returns the total number of video frames that have been displayed or dropped since the media was loaded.
...he videoplaybackquality interface's totalvideoframes read-only property returns the total number of video frames that have been displayed or dropped since the media was loaded.
...oaded or replaced.

VideoTrackList: addtrack event - Web APIs

Web › API › VideoTrackList › addtrack event

the addtrack event is fired when a track is added to a videotracklist.
... the addtrack event is fired when a track is added to a videotracklist.
...es no cancelable no interface trackevent event handler property onaddtrack examples using addeventlistener(): const videoelement = document.queryselector('video'); videoelement.videotracks.addeventlistener('addtrack', (event) => { console.log(`video track: ${event.track.label} added`); }); using the onaddtrack event handler property: const videoelement = document.queryselector('video'); videoelement.videotracks.onaddtrack = (event) => { console.log(`video track: ${event.track.label} added`); }; specifications specification status html living standardthe definition of 'addtrack' in that specification.

VideoTrackList.length - Web APIs

Web › API › VideoTrackList › length

the read-only videotracklist property length returns the number of entries in the videotracklist, each of which is a videotrack representing one video track in the media element.
... the media element.
...y treating the videotracklist as an array of objects of type videotrack.

VideoTrackList: removetrack event - Web APIs

Web › API › VideoTrackList › removetrack event

the removetrack event is fired when a track is removed from a videotracklist.
... the removetrack event is fired when a track is removed from a videotracklist.
... cancelable no interface trackevent event handler property onremovetrack examples using addeventlistener(): const videoelement = document.queryselector('video'); videoelement.videotracks.addeventlistener('removetrack', (event) => { console.log(`video track: ${event.track.label} removed`); }); using the onremovetrack event handler property: const videoelement = document.queryselector('video'); videoelement.videotracks.onremovetrack = (event) => { console.log(`video track: ${event.track.label} removed`); }; specifications specification status html living standardthe definition of 'removetrack' in that specification.

WebGLRenderingContext.commit() - Web APIs

Web › API › WebGLRenderingContext › commit

the webglrenderingcontext.commit() method pushes frames back to the original htmlcanvaselement, if the context is not directly fixed to a specific canvas.
... the webglrenderingcontext.commit() method pushes frames back to the original htmlcanvaselement, if the context is not directly fixed to a specific canvas.
...mes back to the original htmlcanvaselement, if the context is not directly fixed to a specific canvas.

WebGLRenderingContext.drawingBufferHeight - Web APIs

Web › API › WebGLRenderingContext › drawingBufferHeight

the read-only webglrenderingcontext.drawingbufferheight property represents the actual height of the current drawing buffer.
... the read-only webglrenderingcontext.drawingbufferheight property represents the actual height of the current drawing buffer.
...rrent drawing buffer.

WebGLRenderingContext.drawingBufferWidth - Web APIs

Web › API › WebGLRenderingContext › drawingBufferWidth

the read-only webglrenderingcontext.drawingbufferwidth property represents the actual width of the current drawing buffer.
... the read-only webglrenderingcontext.drawingbufferwidth property represents the actual width of the current drawing buffer.
...e current drawing buffer.

WebGLRenderingContext.getContextAttributes() - Web APIs

Web › API › WebGLRenderingContext › getContextAttributes

the webglrenderingcontext.getcontextattributes() method returns a webglcontextattributes object that contains the actual context parameters.
...contextattributes object that contains the actual context parameters.
...utes method returns an object that describes the attributes set on this context, for example: { alpha: true, antialias: true, depth: true, failifmajorperformancecaveat: false, powerpreference: "default", premultipliedalpha: true, preservedrawingbuffer: false, stencil: false, desynchronized: false } the context attributes can be set when creating the context using the htmlcanvaselement.getcontext() method: canvas.getcontext('webgl', { antialias: false, depth: false }); see getcontext() for more information about the individual attributes.

WebGL: 2D and 3D graphics for the web - Web APIs

Web › API › WebGL API

webgl (web graphics library) is a javascript api for rendering high-performance interactive 3d and 2d graphics within any compatible web browser without the use of plug-ins.
...by the user's device.
...bgltransformfeedback webgluniformlocation webglvertexarrayobject extensions angle_instanced_arrays ext_blend_minmax ext_color_buffer_float ext_color_buffer_half_float ext_disjoint_timer_query ext_float_blend ext_frag_depth ext_srgb ext_shader_texture_lod ext_texture_compression_bptc ext_texture_compression_rgtc ext_texture_filter_anisotropic khr_parallel_shader_compile oes_element_index_uint oes_fbo_render_mipmap oes_standard_derivatives oes_texture_float oes_texture_float_linear oes_texture_half_float oes_texture_half_float_linear oes_vertex_array_object ovr_multiview2 webgl_color_buffer_float webgl_compressed_texture_astc webgl_compressed_texture_atc webgl_compressed_texture_etc webgl_compressed_texture_etc1 webgl_compressed_texture_pvrtc webgl_compressed_...

Establishing a connection: The WebRTC perfect negotiation pattern - Web APIs

Web › API › WebRTC API › Perfect negotiation

address of a real stun server.
... } selfvideo.srcobject = stream; } catch(err) { console.error(err); } } this isn't appreciably different from older webrtc connection establishment code.
...t once).

Web Audio API best practices - Web APIs

Web › API › Web Audio API › Best practices

you can adapt to your own style.
... this article, we'll share a number of best practices — guidelines, tips, and tricks for working with the web audio api.
...en working with files, you are looking at either the grabbing the file from an htmlmediaelement (i.e.

Window: resize event - Web APIs

Web › API › Window › resize event

the resize event fires when the document view (window) has been resized.
... the resize event fires when the document view (window) has been resized.
...lier browsers it was possible to register resize event handlers on any html element.

Window.scroll() - Web APIs

Web › API › Window › scroll

- put the 100th vertical pixel at the top of the window --> <button onclick="scroll(0, 100);">click to scroll down 100 pixels</button> using options: window.scroll({ top: 100, left: 100, behavior: 'smooth' }); notes window.scrollto() is effectively the same as this method.
...h vertical pixel at the top of the window --> <button onclick="scroll(0, 100);">click to scroll down 100 pixels</button> using options: window.scroll({ top: 100, left: 100, behavior: 'smooth' }); notes window.scrollto() is effectively the same as this method.
...e top of the window --> <button onclick="scroll(0, 100);">click to scroll down 100 pixels</button> using options: window.scroll({ top: 100, left: 100, behavior: 'smooth' }); notes window.scrollto() is effectively the same as this method.

Window.scrollTo() - Web APIs

Web › API › Window › scrollTo

t that you want displayed in the upper left.
...t displayed in the upper left.
...er left.

Introduction - Web APIs

Web › API › XSLTProcessor › Introduction

ntent.
...ple way to apply style rules to a web document.
...the position of an element.

XSLTProcessor - Web APIs

Web › API › XSLTProcessor

.
...r values, and to apply the transformation to documents.
...ssor.transformtodocument(node source) transforms the node source applying the stylesheet given importing using the xsltprocessor.importstylesheet() function.

ARIA live regions - Accessibility

Web › Accessibility › ARIA › ARIA Live Regions

t be obvious to users of assistive technologies.
...pace.
...lock example does not work as expected.

Using the aria-orientation attribute - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the aria-orientation attribute

the aria-orientation attribute is used to indicate whether an element is oriented horizontally or vertically.
... the aria-orientation attribute is used to indicate whether an element is oriented horizontally or vertically.
... the aria-orientation attribute is used to indicate whether an element is oriented horizontally or vertically.

Using the aria-required attribute - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the aria-required attribute

description the aria-required attribute is used to indicate that user input is required on an element before a form can be submitted.
... description the aria-required attribute is used to indicate that user input is required on an element before a form can be submitted.
... description the aria-required attribute is used to indicate that user input is required on an element before a form can be submitted.

ARIA Test Cases - Accessibility

Web › Accessibility › ARIA › ARIA Test Cases

10 - - - - voiceover (leopard) n/a n/a - fail window-eyes - - - - nvda - n/a - - zoom (leopard) pass n/a pass pass zoomtext - - - - orca - - - - img tiled image expected at behavior: screen readers should announce the image is a single graphic element along with its associated label, even though it is built from numerous sub-images.
... jaws 10 - - - - voiceover (leopard) n/a n/a - fail window-eyes - - - - nvda - n/a - - zoom (leopard) pass n/a pass pass zoomtext - - - - orca - - - - radiogroup and radiobutton radio example using css background images radio example using img element radio example using aria-activedescendent property dojo nightly build expected at behavior: on initial focus, the screen reader should announce the label of the radio group and the focused radio button, whether it is selected or not, and its position.
... n/a n/a jaws 10 - - - - voiceover (leopard) n/a n/a - fail window-eyes - - - - nvda - n/a - - zoom (leopard) pass n/a pass pass zoomtext - - - - orca - - - - separator (no examples yet) expected at behavior: (mz) the inclusion of this element should be controlled by the screen reader.

ARIA: search role - Accessibility

Web › Accessibility › ARIA › Roles › Search role

the search landmark role is used to identify a section of the page used to search the page, site, or collection of sites.
...tify and navigate to large sections of the document.
...h-input" name="search" spellcheck="false"> <input value="submit" type="submit"> </form> accessibility concerns landmark roles are intended to be used sparingly, to identify larger overall sections of the document.

Mobile accessibility checklist - Accessibility

Web › Accessibility › Mobile accessibility checklist

r and off-screen placement must not be used exclusively to handle visibility.
...ts must be focusable: standard controls such as links, buttons, and form fields are focusable by default.
...bove attributes are not applicable, use appropriate aria states and properties such as aria-label, aria-labelledby, or aria-describedby.

-moz-outline-radius - CSS: Cascading Style Sheets

Web › CSS › -moz-outline-radius

in mozilla applications like firefox, the -moz-outline-radius css shorthand property can be used to give an element's outline rounded corners.
...re set, the first one applies to the top-left corner, the second one to the top-right corner, the third one to the bottom-right corner and the fourth one to the bottom-left corner.
...oz-outline-radius-bottomright: a length, percentage or calc();-moz-outline-radius-bottomleft: a length, percentage or calc(); formal syntax <outline-radius>{1,4} [ / <outline-radius>{1,4} ]?where <outline-radius> = <length> | <percentage> examples rounding an outline note: this example will not display the desired effect if you are viewing this in a browser other than firefox.

-webkit-border-before - CSS: Cascading Style Sheets

Web › CSS › -webkit-border-before

kit-border-before: 2px dotted; -webkit-border-before: medium dashed blue; /* global values */ -webkit-border-before: inherit; -webkit-border-before: initial; -webkit-border-before: unset; -webkit-border-before can be used to set the values for one or more of: -webkit-border-before-width, -webkit-border-before-style, and -webkit-border-before-color.
... it maps to a physical border depending on the element's writing mode, directionality, and text orientation.
...of the properties of the shorthand:border-width: as each of the properties of the shorthand:border-top-width: mediumborder-right-width: mediumborder-bottom-width: mediumborder-left-width: mediumborder-style: as each of the properties of the shorthand:border-top-style: noneborder-right-style: noneborder-bottom-style: noneborder-left-style: nonecolor: varies from one browser to anotherapplies toall elementsinheritedyespercentagesas each of the properties of the shorthand:-webkit-border-before-width: logical-width of containing blockcomputed valueas each of the properties of the shorthand:border-width: as each of the properties of the shorthand:border-bottom-width: the absolute length or 0 if border-bottom-style is none or hiddenborder-left-width: the absolute length or 0 if border-left-style is non...

-webkit-mask-repeat-x - CSS: Cascading Style Sheets

Web › CSS › -webkit-mask-repeat-x

x: round; /* multiple values */ -webkit-mask-repeat-x: repeat, no-repeat, space; /* global values */ -webkit-mask-repeat-x: inherit; -webkit-mask-repeat-x: initial; -webkit-mask-repeat-x: unset; syntax values repeat the mask image is repeated both horizontally and vertically.
... image is repeated both horizontally and vertically.
...etch (leaving no gaps) until there is room for another one to be added.

-webkit-mask-repeat-y - CSS: Cascading Style Sheets

Web › CSS › -webkit-mask-repeat-y

le values */ -webkit-mask-repeat-y: repeat, no-repeat, space; /* global values */ -webkit-mask-repeat-y: inherit; -webkit-mask-repeat-y: initial; -webkit-mask-repeat-y: unset; syntax values repeat the mask image is repeated vertically.
...repeated vertically.
... no gaps) until there is room for another one to be added.

:-moz-first-node - CSS: Cascading Style Sheets

Web › CSS › :-moz-first-node

the :-moz-first-node css pseudo-class is a mozilla extension that represents any element that is the first child node of some other element.
... the :-moz-first-node css pseudo-class is a mozilla extension that represents any element that is the first child node of some other element.
... the :-moz-first-node css pseudo-class is a mozilla extension that represents any element that is the first child node of some other element.

:-moz-last-node - CSS: Cascading Style Sheets

Web › CSS › :-moz-last-node

the :-moz-last-node css pseudo-class is a mozilla extension that represents any element that is the last child node of some other element.
... the :-moz-last-node css pseudo-class is a mozilla extension that represents any element that is the last child node of some other element.
... the :-moz-last-node css pseudo-class is a mozilla extension that represents any element that is the last child node of some other element.

:-moz-only-whitespace - CSS: Cascading Style Sheets

Web › CSS › :-moz-only-whitespace

note: in selectors level 4 the :empty selector was changed to act like :-moz-only-whitespace, but no browser currently supports this yet.
... note: in selectors level 4 the :empty selector was changed to act like :-moz-only-whitespace, but no browser currently supports this yet.
... note: in selectors level 4 the :empty selector was changed to act like :-moz-only-whitespace, but no browser currently supports this yet.

::-webkit-progress-value - CSS: Cascading Style Sheets

Web › CSS › ::-webkit-progress-value

the ::-webkit-progress-value css pseudo-element represents the filled-in portion of the bar of a <progress> element.
... the ::-webkit-progress-value css pseudo-element represents the filled-in portion of the bar of a <progress> element.
... the ::-webkit-progress-value css pseudo-element represents the filled-in portion of the bar of a <progress> element.

::-webkit-search-cancel-button - CSS: Cascading Style Sheets

Web › CSS › ::-webkit-search-cancel-button

the ::-webkit-search-cancel-button css pseudo-element represents a button (the "cancel button") at the edge of an <input> of type="search" which clears away the current value of the <input> element.
... the ::-webkit-search-cancel-button css pseudo-element represents a button (the "cancel button") at the edge of an <input> of type="search" which clears away the current value of the <input> element.
... the ::-webkit-search-cancel-button css pseudo-element represents a button (the "cancel button") at the edge of an <input> of type="search" which clears away the current value of the <input> element.

::-webkit-search-results-button - CSS: Cascading Style Sheets

Web › CSS › ::-webkit-search-results-button

the ::-webkit-search-results-button css pseudo-element represents a button (the "search results button") at the left edge of an <input> of type="search" which when clicked displays a menu which allows the user to choose from previous recent search queries.
... the ::-webkit-search-results-button css pseudo-element represents a button (the "search results button") at the left edge of an <input> of type="search" which when clicked displays a menu which allows the user to choose from previous recent search queries.
...lts-button css pseudo-element represents a button (the "search results button") at the left edge of an <input> of type="search" which when clicked displays a menu which allows the user to choose from previous recent search queries.

::cue-region - CSS: Cascading Style Sheets

Web › CSS › ::cue-region

the ::cue-region css pseudo-element matches webvtt cues within a selected element.
...llow; font-weight: bold; } the properties are applied to the entire set of cues as if they were a single unit.
...ity outline outline-color outline-style outline-width ruby-position text-combine-upright text-decoration text-decoration-color text-decoration-line text-decoration-style text-decoration-thickness text-shadow visibility white-space specifications specification status comment webvtt: the web video text tracks formatthe definition of 'the ::cue-region pseudo-element' in that specification.

:default - CSS: Cascading Style Sheets

Web › CSS › :default

the :default css pseudo-class selects form elements that are the default in a group of related elements.
... the :default css pseudo-class selects form elements that are the default in a group of related elements.
... the :default css pseudo-class selects form elements that are the default in a group of related elements.

:lang() - CSS: Cascading Style Sheets

Web › CSS › :lang

the :lang() css pseudo-class matches elements based on the language they are determined to be in.
... the :lang() css pseudo-class matches elements based on the language they are determined to be in.
...ocol (such as http headers).

:root - CSS: Cascading Style Sheets

Web › CSS › :root

the :root css pseudo-class matches the root element of a tree representing the document.
... the :root css pseudo-class matches the root element of a tree representing the document.
... the :root css pseudo-class matches the root element of a tree representing the document.

:state() - CSS: Cascading Style Sheets

Web › CSS › :state

the :state css pseudo-class represents any custom element with the specified custom state in elementinternals.states.
... the :state css pseudo-class represents any custom element with the specified custom state in elementinternals.states.
... the :state css pseudo-class represents any custom element with the specified custom state in elementinternals.states.

additive-symbols - CSS: Cascading Style Sheets

Web › CSS › @counter-style › additive-symbols

"0", 2 url(symbol.png); when the system descriptor is cyclic, numeric, alphabetic, symbolic, or fixed, use the symbols descriptor instead of additive-symbols.
...efinition related at-rule@counter-styleinitial valuen/acomputed valueas specified formal syntax [ <integer> && <symbol> ]#where <symbol> = <string> | <image> | <custom-ident>where <image> = <url> | <image()> | <image-set()> | <element()> | <paint()> | <cross-fade()> | <gradient>where <image()> = image( <image-tags>?
...lated at-rule@counter-styleinitial valuen/acomputed valueas specified formal syntax [ <integer> && <symbol> ]#where <symbol> = <string> | <image> | <custom-ident>where <image> = <url> | <image()> | <image-set()> | <element()> | <paint()> | <cross-fade()> | <gradient>where <image()> = image( <image-tags>?

negative - CSS: Cascading Style Sheets

Web › CSS › @counter-style › negative

pad - CSS: Cascading Style Sheets

Web › CSS › @counter-style › pad

prefix - CSS: Cascading Style Sheets

Web › CSS › @counter-style › prefix

suffix - CSS: Cascading Style Sheets

Web › CSS › @counter-style › suffix

ng); values <symbol> specifies a <symbol> that is appended to the marker representation.
...ted at-rule@counter-styleinitial value".
...ounter-styleinitial value".

symbols - CSS: Cascading Style Sheets

Web › CSS › @counter-style › symbols

f the system descriptor is cyclic, numeric, alphabetic, symbolic, or fixed.
...ymbols.
...al definition related at-rule@counter-styleinitial valuen/acomputed valueas specified formal syntax <symbol>+where <symbol> = <string> | <image> | <custom-ident>where <image> = <url> | <image()> | <image-set()> | <element()> | <paint()> | <cross-fade()> | <gradient>where <image()> = image( <image-tags>?

font-display - CSS: Cascading Style Sheets

Web › CSS › @font-face › font-display

ely small block period and a short swap period.
...ely small block period and no swap period.
...nt face.

Adjacent sibling combinator - CSS: Cascading Style Sheets

Web › CSS › Adjacent sibling combinator

the adjacent sibling combinator (+) separates two selectors and matches the second element only if it immediately follows the first element, and both are children of the same parent element.
... the adjacent sibling combinator (+) separates two selectors and matches the second element only if it immediately follows the first element, and both are children of the same parent element.
... the adjacent sibling combinator (+) separates two selectors and matches the second element only if it immediately follows the first element, and both are children of the same parent element.

Alternative style sheets - CSS: Cascading Style Sheets

Web › CSS › Alternative style sheets

ew > page style submenu.
...esheet, so providing stylesheets with different title attributes will cause some of them to be ignored.
...e style sheets.

CSS Grid Layout - CSS: Cascading Style Sheets

Web › CSS › CSS Grid Layout

css grid layout excels at dividing a page into major regions or defining the relationship in terms of size, position, and layer, between parts of a control built from html primitives.
...id layout excels at dividing a page into major regions or defining the relationship in terms of size, position, and layer, between parts of a control built from html primitives.
...ize, position, and layer, between parts of a control built from html primitives.

CSS Shapes - CSS: Cascading Style Sheets

Web › CSS › CSS Shapes

css shapes describe geometric shapes for use in css.
... css shapes describe geometric shapes for use in css.
... css shapes describe geometric shapes for use in css.

Introducing the CSS Cascade - CSS: Cascading Style Sheets

Web › CSS › Cascade

ing one or more stylesheets, which define the look and feel of the website — its theme.
...er (or reader) of the web site can choose to override styles in many browsers using a custom user stylesheet designed to tailor the experience to the user's wishes.
...s in many browsers using a custom user stylesheet designed to tailor the experience to the user's wishes.

General sibling combinator - CSS: Cascading Style Sheets

Web › CSS › General sibling combinator

the general sibling combinator (~) separates two selectors and matches the second element only if it follows the first element (though not necessarily immediately), and both are children of the same parent element.
... the general sibling combinator (~) separates two selectors and matches the second element only if it follows the first element (though not necessarily immediately), and both are children of the same parent element.
... the general sibling combinator (~) separates two selectors and matches the second element only if it follows the first element (though not necessarily immediately), and both are children of the same parent element.

ID selectors - CSS: Cascading Style Sheets

Web › CSS › ID selectors

the css id selector matches an element based on the value of the element’s id attribute.
... the css id selector matches an element based on the value of the element’s id attribute.
... the css id selector matches an element based on the value of the element’s id attribute.

Inline formatting context - CSS: Cascading Style Sheets

Web › CSS › Inline formatting context

epts the inline formatting context is part of the visual rendering of a web page.
...ine box.
...is split, margins, borders, and padding have no visual effect where the split occurs.

Pagination - CSS: Cascading Style Sheets

Web › CSS › Layout cookbook › Pagination

this cookbook pattern demonstrates the navigation pattern used to display pagination, where the user can move between pages of content such as search results.
... is understandable by people using a screenreader, we mark the items up as a list inside a <nav> element, and then use css to display the layout visually as a row.
...wsers this could be used instead of margins to space out the items.

CSS Tutorials - CSS: Cascading Style Sheets

Web › CSS › Tutorials

e of css?
...set, counter-increment, counters(), and counter().
...ear or radial, repeating or not.

animation-fill-mode - CSS: Cascading Style Sheets

Web › CSS › animation-fill-mode

to set all animation properties at once.
...thus extending the animation properties in both directions.
...s in both directions.

animation-name - CSS: Cascading Style Sheets

Web › CSS › animation-name

the animation-name css property specifies the names of one or more @keyframes at-rules describing the animation or animations to apply to the element.
..., the identifier can't be none, unset, initial, or inherit.
... initial, or inherit.

animation-timing-function - CSS: Cascading Style Sheets

Web › CSS › animation-timing-function

timing-function: ease, step-start, cubic-bezier(0.1, 0.7, 1.0, 0.1); /* global values */ animation-timing-function: inherit; animation-timing-function: initial; animation-timing-function: unset; timing functions may be specified on individual keyframes in a @keyframes rule.
...steps(1, jump-start) step-end equal to steps(1, jump-end) note: when you specify multiple comma-separated values on an animation-* property, they will be assigned to the animations specified in the animation-name property in different ways depending on how many there are.
...to steps(1, jump-end) note: when you specify multiple comma-separated values on an animation-* property, they will be assigned to the animations specified in the animation-name property in different ways depending on how many there are.

block-size - CSS: Cascading Style Sheets

Web › CSS › block-size

the block-size css property defines the horizontal or vertical size of an element's block, depending on its writing mode.
...length> values */ block-size: 300px; block-size: 25em; /* <percentage> values */ block-size: 75%; /* keyword values */ block-size: max-content; block-size: min-content; block-size: fit-content(20em); block-size: auto; /* global values */ block-size: inherit; block-size: initial; block-size: unset; if the writing mode is vertically oriented, the value of block-size relates to the width of the element; otherwise, it relates to the height of the element.
...content; block-size: min-content; block-size: fit-content(20em); block-size: auto; /* global values */ block-size: inherit; block-size: initial; block-size: unset; if the writing mode is vertically oriented, the value of block-size relates to the width of the element; otherwise, it relates to the height of the element.

border-block-end-color - CSS: Cascading Style Sheets

Web › CSS › border-block-end-color

the border-block-end-color css property defines the color of the logical block-end border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation.
... in a github repository.
...nteractive-examples and send us a pull request.

border-block-end-style - CSS: Cascading Style Sheets

Web › CSS › border-block-end-style

the border-block-end-style css property defines the style of the logical block-end border of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation.
...nteractive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...le'> values */ border-block-end-style: dashed; border-block-end-style: dotted; border-block-end-style: groove; related properties are border-block-start-style, border-inline-start-style, and border-inline-end-style, which define the other border styles of the element.

border-block-end-width - CSS: Cascading Style Sheets

Web › CSS › border-block-end-width

the border-block-end-width css property defines the width of the logical block-end border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation.
...if you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
... pull request.

border-block-end - CSS: Cascading Style Sheets

Web › CSS › border-block-end

following css properties: border-block-end-color border-block-end-style border-block-end-width syntax border-block-end: 1px; border-block-end: 2px dotted; border-block-end: medium dashed blue; border-block-end can be used to set the values for one or more of border-block-end-width, border-block-end-style, and border-block-end-color.
...al border to which it maps depends on the element's writing mode, directionality, and text orientation.
...fied with one or more of the following, in any order: <'border-width'> the width of the border.

border-block-start-color - CSS: Cascading Style Sheets

Web › CSS › border-block-start-color

the border-block-start-color css property defines the color of the logical block-start border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation.
... in a github repository.
...://github.com/mdn/interactive-examples and send us a pull request.

border-block-start-style - CSS: Cascading Style Sheets

Web › CSS › border-block-start-style

the border-block-start-style css property defines the style of the logical block start border of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation.
...active examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
... values */ border-block-start-style: dashed; border-block-start-style: dotted; border-block-start-style: groove; related properties are border-block-end-style, border-inline-start-style, and border-inline-end-style, which define the other border styles of the element.

border-block-start - CSS: Cascading Style Sheets

Web › CSS › border-block-start

ties: border-block-start-color border-block-start-style border-block-start-width syntax border-block-start: 1px; border-block-start: 2px dotted; border-block-start: medium dashed blue; border-block-start can be used to set the values for one or more of border-block-start-width, border-block-start-style, and border-block-start-color.
...ical border to which it maps depends on the element's writing mode, directionality, and text orientation.
...of the properties of the shorthand:border-width: as each of the properties of the shorthand:border-top-width: mediumborder-right-width: mediumborder-bottom-width: mediumborder-left-width: mediumborder-style: as each of the properties of the shorthand:border-top-style: noneborder-right-style: noneborder-bottom-style: noneborder-left-style: nonecolor: varies from one browser to anotherapplies toall elementsinheritednocomputed valueas each of the properties of the shorthand:border-width: as each of the properties of the shorthand:border-bottom-width: the absolute length or 0 if border-bottom-style is none or hiddenborder-left-width: the absolute length or 0 if border-left-style is none or hiddenborder-right-width: the absolute length or 0 if border-right-style is none or hiddenborder-top-width: the ...

border-color - CSS: Cascading Style Sheets

Web › CSS › border-color

the border-color shorthand css property sets the color of an element's border.
...n/interactive-examples and send us a pull request.
... to the bottom.

border-inline-end-style - CSS: Cascading Style Sheets

Web › CSS › border-inline-end-style

the border-inline-end-style css property defines the style of the logical inline end border of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation.
...eractive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...'> values */ border-inline-end-style: dashed; border-inline-end-style: dotted; border-inline-end-style: groove; related properties are border-block-start-style, border-block-end-style, and border-inline-start-style, which define the other border styles of the element.

border-inline-start-color - CSS: Cascading Style Sheets

Web › CSS › border-inline-start-color

the border-inline-start-color css property defines the color of the logical inline start border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation.
... in a github repository.
...nteractive-examples and send us a pull request.

border-inline-start-width - CSS: Cascading Style Sheets

Web › CSS › border-inline-start-width

the border-inline-start-width css property defines the width of the logical inline-start border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation.
...you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...ll request.

border-inline-start - CSS: Cascading Style Sheets

Web › CSS › border-inline-start

teractive-examples and send us a pull request.
...hich border-inline-start maps depends on the element's writing mode, directionality, and text orientation.
...of the properties of the shorthand:border-width: as each of the properties of the shorthand:border-top-width: mediumborder-right-width: mediumborder-bottom-width: mediumborder-left-width: mediumborder-style: as each of the properties of the shorthand:border-top-style: noneborder-right-style: noneborder-bottom-style: noneborder-left-style: nonecolor: varies from one browser to anotherapplies toall elementsinheritednocomputed valueas each of the properties of the shorthand:border-width: as each of the properties of the shorthand:border-bottom-width: the absolute length or 0 if border-bottom-style is none or hiddenborder-left-width: the absolute length or 0 if border-left-style is none or hiddenborder-right-width: the absolute length or 0 if border-right-style is none or hiddenborder-top-width: the ...

border-inline - CSS: Cascading Style Sheets

Web › CSS › border-inline

the border-inline css property is a shorthand property for setting the individual logical inline border property values in a single place in the style sheet.
...ottom or border-right, and border-left properties, depending on the values defined for writing-mode, direction, and text-orientation.
...fied with one or more of the following, in any order: <'border-width'> the width of the border.

border-top-style - CSS: Cascading Style Sheets

Web › CSS › border-top-style

the border-top-style css property sets the line style of an element's top border.
...der-top-style: double; border-top-style: groove; border-top-style: ridge; border-top-style: inset; border-top-style: outset; /* global values */ border-top-style: inherit; border-top-style: initial; border-top-style: unset; the border-top-style property is specified as a single keyword chosen from those available for the border-style property.
...pecifications specification status comment css backgrounds and borders module level 3the definition of 'border-top-style' in that specification.

border - CSS: Cascading Style Sheets

Web › CSS › border

the border shorthand css property sets an element's border.
...r-color properties, which accept different values for each side.
...border-bottom-width: mediumborder-left-width: mediumborder-style: as each of the properties of the shorthand:border-top-style: noneborder-right-style: noneborder-bottom-style: noneborder-left-style: noneborder-color: as each of the properties of the shorthand:border-top-color: currentcolorborder-right-color: currentcolorborder-bottom-color: currentcolorborder-left-color: currentcolorapplies toall elements.

box-pack - CSS: Cascading Style Sheets

Web › CSS › box-pack

-webkit-box-pack css properties specify how a -moz-box or -webkit-box packs its contents in the direction of its layout.
...r the last child.
...of the box designated the start for packing purposes depends on the box's orientation and direction: normal reverse horizontal left right vertical top bottom the edge opposite to the start is designated the end.

caret-color - CSS: Cascading Style Sheets

Web › CSS › caret-color

the caret-color css property sets the color of the insertion caret, the visible marker where the next character typed will be inserted.
...ithub.com/mdn/interactive-examples and send us a pull request.
...nsure good visibility and contrast with the surrounding content, taking into account the value of currentcolor, the background, shadows, and other factors.

column-gap (grid-column-gap) - CSS: Cascading Style Sheets

Web › CSS › column-gap

the column-gap css property sets the size of the gap (gutter) between an element's columns.
...lti-column layout this is specified as 1em.
... of the gap between columns, defined as a <percentage>.

cross-fade() - CSS: Cascading Style Sheets

Web › CSS › cross-fade

hanging-punctuation - CSS: Cascading Style Sheets

Web › CSS › hanging-punctuation

uses one of the following: first together with any one of last, allow-end, or force-end last together with any one of first, allow-end, or force-end three-value syntax uses one of the following: first, allow-end, and last first, force-end, and last values none no character hangs.
...d last together with any one of first, allow-end, or force-end three-value syntax uses one of the following: first, allow-end, and last first, force-end, and last values none no character hangs.
... an opening bracket or quote at the start of the first formatted line of an element hangs.

image-orientation - CSS: Cascading Style Sheets

Web › CSS › image-orientation

the image-orientation css property specifies a layout-independent correction to the orientation of an image.
...h the rotate keyword to specify rotation.
...ta css #image { image-orientation: from-image; /* can be changed in the live sample */ } html <img id="image" src="https://udn.realityripple.com/samples/db/4f9fbd7dfb.svg" alt="orientation taken from the image"> <select id="imageorientation"> <option value="from-image">from-image</option> <option value="none">none</option> </select> javascript var imageorientation = document.getelementbyid("imageorientation"); imageorientation.addeventlistener("change", function (evt) { document.getelementbyid("image").style.imageorientation = evt.target.value; }); result specifications specification status comment css images module level 3the definition of 'image-orientation' in that specification.

initial - CSS: Cascading Style Sheets

Web › CSS › initial

the initial css keyword applies the initial (or default) value of a property to an element.
...tial (or default) value of a property to an element.
... no supportrequires a vendor prefix or different name for use.requires a vendor prefix or different name for use.

inline-size - CSS: Cascading Style Sheets

Web › CSS › inline-size

the inline-size css property defines the horizontal or vertical size of an element's block, depending on its writing mode.
...es */ inline-size: 300px; inline-size: 25em; /* <percentage> values */ inline-size: 75%; /* keyword values */ inline-size: max-content; inline-size: min-content; inline-size: fit-content(20em); inline-size: auto; /* global values */ inline-size: inherit; inline-size: initial; inline-size: unset; if the writing mode is vertically oriented, the value of inline-size relates to the height of the element; otherwise, it relates to the width of the element.
...t; inline-size: min-content; inline-size: fit-content(20em); inline-size: auto; /* global values */ inline-size: inherit; inline-size: initial; inline-size: unset; if the writing mode is vertically oriented, the value of inline-size relates to the height of the element; otherwise, it relates to the width of the element.

inset - CSS: Cascading Style Sheets

Web › CSS › inset

the inset css property, though part of the logical specification, doesn't define logical block or inline offsets, and instead defines physical offsets, regardless of the element's writing mode, directionality, and text orientation.
...em 3em 3em 3em; /* top right bottom left */ /* <percentage>s of the width (left/right) or height (top/bottom) of the containing block */ inset: 10% 5% 5% 5%; /* keyword value */ inset: auto; /* global values */ inset: inherit; inset: initial; inset: unset; syntax values the inset property takes the same values as the left property.
... the inset property takes the same values as the left property.

list-style-image - CSS: Cascading Style Sheets

Web › CSS › list-style-image

roperty sets an image to be used as the list item marker.
... often more convenient to use the shorthand list-style.
...this interactive example is stored in a github repository.

list-style - CSS: Cascading Style Sheets

Web › CSS › list-style

the list-style css shorthand property allows you set all the list style properties at once.
...llows you set all the list style properties at once.
...his interactive example is stored in a github repository.

min-block-size - CSS: Cascading Style Sheets

Web › CSS › min-block-size

the min-block-size css property defines the minimum horizontal or vertical size of an element's block, depending on its writing mode.
...ize: 100px; min-block-size: 5em; /* <percentage> values */ min-block-size: 10%; /* keyword values */ min-block-size: max-content; min-block-size: min-content; min-block-size: fit-content(20em); /* global values */ min-block-size: inherit; min-block-size: initial; min-block-size: unset; if the writing mode is vertically oriented, the value of min-block-size relates to the minimum width of the element; otherwise, it relates to the minimum height of the element.
...in-content; min-block-size: fit-content(20em); /* global values */ min-block-size: inherit; min-block-size: initial; min-block-size: unset; if the writing mode is vertically oriented, the value of min-block-size relates to the minimum width of the element; otherwise, it relates to the minimum height of the element.

min-inline-size - CSS: Cascading Style Sheets

Web › CSS › min-inline-size

the min-inline-size css property defines the horizontal or vertical minimal size of an element's block, depending on its writing mode.
...; min-inline-size: 5em; /* <percentage> values */ min-inline-size: 10%; /* keyword values */ min-inline-size: max-content; min-inline-size: min-content; min-inline-size: fit-content(20em); /* global values */ min-inline-size: inherit; min-inline-size: initial; min-inline-size: unset; if the writing mode is vertically oriented, the value of min-inline-size relates to the minimum height of the element; otherwise, it relates to the minimum width of the element.
...ontent; min-inline-size: fit-content(20em); /* global values */ min-inline-size: inherit; min-inline-size: initial; min-inline-size: unset; if the writing mode is vertically oriented, the value of min-inline-size relates to the minimum height of the element; otherwise, it relates to the minimum width of the element.

mix-blend-mode - CSS: Cascading Style Sheets

Web › CSS › mix-blend-mode

the mix-blend-mode css property sets how an element's content should blend with the content of the element's parent and the element's background.
... mix-blend-mode: soft-light; mix-blend-mode: difference; mix-blend-mode: exclusion; mix-blend-mode: hue; mix-blend-mode: saturation; mix-blend-mode: color; mix-blend-mode: luminosity; /* global values */ mix-blend-mode: initial; mix-blend-mode: inherit; mix-blend-mode: unset; values <blend-mode> the blending mode that should be applied.
... 41chrome android full support 41firefox android full support 32opera android full support 28safari ios full support 8samsung internet android full support 4.0on svg elementschrome full support 41edge full support 79firefox full support 32ie no support noopera full support 28safari no support nowebview...

outline-style - CSS: Cascading Style Sheets

Web › CSS › outline-style

the outline-style css property sets the style of an element's outline.
... the outline-style css property sets the style of an element's outline.
... the outline looks as though it were carved into the page.

overflow-anchor - CSS: Cascading Style Sheets

Web › CSS › overflow-anchor

it.
... if you are experiencing problems with scroll anchoring in a document or part of a document and need to turn the behavior off.
...to turn the behavior off.

overflow-wrap - CSS: Cascading Style Sheets

Web › CSS › overflow-wrap

the overflow-wrap css property applies to inline elements, setting whether the browser should insert line breaks within an otherwise unbreakable string to prevent text from overflowing its line box.
...n-content intrinsic sizes.
...p: anywhere; } .ow-break-word { overflow-wrap: break-word; } .word-break { word-break: break-all; } .hyphens { hyphens: auto; } result specifications specification status comment css text module level 3the definition of 'overflow-wrap' in that specification.

padding-block-end - CSS: Cascading Style Sheets

Web › CSS › padding-block-end

the padding-block-end css property defines the logical block end padding of an element, which maps to a physical padding depending on the element's writing mode, directionality, and text orientation.
... padding-block-end property takes the same values as the padding-left property.
...padding-left property.

padding-block-start - CSS: Cascading Style Sheets

Web › CSS › padding-block-start

the padding-block-start css property defines the logical block start padding of an element, which maps to a physical padding depending on the element's writing mode, directionality, and text orientation.
... padding-block-start property takes the same values as the padding-left property.
...e padding-left property.

padding-inline-end - CSS: Cascading Style Sheets

Web › CSS › padding-inline-end

the padding-inline-end css property defines the logical inline end padding of an element, which maps to a physical padding depending on the element's writing mode, directionality, and text orientation.
... padding-inline-end property takes the same values as the padding-left property.
... padding-left property.

padding-inline-start - CSS: Cascading Style Sheets

Web › CSS › padding-inline-start

the padding-inline-start css property defines the logical inline start padding of an element, which maps to a physical padding depending on the element's writing mode, directionality, and text orientation.
... padding-inline-start property takes the same values as the padding-left property.
...he padding-left property.

<position> - CSS: Cascading Style Sheets

Web › CSS › position value

the <position> (or <bg-position>) css data type denotes a two-dimensional coordinate used to set a location relative to an element box.
... the <position> (or <bg-position>) css data type denotes a two-dimensional coordinate used to set a location relative to an element box.
... to an element box.

scroll-snap-stop - CSS: Cascading Style Sheets

Web › CSS › scroll-snap-stop

the scroll-snap-stop css property defines whether the scroll container is allowed to "pass over" possible snap positions.
...ap-stop: normal; scroll-snap-stop: always; /* global values */ scroll-snap-type: inherit; scroll-snap-type: initial; scroll-snap-type: unset; syntax values normal when the visual viewport of this element's scroll container is scrolled, it may "pass over" possible snap positions.
...: inherit; scroll-snap-type: initial; scroll-snap-type: unset; syntax values normal when the visual viewport of this element's scroll container is scrolled, it may "pass over" possible snap positions.

scrollbar-width - CSS: Cascading Style Sheets

Web › CSS › scrollbar-width

the scrollbar-width property allows the author to set the maximum thickness of an element’s scrollbars when they are shown.
...; values <scrollbar-width> defines the width of the scrollbar as a keyword.
...es: auto the default scrollbar width for the platform.

text-emphasis-position - CSS: Cascading Style Sheets

Web › CSS › text-emphasis-position

language preferred position illustration horizontal vertical japanese over right korean mongolian chinese under right note: the text-emphasis-position cannot be set, and therefore are not reset either, using the text-emphasis shorthand property.
...marks some editors prefer to hide emphasis marks when they conflict with ruby.
...ict with ruby.

text-shadow - CSS: Cascading Style Sheets

Web › CSS › text-shadow

the text-shadow css property adds shadows to text.
...values, followed optionally by a <color> value.
...value places the shadow above the text.

text-transform - CSS: Cascading Style Sheets

Web › CSS › text-transform

the text-transform css property specifies how to capitalize an element's text.
...form: capitalize; text-transform: uppercase; text-transform: lowercase; text-transform: full-width; text-transform: full-size-kana; /* global values */ text-transform: inherit; text-transform: initial; text-transform: unset; capitalize is a keyword that converts the first letter of each word to uppercase.
...ize kana, to compensate for legibility issues at the small font sizes typically used in ruby.

scale3d() - CSS: Cascading Style Sheets

Web › CSS › transform-function › scale3d

the scale3d() css function defines a transformation that resizes an element in 3d space.
...itory.
...-examples and send us a pull request.

skewX() - CSS: Cascading Style Sheets

Web › CSS › transform-function › skewX

the skewx() css function defines a transformation that skews an element in the horizontal direction on the 2d plane.
...izontal direction on the 2d plane.
...by a certain angle in the horizontal direction.

skewY() - CSS: Cascading Style Sheets

Web › CSS › transform-function › skewY

the skewy() css function defines a transformation that skews an element in the vertical direction on the 2d plane.
...ertical direction on the 2d plane.
...n) that distorts each point within an element by a certain angle in the vertical direction.

transition - CSS: Cascading Style Sheets

Web › CSS › transition

ty for transition-property, transition-duration, transition-timing-function, and transition-delay.
... transition-delay.
...e handled when lists of property values aren't the same length.

white-space - CSS: Cascading Style Sheets

Web › CSS › white-space

the white-space css property sets how white space inside an element is handled.
... normal sequences of white space are collapsed.
... collapse collapse wrap remove nowrap collapse collapse no wrap remove pre preserve preserve no wrap preserve pre-wrap preserve preserve wrap hang pre-line preserve collapse wrap remove break-spaces preserve preserve wrap wrap formal definition initial valuenormalapplies toall elementsinheritedyescomputed valueas specifiedanimation typediscrete formal syntax normal | pre | nowrap | pre-wrap | pre-line | break-spaces examples basic example code { white-space: pre; } line breaks inside <pre> elements pre { word-wrap: break-word; /* ie 5.5-7 */ white-space: pre-wrap; /* modern browsers */ } in action html <div id="css-code" class="box"> p { white-spac...

writing-mode - CSS: Cascading Style Sheets

Web › CSS › writing-mode

the writing-mode css property sets whether lines of text are laid out horizontally or vertically, as well as the direction in which blocks progress.
... the writing-mode css property sets whether lines of text are laid out horizontally or vertically, as well as the direction in which blocks progress.
...al-tb instead.

regexp:match() - EXSLT

Web › EXSLT › regexp › match

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes regexp:match() performs regular expression matching on a string, returning the submatches found as a result.
...flagsstringoptional an optional string containing character flags.
... flag isn't specified, only the submatches from the first match are returned.

Graphics on the Web - Developer guides

Web › Guide › Graphics

websites and applications often need to present graphics, such as images.
... websites and applications often need to present graphics, such as images.
...tes and applications often need to present graphics, such as images.

Printing - Developer guides

Web › Guide › Printing

to/print.css" media="print" rel="stylesheet" /> using media queries to improve layout detecting print requests some browsers (including firefox 6 and later and internet explorer) send beforeprint and afterprint events to let content determine when printing may have occurred.
...elow to open the window to print.
...t/javascript"> function closeprint () { document.body.removechild(this.__container__); } function setprint () { this.contentwindow.__container__ = this; this.contentwindow.onbeforeunload = closeprint; this.contentwindow.onafterprint = closeprint; this.contentwindow.focus(); // required for ie this.contentwindow.print(); } function printpage (surl) { var ohiddframe = document.createelement("iframe"); ohiddframe.onload = setprint; ohiddframe.style.position = "fixed"; ohiddframe.style.right = "0"; ohiddframe.style.bottom = "0"; ohiddframe.style.width = "0"; ohiddframe.style.height = "0"; ohiddframe.style.border = "0"; ohiddframe.src = surl; document.body.appendchild(ohiddframe); } </script> </head> <body> <p><span onclick="printpage('externalpage.html');" style="...

<input type="hidden"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › hidden

<input> elements of type hidden let web developers include data that cannot be seen or modified by users when a form is submitted.
...tring representing the value of the hidden data you want to pass back to the server.
...via the user interface, although you could edit the value via browser developer tools.

<input type="reset"> - HTML: Hypertext Markup Language

Web › HTML › Element › input › reset

<input> elements of type "reset" are rendered as buttons, with a default click event handler that resets all of the inputs in the form to their initial values.
...tons in your forms.
... if you don't specify a value, you get an button with the default label (typically "reset," but this will vary depending on the user agent): <input type="reset"> using reset buttons <input type="reset"> buttons are used to reset forms.

<spacer> - HTML: Hypertext Markup Language

Web › HTML › Element › spacer

<spacer> is an obsolete html element which allowed insertion of empty spaces on pages.
...ct as a single-pixel layout image, which was something web designers used to use to add white spaces to web pages without actually using an image.
...pixel layout image, which was something web designers used to use to add white spaces to web pages without actually using an image.

dropzone - HTML: Hypertext Markup Language

Web › HTML › Global attributes › dropzone

the dropzone global attribute is an enumerated attribute indicating what types of content can be dropped on an element, using the html drag and drop api.
... the dropzone global attribute is an enumerated attribute indicating what types of content can be dropped on an element, using the html drag and drop api.
... the dropzone global attribute is an enumerated attribute indicating what types of content can be dropped on an element, using the html drag and drop api.

id - HTML: Hypertext Markup Language

Web › HTML › Global attributes › id

the id global attribute defines an identifier (id) which must be unique in the whole document.
...uman-readable information (although having your ids somewhat human-readable can be useful for code comprehension, e.g.
...ommendation snapshot of html living standard, no change from html5 html5the definition of 'id' in that specification.

itemref - HTML: Hypertext Markup Language

Web › HTML › Global attributes › itemref

properties that are not descendants of an element with the itemscope attribute can be associated with an item using the global attribute itemref.
... properties that are not descendants of an element with the itemscope attribute can be associated with an item using the global attribute itemref.
... properties that are not descendants of an element with the itemscope attribute can be associated with an item using the global attribute itemref.

itemtype - HTML: Hypertext Markup Language

Web › HTML › Global attributes › itemtype

a value that is an unordered set of unique tokens which are case-sensitive, each is a valid and absolute url, and all defined to use the same vocabulary.
...ute url, and all defined to use the same vocabulary.
...ypes must all be types defined in applicable specifications (such as schema.org), and must all be defined to use the same vocabulary.

part - HTML: Hypertext Markup Language

Web › HTML › Global attributes › part

the part global attribute contains a space-separated list of the part names of the element.
... the part global attribute contains a space-separated list of the part names of the element.
... the part global attribute contains a space-separated list of the part names of the element.

style - HTML: Hypertext Markup Language

Web › HTML › Global attributes › style

the style global attribute contains css styling declarations to be applied to the element.
... the style global attribute contains css styling declarations to be applied to the element.
...n that specification.

translate - HTML: Hypertext Markup Language

Web › HTML › Global attributes › translate

the translate global attribute is an enumerated attribute that is used to specify whether an element's translateable attribute values and its text node children should be translated when the page is localized, or whether to leave them unchanged.
... the translate global attribute is an enumerated attribute that is used to specify whether an element's translateable attribute values and its text node children should be translated when the page is localized, or whether to leave them unchanged.
... attribute is an enumerated attribute that is used to specify whether an element's translateable attribute values and its text node children should be translated when the page is localized, or whether to leave them unchanged.

Using the application cache - HTML: Hypertext Markup Language

Web › HTML › Using the application cache

ts: offline browsing users can navigate a site even when they are offline.
...lication's cache manifest files as fallback entries.
...ad and execute scripts and other code from the server instead of the cache: cache manifest network: /api the cache manifest section listed above ensures that requests to load resources contained in the http://www.example.com/api/ subtree always go to the network without attempting to access the cache.

Browser detection using the user agent - HTTP

Web › HTTP › Browser detection using the user agent

niffing.
...ndow) { hastouchscreen = true; // deprecated, but good fallback } else { // only as a last resort, fall back to user agent sniffing var ua = navigator.useragent; hastouchscreen = ( /\b(blackberry|webos|iphone|iemobile)\b/i.test(ua) || /\b(android|windows phone|ipad|ipod)\b/i.test(ua) ); } } if (hastouchscreen) document.getelementbyid("examplebutton").style.padding="1em"; as for the screen size, simply use window.innerwidth and window.addeventlistener("resize", function(){ /*refresh screen size dependent things*/ }).
...screen, it saves space to have multiple columns to reduce the space wasted to the left and to the right of the pictures.

Configuring servers for Ogg media - HTTP

Web › HTTP › Configuring servers for Ogg media

html <audio> and <video> elements allow media presentation without the need for the user to install any plug-ins or other software to do so.
...ar intervals.
...rovide the preload attribute, which tells the browser to attempt to download the entire media when the page loads.

CSP: connect-src - HTTP

Web › HTTP › Headers › Content-Security-Policy › connect-src

de blob and filesystem from source directives.
...) and similar methods for creating code from strings.
... the single quotes.

CSP: default-src - HTTP

Web › HTTP › Headers › Content-Security-Policy › default-src

de blob and filesystem from source directives.
...) and similar methods for creating code from strings.
... the single quotes.

CSP: font-src - HTTP

Web › HTTP › Headers › Content-Security-Policy › font-src

e blob and filesystem from source directives.
...milar methods for creating code from strings.
...gle quotes.

CSP: img-src - HTTP

Web › HTTP › Headers › Content-Security-Policy › img-src

de blob and filesystem from source directives.
...) and similar methods for creating code from strings.
... the single quotes.

CSP: manifest-src - HTTP

Web › HTTP › Headers › Content-Security-Policy › manifest-src

e blob and filesystem from source directives.
...milar methods for creating code from strings.
...gle quotes.

CSP: prefetch-src - HTTP

Web › HTTP › Headers › Content-Security-Policy › prefetch-src

de blob and filesystem from source directives.
...) and similar methods for creating code from strings.
... the single quotes.

CSP: worker-src - HTTP

Web › HTTP › Headers › Content-Security-Policy › worker-src

e blob and filesystem from source directives.
...milar methods for creating code from strings.
...gle quotes.

Feature-Policy: autoplay - HTTP

Web › HTTP › Headers › Feature-Policy › autoplay

the http feature-policy header autoplay directive controls whether the current document is allowed to autoplay media requested through the htmlmediaelement interface.
... the http feature-policy header autoplay directive controls whether the current document is allowed to autoplay media requested through the htmlmediaelement interface.
... the http feature-policy header autoplay directive controls whether the current document is allowed to autoplay media requested through the htmlmediaelement interface.

X-DNS-Prefetch-Control - HTTP

Web › HTTP › Headers › X-DNS-Prefetch-Control

e.
...side, or from individual documents, using the http-equiv attribute on the <meta> element, like this: <meta http-equiv="x-dns-prefetch-control" content="off"> you can reverse this setting by setting content to "on".
...forcing lookup of specific hostnames you can force the lookup of specific hostnames without providing specific anchors using that hostname by using the rel attribute on the <link> element with a link type of dns-prefetch: <link rel="dns-prefetch" href="https://www.mozilla.org/contribute/"> in this example, the domain name "www.mozilla.org/contribute" will be pre-resolved.

An overview of HTTP - HTTP

Web › HTTP › Overview

ttp message is sent in this version of http, the semantics of each message is unchanged and the client reconstitutes (virtually) the original http/1.1 request.
...sts of the following elements: an http method, usually a verb like get, post or a noun like options or head that defines the operation the client wants to perform.
...ext, for example without the protocol (http://), the domain (here, developer.mozilla.org), or the tcp port (here, 80).

A re-introduction to JavaScript (JS tutorial) - JavaScript

Web › JavaScript › A re-introduction to JavaScript

count, you can iterate over an array using the following for loop: for (var i = 0; i < a.length; i++) { // do something with a[i] } es2015 introduced the more concise for...of loop for iterable objects such as arrays: for (const currentvalue of a) { // do something with currentvalue } you could also iterate over an array using a for...in loop, however this does not iterate over the array elements, but the array indices.
...cat', 'hen'].foreach(function(currentvalue, index, array) { // do something with currentvalue or array[index] }); if you want to append an item to an array simply do it like this: a.push(item); arrays come with a number of methods.
... }); if you want to append an item to an array simply do it like this: a.push(item); arrays come with a number of methods.

Rest parameters - JavaScript

Web › JavaScript › Reference › Functions › rest parameters

ame function definition from example above myfun("one", "two", "three") // a, one // b, two // manymoreargs, [three] below, the third argument isn't provided, but manymoreargs is still an array (albeit an empty one).
...eargs) { console.log(theargs.length) } fun1() // 0 fun1(5) // 1 fun1(5, 6, 7) // 3 ordinary parameter and rest parameters in the next example, a rest parameter is used to collect all parameters after the first into an array.
...) } fun1() // 0 fun1(5) // 1 fun1(5, 6, 7) // 3 ordinary parameter and rest parameters in the next example, a rest parameter is used to collect all parameters after the first into an array.

Array.prototype.entries() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › entries

ject that contains the key/value pairs for each index in the array.
... the array.
... example is stored in a github repository.

Array.prototype.includes() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › includes

ctive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
... to search for.
... value valuetofind is found within the array (or the part of the array indicated by the index fromindex, if specified).

Array.prototype.toString() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › toString

the tostring() method returns a string representing the specified array and its elements.
... the tostring() method returns a string representing the specified array and its elements.
... the tostring() method returns a string representing the specified array and its elements.

BigInt64Array() constructor - JavaScript

Web › JavaScript › Reference › Global Objects › BigInt64Array › BigInt64Array

the bigint64array() typed array constructor creates a new bigint64array object, which is, an array of 64-bit signed integers in the platform byte order.
...'s methods, or by using standard array index syntax (that is, using bracket notation).
...fy the memory range that will be exposed by the typed array view.

BigUint64Array() constructor - JavaScript

Web › JavaScript › Reference › Global Objects › BigUint64Array › BigUint64Array

the biguint64array() typed array constructor creates a new biguint64array object, which is, an array of 64-bit unsigned integers in the platform byte order.
...thods, or by using standard array index syntax (that is, using bracket notation).
...memory range that will be exposed by the typed array view.

Float32Array() constructor - JavaScript

Web › JavaScript › Reference › Global Objects › Float32Array › Float32Array

the float32array() typed array constructor creates a new float32array object, which is, an array of 32-bit floating point numbers (corresponding to the c float data type) in the platform byte order.
...s, or using standard array index syntax (that is, using bracket notation).
...ers specify the memory range that will be exposed by the typed array view.

Float64Array() constructor - JavaScript

Web › JavaScript › Reference › Global Objects › Float64Array › Float64Array

the float64array() typed array constructor creates a new float64array object, which is, an array of 64-bit floating point numbers (corresponding to the c double data type) in the platform byte order.
...s, or using standard array index syntax (that is, using bracket notation).
...ers specify the memory range that will be exposed by the typed array view.

Int16Array() constructor - JavaScript

Web › JavaScript › Reference › Global Objects › Int16Array › Int16Array

the int16array() typed array constructor creates an array of twos-complement 16-bit signed integers in the platform byte order.
...t's methods, or using standard array index syntax (that is, using bracket notation).
...ngth parameters specify the memory range that will be exposed by the typed array view.

Int32Array() constructor - JavaScript

Web › JavaScript › Reference › Global Objects › Int32Array › Int32Array

the int32array() typed array constructor creates an array of twos-complement 32-bit signed integers in the platform byte order.
...t's methods, or using standard array index syntax (that is, using bracket notation).
...ngth parameters specify the memory range that will be exposed by the typed array view.

Int8Array() constructor - JavaScript

Web › JavaScript › Reference › Global Objects › Int8Array › Int8Array

the int8array() constructor creates a typed array of twos-complement 8-bit signed integers.
...object's methods, or using standard array index syntax (that is, using bracket notation).
... and length parameters specify the memory range that will be exposed by the typed array view.

Map.prototype.get() - JavaScript

Web › JavaScript › Reference › Global Objects › Map › get

the get() method returns a specified element from a map object.
... a reference to that object and any change made to that object will effectively modify it inside the map object.
...ect will effectively modify it inside the map object.

Map.prototype.has() - JavaScript

Web › JavaScript › Reference › Global Objects › Map › has

the has() method returns a boolean indicating whether an element with the specified key exists or not.
... the has() method returns a boolean indicating whether an element with the specified key exists or not.
... with the specified key exists or not.

Object.fromEntries() - JavaScript

Web › JavaScript › Reference › Global Objects › Object › fromEntries

the iterable protocol.
...a new object whose properties are given by the entries of the iterable.
...description the object.fromentries() method takes a list of key-value pairs and returns a new object whose properties are given by those entries.

Proxy - JavaScript

Web › JavaScript › Reference › Global Objects › Proxy

using a native javascript object to which our proxy will forward all operations that are applied to it.
...; } var person = function(name) { this.name = name; }; var boy = extend(person, function(name, age) { this.age = age; }); boy.prototype.gender = 'm'; var peter = new boy('peter', 13); console.log(peter.gender); // "m" console.log(peter.name); // "peter" console.log(peter.age); // 13 manipulating dom nodes sometimes you want to toggle the attribute or class name of two different elements.
...ewval) { let oldval = obj[prop]; if (prop === 'selected') { if (oldval) { oldval.setattribute('aria-selected', 'false'); } if (newval) { newval.setattribute('aria-selected', 'true'); } } // the default behavior to store the value obj[prop] = newval; // indicate success return true; } }); let i1 = view.selected = document.getelementbyid('item-1'); //giving error here, i1 is null console.log(i1.getattribute('aria-selected')); // 'true' let i2 = view.selected = document.getelementbyid('item-2'); console.log(i1.getattribute('aria-selected')); // 'false' console.log(i2.getattribute('aria-selected')); // 'true' note: even if selected: !null, then giving oldval.setattribute is not a function value correction and an extra p...

Set.prototype.delete() - JavaScript

Web › JavaScript › Reference › Global Objects › Set › delete

the delete() method removes the specified element from a set object.
...project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...alue the value to remove from myset.

Set.prototype.has() - JavaScript

Web › JavaScript › Reference › Global Objects › Set › has

the has() method returns a boolean indicating whether an element with the specified value exists in a set object or not.
...d value exists in a set object or not.
...ect, please clone https://github.com/mdn/interactive-examples and send us a pull request.

Set.prototype.values() - JavaScript

Web › JavaScript › Reference › Global Objects › Set › values

the values() method returns a new iterator object that contains the values for each element in the set object in insertion order.
... the values() method returns a new iterator object that contains the values for each element in the set object in insertion order.
... map objects); it behaves exactly the same and returns values of set elements.

String.prototype.blink() - JavaScript

Web › JavaScript › Reference › Global Objects › String › blink

the blink() method creates a <blink> html element that causes a string to blink.
... the blink() method creates a <blink> html element that causes a string to blink.
... the blink() method creates a <blink> html element that causes a string to blink.

TypedArray.prototype.toString() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › toString

the tostring() method returns a string representing the specified array and its elements.
...s the same algorithm as array.prototype.tostring().
...nteractive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

Uint16Array() constructor - JavaScript

Web › JavaScript › Reference › Global Objects › Uint16Array › Uint16Array

ructor creates an array of 16-bit unsigned integers in the platform byte order.
...osed by the typed array view.
...ill throw a typeerror from now on.

Uint32Array() constructor - JavaScript

Web › JavaScript › Reference › Global Objects › Uint32Array › Uint32Array

the uint32array() typed array constructor creates an array of 32-bit unsigned integers in the platform byte order.
...ethods, or using standard array index syntax (that is, using bracket notation).
...arameters specify the memory range that will be exposed by the typed array view.

Uint8Array() constructor - JavaScript

Web › JavaScript › Reference › Global Objects › Uint8Array › Uint8Array

the uint8array() constructor creates a typed array of 8-bit unsigned integers.
...t's methods, or using standard array index syntax (that is, using bracket notation).
...ength parameters specify the memory range that will be exposed by the typed array view.

Uint8ClampedArray() constructor - JavaScript

Web › JavaScript › Reference › Global Objects › Uint8ClampedArray › Uint8ClampedArray

the uint8clampedarray() constructor creates a typed array of 8-bit unsigned integers clamped to 0-255; if you specified a value that is out of the range of [0,255], 0 or 255 will be set instead; if you specify a non-integer, the nearest integer will be set.
...y index syntax (that is, using bracket notation).
...ray view.

WeakMap.prototype.delete() - JavaScript

Web › JavaScript › Reference › Global Objects › WeakMap › delete

the delete() method removes the specified element from a weakmap object.
... the delete() method removes the specified element from a weakmap object.
...e specified element from a weakmap object.

WeakMap.prototype.get() - JavaScript

Web › JavaScript › Reference › Global Objects › WeakMap › get

the get() method returns a specified element from a weakmap object.
... the get() method returns a specified element from a weakmap object.
...a specified element from a weakmap object.

WeakMap.prototype.has() - JavaScript

Web › JavaScript › Reference › Global Objects › WeakMap › has

the has() method returns a boolean indicating whether an element with the specified key exists in the weakmap object or not.
...turns a boolean indicating whether an element with the specified key exists in the weakmap object or not.
...or not.

WeakRef() constructor - JavaScript

Web › JavaScript › Reference › Global Objects › WeakRef › WeakRef

the weakref constructor creates a weakref object referring to a given target object.
...e weakref constructor creates a weakref object referring to a given target object.
...kref object referring to a given target object.

WebAssembly.Table.prototype.grow() - JavaScript

Web › JavaScript › Reference › Global Objects › WebAssembly › Table › grow

the grow() prototype method of the webassembly.table object increases the size of the table instance by a specified number of elements.
... the grow() prototype method of the webassembly.table object increases the size of the table instance by a specified number of elements.
...number); parameters number the number of elements you want to grow the table by.

Comma operator (,) - JavaScript

Web › JavaScript › Reference › Operators › Comma Operator

sion.
...on usage of this operator is to supply multiple parameters in a for loop.
...nsole (i.e., 4).

Logical OR assignment (||=) - JavaScript

Web › JavaScript › Reference › Operators › Logical OR assignment

as well, meaning it only performs an assignment if the logical operation would evaluate the right-hand side.
...ion would evaluate the right-hand side.
...t to the following which would always perform an assignment: x = x || y; note that this behavior is different to mathematical and bitwise assignment operators.

for - JavaScript

Web › JavaScript › Reference › Statements › for

nt.
...ement section, a semicolon is used instead.
...id); /* initialization */ oitnode; /* condition */ nleft += oitnode.offsetleft, ntop += oitnode.offsettop, oitnode = oitnode.offsetparent /* final-expression */ ); /* semicolon */ console.log('offset position of \'' + sid + '\' element:\n left: ' + nleft + 'px;\n top: ' + ntop + 'px;'); } /* example call: */ showoffsetpos('content'); // output: // "offset position of "content" element: // left: 0px; // top: 153px;" note: this is one of the few cases in javascript where the semicolon is mandatory.

<mrow> - MathML

Web › MathML › Element › mrow

the mathml <mrow> element is used to group sub-expressions, which usually contain one or more operators with their respective operands (such as <mi> and <mn>).
... the mathml <mrow> element is used to group sub-expressions, which usually contain one or more operators with their respective operands (such as <mi> and <mn>).
... the mathml <mrow> element is used to group sub-expressions, which usually contain one or more operators with their respective operands (such as <mi> and <mn>).

<ms> - MathML

Web › MathML › Element › ms

the mathml <ms> element represents a string literal meant to be interpreted by programming languages and computer algebra systems.
...> element represents a string literal meant to be interpreted by programming languages and computer algebra systems.
...ra systems.

<munder> - MathML

Web › MathML › Element › munder

the mathml <munder> element is used to attach an accent or a limit under an expression.
... the mathml <munder> element is used to attach an accent or a limit under an expression.
... the mathml <munder> element is used to attach an accent or a limit under an expression.

MathML

Web › MathML

mathematical markup language (mathml) is a dialect of xml for describing mathematical notation and capturing both its structure and content.
... markup language (mathml) is a dialect of xml for describing mathematical notation and capturing both its structure and content.
...s, and tools to help you work with this powerful technology.

The "codecs" parameter in common media types - Web media technologies

Web › Media › Formats › codecs parameter

.10.01.09.16.09.01,opus" vp9 video, profile 2 level 1.0, with 10-bit yuv content using 4:2:0 chroma subsampling, bt.2020 primaries, st 2084 eotf (hdr smpte), bt.2020 non-constant luminance color matrix, and full-range chroma and luma encoding.
... 2 level 1.0, with 10-bit yuv content using 4:2:0 chroma subsampling, bt.2020 primaries, st 2084 eotf (hdr smpte), bt.2020 non-constant luminance color matrix, and full-range chroma and luma encoding.
...r matrix, and full-range chroma and luma encoding.

Using dns-prefetch - Web Performance

Web › Performance › dns-prefetch

to an ip address before the browser can issue the request.
...helps developers mask dns resolution latency.
...ns-prefetch.

Web Performance

Web › Performance

important issue when building web apps: starting up as asynchronously as possible.
...tion specific timestamps using the user timing api's "mark" and "measure" entry types - that are part of the browser's performance timeline.
...at are part of the browser's performance timeline.

Privacy, permissions, and information security

Web › Privacy

nsport layer security (tls); formerly known as secure sockets layer (ssl) tls provides security and privacy by encrypting data during transport over the network.
...ithin code; notably, the permissions api, feature policy, and the allow attribute on <iframe> elements are primary tools directly used by code to help secure a site and its content.
...low attribute on <iframe> elements are primary tools directly used by code to help secure a site and its content.

Progressive web app structure - Progressive web apps (PWAs)

Web › Progressive web apps › App structure

ly different approach to server- or client-side rendering can be achieved with the streams api.
...the app's only job is to list all the a-frame entries from the js13kgames 2017 competition.
...ar entry = template.replace(/pos/g,(i+1)) .replace(/slug/g,games[i].slug) .replace(/name/g,games[i].name) .replace(/author/g,games[i].author) .replace(/twitter/g,games[i].twitter) .replace(/website/g,games[i].website) .replace(/github/g,games[i].github); entry = entry.replace('<a href=\'http:///\'></a>','-'); content += entry; }; document.getelementbyid('content').innerhtml = content; next, it registers a service worker: if('serviceworker' in navigator) { navigator.serviceworker.register('/pwa-examples/js13kpwa/sw.js'); }; the next code block requests permission for notifications when a button is clicked: var button = document.getelementbyid("notifications"); button.addeventlistener('click', function(e) { notification.requestperm...

Progressive loading - Progressive web apps (PWAs)

Web › Progressive web apps › Loading

ll in a single file with no specific rules as to how to load them.
...e.
... load the images using the more basic approach covered earlier.

Graphic design for responsive sites - Progressive web apps (PWAs)

Web › Progressive web apps › Responsive › Graphics for responsive sites

ia queries to serve the hi res images only to hi res devices.
...technologies, although its complexity is a barrier for non-developers.
...create text, do compositing operations, and much more.

Web API reference - Web technology reference

Web › Reference › API

the web offers a wide variety of apis to perform various useful tasks.
...ow or element, to generating intricate graphical and audio effects using apis such as webgl and web audio.
...apis such as webgl and web audio.

Web technology reference

Web › Reference

sider starting with our learning area, which is filled with step-by-step tutorials that will guide you from total webdev newbie to at least semi-pro!
...kup language is used to define and describe semantically the content (markup) of a web page in a well-structured format.
...made up of blocks called html elements that are delineated by tags, written using angle brackets.

SVG Styling Attributes - SVG: Scalable Vector Graphics

Web › SVG › Attribute › Styling

the svg styling attributes are all the attributes that can be specified on any svg element to apply css styling effects.
... the svg styling attributes are all the attributes that can be specified on any svg element to apply css styling effects.
... the svg styling attributes are all the attributes that can be specified on any svg element to apply css styling effects.

attributeName - SVG: Scalable Vector Graphics

Web › SVG › Attribute › attributeName

the attributename attribute indicates the name of the css property or attribute of the target element that is going to be changed during an animation.
... the attributename attribute indicates the name of the css property or attribute of the target element that is going to be changed during an animation.
..."http://www.w3.org/2000/svg"> <rect x="50" y="50" width="100" height="100"> <animate attributetype="xml" attributename="y" from="0" to="50" dur="5s" repeatcount="indefinite"/> </rect> </svg> usage notes value <name> default value none animatable no <name> this value indicates the name of the css property or attribute of the target element to be animated.

color-profile - SVG: Scalable Vector Graphics

Web › SVG › Attribute › color-profile

the color-profile attribute is used to define which color profile a raster image included through the <image> element should use.
... the color-profile attribute is used to define which color profile a raster image included through the <image> element should use.
... the color-profile attribute is used to define which color profile a raster image included through the <image> element should use.

color - SVG: Scalable Vector Graphics

Web › SVG › Attribute › color

the color attribute is used to provide a potential indirect value, currentcolor, for the fill, stroke, stop-color, flood-color, and lighting-color attributes.
... the color attribute is used to provide a potential indirect value, currentcolor, for the fill, stroke, stop-color, flood-color, and lighting-color attributes.
... <g color="green"> <rect width="50" height="50" fill="currentcolor" /> <circle r="25" cx="70" cy="70" stroke="currentcolor" fill="none" stroke-width="5" /> </g> </svg> specifications specification status comment scalable vector graphics (svg) 2the definition of 'color' in that specification.

font-size-adjust - SVG: Scalable Vector Graphics

Web › SVG › Attribute › font-size-adjust

« svg attribute reference home the font-size-adjust attribute allows authors to specify an aspect value for an element that will preserve the x-height of the first choice font in a substitute font.
... « svg attribute reference home the font-size-adjust attribute allows authors to specify an aspect value for an element that will preserve the x-height of the first choice font in a substitute font.
... attribute allows authors to specify an aspect value for an element that will preserve the x-height of the first choice font in a substitute font.

horiz-adv-x - SVG: Scalable Vector Graphics

Web › SVG › Attribute › horiz-adv-x

the horiz-adv-x attribute indicates the horizontal advance after rendering a glyph in horizontal orientation.
... the horiz-adv-x attribute indicates the horizontal advance after rendering a glyph in horizontal orientation.
...are using this attribute: <font>, <glyph>, and <missing-glyph> font for <font> elements, horiz-adv-x specifies the default horizontal advance of a glyph in horizontal orientation.

id - SVG: Scalable Vector Graphics

Web › SVG › Attribute › id

the id attribute assigns a unique name to an element.
... the id attribute assigns a unique name to an element.
..."120" viewbox="0 0 120 120" xmlns="http://www.w3.org/2000/svg"> <style type="text/css"> <![cdata[ #smallrect { stroke: #000066; fill: #00cc00; } ]]> </style> <rect id="smallrect" x="10" y="10" width="100" height="100" /> </svg> usage notes value <id> default value none animatable no <id> specifies the element's id.

marker-mid - SVG: Scalable Vector Graphics

Web › SVG › Attribute › marker-mid

the marker-mid attribute defines the arrowhead or polymarker that will be drawn at all interior vertices of the given shape.
...r-mid attribute defines the arrowhead or polymarker that will be drawn at all interior vertices of the given shape.
...f00"/> </marker> </defs> <polyline fill="none" stroke="black" points="20,100 40,60 70,80 100,20" marker-mid="url(#circle)"/> </svg> usage notes value none | <marker-ref> default value none animatable yes none indicates that no marker symbol shall be drawn at the given vertices.

markerUnits - SVG: Scalable Vector Graphics

Web › SVG › Attribute › markerUnits

the markerunits attribute defines the coordinate system for the markerwidth and markerunits attributes and the contents of the <marker>.
... value userspaceonuse | strokewidth default value strokewidth animatable yes userspaceonuse this value specifies that the markerwidth and markerunits attributes and the contents of the <marker> element represent values in the current user coordinate system in place for the graphic object referencing the marker (i.e., the user coordinate system for the element referencing the <marker> element via a marker, marker-start, marker-mid, or marker-end property).
...s of the <marker> element represent values in the current user coordinate system in place for the graphic object referencing the marker (i.e., the user coordinate system for the element referencing the <marker> element via a marker, marker-start, marker-mid, or marker-end property).

opacity - SVG: Scalable Vector Graphics

Web › SVG › Attribute › opacity

the opacity attribute specifies the transparency of an object or of a group of objects, that is, the degree to which the background behind the element is overlaid.
... the opacity attribute specifies the transparency of an object or of a group of objects, that is, the degree to which the background behind the element is overlaid.
... the opacity attribute specifies the transparency of an object or of a group of objects, that is, the degree to which the background behind the element is overlaid.

paint-order - SVG: Scalable Vector Graphics

Web › SVG › Attribute › paint-order

the paint-order attribute specifies the order that the fill, stroke, and markers of a given shape or text element are painted.
... the paint-order attribute specifies the order that the fill, stroke, and markers of a given shape or text element are painted.
... the paint-order attribute specifies the order that the fill, stroke, and markers of a given shape or text element are painted.

string - SVG: Scalable Vector Graphics

Web › SVG › Attribute › string

the string attribute is a hint to the user agent, and specifies a list of formats that the font referenced by the parent <font-face-uri> element supports.
... the string attribute is a hint to the user agent, and specifies a list of formats that the font referenced by the parent <font-face-uri> element supports.
...nd specifies a list of formats that the font referenced by the parent <font-face-uri> element supports.

tabindex - SVG: Scalable Vector Graphics

Web › SVG › Attribute › tabindex

the tabindex attribute allows you to control whether an element is focusable and to define the relative order of the element for the purposes of sequential focus navigation.
... the tabindex attribute allows you to control whether an element is focusable and to define the relative order of the element for the purposes of sequential focus navigation.
...ns="http://www.w3.org/2000/svg"> <circle cx="60" cy="60" r="15" tabindex="1" /> <circle cx="60" cy="160" r="30" tabindex="3" /> <circle cx="160" cy="60" r="30" tabindex="2" /> <circle cx="160" cy="160" r="60" tabindex="4" /> </svg> usage notes value valid integer default value none animatable no valid integer relative order of the element for the purposes of sequential focus navigation.

to - SVG: Scalable Vector Graphics

Web › SVG › Attribute › to

the to attribute indicates the final value of the attribute that will be modified during the animation.
...imatecolor>, <animatemotion>, and <animatetransform>, to specifies the ending value of the animation.
... value of the animation.

transform - SVG: Scalable Vector Graphics

Web › SVG › Attribute › transform

the transform attribute defines a list of transform definitions that are applied to an element and the element's children.
..." fill="none" stroke="red"/> </svg> note: as of svg2, transform is a presentation attribute, meaning it can be used as a css property.
... note: as of svg2, transform is a presentation attribute, meaning it can be used as a css property.

values - SVG: Scalable Vector Graphics

Web › SVG › Attribute › values

the values attribute has different meanings, depending upon the context where itʼs used, either it defines a sequence of values used over the course of an animation, or itʼs a list of numbers for a color matrix, which is interpreted differently depending on the type of color change to be performed.
...s attribute: <animate>, <animatecolor>, <animatemotion>, <animatetransform>, and <fecolormatrix> animate, animatecolor, animatemotion, animatetransform for <animate>, <animatecolor>, <animatemotion>, and <animatetransform>, values is a list of values defining the sequence of values over the course of the animation.
...is attribute is specified, any from, to, and by attribute values set on the element are ignored.

vert-adv-y - SVG: Scalable Vector Graphics

Web › SVG › Attribute › vert-adv-y

the vert-adv-y attribute indicates the vertical advance after rendering a glyph in vertical orientation.
... the vert-adv-y attribute indicates the vertical advance after rendering a glyph in vertical orientation.
... and <missing-glyph> font for <font> elements, vert-adv-y specifies the default vertical advance for a glyph in vertical orientation.

x1 - SVG: Scalable Vector Graphics

Web › SVG › Attribute › x1

the x1 attribute is used to specify the first x-coordinate for drawing an svg element that requires more than one coordinate.
... the x1 attribute is used to specify the first x-coordinate for drawing an svg element that requires more than one coordinate.
... the x1 attribute is used to specify the first x-coordinate for drawing an svg element that requires more than one coordinate.

x2 - SVG: Scalable Vector Graphics

Web › SVG › Attribute › x2

the x2 attribute is used to specify the second x-coordinate for drawing an svg element that requires more than one coordinate.
... the x2 attribute is used to specify the second x-coordinate for drawing an svg element that requires more than one coordinate.
... the x2 attribute is used to specify the second x-coordinate for drawing an svg element that requires more than one coordinate.

y1 - SVG: Scalable Vector Graphics

Web › SVG › Attribute › y1

the y1 attribute is used to specify the first y-coordinate for drawing an svg element that requires more than one coordinate.
... the y1 attribute is used to specify the first y-coordinate for drawing an svg element that requires more than one coordinate.
... the y1 attribute is used to specify the first y-coordinate for drawing an svg element that requires more than one coordinate.

y2 - SVG: Scalable Vector Graphics

Web › SVG › Attribute › y2

the y2 attribute is used to specify the second y-coordinate for drawing an svg element that requires more than one coordinate.
... the y2 attribute is used to specify the second y-coordinate for drawing an svg element that requires more than one coordinate.
... the y2 attribute is used to specify the second y-coordinate for drawing an svg element that requires more than one coordinate.

<circle> - SVG: Scalable Vector Graphics

Web › SVG › Element › circle

the <circle> svg element is an svg basic shape, used to draw circles based on a center point and a radius.
....
...a-level, aria-live, aria-modal, aria-multiline, aria-multiselectable, aria-orientation, aria-owns, aria-placeholder, aria-posinset, aria-pressed, aria-readonly, aria-relevant, aria-required, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesbasic shape element, graphics element, shape elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements specifications specification status comment scalable vector graphics (svg) 2the definition of '<circle>' in that specification.

<ellipse> - SVG: Scalable Vector Graphics

Web › SVG › Element › ellipse

the <ellipse> element is an svg basic shape, used to create ellipses based on a center coordinate, and both their x and y radius.
...us of the ellipse on the y axis.
...a-level, aria-live, aria-modal, aria-multiline, aria-multiselectable, aria-orientation, aria-owns, aria-placeholder, aria-posinset, aria-pressed, aria-readonly, aria-relevant, aria-required, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesbasic shape element, graphics element, shape elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements specifications specification status comment scalable vector graphics (svg) 2the definition of '<ellipse>' in that specification.

<feDropShadow> - SVG: Scalable Vector Graphics

Web › SVG › Element › feDropShadow

the svg <fedropshadow> filter primitive creates a drop shadow of the input image.
...ribute defines the standard deviation for the blur operation in the drop shadow.
...peration in the drop shadow.

<font-face-name> - SVG: Scalable Vector Graphics

Web › SVG › Element › font-face-name

the <font-face-name> element points to a locally installed copy of this font, identified by its name.
... the <font-face-name> element points to a locally installed copy of this font, identified by its name.
... the <font-face-name> element points to a locally installed copy of this font, identified by its name.

<path> - SVG: Scalable Vector Graphics

Web › SVG › Element › path

the <path> svg element is the generic element to define a shape.
... the <path> svg element is the generic element to define a shape.
...aria-level, aria-live, aria-modal, aria-multiline, aria-multiselectable, aria-orientation, aria-owns, aria-placeholder, aria-posinset, aria-pressed, aria-readonly, aria-relevant, aria-required, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesgraphics element, shape elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements specifications specification status comment svg pathsthe definition of '<path>' in that specification.

<polygon> - SVG: Scalable Vector Graphics

Web › SVG › Element › polygon

the <polygon> element defines a closed shape consisting of a set of connected straight line segments.
... the <polygon> element defines a closed shape consisting of a set of connected straight line segments.
...a-level, aria-live, aria-modal, aria-multiline, aria-multiselectable, aria-orientation, aria-owns, aria-placeholder, aria-posinset, aria-pressed, aria-readonly, aria-relevant, aria-required, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesbasic shape element, graphics element, shape elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements specifications specification status comment scalable vector graphics (svg) 2the definition of '<polygon>' in that specification.

<polyline> - SVG: Scalable Vector Graphics

Web › SVG › Element › polyline

the <polyline> svg element is an svg basic shape that creates straight lines connecting several points.
... the <polyline> svg element is an svg basic shape that creates straight lines connecting several points.
...a-level, aria-live, aria-modal, aria-multiline, aria-multiselectable, aria-orientation, aria-owns, aria-placeholder, aria-posinset, aria-pressed, aria-readonly, aria-relevant, aria-required, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesbasic shape element, graphics element, shape elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements specifications specification status comment scalable vector graphics (svg) 2the definition of '<polyline>' in that specification.

<rect> - SVG: Scalable Vector Graphics

Web › SVG › Element › rect

the <rect> element is a basic svg shape that draws rectangles, defined by their position, width, and height.
...ults to rx if it is specified.
...a-level, aria-live, aria-modal, aria-multiline, aria-multiselectable, aria-orientation, aria-owns, aria-placeholder, aria-posinset, aria-pressed, aria-readonly, aria-relevant, aria-required, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesbasic shape element, graphics element, shape elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements specifications specification status comment scalable vector graphics (svg) 2the definition of '<rect>' in that specification.

<set> - SVG: Scalable Vector Graphics

Web › SVG › Element › set

the svg <set> element provides a simple means of just setting the value of an attribute for a specified duration.
... the svg <set> element provides a simple means of just setting the value of an attribute for a specified duration.
...atable: no animation attributes animation timing attributes begin, dur, end, min, max, restart, repeatcount, repeatdur, fill other animation attributes most notably: attributename animation event attributes most notably: onbegin, onend, onrepeat global attributes core attributes most notably: id styling attributes class, style event attributes global event attributes, document element event attributes usage notes categoriesanimation elementpermitted contentany number of the following elements, in any order:descriptive elements specifications specification status comment svg animations level 2the definition of '<set>' in that specification.

<solidcolor> - SVG: Scalable Vector Graphics

Web › SVG › Element › solidColor

the <solidcolor> svg element lets authors define a single color for use in multiple places in an svg document.
..., and not yet implemented in browsers.
...s.

<textPath> - SVG: Scalable Vector Graphics

Web › SVG › Element › textPath

to render text along the shape of a <path>, enclose the text in a <textpath> element that has an href attribute with a reference to the <path> element.
... to render text along the shape of a <path>, enclose the text in a <textpath> element that has an href attribute with a reference to the <path> element.
...aria-multiline, aria-multiselectable, aria-orientation, aria-owns, aria-placeholder, aria-posinset, aria-pressed, aria-readonly, aria-relevant, aria-required, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role xlink attributes xlink:title usage notes categoriestext content element, text content child elementpermitted contentcharacter data and any number of the following elements, in any order:descriptive elements<a>, <altglyph>, <animate>, <animatecolor>, <set>, <tref>, <tspan> specifications specification status comment scalable vector graphics (svg) 2the definition of '<textpath>' in that specification.

<view> - SVG: Scalable Vector Graphics

Web › SVG › Element › view

a view is a defined way to view the image, like a zoom level or a detail view.
... a view is a defined way to view the image, like a zoom level or a detail view.
..."0 0 600 200"/> <view id="doublesizeview" viewbox="0 0 300 100"/> <a xlink:href="#halfsizeview"> <text x="5" y="20" font-size="20">half size</text> </a> <a xlink:href="#normalsizeview"> <text x="5" y="40" font-size="20">normal size</text> </a> <a xlink:href="#doublesizeview"> <text x="5" y="60" font-size="20">double size</text> </a> </svg> result dom interface this element implements the svgviewelement interface.

Filter effects - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › Filter effects

ieve a certain effect.
...chieved with the help of gradients, the blur filter is needed to do anything beyond.
...e in="specout" in2="sourcealpha" operator="in" result="specout"/> <fecomposite in="sourcegraphic" in2="specout" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" result="litpaint"/>  <femerge> <femergenode in="offsetblur"/> <femergenode in="litpaint"/> </femerge> </filter> </defs>  <g filter="url(#myfilter)"> <path fill="none" stroke="#d90000" stroke-width="10" d="m50,66 c-50,0 -50,-60 0,-60 h100 c50,0 50,60 0,60z" /> <path fill="#d90000" d="m60,56 c-30,0 -30,-40 0,-40 h80 c30,0 30,40 0,40z" /> <g fill="#ffffff" stroke="black" font-size="45" font-family="verdana" > <text x="52" y="52">svg</text> </g> </g> </sv...

How to turn off form autocompletion - Web security

Web › Security › Securing your site › Turning off form autocompletion

ally identified.
...owser from caching form data in the session history.
...sion 11).

XML Index - XML: Extensible Markup Language

Web › XML › Index

ml is a markup language similar to html.
...nguage and is a w3c recommended specification as a general purpose markup language.
...tion as a general purpose markup language.

not - XPath

Web › XPath › Functions › not

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the not function evaluates a boolean expression and returns the opposite value.
... syntax not(expression ) arguments expression the expression is evaluated exactly as if it were passed as an argument to the boolean() function.
... the boolean() function.

<xsl:choose> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › choose

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:choose> element defines a choice among a number of alternatives.
... alternatives.
...n procedural languages.

<xsl:for-each> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › for-each

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:for-each> element selects a set of nodes and processes each of them in the same way.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:for-each> element selects a set of nodes and processes each of them in the same way.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:for-each> element selects a set of nodes and processes each of them in the same way.

<xsl:namespace-alias> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › namespace-alias

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:namespace-alias> element is a rarely used device that maps a namespace in the stylesheet to a different namespace in the output tree.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:namespace-alias> element is a rarely used device that maps a namespace in the stylesheet to a different namespace in the output tree.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:namespace-alias> element is a rarely used device that maps a namespace in the stylesheet to a different namespace in the output tree.

<xsl:variable> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › variable

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:variable> element declares a global or local variable in a stylesheet and gives it a value.
...it a value.
...same until the variable goes out of scope syntax <xsl:variable name=name select=expression > template </xsl:variable> required attributes name gives the variable a name.

<xsl:when> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › when

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:when> element always appears within an <xsl:choose> element, acting like a case statement.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:when> element always appears within an <xsl:choose> element, acting like a case statement.
...sl:when> element always appears within an <xsl:choose> element, acting like a case statement.

<xsl:with-param> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › with-param

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:with-param> element sets the value of a parameter to be passed into a template.
...ce: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:with-param> element sets the value of a parameter to be passed into a template.
....

PI Parameters - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › PI Parameters

and xslt-param-namespace pis are parsed using the rules defined in xml-stylesheet.
... the pi is ignored.
...amespace and xslt-param pis.

Advanced Example - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › XSLT JS interface in Gecko › Advanced Example

.getparameter() method, the code can figure whether to sort in ascending or descending order.
...sponsexml; xsltprocessor.importstylesheet(xslref); xslloaded = true; } // create a new xml document in memory xmlref = document.implementation.createdocument("", "", null); // we want to move a part of the dom from an html document to an xml document.
...n the xsl file var sortval = xsltprocessor.getparameter(null, "myorder"); if (sortval == "" || sortval == "descending") xsltprocessor.setparameter(null, "myorder", "ascending"); else xsltprocessor.setparameter(null, "myorder", "descending"); // initiate the transformation var fragment = xsltprocessor.transformtofragment(xmlref, document); // clear the contents document.getelementbyid("example").innerhtml = ""; mydom = fragment; // add the new content from the transformation document.getelementbyid("example").appendchild(fragment) } // xsl stylesheet: <?xml version="1.0" encoding="utf-8"?> <xsl:stylesheet version="1.0" xmlns="http://www.w3.org/1999/xhtml" xmlns:html="http://www.w3.org/1999/xhtml" xmlns:xsl="http://www.w3.org/1999/xsl/transform"> <xsl:output meth...

Compiling an Existing C Module to WebAssembly - WebAssembly

WebAssembly › existing C to wasm

tes in rgb, rgba, bgr or bgra.
...can't grow the memory enough to accommodate both the input and the output image: luckily, the solution to this problem is in the error message.
...or message.

2015 MDN Fellowship Program - Archive of obsolete content

Archive › 2015 MDN Fellowship Program

opment, caching and network layers preferred.
...d.

Cross-domain Content Scripts - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Guides › Content Scripts › Cross Domain Content Scripts

me whose content is served from "http://en.m.wikipedia.org/": <!doctype html>  <html> <head></head> <body> <iframe id="wikipedia" src="http://en.m.wikipedia.org/"></iframe> </body> </html> the "page-script.js" file locates "today's featured article" and sends its content to "main.js": // page-script.js var iframe = window.document.getelementbyid("wikipedia"); var todaysfeaturedarticle = iframe.contentwindow.document.getelementbyid("mp-tfa"); self.postmessage(todaysfeaturedarticle.textcontent); for this to work, we need to add the "cross-domain-content" key to "package.json": "permissions": { "cross-domain-content": ["http://en.m.wikipedia.org/"] } the add-on should successfully retrieve the iframe's content.
...latest forecast: // panel-script.js var url = "http://datapoint.metoffice.gov.uk/public/data/txt/wxfcs/regionalforecast/json/500?key=your-api-key"; self.port.on("show", function () { var request = new xmlhttprequest(); request.open("get", url, true); request.onload = function () { var jsonresponse = json.parse(request.responsetext); var summary = getsummary(jsonresponse); var element = document.getelementbyid("forecast_summary"); element.textcontent = summary; }; request.send(); }); function getsummary(forecast) { return forecast.regionalfcst.fcstperiods.period[0].paragraph[0].$; } finally, we need to add the "cross-domain-content" key to "package.json": "permissions": { "cross-domain-content": ["http://datapoint.metoffice.gov.uk"] } content permissions and ...

port - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Guides › Content Scripts › port

unction handlemymessage(mymessagepayload) { // handle the message }); once() often you'll want to receive a message just once, then stop listening.
.../icon-16.png", onclick: function() { console.log("sending 'get-first-para'"); pageworker.port.emit("get-first-para"); } }); the content script listens for "get-first-para".

console/traceback - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs › console traceback

experimental functionality similar to python's traceback module.
... experimental functionality similar to python's traceback module.

content/loader - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs › content loader

content/symbiont - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs › content symbiont

: object optional options: name type frame object the host application frame in which the page is loaded.
...property are loaded before those specified by the contentscript property.

Storing annotations - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Tutorials › Annotator › Storing annotations

orage = require('sdk/simple-storage'); in the module scope, initialize an array which will contain the stored annotations: if (!simplestorage.storage.annotations) simplestorage.storage.annotations = []; now we'll add a function to the module scope which deals with a new annotation.
...('sdk/simple-storage'); in the module scope, initialize an array which will contain the stored annotations: if (!simplestorage.storage.annotations) simplestorage.storage.annotations = []; now we'll add a function to the module scope which deals with a new annotation.

Localization - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Tutorials › l10n

the panel will now display "hello!" or "bonjour !", according to the current locale: the translation is inserted into the node which has the data-l10n-id attribute set.
...ranslation is inserted into the node which has the data-l10n-id attribute set.

File I/O - Archive of obsolete content

Archive › Add-ons › Code snippets › File I O

dows while you can use initwithpath("/") on unix-like systems (linux, mac) to get the root of the file system, there's no such root on windows.
...ork on all platforms.

IsDefaultNamespace - Archive of obsolete content

Archive › Add-ons › Code snippets › IsDefaultNamespace

tandard value for mozilla browsers).
... } } } if (node.parentnode) { // entityreferences may have to be skipped to get to it return isdefaultnamespace(node.parentnode, namespaceuri); } else { return false; // unknown; } case 9: // document_node return isdefaultnamespace(node.documentelement, namespaceuri); case 6: // entity_node case 12: // notation_node case 10: // document_type_node case 11: // document_fragment_node return false; // unknown case 2: // attribute_node: if (node.ownerelement ) { return isdefaultnamespace(node.ownerelement , namespaceuri); } else { ...

JavaScript timers - Archive of obsolete content

Archive › Add-ons › Code snippets › Timers

ful, for example, if you want to have your worker thread run code periodically instead of nonstop.
...f nonstop.

Code snippets - Archive of obsolete content

Archive › Add-ons › Code snippets

read, write, and modify preferences js xpcom code used to define and call xpcom components in javascript running applications code used to run other applications <canvas> related what wg canvas-related code signing a xpi how to sign an xpi with pki delayed execution performing background operations.
...interact with the javascript debugger service svg general general information and utilities svg animation animate svg using javascript and smil svg interacting with script using javascript and dom events to create interactive svg embedding svg in html and xul using svg to enhance html or xul based markup xul widgets html in xul for rich tooltips dynamically embed html into a xul element to attain markup in a tooltip label and description special uses and line breaking examples tree setup and manipulation of trees using xul and js scrollbar changing style of scrollbars.

Jetpack Processes - Archive of obsolete content

Archive › Add-ons › Jetpack Processes

nsijetpack.evalscript(), the script's global scope is endowed with the following privileged apis: sendmessage(amessagename [, v1 [, v2 [, ...]]]) similar to nsijetpack.sendmessage(), this function asynchronously sends a message to the chrome process.
...re removed, at which point it is garbage collected.

Setting Up a Development Environment - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School › Setting Up a Development Environment

ew firefox profile for xul school.
... firefox dom, and try to figure out what the nodes correspond to in the firefox ui.

Performance best practices in extensions - Archive of obsolete content

Archive › Add-ons › Performance best practices in extensions

nts avoid using mouse event listeners, including mouseover, mouseout, mouseenter, mouseexit, and especially mousemove.
...trivially create very high cpu overhead.

Security best practices in extensions - Archive of obsolete content

Archive › Add-ons › Security best practices in extensions

rivileged) content and web (nonprivileged) content, the latter being in the form of web pages.
...ing in the form of web pages.

Session store API - Archive of obsolete content

Archive › Add-ons › Session store API

var ss = components.classes["@mozilla.org/suite/sessionstore;1"] .getservice(components.interfaces.nsisessionstore); when restoring a window, closed tabs in that window are not currently restored.
...ervice(components.interfaces.nsisessionstore); when restoring a window, closed tabs in that window are not currently restored.

Getting the page URL in NPAPI plugin - Archive of obsolete content

Archive › Getting the page URL in NPAPI plugin

-in is invoked, the most npapi-friendly way to do that is to get it from the npstream that is passed to npp_newstream.
...from the npstream that is passed to npp_newstream.

Monitoring WiFi access points - Archive of obsolete content

Archive › Misc top level › Monitoring WiFi access points

wifi-based location services to be used by geolocation services.
...est() { } test.prototype = { onchange: function (accesspoints) { netscape.security.privilegemanager.enableprivilege('universalxpconnect'); var d = document.getelementbyid("d"); d.innerhtml = ""; for (var i=0; i<accesspoints.length; i++) { var a = accesspoints[i]; d.innerhtml += "<p>" + a.mac + " " + a.ssid + " " + a.signal + "</p>"; } var c = document.getelementbyid("c"); c.innerhtml = "<p>" + count++ + "</p>"; }, onerror: function (value) { alert("error: " +value); }, queryinterface: function(iid) { netscape.security.privilegemanager.enableprivilege('universalxpconnect'); if (iid.equals(components.interfaces.nsiwifilistener) || iid.equals(components.interfaces.nsisupports)) return this; ...

Automatically Handle Failed Asserts in Debug Builds - Archive of obsolete content

Archive › Mozilla › Automatically Handle Failed Asserts in Debug Builds

lue.
...t" a value, set its value to 0xffffffff.

Creating a Firefox sidebar extension - Archive of obsolete content

Archive › Mozilla › Creating a Firefox sidebar extension

nu.
...isted in example 2.

Enabling the behavior - updating the status bar panel - Archive of obsolete content

Archive › Mozilla › Creating a Mozilla extension › Enabling the behavior - updating the status bar panel

in order for loadtinderboxstatus() to have any effect we need to define a matching updatetinderboxstatus() function.
...quest.responsetext.match("ee0000")) icon.setattribute("status", "busted"); else if (gxmlhttprequest.responsetext.match("ffaa00")) icon.setattribute("status", "testfailed"); else if (gxmlhttprequest.responsetext.match("11dd11")) icon.setattribute("status", "success"); else icon.setattribute("status", ""); } updatetinderboxstatus() retrieves a reference to the statusbarpanel element then searches through the retrieved html document (stored in the responsetext property of the xmlhttprequest instance) for one of several color references.

Finding the code to modify - Archive of obsolete content

Archive › Mozilla › Creating a Mozilla extension › Finding the code to modify

ee to the statusbar node and select it.
...rpanel node in turn.

Documentation for BiDi Mozilla - Archive of obsolete content

Archive › Mozilla › Firefox › Documentation for BiDi Mozilla

s we could discover, icu is the only one which is 100% compatible with uba, including support for explicit directional controls (lro, rlo, etc, and their html equivalents).
...th uba, including support for explicit directional controls (lro, rlo, etc, and their html equivalents).

Jetpack Snippets - Archive of obsolete content

Archive › Mozilla › Jetpack › Snippets

ome in handy.
...true); }}); calling into a slidebar from the global jetpack scope jetpack.slidebar.append({ onready: function (slide) { // call out to a global function, passing the slidebar object exinitslidebar(slide); }, ...});function exinitslidebar(aslidebar) { // this variable will now be global slider = aslidebar;} // then, accessing the slidebar htmlvar tl = slider.contentdocument.getelementbyid("thumblist"); // or calling slidebar api methods or accessing propertiesslider.notify(); ...

UI - Archive of obsolete content

Archive › Mozilla › Jetpack › UI

longer under active development.
... blog post announcing the first sdk release for what we're up to next!

Supporting private browsing mode - Archive of obsolete content

Archive › Mozilla › Supporting private browsing mode

his scenario.
...ing the information in private browsing mode.

Tamarin build documentation - Archive of obsolete content

Archive › Mozilla › Tamarin › Tamarin Build Documentation

ac only) eclipse (galileo) / cdt (6.0) project for tamarin (also works with helios).
... initial version cover 32- and 64-bit builds for mac os with the gcc 4.0 toolchain (installed with xcode 3.x).

The life of an HTML HTTP request - Archive of obsolete content

Archive › Mozilla › The life of an HTML HTTP request

r every parsed block it passes the parsed data as nsiparsernodes to the contentsink unless the parser has been temporarily blocked, in wich case it waits until it gets unblocked before parsing the cached data it has receieved while being blocked.
...ock it passes the parsed data as nsiparsernodes to the contentsink unless the parser has been temporarily blocked, in wich case it waits until it gets unblocked before parsing the cached data it has receieved while being blocked.

XTech 2005 Presentations - Archive of obsolete content

Archive › Mozilla › XTech 2005 Presentations

web 1.6: a rope of sand - opening keynote, mike shaver mozilla e4x - brendan eich "ecmascript for xml" (ecma-357), a new standard for writing and processing xml directly in javascript (ecma-262, iso-16262).
...ties to web developers.

autocompletepopup - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › autocompletepopup

« xul reference home autocompletepopup type: id the id of a popup element used to hold autocomplete results for the element.
... « xul reference home autocompletepopup type: id the id of a popup element used to hold autocomplete results for the element.

command - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › command

« xul reference home command type: id set to the id of a command element that is being observed by the element.
... « xul reference home command type: id set to the id of a command element that is being observed by the element.

context - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › context

« xul reference home context type: id should be set to the value of the id of the popup element that should appear when the user context-clicks on the element.
... « xul reference home context type: id should be set to the value of the id of the popup element that should appear when the user context-clicks on the element.

control - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › control

« xul reference home control type: id this attribute specifies the id of the element with which the label is associated.
... « xul reference home control type: id this attribute specifies the id of the element with which the label is associated.

crop - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › crop

« xul reference home crop type: one of the values below if the label of the element is too big to fit in its given space, the text will be cropped on the side specified by the crop attribute.
...ight side.

height - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › height

« xul reference home height type: string (representing an integer) the preferred height of the element in pixels.
... « xul reference home height type: string (representing an integer) the preferred height of the element in pixels.

image.onload - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › image.onload

« xul reference home image.onload type: script code this event handler will be called on the image element when the image has finished loading.
... « xul reference home image.onload type: script code this event handler will be called on the image element when the image has finished loading.

image - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › image

« xul reference home image type: uri the uri of the image to appear on the element.
... « xul reference home image type: uri the uri of the image to appear on the element.

isempty - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › isempty

« xul reference home isempty type: boolean indicates whether rules match based on emptyness.
... « xul reference home isempty type: boolean indicates whether rules match based on emptyness.

linkedpanel - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › linkedpanel

« xul reference home linkedpanel type: id the id of the linked tabpanel element that will be displayed when the tab is selected.
... « xul reference home linkedpanel type: id the id of the linked tabpanel element that will be displayed when the tab is selected.

modifiers - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › modifiers

control key.
...linux.

noinitialfocus - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › noinitialfocus

« xul reference homenoinitialfocustype: booleanif false, the default value, the element is considered when determining which element should be initially focused in a dialog.
... « xul reference homenoinitialfocustype: booleanif false, the default value, the element is considered when determining which element should be initially focused in a dialog.

panel.type - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › panel.type

« xul reference home type type: string the panel type.
... « xul reference home type type: string the panel type.

popup - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › popup

« xul reference home popup type: id should be set to the value of the id of the popup element that should appear when the user clicks on the element.
... « xul reference home popup type: id should be set to the value of the id of the popup element that should appear when the user clicks on the element.

popupalign - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › popupalign

« xul reference homepopupaligntype: one of the values belowpopupalign is an optional attribute for specifying which side of the popup content should be attached to the popupanchor.
...of the values belowpopupalign is an optional attribute for specifying which side of the popup content should be attached to the popupanchor.

popupanchor - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › popupanchor

« xul reference homepopupanchortype: one of the values belowpopupanchor is an optional attribute for specifying where popup content should be anchored on the element.noneno anchortopleftanchor to the top left cornertoprightanchor to the top right cornerbottomleftanchor to the bottom left cornerbottomrightanchor to the bottom right cornersyntax<element popupanchor="none | topleft | topright | bottomleft | bottomright" /> example<element id="edit-context" popup="editor-popup" popupanchor="topleft" popupalign="bottomright" /> notesthe popupanchor attribute can be used to specify that the popup content should come up anchored to one of the four corners of the content object (e.g., the button popping up the content).
...(either directly under the mouse or attached to one of the four corners) is called the originating point.by default the popup content appears with its top left point located directly underneath the point at which the user's mouse goes down (on tooltips the content is displaced by the height of the mouse cursor).

selected - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › selected

« xul reference home selected type: boolean indicates whether the element is selected or not.
... « xul reference home selected type: boolean indicates whether the element is selected or not.

separator.orient - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › separator.orient

« xul reference home orient type: one of the values below used to specify whether the separator is a horizontal or vertical separator.
... « xul reference home orient type: one of the values below used to specify whether the separator is a horizontal or vertical separator.

setfocus - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › setfocus

« xul reference home setfocus type: boolean if true or omitted, the focus will be given to the first element in the corresponding tabpanel when the tabs are navigated via the keyboard.
... « xul reference home setfocus type: boolean if true or omitted, the focus will be given to the first element in the corresponding tabpanel when the tabs are navigated via the keyboard.

spellcheck - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › spellcheck

« xul reference home spellcheck type: boolean if true, spell checking is enabled by default for the text box; if false, spell checking is disabled by default.
...pe="text" spellcheck="true" /><br /> <textarea spellcheck="true"></textarea> <div contenteditable="true" spellcheck="true">i am some content</div> <!-- spellcheck nothing!

statustext - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › statustext

« xul reference home statustext type: string used to set the text that appears on the status bar when the user moves the mouse over the element.
...text="connect to remote server" onmouseover="setstatusmessage(this)" onmouseout="clearstatusmessage()"/> <button label="ping" statustext="ping the server" onmouseover="setstatusmessage(this)" onmouseout="clearstatusmessage()"/> <statusbar> <statusbarpanel id="mystatuspanel" label="" flex="1"/> <spacer flex="1"/> </statusbar> <script> function setstatusmessage(obj){ document.getelementbyid('mystatuspanel').label = obj.getattribute('statustext'); } function clearstatusmessage(obj){ document.getelementbyid('mystatuspanel').label = ''; } </script> see also statusbar and statusbarpanel ...

substate - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › substate

« xul reference home substate type: one of the values below on splitters which have state="collapsed" and collapse="both", determines which direction the splitter is actually collapsed in.
... « xul reference home substate type: one of the values below on splitters which have state="collapsed" and collapse="both", determines which direction the splitter is actually collapsed in.

tabindex - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › tabindex

« xul reference home tabindex type: integer the tab order of the element.
... « xul reference home tabindex type: integer the tab order of the element.

tooltiptext - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › tooltiptext

« xul reference home tooltiptext type: string used to set the text which appears in the tooltip when the user moves the mouse over the element.
... tooltiptext type: string used to set the text which appears in the tooltip when the user moves the mouse over the element.

treecol.src - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › treecol.src

« xul reference home src type: uri set this attribute to have the treecol element use an image for the header instead of a label.
...xul reference home src type: uri set this attribute to have the treecol element use an image for the header instead of a label.

width - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › width

« xul reference home width type: string (representing an integer) the preferred width of the element.
... « xul reference home width type: string (representing an integer) the preferred width of the element.

Attribute (XUL) - Archive of obsolete content

Archive › Mozilla › XUL › Attribute

tainer containment contentcontextmenu contenttooltip context contextmenu control crop curpos current currentset customindex customizable cycler datasources decimalplaces default defaultbutton defaultset description dir disableautocomplete disableautoselect disableclose disabled disablehistory disablekeynavigation disablesecurity dlgtype dragging editable editortype element empty emptytext deprecated since gecko 2 enablecolumndrag enablehistory equalsize eventnode events expr firstdayofweek firstpage first-tab fixed flags flex focused forcecomplete grippyhidden grippytooltiptext group handlectrltab height helpuri hidden hidechrome hidecolumnpicker hideheader hideseconds hidespinbuttons highlightnonmatches homepage href icon id ign...
...textcommand ontextentered ontextrevert ontextreverted onunload onwizardback onwizardcancel onwizardfinish onwizardnext open ordinal orient pack pageid pageincrement pagestep parent parsetype persist persistence phase pickertooltiptext placeholder popup position predicate preference preference-editable primary priority properties querytype readonly ref rel removeelement resizeafter resizebefore rows screenx screeny searchbutton searchsessions searchlabel selected selectedindex seltype setfocus showcaret showcommentcolumn showpopup size sizemode sizetopopup smoothscroll sort sortactive sortdirection sortresource sortresource2 spellcheck src state statedatasource statusbar statustext style subject substate suppressonselect tabind...

CheckboxStateChange - Archive of obsolete content

Archive › Mozilla › XUL › Events › CheckboxStateChange

the checkboxstatechange event is executed when the state of a <checkbox> element has changed.
... the checkboxstatechange event is executed when the state of a <checkbox> element has changed.

RadioStateChange - Archive of obsolete content

Archive › Mozilla › XUL › Events › RadioStateChange

the radiostatechange event is executed when the state of a <radio> element has changed.
... the radiostatechange event is executed when the state of a <radio> element has changed.

ValueChange - Archive of obsolete content

Archive › Mozilla › XUL › Events › ValueChange

the valuechange event is executed when the value of an element, <progress> for example, has changed.
... the valuechange event is executed when the value of an element, <progress> for example, has changed.

broadcast - Archive of obsolete content

Archive › Mozilla › XUL › Events › broadcast

the broadcast event is executed when the attributes of the element (such as a broadcaster) being listened to are changed.
... the broadcast event is executed when the attributes of the element (such as a broadcaster) being listened to are changed.

How to implement a custom XUL query processor component - Archive of obsolete content

Archive › Mozilla › XUL › How to implement a custom XUL query processor component

// the output for a result has been removed and the result is no longer being used by the builder hasbeenremoved: function() { } }; // basic wrapper for nsisimpleenumerator function templateresultset(aarrayofdata) { this._index = 0; this._array = aarrayofdata; } templateresultset.prototype = { queryinterface: xpcomutils.generateqi([components.interfaces.nsisimpleenumerator]), hasmoreelements: function() { return this._index < this._array.length; }, getnext: function() { return new templateresult(this._array[this._index++]); } }; // the query processor class - implements nsixultemplatequeryprocessor function templatequeryprocessor() { // our basic list of data this._data = [ {name: "mark", age: 36, hair: "brown", eye: "brown"}, {na...
....

appendCustomToolbar - Archive of obsolete content

Archive › Mozilla › XUL › Method › appendCustomToolbar

« xul reference home appendcustomtoolbar( name, currentset ) firefox only return type: element adds a custom toolbar to the toolbox with the given name.
... « xul reference home appendcustomtoolbar( name, currentset ) firefox only return type: element adds a custom toolbar to the toolbox with the given name.

blur - Archive of obsolete content

Archive › Mozilla › XUL › Method › blur

« xul reference home blur() return type: no return value if the focus is on the element, it is removed.
... « xul reference home blur() return type: no return value if the focus is on the element, it is removed.

Floating Panels - Archive of obsolete content

Archive › Mozilla › XUL › PopupGuide › Floating Panels

floating panels a floating panel is used for secondary popups such as tool palettes and property inspector panels.
...e future, a distinction will be available to support titlebars of differing styles.

Special per-platform menu considerations - Archive of obsolete content

Archive › Mozilla › XUL › PopupGuide › Platform considerations

this menu item will be placed on the application menu on the macintosh but left in the tools menu on other platforms.
... shortcut keys are overridden by platform conventions.

boxObject - Archive of obsolete content

Archive › Mozilla › XUL › Property › boxObject

« xul reference boxobject type: nsiboxobject this property is available for elements that are derived from boxes, which is most displayable xul elements.
... « xul reference boxobject type: nsiboxobject this property is available for elements that are derived from boxes, which is most displayable xul elements.

child - Archive of obsolete content

Archive › Mozilla › XUL › Property › child

« xul reference child type: ?
... « xul reference child type: ?

container - Archive of obsolete content

Archive › Mozilla › XUL › Property › container

« xul reference container type: ?
... « xul reference container type: ?

database - Archive of obsolete content

Archive › Mozilla › XUL › Property › database

« xul reference database type: nsirdfcompositedatasource returns the composite datasource created when all the datasources of an element are combined.
... « xul reference database type: nsirdfcompositedatasource returns the composite datasource created when all the datasources of an element are combined.

inputField - Archive of obsolete content

Archive › Mozilla › XUL › Property › inputField

« xul reference inputfield type: textbox element in mozilla, the xul textbox is implemented as a wrapper around an html input element.
... « xul reference inputfield type: textbox element in mozilla, the xul textbox is implemented as a wrapper around an html input element.

richlistitem.label - Archive of obsolete content

Archive › Mozilla › XUL › Property › richlistitem.label

« xul reference label type: string gets the concatentation of text from any child label elements.
... « xul reference label type: string gets the concatentation of text from any child label elements.

selected - Archive of obsolete content

Archive › Mozilla › XUL › Property › selected

« xul reference selected type: boolean this property's value is true if this element is selected, or false if it is not.
... « xul reference selected type: boolean this property's value is true if this element is selected, or false if it is not.

textbox.label - Archive of obsolete content

Archive › Mozilla › XUL › Property › textbox.label

« xul reference label type: string sets the label attribute.
...attribute if it is present and not empty.

alert-icon - Archive of obsolete content

Archive › Mozilla › XUL › Style › alert-icon

« xul reference home alert-icon class that adds an alert icon.
... « xul reference home alert-icon class that adds an alert icon.

Building Hierarchical Trees - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Building Hierarchical Trees

<treeitem uri="rdf:*"> <treerow> <treecell label="rdf:http://www.xulplanet.com/rdf/address"/> <treecell label="rdf:http://www.xulplanet.com/rdf/floors"/> </treerow> </treeitem> </treechildren> </rule> <rule> <treechildren> <treeitem uri="rdf:*"> <treerow> <treecell label="rdf:http://purl.org/dc/elements/1.1/title"/> </treerow> </treeitem> </treechildren> </rule> </template> </tree> the first rule is for the houses as indicated by the rule's condition and the second rule is for the streets.
...t containers, so they will not have children in the tree.

Namespaces - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Namespaces

xml namespaces can be used in xul templates by binding the namespace uri and prefix to the template element.
..."julius caesar" gender="male"/> <person name="ferdinand magellan" gender="male"/> <person name="laura secord" gender="female"/> </people> <listbox datasources="people.xml" ref="*" querytype="xml"> <template xmlns:ns="www.example.com/people"> <query expr="ns:person"/> <action> <listitem uri="?" label="?ns:name"/> </action> </template> </listbox> once added to the template element the namespaces can then be referenced inside temple rule elements too, this works both in rdf and xml templates.

Template and Tree Listeners - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Template and Tree Listeners

.
... value of the getindexofresource method.

Using Multiple Queries to Generate More Results - Archive of obsolete content

Archive › Mozilla › XUL › Template Guide › Using Multiple Queries to Generate More Results

ch the streets as before, but the second query will generate a result for each person.
... <action> <label uri="?item" value="?title" class="header"/> </action> </rule> </queryset> <queryset> <query> <content uri="?start"/> <triple subject="?start" predicate="http://www.xulplanet.com/rdf/people" object="?people"/> <member container="?people" child="?item"/> </query> <rule> <binding subject="?item" predicate="http://purl.org/dc/elements/1.1/title" object="?title"/> <action> <label uri="?item" value="?title"/> </action> </rule> </queryset> </template> you can view the example.

The Joy of XUL - Archive of obsolete content

Archive › Mozilla › XUL › The Joy of XUL

ponents, it delivers on the promise of write-once, run-anywhere.
... also isolated from one another, enabling the core xul definition and application logic to be shared among all of the custom versions.

More Wizards - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › More Wizards

is also called whenever a key is pressed in the textbox, to determine whether the next button should be enabled again.
...xtbox, to determine whether the next button should be enabled again.

Progress Meters - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Progress Meters

« previousnext » in this section, we'll look at creating progress meters.
... the progress bar to be displayed while the search was occurring.

Scroll Bars - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Scroll Bars

« previousnext » now, let's find out to add scroll bars to a window.
...cessary when the content inside is too large.

Tree Selection - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › Tree Selection

« previousnext » the section will describe how to get and set the selected items in a tree.
...et to the value single, the user may only select one row at a time.

XUL Structure - Archive of obsolete content

Archive › Mozilla › XUL › Tutorial › XUL Structure

ght include several different applications, each accessible via different chrome urls.
...l).

Urlbar-icons - Archive of obsolete content

Archive › Mozilla › XUL › Urlbar-icons

param - Archive of obsolete content

Archive › Mozilla › XUL › param

« xul reference home [ examples | attributes | properties | methods | related ] for sql templates, used to bind values to parameters specified within an sql statement.
... ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattr...

popup - Archive of obsolete content

Archive › Mozilla › XUL › popup

« xul reference home the popup element is equivalent to the menupopup element which should be used instead.
... « xul reference home the popup element is equivalent to the menupopup element which should be used instead.

How to enable locale switching in a XULRunner application - Archive of obsolete content

Archive › Mozilla › XULRunner › How to enable locale switching in a XULRunner application

toolkitchromeregistry); var selectedlocale = xulchromereg.getselectedlocale("localeswitchdemo"); var availablelocales = toolkitchromereg.getlocalesforpackage("localeswitchdemo"); // render locale menulist by iterating through the query result from getlocalesforpackage() const xul_ns = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"; var localelistbox = document.getelementbyid("locale-listbox"); var selecteditem = null; while(availablelocales.hasmore()) { var locale = availablelocales.getnext(); var listitem = document.createelementns(xul_ns, "listitem"); listitem.setattribute("value", locale); listitem.setattribute("label", locale); if (locale == selectedlocale) { // is this the current locale?
...st be restarted to activate the new choice.

mozilla.dev.platform FAQ - Archive of obsolete content

Archive › Mozilla › mozilla.dev.platform FAQ

s silently.
...ork successfully.

2006-11-17 - Archive of obsolete content

Archive › Newsgroup summaries › mozilla-dev-platform › 2006-11-17

summary: mozilla.dev.platform - november 11th - november 17th, 2006 announcements no announcements this week traffic xulrunner: <browser> not allowing javascript popup windows b notes that when using xul elements <browser/> and <tabbrowser/> the javascript popup windows don't work out of the box and asks what needs to be implement.
... there is the appearance of a significant memory leak.

2006-10-27 - Archive of obsolete content

Archive › Newsgroup summaries › mozilla-dev-tech-layout › 2006-10-27

summary: mozilla.dev.tech.layout - october 21 - october 27, 2006 announcements none this week.
...ary: mozilla.dev.tech.layout - october 21 - october 27, 2006 announcements none this week.

NPN_GetValue - Archive of obsolete content

Archive › Plugins › Reference › NPN GetValue

whether smartupdate (former name: asd) is enabled; true=smartupdate enabled, false=not enabled npnvisofflinebool: tells whether offline mode is enabled; true=offline mode enabled, false=not enabled npnvtoolkit: npnvsupportsxembedbool: npnvwindownpobject: returns the npobject * pointer for the dom window object; see getting the page url in npapi plugin for a rough example npnvpluginelementnpobject: npnvsupportswindowless: tells whether the browser supports windowless plugins.
...n via npn_memfree().

-moz-border-bottom-colors - Archive of obsolete content

Archive › Web › CSS › -moz-border-bottom-colors

tions like firefox, the -moz-border-bottom-colors css property sets a list of colors for the bottom border.
...al; -moz-border-bottom-colors: unset; when an element has a border that is larger than a single css pixel, each line of pixels uses the next color specified in this property, from the outside in.

-moz-border-left-colors - Archive of obsolete content

Archive › Web › CSS › -moz-border-left-colors

ozilla applications like firefox, the -moz-border-left-colors css property sets a list of colors for the left border.
...tial; -moz-border-left-colors: unset; when an element has a border that is larger than a single css pixel, each line of pixels uses the next color specified in this property, from the outside in.

-moz-border-right-colors - Archive of obsolete content

Archive › Web › CSS › -moz-border-right-colors

applications like firefox, the -moz-border-right-colors css property sets a list of colors for the right border.
...ial; -moz-border-right-colors: unset; when an element has a border that is larger than a single css pixel, each line of pixels uses the next color specified in this property, from the outside in.

-moz-border-top-colors - Archive of obsolete content

Archive › Web › CSS › -moz-border-top-colors

in mozilla applications like firefox, the -moz-border-top-colors css property sets a list of colors for the top border.
...itial; -moz-border-top-colors: unset; when an element has a border that is larger than a single css pixel, each line of pixels uses the next color specified in this property, from the outside in.

-ms-filter - Archive of obsolete content

Archive › Web › CSS › -ms-filter

kground-image: linear-gradient(to right, #ffffff 0%, #000000 100%); } .gradient.vertical { -ms-filter: 'progid:dximagetransform.microsoft.gradient(startcolorstr="#ffffff", endcolorstr="#000000", gradienttype=0)'; background-image: linear-gradient(to bottom, #ffffff 0%, #000000 100%); } result specifications not part of any specification.
... internet explorer 8, the -ms-filter attribute is an extension to css, and can be used as a synonym for filter in ie8 standards mode.

-ms-hyphenate-limit-lines - Archive of obsolete content

Archive › Web › CSS › -ms-hyphenate-limit-lines

the -ms-hyphenate-limit-lines css property is a microsoft extension specifying the maximum number of consecutive lines in an element that may be ended with a hyphenated word.
... the -ms-hyphenate-limit-lines css property is a microsoft extension specifying the maximum number of consecutive lines in an element that may be ended with a hyphenated word.

-ms-scrollbar-arrow-color - Archive of obsolete content

Archive › Web › CSS › -ms-scrollbar-arrow-color

the -ms-scrollbar-arrow-color css property is a microsoft extension that specifies the color of the arrow elements of a scroll arrow.
... the -ms-scrollbar-arrow-color css property is a microsoft extension that specifies the color of the arrow elements of a scroll arrow.

-ms-touch-select - Archive of obsolete content

Archive › Web › CSS › -ms-touch-select

the -ms-touch-select css property is a microsoft extension that toggles the gripper visual elements that enable touch text selection.
... the -ms-touch-select css property is a microsoft extension that toggles the gripper visual elements that enable touch text selection.

:-moz-full-screen-ancestor - Archive of obsolete content

Archive › Web › CSS › :-moz-full-screen-ancestor

the :-moz-full-screen-ancestor css pseudo-class is a mozilla extension that represents all ancestors of the full-screen element, except containing frames in parent documents, which are the full-screen element in their own documents.
... the :-moz-full-screen-ancestor css pseudo-class is a mozilla extension that represents all ancestors of the full-screen element, except containing frames in parent documents, which are the full-screen element in their own documents.

::-ms-check - Archive of obsolete content

Archive › Web › CSS › ::-ms-check

the ::-ms-check css pseudo-element is a microsoft extension that represents checkboxes and radio button groups created by <input type="checkbox"> and <input type="radio">.
... the ::-ms-check css pseudo-element is a microsoft extension that represents checkboxes and radio button groups created by <input type="checkbox"> and <input type="radio">.

::-ms-clear - Archive of obsolete content

Archive › Web › CSS › ::-ms-clear

the ::-ms-clear css pseudo-element creates a clear button at the edge of an <input type="text"> text control that clears the current value.
... the ::-ms-clear css pseudo-element creates a clear button at the edge of an <input type="text"> text control that clears the current value.

::-ms-fill - Archive of obsolete content

Archive › Web › CSS › ::-ms-fill

the ::-ms-fill css pseudo-element is a microsoft extension that represents a progress bar displayed by <progress>.
... the ::-ms-fill css pseudo-element is a microsoft extension that represents a progress bar displayed by <progress>.

::-ms-reveal - Archive of obsolete content

Archive › Web › CSS › ::-ms-reveal

the ::-ms-reveal css pseudo-element is a microsoft extension that is used to display a password reveal button for use with a password field created by <input type="password">.
... the ::-ms-reveal css pseudo-element is a microsoft extension that is used to display a password reveal button for use with a password field created by <input type="password">.

::-ms-ticks-after - Archive of obsolete content

Archive › Web › CSS › ::-ms-ticks-after

the ::-ms-ticks-after css pseudo-element is a microsoft extension that applies one or more styles to the tick marks that appear after the track of a slider control.
... pseudo-element is a microsoft extension that applies one or more styles to the tick marks that appear after the track of a slider control.

::-ms-ticks-before - Archive of obsolete content

Archive › Web › CSS › ::-ms-ticks-before

the ::-ms-ticks-before css pseudo-element is a microsoft extension that applies one or more styles to the tick marks that appear before the track of a slider control.
...pseudo-element is a microsoft extension that applies one or more styles to the tick marks that appear before the track of a slider control.

::-ms-track - Archive of obsolete content

Archive › Web › CSS › ::-ms-track

the ::-ms-track css pseudo-element is a microsoft extension that represents the track of a slider control.
... the ::-ms-track css pseudo-element is a microsoft extension that represents the track of a slider control.

Displaying notifications (deprecated) - Archive of obsolete content

Archive › Web › Displaying notifications (deprecated)

clicks (or taps) on the notification.
...tion is dismissed by the user clicking on it, both events will get fired.

E4X - Archive of obsolete content

Archive › Web › E4X

ithm.
...ave an attribute of the form type="text/javascript;e4x=1").

Array.observe() - Archive of obsolete content

Archive › Web › JavaScript › Array.observe

was changed.
....

VBArray.getItem - Archive of obsolete content

Archive › Web › JavaScript › Microsoft Extensions › VBArray › getItem

non-standard.
...ray object.

New in JavaScript 1.2 - Archive of obsolete content

Archive › Web › JavaScript › New in JavaScript › 1.2

pts changed functionality in javascript 1.2 you can now nest functions within functions.
... now converts a specified object to a string.

XForms Custom Controls Examples - Archive of obsolete content

Archive › Web › XForms › Custom Controls Examples

le showing a complete form can be found on xforms:custom_controls.
...rser = new domparser(); return this._domparser; </getter> </property> <method name="refresh"> <body> // get new value, parse, and import it.

XForms Styling - Archive of obsolete content

Archive › Web › XForms › Styling XForms

just a starting draft.
...forms extension is one of the few xforms processors which allow for styling of the xforms elements directly, using mostly standard css.

Using XForms and PHP - Archive of obsolete content

Archive › Web › XForms › XForms And Php

y use the power of xforms (/xml) you would probably submit xml.
...uld probably submit xml.

XForms - Archive of obsolete content

Archive › Web › XForms

ds the xforms 1.0 specification.
... xforms custom controls custom controls lets the form author "skin" each xforms control through xbl, and create f.x.

Common causes of memory leaks in extensions - Extensions

Extensions › Common causes of memory leaks in extensions

a bootstrap.js compartment.
... to unregister observers holding onto event observers for too long is another problem.

Index - Game development

Games › Index

t the ball before it reaches the bottom edge of the screen it will be game over.
...he ball goes through them.

Introduction to game development for the Web - Game development

Games › Introduction

for you: full screen api this simple api lets your game take over the entire screen, thereby immersing the player in action.
...ntire screen, thereby immersing the player in action.

Explaining basic 3D theory - Game development

Games › Techniques › 3D on the web › Basic theory

l grid, so eventually they can be printed out as pixels on a 2d screen display during the output merging stage.
...t as pixels on a 2d screen display during the output merging stage.

Visual typescript game engine - Game development

Games › visual typescript game engine

CSRF - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › CSRF

csrf (cross-site request forgery) is an attack that impersonates a trusted user and sends a website unwanted commands.
...d sends a website unwanted commands.

CSS - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › CSS

css (cascading style sheets) is a declarative language that controls how webpages look in the browser.
... css (cascading style sheets) is a declarative language that controls how webpages look in the browser.

CSS pixel - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › CSS pixel

e display is generally substantially farther away from their eyes than when they're on a cell phone, for instance.
...ey're on a cell phone, for instance.

Canvas - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Canvas

the canvas element is part of html5 and allows for dynamic, scriptable rendering of 2d and 3d shapes and bitmap images.
...ing of 2d and 3d shapes and bitmap images.

Flex - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Flex

flex is a new value added to the css display property.
... flex is a new value added to the css display property.

Grid container - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Grid Container

using the value grid or inline-grid on an element turns it into a grid container using css grid layout, and any direct children of this element become grid items.
... using the value grid or inline-grid on an element turns it into a grid container using css grid layout, and any direct children of this element become grid items.

Metadata - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Metadata

metadata is — in its very simplest definition — data that describes data.
... metadata is — in its very simplest definition — data that describes data.

Style origin - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Style origin

css, there are three categories of sources for style changes.
...ies custom styles to content, such as stylus or stylish.

Stylesheet - MDN Web Docs Glossary: Definitions of Web-related terms

Glossary › Stylesheet

a stylesheet is a set of css rules used to control the layout and design of a webpage or document.
... a stylesheet is a set of css rules used to control the layout and design of a webpage or document.

Test your skills: The Box Model - Learn web development

Learn › CSS › Building blocks › Selectors › Box Model Tasks

top margin of 20px.
...ther work purposes, download the starting point for this task to work in your own editor or in an online editor.

Test your skills: values and units - Learn web development

Learn › CSS › Building blocks › Values tasks

need to figure out how to use the values in css.
...ues in css.

Test your skills: Multicol - Learn web development

Learn › CSS › CSS layout › Multicol skills

the aim of this task is to get you working with the css column-count, column-width, column-gap, column-span and column-rule properties and values covered in our lesson on multiple-column layout.
...ave a minimum width of 200px.

CSS layout - Learn web development

Learn › CSS › CSS layout

e in css.
...t started with page layout, then test your grid skills before moving on.

Using CSS generated content - Learn web development

Learn › CSS › Howto › Generated content

n your stylesheet that requires translation, you have to put those parts of your stylesheet in different files and arrange for them to be linked with the appropriate language versions of your doucment.
...representation in the css specification.

Typesetting a community school homepage - Learn web development

Learn › CSS › Styling text › Typesetting a homepage

cise, and the provided external link icon.
...hy feel — a serif site-wide font for the general text body, coupled with sans-serif or slab serif for the headings might be nice.

Example 4 - Learn web development

Learn › Forms › How to build custom form controls › Example 4

ow) { var optlist = select.queryselector('.optlist'); optlist.classlist.toggle('hidden'); } function highlightoption(select, option) { var optionlist = select.queryselectorall('.option'); optionlist.foreach(function (other) { other.classlist.remove('highlight'); }); option.classlist.add('highlight'); }; function updatevalue(select, index) { var nativewidget = select.previouselementsibling; var value = select.queryselector('.value'); var optionlist = select.queryselectorall('.option'); nativewidget.selectedindex = index; value.innerhtml = optionlist[index].innerhtml; highlightoption(select, optionlist[index]); }; function getindex(select) { var nativewidget = select.previouselementsibling; return nativewidget.selectedindex; }; // ------------- // // event b...
...}); select.addeventlistener('blur', function (event) { deactivateselect(select); }); }); }); window.addeventlistener('load', function () { var selectlist = document.queryselectorall('.select'); selectlist.foreach(function (select) { var optionlist = select.queryselectorall('.option'), selectedindex = getindex(select); select.tabindex = 0; select.previouselementsibling.tabindex = -1; updatevalue(select, selectedindex); optionlist.foreach(function (option, index) { option.addeventlistener('click', function (event) { updatevalue(select, index); }); }); select.addeventlistener('keyup', function (event) { var length = optionlist.length, index = getindex(select); if (event.keycode === 27) { deacti...

Test your skills: Advanced styling - Learn web development

Learn › Forms › Test your skills: Advanced styling

you to handle making a search input as consistent as possible across browsers — a trickier task than with standard text inputs, even on modern browsers.
...ou remove this?

Test your skills: Form structure - Learn web development

Learn › Forms › Test your skills: Form structure

sessment or further help section at the bottom of this page.
...ucture the provided form features: separate out the first two and second two form fields into two distinct containers, each with a descriptive legend (use "personal details" for the first two, and "comment information" for the second two).

Example - Learn web development

Learn › Forms › Your first form › Example

d have the same font settings by default, textarea are set with a monospace font */ font: 1em sans-serif; /* to give the same size to all text field */ width: 300px; -moz-box-sizing: border-box; box-sizing: border-box; /* to harmonize the look & feel of text field border */ border: 1px solid #999; } input:focus, textarea:focus { /* to give a little highligh on active elements */ border-color: #000; } textarea { /* to properly align multiline text field with their label */ vertical-align: top; /* to give enough room to type some text */ height: 5em; /* to allow users to resize any textarea vertically it works only on chrome, firefox and safari */ resize: vertical; } .button { /* to position the buttons to the same position of the text fields *...
...roperly align multiline text field with their label */ vertical-align: top; /* to give enough room to type some text */ height: 5em; /* to allow users to resize any textarea vertically it works only on chrome, firefox and safari */ resize: vertical; } .button { /* to position the buttons to the same position of the text fields */ padding-left: 90px; /* same size as the label elements */ } button { /* this extra magin represent the same space as the space between the labels and their text fields */ margin-left: .5em; } result ...

The web and web standards - Learn web development

Learn › Getting started with the web › The web and web standards

ifications, which detail exactly how the technology should work.
...browser — here you go" [downloads files and renders web page] the actual syntax for http messages (called requests and responses) is not that human-readable, but this gives you the basic idea.

Tips for authoring fast-loading HTML pages - Learn web development

Learn › HTML › Howto › Author fast-loading HTML pages

owser must check the modification time for each of these files, before rendering the page.
... having to reflow the content.

Test your skills: HTML text basics - Learn web development

Learn › HTML › Introduction to HTML › Test your skills: HTML text basics

utions in the interactive editors below, however it may be helpful to download the code and use an online tool such as codepen, jsfiddle, or glitch to work on the tasks.
... 2 in this task we want you to turn the first un-marked up list into an unordered list, and the second one into an ordered list.

Test your skills: HTML images - Learn web development

Learn › HTML › Multimedia and embedding › Images in HTML › Test your skills: HTML images

his task we want you to embed a simple image of some blueberries into the page.
...s when the image is moused over.

Functions — reusable blocks of code - Learn web development

Learn › JavaScript › Building blocks › Functions

source code) from our loops article, we included a custom draw() function that looked like this: function draw() { ctx.clearrect(0,0,width,height); for (let i = 0; i < 100; i++) { ctx.beginpath(); ctx.fillstyle = 'rgba(255,0,0,0.5)'; ctx.arc(random(width), random(height), random(50), 0, 2 * math.pi); ctx.fill(); } } this function draws 100 random circles inside a <canvas> element.
...ion — it has no name!

Test your skills: Functions - Learn web development

Learn › JavaScript › Building blocks › Test your skills: Functions

the examples below, if there is an error in your code it will be outputted into the results panel on the page, to help you try to figure out the answer (or into the browser's javascript console, in the case of the downloadable version).
...e page, to help you try to figure out the answer (or into the browser's javascript console, in the case of the downloadable version).

Client-side web APIs - Learn web development

Learn › JavaScript › Client-side web APIs

services (e.g.
...ows some typical uses of the latter.

JavaScript object basics - Learn web development

Learn › JavaScript › Objects › Basics

vascript objects.
...u used string methods like: mystring.split(','); you were using a method available on an instance of the string class.

Client-Server Overview - Learn web development

Learn › Server-side › First steps › Client-Server overview

eny allow: get x-cache-info: caching content-length: 41823 <!doctype html> <html lang="en-us" dir="ltr" class="redesign no-js" data-ffo-opensanslight=false data-ffo-opensans=false > <head prefix="og: http://ogp.me/ns#"> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <script>(function(d) { d.classname = d.classname.replace(/\bno-js/, ''); })(document.documentelement);</script> ...
... a step-by-step overview of the "dynamic" http request and response cycle, building on what we looked at in the last article with much more detail.

Componentizing our Svelte app - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Svelte components

eld for editing the todo name, and the cancel and save buttons.
...show or hide the markup based on the condition — it will dynamically add and remove the elements from the dom, depending on the condition.

Deployment and next steps - Learn web development

Learn › Tools and testing › Client-side JavaScript frameworks › Svelte deployment next

we learned about svelte philosophy and what sets it apart from other front-end frameworks.
...sets it apart from other front-end frameworks.

Package management basics - Learn web development

Learn › Tools and testing › Understanding client-side tools › Package management

han your own solution.
...me calculation, but we definitely don’t need 195k worth of javascript to do this!.

Multiprocess on Windows

Mozilla › Accessibility › Multiprocess on Windows

ength_is and size_is.
...ontains the array (excluding the this pointer).

Adding a new CSS property

Mozilla › Adding a new style property

this page describes how to add a new css property to the style system.
...the style struct) to transform a specified value of the property into a computed value of the property.

Creating MozSearch plugins

Mozilla › Creating MozSearch plugins

should only be used if your intention is to distribute the search plugin packaged in a firefox extension, or if you are creating plugins meant to be shipped by default in a firefox build.
... enter key.

Debugging Table Reflow

Mozilla › Debugging › Debugging Table Reflow

reflow the most efficient tool to claim that html-table code is the victim and not the source of layout bugs is a frame reflow debug log.
...aim that html-table code is the victim and not the source of layout bugs is a frame reflow debug log.

Debugging on Windows

Mozilla › Debugging › Debugging on Windows

nsg|g)etter_*addrefs.*=nostepinto ns_convertutf.* ; might be too broad: (ns|promise)[^\:]*[ss]tring.* ...add common functions to this list should probably make a .reg file for easy importing obtaining stdout and other file handles running the following command in the command window in visual studio returns the value of stdout, which can be used with various debugging methods (such as nsgenericelement::list) that take a file* param: debug.evaluatestatement {,,msvcr80d}(&__iob_func()[1]) (alternatively you can evaluate {,,msvcr80d}(&__iob_func()[1]) in the quickwatch window) similarly, you can open a file on the disk using fopen: >debug.evaluatestatement {,,msvcr80d}fopen("c:\\123", "w") 0x10311dc0 { ..snip..
...debugging methods (such as nsgenericelement::list) that take a file* param: debug.evaluatestatement {,,msvcr80d}(&__iob_func()[1]) (alternatively you can evaluate {,,msvcr80d}(&__iob_func()[1]) in the quickwatch window) similarly, you can open a file on the disk using fopen: >debug.evaluatestatement {,,msvcr80d}fopen("c:\\123", "w") 0x10311dc0 { ..snip..

Limitations of frame scripts

Mozilla › Firefox › Multiprocess Leftovers › Limitations of frame scripts

cripts are subject to the same file access rules placed on remote content.
...ator <need more examples> places api the places api can't be used inside a frame script.

Limitations of frame scripts

Mozilla › Firefox › Multiprocess Leftovers › Message Manager › Limitations of frame scripts

to or read from the disk from a frame script, in particular, the profile directory.
...ator <need more examples> places api the places api can't be used inside a frame script.

Performance

Mozilla › Firefox › Multiprocess Leftovers › Message Manager › Performance

te-configuration", function(message) { maincopy = message.data.newconfig; }) funtion getmaincopy() { return maincopy; } // framescript.js components.utils.import("resource://my-addon/processmodule.jsm") // getmaincopy() used by other functions don't register observers (and other callbacks to global services) in a frame script bad: //framescript.js services.obs.addobserver("document-element-inserted", { observe: function(doc, topic, data) { if(doc.ownerglobal.top != content) return; // bail out if this is for another tab decoratedocument(doc); } }) observer notifications get fired for events that happen anywhere in the browser, they are not scoped to the current tab.
...script("resources://my-addon/processcript.js"); services.mm.broadcastasyncmessage("my-addon:unload"); services.ppmm.broadcastasyncmessage("my-addon:unload"); } in the frame/process scripts: remove all kinds of listeners remove observer notifications remove custom categories and services nuke sandboxes unload jsms restore content dom states where necessary, e.g.

Message manager overview

Mozilla › Firefox › Multiprocess Leftovers › Types of message manager

er window.
...r> using the global message manager, but then send a message to the script instance loaded into a specific <browser> using the browser message manager.

Tracking Protection

Mozilla › Firefox › Privacy › Tracking Protection

op and firefox for android include built-in tracking protection.
...king protection.

Security best practices for Firefox front-end engineers

Mozilla › Firefox › Security best practices for Firefox front-end engi

vileged chrome code, we sanitize all html fragments that are created for chrome-privileged documents.
...ll dom apis that take a string and parse it into a dom tree.

::-moz-tree-row

Mozilla › Gecko › Chrome › CSS › ::-moz-tree-row

non-standard this feature is non-standard and is not on a standards track.
... non-standard this feature is non-standard and is not on a standards track.

overflow-clip-box

Mozilla › Gecko › Chrome › CSS › overflow-clip-box

erflow-clip-box: unset; note: on gecko, by default, padding-box is used everywhere, but <input type="text"> and similar use the value content-box.
...l <div class="things"> <input value="abcdefghijklmnopqrstuvwxyzÅÄÖ" class="scroll padding-box"> <div class="scroll padding-box"><span>abcdefghijklmnopqrstuvwxyzÅÄÖ</span></div> </div> css .scroll { overflow: auto; padding: 0 30px; width: 6em; border: 1px solid black; background: lime content-box; } .padding-box { overflow-clip-box: padding-box; } js function scrollsomeelements() { var elms = document.queryselectorall('.scroll'); for (i=0; i < elms.length; ++i) { elms[i].scrollleft=80; } } var elt = document.queryelementsbytagname('body')[0]; elt.addeventlistener("load", scrollsomeelements, false); result specifications this property has been proposed to the w3c csswg; it is not yet on the standard track but, if accepted, should appear in css overflow ...

HTTP Cache

Mozilla › HTTP cache

sed to map the storage scope is based on the arguments of nsiloadcontextinfo.
...he scope is belonging to an anonymous load b - when present the scope is in browser element load i - when present must have a decimal integer value that represents an app id the scope belongs to, otherwise there is no app (app id is considered 0) p - when present the scope is of a private browsing load, this never persists cachestorageservice keeps a global hashtable mapped by the scope key.

How to implement a custom autocomplete search component

Mozilla › How to implement custom autocomplete search component

the xul textbox element supports an autocomplete mechanism that is used to create a textbox with a popup containing a list of possible completions for what the user has started to type.
...param previousresult - a previous result to use for faster searchinig * @param listener - a listener to notify when the search is complete */ startsearch: function(searchstring, searchparam, result, listener) { // this autocomplete source assumes the developer attached a json string // to the the "autocompletesearchparam" attribute or "searchparam" property // of the <textbox> element.

IPDL Tutorial

Mozilla › IPDL › Tutorial

hild: rpc init(nscstring pluginpath) returns (bool ok); // this part creates constructor messages rpc pplugininstance(nscstring type, nscstring[] args) returns (int rv); }; // ----- file pplugininstance.ipdl include protocol pplugin; rpc protocol pplugininstance { manager pplugin; child: rpc __delete__(); setsize(int width, int height); }; this example has several new elements: `include protocol` imports another protocol declaration into this file.
... process.

Introduction to Layout in Mozilla

Mozilla › Introduction to Layout in Mozilla

d walk-through incrementalism future tech-talks wrap-up, q&a basic data flow source document arrives via network apis incrementally “pumped” through the single-threaded layout engine parse, compute style, render; repeat css used for rendering all content content theoretically separate from “presentation” key data structures content node elements, attributes, leaves dom frame rectangular formatting primitive geometric information [0..n] per content node 2nd thru nth are “continuations” style context non-geometric information may be shared by adjacent frames reference counted, owned by frame view clipping, z-order, transparency [0..1] per f...
... content arrives from network via nsistreamlistener::ondataavailable parser tokenizes & processes content; invokes methods on nsicontentsink with parser node objects some buffering and fixup occurs here opencontainer, closecontainer, addleaf content sink creates and attaches content nodes using nsicontent interface content sink maintains stack of “live” elements more buffering and fixup occurs here insertchildat, appendchildto, removechildat frame construction content sink uses nsidocument interface to notify of Δs in content model contentappended, contentinserted, contentremoved presshell is registered as document observer receives contentappended, etc.

Dict.jsm

Mozilla › JavaScript code modules › Dict.jsm

ys(); array listvalues(); void set(string akey, object avalue); string tojson(); string tostring(); properties attribute type description count number the number of items in the dictionary.
...s(); void set(string akey, object avalue); string tojson(); string tostring(); properties attribute type description count number the number of items in the dictionary.

Mozilla Content Localized in Your Language

Mozilla › Localization › L10n Style Guide › Mozilla Content Localized in Your Language

ry] name convention what are the order of family name and given name in your language.
... "select all", etc.

Basics

Mozilla › MathML Project › Basics

msup> <mi>y</mi> <mn>4</mn> </msup> </mrow> <mo>+</mo> <msup> <mi>y</mi> <mn>5</mn> </msup> </mrow> </maction> </mtd> </mtr> </mtable> </mtd> </mtr> </mtable> </math> </div> css content .control { text-decoration: none; font-weight: bold; font-size: 200%; } input { color: red; } [class="inputmath"] { border: 1px dotted; } javascript content function setselection(id,value) { document.getelementbyid(id).setattribute("selection",value); } function expand() { setselection("a11","2"); setselection("a12","2"); setselection("a13","2"); setselection("a21","2"); setselection("a22","2"); setselection("a23","2"); setselection("a31","2"); setselection("a32","2"); setselection("a33","2"); setselection("a41","2"); setselection("a42","2"); setselection("a43","2"); } function unexpand(...
...} function unexpand() { setselection("a11","1"); setselection("a12","1"); setselection("a13","1"); setselection("a21","1"); setselection("a22","1"); setselection("a23","1"); setselection("a31","1"); setselection("a32","1"); setselection("a33","1"); setselection("a41","1"); setselection("a42","1"); setselection("a43","1"); } function incrementinput(inputid, increment) { var inputelement = document.getelementbyid(inputid); var size = parseint(inputelement.size) + increment; if (size <= 0) size = 1 inputelement.size = size; } and there could be more...

Extras

Mozilla › MathML Project › Extras

mathml extras this is a technology demonstration of some of the extras in mozilla but not defined in the mathml spec, and not prevented by the spec either.
...n</mi> <mo>!</mo> </mrow> </mfrac> </mrow> </math> </foreignobject> <text>exp(α)</text> </switch> </g> </g> </svg> </div> inline javascript html content <math display="block"> <mfrac> <mtext id="num">mouse</mtext> <mtext id="denum">over</mtext> </mfrac> </math> javascript content function whoistherealert(evt) { alert("who is there?"); } function attachlistener(id) { document.getelementbyid(id).addeventlistener("mouseover", whoistherealert); } function init() { attachlistener("num"); attachlistener("denum"); } window.addeventlistener("load", init); ...

Fonts for Mozilla 2.0's MathML engine

Mozilla › MathML Project › FontsMozilla2

files are served with the correct mime type.
...de the mathml-fonts/resource/mathml.css style sheet in your web pages, for example by adding the following rule to the default style sheet of your web site: @import url('/path/to/resource/mathml.css'); browsers have default font-families in their user agent stylesheets.

MathML3Testsuite

Mozilla › MathML Project › MathML3Testsuite

clude on the success/failure of the test.
...the test.

Using the viewport meta tag to control layout on mobile browsers

Mozilla › Mobile › Viewport meta tag

e the following: <meta name="viewport" content="width=device-width, initial-scale=1"> the width property controls the size of the viewport.
...re.

Power profiling overview

Mozilla › Performance › Power profiling overview

x to see if firefox has improved or worsened over time on a particular workload.
... measurements, especially activity monitor's "energy impact".

ui.tooltipDelay

Mozilla › Preferences › Preference reference › ui.tooltipDelay

ui.tooltipdelay stores the delay in milliseconds between the mouse stopping over an element and the appearing of its tooltip.
...r an element and the appearing of its tooltip.

Preference reference

Mozilla › Preferences › Preference reference

accessibility.tabfocusthe preference accessibility.tabfocus controls what elements receive focus when the user presses the tab key.browser.altclicksavethe preference browser.altclicksave controls whether clicking a link while holding the alt key starts the download of that link.browser.dom.window.dump.enabledthis setting enables the dump function, which sends messages to the system console.
...ectbackgroundui.textselectbackground saves the color in which the background of a text selection in the user interface or in content will be styled.ui.textselectforegroundui.textselectforeground saves the color in which the text of a text selection in the user interface or the content will be styled.ui.tooltipdelayui.tooltipdelay stores the delay in milliseconds between the mouse stopping over an element and the appearing of its tooltip.view_source.syntax_highlightthe preference view_source.syntax_highlight controls whether markup in the view source view is syntax highlighted.

Preferences system

Mozilla › Preferences › Preferences system

this document describes toolkit's preferences system.
...: prefwindow | prefpane | preferences | preference | xul attributes use code for a typical preferences window may look like this: <prefwindow id="apppreferences" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <prefpane id="pane1" label="&pane1.title;"> <preferences> <preference id="pref1" name="pref.name" type="bool"/> </preferences> ..

PR_Calloc

Mozilla › Projects › NSPR › Reference › PR CALLOC

allocates zeroed memory from the heap for a number of objects of a given size.
... allocates zeroed memory from the heap for a number of objects of a given size.

PR_Poll

Mozilla › Projects › NSPR › Reference › PR Poll

detects when i/o is ready for a set of socket file descriptors.
... detects when i/o is ready for a set of socket file descriptors.

Rhino overview

Mozilla › Projects › Rhino › Overview

for all versions before 1.3.
...ng and object.prototype.tostring version 1.2 only returns array or object literal notation ("[1]" or "{a:1, b:2}" for example).

Performance Hints

Mozilla › Projects › Rhino › Performance

s is not equivalent code because the second version does not modify global variables result and i.
...e or take a list of initial elements.

Garbage collection

Mozilla › Projects › SpiderMonkey › Internals › Garbage collection

chunkinfo contains a list of unallocated arenas, starting at chunkinfo::freearenashead and linked through arenaheader::next.
...tains a list of unallocated arenas, starting at chunkinfo::freearenashead and linked through arenaheader::next.

JS_ConstructObject

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS ConstructObject

.
...d int (only in js_constructobjectwitharguments) the number of arguments to pass to the constructor.

JS_DumpNamedRoots

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS DumpNamedRoots

*data) { for each (root in rt->namedroots) dump(root.name, root.address, data); } callback syntax dump is a pointer to a function provided by the application.
...s a pointer to a function provided by the application.

JS_GetArrayLength

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS GetArrayLength

retrieve the number of elements in an array object.
...ger.

JS_LookupProperty

Mozilla › Projects › SpiderMonkey › JSAPI reference › JS LookupProperty

*name, js::mutablehandlevalue vp); bool js_lookupucproperty(jscontext *cx, js::handleobject obj, const char16_t *name, size_t namelen, js::mutablehandlevalue vp); bool js_lookuppropertybyid(jscontext *cx, js::handleobject obj, js::handleid id, js::mutablehandlevalue vp); // added in spidermonkey 1.8.1 bool js_lookupelement(jscontext *cx, js::handleobject obj, uint32_t index, js::mutablehandlevalue vp); // ---- obsolete since spidermonkey 31 ---- bool js_lookuppropertywithflags(jscontext *cx, js::handleobject obj, const char *name, unsigned flags, js::mutablehandlevalue vp); bool js_lookuppropertywithflagsbyid(jscontext *cx, js::handleobject obj, js::handleid id, ...
...okupucproperty) the length of name in characters; or -1 to indicate that name is null-terminated.

Web Replay

Mozilla › Projects › WebReplay

cts collected, may differ.
... buffers as atomic (probably unacceptable overhead) or performing all accesses on the buffer on a single core and keeping track of context switches.

Gecko events

Mozilla › Tech › Accessibility › AT-APIs › Gecko › Events

as received the keyboard focus.
... been added to the selection.

Feed content access API

Mozilla › Tech › Feed content access API

firefox 2 and thunderbird 2 introduce a series of interfaces that make it easy for extension authors to access rss and atom feeds.
...+ "</h1><p>"); var itemarray = feed.items; var numitems = itemarray.length; // write the article information if (!numitems) { doc.write("<i>no news is good news!</i>"); } else { var i; var theentry; var theurl; var info; for (i=0; i<numitems; i++) { theentry = itemarray.queryelementat(i, components.interfaces.nsifeedentry); if (theentry) { theurl = doc.write('<b><a href="' + theentry.link.resolve("") + '">' + theentry.title.text + '</a></b><br>'); if (theentry.summary) { info = theentry.summary.text + "<p><hr><p>"; } else { info = theentry.content.text + "<p><hr...

Places utilities for JavaScript

Mozilla › Tech › Places › Places utilities for JavaScript

pen the node in the browser, false otherwise.
...ngforfolder(int afolderid) parameters afolderid the folder id to get a query for.

Components.classes

Mozilla › Tech › XPCOM › Language Bindings › Components.classes

reviously installed and registered with the component manager using contractids.
...a given add-on component with a given contractid will be present on one machine but not have been installed on another machine.

Components.results

Mozilla › Tech › XPCOM › Language Bindings › Components.results

ts.results is a read-only object whose properties are the names listed as the first parameters of the macros in js/xpconnect/src/xpc.msg (also at table of errors), with the value of each corresponding to that constant's value.
... value.

Observer Notifications

Mozilla › Tech › XPCOM › Observer Notifications

indow origin sent immediately after a web content document window has been set up, but before any script code has been executed.
...has been set up, but before any script code has been executed.

nsIAccessibleHyperLink

Mozilla › Tech › XPCOM › Reference › Interface › nsIAccessibleHyperLink

ehyperlink interface of the object that owns this hyperlink.
... work on aria links.

nsIAppShellService

Mozilla › Tech › XPCOM › Reference › Interface › nsIAppShellService

ey 1.0) exit the event loop, shut down the app.
...t32 aferocity ); parameters aferocity one of the e* constants.

nsIContentSecurityPolicy

Mozilla › Tech › XPCOM › Reference › Interface › nsIContentSecurityPolicy

rameters achannel sendreports() manually triggers violation report sending given a uri and reason.
... this value should not be cached.

nsIContentView

Mozilla › Tech › XPCOM › Reference › Interface › nsIContentView

e content view whose contents are actually drawn by a separate process; this is part of the electrolysis multi-process support framework.
...of the electrolysis multi-process support framework.

nsIDOMMozNetworkStatsManager

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMMozNetworkStatsManager

er a network statistics request made when calling getsamples().
... used to filter network stats by app.

nsIDOMSerializer

Mozilla › Tech › XPCOM › Reference › Interface › nsIDOMSerializer

ance, use: var domserializer = components.classes["@mozilla.org/xmlextras/xmlserializer;1"] .createinstance(components.interfaces.nsidomserializer); method overview void serializetostream(in nsidomnode root, in nsioutputstream stream, in autf8string charset); astring serializetostring(in nsidomnode root); methods serializetostream() the subtree rooted by the specified element is serialized to a byte stream using the character set specified.
...set ); parameters root the root of the subtree to be serialized.

nsIDirectoryEnumerator

Mozilla › Tech › XPCOM › Reference › Interface › nsIDirectoryEnumerator

ng the directory when the enumeration is complete.
... introduced gecko 1.8 inherits from: nsisupports last changed in gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) method overview void close(); attributes attribute type description nextfile nsifile the next file in the sequence.

nsIFeedPerson

Mozilla › Tech › XPCOM › Reference › Interface › nsIFeedPerson

toolkit/components/feeds/public/nsifeedperson.idlscriptable this interface describes an author of or a contributor to an rss or atom feed.
...erits from: nsifeedelementbase last changed in gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) attributes attribute type description email astring the person's email address.

nsIFile

Mozilla › Tech › XPCOM › Reference › Interface › nsIFile

edesc(in long flags, in long mode); void renameto(in nsifile newparentdir, in astring newname); void remove(in boolean recursive); void reveal(); void setrelativedescriptor(in nsifile fromfile, in acstring relativedesc); attributes attribute type description directoryentries nsisimpleenumerator returns an enumeration of the elements in a directory.
...ode); void renameto(in nsifile newparentdir, in astring newname); void remove(in boolean recursive); void reveal(); void setrelativedescriptor(in nsifile fromfile, in acstring relativedesc); attributes attribute type description directoryentries nsisimpleenumerator returns an enumeration of the elements in a directory.

nsILoginManagerStorage

Mozilla › Tech › XPCOM › Reference › Interface › nsILoginManagerStorage

for which password saving is disabled.
... for its nsiloginmetainfo data) to be removed.

Building an Account Manager Extension

Mozilla › Tech › XPCOM › Reference › Interface › nsIMsgAccountManagerExtension › Building an Account Manager Extension

create the xul and the property file for your new panel.
...and the property file for your new panel.

nsIMsgAccountManagerExtension

Mozilla › Tech › XPCOM › Reference › Interface › nsIMsgAccountManagerExtension

the nsimsgaccountmanagerextension interface is used to add a new panel to thunderbird's account manager.
... the nsimsgaccountmanagerextension interface is used to add a new panel to thunderbird's account manager.

nsISelectionPrivate

Mozilla › Tech › XPCOM › Reference › Interface › nsISelectionPrivate

beginnode beginoffset endnode endoffset these four parameters represent the range to compare against the selection.
...r the returned ranges are allowed to touch the input range rather than merely overlapping it.

nsIStringEnumerator

Mozilla › Tech › XPCOM › Reference › Interface › nsIStringEnumerator

xpcom/ds/nsistringenumerator.idlscriptable please add a summary to this article.
... xpcom/ds/nsistringenumerator.idlscriptable please add a summary to this article.

nsITaskbarPreviewController

Mozilla › Tech › XPCOM › Reference › Interface › nsITaskbarPreviewController

attached to a surface with the controller's width and height, the values of which are obtained immediately prior to calling this method.
...when it needs to draw the thumbnail in the taskbar's application preview window.

nsIWebBrowserPersist

Mozilla › Tech › XPCOM › Reference › Interface › nsIWebBrowserPersist

th encode_flags_lf_linebreaks and if neither is specified, the platform default format is used.
...ags_lf_linebreaks 1024 output with linefeed line breaks.

Reference Manual

Mozilla › Tech › XPCOM › Using nsCOMPtr › Reference Manual

ult.
...o type in code that looks like this: nscomptr<nsifoo> foo( do_queryinterface(createbar()) ); // oops!

Using the clipboard

Mozilla › Tech › XPCOM › Using the clipboard

tsstring(str), str.length * 2); the first line gets the transferring component which implements nsitransferable.
...; the first line gets the transferring component which implements nsitransferable.

XPIDL

Mozilla › Tech › XPIDL

wstring const char16_t* char16_t** string full unicode set permitted most of the time you don't want to use this type but astring.
...l, these properties also apply to typedefs.

Activity Manager examples

Mozilla › Thunderbird › Thunderbird extensions › HowTos › Activity Manager

ault implementation of nsiactivityprocess, nsiactivitywarning and nsiactivityevent are not sufficient for the activity initiator, activity developers can provide their own components to extend the capabilities.
...nd nsiactivityevent are not sufficient for the activity initiator, activity developers can provide their own components to extend the capabilities.

Zombie compartments

Mozilla › Zombie compartments

oxes │ │ │ │ └──0.00 mb (00.00%) ── text-runs │ │ │ ├──3.78 mb (00.76%) ++ js-compartment(https://www.google.de/?gws_rd=ssl) │ │ │ ├──0.51 mb (00.10%) ── style-sheets │ │ │ ├──0.33 mb (00.07%) -- dom │ │ │ │ ├──0.17 mb (00.04%) ── text-nodes │ │ │ │ ├──0.13 mb (00.03%) ── element-nodes │ │ │ │ ├──0.02 mb (00.00%) ── other │ │ │ │ ├──0.01 mb (00.00%) ── orphan-nodes │ │ │ │ └──0.00 mb (00.00%) ── event-targets │ │ │ └──0.00 mb (00.00%) ── property-tables │ │ └───5.93 mb (01.19%) -- js-zone(0x13ffa0000) │ │ ├──1.92 mb (00.39%) ── unused-gc-things ...
... see bug 700547 for examples.

CType

Mozilla › js-ctypes › js-ctypes reference › CType

turns a ctype representing the data type "pointer to this type".
...ype(the_type).

Streams - Plugins

Plugins › Guide › Streams

de sending the stream in file mode telling the plug-in when a stream is created to tell the plug-in instance when a new stream is created, the browser calls the npp_newstream method.
...ing the plug-in when a stream is created to tell the plug-in instance when a new stream is created, the browser calls the npp_newstream method.

Preferences System

this document describes toolkit's preferences system.
...: prefwindow | prefpane | preferences | preference | xul attributes use code for a typical preferences window may look like this: <prefwindow id="apppreferences" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <prefpane id="pane1" label="&pane1.title;"> <preferences> <preference id="pref1" name="pref.name" type="bool"/> </preferences> ..

DOM Property Viewer - Firefox Developer Tools

Tools › DOM Property Viewer

e browser window, with the dom property viewer activated.
...property viewer user interface dom tree the different properties of the dom are displayed as an expandable tree.

Dominators view - Firefox Developer Tools

Tools › Memory › Dominators view

are retaining the most memory.
...eeping the given node from being garbage-collected.

Open the Inspector - Firefox Developer Tools

Tools › Page Inspector › How to › Open the Inspector

there are two main ways to open the inspector: choose tools > web developer > inspector from the menu bar or the equivalent keyboard shortcut.
... there are two main ways to open the inspector: choose tools > web developer > inspector from the menu bar or the equivalent keyboard shortcut.

Page Inspector - Firefox Developer Tools

Tools › Page Inspector

your way around the inspector, here's a quick tour of the ui.
...ew out into its own pane, separate from the other tabs on the css pane — this is called 3-pane mode.

Frame rate - Firefox Developer Tools

Tools › Performance › Frame rate

rk the browser needs to do in order to update and repaint the screen.
...repaint the screen.

Settings - Firefox Developer Tools

Tools › Settings

lbox buttons this group of checkboxes determines which tools get an icon in the toolbox's toolbar.
...heckboxes determines which tools get an icon in the toolbox's toolbar.

Toolbox - Firefox Developer Tools

Tools › Tools Toolbox

rs docked to the bottom of the browser window, but you can also dock it to the right-hand side of the window, or make it a standalone window, using buttons in the toolbar.
...window, but you can also dock it to the right-hand side of the window, or make it a standalone window, using buttons in the toolbar.

View Source - Firefox Developer Tools

Tools › View source

rce if you context-click while the mouse is over some mathml, you'll see a context menu item labeled "view mathml source": click it to see the mathml source.
...le the mouse is over some mathml, you'll see a context menu item labeled "view mathml source": click it to see the mathml source.

ANGLE_instanced_arrays.drawArraysInstancedANGLE() - Web APIs

Web › API › ANGLE instanced arrays › drawArraysInstancedANGLE

the angle_instanced_arrays.drawarraysinstancedangle() method of the webgl api renders primitives from array data like the gl.drawarrays() method.
...rtex back to the first.

Animation.commitStyles() - Web APIs

Web › API › Animation › commitStyles

the commitstyles() method of the web animations api's animation interface commits the end styling state of an animation to the element being animated, even after that animation has been removed.
... the commitstyles() method of the web animations api's animation interface commits the end styling state of an animation to the element being animated, even after that animation has been removed.

Animation.finish() - Web APIs

Web › API › Animation › finish

se() method called), it sets the playback time to 0.
... finish() method and catch an invalidstate error.

Animation.finished - Web APIs

Web › API › Animation › finished

es the finished play state (that is, when it starts playing again), a new promise is created for this property.
...starts playing again), a new promise is created for this property.

Animation.oncancel - Web APIs

Web › API › Animation › oncancel

the oncancel property of the web animations api's animation interface is the event handler for the cancel event.
... from an element before it finishes playing creating a new animation that is initially idle does not trigger a cancel event on the new animation.

Animation.onfinish - Web APIs

Web › API › Animation › onfinish

* animation.playbackrate).
...ion to be called to handle the finish event, or null if no finish event handler is set.

Animation.onremove - Web APIs

Web › API › Animation › onremove

.queryselector('div'); document.body.addeventlistener('mousemove', evt => { let anim = divelem.animate( { transform: `translate(${ evt.clientx}px, ${evt.clienty}px)` }, { duration: 500, fill: 'forwards' } ); anim.commitstyles(); //anim.persist() anim.onremove = function() { console.log('animation removed'); } console.log(anim.replacestate); }); here we have a <div> element, and an event listener that fires the event handler code whenever the mouse moves.
...${evt.clienty}px)` }, { duration: 500, fill: 'forwards' } ); anim.commitstyles(); //anim.persist() anim.onremove = function() { console.log('animation removed'); } console.log(anim.replacestate); }); here we have a <div> element, and an event listener that fires the event handler code whenever the mouse moves.

Animation.pause() - Web APIs

Web › API › Animation › pause

ly playing) and the end time of the animation is positive infinity.
...e end time of the animation is positive infinity.

Animation.persist() - Web APIs

Web › API › Animation › persist

.queryselector('div'); document.body.addeventlistener('mousemove', evt => { let anim = divelem.animate( { transform: `translate(${ evt.clientx}px, ${evt.clienty}px)` }, { duration: 500, fill: 'forwards' } ); anim.commitstyles(); //anim.persist() anim.onremove = function() { console.log('animation removed'); } console.log(anim.replacestate); }); here we have a <div> element, and an event listener that fires the event handler code whenever the mouse moves.
...${evt.clienty}px)` }, { duration: 500, fill: 'forwards' } ); anim.commitstyles(); //anim.persist() anim.onremove = function() { console.log('animation removed'); } console.log(anim.replacestate); }); here we have a <div> element, and an event listener that fires the event handler code whenever the mouse moves.

Animation.replaceState - Web APIs

Web › API › Animation › replaceState

.queryselector('div'); document.body.addeventlistener('mousemove', evt => { let anim = divelem.animate( { transform: `translate(${ evt.clientx}px, ${evt.clienty}px)` }, { duration: 500, fill: 'forwards' } ); anim.commitstyles(); //anim.persist() anim.onremove = function() { console.log('animation removed'); } console.log(anim.replacestate); }); here we have a <div> element, and an event listener that fires the event handler code whenever the mouse moves.
...${evt.clienty}px)` }, { duration: 500, fill: 'forwards' } ); anim.commitstyles(); //anim.persist() anim.onremove = function() { console.log('animation removed'); } console.log(anim.replacestate); }); here we have a <div> element, and an event listener that fires the event handler code whenever the mouse moves.

Animation.startTime - Web APIs

Web › API › Animation › startTime

t time in milliseconds, or null if no time is set.
...hange this value to make the animation start at a different time.

AudioDestinationNode.maxChannelCount - Web APIs

Web › API › AudioDestinationNode › maxChannelCount

in offlineaudiocontext, the channel count cannot be changed.
...xt, the channel count cannot be changed.

AudioDestinationNode - Web APIs

Web › API › AudioDestinationNode

handle.
... specific method; inherits methods from its parent, audionode.

AudioNode.connect() - Web APIs

Web › API › AudioNode › connect

des repeatedly) and there are no delaynodes in the cycle to prevent the resulting waveform from getting stuck constructing the same audio frame indefinitely.
...ent the resulting waveform from getting stuck constructing the same audio frame indefinitely.

AudioParam.setValueAtTime() - Web APIs

Web › API › AudioParam › setValueAtTime

he audioparam will change to at the given time.
...ew audiocontext(); // set basic variables for example var myaudio = document.queryselector('audio'); var pre = document.queryselector('pre'); var myscript = document.queryselector('script'); pre.innerhtml = myscript.innerhtml; var targetattimeplus = document.queryselector('.set-target-at-time-plus'); var targetattimeminus = document.queryselector('.set-target-at-time-minus'); // create a mediaelementaudiosourcenode // feed the htmlmediaelement into it var source = audioctx.createmediaelementsource(myaudio); // create a gain node and set it's gain value to 0.5 var gainnode = audioctx.creategain(); gainnode.gain.value = 0.5; var currgain = gainnode.gain.value; // connect the audiobuffersourcenode to the gainnode // and the gainnode to the destination source.connect(gainnode); gainnode.connect...

AudioScheduledSourceNode: ended event - Web APIs

Web › API › AudioScheduledSourceNode › ended event

dsourcenode has stopped playing, either because it's reached a predetermined stop time, the full duration of the audio has been performed, or because the entire buffer has been played.
....

AudioTrack.id - Web APIs

Web › API › AudioTrack › id

the id property contains a string which uniquely identifies the track represented by the audiotrack.
...method to locate a specific track within the media associated with a media element.

AudioTrackList.onchange - Web APIs

Web › API › AudioTrackList › onchange

t; the event doesn't provide any additional information.
...te of the track.

BiquadFilterNode.getFrequencyResponse() - Web APIs

Web › API › BiquadFilterNode › getFrequencyResponse

d, one containing the input frequencies, and two to receive the output magnitude and phase values: var myfrequencyarray = new float32array(5); myfrequencyarray[0] = 1000; myfrequencyarray[1] = 2000; myfrequencyarray[2] = 3000; myfrequencyarray[3] = 4000; myfrequencyarray[4] = 5000; var magresponseoutput = new float32array(5); var phaseresponseoutput = new float32array(5); next we create a <ul> element in our html to contain our results, and grab a reference to it in our javascript: <p>biquad filter frequency response for: </p> <ul class="freq-response-output"> </ul> var freqresponseoutput = document.queryselector('.freq-response-output'); finally, after creating our biquad filter, we use getfrequencyresponse() to generate the response data and put it in our arrays, then loop through each da...
...bottom of the page: var biquadfilter = audioctx.createbiquadfilter(); biquadfilter.type = "lowshelf"; biquadfilter.frequency.value = 1000; biquadfilter.gain.value = range.value; ...

Blob.type - Web APIs

Web › API › Blob › type

ect returns the mime type of the file.
... a domstring containing the file's mime type, or an empty string if the type could not be determined.

Blob - Web APIs

Web › API › Blob

t url.
... as the value of the <img> element's src attribute (assuming the data contains an image, of course).

Body.text() - Web APIs

Web › API › Body › text

onse stream and reads it to completion.
... the getdata() function is run — with the link's data-page identifier passed to it as an argument — when one of the links is clicked.

CSSStyleDeclaration.cssText - Web APIs

Web › API › CSSStyleDeclaration › cssText

the csstext property of the cssstyledeclaration interface returns or sets the text of the element's inline style declaration only.
... the csstext property of the cssstyledeclaration interface returns or sets the text of the element's inline style declaration only.

CSSStyleDeclaration.length - Web APIs

Web › API › CSSStyleDeclaration › length

the read-only property returns an integer that represents the number of style declarations in this css declaration block.
...ns in this css declaration block.

CSSStyleDeclaration - Web APIs

Web › API › CSSStyleDeclaration

the cssstyledeclaration interface represents an object that is a css declaration block, and exposes style information and various style-related methods and properties.
... the cssstyledeclaration interface represents an object that is a css declaration block, and exposes style information and various style-related methods and properties.

CSSStyleSheet.insertRule() - Web APIs

Web › API › CSSStyleSheet › insertRule

with an invalidstateerror.
...param {array} rules accepts an array of json-encoded declarations * @example addstylesheetrules([ ['h2', // also accepts a second argument as an array of arrays instead ['color', 'red'], ['background-color', 'green', true] // 'true' for !important rules ], ['.myclass', ['background-color', 'yellow'] ] ]); */ function addstylesheetrules (rules) { var styleel = document.createelement('style'); // append <style> element to <head> document.head.appendchild(styleel); // grab style element's sheet var stylesheet = styleel.sheet; for (var i = 0; i < rules.length; i++) { var j = 1, rule = rules[i], selector = rule[0], propstr = ''; // if the second argument of a rule is an array of arrays, correct our variables.

CSS Object Model (CSSOM) - Web APIs

Web › API › CSS Object Model

event caretposition css csscharsetrule cssconditionrule csscounterstylerule cssfontfacerule cssfontfeaturevaluesmap cssfontfeaturevaluesrule cssgroupingrule cssimportrule csskeyframerule csskeyframesrule cssmarginrule cssmediarule cssnamespacerule csspagerule cssrule cssrulelist cssstyledeclaration cssstylesheet cssstylerule csssupportsrule cssvariablesmap cssviewportrule elementcssinlinestyle fontface fontfaceset fontfacesetloadevent geometryutils getstyleutils linkstyle medialist mediaquerylist mediaquerylistevent mediaquerylistlistener screen stylesheet stylesheetlist transitionevent several other interfaces are also extended by the cssom-related specifications: document, window, element, htmlelement, htmlimageelement, range, mouseevent, and svgelement...
...positionvalue cssrotate cssscale cssskew cssskewx cssskewy cssstylevalue csstransformcomponent csstransformvalue csstranslate cssunitvalue cssunparsedvalue cssvariablereferencevalue stylepropertymap stylepropertymapreadonly obsolete cssom interfaces cssprimitivevalue cssvalue cssvaluelist tutorials determining the dimensions of elements (it needs some updating as it was made in the dhtml/ajax era).

CSS Typed Object Model API - Web APIs

Web › API › CSS Typed OM API

the css typed object model api simplifies css property manipulation by exposing css values as typed javascript objects rather than strings.
...s property values that reference custom properties.

Cache.matchAll() - Web APIs

Web › API › Cache › matchAll

of all matching responses in the cache object.
...t.

CanvasRenderingContext2D.bezierCurveTo() - Web APIs

Web › API › CanvasRenderingContext2D › bezierCurveTo

2x the x-axis coordinate of the second control point.
...rol points are red and the start and end points are blue.

CanvasRenderingContext2D.clip() - Web APIs

Web › API › CanvasRenderingContext2D › clip

examples a simple clipping region this example uses the clip() method to create a clipping region according to the shape of a circular arc.
..., 100, 100); result specifying a path and a fillrule this example saves two rectangles to a path2d object, which is then made the current clipping region using the clip() method.

CanvasRenderingContext2D.closePath() - Web APIs

Web › API › CanvasRenderingContext2D › closePath

es closing a triangle this example creates the first two (diagonal) sides of a triangle using the lineto() method.
...stroke(); result closing just one sub-path this example draws a smiley face consisting of three disconnected sub-paths.

CanvasRenderingContext2D.createImageData() - Web APIs

Web › API › CanvasRenderingContext2D › createImageData

ata object this snippet creates a blank imagedata object using the createimagedata() method.
...edarray[20000] } filling a blank imagedata object this example creates and fills a new imagedata object with purple pixels.

CanvasRenderingContext2D.direction - Web APIs

Web › API › CanvasRenderingContext2D › direction

the canvasrenderingcontext2d.direction property of the canvas 2d api specifies the current text direction used to draw text.
...the text direction is inherited from the <canvas> element or the document as appropriate.

CanvasRenderingContext2D.ellipse() - Web APIs

Web › API › CanvasRenderingContext2D › ellipse

pse anticlockwise (counter-clockwise).
...(); ctx.ellipse(100, 100, 50, 75, math.pi / 4, 0, 2 * math.pi); ctx.stroke(); // draw the ellipse's line of reflection ctx.beginpath(); ctx.setlinedash([5, 5]); ctx.moveto(0, 200); ctx.lineto(200, 0); ctx.stroke(); result various elliptical arcs this example creates three elliptical paths with varying properties.

CanvasRenderingContext2D.fill() - Web APIs

Web › API › CanvasRenderingContext2D › fill

e algorithm by which to determine if a point is inside or outside the filling region.
... result specifying a path and a fillrule this example saves some intersecting lines to a path2d object.

CanvasRenderingContext2D.fillStyle - Web APIs

Web › API › CanvasRenderingContext2D › fillStyle

= gradient; ctx.fillstyle = pattern; options color a domstring parsed as css <color> value.
...ps to draw a grid of rectangles, each having a different fill color.

CanvasRenderingContext2D.fillText() - Web APIs

Web › API › CanvasRenderingContext2D › fillText

fied width.
...at in hand, we set the font to 50-pixel-tall "serif" (the user's default serif font), then call filltext() to draw the text "hello world," starting at the coordinates (50, 90).

CanvasRenderingContext2D.globalAlpha - Web APIs

Web › API › CanvasRenderingContext2D › globalAlpha

lly transparent) and 1.0 (fully opaque), inclusive.
... use a for loop to draw a series of circles with increasing radii.

CanvasRenderingContext2D.lineCap - Web APIs

Web › API › CanvasRenderingContext2D › lineCap

f lines are squared off at the endpoints.
...t "butt" option.

CanvasRenderingContext2D.lineDashOffset - Web APIs

Web › API › CanvasRenderingContext2D › lineDashOffset

note: lines are drawn by calling the stroke() method.
...100); ctx.lineto(300, 100); ctx.stroke(); result the line with a dash offset is drawn in red.

CanvasRenderingContext2D.lineJoin - Web APIs

Web › API › CanvasRenderingContext2D › lineJoin

ter" connected segments are joined by extending their outside edges to connect at a single point, with the effect of filling an additional lozenge-shaped area.
...nvas.getcontext('2d'); ctx.linewidth = 20; ctx.linejoin = 'round'; ctx.beginpath(); ctx.moveto(20, 20); ctx.lineto(190, 100); ctx.lineto(280, 20); ctx.lineto(280, 150); ctx.stroke(); result comparison of line joins the example below draws three different paths, demonstrating each of the three linejoin options.

CanvasRenderingContext2D.lineTo() - Web APIs

Web › API › CanvasRenderingContext2D › lineTo

syntax ctx.lineto(x, y); parameters x the x-axis coordinate of the line's end point.
... a line to (150, 100) ctx.stroke(); // render the path result drawing connected lines each call of lineto() (and similar methods) automatically adds to the current sub-path, which means that all the lines will all be stroked or filled together.

CanvasRenderingContext2D.measureText() - Web APIs

Web › API › CanvasRenderingContext2D › measureText

the canvasrenderingcontext2d.measuretext() method returns a textmetrics object that contains information about the measured text (such as its width, for example).
...thod returns a textmetrics object that contains information about the measured text (such as its width, for example).

CanvasRenderingContext2D.putImageData() - Web APIs

Web › API › CanvasRenderingContext2D › putImageData

rrors thrown notsupportederror thrown if any of the arguments is infinite.
...n that illustrates how putimagedata works putimagedata(ctx, imagedata, 150, 0, 50, 50, 25, 25); result data loss due to browser optimization due to the lossy nature of converting to and from premultiplied alpha color values, pixels that have just been set using putimagedata() might be returned to an equivalent getimagedata() as different values.

CanvasRenderingContext2D.quadraticCurveTo() - Web APIs

Web › API › CanvasRenderingContext2D › quadraticCurveTo

to(cpx, cpy, x, y); parameters cpx the x-axis coordinate of the control point.
...this example, the control point is red and the start and end points are blue.

CanvasRenderingContext2D.resetTransform() - Web APIs

Web › API › CanvasRenderingContext2D › resetTransform

ransform(); examples resetting the matrix this example draws a rotated rectangle after modifying the matrix, and then resets the matrix using the resettransform() method.
...ettransform(); result continuing with a regular matrix whenever you're done drawing transformed shapes, you should call resettransform() before rendering anything else.

CanvasRenderingContext2D.rotate() - Web APIs

Web › API › CanvasRenderingContext2D › rotate

n center point is always the canvas origin.
...his is done by applying the values of the shape's center coordinates in a negative direction.

CanvasRenderingContext2D.scale() - Web APIs

Web › API › CanvasRenderingContext2D › scale

<canvas id="canvas"></canvas> javascript the rectangle has a specified width of 8 and a height of 20.
... the context horizontally and scale(1, -1) to flip it vertically.

CanvasRenderingContext2D.setTransform() - Web APIs

Web › API › CanvasRenderingContext2D › setTransform

ter, matrix, representing a 2d transformation matrix to set (technically, a dommatrixinit object; any object will do as long as it contains the above components as properties).
...ngle both vertically (.2) and horizontally (.8).

CanvasRenderingContext2D.shadowColor - Web APIs

Web › API › CanvasRenderingContext2D › shadowColor

value.
... shadow's opacity is affected by the transparency level of its parent object (even when shadowcolor specifies a completely opaque value).

CanvasRenderingContext2D.strokeRect() - Web APIs

Web › API › CanvasRenderingContext2D › strokeRect

and negative to the left.
...0).

CanvasRenderingContext2D.strokeStyle - Web APIs

Web › API › CanvasRenderingContext2D › strokeStyle

radient; ctx.strokestyle = pattern; options color a domstring parsed as css <color> value.
...ors using loops in this example, we use two for loops and the arc() method to draw a grid of circles, each having a different stroke color.

CanvasRenderingContext2D.strokeText() - Web APIs

Web › API › CanvasRenderingContext2D › strokeText

width.
... in hand, we set the font to 50-pixel-tall "serif" (the user's default serif font), then call stroketext() to draw the text "hello world," starting at the coordinates (50, 90).

CanvasRenderingContext2D.textAlign - Web APIs

Web › API › CanvasRenderingContext2D › textAlign

.
...; ctx.filltext('right-aligned', x, 130); result direction-dependent text alignment this example demonstrates the two direction-dependent values of the textalign property: "start" and "end".

Compositing and clipping - Web APIs

Web › API › Canvas API › Tutorial › Compositing

ricted area.
...th and turn it into a clipping path instead of stroking or filling the path.

ChildNode.remove() - Web APIs

Web › API › ChildNode › remove

the childnode.remove() method removes the object from the tree it belongs to.
...thub.com/jserz/js_piece/blob/master/dom/childnode/remove()/remove().md (function (arr) { arr.foreach(function (item) { if (item.hasownproperty('remove')) { return; } object.defineproperty(item, 'remove', { configurable: true, enumerable: true, writable: true, value: function remove() { this.parentnode.removechild(this); } }); }); })([element.prototype, characterdata.prototype, documenttype.prototype]); specifications specification status comment domthe definition of 'childnode.remove' in that specification.

Clipboard.readText() - Web APIs

Web › API › Clipboard › readText

clipboard is empty, does not contain text, or does not include a textual representation among the datatransfer objects representing the clipboard's contents.
...ion among the datatransfer objects representing the clipboard's contents.

Console.dirxml() - Web APIs

Web › API › Console › dirxml

displays an interactive tree of the descendant elements of the specified xml/html element.
... displays an interactive tree of the descendant elements of the specified xml/html element.

console - Web APIs

Web › API › Console

the given label.
...nghand equivalents.

CredentialsContainer.create() - Web APIs

Web › API › CredentialsContainer › create

the create() method of the credentialscontainer interface returns a promise that resolves with a new credential instance based on the provided options, or null if no credential object can be created.
...s.

DOMParser - Web APIs

Web › API › DOMParser

note: xmlhttprequest can parse xml and html directly from a url-addressable resource, returning a document in its response property.
... null on unsupported types if ((new domparser()).parsefromstring("", "text/html")) { // text/html parsing is natively supported return; } } catch (ex) {} proto.parsefromstring = function(markup, type) { if (/^\s*text\/html\s*(?:;|$)/i.test(type)) { var doc = document.implementation.createhtmldocument(""); if (markup.tolowercase().indexof('<!doctype') > -1) { doc.documentelement.innerhtml = markup; } else { doc.body.innerhtml = markup; } return doc; } else { return nativeparse.apply(this, arguments); } }; }(domparser)); specifications specification status comment html living standardthe definition of 'dom parsing' in that specification.

DOMTokenList.add() - Web APIs

Web › API › DOMTokenList › add

the add() method of the domtokenlist interface adds the given token to the list.
... the add() method of the domtokenlist interface adds the given token to the list.

DOMTokenList.contains() - Web APIs

Web › API › DOMTokenList › contains

n — true if the underlying list contains the given token, otherwise false.
...t contains the given token, otherwise false.

DOMTokenList.entries() - Web APIs

Web › API › DOMTokenList › entries

the domtokenlist.entries() method returns an iterator allowing you to go through all key/value pairs contained in this object.
... the domtokenlist.entries() method returns an iterator allowing you to go through all key/value pairs contained in this object.

DOMTokenList.item() - Web APIs

Web › API › DOMTokenList › item

t interface returns an item in the list by its index.
...he list by its index.

DOMTokenList.keys() - Web APIs

Web › API › DOMTokenList › keys

the keys() method of the domtokenlist interface returns an iterator allowing to go through all keys contained in this object.
... the keys() method of the domtokenlist interface returns an iterator allowing to go through all keys contained in this object.

DOMTokenList.length - Web APIs

Web › API › DOMTokenList › length

the length read-only property of the domtokenlist interface is an integer representing the number of objects stored in the object.
... the length read-only property of the domtokenlist interface is an integer representing the number of objects stored in the object.

DOMTokenList.supports() - Web APIs

Web › API › DOMTokenList › supports

the supports() method of the domtokenlist interface returns true if a given token is in the associated attribute's supported tokens.
... supports() method of the domtokenlist interface returns true if a given token is in the associated attribute's supported tokens.

DOMTokenList.toggle() - Web APIs

Web › API › DOMTokenList › toggle

to toggle.
...olean that, if included, turns the toggle into a one way-only operation.

DOMTokenList.value - Web APIs

Web › API › DOMTokenList › value

the value property of the domtokenlist interface is a stringifier that returns the value of the list as a domstring, or clears and sets the list to the given value.
... the value property of the domtokenlist interface is a stringifier that returns the value of the list as a domstring, or clears and sets the list to the given value.

DOMTokenList.values() - Web APIs

Web › API › DOMTokenList › values

the values() method of the domtokenlist interface returns an iterator allowing developers to go through all values contained in the domtokenlist.
... the values() method of the domtokenlist interface returns an iterator allowing developers to go through all values contained in the domtokenlist.

DataTransfer.items - Web APIs

Web › API › DataTransfer › items

ows the use of the items and types properties.
...g=en> <title>examples of datatransfer.{types,items} properties</title> <meta content="width=device-width"> <style> div { margin: 0em; padding: 2em; } #target { border: 1px solid black; } </style> <script> function dragstart_handler(ev) { console.log("dragstart: target.id = " + ev.target.id); // add this element's id to the drag payload so the drop handler will // know which element to add to its tree ev.datatransfer.setdata("text/plain", ev.target.id); ev.datatransfer.effectallowed = "move"; } function drop_handler(ev) { console.log("drop: target.id = " + ev.target.id); ev.preventdefault(); // get the id of the target and add the moved element to the target's dom var data = ev.datatransfer.getdata("text"); ev.target.appendchild(document.getelementbyid(data)); // pr...

DataTransfer.types - Web APIs

Web › API › DataTransfer › types

ows the use of the types and items properties.
...g=en> <title>examples of datatransfer.{types,items} properties</title> <meta content="width=device-width"> <style> div { margin: 0em; padding: 2em; } #target { border: 1px solid black; } </style> <script> function dragstart_handler(ev) { console.log("dragstart: target.id = " + ev.target.id); // add this element's id to the drag payload so the drop handler will // know which element to add to its tree ev.datatransfer.setdata("text/plain", ev.target.id); ev.datatransfer.effectallowed = "move"; } function drop_handler(ev) { console.log("drop: target.id = " + ev.target.id); ev.preventdefault(); // get the id of the target and add the moved element to the target's dom var data = ev.datatransfer.getdata("text"); ev.target.appendchild(document.getelementbyid(data)); // pr...

DirectoryEntrySync - Web APIs

Web › API › DirectoryEntrySync

no_modification_allowed_err this is a permission issue.
... no_modification_allowed_err this is a permission issue.

Document.all - Web APIs

Web › API › Document › all

the document interface's read-only all property returns an htmlallcollection rooted at the document node.
... the document interface's read-only all property returns an htmlallcollection rooted at the document node.

Document.anchors - Web APIs

Web › API › Document › anchors

the document.
...>= 5) { dump("found too many anchors"); } the following is an example that auto populates a table of contents with every anchor on the page: <!doctype html> <html lang="en"> <head> <meta charset="utf-8" /> <title>test</title> <script> function init() { var toc = document.getelementbyid("toc"); var i, li, newanchor; for (i = 0; i < document.anchors.length; i++) { li = document.createelement("li"); newanchor = document.createelement('a'); newanchor.href = "#" + document.anchors[i].name; newanchor.innerhtml = document.anchors[i].text; li.appendchild(newanchor); toc.appendchild(li); } } </script> </head> <body onload="init()"> <h1>title</h1> <h2><a name="contents">contents</a></h2> <ul id="toc"></ul> <h2><a name="plants">plants</a></h2> <ol> <li>apples</li> ...

Document: animationcancel event - Web APIs

Web › API › Document › animationcancel event

might happen when the animation-name is changed such that the animation is removed, or when the animating node is hidden using css.
...hidden.

Document: animationiteration event - Web APIs

Web › API › Document › animationiteration event

n of a css animation ends, and another one begins.
...one.

Document: animationstart event - Web APIs

Web › API › Document › animationstart event

expired.
...quence).

Document: copy event - Web APIs

Web › API › Document › copy event

the copy event fires when the user initiates a copy action through the browser's user interface.
... bubbles yes cancelable yes interface clipboardevent event handler property oncopy the original target for this event is the element that was the intended target of the copy action.

Document.createAttribute() - Web APIs

Web › API › Document › createAttribute

the document.createattribute() method creates a new attribute node, and returns it.
...can be added to a particular element in this manner.

Document.createTouch() - Web APIs

Web › API › Document › createTouch

ch.radiusx.
... touch.radiusy.

Document.createTouchList() - Web APIs

Web › API › Document › createTouchList

; parameters touches zero or more touch objects.
...ts.

Document: cut event - Web APIs

Web › API › Document › cut event

the cut event is fired when the user has initiated a "cut" action through the browser's user interface.
...e.

Document: fullscreenerror event - Web APIs

Web › API › Document › fullscreenerror event

the fullscreenerror event is fired when the browser cannot switch to full-screen mode.
...r event is fired when the browser cannot switch to full-screen mode.

Document.getAnimations() - Web APIs

Web › API › Document › getAnimations

the getanimations() method of the document interface returns an array of all animation objects currently in effect whose target elements are descendants of the document.
...thod of the document interface returns an array of all animation objects currently in effect whose target elements are descendants of the document.

Document.head - Web APIs

Web › API › Document › head

the head read-only property of the document interface returns the <head> element of the current document.
... the head read-only property of the document interface returns the <head> element of the current document.

Document.images - Web APIs

Web › API › Document › images

the images read-only property of the document interface returns a collection of the images in the current html document.
... the images read-only property of the document interface returns a collection of the images in the current html document.

Document.importNode() - Web APIs

Web › API › Document › importNode

ox 29 / thunderbird 29 / seamonkey 2.26)), a shallow clone is defaulted instead of a deep clone.
...ep clone.

Document.links - Web APIs

Web › API › Document › links

the links read-only property of the document interface returns a collection of all <area> elements and <a> elements in a document with a value for the href attribute.
... the links read-only property of the document interface returns a collection of all <area> elements and <a> elements in a document with a value for the href attribute.

Document.onfullscreenerror - Web APIs

Web › API › Document › onfullscreenerror

the document.onfullscreenerror property is an event handler for the fullscreenerror event that is sent to the document when it fails to transition into full-screen mode after a prior call to element.requestfullscreen().
...t.

Document: paste event - Web APIs

Web › API › Document › paste event

the paste event is fired when the user has initiated a "paste" action through the browser's user interface.
... bubbles yes cancelable yes interface clipboardevent event handler property onpaste the original target for this event is the element that was the intended target of the paste action.

Document: transitioncancel event - Web APIs

Web › API › Document › transitioncancel event

the transitioncancel event is fired when a css transition is canceled.
...es yes cancelable no interface transitionevent event handler property globaleventhandlers.ontransitioncancel the original target for this event is the element that had the transition applied.

Document: transitionend event - Web APIs

Web › API › Document › transitionend event

as it finishes transitioning to the transitioned state, and when it fully reverts to the default or non-transitioned state.
...ared, there is no transition, and none of the transition events are fired.

Document: transitionrun event - Web APIs

Web › API › Document › transitionrun event

the transitionrun event is fired when a css transition is first created, i.e.
... begun.

Document: transitionstart event - Web APIs

Web › API › Document › transitionstart event

un is that transitionrun fires when the transition is created (i.e.
...les yes cancelable no interface transitionevent event handler property globaleventhandlers.ontransitionstart the original target for this event is the element that had the transition applied.

Document: wheel event - Web APIs

Web › API › Document › wheel event

eel event is implementation-specific, and doesn't necessarily dispatch a scroll event.
...ily dispatch a scroll event.

Document.write() - Web APIs

Web › API › Document › write

>write example</title> <script> function newcontent() { document.open(); document.write("<h1>out with the old, in with the new!</h1>"); document.close(); } </script> </head> <body onload="newcontent();"> <p>some original document content.</p> </body> </html> notes the text you write is parsed into the document's structure model.
...g document.write() in deferred or asynchronous scripts will be ignored and you'll get a message like "a call to document.write() from an asynchronously-loaded external script was ignored" in the error console.

Document.xmlVersion - Web APIs

Web › API › Document › xmlVersion

cified in the xml declaration (e.g., <?xml version="1.0"?>) or "1.0" if the declaration is absent.
...has been removed in dom level 4.

EffectTiming.direction - Web APIs

Web › API › EffectTiming › direction

the direction property of the web animations api dictionary effecttiming indicates an animation's playback direction along its timeline, as well as its behavior when it reaches the end of an iteration element.animate(), keyframeeffectreadonly(), and keyframeeffect() all accept an object of timing properties including direction.
...se" similar to "alternate", except the animation playback starts by going from the end of the animation sequence toward the beginning the first iteration, then goes forward during the second, and so forth.

EffectTiming.iterations - Web APIs

Web › API › EffectTiming › iterations

the web animations api dictionary effecttiming's iterations property specifies the number of times the animation should repeat.
...hen stops automatically.

EventTarget - Web APIs

Web › API › EventTarget

eventtarget is a dom interface implemented by objects that can receive events and may have listeners for them.
... eventtarget is a dom interface implemented by objects that can receive events and may have listeners for them.

File.getAsBinary() - Web APIs

Web › API › File › getAsBinary

is discouraged since it could be removed at any time.
...ary the getasbinary method allows to access the file's data in raw binary format.

File.getAsText() - Web APIs

Web › API › File › getAsText

is method is obsolete; you should use the filereader method readastext() instead.
... syntax var str = instanceoffile.getastext(encoding); parameters encoding a string indicating the encoding to use for the returned data.

File.lastModifiedDate - Web APIs

Web › API › File › lastModifiedDate

the file.lastmodifieddate read-only property returns the last modified date of the file.
...fieddate read-only property returns the last modified date of the file.

File - Web APIs

Web › API › File

the file interface provides information about files and allows javascript in a web page to access their content.
... the file interface provides information about files and allows javascript in a web page to access their content.

FileReader - Web APIs

Web › API › FileReader

the filereader object lets web applications asynchronously read the contents of files (or raw data buffers) stored on the user's computer, using file or blob objects to specify the file or data to read.
...applications asynchronously read the contents of files (or raw data buffers) stored on the user's computer, using file or blob objects to specify the file or data to read.

FileSystem - Web APIs

Web › API › FileSystem

l support ≤18prefixed notes full support ≤18prefixed notes prefixed implemented with the vendor prefix: webkitnotes edge only supports this api in drag-and-drop scenarios using the the datatransferitem.webkitgetasentry() method.
... ≤18prefixed notes full support ≤18prefixed notes prefixed implemented with the vendor prefix: webkitnotes edge only supports this api in drag-and-drop scenarios using the the datatransferitem.webkitgetasentry() method.

File and Directory Entries API support in Firefox - Web APIs

Web › API › File and Directory Entries API › Firefox support

filesystementry = window.filesystementry || window.entry; limitations in firefox next, let's look at limitations of the firefox implementation of the api.
...lesystementry || window.entry; limitations in firefox next, let's look at limitations of the firefox implementation of the api.

GeometryUtils - Web APIs

Web › API › GeometryUtils

the geometryutils interface provides different utility function to retrieve geometry information about dom nodes.
... the geometryutils interface provides different utility function to retrieve geometry information about dom nodes.

GlobalEventHandlers.onloadstart - Web APIs

Web › API › GlobalEventHandlers › GlobalEventHandlers.onloadstart

the onloadstart property sets and returns the event handler for the loadstart event.
... the onloadstart property sets and returns the event handler for the loadstart event.

GlobalEventHandlers.oncanplay - Web APIs

Web › API › GlobalEventHandlers › oncanplay

the oncanplay property of the globaleventhandlers mixin is the eventhandler for processing canplay events.
... the oncanplay property of the globaleventhandlers mixin is the eventhandler for processing canplay events.

GlobalEventHandlers.oncanplaythrough - Web APIs

Web › API › GlobalEventHandlers › oncanplaythrough

the oncanplaythrough property of the globaleventhandlers mixin is the eventhandler for processing canplaythrough events.
...canplaythrough property of the globaleventhandlers mixin is the eventhandler for processing canplaythrough events.

GlobalEventHandlers.ondurationchange - Web APIs

Web › API › GlobalEventHandlers › ondurationchange

the ondurationchange property of the globaleventhandlers mixin is the eventhandler for processing durationchange events.
... the ondurationchange property of the globaleventhandlers mixin is the eventhandler for processing durationchange events.

GlobalEventHandlers.onemptied - Web APIs

Web › API › GlobalEventHandlers › onemptied

the onemptied property sets and returns the event handler for the emptied event.
... the onemptied property sets and returns the event handler for the emptied event.

GlobalEventHandlers.onended - Web APIs

Web › API › GlobalEventHandlers › onended

the onended property of the globaleventhandlers mixin is the eventhandler for processing ended events.
... the onended property of the globaleventhandlers mixin is the eventhandler for processing ended events.

GlobalEventHandlers.onkeydown - Web APIs

Web › API › GlobalEventHandlers › onkeydown

s mixin is an eventhandler that processes keydown events.
...tax target.onkeydown = functionref; value functionref is a function name or a function expression.

GlobalEventHandlers.onkeypress - Web APIs

Web › API › GlobalEventHandlers › onkeypress

r certain keys.
...nkeypress = functionref; value functionref is a function name or a function expression.

GlobalEventHandlers.onkeyup - Web APIs

Web › API › GlobalEventHandlers › onkeyup

an eventhandler that processes keyup events.
... syntax target.onkeyup = functionref; value functionref is a function name or a function expression.

GlobalEventHandlers.onloadeddata - Web APIs

Web › API › GlobalEventHandlers › onloadeddata

the onloadeddata property of the globaleventhandlers mixin is the eventhandler for processing loadeddata events.
... the onloadeddata property of the globaleventhandlers mixin is the eventhandler for processing loadeddata events.

GlobalEventHandlers.onloadedmetadata - Web APIs

Web › API › GlobalEventHandlers › onloadedmetadata

the onloadedmetadata property of the globaleventhandlers mixin is the eventhandler for processing loadedmetadata events.
... the onloadedmetadata property of the globaleventhandlers mixin is the eventhandler for processing loadedmetadata events.

GlobalEventHandlers.onmousemove - Web APIs

Web › API › GlobalEventHandlers › onmousemove

d onmouseout event handlers.
...s.show = function(event) { node.textcontent = event.target.dataset.tooltip; node.removeattribute('hidden'); }; this.hide = function() { node.setattribute('hidden', ''); }; })(); const links = document.queryselectorall('a'); links.foreach(link => { link.onmouseover = tooltip.show; link.onmousemove = tooltip.follow; link.onmouseout = tooltip.hide; }); result draggable elements we also have an example available showing the use of the onmousemove event handler with draggable objects — view the example in action.

GlobalEventHandlers.onmousewheel - Web APIs

Web › API › GlobalEventHandlers › onmousewheel

the onmousewheel property sets and returns the event handler for the mousewheel event.
... the onmousewheel property sets and returns the event handler for the mousewheel event.

GlobalEventHandlers.onpause - Web APIs

Web › API › GlobalEventHandlers › onpause

the onpause property of the globaleventhandlers mixin is the eventhandler for processing pause events.
... the onpause property of the globaleventhandlers mixin is the eventhandler for processing pause events.

GlobalEventHandlers.onplaying - Web APIs

Web › API › GlobalEventHandlers › onplaying

the onplaying property of the globaleventhandlers mixin is the eventhandler for processing playing events.
... the onplaying property of the globaleventhandlers mixin is the eventhandler for processing playing events.

GlobalEventHandlers.onreset - Web APIs

Web › API › GlobalEventHandlers › onreset

object as its sole argument.
...xample logs the current event.timestamp whenever you reset the form.

GlobalEventHandlers.ontransitionend - Web APIs

Web › API › GlobalEventHandlers › ontransitionend

by changing the value of the transition-property attribute which applies to the target.
...he value of the transition-property attribute which applies to the target.

GlobalEventHandlers - Web APIs

Web › API › GlobalEventHandlers

the globaleventhandlers mixin describes the event handlers common to several interfaces like htmlelement, document, or window.
... add more event handlers in addition to the ones listed below.

contentDocument - Web APIs

Web › API › HTMLIFrameElement › contentDocument

if the iframe and the iframe's parent document are same origin, returns a document (that is, the active document in the inline frame's nested browsing context), else returns null.
...e document in the inline frame's nested browsing context), else returns null.

msClearEffects - Web APIs

Web › API › HTMLMediaElement › msClearEffects

non-standard this feature is non-standard and is not on a standards track.
...t use it on production sites facing the web: it will not work for every user.

msStereo3DPackingMode - Web APIs

Web › API › HTMLVideoElement › msStereo3DPackingMode

roduction sites facing the web: it will not work for every user.
...e stereo 3-d content packing as "topbottom", "sidebyside", or "none" for regular 2-d video.

msStereo3DRenderMode - Web APIs

Web › API › HTMLVideoElement › msStereo3DRenderMode

cing the web: it will not work for every user.
... to stereo display (if stereo-capable).

Dragging and Dropping Multiple Items - Web APIs

Web › API › HTML Drag and Drop API › Multiple items

output(" item " + i + ":\n"); var types = dt.moztypesat(i); for (var t = 0; t < types.length; t++) { output(" " + types[t] + ": "); try { var data = dt.mozgetdataat(types[t], i); output("(" + (typeof data) + ") : <" + data + " >\n"); } catch (ex) { output("<<error>>\n"); dump(ex); } } } } function output(text) { document.getelementbyid("output").textcontent += text; dump(text); } </script> </head> <body> <div id="output" style="min-height: 100px; white-space: pre; border: 1px solid black;" ondragenter="document.getelementbyid('output').textcontent = ''; event.stoppropagation(); event.preventdefault();" ondragover="event.stoppropagation(); event.preventdefault();" ondrop="event.stoppropagation(); event.pre...
...ut').textcontent = ''; event.stoppropagation(); event.preventdefault();" ondragover="event.stoppropagation(); event.preventdefault();" ondrop="event.stoppropagation(); event.preventdefault(); dodrop(event);"> <div> fix</div> </div> </body> </html> this example cancels both the dragenter and dragover events by calling the preventdefault().

Recommended Drag Types - Web APIs

Web › API › HTML Drag and Drop API › Recommended drag types

e text/uri-list type.
...; dt.mozsetdataat("image/png", stream, 0); dt.mozsetdataat("application/x-moz-file", file, 0); dt.setdata("text/uri-list", imageurl); dt.setdata("text/plain", imageurl); note the mozgetdataat() method is used for non-textual data.

Working with the History API - Web APIs

Web › API › History API › Working with the History API

r new history entry.
...roach, you need to encode all of the relevant data into a short string.

IIRFilterNode.getFrequencyResponse() - Web APIs

Web › API › IIRFilterNode › getFrequencyResponse

d, one containing the input frequencies, and two to receive the output magnitude and phase values: var myfrequencyarray = new float32array(5); myfrequencyarray[0] = 1000; myfrequencyarray[1] = 2000; myfrequencyarray[2] = 3000; myfrequencyarray[3] = 4000; myfrequencyarray[4] = 5000; var magresponseoutput = new float32array(5); var phaseresponseoutput = new float32array(5); next we create a <ul> element in our html to contain our results, and grab a reference to it in our javascript: <p>iir filter frequency response for: </p> <ul class="freq-response-output"> </ul> var freqresponseoutput = document.queryselector('.freq-response-output'); finally, after creating our filter, we use getfrequencyresponse() to generate the response data and put it in our arrays, then loop through each data set and...
...cients = [0.1, 0.2, 0.3, 0.4, 0.5]; var feedbackcoefficients = [0.5, 0.4, 0.3, 0.2, 0.1]; var iirfilter = audioctx.createiirfilter(feedforwardcoefficients, feedbackcoefficients); ...

IntersectionObserver.takeRecords() - Web APIs

Web › API › IntersectionObserver › takeRecords

the intersectionobserver method takerecords() returns an array of intersectionobserverentry objects, one for each targeted element which has experienced an intersection change since the last time the intersections were checked, either explicitly through a call to this method or implicitly by an automatic call to the observer's callback.
...tic call to the observer's callback.

KeyboardLayoutMap.has() - Web APIs

Web › API › KeyboardLayoutMap › has

the has() method of the keyboardlayoutmap interface returns a boolean indicating whether the object has an element with the specified key.
... the has() method of the keyboardlayoutmap interface returns a boolean indicating whether the object has an element with the specified key.

LayoutShift - Web APIs

Web › API › LayoutShift

the layoutshift interface of the layout instability api provides insights into the stability of web pages based on movements of the elements on the page.
...act fraction (fraction of the viewport that was shifted) times the distance fraction (distance moved as a fraction of viewport).

Location: hostname - Web APIs

Web › API › Location › hostname

the hostname property of the location interface is a usvstring containing the domain of the url.
... the hostname property of the location interface is a usvstring containing the domain of the url.

Location: href - Web APIs

Web › API › Location › href

f property of the location interface is a stringifier that returns a usvstring containing the whole url, and allows the href to be updated.
...r that returns a usvstring containing the whole url, and allows the href to be updated.

Location: pathname - Web APIs

Web › API › Location › pathname

the pathname property of the location interface is a usvstring containing an initial '/' followed by the path of the url (or the empty string if there is no path).
... the pathname property of the location interface is a usvstring containing an initial '/' followed by the path of the url (or the empty string if there is no path).

Location: port - Web APIs

Web › API › Location › port

the port property of the location interface is a usvstring containing the port number of the url.
... the port property of the location interface is a usvstring containing the port number of the url.

Location: protocol - Web APIs

Web › API › Location › protocol

the protocol property of the location interface is a usvstring representing the protocol scheme of the url, including the final ':'.
... the protocol property of the location interface is a usvstring representing the protocol scheme of the url, including the final ':'.

Location: search - Web APIs

Web › API › Location › search

ring, also called a query string; that is, a usvstring containing a '?' followed by the parameters of the url.
...ng containing a '?' followed by the parameters of the url.

Location: toString() - Web APIs

Web › API › Location › toString

the tostring() stringifier method of the location interface returns a usvstring containing the whole url.
... the tostring() stringifier method of the location interface returns a usvstring containing the whole url.

MSCandidateWindowHide - Web APIs

Web › API › MSCandidateWindowHide

stener("mscandidatewindowhide", handler, usecapture) nbsp; parameters pevtobj [in] type: ihtmleventobj pointer to an ihtmleventobj interface for the current event.
...p; parameters pevtobj [in] type: ihtmleventobj pointer to an ihtmleventobj interface for the current event.

MSCandidateWindowUpdate - Web APIs

Web › API › MSCandidateWindowUpdate

mscandidatewindowupdate", handler, usecapture) parameters pevtobj [in] type: ihtmleventobj pointer to an ihtmleventobj interface for the current event.
...ers pevtobj [in] type: ihtmleventobj pointer to an ihtmleventobj interface for the current event.

MSManipulationEvent - Web APIs

Web › API › MSManipulationEvent

non-standard this feature is non-standard and is not on a standards track.
...b: it will not work for every user.

MediaDevices.getSupportedConstraints() - Web APIs

Web › API › MediaDevices › getSupportedConstraints

ints supported by the user agent are included in the list, each of these boolean properties has the value true.
...supported by your browser:</p> <ul id="constraintlist"> </ul> css body { font: 15px arial, sans-serif; } javascript let constraintlist = document.getelementbyid("constraintlist"); let supportedconstraints = navigator.mediadevices.getsupportedconstraints(); for (let constraint in supportedconstraints) { if (supportedconstraints.hasownproperty(constraint)) { let elem = document.createelement("li"); elem.innerhtml = "<code>" + constraint + "</code>"; constraintlist.appendchild(elem); } } result specifications specification status comment media capture and streamsthe definition of 'getsupportedconstraints()' in that specification.

MediaDevices - Web APIs

Web › API › MediaDevices

ssion through a prompt, turns on a camera and/or a microphone on the system and provides a mediastream containing a video track and/or an audio track with the input.
...ht.exact + ' px is not supported by your device.'); } else if (error.name === 'permissiondeniederror') { errormsg('permissions have not been granted to use your camera and ' + 'microphone, you need to allow the page access to your devices in ' + 'order for the demo to work.'); } errormsg('getusermedia error: ' + error.name, error); }); function errormsg(msg, error) { errorelement.innerhtml += '<p>' + msg + '</p>'; if (typeof error !== 'undefined') { console.error(error); } } specifications specification status comment media capture and streamsthe definition of 'mediadevices' in that specification.

MediaRecorder: dataavailable event - Web APIs

Web › API › MediaRecorder › dataavailable event

taavailable for details of the all the possible reasons this event may raise, see the documentation for the event handler property: ondataavailable.
...jecturl(blob); audio.src = audiourl; console.log("recorder stopped"); }); mediarecorder.addeventlistener('dataavailable', (event) => { chunks.push(event.data); }); ...

MediaStreamTrack: ended event - Web APIs

Web › API › MediaStreamTrack › ended event

sent.
...ler for the ended event, which changes an on-screen icon to indicate that the track is no longer active.

Media Capture and Streams API (Media Stream) - Web APIs

Web › API › Media Streams API

presents the smallest unit of a media stream, such as an audio signal associated with a given speaker, like left or right in a stereo audio track.
...d has as its source input one of the user's cameras or microphones.

MouseEvent.relatedTarget - Web APIs

Web › API › MouseEvent › relatedTarget

blue boxes.
...id="outer"> <div id="red"></div> <div id="blue"></div> </div> <p id="log"></p> </body> css #outer { width: 250px; height: 125px; display: flex; } #red { flex-grow: 1; background: red; } #blue { flex-grow: 1; background: blue; } #log { max-height: 120px; overflow-y: scroll; } javascript const mouseoutlog = document.getelementbyid('log'), red = document.getelementbyid('red'), blue = document.getelementbyid('blue'); red.addeventlistener('mouseover', overlistener); red.addeventlistener('mouseout', outlistener); blue.addeventlistener('mouseover', overlistener); blue.addeventlistener('mouseout', outlistener); function outlistener(event) { let related = event.relatedtarget ?

msRealTime - Web APIs

Web › API › MsRealTime

non-standard this feature is non-standard and is not on a standards track.
...lementations and the behavior may change in the future.

MutationObserver.disconnect() - Web APIs

Web › API › MutationObserver › disconnect

the mutationobserver method disconnect() tells the observer to stop watching for mutations.
... not yet reported to the observer, are discarded.

MutationObserverInit.attributeFilter - Web APIs

Web › API › MutationObserverInit › attributeFilter

be monitored for changes.
...ation) { switch(mutation.type) { case "attributes": switch(mutation.attributename) { case "status": userstatuschanged(mutation.target.username, mutation.target.status); break; case "username": usernamechanged(mutation.oldvalue, mutation.target.username); break; } break; } }); } var userlistelement = document.queryselector("#userlist"); var observer = new mutationobserver(callback); observer.observe(userlistelement, { attributefilter: [ "status", "username" ], attributeoldvalue: true, subtree: true }); the callback() function—which will be passed into the observe() method when starting the observer, looks at each item in the list of mutationrecord objects.

Using Navigation Timing - Web APIs

Web › API › Navigation timing API › Using Navigation Timing

et loadingtime = now - performance.timing.navigationstart; document.queryselector(".output").innertext = loadingtime + " ms"; }, false); this code, executed when the load event occurs, subtracts from the current time the time at which the navigation whose timing was recorded began (performance.timing.navigationstart), and outputs that information to the screen by inserting it into an element.
...ce.navigation object.

Navigator.clipboard - Web APIs

Web › API › Navigator › clipboard

syntax theclipboard = navigator.clipboard; value the clipboard object used to access the system clipboard.
...eryselector(".cliptext").innertext = cliptext); this snippet replaces the contents of the element whose class is "cliptext" with the text contents of the clipboard.

Online and offline events - Web APIs

Web › API › NavigatorOnLine › Online and offline events

or compatibility reasons.) by specifying ononline="..." or onoffline="..." attributes on the <body> tag in the html markup.
...ine="..." or onoffline="..." attributes on the <body> tag in the html markup.

Node.getRootNode() - Web APIs

Web › API › Node › getRootNode

tions optional an object that sets options for getting the root node.
...ean that indicates whether the shadow root should be returned (false, the default), or a root node beyond shadow root (true).

Node.isDefaultNamespace() - Web APIs

Web › API › Node › isDefaultNamespace

the node.isdefaultnamespace() method accepts a namespace uri as an argument and returns a boolean with a value of true if the namespace is the default namespace on the given node or false if not.
...ult namespace on the given node or false if not.

Node.nodeValue - Web APIs

Web › API › Node › nodeValue

ue of the current node.
...rns the content of the node.

Node.normalize() - Web APIs

Web › API › Node › normalize

the node.normalize() method puts the specified node and all of its sub-tree into a "normalized" form.
... the node.normalize() method puts the specified node and all of its sub-tree into a "normalized" form.

Node.ownerDocument - Web APIs

Web › API › Node › ownerDocument

the ownerdocument read-only property of the node interface returns the top-level document object of the node.
...ns the top-level document object of the node.

Node.parentNode - Web APIs

Web › API › Node › parentNode

the node.parentnode read-only property returns the parent of the specified node in the dom tree.
... the node.parentnode read-only property returns the parent of the specified node in the dom tree.

NodeIterator - Web APIs

Web › API › NodeIterator

ilter.show_cdata_section 8 shows cdatasection nodes.
... 8 shows cdatasection nodes.

NodeList.length - Web APIs

Web › API › NodeList › length

st.
...resenting the number of items in a nodelist.

OrientationSensor - Web APIs

Web › API › OrientationSensor

code is inconsistent with the policies set on your server.
... with the policies set on your server.

Path2D() - Web APIs

Web › API › Path2D › Path2D

(path); new path2d(d); parameters path optional when invoked with another path2d object, a copy of the path argument is created.
...(220, 60); path2.arc(170, 60, 50, 0, 2 * math.pi); ctx.stroke(path2); using svg paths this example creates a path2d path using svg path data.

Payment Request API - Web APIs

Web › API › Payment Request API

pay for goods and services on the web.
... web page creates a paymentrequest object in response to a user action that initiates a payment, such as clicking a "purchase" button.

PerformanceResourceTiming.initiatorType - Web APIs

Web › API › PerformanceResourceTiming › initiatorType

the initiatortype read-only property is a string that represents the type of resource that initiated the performance event.
... the initiatortype read-only property is a string that represents the type of resource that initiated the performance event.

Using the Performance API - Web APIs

Web › API › Performance API › Using the Performance API

starttime; var endtime; starttime = performance.now(); do_task(); endtime = performance.now(); return (endtime - starttime); } serializing the performance object json serialization of the performance object is done via the tojson() method.
...k(); endtime = performance.now(); return (endtime - starttime); } serializing the performance object json serialization of the performance object is done via the tojson() method.

PublicKeyCredentialCreationOptions.excludeCredentials - Web APIs

Web › API › PublicKeyCredentialCreationOptions › excludeCredentials

excludecredentials, an optional property of the publickeycredentialcreationoptions dictionary, is an array whose elements are descriptors for the public keys already existing for a given user.
...an optional property of the publickeycredentialcreationoptions dictionary, is an array whose elements are descriptors for the public keys already existing for a given user.

RTCDTMFToneChangeEvent.tone - Web APIs

Web › API › RTCDTMFToneChangeEvent › tone

the read-only property rtcdtmftonechangeevent.tone returns the dtmf character which has just begun to play, or an empty string ("").
...onebuffer is empty).

RTCDataChannel.label - Web APIs

Web › API › RTCDataChannel › label

.createdatachannel().
...b site or app when the data channel was created, as specified when rtcpeerconnection.createdatachannel() was called to create the channel.

RTCIceCandidatePair - Web APIs

Web › API › RTCIceCandidatePair

cal end of the connection.
...ibing the configuration of the remote end of the connection.

RTCIceTransport.getSelectedCandidatePair() - Web APIs

Web › API › RTCIceTransport › getSelectedCandidatePair

s possible for one of the configurations in the selected candidate pair to remain unchanged when a new pairing is chosen.
...idate pair to remain unchanged when a new pairing is chosen.

RTCIceTransport.onselectedcandidatepairchange - Web APIs

Web › API › RTCIceTransport › onselectedcandidatepairchange

lobal properties specify rtcicecandidate objects describing the local and remote candidates that are currently being used.
...he local and remote candidates that are currently being used.

RTCPeerConnection.getStats() - Web APIs

Web › API › RTCPeerConnection › getStats

rs while attempting to collect statistics.
...put; }); }, 1000); this works by calling getstats(), then, when the promise is resolved, iterates over the rtcstats objects on the returned rtcstatsreport.

RTCPeerConnection.onicegatheringstatechange - Web APIs

Web › API › RTCPeerConnection › onicegatheringstatechange

ing by looking at the value of the rtcpeerconnection.icegatheringstate property.
...n.

RTCRemoteOutboundRtpStreamStats.localId - Web APIs

Web › API › RTCRemoteOutboundRtpStreamStats › localId

he function returns null.
...ng this interval—framesdecoded—is determined by subtracting startrecord's framesdecoded from endrecord.framesdecoded.

RTCRtpReceiver.getStats() - Web APIs

Web › API › RTCRtpReceiver › getStats

is fulfilled once the statistics are available.
...report object containing the collected statistics.

RTCRtpSender.getStats() - Web APIs

Web › API › RTCRtpSender › getStats

available.
...d rtcstatsreport accumulates the statistics for all of the streams being sent using the rtcrtpsender, as well as the statistics for any dependencies those streams have.

Range.compareBoundaryPoints() - Web APIs

Web › API › Range › compareBoundaryPoints

oint of range.
...ndary-point of range.

Range.compareNode() - Web APIs

Web › API › Range › compareNode

range.end_to_end, noderange) == -1; if (nodeisbefore && !nodeisafter) return 0; if (!nodeisbefore && nodeisafter) return 1; if (nodeisbefore && nodeisafter) return 2; return 3; } syntax returnvalue = range.comparenode( referencenode ); parameters referencenode the node to compare with the range.
...turn 0; if (!nodeisbefore && nodeisafter) return 1; if (nodeisbefore && nodeisafter) return 2; return 3; } syntax returnvalue = range.comparenode( referencenode ); parameters referencenode the node to compare with the range.

Range.comparePoint() - Web APIs

Web › API › Range › comparePoint

other node types, offset is the number of child nodes between the start of the reference node.
...reference node.

Range.insertNode() - Web APIs

Web › API › Range › insertNode

to be added to a text node, that node is split at the insertion point, and the insertion occurs between the two text nodes.
...t nodes.

Range.intersectsNode() - Web APIs

Web › API › Range › intersectsNode

the range.intersectsnode() method returns a boolean indicating whether the given node intersects the range.
... the range.intersectsnode() method returns a boolean indicating whether the given node intersects the range.

Range.isPointInRange() - Web APIs

Web › API › Range › isPointInRange

given point is in the range.
... at offset within referencenode is within this range.

Range - Web APIs

Web › API › Range

or after the range.
...extualfragment() returns a documentfragment created from a given string of code.

ReadableStream.tee() - Web APIs

Web › API › ReadableStream › tee

the tee() method of the readablestream interface tees the current readable stream, returning a two-element array containing the two resulting branches as new readablestream instances.
... }) { // result objects contain two properties: // done - true if the stream has already given you all its data.

Request.mode - Web APIs

Web › API › Request › mode

value of the mode property for that request is set to cors.
...n by the request.request constructor, no-cors is typically used as the mode; for example, for embedded resources where the request is initiated from markup, unless the crossorigin attribute is present, the request is in most cases made using the no-cors mode — that is, for the <link> or <script> elements (except when used with modules), or <img>, <audio>, <video>, <object>, <embed>, or <iframe> elements.

ResizeObserver() - Web APIs

Web › API › ResizeObserver › ResizeObserver

the resizeobserver constructor creates a new resizeobserver object, which can be used to report changes to the content or border box of an element or the bounding box of an svgelement.
...n be used to report changes to the content or border box of an element or the bounding box of an svgelement.

format - Web APIs

Web › API › SVGAltGlyphElement › format

the svgaltglyphelement.format property is a domstring that defines the format of the given font.
... the svgaltglyphelement.format property is a domstring that defines the format of the given font.

SVGAnimatedPoints - Web APIs

Web › API › SVGAnimatedPoints

svg animated points interface the svganimatedpoints interface supports elements which have a points attribute which holds a list of coordinate values and which support the ability to animate that attribute.
... svg animated points interface the svganimatedpoints interface supports elements which have a points attribute which holds a list of coordinate values and which support the ability to animate that attribute.

SVGExternalResourcesRequired - Web APIs

Web › API › SVGExternalResourcesRequired

the svgexternalresourcesrequired interface defines an interface which applies to all elements where this element or one of its descendants can reference an external resource.
...ono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgexternalresourcesrequired</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} warning: this interface was removed in the svg 2 specification.

The 'X' property - Web APIs

Web › API › SVGRect › The X property

the x property describes the horizontal coordinate of the position of the element.
...r coordinate system that is the given distance from the origin of the user coordinate system along the relevant axis (the x-axis for x coordinates, the y-axis for y coordinates).

SVGTransformable - Web APIs

Web › API › SVGTransformable

svg transformable interface interface svgtransformable contains properties and methods that apply to all elements which have attribute transform.
...ve attribute transform.

SVGURIReference - Web APIs

Web › API › SVGURIReference

troke-width="2px" /><text x="76" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgurireference</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties svgurireference.href read only an svganimatedstring that represents the value of the href attribute, and, on elements that are defined to support it, the deprecated xlink:href attribute.
...nce</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties svgurireference.href read only an svganimatedstring that represents the value of the href attribute, and, on elements that are defined to support it, the deprecated xlink:href attribute.

ShadowRoot.delegatesFocus - Web APIs

Web › API › ShadowRoot › delegatesFocus

the delegatesfocus read-only property of the shadowroot interface returns a boolean that indicates whether delegatesfocus was set when the shadow was attached (see element.attachshadow()).
...boolean that indicates whether delegatesfocus was set when the shadow was attached (see element.attachshadow()).

ShadowRoot.innerHTML - Web APIs

Web › API › ShadowRoot › innerHTML

the innerhtml property of the shadowroot interface sets or returns a reference to the dom tree inside the shadowroot.
... the innerhtml property of the shadowroot interface sets or returns a reference to the dom tree inside the shadowroot.

ShadowRoot.mode - Web APIs

Web › API › ShadowRoot › mode

the mode property of the shadowroot specifies its mode — either open or closed.
... root’s implementation internals are inaccessible and unchangeable from javascript—in the same way the implementation internals of, for example, the <video> element are inaccessible and unchangeable from javascript.

SpeechSynthesis.getVoices() - Web APIs

Web › API › SpeechSynthesis › getVoices

synthesisvoice objects.
...= speechsynthesis.getvoices(); for(var i = 0; i < voices.length; i++) { var option = document.createelement('option'); option.textcontent = voices[i].name + ' (' + voices[i].lang + ')'; if(voices[i].default) { option.textcontent += ' -- default'; } option.setattribute('data-lang', voices[i].lang); option.setattribute('data-name', voices[i].name); document.getelementbyid("voiceselect").appendchild(option); } } populatevoicelist(); if (typeof speechsynthesis !== 'undefined' && speechsynthesis.onvoiceschanged !== undefined) { speechsynthesis.onvoiceschanged = populatevoicelist; } html <select id="voiceselect"></select> specifications specification status comment web speech apithe definition of 'getvoices()' in that specificat...

SpeechSynthesis: voiceschanged event - Web APIs

Web › API › SpeechSynthesis › voiceschanged event

voiceschanged examples this could be used to repopulate a list of voices that the user can choose between when the event fires.
...nt = voices[i].name + ' (' + voices[i].lang + ')'; option.setattribute('data-lang', voices[i].lang); option.setattribute('data-name', voices[i].name); voiceselect.appendchild(option); } }); or use the onvoiceschanged event handler property: synth.onvoiceschanged = function() { var voices = synth.getvoices(); for(i = 0; i < voices.length ; i++) { var option = document.createelement('option'); option.textcontent = voices[i].name + ' (' + voices[i].lang + ')'; option.setattribute('data-lang', voices[i].lang); option.setattribute('data-name', voices[i].name); voiceselect.appendchild(option); } } specifications specification status comment web speech apithe definition of 'speech synthesis events' in that specification.

SpeechSynthesis - Web APIs

Web › API › SpeechSynthesis

trieve a list of the voices available using speechsynthesis.getvoices() and populate a select menu with them so the user can choose what voice they want.
...eselect = document.queryselector('select'); var pitch = document.queryselector('#pitch'); var pitchvalue = document.queryselector('.pitch-value'); var rate = document.queryselector('#rate'); var ratevalue = document.queryselector('.rate-value'); var voices = []; function populatevoicelist() { voices = synth.getvoices(); for(i = 0; i < voices.length ; i++) { var option = document.createelement('option'); option.textcontent = voices[i].name + ' (' + voices[i].lang + ')'; if(voices[i].default) { option.textcontent += ' -- default'; } option.setattribute('data-lang', voices[i].lang); option.setattribute('data-name', voices[i].name); voiceselect.appendchild(option); } } populatevoicelist(); if (speechsynthesis.onvoiceschanged !== undefined) { speechsynt...

SpeechSynthesisUtterance - Web APIs

Web › API › SpeechSynthesisUtterance

a list of the voices available using speechsynthesis.getvoices() and populate a select menu with them so the user can choose what voice they want.
...ce selected in the <select> element, and start the utterance speaking via the speechsynthesis.speak() method.

StyleSheet.ownerNode - Web APIs

Web › API › StyleSheet › ownerNode

the ownernode property of the stylesheet interface returns the node that associates this style sheet with the document.
...l <link> or <style> element, but can also return a processing instruction node in the case of <?xml-stylesheet ?>.

Text.splitText() - Web APIs

Web › API › Text › splitText

read-only.
...split into two text nodes, and a <u> is inserted between them.

TextDecoder.prototype.decode() - Web APIs

Web › API › TextDecoder › decode

and false for the final chunk or if the data is not chunked.
......

TextMetrics.width - Web APIs

Web › API › TextMetrics › width

the read-only width property of the textmetrics interface contains the text's advance width (the width of that inline box) in css pixels.
... the read-only width property of the textmetrics interface contains the text's advance width (the width of that inline box) in css pixels.

TextMetrics - Web APIs

Web › API › TextMetrics

.textbaseline property to the ideographic baseline of the line box, in css pixels.
...x-direction of a piece of text, the sum of actualboundingboxleft and actualboundingboxright can be wider than the width of the inline box (width), due to slanted/italic fonts where characters overhang their advance width.

TimeRanges.end() - Web APIs

Web › API › TimeRanges › end

returns the time offset at which a specified time range ends.
... returns the time offset at which a specified time range ends.

TimeRanges.length - Web APIs

Web › API › TimeRanges › length

the timeranges.length read-only property returns the number of ranges in the object.
... the timeranges.length read-only property returns the number of ranges in the object.

TimeRanges.start() - Web APIs

Web › API › TimeRanges › start

returns the time offset at which a specified time range begins.
... returns the time offset at which a specified time range begins.

Touch - Web APIs

Web › API › Touch

ouch.pagex read only returns the x coordinate of the touch point relative to the left edge of the document.
...l scroll offset, if any.

TouchList.item() - Web APIs

Web › API › TouchList › item

of the touch object to retrieve.
... return value touchpoint the requested touch object from the touchlist.

TouchList.length - Web APIs

Web › API › TouchList › length

the length read-only property indicates the number of items (touch points) in a given touchlist.
...oints) in a given touchlist.

Supporting both TouchEvent and MouseEvent - Web APIs

Web › API › Touch events › Supporting both TouchEvent and MouseEvent

g the browser may fire both touch events and mouse events in response to the same user input.
... may fire both touch events and mouse events in response to the same user input.

TreeWalker.firstChild() - Web APIs

Web › API › TreeWalker › firstChild

the treewalker.firstchild() method moves the current node to the first visible child of the current node, and returns the found child.
...nt node to this child.

TreeWalker.lastChild() - Web APIs

Web › API › TreeWalker › lastChild

the treewalker.lastchild() method moves the current node to the last visible child of the current node, and returns the found child.
...to this child.

TreeWalker.nextSibling() - Web APIs

Web › API › TreeWalker › nextSibling

the treewalker.nextsibling() method moves the current node to its next sibling, if any, and returns the found sibling.
...such node, return null and the current node is not changed.

TreeWalker - Web APIs

Web › API › TreeWalker

ilter.show_cdata_section 8 shows cdatasection nodes.
... 8 shows cdatasection nodes.

URL.createObjectURL() - Web APIs

Web › API › URL › createObjectURL

sed by calling url.revokeobjecturl() when you no longer need them.
...xplicitly unload them, you should do so.

validityState.badInput - Web APIs

Web › API › ValidityState › badInput

the read-only badinput property of a validitystate object indicates if the user has provided input that the browser is unable to convert.
... badinput property of a validitystate object indicates if the user has provided input that the browser is unable to convert.

ValidityState.patternMismatch - Web APIs

Web › API › ValidityState › patternMismatch

the read-only patternmismatch property of a validitystate object indicates if the value of an <input>, after having been edited by the user, does not conform to the constraints set by the element's pattern attribute.
...r" size="3"/> </label> </p> here we have 3 sections for a north american phone number with an implicit label encompassing all three components of the phone number, expecting 3-digits, 3-digits and 4-digits respectively, as defined by the pattern attribute set on each.

ValidityState.rangeOverflow - Web APIs

Web › API › ValidityState › rangeOverflow

the read-only rangeoverflow property of a validitystate object indicates if the value of an <input>, after having been edited by the user, does not conform to the constraints set by the element's max attribute.
...x attribute.

ValidityState.rangeUnderflow - Web APIs

Web › API › ValidityState › rangeUnderflow

the read-only rangeunderflow property of a validitystate object indicates if the value of an <input>, after having been edited by the user, does not conform to the constraints set by the element's min attribute.
...attribute.

ValidityState.stepMismatch - Web APIs

Web › API › ValidityState › stepMismatch

the read-only stepmismatch property of a validitystate object indicates if the value of an <input>, after having been edited by the user, does not conform to the constraints set by the element's step attribute.
...oesn't conform to the constraints set by the step and min values, then stepmismatch will be true.

VideoPlaybackQuality.totalFrameDelay - Web APIs

Web › API › VideoPlaybackQuality › totalFrameDelay

ete since gecko 30 (firefox 30 / thunderbird 30 / seamonkey 2.27 / firefox os 1.4)this feature is obsolete.
...try to avoid using it.

VideoTrack.id - Web APIs

Web › API › VideoTrack › id

the id property contains a string which uniquely identifies the track represented by the videotrack.
...method to locate a specific track within the media associated with a media element.

WebGL2RenderingContext.copyBufferSubData() - Web APIs

Web › API › WebGL2RenderingContext › copyBufferSubData

another buffer.
...buffersubdata(readtarget, writetarget, readoffset, writeoffset, size); parameters readtarget writetarget a glenum specifying the binding point (target) from whose data store should be read or written.

WebGL2RenderingContext.drawArraysInstanced() - Web APIs

Web › API › WebGL2RenderingContext › drawArraysInstanced

the webgl2renderingcontext.drawarraysinstanced() method of the webgl 2 api renders primitives from array data like the gl.drawarrays() method.
... back to the first.

WebGLRenderingContext.getBufferParameter() - Web APIs

Web › API › WebGLRenderingContext › getBufferParameter

the webglrenderingcontext.getbufferparameter() method of the webgl api returns information about the buffer.
...xt.getbufferparameter() method of the webgl api returns information about the buffer.

WebGLRenderingContext.getExtension() - Web APIs

Web › API › WebGLRenderingContext › getExtension

eters name a string for the name of the webgl extension to enable.
... api are registered in the webgl extension registry.

WebGLRenderingContext.getSupportedExtensions() - Web APIs

Web › API › WebGLRenderingContext › getSupportedExtensions

the webglrenderingcontext.getsupportedextensions() method returns a list of all the supported webgl extensions.
... api are registered in the webgl extension registry.

Clearing with colors - Web APIs

Web › API › WebGL API › By example › Clearing with colors

in turn changes how input (in this case, a clear command) translates into output (in this case, all pixels are set to green).
...are giving the event // handler a name (setupwebgl) so that we can refer to the // function object within the function itself.

Matrix math for the web - Web APIs

Web › API › WebGL API › Matrix math for the web

transform applied to it, set to a matrix3d.
... matrix3d.

Getting started with WebGL - Web APIs

Web › API › WebGL API › Tutorial › Getting started with WebGL

next » webgl enables web content to use an api based on opengl es 2.0 to perform 2d and 3d rendering in an html canvas in browsers that support it without the use of plug-ins.
... next » webgl enables web content to use an api based on opengl es 2.0 to perform 2d and 3d rendering in an html canvas in browsers that support it without the use of plug-ins.

Using textures in WebGL - Web APIs

Web › API › WebGL API › Tutorial › Using textures in WebGL

/ urls in webgl.
...> becomes tainted, for example, when a cross-domain image is drawn on it.

Introduction to the Real-time Transport Protocol (RTP) - Web APIs

Web › API › WebRTC API › Intro to RTP

iggers renegotiation of the rtcpeerconnection by sending it a negotiationneeded event, which your code responds to generating an sdp offer using rtcpeerconnection.createoffer and sending it through the signaling server to the remote peer.
...he rtcpeerconnection by sending it a negotiationneeded event, which your code responds to generating an sdp offer using rtcpeerconnection.createoffer and sending it through the signaling server to the remote peer.

WebRTC API - Web APIs

Web › API › WebRTC API

webrtc statistics api specifications specification status comment webrtc 1.0: real-time communication between browsers candidate recommendation the initial definition of the api of webrtc.
... webrtc 1.0: real-time communication between browsers candidate recommendation the initial definition of the api of webrtc.

Inputs and input sources - Web APIs

Web › API › WebXR Device API › Inputs

able to obtain information about each one, including its position and orientation, its targeting ray (if applicable to your needs), and details that can help you decide how to present the input source visually, if at all.
... the controller.

Controlling multiple parameters with ConstantSourceNode - Web APIs

Web › API › Web Audio API › Controlling multiple parameters with ConstantSourceNode

nernode's pan propertry are all set to n as well.
... null; let playbutton = null; let volumecontrol = null; let oscnode1 = null; let oscnode2 = null; let oscnode3 = null; let constantnode = null; let gainnode1 = null; let gainnode2 = null; let gainnode3 = null; let playing = false; these variables are: context the audiocontext in which all the audio nodes live.

Using IIR filters - Web APIs

Web › API › Web Audio API › Using IIR filters

it's far better when working with frequencies to take a log approach, so let's fill our array with frequency values that get larger further on in the array items.
...r further on in the array items.

Window: animationcancel event - Web APIs

Web › API › Window › animationcancel event

might happen when the animation-name is changed such that the animation is removed, or when the animating node is hidden using css.
...e hidden.

Window: animationiteration event - Web APIs

Web › API › Window › animationiteration event

n of a css animation ends, and another one begins.
...f one.

Window: animationstart event - Web APIs

Web › API › Window › animationstart event

expired.
...sequence).

Window: blur event - Web APIs

Web › API › Window › blur event

the blur event fires when an element has lost focus.
...<p id="log">click on this document to give it focus.</p> css .paused { background: #ddd; color: #555; } javascript function pause() { document.body.classlist.add('paused'); log.textcontent = 'focus lost!'; } function play() { document.body.classlist.remove('paused'); log.textcontent = 'this document has focus.

Window.content - Web APIs

Web › API › Window › content

se of a webpage loaded in a sidebar, content still refers to the window of the currently selected tab).
...es use _content instead of content.

Window: copy event - Web APIs

Web › API › Window › copy event

the copy event fires when the user initiates a copy action through the browser's user interface.
...e.

Window: cut event - Web APIs

Web › API › Window › cut event

the cut event is fired when the user has initiated a "cut" action through the browser's user interface.
...ace.

Window.devicePixelRatio - Web APIs

Web › API › Window › devicePixelRatio

often, when a screen has a higher pixel depth than simply double the standard resolution of 96 or 76 dpi.
... the string mqstring is set up to be the media query itself.

Window: focus event - Web APIs

Web › API › Window › focus event

the focus event fires when an element has received focus.
...<p id="log">click on this document to give it focus.</p> css .paused { background: #ddd; color: #555; } javascript function pause() { document.body.classlist.add('paused'); log.textcontent = 'focus lost!'; } function play() { document.body.classlist.remove('paused'); log.textcontent = 'this document has focus.

Window.frames - Web APIs

Web › API › Window › frames

rent window.
... a list of frame objects.

Window.open() - Web APIs

Web › API › Window › open

page is opened into the targeted browsing context.
....1) functions as described: from the same domain+port reopen with same name will access the previously created window.

Window: paste event - Web APIs

Web › API › Window › paste event

the paste event is fired when the user has initiated a "paste" action through the browser's user interface.
... bubbles yes cancelable yes interface clipboardevent event handler property onpaste the original target for this event is the element that was the intended target of the paste action.

Window.scrollX - Web APIs

Web › API › Window › scrollX

exoffset == window.scrollx; // always true for cross-browser compatibility, use window.pagexoffset instead of window.scrollx.
... of internet explorer (< 9) do not support either property and must be worked around by checking other non-standard properties.

Window.scrollY - Web APIs

Web › API › Window › scrollY

crolly.
...king other non-standard properties.

Window.speechSynthesis - Web APIs

Web › API › Window › speechSynthesis

trieve a list of the voices available using speechsynthesis.getvoices() and populate a select menu with them so the user can choose what voice they want.
...ent, and start the utterance speaking via the speechsynthesis.speak() method.

Window: transitioncancel event - Web APIs

Web › API › Window › transitioncancel event

the transitioncancel event is fired when a css transition is canceled.
...bles yes cancelable no interface transitionevent event handler property globaleventhandlers.ontransitioncancel the original target for this event is the element that had the transition applied.

Window: transitionend event - Web APIs

Web › API › Window › transitionend event

as it finishes transitioning to the transitioned state, and when it fully reverts to the default or non-transitioned state.
...clared, there is no transition, and none of the transition events are fired.

Window: transitionrun event - Web APIs

Web › API › Window › transitionrun event

the transitionrun event is fired when a css transition is first created, i.e.
...as begun.

Window: transitionstart event - Web APIs

Web › API › Window › transitionstart event

the transitionstart event is fired when a css transition has actually started, i.e., after any transition-delay has ended.
...bbles yes cancelable no interface transitionevent event handler property globaleventhandlers.ontransitionstart the original target for this event is the element that had the transition applied.

WindowEventHandlers.onlanguagechange - Web APIs

Web › API › WindowEventHandlers › onlanguagechange

the onlanguagechange property of the windoweventhandlers mixin is the eventhandler for processing languagechange events.
... the onlanguagechange property of the windoweventhandlers mixin is the eventhandler for processing languagechange events.

HTML in XMLHttpRequest - Web APIs

Web › API › XMLHttpRequest › HTML in XMLHttpRequest

h true as the only argument if html parsing is supported and false as the only argument if html parsing is not supported.
...first 1024 bytes of the file, that encoding is used.

msCapsLockWarningOff - Web APIs

Web › API › msCapsLockWarningOff

true: automatic caps lock warning is turned off.
...mscapslockwarningoff example</title> <script type="text/javascript"> function capsoff() { if (document.mscapslockwarningoff == false) { document.mscapslockwarningoff = true; document.getelementbyid("caps").innerhtml = "warning off"; } else { document.mscapslockwarningoff = false; document.getelementbyid("caps").innerhtml = "warning on"; } } </script> </head> <body> <label>type a password: <input type="password" /></label><br /> <button id="caps" onclick="capsoff();">warning off</button> </body> </html> ...

Using the alertdialog role - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the alertdialog role

if an alert dialog only contains static content and has no interactive controls at all, alertdialog is likely not the right role to use here.
...ity api.

Using the aria-valuenow attribute - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the aria-valuenow attribute

.
...rollbar and spinbutton.

Using the progressbar role - Accessibility

Web › Accessibility › ARIA › ARIA Techniques › Using the progressbar role

this technique demonstrates how to use the progressbar role and describes the effect it has on browsers and assistive technology.
...lter the value of a progressbar because it is always readonly.

ARIA: tabpanel role - Accessibility

Web › Accessibility › ARIA › Roles › ARIA: tabpanel role

the aria tabpanel role indicates description an element with the tabpanel role associated roles and attributes aria- keyboard interaction key action tab → ← delete required javascript features include note about semantic alternatives to using this role or attribute.
...tes aria- keyboard interaction key action tab → ← delete required javascript features include note about semantic alternatives to using this role or attribute.

Multipart labels: Using ARIA for labels with embedded fields inside them - Accessibility

Web › Accessibility › ARIA › forms › Multipart labels

ins the number 21.
......

Custom properties (--*): CSS variables - CSS: Cascading Style Sheets

Web › CSS › --*

property names that are prefixed with --, like --example-name, represent custom properties that contain a value that can be used in other declarations using the var() function.
...at are prefixed with --, like --example-name, represent custom properties that contain a value that can be used in other declarations using the var() function.

-moz-float-edge - CSS: Cascading Style Sheets

Web › CSS › -moz-float-edge

the non-standard -moz-float-edge css property specifies whether the height and width properties of the element include the margin, border, or padding thickness.
...g and border but not the margin.

-webkit-line-clamp - CSS: Cascading Style Sheets

Web › CSS › -webkit-line-clamp

a block container to the specified number of lines.
...ues */ -webkit-line-clamp: 3; -webkit-line-clamp: 10; /* global values */ -webkit-line-clamp: inherit; -webkit-line-clamp: initial; -webkit-line-clamp: unset; none this value specifies that the content wonʼt be clamped.

-webkit-mask-attachment - CSS: Cascading Style Sheets

Web › CSS › -webkit-mask-attachment

al; -webkit-mask-attachment: fixed, local, scroll; /* global values */ -webkit-mask-attachment: inherit; -webkit-mask-attachment: initial; -webkit-mask-attachment: unset; syntax values scroll if scroll is specified, the mask image scrolls within the viewport along with the block that contains the mask image.
...-mask-attachment: initial; -webkit-mask-attachment: unset; syntax values scroll if scroll is specified, the mask image scrolls within the viewport along with the block that contains the mask image.

-webkit-mask-box-image - CSS: Cascading Style Sheets

Web › CSS › -webkit-mask-box-image

-webkit-mask-box-image sets the mask image for an element's border box.
... -webkit-mask-box-image sets the mask image for an element's border box.

-webkit-mask-composite - CSS: Cascading Style Sheets

Web › CSS › -webkit-mask-composite

the -webkit-mask-composite property specifies the manner in which multiple mask images applied to the same element are composited with one another.
... are rendered.

-webkit-mask-position-x - CSS: Cascading Style Sheets

Web › CSS › -webkit-mask-position-x

; /* <percentage> values */ -webkit-mask-position-x: 100%; -webkit-mask-position-x: -50%; /* <length> values */ -webkit-mask-position-x: 50px; -webkit-mask-position-x: -1cm; /* multiple values values */ -webkit-mask-position-x: 50px, 25%, -3em; /* global values */ -webkit-mask-position-x: inherit; -webkit-mask-position-x: initial; -webkit-mask-position-x: unset; initial value0%applies toall elementsinheritednopercentagesrefer to the size of the box itselfcomputed valuefor <length> the absolute value, otherwise a percentageanimation typediscrete syntax values <length-percentage> a length indicating the position of the left edge of the image relative to the box's left padding edge.
...culated against the horizontal dimension of the box padding area.

-webkit-mask-position-y - CSS: Cascading Style Sheets

Web › CSS › -webkit-mask-position-y

; /* <percentage> values */ -webkit-mask-position-y: 100%; -webkit-mask-position-y: -50%; /* <length> values */ -webkit-mask-position-y: 50px; -webkit-mask-position-y: -1cm; /* multiple values values */ -webkit-mask-position-y: 50px, 25%, -3em; /* global values */ -webkit-mask-position-y: inherit; -webkit-mask-position-y: initial; -webkit-mask-position-y: unset; initial value0%applies toall elementsinheritednopercentagesrefer to the size of the box itselfcomputed valuefor <length> the absolute value, otherwise a percentageanimation typediscrete syntax values <length-percentage> a length indicating the position of the top side of the image relative to the box's top padding edge.
...ntages are calculated against the vertical dimension of the box padding area.

-webkit-tap-highlight-color - CSS: Cascading Style Sheets

Web › CSS › -webkit-tap-highlight-color

-webkit-tap-highlight-color is a non-standard css property that sets the color of the highlight that appears over a link while it's being tapped.
...of the highlight that appears over a link while it's being tapped.

-webkit-text-fill-color - CSS: Cascading Style Sheets

Web › CSS › -webkit-text-fill-color

aracters of text.
...ed.

:-moz-suppressed - CSS: Cascading Style Sheets

Web › CSS › :-moz-suppressed

the :-moz-suppressed css pseudo-class is a mozilla extension that matches elements representing images that were suppressed because loading images from the specified site has been blocked.
... the :-moz-suppressed css pseudo-class is a mozilla extension that matches elements representing images that were suppressed because loading images from the specified site has been blocked.

:-moz-ui-invalid - CSS: Cascading Style Sheets

Web › CSS › :-moz-ui-invalid

the :-moz-ui-invalid css pseudo-class represents any validated form element whose value isn't valid based on their validation constraints, in certain circumstances.
...mstances.

:-moz-ui-valid - CSS: Cascading Style Sheets

Web › CSS › :-moz-ui-valid

the :-moz-ui-valid css pseudo-class represents any validated form element whose value validates correctly based on its validation constraints.
...ion constraints.

:-moz-user-disabled - CSS: Cascading Style Sheets

Web › CSS › :-moz-user-disabled

the :-moz-user-disabled css pseudo-class is a mozilla extension that matches elements representing images that were not loaded because images have been entirely disabled by the user's preferences.
... the :-moz-user-disabled css pseudo-class is a mozilla extension that matches elements representing images that were not loaded because images have been entirely disabled by the user's preferences.

::-webkit-file-upload-button - CSS: Cascading Style Sheets

Web › CSS › ::-webkit-file-upload-button

the ::-webkit-file-upload-button css pseudo-element represents the button of an <input> of type="file".
... the ::-webkit-file-upload-button css pseudo-element represents the button of an <input> of type="file".

::-webkit-outer-spin-button - CSS: Cascading Style Sheets

Web › CSS › ::-webkit-outer-spin-button

the ::-webkit-outer-spin-button css pseudo-element is used to style the outer part of the spinner button of number picker <input> elements.
... the ::-webkit-outer-spin-button css pseudo-element is used to style the outer part of the spinner button of number picker <input> elements.

::cue - CSS: Cascading Style Sheets

Web › CSS › ::cue

the ::cue css pseudo-element matches webvtt cues within a selected element.
...e { color: yellow; font-weight: bold; } the properties are applied to the entire set of cues as if they were a single unit.

::grammar-error - CSS: Cascading Style Sheets

Web › CSS › ::grammar-error

the ::grammar-error css pseudo-element represents a text segment which the user agent has flagged as grammatically incorrect.
...grammar-error examples simple document grammar check in this example, eventual supporting browsers should highlight any flagged grammatical errors with the styles shown.

::spelling-error - CSS: Cascading Style Sheets

Web › CSS › ::spelling-error

the ::spelling-error css pseudo-element represents a text segment which the user agent has flagged as incorrectly spelled.
... simple document spell check in this example, eventual supporting browsers should highlight any flagged spelling errors with the styles shown.

:focus-within - CSS: Cascading Style Sheets

Web › CSS › :focus-within

the :focus-within css pseudo-class represents an element that has received focus or contains an element that has received focus.
... the :focus-within css pseudo-class represents an element that has received focus or contains an element that has received focus.

:invalid - CSS: Cascading Style Sheets

Web › CSS › :invalid

the :invalid css pseudo-class represents any <input> or other <form> element whose contents fail to validate.
... the :invalid css pseudo-class represents any <input> or other <form> element whose contents fail to validate.

:placeholder-shown - CSS: Cascading Style Sheets

Web › CSS › :placeholder-shown

the :placeholder-shown css pseudo-class represents any <input> or <textarea> element that is currently displaying placeholder text.
... the :placeholder-shown css pseudo-class represents any <input> or <textarea> element that is currently displaying placeholder text.

:read-only - CSS: Cascading Style Sheets

Web › CSS › :read-only

the :read-only css pseudo-class represents an element (such as input or textarea) that is not editable by the user.
...d-only, input:read-only, textarea:read-only { border: 0; box-shadow: none; background-color: white; } textarea:-moz-read-write, textarea:read-write { box-shadow: inset 1px 1px 3px #ccc; border-radius: 5px; } you can find the full source code at readonly-confirmation.html; this renders like so: styling read-only non-form controls this selector doesn't just select <input>/<textarea> elements — it will select any element that cannot be edited by the user.

:read-write - CSS: Cascading Style Sheets

Web › CSS › :read-write

the :read-write css pseudo-class represents an element (such as input or textarea) that is editable by the user.
...-only, input:read-only, textarea:read-only { border: 0; box-shadow: none; background-color: white; } textarea:-moz-read-write, textarea:read-write { box-shadow: inset 1px 1px 3px #ccc; border-radius: 5px; } you can find the full source code at readonly-confirmation.html; this renders like so: styling read-write non-form controls this selector doesn't just select <input>/<textarea> elements — it will select any element that can be edited by the user, such as a <p> element with contenteditable set on it.

src - CSS: Cascading Style Sheets

Web › CSS › @font-face › src

nces listed using the first one it can successfully activate.
...s containing invalid data or local font faces that are not found are ignored and the user agent loads the next font in the list.

unicode-range - CSS: Cascading Style Sheets

Web › CSS › @font-face › unicode-range

for users viewing the english version of a page, the font resources for greek and japanese fonts wouldn't need to be downloaded, saving bandwidth.
...if font, helvetica, for the text, and a serif font, times new roman, for the ampersand.

@keyframes - CSS: Cascading Style Sheets

Web › CSS › @keyframes

rame selectors, which specify percentages along the animation when the keyframe occurs, and a block containing the styles for that keyframe.
...urs, and a block containing the styles for that keyframe.

-ms-high-contrast - CSS: Cascading Style Sheets

Web › CSS › @media › -ms-high-contrast

: url('image-wb.png'); } } accessibility concerns theming high contrast mode's theme colors come from a limited subset of deprecated css2 system colors.
...st mode's theme colors come from a limited subset of deprecated css2 system colors.

any-hover - CSS: Cascading Style Sheets

Web › CSS › @media › any-hover

the any-hover css media feature can be used to test whether any available input mechanism can hover over elements.
... the any-hover css media feature can be used to test whether any available input mechanism can hover over elements.

aspect-ratio - CSS: Cascading Style Sheets

Web › CSS › @media › aspect-ratio

representing the width-to-height aspect ratio of the viewport.
...alue="165"> <label id="hf" for="w">height:165</label> <input id="h" name="h" type="range" min="100" max="250" step="5" value="165"> <iframe id="outer" src="data:text/html,<style> @media (min-aspect-ratio: 8/5) { div { background: %239af; } } @media (max-aspect-ratio: 3/2) { div { background: %239ff; } } @media (aspect-ratio: 1/1) { div { background: %23f9a; } }</style><div id='inner'> watch this element as you resize your viewport's width and height.</div>"> </iframe> css iframe{ display:block; } javascript outer.style.width=outer.style.height="165px" w.onchange=w.oninput=function(){ outer.style.width=w.value+"px" wf.textcontent="width:"+w.value } h.onchange=h.oninput=function(){ outer.style.height=h.value+"px" hf.textcontent="height:"+h.value } result specifications ...

hover - CSS: Cascading Style Sheets

Web › CSS › @media › hover

the hover css media feature can be used to test whether the user's primary input mechanism can hover over elements.
...over over elements.

@media - CSS: Cascading Style Sheets

Web › CSS › @media

milar.
..., as specified in the web app manifest's display member defined in the web app manifest spec.

@supports - CSS: Cascading Style Sheets

Web › CSS › @supports

supports-feature> = <supports-decl> | <supports-selector-fn><general-enclosed> = [ <function-token> <any-value> ) ] | ( <ident> <any-value> )where <supports-decl> = ( <declaration> )<supports-selector-fn> = selector( <complex-selector> )where <complex-selector> = <compound-selector> [ <combinator>?
...-selector> = <compound-selector> [ <combinator>?

height - CSS: Cascading Style Sheets

Web › CSS › @viewport › height

definition related at-rule@viewportinitial valueas each of the properties of the shorthand:min-height: automax-height: nonepercentagesas each of the properties of the shorthand:min-height: the percentage is calculated with respect to the height of the generated box's containing block.
...ght of the containing block is not specified explicitly (i.e., it depends on content height), and this element is not absolutely positioned, the percentage value is treated as 0.max-height: the percentage is calculated with respect to the height of the generated box's containing block.

CSS Box Alignment - CSS: Cascading Style Sheets

Web › CSS › CSS Box Alignment

as.
...o think about the main and cross axis rather than inline and block.

CSS Basic Box Model - CSS: Cascading Style Sheets

Web › CSS › CSS Box Model

css basic box model is a module of css that defines the rectangular boxes—including their padding and margin—that are generated for elements and laid out according to the visual formatting model.
...he margins of a box margin margin-bottom margin-left margin-right margin-top margin-trim properties controlling the paddings of a box padding padding-bottom padding-left padding-right padding-top other properties visibility guides introduction to the css box model explains one of the fundamental concept of css: the box model.

Styling Columns - CSS: Cascading Style Sheets

Web › CSS › CSS Columns › Styling Columns

ge values for column-gap are calculated as a percentage of the width of the multicol container.
... instead, the rule overlays the gap.

CSS Multi-column Layout - CSS: Cascading Style Sheets

Web › CSS › CSS Columns

mn layout is a module of css that adds support for multi-column layouts.
...le-color column-rule-style column-rule-width column-span column-width columns related css fragmentation properties break-after break-before break-inside orphans widows guides basic concepts of multicol an overview of the multiple-column layout specification styling columns how to use column rules and manage the spacing between columns.

Aligning Items in a Flex Container - CSS: Cascading Style Sheets

Web › CSS › CSS Flexible Box Layout › Aligning Items in a Flex Container

ification properties work in flexbox.
...rk in flexbox.

Backwards Compatibility of Flexbox - CSS: Cascading Style Sheets

Web › CSS › CSS Flexible Box Layout › Backwards Compatibility of Flexbox

about when prefixes were removed in browsers to make your decision.
...low design patterns such as full height columns and vertical centering and work back as far as internet explorer 8.

Ordering Flex Items - CSS: Cascading Style Sheets

Web › CSS › CSS Flexible Box Layout › Ordering Flex Items

he reordering capabilities of flex layout intentionally affect only the visual rendering, leaving speech order and navigation based on the source order.
... there are sometimes places where the fact that the logical and therefore reading order of flex items is separate from the visual order, is helpful.

Flow Layout and Overflow - CSS: Cascading Style Sheets

Web › CSS › CSS Flow Layout › Flow Layout and Overflow

when there is more content than can fit into a container, an overflow situation occurs.
... when there is more content than can fit into a container, an overflow situation occurs.

CSS Generated Content - CSS: Cascading Style Sheets

Web › CSS › CSS Generated Content

css generated content is a module of css that defines how to add content to an element.
... css generated content is a module of css that defines how to add content to an element.

Grid template areas - CSS: Cascading Style Sheets

Web › CSS › CSS Grid Layout › Grid Template Areas

@media (min-width: 700px) { .wrapper { grid-template-areas: "hd hd hd hd hd hd hd hd hd" "sd sd main main main main main ft ft"; } } <div class="wrapper"> <div class="header">header</div> <div class="sidebar">sidebar</div> <div class="content">content</div> <div class="footer">footer</div> </div> using grid-template-areas for ui elements many of the grid examples you will find online make the assumption that you will use grid for main page layout, however grid can be just as useful for small elements as those larger ones.
...lass="content">content</div> <div class="footer">footer</div> </div> using grid-template-areas for ui elements many of the grid examples you will find online make the assumption that you will use grid for main page layout, however grid can be just as useful for small elements as those larger ones.

Subgrid - CSS: Cascading Style Sheets

Web › CSS › CSS Grid Layout › Subgrid

ns that the subgrid has five column tracks.
...on the grid container of the subgrid.

Implementing image sprites in CSS - CSS: Cascading Style Sheets

Web › CSS › CSS Images › Implementing image sprites in CSS

image is given to every item with class toolbtn: .toolbtn { background: url(myfile.png); display: inline-block; height: 20px; width: 20px; } a background position can be added either as two x, y values after the url()() in the background, or as background-position.
...n { background: url(myfile.png); display: inline-block; height: 20px; width: 20px; } a background position can be added either as two x, y values after the url()() in the background, or as background-position.

Stacking context example 2 - CSS: Cascading Style Sheets

Web › CSS › CSS Positioning › Understanding z index › Stacking context example 2

le 2 this is a very simple example, but it is the key for understanding the concept of stacking context.
...eviously div #3 (and all its content) is under div #2.

Stacking context example 3 - CSS: Cascading Style Sheets

Web › CSS › CSS Positioning › Understanding z index › Stacking context example 3

« css « understanding css z-index stacking context example 3 this last example shows problems that arise when mixing several positioned elements in a multi-level html hierarchy and when z-indexes are assigned using class selectors.
... this kind of menu is script-generated either client-side or server-side, so style rules are assigned with a class selector instead of the id selector.

CSS Transforms - CSS: Cascading Style Sheets

Web › CSS › CSS Transforms

css transforms is a module of css that defines how elements styled with css can be transformed in two-dimensional or three-dimensional space.
...f css that defines how elements styled with css can be transformed in two-dimensional or three-dimensional space.

Column combinator - CSS: Cascading Style Sheets

Web › CSS › Column combinator

the column combinator (||) is placed between two css selectors.
... the column combinator (||) is placed between two css selectors.

Split Navigation - CSS: Cascading Style Sheets

Web › CSS › Layout cookbook › Split Navigation

a navigation pattern where one or more elements are separated from the rest of the navigation items.
... a navigation pattern where one or more elements are separated from the rest of the navigation items.

align-items - CSS: Cascading Style Sheets

Web › CSS › align-items

ns that the item overflows the alignment container causing data loss, the item is instead aligned as if the alignment mode were start.
...ption> <option value="safe end">safe end</option> <option value="unsafe end">unsafe end</option> <option value="safe self-end">safe self-end</option> <option value="unsafe self-end">unsafe self-end</option> <option value="safe flex-end">safe flex-end</option> <option value="unsafe flex-end">unsafe flex-end</option> </select> </div> javascript var values = document.getelementbyid('values'); var display = document.getelementbyid('display'); var container = document.getelementbyid('container'); values.addeventlistener('change', function (evt) { container.style.alignitems = evt.target.value; }); display.addeventlistener('change', function (evt) { container.classname = evt.target.value; }); result specifications specification status comment ...

animation-direction - CSS: Cascading Style Sheets

Web › CSS › animation-direction

unt to determine if a cycle is even or odd starts at one.
... odd starts at one.

animation-duration - CSS: Cascading Style Sheets

Web › CSS › animation-duration

efixed, implementations may consider them as identical to 0s.
...hem as identical to 0s.

animation-iteration-count - CSS: Cascading Style Sheets

Web › CSS › animation-iteration-count

ample, 0.5 will play half of the animation cycle.
...tion cycle.

animation-play-state - CSS: Cascading Style Sheets

Web › CSS › animation-play-state

tly playing.
... currently paused.

background-color - CSS: Cascading Style Sheets

Web › CSS › background-color

the background-color css property sets the background color of an element.
...bility guidelines (wcag), a ratio of 4.5:1 is required for text content and 3:1 for larger text such as headings.

background-position-x - CSS: Cascading Style Sheets

Web › CSS › background-position-x

on layer set by background-origin.
...image's horizontal position relative to the container.

background-position-y - CSS: Cascading Style Sheets

Web › CSS › background-position-y

on layer set by background-origin.
...ound image's vertical position relative to the container.

border-block-color - CSS: Cascading Style Sheets

Web › CSS › border-block-color

the border-block-color css property defines the color of the logical block borders of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation.
... the values defined for writing-mode, direction, and text-orientation.

border-block-style - CSS: Cascading Style Sheets

Web › CSS › border-block-style

the border-block-style css property defines the style of the logical block borders of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation.
....

border-block-width - CSS: Cascading Style Sheets

Web › CSS › border-block-width

the border-block-width css property defines the width of the logical block borders of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation.
...de, direction, and text-orientation.

border-block - CSS: Cascading Style Sheets

Web › CSS › border-block

l logical block border property values in a single place in the style sheet.
...fied with one or more of the following, in any order: <'border-width'> the width of the border.

border-bottom-color - CSS: Cascading Style Sheets

Web › CSS › border-bottom-color

the border-bottom-color css property sets the color of an element's bottom border.
...-bottom-color: hsla(100%, 50%, 25%, 0.75); border-bottom-color: currentcolor; border-bottom-color: transparent; /* global values */ border-bottom-color: inherit; border-bottom-color: initial; border-bottom-color: unset; the border-bottom-color property is specified as a single value.

border-bottom-style - CSS: Cascading Style Sheets

Web › CSS › border-bottom-style

the border-bottom-style css property sets the line style of an element's bottom border.
...order-bottom-style: groove; border-bottom-style: ridge; border-bottom-style: inset; border-bottom-style: outset; /* global values */ border-bottom-style: inherit; border-bottom-style: initial; border-bottom-style: unset; the border-bottom-style property is specified as a single keyword chosen from those available for the border-style property.

border-bottom - CSS: Cascading Style Sheets

Web › CSS › border-bottom

the border-bottom shorthand css property sets an element's bottom border.
...values of the shorthand property can be specified in any order, and one or two of them may be omitted.

border-inline-color - CSS: Cascading Style Sheets

Web › CSS › border-inline-color

the border-inline-color css property defines the color of the logical inline borders of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation.
...n the values defined for writing-mode, direction, and text-orientation.

border-inline-style - CSS: Cascading Style Sheets

Web › CSS › border-inline-style

the border-inline-style css property defines the style of the logical inline borders of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation.
....

border-inline-width - CSS: Cascading Style Sheets

Web › CSS › border-inline-width

the border-inline-width css property defines the width of the logical inline borders of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation.
...ation.

border-left-color - CSS: Cascading Style Sheets

Web › CSS › border-left-color

the border-left-color css property sets the color of an element's left border.
...5, 0, 0); border-left-color: hsla(100%, 50%, 25%, 0.75); border-left-color: currentcolor; border-left-color: transparent; /* global values */ border-left-color: inherit; border-left-color: initial; border-left-color: unset; the border-left-color property is specified as a single value.

border-left-style - CSS: Cascading Style Sheets

Web › CSS › border-left-style

the border-left-style css property sets the line style of an element's left border.
...style: double; border-left-style: groove; border-left-style: ridge; border-left-style: inset; border-left-style: outset; /* global values */ border-left-style: inherit; border-left-style: initial; border-left-style: unset; the border-left-style property is specified as a single keyword chosen from those available for the border-style property.

border-left - CSS: Cascading Style Sheets

Web › CSS › border-left

the border-left shorthand css property set an element's left border.
... the three values of the shorthand property can be specified in any order, and one or two of them may be omitted.

border-right-color - CSS: Cascading Style Sheets

Web › CSS › border-right-color

the border-right-color css property sets the color of an element's right border.
...; border-right-color: hsla(100%, 50%, 25%, 0.75); border-right-color: currentcolor; border-right-color: transparent; /* global values */ border-right-color: inherit; border-right-color: initial; border-right-color: unset; the border-right-color property is specified as a single value.

border-right-style - CSS: Cascading Style Sheets

Web › CSS › border-right-style

the border-right-style css property sets the line style of an element's right border.
...ouble; border-right-style: groove; border-right-style: ridge; border-right-style: inset; border-right-style: outset; /* global values */ border-right-style: inherit; border-right-style: initial; border-right-style: unset; the border-right-style property is specified as a single keyword chosen from those available for the border-style property.

border-right - CSS: Cascading Style Sheets

Web › CSS › border-right

the border-right shorthand css property sets the properties of an element's right border.
...three values of the shorthand property can be specified in any order, and one or two of them may be omitted.

border-top-color - CSS: Cascading Style Sheets

Web › CSS › border-top-color

the border-top-color css property sets the color of an element's top border.
...r: rgb(255, 0, 0); border-top-color: hsla(100%, 50%, 25%, 0.75); border-top-color: currentcolor; border-top-color: transparent; /* global values */ border-top-color: inherit; border-top-color: initial; border-top-color: unset; the border-top-color property is specified as a single value.

border-top - CSS: Cascading Style Sheets

Web › CSS › border-top

the border-top shorthand css property sets all the properties of an element's top border.
...reen; the three values of the shorthand property can be specified in any order, and one or two of them may be omitted.

border-width - CSS: Cascading Style Sheets

Web › CSS › border-width

the border-width shorthand css property sets the width of an element's border.
...yword, the precise result when using one of them is implementation-specific.

box-direction - CSS: Cascading Style Sheets

Web › CSS › box-direction

box lays out its contents from the start (the left or top edge).
...nts from the end (the right or bottom edge).

column-fill - CSS: Cascading Style Sheets

Web › CSS › column-fill

the column-fill css property controls how an element's contents are balanced when broken into columns.
...ng empty.

columns - CSS: Cascading Style Sheets

Web › CSS › columns

the columns css shorthand property sets the number of columns to use when drawing an element's contents, as well as those columns' widths.
...ues */ columns: inherit; columns: initial; columns: unset; the columns property may be specified as one or two of the values listed below, in any order.

conic-gradient() - CSS: Cascading Style Sheets

Web › CSS › conic-gradient

n.
...olor stops.

counter-reset - CSS: Cascading Style Sheets

Web › CSS › counter-reset

operty is specified as either one of the following: a <custom-ident> naming the counter, followed optionally by an <integer>.
...air separated by a space.

cursor - CSS: Cascading Style Sheets

Web › CSS › cursor

the cursor css property sets the type of mouse cursor, if any, to show when the mouse pointer is over an element.
...out usage notes although the specification does not define any size limitations for cursor, individual user agents may choose to do so.

<display-listitem> - CSS: Cascading Style Sheets

Web › CSS › display-listitem

the list-item keyword causes the element to generate a ::marker pseudo-element with the content specified by its list-style properties (for example a bullet point) together with a principal box of the specified type for its own contents.
... the list-item keyword causes the element to generate a ::marker pseudo-element with the content specified by its list-style properties (for example a bullet point) together with a principal box of the specified type for its own contents.

flex-basis - CSS: Cascading Style Sheets

Web › CSS › flex-basis

e content box unless otherwise set with box-sizing.
...ok at my width or height property" keyword.

flex - CSS: Cascading Style Sheets

Web › CSS › flex

flex: auto; } .none { flex: none; } .four { flex: 4; } .two { flex: 2; } .one { flex: 1; } by default flex items don't shrink below their minimum content size.
... <'flex-basis'> ] examples setting flex: auto html <div id="flex-container"> <div class="flex-item" id="flex">flex box (click to toggle raw box)</div> <div class="raw-item" id="raw">raw box</div> </div> css #flex-container { display: flex; flex-direction: row; } #flex-container > .flex-item { flex: auto; } #flex-container > .raw-item { width: 5rem; } var flex = document.getelementbyid("flex"); var raw = document.getelementbyid("raw"); flex.addeventlistener("click", function() { raw.style.display = raw.style.display == "none" ?

font-family - CSS: Cascading Style Sheets

Web › CSS › font-family

the font-family css property specifies a prioritized list of one or more font family names and/or generic family names for the selected element.
...kletter 1911", sans-serif; the following declarations are invalid: font-family: goudy bookletter 1911, sans-serif; font-family: red/black, sans-serif; font-family: "lucida" grande, sans-serif; font-family: ahem!, sans-serif; font-family: test@foo, sans-serif; font-family: #pound, sans-serif; font-family: hawaii 5-0, sans-serif; formal definition initial valuedepends on user agentapplies toall elements.

font-variant-ligatures - CSS: Cascading Style Sheets

Web › CSS › font-variant-ligatures

the font-variant-ligatures css property controls which ligatures and contextual forms are used in textual content of the elements it applies to.
...etters adapt to their context—that is, whether they adapt to the surrounding letters.

font-variant-position - CSS: Cascading Style Sheets

Web › CSS › font-variant-position

the font-variant-position css property controls the use of alternate, smaller glyphs that are positioned as superscript or subscript.
...ript alternate glyphs.

hyphens - CSS: Cascading Style Sheets

Web › CSS › hyphens

"hard" hyphen character indicates a visible line break opportunity.
...ken at that point, the hyphen is still rendered.

image-rendering - CSS: Cascading Style Sheets

Web › CSS › image-rendering

the image-rendering css property sets an image scaling algorithm.
...est-neighbor algorithm must be used, so that the image appears to be composed of large pixels.

Initial value - CSS: Cascading Style Sheets

Web › CSS › initial value

the initial value of a css property is its default value, as listed in its definition table in the specification.
... the initial value of a css property is its default value, as listed in its definition table in the specification.

inset-block-end - CSS: Cascading Style Sheets

Web › CSS › inset-block-end

the inset-block-end css property defines the logical block end offset of an element, which maps to a physical inset depending on the element's writing mode, directionality, and text orientation.
...-block-end: 2.4em; /* <percentage>s of the width or height of the containing block */ inset-block-end: 10%; /* keyword value */ inset-block-end: auto; /* global values */ inset-block-end: inherit; inset-block-end: initial; inset-block-end: unset; syntax values the inset-block-end property takes the same values as the left property.

inset-block-start - CSS: Cascading Style Sheets

Web › CSS › inset-block-start

the inset-block-start css property defines the logical block start offset of an element, which maps to a physical inset depending on the element's writing mode, directionality, and text orientation.
...2.4em; /* <percentage>s of the width or height of the containing block */ inset-block-start: 10%; /* keyword value */ inset-block-start: auto; /* global values */ inset-block-start: inherit; inset-block-start: initial; inset-block-start: unset; syntax values the inset-block-start property takes the same values as the left property.

inset-block - CSS: Cascading Style Sheets

Web › CSS › inset-block

the inset-block css property defines the logical block start and end offsets of an element, which maps to physical offsets depending on the element's writing mode, directionality, and text orientation.
...%; /* keyword value */ inset-block: auto; /* global values */ inset-block: inherit; inset-block: initial; inset-block: unset; constituent properties this property is a shorthand for the following css properties: inset-block-end inset-block-start syntax values the inset-block property takes the same values as the left property.

inset-inline-end - CSS: Cascading Style Sheets

Web › CSS › inset-inline-end

the inset-inline-end css property defines the logical inline end inset of an element, which maps to a physical inset depending on the element's writing mode, directionality, and text orientation.
...k */ inset-inline-end: 10%; /* keyword value */ inset-inline-end: auto; /* global values */ inset-inline-end: inherit; inset-inline-end: initial; inset-inline-end: unset; the shorthand for inset-inline-start and inset-inline-end is inset-inline.

inset-inline-start - CSS: Cascading Style Sheets

Web › CSS › inset-inline-start

the inset-inline-start css property defines the logical inline start inset of an element, which maps to a physical offset depending on the element's writing mode, directionality, and text orientation.
...nline-start: 10%; /* keyword value */ inset-inline-start: auto; /* global values */ inset-inline-start: inherit; inset-inline-start: initial; inset-inline-start: unset; the shorthand for inset-inline-start and inset-inline-end is inset-inline.

inset-inline - CSS: Cascading Style Sheets

Web › CSS › inset-inline

the inset-inline css property defines the logical start and end offsets of an element in the inline direction, which maps to physical offsets depending on the element's writing mode, directionality, and text orientation.
...keyword value */ inset-inline: auto; /* global values */ inset-inline: inherit; inset-inline: initial; inset-inline: unset; constituent properties this property is a shorthand for the following css properties: inset-inline-end inset-inline-start syntax values the inset-inline property takes the same values as the left property.

justify-content - CSS: Cascading Style Sheets

Web › CSS › justify-content

of the values using grid layout.
...>baseline</option> <option value="first baseline">first baseline</option> <option value="last baseline">last baseline</option> <option value="space-between" selected>space-between</option> <option value="space-around">space-around</option> <option value="space-evenly">space-evenly</option> <option value="stretch">stretch</option> </select> javascript var justifycontent = document.getelementbyid("justifycontent"); justifycontent.addeventlistener("change", function (evt) { document.getelementbyid("container").style.justifycontent = evt.target.value; }); result specifications specification status comment css box alignment module level 3the definition of 'justify-content' in that specification.

justify-items - CSS: Cascading Style Sheets

Web › CSS › justify-items

interactive example is stored in a github repository.
...t.

margin-block-end - CSS: Cascading Style Sheets

Web › CSS › margin-block-end

the margin-block-end css property defines the logical block end margin of an element, which maps to a physical margin depending on the element's writing mode, directionality, and text orientation.
...end: auto; /* global values */ margin-block-end: inherit; margin-block-end: initial; margin-block-end: unset; it corresponds to the margin-top, margin-right, margin-bottom, or margin-left property depending on the values defined for writing-mode, direction, and text-orientation.

margin-block-start - CSS: Cascading Style Sheets

Web › CSS › margin-block-start

the margin-block-start css property defines the logical block start margin of an element, which maps to a physical margin depending on the element's writing mode, directionality, and text orientation.
... auto; /* global values */ margin-block-start: inherit; margin-block-start: initial; margin-block-start: unset; it corresponds to the margin-top, margin-right, margin-bottom, or margin-left property depending on the values defined for writing-mode, direction, and text-orientation.

margin-inline-end - CSS: Cascading Style Sheets

Web › CSS › margin-inline-end

the margin-inline-end css property defines the logical inline end margin of an element, which maps to a physical margin depending on the element's writing mode, directionality, and text orientation.
...inline-end: 1em; /* relative to the text size */ margin-inline-end: 5%; /* relative to the nearest block container's width */ /* keyword values */ margin-inline-end: auto; /* global values */ margin-inline-end: inherit; margin-inline-end: initial; margin-inline-end: unset; it relates to margin-block-start, margin-block-end, and margin-inline-start, which define the other margins of the element.

margin-inline-start - CSS: Cascading Style Sheets

Web › CSS › margin-inline-start

the margin-inline-start css property defines the logical inline start margin of an element, which maps to a physical margin depending on the element's writing mode, directionality, and text orientation.
...ine-start: 10px; /* an absolute length */ margin-inline-start: 1em; /* relative to the text size */ margin-inline-start: 5%; /* relative to the nearest block container's width */ /* keyword values */ margin-inline-start: auto; /* global values */ margin-inline-start: inherit; it relates to margin-block-start, margin-block-end, and margin-inline-end, which define the other margins of the element.

max-block-size - CSS: Cascading Style Sheets

Web › CSS › max-block-size

the max-block-size css property specifies the maximum size of an element in the direction opposite that of the writing direction as specified by writing-mode.
...ze: inherit; max-block-size: initial; max-block-size: unset; values the max-block-size property's value can be any value that's legal for the max-width and max-height properties: <length> defines the max-width as an absolute value.

offset-position - CSS: Cascading Style Sheets

Web › CSS › offset-position

ight 3em bottom 10px; offset-position: bottom 10px right; offset-position: top right 10px; /* global values */ offset-position: inherit; offset-position: initial; offset-position: unset; values auto the initial position is the position of the box specified by the position property.
... represents the horizontal position and the second represents the vertical position.

overflow-x - CSS: Cascading Style Sheets

Web › CSS › overflow-x

the overflow-x css property sets what shows when content overflows a block-level element's left and right edges.
... of values below.

overflow-y - CSS: Cascading Style Sheets

Web › CSS › overflow-y

the overflow-y css property sets what shows when content overflows a block-level element's top and bottom edges.
...es below.

padding-block - CSS: Cascading Style Sheets

Web › CSS › padding-block

the padding-block css shorthand property defines the logical block start and end padding of an element, which maps to physical padding properties depending on the element's writing mode, directionality, and text orientation.
... padding-right, and padding-left property depending on the values defined for writing-mode, direction, and text-orientation.

padding-inline - CSS: Cascading Style Sheets

Web › CSS › padding-inline

the padding-inline css shorthand property defines the logical inline start and end padding of an element, which maps to physical padding properties depending on the element's writing mode, directionality, and text orientation.
...ding-inline-end padding-inline-start syntax values the padding-inline property takes the same values as the padding-left property.

paint-order - CSS: Cascading Style Sheets

Web › CSS › paint-order

ecified, that one is painted first, followed by the other two in their default order relative to one another.
... the marker-* properties (e.g.

place-content - CSS: Cascading Style Sheets

Web › CSS › place-content

</option> <option value="start">start</option> <option value="end">end</option> <option value="flex-start">flex-start</option> <option value="flex-end">flex-end</option> <option value="left">left</option> <option value="right">right</option> <option value="safe">safe</option> <option value="unsafe">unsafe</option> </select><code>;</code> var update = function () { document.getelementbyid("container").style.placecontent = document.getelementbyid("aligncontentalignment").value + " " + document.getelementbyid("justifycontentalignment").value; } var aligncontentalignment = document.getelementbyid("aligncontentalignment"); aligncontentalignment.addeventlistener("change", update); var justifycontentalignment = document.getelementbyid("justifycontentalignment"); justifycontentali...
...ntentalignment").value + " " + document.getelementbyid("justifycontentalignment").value; } var aligncontentalignment = document.getelementbyid("aligncontentalignment"); aligncontentalignment.addeventlistener("change", update); var justifycontentalignment = document.getelementbyid("justifycontentalignment"); justifycontentalignment.addeventlistener("change", update); var writingm = document.getelementbyid("writingmode"); writingm.addeventlistener("change", function (evt) { document.getelementbyid("container").style.writingmode = evt.target.value; }); var direction = document.getelementbyid("direction"); direction.addeventlistener("change", function (evt) { document.getelementbyid("container").style.direction = evt.target.value; }); css #container { display: flex; height:240px; ...

place-items - CSS: Cascading Style Sheets

Web › CSS › place-items

the alignment container, any auto-sized items have their size increased equally (not proportionally), while still respecting the constraints imposed by max-height/max-width (or equivalent functionality), so that the combined size exactly fills the alignment container.
..."left auto">left auto</option> <option value="right normal">right normal</option> <option value="baseline normal">baseline normal</option> <option value="first baseline auto">first baseline auto</option> <option value="last baseline normal">last baseline normal</option> <option value="stretch auto">stretch auto</option> </select> </div> javascript var values = document.getelementbyid('values'); var display = document.getelementbyid('display'); var container = document.getelementbyid('container'); values.addeventlistener('change', function (evt) { container.style.placeitems = evt.target.value; }); display.addeventlistener('change', function (evt) { container.classname = evt.target.value; }); css #container { height:200px; width: 240px; place-items: center; ...

quotes - CSS: Cascading Style Sheets

Web › CSS › quotes

uote and close-quote to the french quotation marks */ quotes: "«" "»" "‹" "›"; /* set two levels of quotation marks */ /* global values */ quotes: inherit; quotes: initial; quotes: unset; values none the open-quote and close-quote values of the content property produce no quotation marks.
... used for whatever language value is set on the selected elements (i.e.

repeating-conic-gradient() - CSS: Cascading Style Sheets

Web › CSS › repeating-conic-gradient

ch is a special kind of <image>.
... a color stop angle greater than 0deg or less than 360 degrees respectively, the conic-gradient will not repeat.

ruby-position - CSS: Cascading Style Sheets

Web › CSS › ruby-position

the ruby-position css property defines the position of a ruby element relatives to its base element.
... the ruby-position css property defines the position of a ruby element relatives to its base element.

scroll-behavior - CSS: Cascading Style Sheets

Web › CSS › scroll-behavior

n or cssom scrolling apis.
...n a github repository.

scroll-margin-block - CSS: Cascading Style Sheets

Web › CSS › scroll-margin-block

the scroll-margin-block shorthand property sets the scroll margins of an element in the block dimension.
...iner.

scroll-padding-block - CSS: Cascading Style Sheets

Web › CSS › scroll-padding-block

the scroll-padding-block shorthand property sets the scroll padding of an element in the block dimension.
...and send us a pull request.

scroll-padding-inline - CSS: Cascading Style Sheets

Web › CSS › scroll-padding-inline

the scroll-padding-inline shorthand property sets the scroll padding of an element in the inline dimension.
...nd send us a pull request.

scroll-padding - CSS: Cascading Style Sheets

Web › CSS › scroll-padding

the scroll-padding shorthand property sets scroll padding on all sides of an element at once, much like the padding property does for padding on an element.
... send us a pull request.

scroll-snap-type - CSS: Cascading Style Sheets

Web › CSS › scroll-snap-type

to snap positions in its horizontal axis only.
... adjusted to maintain the resting on that snap point.

shape-margin - CSS: Cascading Style Sheets

Web › CSS › shape-margin

the shape-margin css property sets a margin for a css shape created using shape-outside.
... the edges of the shape (the float element) and the surrounding content.

Specified value - CSS: Cascading Style Sheets

Web › CSS › specified value

a css property is the value it receives from the document's style sheet.
... the document's style sheet.

table-layout - CSS: Cascading Style Sheets

Web › CSS › table-layout

pull request.
...ded and analyzed.

text-decoration-line - CSS: Cascading Style Sheets

Web › CSS › text-decoration-line

the text-decoration-line css property sets the kind of decoration that is used on text in an element, such as an underline or overline.
... decorative line beneath it.

text-emphasis - CSS: Cascading Style Sheets

Web › CSS › text-emphasis

the source for this interactive example is stored in a github repository.
...s marks.

text-orientation - CSS: Cascading Style Sheets

Web › CSS › text-orientation

l as the glyphs for vertical scripts.
...rs to be laid out as they would be horizontally, but with the whole line rotated 90° clockwise.

text-overflow - CSS: Cascading Style Sheets

Web › CSS › text-overflow

s project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
...ear the edge of the line box with complete transparency at the edge.

text-size-adjust - CSS: Cascading Style Sheets

Web › CSS › text-size-adjust

t using a viewport that is much wider, usually 800 or 1000 pixels.
... algorithm.

transform-box - CSS: Cascading Style Sheets

Web › CSS › transform-box

border box is used as the reference box.
...est svg viewport is used as the reference box.

perspective() - CSS: Cascading Style Sheets

Web › CSS › transform-function › perspective

imensional interface were 3-dimensional.
...erspective and perspective-origin properties which are attached to the parent of a child transformed in 3-dimensional space.

translate() - CSS: Cascading Style Sheets

Web › CSS › transform-function › translate

the translate() css function repositions an element in the horizontal and/or vertical directions.
... the translate() css function repositions an element in the horizontal and/or vertical directions.

translate3d() - CSS: Cascading Style Sheets

Web › CSS › transform-function › translate3d

the translate3d() css function repositions an element in 3d space.
...lement in 3d space.

transition-delay - CSS: Cascading Style Sheets

Web › CSS › transition-delay

ases, the css declaration remains valid.
...d.

transition-duration - CSS: Cascading Style Sheets

Web › CSS › transition-duration

transition-duration: unset; values <time> is a <time> denoting the amount of time the transition from the old value of a property to the new value should take.
... <time> is a <time> denoting the amount of time the transition from the old value of a property to the new value should take.

transition-property - CSS: Cascading Style Sheets

Web › CSS › transition-property

oz-specific, sliding; /* global values */ transition-property: inherit; transition-property: initial; transition-property: unset; values none no properties will transition.
...s */ transition-property: inherit; transition-property: initial; transition-property: unset; values none no properties will transition.

transition-timing-function - CSS: Cascading Style Sheets

Web › CSS › transition-timing-function

dhd) and certain kinds of motion can be a trigger for vestibular disorders, epilepsy, and migraine and scotopic sensitivity.
...e a trigger for vestibular disorders, epilepsy, and migraine and scotopic sensitivity.

translate - CSS: Cascading Style Sheets

Web › CSS › translate

to a translate() (2d translation) function with two values specified.
... font-size: 1.2rem; text-align: center; } .translate { transition: translate 1s; } div:hover .translate { translate: 200px 50px; } result specifications specification status comment css transforms level 2the definition of 'individual transforms' in that specification.

Used value - CSS: Cascading Style Sheets

Web › CSS › used value

of shorthand properties (e.g., background) are consistent with those of their component properties (e.g., background-color or background-size) and with position and float.
...on updateallusedwidths() { updateusedwidth("no-width"); updateusedwidth("width-50"); updateusedwidth("width-inherit"); } updateallusedwidths(); window.addeventlistener('resize', updateallusedwidths); result difference from computed value css 2.0 defined only computed value as the last step in a property's calculation.

str:split() - EXSLT

Web › EXSLT › str › split

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes str:split() splits a string using a pattern string to determine where the splits should occur, returning a node-set containing the resulting strings.
...xpath reference: xslt elements, exslt functions, xpath functions, xpath axes str:split() splits a string using a pattern string to determine where the splits should occur, returning a node-set containing the resulting strings.

str:tokenize() - EXSLT

Web › EXSLT › str › tokenize

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes str:tokenize() splits a string using a set of characters as delimiters that determine where the splits should occur, returning a node-set containing the resulting strings.
...ions, xpath axes str:tokenize() splits a string using a set of characters as delimiters that determine where the splits should occur, returning a node-set containing the resulting strings.

Ajax - Developer guides

Web › Guide › AJAX

thin a document to determine whether they match a pattern or not.
... applications asynchronously read the contents of files (or raw data buffers) stored on the user's computer, using file or blob objects to specify the file or data to read.

Live streaming web audio and video - Developer guides

Web › Guide › Audio and video delivery › Live streaming web audio and video

ject to blocking from firewalls or proxy servers.
...s for dynamic adaptive streaming over http and is a new format that has recently seen support added to chrome, and internet explorer 11 running on windows 8.1.

Setting up adaptive streaming media sources - Developer guides

Web › Guide › Audio and video delivery › Setting up adaptive streaming media sources

let's say you want to set up an adaptive streaming media source on a server, to be consumed inside an html5 media element.
...a data such as mimetype and codecs and there are other details such as byte-ranges in there too.

HTML attribute: accept - HTML: Hypertext Markup Language

Web › HTML › Attributes › accept

the accept attribute takes as its value a comma-separated list of one or more file types, or unique file type specifiers, describing which file types to allow.
...deo/*"> </p> <p> <label for="imagefile">select some images:</label> <input type="file" id="imagefile" accept="image/*" multiple> </p> note the last example allows you to select multiple iamges.

HTML attribute: pattern - HTML: Hypertext Markup Language

Web › HTML › Attributes › pattern

ize="3"/> </label> </p> here we have 3 sections for a north american phone number with an implicit label encompassing all three components of the phone number, expecting 3-digits, 3-digits and 4-digits respectively, as defined by the pattern attribute set on each.
...ute; content: '✓'; padding-left: 5px; } this renders like so: accessibility concerns when a control has a pattern attribute, the title attribute, if used, must describe the pattern.

HTML attribute: size - HTML: Hypertext Markup Language

Web › HTML › Attributes › size

the size attribute defines the width of the <input> and the height of the <select> element.
...ttribute defines the width of the <input> and the height of the <select> element.

theme-color - HTML: Hypertext Markup Language

Web › HTML › Element › meta › name › theme-color

the theme-color value for the name attribute of the <meta> element indicates a suggested color that user agents should use to customize the display of the page or of the surrounding user interface.
... the theme-color value for the name attribute of the <meta> element indicates a suggested color that user agents should use to customize the display of the page or of the surrounding user interface.

accesskey - HTML: Hypertext Markup Language

Web › HTML › Global attributes › accesskey

the accesskey global attribute provides a hint for generating a keyboard shortcut for the current element.
...ey' in that specification.

autocapitalize - HTML: Hypertext Markup Language

Web › HTML › Global attributes › autocapitalize

talize attribute doesn’t affect behavior when typing on a physical keyboard.
...he behavior of other input mechanisms, such as virtual keyboards on mobile devices and voice input.

itemid - HTML: Hypertext Markup Language

Web › HTML › Global attributes › itemid

the itemid global attribute provides microdata in the form of a unique, global identifier of an item.
... the itemid global attribute provides microdata in the form of a unique, global identifier of an item.

lang - HTML: Hypertext Markup Language

Web › HTML › Global attributes › lang

the lang global attribute helps define the language of an element: the language that non-editable elements are written in, or the language that the editable elements should be written in by the user.
...n snapshot of html living standard, no change from html5 html5the definition of 'lang' in that specification.

Choosing between www and non-www URLs - HTTP

Web › HTTP › Basics of HTTP › Choosing between www and non-www URLs

anonical domain is example.org) the server answers with a code 301 with the header location: http://example.org/whaddup.
...eading to it being considered as duplicate content or spam, and even removing or lowering your page from the search engine result pages.

Content Security Policy (CSP) - HTTP

Web › HTTP › CSP

in policy for web content.
...er resource types when they don't have policies of their own (for a complete list, see the description of the default-src directive).

Compression in HTTP - HTTP

Web › HTTP › Compression

the response; that way, caches will be able to cache the different representations of the resource.
...ignificant performance improvements, it is recommended to activate it for all files, but already compressed ones like images, audio files and videos.

Content-Language - HTTP

Web › HTTP › Headers › Content-Language

by a series of subtags that refine or narrow that language's range (e.g., "en-ca" = the variety of english as communicated in canada).
...icated in canada).

CSP: plugin-types - HTTP

Web › HTTP › Headers › Content-Security-Policy › plugin-types

the http content-security-policy (csp) plugin-types directive restricts the set of plugins that can be embedded into a document by limiting the types of resources which can be loaded.
... the http content-security-policy (csp) plugin-types directive restricts the set of plugins that can be embedded into a document by limiting the types of resources which can be loaded.

Feature-Policy: geolocation - HTTP

Web › HTTP › Headers › Feature-Policy › geolocation

ted browsing contexts.
...der to define a feature policy: feature-policy: geolocation 'self' https://example.com with an <iframe> element fastcorp inc.

Feature-Policy: unsized-media - HTTP

Web › HTTP › Headers › Feature-Policy › unsized-media

the http feature-policy header unsized-media directive controls whether the current document is allowed to change the size of media elements after the initial layout is complete.
...g contexts (iframes).

Link - HTTP

Web › HTTP › Headers › Link

the http link entity-header field provides a means for serialising one or more links in http headers.
...ader field provides a means for serialising one or more links in http headers.

HTTP headers - HTTP

Web › HTTP › Headers

ility with http/1.0 caches where the cache-control header is not yet present.
...s.

POST - HTTP

Web › HTTP › Methods › POST

otent: calling it once or several times successively has the same effect (that is no side effect), where successive identical post may have additional effects, like passing an order several times.
...e effect (that is no side effect), where successive identical post may have additional effects, like passing an order several times.

Concurrency model and the event loop - JavaScript

Web › JavaScript › EventLoop

mes.
...or scroll.

Introduction - JavaScript

Web › JavaScript › Guide › Introduction

o add more functionality to a website than simply downloading files (such as realtime collaboration between multiple computers).
...a core set of language elements such as operators, control structures, and statements.

Regular expression syntax cheatsheet - JavaScript

Web › JavaScript › Guide › Regular Expressions › Cheatsheet

foo bar".
...by <name>.

Groups and ranges - JavaScript

Web › JavaScript › Guide › Regular Expressions › Groups and Ranges

foo bar".
...by <name>.

JavaScript error reference - JavaScript

Web › JavaScript › Reference › Errors

n statement requires a namesyntaxerror: identifier starts immediately after numeric literalsyntaxerror: illegal charactersyntaxerror: invalid regular expression flag "x"syntaxerror: missing ) after argument listsyntaxerror: missing ) after conditionsyntaxerror: missing : after property idsyntaxerror: missing ; before statementsyntaxerror: missing = in const declarationsyntaxerror: missing ] after element listsyntaxerror: missing formal parametersyntaxerror: missing name after .
...is not iterabletypeerror: more arguments neededtypeerror: reduce of empty array with no initial valuetypeerror: x.prototype.y called on incompatible typetypeerror: can't access dead objecttypeerror: can't access property "x" of "y"typeerror: can't assign to property "x" on "y": not an objecttypeerror: can't define property "x": "obj" is not extensibletypeerror: can't delete non-configurable array elementtypeerror: can't redefine non-configurable property "x"typeerror: cannot use "in" operator to search for "x" in "y"typeerror: cyclic object valuetypeerror: invalid "instanceof" operand "x"typeerror: invalid array.prototype.sort argumenttypeerror: invalid argumentstypeerror: invalid assignment to const "x"typeerror: property "x" is non-configurable and can't be deletedtypeerror: setting getter-only...

Array.prototype.copyWithin() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › copyWithin

uest.
... if target is at or greater than arr.length, nothing will be copied.

Array.prototype.fill() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › fill

the fill() method changes all elements in an array to a static value, from a start index (default 0) to an end index (default array.length).
... an end index (default array.length).

Array.prototype.flat() - JavaScript

Web › JavaScript › Reference › Global Objects › Array › flat

the flat() method creates a new array with all sub-array elements concatenated into it recursively up to the specified depth.
...stored in a github repository.

Intl.ListFormat - JavaScript

Web › JavaScript › Reference › Global Objects › Intl › ListFormat

a pull request.
...bus or car console.log(new intl.listformat('en-gb', { style: 'narrow', type: 'unit' }).format(list)); // > motorcycle bus car using formattoparts the following example shows how to create a list formatter returning formatted parts const list = ['motorcycle', 'bus', 'car']; console.log(new intl.listformat('en-gb', { style: 'long', type: 'conjunction' }).formattoparts(list)); // [ { "type": "element", "value": "motorcycle" }, // { "type": "literal", "value": ", " }, // { "type": "element", "value": "bus" }, // { "type": "literal", "value": ", and " }, // { "type": "element", "value": "car" } ]; specifications specification intl.listformatthe definition of 'listformat' in that specification.

Intl - JavaScript

Web › JavaScript › Reference › Global Objects › Intl

ration.
...e locale may be specified by either an intl.locale object or a string that is a unicode bcp 47 locale identifier.

Map() constructor - JavaScript

Web › JavaScript › Reference › Global Objects › Map › Map

the map() constructor creates map objects.
... the map() constructor creates map objects.

Promise - JavaScript

Web › JavaScript › Reference › Global Objects › Promise

om.
...lfillment value log.insertadjacenthtml('beforeend', val + ') promise fulfilled (async code terminated)'); }).catch((reason) => { // log the rejection reason console.log(`handle rejected promise (${reason}) here.`); }); // end log.insertadjacenthtml('beforeend', thispromisecount + ') promise made (sync code terminated)'); } if ("promise" in window) { let btn = document.getelementbyid("btn"); btn.addeventlistener("click",testpromise); } else { log = document.getelementbyid('log'); log.innerhtml = "live example not available as your browser doesn't support the <code>promise<code> interface."; } this example is started by clicking the button.

handler.ownKeys() - JavaScript

Web › JavaScript › Reference › Global Objects › Proxy › Proxy › ownKeys

object.
...violates an invariant.

Set.prototype.add() - JavaScript

Web › JavaScript › Reference › Global Objects › Set › add

the add() method appends a new element with a specified value to the end of a set object.
... the add() method appends a new element with a specified value to the end of a set object.

Set.prototype.entries() - JavaScript

Web › JavaScript › Reference › Global Objects › Set › entries

the entries() method returns a new iterator object that contains an array of [value, value] for each element in the set object, in insertion order.
...and value here, so that an array [value, value] is returned.

String.prototype.anchor() - JavaScript

Web › JavaScript › Reference › Global Objects › String › anchor

the anchor() method creates a string beginning with an <a name="..."> start tag, then some text, and then an </a> end tag.
...hod doesn't even create valid markup.

String.prototype.bold() - JavaScript

Web › JavaScript › Reference › Global Objects › String › bold

the bold() method creates a <b> html element that causes a string to be displayed as bold.
... the bold() method creates a <b> html element that causes a string to be displayed as bold.

String.prototype.fixed() - JavaScript

Web › JavaScript › Reference › Global Objects › String › fixed

the fixed() method creates a <tt> html element that causes a string to be displayed in fixed-pitch font.
... the fixed() method creates a <tt> html element that causes a string to be displayed in fixed-pitch font.

String.prototype.italics() - JavaScript

Web › JavaScript › Reference › Global Objects › String › italics

the italics() method creates an <i> html element that causes a string to be italic.
... the italics() method creates an <i> html element that causes a string to be italic.

String.prototype.strike() - JavaScript

Web › JavaScript › Reference › Global Objects › String › strike

the strike() method creates a <strike> html element that causes a string to be displayed as struck-out text.
... the strike() method creates a <strike> html element that causes a string to be displayed as struck-out text.

String.prototype.sub() - JavaScript

Web › JavaScript › Reference › Global Objects › String › sub

the sub() method creates a <sub> html element that causes a string to be displayed as subscript.
... the sub() method creates a <sub> html element that causes a string to be displayed as subscript.

String.prototype.sup() - JavaScript

Web › JavaScript › Reference › Global Objects › String › sup

the sup() method creates a <sup> html element that causes a string to be displayed as superscript.
... the sup() method creates a <sup> html element that causes a string to be displayed as superscript.

String.prototype.toLocaleLowerCase() - JavaScript

Web › JavaScript › Reference › Global Objects › String › toLocaleLowerCase

es are given in an array, the best available locale is used.
...is used.

String.prototype.toLocaleUpperCase() - JavaScript

Web › JavaScript › Reference › Global Objects › String › toLocaleUpperCase

es are given in an array, the best available locale is used.
...is used.

Symbol.isConcatSpreadable - JavaScript

Web › JavaScript › Reference › Global Objects › Symbol › isConcatSpreadable

the symbol.isconcatspreadable well-known symbol is used to configure if an object should be flattened to its array elements when using the array.prototype.concat() method.
...ute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

TypedArray.prototype.fill() - JavaScript

Web › JavaScript › Reference › Global Objects › TypedArray › fill

the fill() method fills all the elements of a typed array from a start index to an end index with a static value.
...ctive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

WeakMap() constructor - JavaScript

Web › JavaScript › Reference › Global Objects › WeakMap › WeakMap

the weakmap() constructor creates weakmap objects which are a collections of key/value pairs in which the keys are weakly referenced.
...ates weakmap objects which are a collections of key/value pairs in which the keys are weakly referenced.

WeakSet.prototype.delete() - JavaScript

Web › JavaScript › Reference › Global Objects › WeakSet › delete

the delete() method removes the specified element from a weakset object.
...he specified element from a weakset object.

WebAssembly.Table.prototype.length - JavaScript

Web › JavaScript › Reference › Global Objects › WebAssembly › Table › length

the length prototype property of the webassembly.table object returns the length of the table, i.e.
... the length prototype property of the webassembly.table object returns the length of the table, i.e.

Destructuring assignment - JavaScript

Web › JavaScript › Reference › Operators › Destructuring assignment

can also ignore all returned values: [,,] = f(); assigning the rest of an array to a variable when destructuring an array, you can unpack and assign the remaining part of it to a variable using the rest pattern: const [a, ...b] = [1, 2, 3]; console.log(a); // 1 console.log(b); // [2, 3] be aware that a syntaxerror will be thrown if a trailing comma is used on the left-hand side with a rest element: const [a, ...b,] = [1, 2, 3]; // syntaxerror: rest element may not have a trailing comma // always consider using rest operator as the last element unpacking values from a regular expression match when the regular expression exec() method finds a match, it returns an array containing first the entire matched portion of the string and then the portions of the string that matched each parent...
...ipt identifier as a property name destructuring can be used with property names that are not valid javascript identifiers by providing an alternative identifier that is valid.

instanceof - JavaScript

Web › JavaScript › Reference › Operators › instanceof

window.frames[0].array and arrays inherit from the former.
... for scripts dealing with multiple frames or windows, and passing objects from one context to another via functions, this will be a valid and strong issue.

for...of - JavaScript

Web › JavaScript › Reference › Statements › for...of

erties have been added to object.prototype and array.prototype, respectively.
...i.e.

Transitioning to strict mode - JavaScript

Web › JavaScript › Reference › Strict mode › Transitioning to strict mode

r!
...nts throws an error in strict mode.

Trailing commas - JavaScript

Web › JavaScript › Reference › Trailing commas

trailing commas (sometimes called "final commas") can be useful when adding new elements, parameters, or properties to javascript code.
...st parameter (...p,) => {} // syntaxerror: expected closing parenthesis, got ',' trailing commas in destructuring a trailing comma is also allowed on the left-hand side when using destructuring assignment: // array destructuring with trailing comma [a, b,] = [1, 2]; // object destructuring with trailing comma var o = { p: 42, q: true, }; var {p, q,} = o; again, when using a rest element, a syntaxerror will be thrown: var [a, ...b,] = [1, 2, 3]; // syntaxerror: rest element may not have a trailing comma trailing commas in json trailing commas in objects were only introduced in ecmascript 5.

Values - MathML

Web › MathML › Attribute › Values

lengths several mathml presentation elements have attributes that accept length values used for size or spacing.
... lengths several mathml presentation elements have attributes that accept length values used for size or spacing.

<menclose> - MathML

Web › MathML › Element › menclose

the mathml <menclose> element renders its content inside an enclosing notation specified by the notation attribute.
... specified by the notation attribute.

<mglyph> - MathML

Web › MathML › Element › mglyph

the mathml <mglyph> element is used to display non-standard symbols where existing unicode characters are not available.
... the mathml <mglyph> element is used to display non-standard symbols where existing unicode characters are not available.

<mmultiscripts> - MathML

Web › MathML › Element › mmultiscripts

the mathml <mmultiscripts> element allows you to create tensor-like objects.
...ts and superscripts for both, postscripts and prescripts, attached to a base expression: <mmultiscripts> base (subscript superscript)* [ <mprescripts/> (presubscript presuperscript)* ] </mmultiscripts> after the base expression you can specify a postsubscript and a postsuperscript.

Using audio and video in HTML - Web media technologies

Web › Media › HTML media

the html <audio> and <video> elements let you embed audio and video content into a web page.
... the html <audio> and <video> elements let you embed audio and video content into a web page.

accumulate - SVG: Scalable Vector Graphics

Web › SVG › Attribute › accumulate

the accumulate attribute controls whether or not an animation is cumulative.
...atetransform> usage notes value none | sum default value none animatable no sum specifies that each repeat iteration after the first builds upon the last value of the previous iteration.

amplitude - SVG: Scalable Vector Graphics

Web › SVG › Attribute › amplitude

the amplitude attribute controls the amplitude of the gamma function of a component transfer element when its type attribute is gamma.
... the amplitude attribute controls the amplitude of the gamma function of a component transfer element when its type attribute is gamma.

color-interpolation-filters - SVG: Scalable Vector Graphics

Web › SVG › Attribute › color-interpolation-filters

of srgb.
...s occur in the linearrgb color space, whereas all other color interpolations occur by default in the srgb color space.

color-rendering - SVG: Scalable Vector Graphics

Web › SVG › Attribute › color-rendering

filters: linearrgb.
...hould perform color operations in a way that optimizes performance, which might mean sacrificing the color interpolation precision as specified by through the linearrgb value for color-interpolation-filters.

contentStyleType - SVG: Scalable Vector Graphics

Web › SVG › Attribute › contentStyleType

the contentstyletype attribute specifies the style sheet language for the given document fragment on the <svg> element.
... the contentstyletype attribute specifies the style sheet language for the given document fragment on the <svg> element.

d - SVG: Scalable Vector Graphics

Web › SVG › Attribute › d

the d attribute defines a path to be drawn.
...es glyph warning: as of svg2 <glyph> is deprecated and shouldn't be used.

divisor - SVG: Scalable Vector Graphics

Web › SVG › Attribute › divisor

the divisor attribute specifies the value by which the resulting number of applying the kernelmatrix of a <feconvolvematrix> element to the input image color value is divided to yield the destination color value.
... the divisor attribute specifies the value by which the resulting number of applying the kernelmatrix of a <feconvolvematrix> element to the input image color value is divided to yield the destination color value.

exponent - SVG: Scalable Vector Graphics

Web › SVG › Attribute › exponent

the exponent attribute defines the exponent of the gamma function.
..." height="200" fill="url(#gradient)" style="filter: url(#componenttransfer1);" /> <rect x="0" y="0" width="200" height="200" fill="url(#gradient)" style="filter: url(#componenttransfer2); transform: translatex(220px);" /> </svg> usage notes value <number> default value 1 animatable yes <number> if the type attribute of the component element is set to gamma, this value specifies the exponent of the gamma function specifications specification status comment filter effects module level 1the definition of 'exponent' in that specification.

fill-opacity - SVG: Scalable Vector Graphics

Web › SVG › Attribute › fill-opacity

the fill-opacity attribute is a presentation attribute defining the opacity of the paint server (color, gradient, pattern, etc) applied to a shape.
... the fill-opacity attribute is a presentation attribute defining the opacity of the paint server (color, gradient, pattern, etc) applied to a shape.

fill-rule - SVG: Scalable Vector Graphics

Web › SVG › Attribute › fill-rule

the fill-rule attribute is a presentation attribute defining the algorithm to use to determine the inside part of a shape.
... the fill-rule attribute is a presentation attribute defining the algorithm to use to determine the inside part of a shape.

filterRes - SVG: Scalable Vector Graphics

Web › SVG › Attribute › filterRes

the filterres attribute indicates the width and height of the intermediate images in pixels of a filter primitive.
...nd height of the intermediate images in pixels of a filter primitive.

flood-color - SVG: Scalable Vector Graphics

Web › SVG › Attribute › flood-color

the flood-color attribute indicates what color to use to flood the current filter primitive subregion.
... the flood-color attribute indicates what color to use to flood the current filter primitive subregion.

flood-opacity - SVG: Scalable Vector Graphics

Web › SVG › Attribute › flood-opacity

the flood-opacity attribute indicates the opacity value to use across the current filter primitive subregion.
... the flood-opacity attribute indicates the opacity value to use across the current filter primitive subregion.

font-family - SVG: Scalable Vector Graphics

Web › SVG › Attribute › font-family

the font-family attribute indicates which font family will be used to render the text, specified as a prioritized list of font family names and/or generic family names.
...ily attribute indicates which font family will be used to render the text, specified as a prioritized list of font family names and/or generic family names.

font-size - SVG: Scalable Vector Graphics

Web › SVG › Attribute › font-size

the font-size attribute refers to the size of the font from baseline to baseline when multiple lines of text are set solid in a multiline layout environment.
... the font-size attribute refers to the size of the font from baseline to baseline when multiple lines of text are set solid in a multiline layout environment.

font-stretch - SVG: Scalable Vector Graphics

Web › SVG › Attribute › font-stretch

the font-stretch attribute indicates the desired amount of condensing or expansion in the glyphs used to render the text.
... the font-stretch attribute indicates the desired amount of condensing or expansion in the glyphs used to render the text.

font-style - SVG: Scalable Vector Graphics

Web › SVG › Attribute › font-style

the font-style attribute specifies whether the text is to be rendered using a normal, italic, or oblique face.
... the font-style attribute specifies whether the text is to be rendered using a normal, italic, or oblique face.

font-variant - SVG: Scalable Vector Graphics

Web › SVG › Attribute › font-variant

the font-variant attribute indicates whether the text is to be rendered using variations of the fontʼs glyphs.
... the font-variant attribute indicates whether the text is to be rendered using variations of the fontʼs glyphs.

font-weight - SVG: Scalable Vector Graphics

Web › SVG › Attribute › font-weight

the font-weight attribute refers to the boldness or lightness of the glyphs used to render the text, relative to other fonts in the same font family.
... the font-weight attribute refers to the boldness or lightness of the glyphs used to render the text, relative to other fonts in the same font family.

fx - SVG: Scalable Vector Graphics

Web › SVG › Attribute › fx

the fx attribute defines the x-axis coordinate of the focal point for a radial gradient.
...top-color="white"/> <stop offset="100%" stop-color="darkseagreen"/> </radialgradient> </defs> <circle cx="100" cy="100" r="100" fill="url(#gradient1)" /> <circle cx="100" cy="100" r="100" fill="url(#gradient2)" style="transform: translatex(240px);" /> </svg> usage notes value <length> default value coincides with the presentational value of cx for the element whether the value for cx was inherited or not.

fy - SVG: Scalable Vector Graphics

Web › SVG › Attribute › fy

the fy attribute defines the y-axis coordinate of the focal point for a radial gradient.
...top-color="white"/> <stop offset="100%" stop-color="darkseagreen"/> </radialgradient> </defs> <circle cx="100" cy="100" r="100" fill="url(#gradient1)" /> <circle cx="100" cy="100" r="100" fill="url(#gradient2)" style="transform: translatex(240px);" /> </svg> usage notes value <length> default value coincides with the presentational value of cy for the element whether the value for cy was inherited or not.

g1 - SVG: Scalable Vector Graphics

Web › SVG › Attribute › g1

the g1 attribute specifies a list of glyph names which identify a set of possible first glyphs in the kerning pair.
...ible first glyphs in the kerning pair is the union of glyphs specified by the u1 and g1 attributes.

g2 - SVG: Scalable Vector Graphics

Web › SVG › Attribute › g2

the g2 attribute specifies a list of glyph names which identify a set of possible second glyphs in the kerning pair.
...le second glyphs in the kerning pair is the union of glyphs specified by the u2 and g2 attributes.

glyph-name - SVG: Scalable Vector Graphics

Web › SVG › Attribute › glyph-name

h-name attribute specifies the name of a glyph.
...cifies the name of a glyph.

glyph-orientation-horizontal - SVG: Scalable Vector Graphics

Web › SVG › Attribute › glyph-orientation-horizontal

otherwise, if the value of this attribute is not a multiple of 180 degrees, then the current text position is incremented according to the vertical metrics of the glyph.
...ultiple of 180 degrees, then the current text position is incremented according to the vertical metrics of the glyph.

glyph-orientation-vertical - SVG: Scalable Vector Graphics

Web › SVG › Attribute › glyph-orientation-vertical

etrics of the glyph.
... multiple of 180 degrees, then the current text position is incremented according to the horizontal metrics of the glyph.

image-rendering - SVG: Scalable Vector Graphics

Web › SVG › Attribute › image-rendering

speed vs.
... processing.

kernelMatrix - SVG: Scalable Vector Graphics

Web › SVG › Attribute › kernelMatrix

the kernelmatrix attribute defines the list of numbers that make up the kernel matrix for the <feconvolvematrix> element.
... the kernelmatrix attribute defines the list of numbers that make up the kernel matrix for the <feconvolvematrix> element.

kerning - SVG: Scalable Vector Graphics

Web › SVG › Attribute › kerning

phs should be adjusted based on kerning tables that are included in the relevant font (i.e., enable auto-kerning) or instead disable auto-kerning and set the spacing between them to a specific length (typically, zero).
...re included in the relevant font (i.e., enable auto-kerning) or instead disable auto-kerning and set the spacing between them to a specific length (typically, zero).

keyTimes - SVG: Scalable Vector Graphics

Web › SVG › Attribute › keyTimes

keytimes attribute represents a list of time values used to control the pacing of the animation.
...ute represents a list of time values used to control the pacing of the animation.

letter-spacing - SVG: Scalable Vector Graphics

Web › SVG › Attribute › letter-spacing

rrent user coordinate system.
...has a unit identifier, such as .25em or 1%, then the browser converts the <length> into its corresponding value in the current user coordinate system.

markerHeight - SVG: Scalable Vector Graphics

Web › SVG › Attribute › markerHeight

the markerheight attribute represents the height of the viewport into which the <marker> is to be fitted when it is rendered according to the viewbox and preserveaspectratio attributes.
... default value 3 animatable yes <length-percentage> this value defines either an absolute or a relative height of the marker.

markerWidth - SVG: Scalable Vector Graphics

Web › SVG › Attribute › markerWidth

the markerwidth attribute represents the width of the viewport into which the <marker> is to be fitted when it is rendered according to the viewbox and preserveaspectratio attributes.
... default value 3 animatable yes <length-percentage> this value defines either an absolute or a relative width of the marker.

method - SVG: Scalable Vector Graphics

Web › SVG › Attribute › method

the method attribute indicates the method by which text should be rendered along the path of a <textpath> element.
... the method attribute indicates the method by which text should be rendered along the path of a <textpath> element.

onclick - SVG: Scalable Vector Graphics

Web › SVG › Attribute › onclick

the onclick attribute specifies some script to run when the element is clicked.
... the onclick attribute specifies some script to run when the element is clicked.

order - SVG: Scalable Vector Graphics

Web › SVG › Attribute › order

the order attribute indicates the size of the matrix to be used by a <feconvolvematrix> element.
... the order attribute indicates the size of the matrix to be used by a <feconvolvematrix> element.

overline-position - SVG: Scalable Vector Graphics

Web › SVG › Attribute › overline-position

the overline-position attribute represents the ideal vertical position of the overline.
... the overline-position attribute represents the ideal vertical position of the overline.

overline-thickness - SVG: Scalable Vector Graphics

Web › SVG › Attribute › overline-thickness

the overline-thickness attribute represents the ideal thickness of the overline.
... the overline-thickness attribute represents the ideal thickness of the overline.

pointer-events - SVG: Scalable Vector Graphics

Web › SVG › Attribute › pointer-events

the pointer-events attribute is a presentation attribute that allows defining whether or when an element may be the target of a mouse event.
...ack" /> <circle cx="15" cy="5" r="4" fill="white" pointer-events="none" /> </svg> window.addeventlistener('mouseup', (e) => { // let's pick a random color between #000000 and #ffffff const color = math.round(math.random() * 0xffffff) // let's format the color to fit css requirements const fill = '#' + color.tostring(16).padstart(6,'0') // let's apply our color in the // element we actually clicked on e.target.style.fill = fill }) as a presentation attribute, it can be applied to any element but it is mostly relevant only on the following twenty-three elements: <a>, <circle>, <clippath>, <defs>, <ellipse>, <foreignobject>, <g>, <image>, <line>, <marker>, <mask>, <path>, <pattern>, <polygon>, <polyline>, <rect>, <svg>, <switch>, <symbol>, <text>, <textpath>, <tspan>...

pointsAtX - SVG: Scalable Vector Graphics

Web › SVG › Attribute › pointsAtX

the pointsatx attribute represents the x location in the coordinate system established by attribute primitiveunits on the <filter> element of the point at which the light source is pointing.
... the pointsatx attribute represents the x location in the coordinate system established by attribute primitiveunits on the <filter> element of the point at which the light source is pointing.

pointsAtY - SVG: Scalable Vector Graphics

Web › SVG › Attribute › pointsAtY

the pointsaty attribute represents the y location in the coordinate system established by attribute primitiveunits on the <filter> element of the point at which the light source is pointing.
... the pointsaty attribute represents the y location in the coordinate system established by attribute primitiveunits on the <filter> element of the point at which the light source is pointing.

pointsAtZ - SVG: Scalable Vector Graphics

Web › SVG › Attribute › pointsAtZ

the pointsatz attribute represents the y location in the coordinate system established by attribute primitiveunits on the <filter> element of the point at which the light source is pointing, assuming that, in the initial local coordinate system, the positive z-axis comes out towards the person viewing the content and assuming that one unit along the z-axis equals one unit in x and y.
... the pointsatz attribute represents the y location in the coordinate system established by attribute primitiveunits on the <filter> element of the point at which the light source is pointing, assuming that, in the initial local coordinate system, the positive z-axis comes out towards the person viewing the content and assuming that one unit along the z-axis equals one unit in x and y.

preserveAlpha - SVG: Scalable Vector Graphics

Web › SVG › Attribute › preserveAlpha

the preservealpha attribute indicates how a <feconvolvematrix> element handled alpha transparency.
... the preservealpha attribute indicates how a <feconvolvematrix> element handled alpha transparency.

restart - SVG: Scalable Vector Graphics

Web › SVG › Attribute › restart

the restart attribute specifies whether or not an animation can restart.
... <animate attributetype="xml" attributename="y" from="30" to="100" dur="5s" repeatcount="1" restart="always" /> </rect> <rect x="120" y="30" width="100" height="100"> <animate attributetype="xml" attributename="y" from="30" to="100" dur="5s" repeatcount="1" restart="whennotactive"/> </rect> <a id="restart"><text y="20">restart animation</text></a> </svg> document.getelementbyid("restart").addeventlistener("click", evt => { document.queryselectorall("animate").foreach(element => { element.beginelement(); }); }); usage notes value always | whennotactive | never default value always animatable no always this value indicates that the animation can be restarted at any time.

scale - SVG: Scalable Vector Graphics

Web › SVG › Attribute › scale

the scale attribute defines the displacement scale factor to be used on a <fedisplacementmap> filter primitive.
... the scale attribute defines the displacement scale factor to be used on a <fedisplacementmap> filter primitive.

shape-rendering - SVG: Scalable Vector Graphics

Web › SVG › Attribute › shape-rendering

the shape-rendering attribute provides hints to the renderer about what tradeoffs to make when rendering shapes like paths, circles, or rectangles.
... the shape-rendering attribute provides hints to the renderer about what tradeoffs to make when rendering shapes like paths, circles, or rectangles.

stop-color - SVG: Scalable Vector Graphics

Web › SVG › Attribute › stop-color

n css.
...ultiplied space, so transparent really means transparent black.

stop-opacity - SVG: Scalable Vector Graphics

Web › SVG › Attribute › stop-opacity

nt stop.
...t calculation is the product of the value of stop-opacity and the opacity of the value of the stop-color attribute.

strikethrough-position - SVG: Scalable Vector Graphics

Web › SVG › Attribute › strikethrough-position

« svg attribute reference home the strikethrough-position attribute represents the ideal vertical position of the strikethrough.
... « svg attribute reference home the strikethrough-position attribute represents the ideal vertical position of the strikethrough.

strikethrough-thickness - SVG: Scalable Vector Graphics

Web › SVG › Attribute › strikethrough-thickness

« svg attribute reference home the strikethrough-thickness attribute represents the ideal thickness of the strikethrough.
... « svg attribute reference home the strikethrough-thickness attribute represents the ideal thickness of the strikethrough.

stroke-dasharray - SVG: Scalable Vector Graphics

Web › SVG › Attribute › stroke-dasharray

the stroke-dasharray attribute is a presentation attribute defining the pattern of dashes and gaps used to paint the outline of the shape; note: as a presentation attribute, stroke-dasharray can be used as a css property.
... the stroke-dasharray attribute is a presentation attribute defining the pattern of dashes and gaps used to paint the outline of the shape; note: as a presentation attribute, stroke-dasharray can be used as a css property.

stroke-dashoffset - SVG: Scalable Vector Graphics

Web › SVG › Attribute › stroke-dashoffset

the stroke-dashoffset attribute is a presentation attribute defining an offset on the rendering of the associated dash array.
... the stroke-dashoffset attribute is a presentation attribute defining an offset on the rendering of the associated dash array.

stroke-linecap - SVG: Scalable Vector Graphics

Web › SVG › Attribute › stroke-linecap

the stroke-linecap attribute is a presentation attribute defining the shape to be used at the end of open subpaths when they are stroked.
... the stroke-linecap attribute is a presentation attribute defining the shape to be used at the end of open subpaths when they are stroked.

stroke-linejoin - SVG: Scalable Vector Graphics

Web › SVG › Attribute › stroke-linejoin

the stroke-linejoin attribute is a presentation attribute defining the shape to be used at the corners of paths when they are stroked.
... the stroke-linejoin attribute is a presentation attribute defining the shape to be used at the corners of paths when they are stroked.

stroke-miterlimit - SVG: Scalable Vector Graphics

Web › SVG › Attribute › stroke-miterlimit

the stroke-miterlimit attribute is a presentation attribute defining a limit on the ratio of the miter length to the stroke-width used to draw a miter join.
...tribute is a presentation attribute defining a limit on the ratio of the miter length to the stroke-width used to draw a miter join.

stroke-opacity - SVG: Scalable Vector Graphics

Web › SVG › Attribute › stroke-opacity

the stroke-opacity attribute is a presentation attribute defining the opacity of the paint server (color, gradient, pattern, etc) applied to the stroke of a shape.
... the stroke-opacity attribute is a presentation attribute defining the opacity of the paint server (color, gradient, pattern, etc) applied to the stroke of a shape.

stroke-width - SVG: Scalable Vector Graphics

Web › SVG › Attribute › stroke-width

the stroke-width attribute is a presentation attribute defining the width of the stroke to be applied to the shape.
... the stroke-width attribute is a presentation attribute defining the width of the stroke to be applied to the shape.

stroke - SVG: Scalable Vector Graphics

Web › SVG › Attribute › stroke

the stroke attribute is a presentation attribute defining the color (or any svg paint servers like gradients or patterns) used to paint the outline of the shape; note: as a presentation attribute stroke can be used as a css property.
... the stroke attribute is a presentation attribute defining the color (or any svg paint servers like gradients or patterns) used to paint the outline of the shape; note: as a presentation attribute stroke can be used as a css property.

style - SVG: Scalable Vector Graphics

Web › SVG › Attribute › style

the style attribute allows to style an element using css declarations.
... the style attribute allows to style an element using css declarations.

target - SVG: Scalable Vector Graphics

Web › SVG › Attribute › target

the target attribute should be used when there are multiple possible targets for the ending resource, such as when the parent document is embedded within an html or xhtml document, or is viewed with a tabbed browser.
...ttribute should be used when there are multiple possible targets for the ending resource, such as when the parent document is embedded within an html or xhtml document, or is viewed with a tabbed browser.

text-decoration - SVG: Scalable Vector Graphics

Web › SVG › Attribute › text-decoration

ext decoration is declared.
...ext decoration, i.e.

text-rendering - SVG: Scalable Vector Graphics

Web › SVG › Attribute › text-rendering

the text-rendering attribute provides hints to the renderer about what tradeoffs to make when rendering text.
... the text-rendering attribute provides hints to the renderer about what tradeoffs to make when rendering text.

underline-position - SVG: Scalable Vector Graphics

Web › SVG › Attribute › underline-position

« svg attribute reference home the underline-position attribute represents the ideal vertical position of the underline.
... « svg attribute reference home the underline-position attribute represents the ideal vertical position of the underline.

underline-thickness - SVG: Scalable Vector Graphics

Web › SVG › Attribute › underline-thickness

« svg attribute reference home the underline-thickness attribute represents the ideal thickness of the underline.
... « svg attribute reference home the underline-thickness attribute represents the ideal thickness of the underline.

unicode-bidi - SVG: Scalable Vector Graphics

Web › SVG › Attribute › unicode-bidi

the unicode-bidi attribute specifies how the accumulation of the background image is managed.
... the unicode-bidi attribute specifies how the accumulation of the background image is managed.

word-spacing - SVG: Scalable Vector Graphics

Web › SVG › Attribute › word-spacing

user coordinate system.
...th one of the unit identifiers (e.g.

xlink:arcrole - SVG: Scalable Vector Graphics

Web › SVG › Attribute › xlink:arcrole

the xlink:arcrole attribute specifies a contextual role for the element and corresponds to the rdf primer notion of a property.
...d corresponds to the rdf primer notion of a property.

xlink:title - SVG: Scalable Vector Graphics

Web › SVG › Attribute › xlink:title

in a human-readable fashion.
...ation is highly dependent on the type of processing being done.

xml:base - SVG: Scalable Vector Graphics

Web › SVG › Attribute › xml:base

the xml:base attribute specifies a base iri other than the base iri of the document or external entity.
... the xml:base attribute specifies a base iri other than the base iri of the document or external entity.

SVG Attribute reference - SVG: Scalable Vector Graphics

Web › SVG › Attribute

svg elements can be modified using attributes that specify details about exactly how the element should be handled or rendered.
... svg elements can be modified using attributes that specify details about exactly how the element should be handled or rendered.

<animate> - SVG: Scalable Vector Graphics

Web › SVG › Element › animate

the svg <animate> element provides a way to animate an attribute of an element over time.
...peatcount, repeatdur, fill animation value attributes calcmode, values, keytimes, keysplines, from, to, by other animation attributes most notably: attributename, additive, accumulate animation event attributes most notably: onbegin, onend, onrepeat global attributes core attributes most notably: id styling attributes class, style event attributes global event attributes, document element event attributes usage notes this element implements the svganimateelement interface.

<feComposite> - SVG: Scalable Vector Graphics

Web › SVG › Element › feComposite

texture data.
..., each result pixel is computed using the following formula: result = k1*i1*i2 + k2*i1 + k3*i2 + k4 where: i1 and i2 indicate the corresponding pixel channel values of the input image, which map to in and in2 respectively k1, k2, k3 and k4 indicate the values of the attributes with the same name usage context categoriesfilter primitive elementpermitted contentany number of the following elements, in any order:<animate>, <set> attributes global attributes core attributes » presentation attributes » filter primitive attributes » class style specific attributes in in2 operator k1 k2 k3 k4 dom interface this element implements the svgfecompositeelement interface.

<feConvolveMatrix> - SVG: Scalable Vector Graphics

Web › SVG › Element › feConvolveMatrix

e pixel value is 120).
...here the input image's pixel grid aligns perfectly with the kernel's pixel grid) and assuming default values for attributes ‘divisor’, ‘targetx’ and ‘targety’, then resulting color value will be: (9* 0 + 8* 20 + 7* 40 + 6*100 + 5*120 + 4*140 + 3*200 + 2*220 + 1*240) / (9+8+7+6+5+4+3+2+1) usage context categoriesfilter primitive elementpermitted contentany number of the following elements, in any order:<animate>, <set> attributes global attributes core attributes presentation attributes filter primitive attributes class style specific attributes in order kernelmatrix divisor bias targetx targety edgemode kernelunitlength preservealpha dom interface this element implements the svgfeconvolvematrixelement interface.

<feMergeNode> - SVG: Scalable Vector Graphics

Web › SVG › Element › feMergeNode

the femergenode takes the result of another filter to be processed by its parent <femerge>.
...de in="sourcegraphic" /> </femerge> </filter> <rect x="40" y="40" width="100" height="100" style="stroke: #000000; fill: green; filter: url(#feoffset);" /> <rect x="40" y="40" width="100" height="100" style="stroke: #000000; fill: green;" /> </svg> result attributes global attributes core attributes » specific attributes in dom interface this element implements the svgfemergenodeelement interface.

<line> - SVG: Scalable Vector Graphics

Web › SVG › Element › line

the <line> element is an svg basic shape used to create a line connecting two points.
...a-level, aria-live, aria-modal, aria-multiline, aria-multiselectable, aria-orientation, aria-owns, aria-placeholder, aria-posinset, aria-pressed, aria-readonly, aria-relevant, aria-required, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriesbasic shape element, graphics element, shape elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements specifications specification status comment scalable vector graphics (svg) 2the definition of '<line>' in that specification.

<marker> - SVG: Scalable Vector Graphics

Web › SVG › Element › marker

the <marker> element defines the graphic that is to be used for drawing arrowheads or polymarkers on a given <path>, <line>, <polyline> or <polygon> element.
...ria-level, aria-live, aria-modal, aria-multiline, aria-multiselectable, aria-orientation, aria-owns, aria-placeholder, aria-posinset, aria-pressed, aria-readonly, aria-relevant, aria-required, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriescontainer elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specifications specification status co...

<mask> - SVG: Scalable Vector Graphics

Web › SVG › Element › mask

the <mask> element defines an alpha mask for compositing the current object into the background.
...s most notably: requiredextensions, systemlanguage presentation attributes most notably: clip-path, clip-rule, color, display, fill, fill-opacity, fill-rule, filter, mask, opacity, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility usage notes categoriescontainer elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specifications specification status co...

SVG Filters Tutorial - SVG: Scalable Vector Graphics

Web › SVG › Tutorial › SVG Filters Tutorial

filters svg allows us to use similar tools as the bitmap description language such as the use of shadow, blur effects or even merging the results of different filters.
... filters svg allows us to use similar tools as the bitmap description language such as the use of shadow, blur effects or even merging the results of different filters.

SVG: Scalable Vector Graphics

Web › SVG

bitmapped image formats such as jpeg or png, svg-format vector images can be rendered at any size without loss of quality and can be easily localized by updating the text within them, without the need of a graphical editor to do so.
...ng, svg-format vector images can be rendered at any size without loss of quality and can be easily localized by updating the text within them, without the need of a graphical editor to do so.

Referer header: privacy and security concerns - Web security

Web › Security › Referer header: privacy and security concerns

l networking widgets embedded in <iframe>) from secure areas of your website, like password reset pages, payment forms, login areas, etc.
...rver to control what information is sent through the referer header.

Web security

Web › Security

the primary goal of secure contexts is to prevent man-in-the-middle attackers from accessing powerful apis that could further compromise the victim of an attack.
... the x-content-type-options response http header is a marker used by the server to indicate that the mime types advertised in the content-type headers should not be changed and be followed.

XML: Extensible Markup Language

Web › XML

markup language similar to html.
...ds for extensible markup language and is a w3c recommended specification as a general purpose markup language.

format-number - XPath

Web › XPath › Functions › format-number

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the format-number function evaluates a number and returns a string representing the number in a given format.
...eturns a string representing the number in a given format.

namespace-uri - XPath

Web › XPath › Functions › namespace-uri

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the namespace-uri function returns a string representing the namespace uri of the first node in a given node-set.
... ) arguments node-set (optional) the namespace uri of the first node in this node-set will be returned.

Functions - XPath

Web › XPath › Functions

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the following is an annotated list of core xpath functions and xslt-specific additions to xpath, including a description, syntax, a list of arguments, result-type, source in the appropriate w3c recommendation, and degree of present gecko support.
...nd xslt-specific additions to xpath, including a description, syntax, a list of arguments, result-type, source in the appropriate w3c recommendation, and degree of present gecko support.

XPath

Web › XPath

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes xpath stands for xml path language.
...addressing (pointing to) different parts of an xml document.

<xsl:copy> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › copy

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:copy> element transfers a shallow copy (the node and any associated namespace node) of the current node to the output document.
...ansfers a shallow copy (the node and any associated namespace node) of the current node to the output document.

<xsl:if> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › if

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:if> element contains a test attribute and a template.
... xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:if> element contains a test attribute and a template.

<xsl:otherwise> - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › Element › otherwise

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:otherwise> element is used to define the action that should be taken when none of the <xsl:when> conditions apply.
...unctions, xpath axes the <xsl:otherwise> element is used to define the action that should be taken when none of the <xsl:when> conditions apply.

JavaScript/XSLT Bindings - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › XSLT JS interface in Gecko › JavaScript XSLT Bindings

nsformation, xsltprocessor requires an xml document, which is used in conjunction with the imported xsl file to produce the final result.
...re 2.

Setting Parameters - XSLT: Extensible Stylesheet Language Transformations

Web › XSLT › XSLT JS interface in Gecko › Setting Parameters

setting parameters while running transformations using precoded .xsl and .xml files is quite useful, configuring the .xsl file from javascript may be even more useful.
...arameters while running transformations using precoded .xsl and .xml files is quite useful, configuring the .xsl file from javascript may be even more useful.

XSLT: Extensible Stylesheet Language Transformations

Web › XSLT

xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes extensible stylesheet language transformations (xslt) is an xml-based language used, in conjunction with specialized processing software, for the transformation of xml documents.
...ocument is not changed; rather, a new xml document is created based on the content of an existing document.

Compiling a New C/C++ Module to WebAssembly - WebAssembly

WebAssembly › C to wasm

cc -o hello3.html hello3.c -o3 -s wasm=1 --shell-file html_template/shell_minimal.html -s no_exit_runtime=1 -s "extra_exported_runtime_methods=['ccall']" if you load the example in your browser again, you'll see the same thing as before!
...you'll see the same thing as before!

Loading Content Scripts - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Guides › Content Scripts › Loading Content Scripts

do, you may have problems getting your add-on approved on amo.

High-Level APIs - Archive of obsolete content

Archive › Add-ons › Add-on SDK › High-Level APIs

modules listed on this page implement high-level apis for building add-ons: creating user interfaces, interacting with the web, and interacting with the browser.

/loader - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs › loader

cases you can create a requirer module instance and a version of require exposed to it with this function: let requirer = module(requirerid, requireruri); let require = require(loader, requirer); let boostrap = require(bootstrapid); resolveuri() this function is used by the loader to resolve module uri from an id using a mapping array generated from the loader's paths option.

remote/child - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs › remote child

dk/remote/parent for more details.

ui/button/toggle - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs › ui button toggle

's state.

Low-Level APIs - Archive of obsolete content

Archive › Add-ons › Add-on SDK › Low-Level APIs

are not part of objects public api.

Alerts and Notifications - Archive of obsolete content

Archive › Add-ons › Code snippets › Alerts and Notifications

.getservice(components.interfaces.nsiwindowwatcher) .openwindow(null, 'chrome://global/content/alerts/alert.xul', '_blank', 'chrome,titlebar=no,popup=yes', null); win.arguments = [image, title, msg, false, '']; } using notification box another way of non-modal notification and further interaction with users is using of xul elements notificationbox and notification (implicitly).

Autocomplete - Archive of obsolete content

Archive › Add-ons › Code snippets › Autocomplete

turning autocomplete on for a xul widget this article is about xul widgets and not about html form inputs.

Cookies - Archive of obsolete content

Archive › Add-ons › Code snippets › Cookies

reading existing cookies cookies for a given host, represented as nsicookie2 objects, can be enumerated as such: let enum = services.cookies.getcookiesfromhost("example.com"); while (enum.hasmoreelements()) { var cookie = enum.getnext().queryinterface(ci.nsicookie2); dump(cookie.host + ";" + cookie.name + "=" + cookie.value + "\n"); } all cookies, regardless of host, can be enumerated using services.cookies.enumerator rather than getcookiesfromhost().

Drag & Drop - Archive of obsolete content

Archive › Add-ons › Code snippets › Drag & Drop

dropping files onto an xul application it's possible to setup drag and drop events to handle dropping files from external applications or os file managers onto your xul-based application.

Progress Listeners - Archive of obsolete content

Archive › Add-ons › Code snippets › Progress Listeners

d the change.

Scrollbar - Archive of obsolete content

Archive › Add-ons › Code snippets › Scrollbar

this example shows how to style the scrollbars in your xul application.

xml:base support in old browsers - Archive of obsolete content

Archive › Add-ons › Code snippets › XML › base function

otocol + '//' + loc.host + dirpath + link; } } return link; } function getxmlbase (thisitem) { // fix: need to keep going up the chain if still a relative url!!!!!

XPath - Archive of obsolete content

Archive › Add-ons › Code snippets › XPath

hexpression,returnedxml,namespaceresolver,returntype,result); //contextnode should be used in the one in which it was created //add by mooring 2008-11-15 16:00 china var xhr = new ajax('post','demo.xml',parsexml,'xml'); //ajax is a class written by javascript which return responsexml object to parsexml function function parsexml(obj)//obj is the returnxml object now { if(!obj.documentelement) { alert("your browser does't support this script!"); return; } var fields = [];//store the results if(window.activexobject) { var tobj = obj.documentelement.selectnodes("/root/field/item"); for(var i=0;i<tobj.length; i++) { fields.push(tobj[i].text); } } else { var tobj = obj.evaluate("/root/field/item",obj.documentelement,null, xpathresult.any_type, null); var tmp =...

XUL School Tutorial - Archive of obsolete content

Archive › Add-ons › Overlay Extensions › XUL School

adding menus and submenus adding toolbars and toolbar buttons adding events and commands adding windows and dialogs adding sidebars user notifications and alerts intermediate functionality intercepting page loads connecting to remote content handling preferences local storage advanced topics the box model xpcom objects observer notifications custom xul elements with xbl mozilla documentation roadmap useful mozilla community sites appendices appendix a: add-on performance appendix b: install and uninstall scripts appendix c: avoiding using eval in add-ons appendix d: loading scripts appendix e: dom building and html insertion appendix f: monitoring dom changes the xul school project was developed by appcoast (formerly glax...

Extensions support in SeaMonkey 2 - Archive of obsolete content

Archive › Add-ons › SeaMonkey 2

up just looks for any menupopup, so it goes wrong if you add your own.

Setting up an extension development environment - Archive of obsolete content

Archive › Add-ons › Setting up extension development environment

user file editor (firefox and thunderbird) firebug a variety of development tools (firefox) pentadactyl, a general purpose extension with builtin tools for extension development, including a command line with chrome javascript evaluation (including property and function argument completion) and the ability to demand-load external javascript and css files into window chrome.

Using the Stylesheet Service - Archive of obsolete content

Archive › Add-ons › Using the Stylesheet Service

eplace it with the url of the css file you want to load.

Creating a status bar extension - Archive of obsolete content

Archive › Creating a status bar extention

s supported.

MozAudioAvailable - Archive of obsolete content

Archive › Events › MozAudioAvailable

the mozaudioavailable event is fired when the audio buffer is full and the corresponding raw samples are available.

cached - Archive of obsolete content

Archive › Events › cached

the cached event is fired when the resources listed in the application cache manifest have been downloaded, and the application is now cached.

checking - Archive of obsolete content

Archive › Events › checking

the checking event is fired when the user agent is checking for an update, or attempting to download the cache manifest for the first time.

downloading - Archive of obsolete content

Archive › Events › downloading

g for an application cache update, if the user agent has found an update and is fetching it, or is downloading the resources listed by the cache manifest for the first time.

error - Archive of obsolete content

Archive › Events › error (appcache event)

the error event is fired when an error occurred while downloading the cache manifest or updating the content of the application.

noupdate - Archive of obsolete content

Archive › Events › noupdate

the noupdate event is fired after checking for an application cache update, if the manifest hasn't changed.

obsolete - Archive of obsolete content

Archive › Events › obsolete

the obsolete event is fired when the manifest was found to have become a 404 or 410 page, so the application cache is being deleted.

progress - Archive of obsolete content

Archive › Events › progress

the progress event is fired when the user agent is downloading resources listed by the manifest.

updateready - Archive of obsolete content

Archive › Events › updateready

ready event is fired when the resources listed in the application cache manifest have been newly redownloaded, and the script can use swapcache() to switch to the new cache.

Creating a Web based tone generator - Archive of obsolete content

Archive › Misc top level › Creating a Web based tone generator

selected } var k = 2* math.pi * frequency / samplerate; for (var i=0, size=sounddata.length; i<size; i++) { sounddata[i] = math.sin(k * currentsoundsample++); } } var audiodestination = new audiodatadestination(samplerate, requestsounddata); function start() { currentsoundsample = 0; frequency = parsefloat(document.getelementbyid("freq").value); } function stop() { frequency = 0; } </script> </body> </html> ...

ActiveX Control for Hosting Netscape Plug-ins in IE - Archive of obsolete content

Archive › Mozilla › ActiveX Control for Hosting Netscape Plug-ins in IE

"type" param, the control will attempt to use the mime type of this stream to create the correct plug-in.

Kill the XUL.mfl file for good - Archive of obsolete content

Archive › Mozilla › Automatic Mozilla Configurator › Kill the XUL.mfl file for good

avoiding the creation of the xul.mfl file mozilla creates in its profile directory a file named xul.mfl, which contains pre-compiled ui elements.

Finding the file to modify - Archive of obsolete content

Archive › Mozilla › Creating a Mozilla extension › Finding the file to modify

r and the style layer, and some behavior can be partly defined in the style layer.) we're going to add code to all three ui layers, starting with the structure layer.

Dehydra Object Reference - Archive of obsolete content

Archive › Mozilla › Dehydra › Object Reference

object the template from which this class was instantiated, if applicable.

Developing New Mozilla Features - Archive of obsolete content

Archive › Mozilla › Developing New Mozilla Features

ributors, but you’ll be able to deal with the occasional problems just by asking someone else.

Download Manager preferences - Archive of obsolete content

Archive › Mozilla › Download Manager preferences

ault value is true.

Embedding FAQ - Archive of obsolete content

Archive › Mozilla › Embedding FAQ

faq mozilla.dev.embedding how to start embedding you can find a examples, faqs, and the api from mozilla itself.

Layout FAQ - Archive of obsolete content

Archive › Mozilla › Firefox › Layout FAQ

,600} [state=00000010] sc=035ff264(i=2,b=0)< line 035ffc18: count=1 state=inline,clean,prevmarginclean,not impacted,not wrapped,before:nobr,after:linebr[0x5100] {0,0,330,300} < inline(span)(0)@035ffa04 next=035ffc48 next-continuation=035ffc48 {0,7,330,285} [content=0359ed50] [sc=035ff990]< text(0)@035ffa8c[0,4,t] next=035ffb1c {0,0,330,285} [state=41600020] sc=035ffa3c pst=:-moz-non-element< "\nabc" > frame(br)(1)@035ffb1c {330,225,0,0} [state=00000020] [content=035aebf0] > > the linebox is used to contain everything on a single line: example how do you fix inconsistent float behavior in firefox involving a two column layout using display:table and floating div elements?

Microsummary topics - Archive of obsolete content

Archive › Mozilla › Microsummary topics

rosummaryservice); var generator = microsummaryservice.installgenerator(generatordoc); the service installs the generator by serializing its xml to a file in the user's profile directory and adding the generator to the service's in-memory generator cache.

Modularization techniques - Archive of obsolete content

Archive › Mozilla › Modularization Techniques

t, to implement and call xpcom objects.

Plugin Architecture - Archive of obsolete content

Archive › Mozilla › Plugin architecture

s.

FAQ - Archive of obsolete content

Archive › Mozilla › Prism › FAQ

increase the capabilities of those apps by adding features to the web itself, like support for offline data storage and access to 3d graphics hardware, that will be available to web applications in both prism and firefox.

Prism - Archive of obsolete content

Archive › Mozilla › Prism

reation and dock/tray icons.

Space Manager Detailed Design - Archive of obsolete content

Archive › Mozilla › Space Manager Detailed Design

duction to the classes, structures and algorithms container in this, the detailed design document.

URIs and URLs - Archive of obsolete content

Archive › Mozilla › URIs and URLs

older rfc 1808.

Venkman Internals - Archive of obsolete content

Archive › Mozilla › Venkman › Internals

localization code, reads venkman.properties from a subdirectory of "locale" and injects variables.

Venkman Introduction - Archive of obsolete content

Archive › Mozilla › Venkman › Introduction

n, the javascript stops immediately.

Creating XPI Installer Modules - Archive of obsolete content

Archive › Mozilla › XPInstall › Creating XPI installer modules

described in this section is a very simple one, but it uses the new packaging scheme and the chrome registry to make itself a piece of self-contained and redistributable software.

Mozilla E4X - Archive of obsolete content

Archive › Mozilla › XTech 2005 Presentations › Mozilla E4X

presentation view online download summary "ecmascript for xml" (ecma-357), a new standard for writing and processing xml directly in javascript (ecma-262, iso-16262).

SVG And Canvas In Mozilla - Archive of obsolete content

Archive › Mozilla › XTech 2005 Presentations › Rich Web › SVG And Canvas In Mozilla

ties to web developers.

browserid - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › Browserid

« xul reference home browserid type: string the id of the browser element to which the findbar is attached.

accessible - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › accessible

« xul reference home accessible type: nsiaccessible returns the accessibility object for the element.

allownegativeassertions - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › allownegativeassertions

« xul reference home allownegativeassertions type: boolean valid on any element that has a datasources attribute.

bottom - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › bottom

« xul reference home bottom type: string (representing an integer) for elements placed directly within a stack, specifies the pixel position of the bottom edge of the element relative to the bottom edge of the stack.

checkState - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › checkState

checkbox except that there is a third state which must be set manually by adjusting the check state.

checked - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › checked

« xul reference home checked type: boolean indicates whether the element is checked or not.

class - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › class

« xul reference home class type: string the style class of the element.

coalesceduplicatearcs - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › coalesceduplicatearcs

« xul reference home coalesceduplicatearcs type: boolean valid on any element that has a datasources attribute.

collapsed - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › collapsed

« xul reference home collapsed type: boolean if true, then the element is collapsed and does not appear.

container - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › container

« xul reference home container type: boolean set to true if the element is to act as a container which can have child elements.

containment - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › containment

« xul reference home containment type: uri this attribute specifies rdf properties (an rdf predicate) that indicate that a resource is a container.

contentcontextmenu - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › contentcontextmenu

« xul reference home contentcontextmenu type: id the id of a menupopup element serving as the context menu for the content area in the tabbrowser.

contenttooltip - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › contenttooltip

« xul reference home contenttooltip type: id the id of a tooltip element to be used for the content area in the tabbrowser.

disableKeyNavigation - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › disableKeyNavigation

« xul reference home disablekeynavigation type: boolean if this attribute is not used, the user can navigate to specific items within the element by pressing keys corresponding to letters in the item's label.

disablefastfind - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › disablefastfind

« xul reference homedisablefastfindtype: booleanput disablefastfind="true" on the root element of a xul document, which is intended to be loaded in a tab, to disable the find bar for the tab with this document.

drawintitlebar - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › drawintitlebar

« xul reference home drawintitlebar type: boolean if this attribute is true, the top of the window's content area will begin at the top edge of the title bar, instead of below the title bar.

droppedLinkHandler - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › droppedLinkHandler

« xul reference home droppedlinkhandler type: function this function is called when links are dropped to the browser element, with the following arguments.

empty - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › empty

« xul reference home empty type: boolean set to true if the element is a container that contains no children.

events - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › events

pe: comma-separated list a comma-separated list of event names that the command updater will update upon.

expr - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › expr

« xul reference home expr type: string for xml queries, an xpath expression which returns results.

flags - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › flags

« xul reference home flags type: space-separated list of the values below a set of flags used for miscellaneous purposes.

focused - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › focused

« xul reference home focused type: boolean this attribute is true if the element is focused.

hidden - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › hidden

« xul reference home hidden type: boolean if set to true, the element is not displayed.

homepage - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › homepage

« xul reference home homepage type: url this attribute allows you to set a homepage for the browser element.

href - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › href

« xul reference home href type: string defines a url to open when this element is clicked.

insertafter - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › insertafter

« xul reference home insertafter type: id when an element is in an overlay, the insertafter attribute specifies the id of the element in the base window that the element should appear after.

insertbefore - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › insertbefore

« xul reference home insertbefore type: id when an element is in an overlay, the insertbefore attribute specifies the id of the element in the base window that the element should appear before.

inverted - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › inverted

« xul reference home inverted type: boolean for boolean preferences, if this attribute is set to true, it indicates that the value of the preference is the reverse of the user interface element attached to it.

keytext - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › keytext

« xul reference home keytext type: string a label for the keyboard shortcut.

left - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › left

« xul reference home left type: string (representing an integer) for elements placed directly within a stack, specifies the pixel position of the left edge of the element relative to the left edge of the stack.

lightweightthemesfooter - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › lightweightthemesfooter

« xul reference home lightweightthemesfooter type: id specifies the id of an element to which a lightweight theme's footer image will be applied.

maxheight - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › maxheight

« xul reference home maxheight type: string (representing an integer) the maximum height of the element.

maxwidth - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › maxwidth

« xul reference home maxwidth type: string (representing an integer) the maximum width of the element.

menuitem.key - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › menuitem.key

« xul reference home key type: id set to the id of a key element whose key shortcut is displayed in the menuitem.

minheight - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › minheight

« xul reference home minheight type: string (representing an integer) the minimum height of the element.

minwidth - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › minwidth

« xul reference home minwidth type: string (representing an integer) the minimum width of the element.

noautofocus - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › noautofocus

« xul reference home noautofocus type: boolean if false, the default value, the currently focused element will be unfocused whenever the popup is opened or closed.

noautohide - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › noautohide

« xul reference home noautohide type: boolean if this attribute is set to false or omitted, the tooltip will automatically disappear after a few seconds.

object - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › object

« xul reference home object type: string the object of the element.

observes - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › observes

« xul reference home observes type: id set to an id of a broadcaster element that is being observed by the element.

onchange - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › onchange

« xul reference home overview an onchange attribute is an event listener to the object for the event change.

onclick - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › onclick

« xul reference home onclick type: script code this event handler is called when the object is clicked.

oncommand - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › oncommand

m or presses a keyboard shortcut attached to the command.

onerror - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › onerror

« xul reference home onerror type: script code this event is sent to an image element when an error occurs loading the image.

oninput - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › oninput

« xul reference home oninput type: script code this event is sent when a user enters text in a textbox.

parent - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › parent

« xul reference home parent type: element tag name if set, the rule will only match the corresponding tag.

persist - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › persist

ype: space-separated list of attribute names a space-separated list of attributes that are maintained when the window is closed.

phase - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › phase

« xul reference home phase type: string the event phase where the handler is invoked.

pinned - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › pinned

« xul reference home pinned type: boolean this attribute is set to true if the tab has been pinned (that is, if it's an app tab).

popup.position - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › popup.position

« xul reference home position type: string the position attribute determines where the popup appears relative to the element the user clicked to invoke the popup.

preference - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › preference

« xul reference home preference type: id connects the element to a corresponding preference.

prefpane.src - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › prefpane.src

« xul reference home src type: uri the uri of the overlay contents of preference pane.

prefwindow.onload - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › prefwindow.onload

« xul reference home prefwindow.onload type: script code when a window finishes loading, it calls this event handler on the prefwindow element.

properties - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › properties

« xul reference home properties type: space-separated list of property names sets the properties of the element, which can be used to style the element.

readonly - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › readonly

« xul reference home readonly type: boolean if set to true, then the user cannot change the value of the element.

ref - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › ref

« xul reference home ref type: uri for template-generated elements, this attribute is used to specify the root rdf node where content generation begins.

reserved - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › reserved

« xul reference home reserved type: string this attribute applies to a command element.

resizer.type - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › resizer.type

« xul reference hometypetype: stringset this to the value "window" for a resizing grip that appears in the bottom corner of the window, used for resizing the window.

sizemode - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › sizemode

code, use window.windowstate.

sortResource - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › sortResource

« xul reference home sortresource type: uri for template-generated content, this specifies the sort key, if you would like the content to be sorted.

src - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › src

« xul reference home src type: uri the uri of the content to appear in the element.

statusbar - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › statusbar

« xul reference home statusbar type: id if you set this attribute to the id of a statusbar element, the label on the statusbar will update to the statustext of the items on the menu as the user moves the mouse over them.

style - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › style

« xul reference home style type: css inline style css style rules to be applied to the element.

subject - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › subject

« xul reference home subject type: string the subject of the element.

tabscrolling - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › tabScrolling

« xul reference home tabscrolling new in thunderbird 3requires seamonkey 2.0 type: boolean if true, the user may cycle through the results list by pressing the tab key.

tabs.onselect - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › tabs.onselect

« xul reference home onselect type: script code this event is sent to the tabs element when this tab is changed.

textbox.crop - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › textbox.crop

« xul reference home crop type: boolean this attribute is not used and is only provided for compatibility with the menulist element.

textbox.onchange - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › textbox.onchange

« xul reference home onchange type: script code this event is sent when the value of the textbox is changed.

textbox.tabScrolling - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › textbox.tabScrolling

« xul reference home tabscrolling obsolete since gecko 1.9.1 type: boolean if true, the user may cycle through the results list by pressing the tab key.

toolbarbutton.type - Archive of obsolete content

Archive › Mozilla › XUL › Attribute › toolbarbutton.type

« xul reference home type type: string the type of button.