Search completed in 1.49 seconds.
<link>: The External Resource Link element - HTML: Hypertext Markup Language
the html external resource
link element (<
link>) specifies relationships between the current document and an external resource.
... this element is most commonly used to
link to stylesheets, but is also used to establish site icons (both "favicon" style icons and icons for the home screen and apps on mobile devices) among other things.
... to
link an external stylesheet, you'd include a <
link> element inside your <head> like this: <
link href="main.css" rel="stylesheet"> this simple example provides the path to the stylesheet inside an href attribute, and a rel attribute with a value of stylesheet.
...And 45 more matches
Migrating from Internal Linkage to Frozen Linkage - Archive of obsolete content
extension code using internal
linkage will need to migrate to use frozen
linkage because internal
linkage will not be available in firefox 3.
... this document is a guide to common code patterns that may need to change to work with frozen
linkage.
... strings the most obvious change required by frozen
linkage is using the frozen string api.
...And 3 more matches
<blink>: The Blinking Text element (obsolete) - HTML: Hypertext Markup Language
the html b
link element (<b
link>) is a non-standard element which causes the enclosed text to flash slowly.
...b
linking text is frowned upon by several accessibility standards and the css specification allows browsers to ignore the <b
link> element.
... example <b
link>why would somebody use this?</b
link> result (toned down!) specification this element is non-standard and not part of any specification.
... b
link { -webkit-animation: 2s linear infinite condemned_b
link_effect; /* for safari 4.0 - 8.0 */ animation: 2s linear infinite condemned_b
link_effect; } /* for safari 4.0 - 8.0 */ @-webkit-keyframes condemned_b
link_effect { 0% { visibility: hidden; } 50% { visibility: hidden; } 100% { visibility: visible; } } @keyframes condemned_b
link_effect { 0% { visibility: hidden; } 50% { visibility: hidden; } 100% { visibility: visible; } } ...
Creating hyperlinks - Learn web development
previous overview: introduction to html next hyper
links are really important — they are what makes the web a web.
... this article shows the syntax required to make a
link, and discusses
link best practices.
... objective: to learn how to implement a hyper
link effectively, and
link multiple files together.
...And 70 more matches
Link types - HTML: Hypertext Markup Language
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.
... list of the defined
link types and their significance in html
link type description allowed in these elements not allowed in these elements alternate if the element is <
link> and the rel attribute also contains the stylesheet type, the
link defines an alternative style sheet; in that case the title attribute must be present and not be the empty string.
... if the type is set to application/rss+xml or application/atom+xml, the
link defines a syndication feed.
...And 64 more matches
Styling links - Learn web development
previous overview: styling text next when styling
links, it is important to understand how to make use of pseudo-classes to style
link states effectively, and how to style
links for use in common varied interface features such as navigation menus and tabs.
... objective: to learn how to style
link states, and how to use
links effectively in common ui features like navigation menus.
... let's look at some
links we looked at how
links are implemented in your html according to best practices in creating hyper
links.
...And 48 more matches
What are hyperlinks? - Learn web development
in this article, we'll go over what hyper
links are and why they matter.
... objective: learn about
links on the web and why they matter.
... summary hyper
links, usually called
links, are a foundational concept behind the web.
...And 36 more matches
xlink:href - SVG: Scalable Vector Graphics
the x
link:href attribute defines a reference to a resource as a reference iri.
... the exact meaning of that
link depends on the context of each element using it.
... note: svg 2 removed the need for the x
link namespace, so instead of x
link:href you should use href.
...And 27 more matches
HTMLLinkElement - Web APIs
the html
linkelement 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).
... <div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25"...
... x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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>...
...And 25 more matches
Link prefetching FAQ - HTTP
what is
link prefetching?
...
link prefetching is a browser mechanism, which utilizes browser idle time to download or prefetch documents that the user might visit in the near future.
... the browser looks for either an html <
link> or an http
link: header with a relation type of either next or prefetch.
...And 25 more matches
IAccessibleHyperlink
other-licenses/ia2/accessiblehyper
link.idlnot scriptable this interface represents hyper
links.
... 1.0 66 introduced gecko 1.9 inherits from: iaccessibleaction last changed in gecko 1.9 (firefox 3) this interface represents a hyper
link associated with a single substring of text or single non-text object.
... non-text objects can have either a single
link or a collection of
links such as when the non-text object is an image map.
...And 19 more matches
Test your skills: Links - Learn web development
the aim of this skill test is to assess whether you've understood our creating hyper
links article.
...
links 1 in this task we want you to help fill in the
links on our whales information page: the first
link should be
linked to a page called whales.html, which is in the same directory as the current page.
... the second
link should be turned into a
link you can click to open up an email in the user's default mail application, with the recipient set as "whales@example.com".
...And 14 more matches
nsIAccessibleHyperLink
accessible/public/nsiaccessiblehyper
link.idlscriptable a cross-platform interface that supports hyper
link-specific properties and methods.
...x 3) method overview nsiaccessible getanchor(in long index); note: renamed from getobject in gecko 1.9 nsiuri geturi(in long index); boolean isselected(); obsolete since gecko 1.9 boolean isvalid(); obsolete since gecko 1.9 attributes attribute type description anchorcount long the number of anchors within this hyper
link.
... endindex long the end offset of the hyper
link accessible within the parent accessible.
...And 14 more matches
nsIDroppedLinkHandler
dom/base/nsidropped
linkhandler.idlscriptable please add a summary to this article.
... 1.0 66 introduced gecko 2.0 inherits from: nsisupports last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) method overview boolean candrop
link(in nsidomdragevent aevent, in prbool aallowsamedocument); astring drop
link(in nsidomdragevent aevent, out astring aname, [optional] in boolean adisallowinherit); void drop
links(in nsidomdragevent aevent, [optional] in boolean adisallowinherit, [optional] out unsigned long acount, [retval, array, size_is(acount)] out nsidropped
linkitem a
links); methods candrop
link() determines if a
link being dragged can be dropped.
... boolean candrop
link( in nsidomdragevent aevent, in prbool aallowsamedocument ); parameters aevent a dragenter or dragover event.
...And 13 more matches
nsINetworkLinkService
netwerk/base/public/nsinetwork
linkservice.idlscriptable network
link status monitoring service.
... 1.0 66 introduced gecko 1.8 inherits from: nsisupports last changed in gecko 8.0 (firefox 8.0 / thunderbird 8.0 / seamonkey 2.5) implemented by: @mozilla.org/network/network-
link-service;1 as a service: var network
linkservice = components.classes["@mozilla.org/network/network-
link-service;1"] .getservice(components.interfaces.nsinetwork
linkservice); attributes attribute type description is
linkup boolean this is set to true when the system is believed to have a usable network connection.
... the
link is only up when network connections can be established.
...And 13 more matches
Using the link role - Accessibility
this technique demonstrates how to use the
link role and describes the effect it has on browsers and assistive technology.
... the
link role is used to identify an element that creates a hyper
link to a resource that is in the application or external.
... when this role is added to an element, tab can be used to change focus to the
link, and enter used to execute the
link.
...And 13 more matches
HTMLHyperlinkElementUtils - Web APIs
the htmlhyper
linkelementutils mixin defines utility methods and properties to work with htmlanchorelement and htmlareaelement.
... htmlhyper
linkelementutils.href this a stringifier property that returns a usvstring containing the whole url, and allows the href to be updated.
... htmlhyper
linkelementutils.protocol this is a usvstring containing the protocol scheme of the url, including the final ':'.
...And 12 more matches
:link - CSS: Cascading Style Sheets
the :
link css pseudo-class represents an element that has not yet been visited.
... it matches every unvisited <a>, <area>, or <
link> element that has an href attribute.
... /* selects any <a> that has not 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.
...And 11 more matches
WebAssembly.LinkError - JavaScript
the webassembly.
linkerror object indicates an error during module instantiation (besides traps from the start function).
... constructor webassembly.
linkerror() creates a new webassembly.
linkerror object.
... instance properties webassembly.
linkerror.prototype.message error message.
...And 10 more matches
Scroll-linked effects
the definition of a scroll-
linked effect is an effect implemented on a webpage where something changes based on the scroll position, for example updating a positioning property with the aim of producing a parallax scrolling effect.
... this article discusses scroll-
linked effects, their effect on performance, related tools, and possible mitigation techniques.
... <body style="height: 5000px"> <style> body, /* b
link currently has bug that requires declaration on `body` */ html { scroll-snap-type: y proximity; } .snaptarget { scroll-snap-align: start; position: relative; top: 200px; height: 200px; background-color: green; } </style> <div class="snaptarget"></div> </body> this version can work smoothly in the browser even if there is slow-running javascrip...
...And 5 more matches
Dynamic Library Linking
it also provides a method by which to condition symbols of statically
linked code so that to other clients it appears as though they are dynamically loaded.
... library
linking types these data types are defined for dynamic library
linking: prlibrary prstatic
linktable library
linking functions the library
linking functions are: pr_setlibrarypath pr_getlibrarypath pr_getlibraryname pr_freelibraryname pr_loadlibrary pr_unloadlibrary pr_findsymbol pr_findsymbolandlibrary finding symbols defined in the main executable program pr_loadlibrary cannot open a handle that references the main executable program.
... platform notes to use the dynamic library loading functions on some platforms, certain environment variables must be set at run time, and you may need to
link your executable programs using special
linker options.
...And 4 more matches
Document.alinkColor - Web APIs
returns or sets the color of an active
link in the document body.
... a
link is active during the time between mousedown and mouseup events.
... syntax var color = document.a
linkcolor; document.a
linkcolor = color; color is a string containing the name of the color (e.g., blue, darkblue, etc.) or the hexadecimal value of the color (e.g., #0000ff) notes the default value for this property in mozilla firefox is red (#ee0000 in hexadecimal).
...And 4 more matches
String.prototype.link() - JavaScript
the
link() method creates a string representing the code for an <a> html element to be used as a hypertext
link to another url.
... syntax str.
link(url) parameters url any string 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 ".
... description use the
link() method to create an html snippet for a hypertext
link.
...And 4 more matches
String.prototype.blink() - JavaScript
the b
link() method creates a <b
link> html element that causes a string to b
link.
... warning: b
linking text is frowned upon by several accessibility standards.
... the <b
link> element itself is non-standard and deprecated!
...And 3 more matches
-moz-text-blink - Archive of obsolete content
the -moz-text-b
link non-standard mozilla css extension specifies the b
link mode.
... initial valuenoneapplies toall elementsinheritednocomputed valueas specifiedanimation typediscrete syntax values none produces no b
linking.
... b
link text b
links.
...And 2 more matches
XLink - MDN Web Docs Glossary: Definitions of Web-related terms
x
link is a w3c standard which is used to describe
links between xml and xml or other documents.
... simple x
links are "supported" in firefox (at least in svg and mathml), though they do not work as
links if one loads a plain xml document with x
links and attempts to click on the relevant points in the xml tree.
... for those who may have found x
link 1.0 cumbersome for regular
links, x
link 1.1 drops the need to specify x
link:type="simple" for simple
links.
...And 2 more matches
nsIDroppedLinkItem
dom/base/nsidropped
linkhandler.idlscriptable please add a summary to this article.
... 1.0 66 introduced gecko 2.0 inherits from: nsisupports last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) attributes attribute type description url domstring url of the dropped
link.
... name domstring name of the dropped
link.
...And 2 more matches
Document.linkColor - Web APIs
the document.
linkcolor property gets/sets the color of
links within the document.
...as an alternative, you can set the css color property on either html anchor
links (<a>) or on :
link pseudo-classes.
... another alternative is document.body.
link, although this is deprecated in html 4.01.
...And 2 more matches
LinkStyle - Web APIs
the
linkstyle interface provides access to the associated css style sheet of a node.
...
linkstyle is a raw interface and no object of this type can be created; it is implemented by html
linkelement and htmlstyleelement objects.
...
linkstyle.sheet read only returns the cssstylesheet object associated with the given element, or null if there is none.
...And 2 more matches
WebGLRenderingContext.linkProgram() - Web APIs
the webglrenderingcontext interface's
linkprogram() method
links a given webglprogram, completing the process of preparing the gpu code for the program's fragment and vertex shaders.
... syntax void gl.
linkprogram(program); parameters program the webglprogram to
link.
... examples var program = gl.createprogram(); // attach pre-existing shaders gl.attachshader(program, vertexshader); gl.attachshader(program, fragmentshader); gl.
linkprogram(program); if ( !gl.getprogramparameter( program, gl.
link_status) ) { var info = gl.getprograminfolog(program); throw new error('could not compile webgl program.
...And 2 more matches
Link - HTTP
the http
link entity-header field provides a means for serialising one or more
links in http headers.
... it is semantically equivalent to the html <
link> element.
... syntax
link: < uri-reference >; param1=value1; param2="value2" <uri-reference> the uri reference, must be enclosed between < and >.
...And 2 more matches
WebAssembly.LinkError() constructor - JavaScript
the webassembly.
linkerror() constructor creates a new webassembly
linkerror object, which indicates an error during module instantiation (besides traps from the start function).
... syntax new webassembly.
linkerror(message, filename, linenumber) parameters message optional human-readable description of the error.
... examples creating a new
linkerror instance the following snippet creates a new
linkerror instance, and logs its details to the console: try { throw new webassembly.
linkerror('hello', 'somefile', 10); } catch (e) { console.log(e instanceof
linkerror); // true console.log(e.message); // "hello" console.log(e.name); // "
linkerror" console.log(e.filename); // "somefile" console.log(e.linenumber); // 10 console.log(e.columnnumber); // 0 console.log(e.stack); // returns the location where the code was run } specifications ...
...And 2 more matches
xlink:show - SVG: Scalable Vector Graphics
the x
link:show attribute indicates how a
linked resource should be opened and is meant for x
link-aware processors.
... embed this value specifies that instead of
linking to the resource it will be loaded and shown within the document.
... other this value indicates that other markup present in the
link, i.e.
...And 2 more matches
Linked Lists
this chapter describes the nspr api for managing
linked lists.
... the api is a set of macros for initializing a circular (doubly
linked) list, inserting and removing elements from the list.
...
linked list types
linked list macros
linked list types the prclist type represents a circular
linked list.
...
linked list macros macros that create and operate on
linked lists are: pr_init_clist pr_init_static_clist pr_append_
link pr_insert_
link pr_next_
link pr_prev_
link pr_remove_
link pr_remove_and_init_
link pr_insert_before pr_insert_after pr_clist_is_empty pr_list_head pr_list_tail ...
JS_LinkConstructorAndPrototype
syntax bool js_
linkconstructorandprototype(jscontext *cx, js::handle<jsobject*> ctor, js::handle<jsobject*> proto); name type description cx jscontext * pointer to a js context from which to derive runtime information.
... description js_
linkconstructorandprototype sets the prototype property of class constructor function, ctor, to prototype object, proto with jsprop_permanent | jsprop_readonly flags, and sets the constructor property of proto to ctor with no flag.
... on successful, js_
linkconstructorandprototype returns true.
... see also mxr id search for js_
linkconstructorandprototype js_initclass bug 722729 ...
Filelink Providers
file
link is a thunderbird feature that makes it easy for users to upload large attachments to web-based storage services such as hightail.
... nsimsgcloudfileprovider note: cloudfiles and bigfiles were the two temporary feature names that were used while file
link was under construction.
... both refer to the file
link feature.
... file
link storage providers must implement the nsimsgcloudfileprovider interface.
Document.links - Web APIs
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.
... syntax nodelist = document.
links value an htmlcollection.
... example var
links = document.
links; for(var i = 0; i <
links.length; i++) { var
linkhref = document.createtextnode(
links[i].href); var linebreak = document.createelement("br"); document.body.appendchild(
linkhref); document.body.appendchild(linebreak); } specifications specification status comment html living standardthe definition of 'document.
links' in that specification.
... living standard document object model (dom) level 2 html specificationthe definition of 'document.
links' in that specification.
Document.vlinkColor - Web APIs
the document.v
linkcolor property gets/sets the color of
links that the user has visited in the document.
... syntax color = document.v
linkcolor document.v
linkcolor = color parameters color is a string representing the color as a word (e.g., "red") or hexadecimal value (e.g., "#ff0000").
... document.v
linkcolor is deprecated in dom level 2 html.
... another alternative is document.body.v
link, although this is deprecated in html 4.01 in favor of the css alternative.
HTMLLinkElement.rel - Web APIs
the html
linkelement.rel property reflects the rel attribute.
... it is a domstring containing a space-separated list of
link types indicating the relationship between the resource represented by the <
link> element and the current document.
... the most common use of this attribute is to specify a
link to an external style sheet: the property is set to stylesheet, and the href attribute is set to the url of an external style sheet to format the page.
... syntax var relstr =
linkelt.rel;
linkelt.rel = relstr; example var
links = document.getelementsbytagname('
link'); var length =
links.length; for (var i = 0; i < length; i++) { alert(
links[i]); } specifications specification status comment html living standardthe definition of 'rel' in that specification.
NetworkInformation.downlink - Web APIs
the down
link read-only property of the networkinformation interface returns the effective bandwidth estimate in megabits per second, rounded to the nearest multiple of 25 kilobits per seconds.
... note that chrome-based browsers do not conform to the specification, and arbitrarily cap the reported down
link at a maximum of 10 mbps as an anti-fingerprinting measure.
... syntax var down
link = networkinformation.down
link value a double.
... specifications specification status comment network information apithe definition of 'down
link' in that specification.
:any-link - CSS: Cascading Style Sheets
the :any-
link css pseudo-class selector represents an element that acts as the source anchor of a hyper
link, independent of whether it has been visited.
... in other words, it matches every <a>, <area>, or <
link> element that has an href attribute.
... thus, it matches all elements that match :
link or :visited.
... /* selects any element that would be matched by :
link or :visited */ :any-
link { color: green; } syntax :any-
link examples html <a href="https://example.com">external
link</a><br> <a href="#">internal target
link</a><br> <a>placeholder
link (won't get styled)</a> css a:any-
link { border: 1px solid blue; color: orange; } /* webkit browsers */ a:-webkit-any-
link { border: 1px solid blue; color: orange; } result specifications specification status comment selectors level 4the definition of ':any-
link' in that specification.
xlink:title - SVG: Scalable Vector Graphics
the x
link:title attribute is used to describe the meaning of a
link or resource in a human-readable fashion.
...it may be used, for example, to make titles available to applications used by visually impaired users, or to create a table of
links, or to present help text that appears when a user lets a mouse pointer hover over a starting resource.
... note: new content should use a <title> child element rather than a x
link:title attribute.
... <animatetransform>, <color-profile>, <cursor>, <feimage>, <filter>, <font-face-uri>, <glyphref>, <image>, <lineargradient>, <mpath>, <pattern>, <radialgradient>, <script>, <set>, <textpath>, <tref>, and <use> usage context value <anything> default value none animatable no <anything> this value specifies the title used to describe the meaning of the
link or resource.
xlink:type - SVG: Scalable Vector Graphics
the x
link:type attribute identifies the type of x
link being used.
... in svg, only simple
links are available.
...animatemotion>, <animatetransform>, <color-profile>, <cursor>, <feimage>, <filter>, <font-face-uri>, <glyphref>, <image>, <lineargradient>, <mpath>, <pattern>, <radialgradient>, <script>, <set>, <textpath>, <tref>, and <use> usage notes value simple default value simple animatable no simple this value specifies that the referred resource is a simple
link.
... specifications specification status comment scalable vector graphics (svg) 1.1 (second edition)the definition of 'x
link:type' in that specification.
linkedpanel - Archive of obsolete content
« xul reference home
linkedpanel type: id the id of the
linked tabpanel element that will be displayed when the tab is selected.
...however, if this attribute is used, this behavior is overridden, and the tab will always be
linked to a specific panel.
... this might be used to avoid duplication by
linking several tabs to one panel with slight differences to the content adjusted in the select event.
Hyperlink - MDN Web Docs Glossary: Definitions of Web-related terms
hyper
links connect webpages or data items to one another.
... in html, <a> elements define hyper
links from a spot on a webpage (like a text string or image) to another spot on some other webpage (or even on the same page).
... learn more general knowledge hyper
link on wikipedia the hyper
link guide on mdn technical reference
links in html documents - w3c html5 a - hyper
link - w3c learn about it <a> on mdn <
link> on mdn ...
PRStaticLinkTable
a static
link table entry can be created by a client of the runtime so that other clients can access static or dynamic libraries transparently.
...if, during initialization, such entries are manually created, then future attempts to
link to the symbols can be treated in a consistent fashion.
... syntax #include <pr
link.h> typedef struct prstatic
linktable { const char *name; void (*fp)(); } prstatic
linktable; ...
PR_REMOVE_AND_INIT_LINK
removes an element from a circular list and initializes the
linkage.
... syntax #include <prclist.h> pr_remove_and_init_
link (prclist *elemp); parameter elemp a pointer to the element.
... description pr_remove_and_init_
link removes the specified element from its circular list and initializes the
links of the element to point to itself.
HTMLHyperlinkElementUtils.toString() - Web APIs
the htmlhyper
linkelementutils.tostring() stringifier method returns a usvstring containing the whole url.
... it is a read-only version of htmlhyper
linkelementutils.href.
... syntax string = object.tostring(); examples // let's imagine an <a id="myanchor" href="https://developer.mozilla.org/docs/htmlhyper
linkelementutils/tostring"> element is in the document var anchor = document.getelementbyid("myanchor"); var result = anchor.tostring(); // returns: 'https://developer.mozilla.org/docs/htmlhyper
linkelementutils/tostring' specifications specification status comment html living standard living standard ...
HTMLLinkElement.relList - Web APIs
the html
linkelement.rellist read-only property reflects the rel attribute.
... it is a live domtokenlist containing the set of
link types indicating the relationship between the resource represented by the <
link> element and the current document.
... syntax var relstr =
linkelt.rellist; example var
links = document.getelementsbytagname("
link"); var length =
links.length; for (var i = 0; i < length; i++) { var list =
links[i].rellist; var listlength = list.length; console.log("new
link found."); for (var j = 0; j < listlength; j++) { console.log(list[j]); } } specifications specification status comment html living standardthe definition of 'rellist' in that specification.
NetworkInformation.downlinkMax - Web APIs
the networkinformation.down
linkmax read-only property returns the maximum down
link speed, in megabits per second (mbps), for the underlying connection technology.
... syntax var max = networkinformation.down
linkmax return value an unrestricted double representing the maximum down
link speed, in megabits per second (mb/s), for the underlying connection technology.
... function logconnectiontype() { var connectiontype = 'not supported'; var down
linkmax = 'not supported'; if ('connection' in navigator) { connectiontype = navigator.connection.effectivetype; if ('down
linkmax' in navigator.connection) { down
linkmax = navigator.connection.down
linkmax; } } console.log('current connection type: ' + connectiontype + ' (down
link max: ' + down
linkmax + ')'); } logconnectiontype(); navigator.connection.addeventlistener('change', logconnectiontype); specifications specification status comment network information apithe definition of 'down
linkmax' in that specification.
droppedLinkHandler - Archive of obsolete content
« xul reference home dropped
linkhandler type: function this function is called when
links are dropped to the browser element, with the following arguments.
... dropped
linkhandler(event, uri, name) -- firefox 51 or older dropped
linkhandler(event,
links) -- firefox 52 or newer event -- drop event, or null if no event is available uri -- uri string of the dropped
link name -- name string of the dropped
link links -- array of the dropped items with nsidropped
linkitem interface ...
text-link - Archive of obsolete content
« xul reference home text-
link labels with this class may be focused and the click handler run or the address in the href attribute opened on a mouse click or enter key press.
... labels will appear like a
link (blue and underlined).
Opening a Link in the Default Browser - Archive of obsolete content
extps.loaduri(uritoopen, null); by default, the external protocol service will warn the user about opening the
link in another application.
...this is how you do it: var extps = components.classes["@mozilla.org/uriloader/external-protocol-service;1"] .getservice(components.interfaces.nsiexternalprotocolservice); if (extps.externalprotocolhandlerexists("http")) { // handler for http:// urls exists }
link within an iframe to enable a
link inside an html document that is the "src" of an iframe to be opened in the default browser, setting the preference: pref("network.protocol-handler.expose-all", false); seems to work.
Blink - MDN Web Docs Glossary: Definitions of Web-related terms
b
link is an open-source browser layout engine developed by google as part of chromium (and therefore part of chrome as well).
... specifically, b
link began 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.
Hotlink - MDN Web Docs Glossary: Definitions of Web-related terms
a hot
link (also known as an inline
link) is an object (typically an image) directly
linked to from another site.
... the practice is often frowned upon as it can cause unwanted bandwidth usage on the website hosting the
linked-to object, and copyright concerns — it is considered stealing when it is done without permission.
PR_APPEND_LINK
syntax #include <prclist.h> pr_append_
link ( prclist *elemp, prclist *listp); parameters elemp a pointer to the element to be inserted.
... description pr_append_
link adds the specified element to the end of the specified list.
PR_INSERT_LINK
syntax #include <prclist.h> pr_insert_
link ( prclist *elemp, prclist *listp); parameters elemp a pointer to the element to be inserted.
... description pr_insert_
link inserts the specified element at the head of the specified list.
PR_NEXT_LINK
syntax #include <prclist.h> prclist *pr_next_
link (prclist *elemp); parameter elemp a pointer to the element.
... description pr_next_
link returns a pointer to the element following the specified element.
PR_PREV_LINK
syntax #include <prclist.h> prclist *pr_prev_
link (prclist *elemp); parameter elemp a pointer to the element.
... description pr_prev_
link returns a pointer to the element preceding the specified element.
PR_REMOVE_LINK
syntax #include <prclist.h> pr_remove_
link (prclist *elemp); parameter elemp a pointer to the element.
... description pr_remove_
link removes the specified element from its circular list.
HTMLHyperlinkElementUtils.hash - Web APIs
the htmlhyper
linkelementutils.hash property returns a usvstring containing a '#' followed by the fragment identifier of the url.
... syntax string = object.hash; object.hash = string; examples <a id="myanchor" href="/docs/htmlhyper
linkelementutils.href#examples">examples</a> <script> var anchor = document.getelementbyid("myanchor"); console.log(anchor.hash); // returns '#examples' </script> specifications specification status comment html living standardthe definition of 'htmlhyper
linkelementutils.hash' in that specification.
HTMLHyperlinkElementUtils.host - Web APIs
the htmlhyper
linkelementutils.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.
... syntax string = object.host; object.host = string; examples var anchor = document.createelement("a"); anchor.href = "https://developer.mozilla.org/htmlhyper
linkelementutils.host" anchor.host == "developer.mozilla.org" anchor.href = "https://developer.mozilla.org:443/htmlhyper
linkelementutils.host" anchor.host == "developer.mozilla.org" // the port number is not included because 443 is the scheme's default port anchor.href = "https://developer.mozilla.org:4097/htmlhyper
linkelementutils.host" anchor.host == "developer.mozilla.org:4097" specifications specification status comment html living standardthe definition of 'htmlhyper
linkelementutils.host' in that specification.
HTMLHyperlinkElementUtils.hostname - Web APIs
the htmlhyper
linkelementutils.hostname property is a usvstring containing the domain of the url.
... syntax string = object.hostname; object.hostname = string; examples // let's an <a id="myanchor" href="https://developer.mozilla.org/docs/htmlhyper
linkelementutils.hostname"> element be in the document var anchor = document.getelementbyid("myanchor"); var result = anchor.hostname; // returns:'developer.mozilla.org' specifications specification status comment html living standardthe definition of 'htmlhyper
linkelementutils.hostname' in that specification.
HTMLHyperlinkElementUtils.href - Web APIs
the htmlhyper
linkelementutils.href property is a stringifier that returns a usvstring containing the whole url, and allows the href to be updated.
... syntax string = object.href; object.href = string; examples // lets imagine an <a id="myanchor" href="https://developer.mozilla.org/htmlhyper
linkelementutils/href"> element is in the document var anchor = document.getelementbyid("myanchor"); var result = anchor.href; // returns: 'https://developer.mozilla.org/htmlhyper
linkelementutils/href' specifications specification status comment html living standardthe definition of 'htmlhyper
linkelementutils.href' in that specification.
HTMLHyperlinkElementUtils.origin - Web APIs
the htmlhyper
linkelementutils.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:.
... syntax string = object.origin; examples // on this page, returns the origin var result = window.location.origin; // returns:'https://developer.mozilla.org' specifications specification status comment html living standardthe definition of 'htmlhyper
linkelementutils.origin' in that specification.
HTMLHyperlinkElementUtils.password - Web APIs
the htmlhyper
linkelementutils.password property is a usvstring containing the password specified before the domain name.
... syntax string = object.password; object.password = string; examples // let's <a id="myanchor" href="https://anonymous:flabada@developer.mozilla.org/docs/htmlhyper
linkelementutils.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 'htmlhyper
linkelementutils.password' in that specification.
HTMLHyperlinkElementUtils.pathname - Web APIs
the htmlhyper
linkelementutils.pathname property is a usvstring containing an initial '/' followed by the path of the url (or the empty string if there is no path).
... syntax string = object.pathname; object.pathname = string; examples // let's an <a id="myanchor" href="https://developer.mozilla.org/docs/htmlhyper
linkelementutils.pathname"> element be in the document var anchor = document.getelementbyid("myanchor"); var result = anchor.pathname; // returns:'/docs/htmlhyper
linkelementutils.pathname' specifications specification status comment html living standardthe definition of 'htmlhyper
linkelementutils.pathname' in that specification.
HTMLHyperlinkElementUtils.port - Web APIs
the htmlhyper
linkelementutils.port property is a usvstring containing the port number of the url.
... syntax string = object.port; object.port = string; examples // let's an <a id="myanchor" href="https://developer.mozilla.org:443/docs/htmlhyper
linkelementutils.port"> element be in the document var anchor = document.getelementbyid("myanchor"); var result = anchor.port; // returns:'443' specifications specification status comment html living standardthe definition of 'htmlhyper
linkelementutils.port' in that specification.
HTMLHyperlinkElementUtils.protocol - Web APIs
the htmlhyper
linkelementutils.protocol property is a usvstring representing the protocol scheme of the url, including the final ':'.
... syntax string = object.protocol; object.protocol = string; examples // let's an <a id="myanchor" href="https://developer.mozilla.org/htmlhyper
linkelementutils.protocol"> element be in the document var anchor = document.getelementbyid("myanchor"); var result = anchor.protocol; // returns:'https:' specifications specification status comment html living standardthe definition of 'htmlhyper
linkelementutils.protocol' in that specification.
HTMLHyperlinkElementUtils.search - Web APIs
the htmlhyper
linkelementutils.search property is a search string, also called a query string, that is usvstring containing a '?' followed by the parameters of the url.
... syntax string = object.search; object.search = string; examples // let an <a id="myanchor" href="https://developer.mozilla.org/docs/htmlhyper
linkelementutils.search?q=123"> element be in the document var anchor = document.getelementbyid("myanchor"); var querystring = anchor.search; // returns:'?q=123' // further parsing: let params = new urlsearchparams(querystring); let q = parseint(params.get("q")); // is the number 123 specifications specification status comment html living standardthe definition of 'htmlhyper
linkelementutils.search' in that specification.
HTMLHyperlinkElementUtils.username - Web APIs
the htmlhyper
linkelementutils.username property is a usvstring containing the username specified before the domain name.
... syntax string = object.username; object.username = string; examples // let's <a id="myanchor" href="https://anonymous:flabada@developer.mozilla.org/docs/htmlhyper
linkelementutils.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 'htmlhyper
linkelementutils.username' in that specification.
HTMLLinkElement.as - Web APIs
the as property of the html
linkelement 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".
... syntax var as = html
linkelement.as html
linkelement.as = as value a domstring.
HTMLLinkElement.referrerPolicy - Web APIs
the html
linkelement.referrerpolicy property reflect the html referrerpolicy attribute of the <
link> element defining which referrer is sent when fetching the resource.
... syntax domstring html
linkelement.referrerpolicy example var
links = document.getelementsbytagname("
link");
links[0].referrerpolicy; // "no-referrer" specifications specification status comment referrer policythe definition of 'referrerpolicy attribute' in that specification.
xlink:arcrole - SVG: Scalable Vector Graphics
the x
link:arcrole attribute specifies a contextual role for the element and corresponds to the rdf primer notion of a property.
... specifications specification status comment scalable vector graphics (svg) 1.1 (second edition)the definition of 'x
link:arcrole' in that specification.
Index - Web APIs
122 audiocontext api, audio, audiocontext, interface, reference, web audio api, sound the audiocontext interface represents an audio-processing graph built from audio modules
linked together, each represented by an audionode.
... 123 audiocontext() audio, audio context, audio graph, audiocontext, constructor, context, media, media graph, reference, web audio, web audio api the audiocontext() constructor creates a new audiocontext object which represents an audio-processing graph, built from audio modules
linked together, each represented by an audionode.
... 140 audiodestinationnode api, audiodestinationnode, interface, reference, web audio api audiodestinationnode has no output (as it is the output, no more audionode can be
linked after it in the audio graph) and one input.
...And 84 more matches
HTML attribute: rel - HTML: Hypertext Markup Language
the rel attribute defines the relationship between a
linked resource and the current document.
... valid on <
link>, <a>, <area>, and <form>, the supported values depend on the element on which the attribute is found.
... values for the rel attribute, and the elements for which each is relevant rel value description <
link> <a> and <area> <form> alternate alternate representations of the current document.
...And 57 more matches
Index
since binary components are
linked against a single gecko sdk, a dependency to a particular version of gecko is created.
...you can find additional information using the resource
links below.
... 96 xpcom glue guide, xpcom, xpcom glue the xpcom glue is a static library which component developers and embedders can
link against.
...And 33 more matches
<a>: The Anchor element - HTML: Hypertext Markup Language
the html <a> element (or anchor element), with its href attribute, creates a hyper
link to web pages, files, email addresses, locations in the same page, or anything else a url can address.
... content within each <a> should indicate the
link's destination.
... downloadhtml5 prompts the user to save the
linked url instead of navigating to it.
...And 32 more matches
Index - Learn web development
7 html: a good basis for accessibility at, accessibility, article, beginner, buttons, codingscripting, forms, html, learn,
links, a11y, assistive technology, keyboard, screenreader, semantics you should now be well-versed in writing accessible html for most occasions.
... beginner, browser, css, codingscripting, dev tools, html, javascript, learn the devtools live inside your browser in a subwindow that looks roughly like this, depending on what browser you are using: 26 what are hyper
links?
... beginner, infrastructure, navigation, needsactivelearning hyper
links, usually called
links, are a foundational concept behind the web.
...And 27 more matches
XPCOM glue
the xpcom glue is a static library which component developers and embedders can
link against.
... it allows developers to
link only against the frozen xpcom method symbols and maintain compatibility with multiple versions of xpcom.
... compiling or
linking against xpcom headers there are three ways to compile/
link against xpcom headers/libraries: frozen
linkage: dependent glue (dependent on xpcom.dll) xpcom modules, i.e.
...And 26 more matches
HTMLAnchorElement - Web APIs
the htmlanchorelement interface represents hyper
link 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.
... this interface corresponds to <a> element; not to be confused with <
link>, which is represented by html
linkelement) <div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill...
...="none"/><line x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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-b...
...And 26 more matches
Window.open() - Web APIs
*/ }; } </script> (...) <p><a href="http://www.spreadfirefox.com/" target="promotefirefoxwindowname" onclick="openffpromotionpopup(); return false;" title="this
link will create a new window or will re-use an already opened one" >promote firefox adoption</a></p> the above code solves a few usability problems related to
links opening secondary window.
... the purpose of the return false in the code is to cancel default action of the
link: if the onclick event handler is executed, then there is no need to execute the default action of the
link.
... more reading on the use of the target attribute: html 4.01 target attribute specifications how do i create a
link that opens a new window?
...And 26 more matches
nsIFile
void appendrelativenativepath(in acstring relativefilepath); void appendrelativepath(in astring relativefilepath); nsifile clone(); boolean contains(in nsifile infile); void copyto(in nsifile newparentdir, in astring newname); void copytofollowing
links(in nsifile newparentdir, in astring newname); void copytofollowing
linksnative(in nsifile newparentdir, in acstring newname); native code only!
... getrelativedescriptor(in nsifile fromfile); void initwithfile(in nsifile afile); void initwithnativepath(in acstring filepath); void initwithpath(in astring filepath); boolean isdirectory(); boolean isexecutable(); boolean isfile(); boolean ishidden(); boolean isreadable(); boolean isspecial(); boolean issym
link(); boolean iswritable(); void launch(); prlibrarystar load(); void moveto(in nsifile newparentdir, in astring newname); void movetonative(in nsifile newparentdir, in acstring newname); native code only!
... filesizeof
link print64 this attribute exposes the size of the symbolic
link referenced by this nsifile.
...And 25 more matches
New Skin Notes - Archive of obsolete content
--dria is it just me or visited
links are not marked as such?
...in all other dev centres there is no "visited
link color" and we should remove imho.
... it looks odd when someone who uses devmo on regular basis sees some violet
links just because he already worked with this site yesterday.also, the current color for visited
links makes them less visible.
...And 24 more matches
HTMLAreaElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlareaelement" target="_top"><re...
...And 24 more matches
HTML documentation index - HTML: Hypertext Markup Language
its purpose is to identify the element when
linking (using a fragment identifier), scripting, or styling (with css).
...property values are either a string or a url and can be associated with a very wide range of elements including <audio>, <embed>, <iframe>, <img>, <
link>, <object>, <source> , <track>, and <video>.
... 35 x-ms-format-detection attribute, html, html:microsoft extensions, non-standard, reference, x-ms-format-detection the x-ms-format-detection attribute determines whether data formats within the element’s text, like phone numbers, are automatically converted to followable
links.
...And 24 more matches
Index - Archive of obsolete content
247 installing extensions and themes from web pages add-ons, extensions, obsolete, themes there are a variety of ways you can install extensions and themes from web pages, including direct
linking to the xpi files and using the installtrigger object.
... 250 legacy add-ons add-ons, extensions, landing this section contains
links to documentation for legacy technology for add-on development, including: 251 listening to events in firefox extensions add-ons, archive, dom, extensions, gecko, obsolete, events gecko uses events to pass information about interesting things that have occurred along to the parties that may wish to know about them.
... 252 migrating from internal
linkage to frozen
linkage xpcom extension code using internal
linkage will need to migrate to use frozen
linkage because internal
linkage will not be available in firefox 3.
...And 23 more matches
HTML: A good basis for accessibility - Learn web development
good for seo — search engines give more importance to keywords inside headings,
links, etc.
... ui controls by ui controls, we mean the main parts of web documents that users interact with — most commonly buttons,
links, and form controls.
... you can then press enter/return to follow a focused
link or press a button (we've included some javascript to make the buttons alert a message), or start typing to enter text in a text input.
...And 23 more matches
HTML: A good basis for accessibility - Learn web development
good for seo — search engines give more importance to keywords inside headings,
links, etc.
... ui controls by ui controls, we mean the main parts of web documents that users interact with — most commonly buttons,
links, and form controls.
... you can then press enter/return to follow a focused
link or press a button (we've included some javascript to make the buttons alert a message), or start typing to enter text in a text input.
...And 23 more matches
Index - MDN Web Docs Glossary: Definitions of Web-related terms
31 b
link glossary, infrastructure, layout, rendering engine b
link is an open-source browser layout engine developed by google as part of chromium (and therefore part of chrome as well).
... specifically, b
link began 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.
...for example, <p> is by default a block-level element, whereas <a> is an inline element — you can put several
links next to one another in your html source and they will sit on the same line as one another in the rendered output.
...And 20 more matches
Drag Operations - Web APIs
these include text selections, images, and
links.
... when an image or
link is dragged, the url of the image or
link is set as the drag data, and a drag begins.
... in html, apart from the default behavior for images,
links, and selections, no other elements are draggable by default.
...And 19 more matches
Getting started with HTML - Learn web development
the enclosing tags can make content into a hyper
link to connect to another page, italicize words, and so on.
...for example, as an <a> element (hyper
link) or emphasis elements such as <em> or <strong>.
...an anchor can make the text it encloses into a hyper
link.
...And 18 more matches
Preloading content with rel="preload" - HTML: Hypertext Markup Language
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.
... this article provides a basic guide to how <
link rel="preload"> works.
... the basics you most commonly use <
link> to load a css file to style your page with: <
link rel="stylesheet" href="styles/main.css"> here however, we will use a rel value of preload, which turns <
link> into a preloader for any resource we want.
...And 16 more matches
Handling common accessibility problems - Learn web development
the elements that have this capability are the common ones that allow user to interact with web pages, namely
links, <button>s, and form elements like <input>.
... you can then press enter/return to follow a focused
link or press a button (we've included some javascript to make the buttons alert a message), or start typing to enter text in a text input (other form elements have different controls, for example the <select> element can have its options displayed and cycled between using the up and down arrow keys).
... safari doesn't allow you to tab through
links by default; to enable this, you need to open safari's preferences, go to advanced, and check the press tab to highlight each item on a webpage checkbox.
...And 15 more matches
Cognitive accessibility - Accessibility
es: 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.
... moving, b
linking, scrolling it is important not to distract users, especially ones with cognitive disabilities.
... if moving, b
linking, scrolling, or auto-updating information starts automatically, lasts more than five seconds, and is presented in parallel with other content, the user must able to pause, stop, hide or control it, unless it's an essential functionality.
...And 15 more matches
NSS functions
section headings are
links to the individual pages where you can edit them.
... the nss home page
links to additional ssl documentation.
... if documentation is available for a function listed below, the function name is
linked to either its mdc wiki page or its entry in the old ssl reference.
...And 14 more matches
Architecture - Accessibility
in addition, nsiaccessiblehyper
link is implemented on any non-text child inside a container that also has text.
... this allows at's to find its position within that text, because the hyper
link interface exposes a start and end index.
...if you want to know that something is really a
link, check to see if it is role_
link.
...And 14 more matches
Operable - Accessibility
2.2.2 pausing, stopping, hiding (a) for moving/b
linking content that starts automatically, lasts longer than 5 seconds, and is shown alongside other content, controls should be provided to pause, stop, or hide it.
... this does not apply to moving/b
linking content that is essential to the experience.
...this is often achieved using "skip
links" —
links put at the top of the page source that
link to the main content and are hidden by css.
...And 14 more matches
Mozilla’s UAAG evaluation report
(p1) p animated images can be made still with the escape key animated images can be made still as a preference under preferences, privacy & security, images - "animated images should loop" mozilla has no preference or command to toggle audio or video 3.3 toggle animated/b
linking text.
... (p1) p the following line can be added to a user's prefs.js file to control b
linking: user_pref("browser.b
link_allowed", false); bug 89144 has been filed to expose this pref in the ui.
... this is also under preferences, security, ssl, "sending form data from unencrypted page to unencrypted page" 5.6 confirm fee
links.
...And 13 more matches
nsIHTMLEditor
ut boolean acanindent, out boolean acanoutdent); void getinlineproperty(in nsiatom aproperty, in astring aattribute, in astring avalue, out boolean afirst, out boolean aany, out boolean aall); astring getinlinepropertywithattrvalue(in nsiatom aproperty, in astring aattribute, in astring avalue, out boolean afirst, out boolean aany, out boolean aall); nsisupportsarray get
linkedobjects(); 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 ign...
...in boolean adeleteselection); void insertfromdrop(in nsidomevent aevent); void inserthtml(in astring ainputstring); void inserthtmlwithcontext(in astring ainputstring, in astring acontextstr, in astring ainfostr, in astring aflavor, in nsidomdocument asourcedoc, in nsidomnode adestinationnode, in long adestinationoffset, in boolean adeleteselection); void insert
linkaroundselection(in nsidomelement aanchorelement); boolean isanonymouselement(in nsidomelement aelement); void makeorchangelist(in astring alisttype, in boolean entirelist, in astring abullettype); boolean nodeisblock(in nsidomnode node); void pastenoformatting(in long aselectiontype); void rebuilddocumentfromsource(in astring asourcestring); vo...
... used primarily to supply new element for various insert element dialogs (image,
link, table, and horizontalrule are the only returned elements as of 9/12/18); namedanchor was removed in firefox 63.
...And 13 more matches
jspage - Archive of obsolete content
hift","slice","sort","splice","tostring","unshift","valueof"],string:["charat","charcodeat","concat","indexof","lastindexof","match","replace","search","slice","split","substr","substring","tolowercase","touppercase","valueof"]}; for(var e in f){for(var b=f[e].length;b--;){native.genericize(a[e],f[e][b],true);}}})();var hash=new native({name:"hash",initialize:function(a){if($type(a)=="hash"){a=$un
link(a.getclean()); }for(var b in a){this[b]=a[b];}return this;}});hash.implement({foreach:function(b,c){for(var a in this){if(this.hasownproperty(a)){b.call(c,this[a],a,this); }}},getclean:function(){var b={};for(var a in this){if(this.hasownproperty(a)){b[a]=this[a];}}return b;},getlength:function(){var b=0;for(var a in this){if(this.hasownproperty(a)){b++; }}return b;}});hash.alias("foreach","each"...
...h(a){return new hash(a);}function $lambda(a){return($type(a)=="function")?a:function(){return a;};}function $merge(){var a=array.slice(arguments); a.unshift({});return $mixin.apply(null,a);}function $mixin(e){for(var d=1,a=arguments.length;d<a;d++){var b=arguments[d];if($type(b)!="object"){continue; }for(var c in b){var g=b[c],f=e[c];e[c]=(f&&$type(g)=="object"&&$type(f)=="object")?$mixin(f,g):$un
link(g);}}return e;}function $pick(){for(var b=0,a=arguments.length; b<a;b++){if(arguments[b]!=undefined){return arguments[b];}}return null;}function $random(b,a){return math.floor(math.random()*(a-b+1)+b);}function $splat(b){var a=$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{...
...urn 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 $un
link(c){var b;switch($type(c)){case"object":b={};for(var e in c){b[e]=$un
link(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]=$un
link(c[d]);}break;default:return c;}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...
...And 12 more matches
Issues Arising From Arbitrary-Element hover - Archive of obsolete content
summary: thanks to long-standing limitations, we're used to thinking of hover styles as applying only to hyper
links, which has led to some sloppy authoring practices that are now causing problems for some web sites.
...many authors make use of the css2 pseudo-class :hover to style their
links.
... this innovation, first introduced by microsoft® internet explorer and later adopted into the css specification, is very popular for the styling 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.
...And 12 more matches
Localization content best practices
dtd files <!-- localization note (entity name): {{privacy}} will be replaced at run-time by an active
link.
... the string 'privacy-
link' will be used as text for this
link.
... --> properties files # localization note(privacy-text): {{privacy}} will be replaced at run-time by an # active
link.
...And 12 more matches
IAccessibleHypertext
1.0 66 introduced gecko 1.9 inherits from: iaccessibletext last changed in gecko 1.9 (firefox 3) the iaccessiblehypertext interface is the main interface to expose hyper
links in a document, typically a text document, that are used to reference other documents.
...method overview [propget] hresult hyper
link([in] long index, [out] iaccessiblehyper
link hyper
link ); [propget] hresult hyper
linkindex([in] long charindex, [out] long hyper
linkindex ); [propget] hresult nhyper
links([out] long hyper
linkcount ); methods hyper
link() returns the specified
link.
... the returned iaccessiblehyper
link object encapsulates the hyper
link and provides several kinds of information describing it.
...And 11 more matches
Implementing a Microsoft Active Accessibility (MSAA) Server - Accessibility
for example, screen readers look for screen draws of a vertical b
linking line, to determine the location of the caret.
...try to use unique names for each item in a dialog so that voice dictation software doesn't have to deal with extra ambiguity.[important] get_accvalue: get the "value" of the iaccessible, for example a number in a slider, a url for a
link, the text a user entered in a field.
... is it a
link, static text, editable text, a checkbox, or a table cell, etc.
...And 11 more matches
HTTP Index - HTTP
93 csp: referrer csp, content-security-policy, directive, http, obsolete, reference, security, referrer the http content-security-policy (csp) referrer directive used to specify information in the referer header (with a single r as this was a typo in the original spec) for
links away from a page.
... 103 csp: style-src-elem csp, content, content-security-policy, directive, http, reference, security, style, source, style-src, 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".
... 165
link draft, http, http header,
link, needscompattable, needscontent, needssyntax, reference the http
link entity-header field provides a means for serialising one or more
links in http headers.
...And 11 more matches
CSS and JavaScript accessibility best practices - Learn web development
links hyper
links — the way you get to new places on the web: <p>visit the <a href="https://www.mozilla.org">mozilla homepage</a>.</p> some very simple
link styling is shown below: a { color: #ff0000; } a:hover, a:visited, a:focus { color: #a60000; text-decoration: none; } a:active { color: #000000; background-color: #a60000; } the standard
link conventions are underlined and a diffe...
...rent color (default: blue) in their standard state, another color variation when the
link has previously been visited (default: purple), and yet another color when the
link is activated (default: red).
... in addition, the mouse pointer changes to a pointer icon when
links are moused over, and the
link receives a highlight when focused (e.g.
...And 10 more matches
Getting started with CSS - Learn web development
prerequisites: basic computer literacy, basic software installed, basic knowledge of working with files, and html basics (study introduction to html.) objective: to understand the basics of
linking a css document to an html file, and be able to do simple text formatting with css.
...in the text is a <span>span element</span> and also a <a href="http://example.com">
link</a>.</p> <p>this is the second paragraph.
...there are three different ways to apply css to an html document that you'll commonly come across, however, for now, we will look at the most usual and useful way of doing so —
linking css from the head of your document.
...And 10 more matches
Index
the crmf library, which is used to produce certain kinds of certificate requests, is available as a library for static
linking only.
... references visible
links 1.
... references visible
links 1.
...And 10 more matches
Rich-Text Editing in Mozilla - Developer guides
most commands affect the document's selection (bold, italics, etc), while others insert new elements (adding a
link) or affect an entire line (indenting).
... figure 2 : first example html: <body contenteditable="true" onload="load()"> javascript: function load(){ window.document.designmode = "on"; } example 2 the second example is a simple rich text editing page, where text can be bolded/italicized/underlined, new
links can be added and the color of text changed.
...ode()) { return; } var oprntwin = window.open("","_blank","width=450,height=470,left=400,top=100,menubar=yes,toolbar=no,location=no,scrollbars=yes"); oprntwin.document.open(); oprntwin.document.write("<!doctype html><html><head><title>print<\/title><\/head><body onload=\"print();\">" + odoc.innerhtml + "<\/body><\/html>"); oprntwin.document.close(); } </script> <style type="text/css"> .int
link { cursor: pointer; } img.int
link { border: 0; } #toolbar1 select { font-size:10px; } #textbox { width: 540px; height: 200px; border: 1px #000000 solid; padding: 12px; overflow: scroll; } #textbox #sourcetext { padding: 0; margin: 0; min-width: 498px; min-height: 200px; } #editmode label { cursor: pointer; } </style> </head> <body onload="initdoc();"> <form name="compform" method...
...And 10 more matches
HTML attribute reference - HTML: Hypertext Markup Language
crossorigin <audio>, <img>, <
link>, <script>, <video> how the element handles cross-origin requests csp <iframe> specifies the content security policy that an embedded document must agree to enforce upon itself.
... download <a>, <area> indicates that the hyper
link is to be used for downloading a resource.
... href <a>, <area>, <base>, <
link> the url of a
linked resource.
...And 10 more matches
<a> - SVG: Scalable Vector Graphics
the <a> svg element creates a hyper
link to other web pages, files, locations in the same page, email addresses, or any other url.
... svg's <a> element is a container, which means you can create a
link around text (like in html) but also around any shape.
... @namespace svg url(http://www.w3.org/2000/svg); html,body,svg { height:100% } <svg viewbox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"> <!-- a
link around a shape --> <a href="/docs/web/svg/element/circle"> <circle cx="50" cy="40" r="35"/> </a> <!-- a
link around a text --> <a href="/docs/web/svg/element/text"> <text x="50" y="90" text-anchor="middle"> <circle> </text> </a> </svg> /* as svg does not provide a default visual style for
links, it's considered best practice to add some */ @namespace svg url(http://www.w3.org/2000/svg); /* necessary to select only svg <a> elements, and not also html’s.
...And 10 more matches
Namespaces crash course - SVG: Scalable Vector Graphics
uris are commonly used because they are unique, the intention is not to "
link" somewhere.
...a very good example of this is the href parameter defined by the x
link specification.
... this parameter is commonly used by other xml dialects as a means to
link to external resources.
...And 10 more matches
Manipulating documents - Learn web development
try opening this up in your browser — it is a very simple page containing a <section> element inside which you can find an image, and a paragraph with a
link inside.
... the html source code looks like this: <!doctype html> <html> <head> <meta charset="utf-8"> <title>simple dom example</title> </head> <body> <section> <img src="dinosaur.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> the dom on the other hand looks like this: note: this dom tree diagram was created using ian hickson's live dom viewer.
...inside your script element, add the following line: const
link = document.queryselector('a'); now we have the element reference stored in a variable, we can start to manipulate it using properties and methods available to it (these are defined on interfaces like htmlanchorelement in the case of <a> element, its more general parent interface htmlelement, and node — which represents all nodes in a dom).
...And 9 more matches
nsIAccessibleHyperText
accessible/public/nsiaccessiblehypertext.idlscriptable this interface is the main interface to expose hyper
links in a document, typically a text document, that are used to reference other documents.
... inherits from: nsisupports last changed in gecko 1.9 (firefox 3) method overview nsiaccessiblehyper
link get
link(in long
linkindex); long get
linkindex(in long charindex); long getselected
linkindex(); obsolete since gecko 1.9 attributes attribute type description
linkcount long the number of
links contained within this hypertext object.
...note: renamed from
links in gecko 1.9 methods get
link() retrieves the nsiaccessiblehyper
link object at the given
link index.
...And 9 more matches
WebGL best practices - Web APIs
compile shaders and
link programs in parallel it's tempting to compile shaders and
link programs serially, but many browsers can compile and
link in parallel on background threads.
... instead of: function compileonce(gl, shader) { if (shader.compiled) return; gl.compileshader(shader); shader.compiled = true; } for (const [vs, fs, prog] of programs) { compileonce(gl, vs); compileonce(gl, fs); gl.
linkprogram(prog); if (!gl.getprogramparameter(prog, gl.
link_status)) { console.error('
link failed: ' + gl.getprograminfolog(prog)); console.error('vs info-log: ' + gl.getshaderinfolog(vs)); console.error('fs info-log: ' + gl.getshaderinfolog(fs)); } } consider: function compileonce(gl, shader) { if (shader.compiled) return; gl.compileshader(shader); shader.compiled = true; } for (const [vs, fs, prog] of programs) { compileonce(gl, vs); compileonce(gl, fs); } for (const [vs, fs, prog] of programs) { gl.
linkprogram(prog); } for (const [vs,...
... fs, prog] of programs) { if (!gl.getprogramparameter(prog, gl.
link_status)) { console.error('
link failed: ' + gl.getprograminfolog(prog)); console.error('vs info-log: ' + gl.getshaderinfolog(vs)); console.error('fs info-log: ' + gl.getshaderinfolog(fs)); } } khr_parallel_shader_compile for non-blocking compile/
link status while we've described a pattern to allow browsers to compile and
link in parallel, normally checking compile_status or
link_status blocks until the compile or
link completes.
...And 9 more matches
filter - CSS: Cascading Style Sheets
rc="/files/3710/test_form_2.jpg" style="width: 100%;" /></td> <td> <div class="svg-container"> <svg id="img3" overflow="visible" viewbox="0 0 212 161" color-interpolation-filters="srgb"> <filter id="svgblur" x="-5%" y="-5%" width="110%" height="110%"> <fegaussianblur in="sourcegraphic" stddeviation="3.5"/> </filter> <image x
link:href="/files/3710/test_form_2.jpeg" filter="url(#svgblur)" width="212px" height="161px"/> </svg> </div> </td> <td><img alt="test_form_s.jpg" id="img4" class="internal default" src="/files/3711/test_form_2_s.jpg" style="width: 100%;" /></td> </tr> </tbody> </table> html { height:100%; } body { font: 14px/1.286 "lucida grande", "lucida sans unicode", "dejavu...
...e="width: 100%;" /></td> <td><div class="svg-container"><svg xmlns="http://www.w3.org/2000/svg" id="img3" viewbox="0 0 286 217" color-interpolation-filters="srgb"> <filter id="brightness"> <fecomponenttransfer> <fefuncr type="linear" slope="2"/> <fefuncg type="linear" slope="2"/> <fefuncb type="linear" slope="2"/> </fecomponenttransfer> </filter> <image x
link:href="/files/3708/test_form.jpg" filter="url(#brightness)" width="286px" height="217px" /> </svg><div></td> <td><img alt="test_form_s.jpg" id="img4" class="internal default" src="/files/3709/test_form_s.jpg" style="width: 100%;" /></td> </tr> </tbody> </table> html { height:100%; } body { font: 14px/1.286 "lucida grande","lucida sans unicode","dejavu sans",lucida,arial,helvetica...
...ss="svg-container"><svg xmlns="http://www.w3.org/2000/svg" id="img3" viewbox="0 0 240 151" color-interpolation-filters="srgb"> <filter id="contrast"> <fecomponenttransfer> <fefuncr type="linear" slope="2" intercept="-0.5"/> <fefuncg type="linear" slope="2" intercept="-0.5"/> <fefuncb type="linear" slope="2" intercept="-0.5"/> </fecomponenttransfer> </filter> <image x
link:href="/files/3712/test_form_3.jpeg" filter="url(#contrast)" width="240px" height="151px" /> </svg><div></td> <td><img alt="test_form_s.jpg" id="img4" class="internal default" src="/files/3713/test_form_3_s.jpg" style="width: 100%;" /></td> </tr> </tbody> </table> html { height:100%; } body { font: 14px/1.286 "lucida grande","lucida sans unicode","dejavu sans",lucida,arial,helvet...
...And 9 more matches
Making content editable - Developer guides
most commands affect the document's selection by, for example, applying a style to the text (bold, italics, etc), while others insert new elements (like adding a
link) or affect an entire line (indenting).
...ode()) { return; } var oprntwin = window.open("","_blank","width=450,height=470,left=400,top=100,menubar=yes,toolbar=no,location=no,scrollbars=yes"); oprntwin.document.open(); oprntwin.document.write("<!doctype html><html><head><title>print<\/title><\/head><body onload=\"print();\">" + odoc.innerhtml + "<\/body><\/html>"); oprntwin.document.close(); } </script> <style type="text/css"> .int
link { cursor: pointer; } img.int
link { border: 0; } #toolbar1 select { font-size:10px; } #textbox { width: 540px; height: 200px; border: 1px #000000 solid; padding: 12px; overflow: scroll; } #textbox #sourcetext { padding: 0; margin: 0; min-width: 498px; min-height: 200px; } #editmode label { cursor: pointer; } </style> </head> <body onload="initdoc();"> <form name="compform" method...
...on> <option value="green">green</option> <option value="black">black</option> </select> <select onchange="formatdoc('backcolor',this[this.selectedindex].value);this.selectedindex=0;"> <option class="heading" selected>- background -</option> <option value="red">red</option> <option value="green">green</option> <option value="black">black</option> </select> </div> <div id="toolbar2"> <img class="int
link" title="clean" onclick="if(validatemode()&&confirm('are you sure?')){odoc.innerhtml=sdeftxt};" src="data:image/gif;base64,r0lgodlhfgawaiqbad04ktrlyzfrjlldzl9vj1dusy14wyodhpwibbsvfy6o7ioxw5qbms+wubcztca0ccs4kddqjdtltmrl1o3yitha7opcsd/f4pfvrvdv8pv5xv///////////////////yh5baekab8alaaaaaawabyaaav84ceozgmeakqubmteyzk547qobcfwtm/jgshq4rhmloxfiehqqsawr+z4iayaj0kegtfolizlwre4ocqwrxototaihmcz0tvgmbqkzhayy...
...And 9 more matches
SVG documentation index - SVG: Scalable Vector Graphics
5
linking guide, svg the target attribute on the svg <a> element doesn't work in mozilla firefox 1.5.
... 104 href svg, svg attribute the href attribute defines a
link to a resource as a reference url.
... the exact meaning of that
link depends on the context of each element using it.
...And 9 more matches
Document and website structure - Learn web development
how hyper
links work, as covered in creating hyper
links.
... navigation bar:
links to the site's main sections; usually represented by menu buttons,
links, or tabs.
... sidebar: some peripheral info,
links, quotes, ads, etc.
...And 8 more matches
What’s in the head? Metadata in HTML - Learn web development
it contains information such as the page <title>,
links to css (if you choose to style your html content with css),
links to custom favicons, and other metadata (data about the html, such as the author, and important keywords that describe the document.) in this article we'll cover all of the above and more, in order to give you a good basis for working with markup.
... note: in google, you will see some relevant subpages of mdn web docs listed below the main homepage
link — these are called site
links, and are configurable in google's webmaster tools — a way to make your site's search results better in the google search engine.
...it also documents mozilla products, like firefox os."> <meta property="og:title" content="mozilla developer network"> one effect of this is that when you
link to mdn web docs on facebook, the
link appears along with an image and description: a richer experience for users.
...And 8 more matches
A bird's-eye view of the Mozilla framework
it examines what happens when the user performs a simple user interface (ui) action such as clicking a
link in the contents panel of the help viewer window shown below.
...suppose the client already has an nsirdfdatasource object representing a sub-graph of an rdf graph and calls nsirdfdatasource.gettarget(resource, nc_
link, true) to obtain an nsirdfnode representing a specific node in the graph, in this case a
link to ahelp viewer document page.
...the
link is a literal, so the client wants nsirdfliteral.
...And 8 more matches
Setting up the Gecko SDK
application name description of functionality regxpcom.exe registers or unregisters components with xpcom xpidl.exe generates typelib and c++ headers from xpidl xpt_dump.exe prints out information about a given typelib xpt_
link.exe combines multiple typelibs into a single typelib library name description of functionality xpcomglue.lib xpcom glue library to be used by xpcom components.
...then, from the new dialog, select "win32 dynamic-
link library".
...in the win32 dynamic-
link library dialog that displays (see below), you can choose the default selection "an empty dll project" as the type of dll.
...And 8 more matches
Starting WebLock
link to it hereexample 1.
...once the interface has been described in the xpidl language, the interface file can be used to generate the header files needed for the implementation code, the binary type library files that let you use the interface of the weblock component from javascript, and even broken
linkjavadoc style html documentation.
...as a layer of abstraction above the operating system, the nspr allows gecko applications to be platform independent by providing the following system-level facilities: threads thread synchronization file and network i/o timing and intervals memory management shared library
linking the nspr is included in the gecko sdk.
...And 8 more matches
Interfacing with the XPCOM cycle collector
this is the un
linking stage of the collectors operation.
... in this stage the collector walks through the garbage objects it has found, again consulting with their helper objects, asking the helper objects to "un
link" each object from its immediate children.
... the traverse and un
link methods on the helper object are not magic; they are programmer-supplied and must be correct, or else the collector will fail.
...And 8 more matches
:where() - CSS: Cascading Style Sheets
take the following html: <article> <h2>:is()-styled
links</h2> <section class="is-styling"> <p>here is my main content.
... this <a href="https://mozilla.org">contains a
link</a>.
...this <a href="https://developer.mozilla.org">also contains a
link</a>.
...And 8 more matches
<area> - HTML: Hypertext Markup Language
the html <area> element defines a hot-spot region on an image, and optionally associates it with a hypertext
link.
... implicit aria role
link when href attribute is present, otherwise no corresponding role permitted aria roles no role permitted dom interface htmlareaelement attributes this element's attributes include the global attributes.
... download this attribute, if present, indicates that the author intends the hyper
link to be used for downloading a resource.
...And 8 more matches
HTML elements reference - HTML: Hypertext Markup Language
metadata for styles and scripts may be defined in the page or
link to another file that has the information.
... <
link> the html external resource
link element (<
link>) specifies relationships between the current document and an external resource.
... this element is most commonly used to
link to stylesheets, but is also used to establish site icons (both "favicon" style icons and icons for the home screen and apps on mobile devices) among other things.
...And 8 more matches
XML in Mozilla - Archive of obsolete content
h css manipulating xml documents with scripts through dom serializing xml dom trees to javascript object trees (jxon) other supported xml w3c recommendations specification or technology documentation xhtml w3c recommendation xml base w3c recommendation x
link (simple x
links 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...
...the public identifiers that are recognized are: -//w3c//dtd xhtml 1.0 transitional//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 x
links.
... you can make any xml element into an x
link by using the x
link namespace http://www.w3.org/1999/x
link.
...And 7 more matches
A guide to searching crash reports
searching the search form you can get to the search page by clicking on the "super search"
link near the toolbar at the top right of any page in crash-stats.
...the
links within the results do the following things.
... the first
link in each "signature" column cell
links to a signature report, which contains additional details about crash reports with that signature.
...And 7 more matches
nsIXULBrowserWindow
method overview astring onbefore
linktraversal(in astring originaltarget, in nsiuri
linkuri, in nsidomnode
linknode, in prbool isapptab); void setjsdefaultstatus(in astring status); void setjsstatus(in astring status); void setover
link(in astring
link, in nsidomelement element); methods onbefore
linktraversal() called before traversing a
link to determine the appropriate target into which to load the
link.
... this may be used, for example, to redirect
links into new tabs or windows when it's not desirable to replace the content in the current tab (such as when the
link is clicked in an app tab).
... astring onbefore
linktraversal( in astring originaltarget, in nsiuri
linkuri, in nsidomnode
linknode, in prbool isapptab ); parameters originaltarget the specified target for the
link.
...And 7 more matches
HTML: Hypertext Markup Language
"hypertext" refers to
links that connect web pages to one another, either within a single website or between websites.
...
links are a fundamental aspect of the web.
... by uploading content to the internet and
linking it to pages created by other people, you become an active participant in the world wide web.
...And 7 more matches
Redirections in HTTP - HTTP
redirects accomplish numerous goals: temporary redirects during site maintenance or downtime permanent redirects to preserve existing
links/bookmarks after changing the site's urls, progress pages when uploading a file, etc.
... reorganization of a web site, with non-get
links/operations.
...machine-readable choices are encouraged to be sent as
link headers with rel=alternate.
...And 7 more matches
Extension Versioning, Update and Compatibility - Archive of obsolete content
for version 2.2 an https update
link is used while version 2.5 has a regular http
link with a hash to verify the file retrieved.
...ation the add-on is compatible with --> <em:targetapplication> <rdf:description> <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id> <em:minversion>1.5</em:minversion> <em:maxversion>2.0.0.*</em:maxversion> <!-- this is where this version of the add-on will be downloaded from --> <em:update
link>https://www.mysite.com/foobar2.2.xpi</em:update
link> <!-- a page describing what is new in this updated version --> <em:updateinfourl>http://www.mysite.com/updateinfo2.2.xhtml</em:updateinfourl> </rdf:description> </em:targetapplication> </rdf:description> </rdf:li> <rdf:li> <rdf:description> ...
... <em:version>2.5</em:version> <em:targetapplication> <rdf:description> <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id> <em:minversion>1.5</em:minversion> <em:maxversion>2.0.0.*</em:maxversion> <em:update
link>http://www.mysite.com/foobar2.5.xpi</em:update
link> <em:updatehash>sha256:78fc1d2887eda35b4ad2e3a0b60120ca271ce6e64ad2e3a0b60120ca271ce6e6</em:updatehash> </rdf:description> </em:targetapplication> </rdf:description> </rdf:li> </rdf:seq> </em:updates> <!-- a signature is only necessary if your add-on includes an updatekey in its install.rdf.
...And 6 more matches
Appendix: What you should know about open-source software licenses - Archive of obsolete content
the gpl does not state whether
linked files and the like are considered “derivative works under copyright law.” the lgpl does make the declaration below.
... in short, under the gpl, statically or dynamically
linked libraries both could be interpreted as derivative works.
... when a program is
linked with a library, whether statically or using a shared library, the combination of the two is legally speaking a combined work, a derivative of the original library.
...And 6 more matches
Frequently Asked Questions - Archive of obsolete content
<svg xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> actually the second binding isn't always required, but unless you understand namespaces, we'd strongly recommend you include it.
... for more information see this
link.
...for more information on server configuration for svg see this
link.
...And 6 more matches
WAI-ARIA basics - Learn web development
the initial solution was to add one or more hidden
links at the top of the page to
link to the navigation (or whatever else), for example: <a href="#hidden" class="hidden">skip to navigation</a> but this is still not very precise, and can only be used when the screenreader is reading from the top of the page.
... note: you can find a useful list of all the aria roles and their uses, with
links to futher information, in the wai-aria spec — see definition of roles.
... the spec also contains a list of all the properties and states, with
links to further information — see definitions of states and properties (all aria-* attributes).
...And 6 more matches
Add a hitmap on top of an image - Learn web development
objective: learn how to make different regions of one image
link to different pages.
... image maps, and their drawbacks when you nest an image inside <a>, the entire image
links to one webpage.
... an image map, on the other hand, contains several active regions (called "hotspots") that each
link to a different resource.
...And 6 more matches
Marking up a letter - Learn web development
in this assignment, you'll have a letter to mark up as a test for your html text formatting skills, as well as hyper
links and proper use of the html <head> element.
...metadata in html, html text fundamentals, creating hyper
links, and advanced text formatting.
... objective: test basic and advanced html text formatting, use of hyper
links, and use of html <head>.
...And 6 more matches
Images in HTML - Learn web development
in addition, never point your src attribute at an image hosted on someone else's website that you don't have permission to
link to.
... this is called "hot
linking".
...
link.
...And 6 more matches
Component Internals
this file also lists all known interfaces and
links to the type library files that define these interface structures.
...xpcom provides many data structures from
linked lists to avl trees.
... it's tempting to reuse nsvoidarray or another publicly available class instead of writing your own
linked list, but this may prove to be a fatal mistake.
...And 6 more matches
nsIFaviconService
optional] out unsigned long adatalen, [array,retval,size_is(adatalen)] out octet adata); obsolete since gecko 22.0 astring getfavicondataasdataurl(in nsiuri afaviconuri); obsolete since gecko 22.0 nsiuri getfaviconforpage(in nsiuri apageuri); obsolete since gecko 22.0 nsiuri getfaviconimageforpage(in nsiuri apageuri); obsolete since gecko 22.0 nsiuri getfavicon
linkforicon(in nsiuri afaviconuri); boolean isfailedfavicon(in nsiuri afaviconuri); void removefailedfavicon(in nsiuri afaviconuri); void setandloadfaviconforpage(in nsiuri apageuri, in nsiuri afaviconuri, in boolean aforcereload, in unsigned long afaviconloadtype, [optional] in nsifavicondatacallback acallback); obsolete since gecko 22.0 void setfavicondata(in nsiu...
...you should use the new async api moziasyncfavicons.getfaviconurlforpage() and getfavicon
linkforicon() instead.
... this method is very similar to that of getfavicon
linkforicon() method.
...And 6 more matches
nsILocalFileMac
obsolete since gecko 2.0 methods native code only!getcfurl note: observes the state of the follow
links attribute.
... if the file object is an alias and follow
links is true, returns the target of the alias.
... if follow
links is false, returns the unresolved alias file.
...And 6 more matches
Mozilla
for example, by using components.results.ns_error_not_initialized firefox here you can learn about how to contribute to the firefox project and you will also find
links to information about the construction of firefox add-ons, using the developer tools in firefox, and other topics.
...the first
link, though, is the "check" target in a makefile.
...here you'll find
links to documentation about these projects.
...And 6 more matches
Examine and edit HTML - Firefox Developer Tools
if a shadow dom contains a "slotted" element (an element with a slot attribute after it has been inserted inside a <slot> element — see adding flexibility with slots for an explanation of how these are used), the "slotted" element will be shown inside its corresponding <slot> element, with a "reveal"
link alongside it.
... clicking the "reveal"
link will highlight the element with the slot attribute as it exists outside the shadow dom this is very useful when you've got a <slot> element and you can't find the source of its content.
...the menu contains the following items — click on the
links to find the description of each command in the context menu reference: edit as html create new node duplicate node delete node attributes add attribute copy attribute value edit attribute remove attribute break on ...
...And 6 more matches
Controlling multiple parameters with ConstantSourceNode - Web APIs
this article demonstrates how to use a constantsourcenode to
link multiple parameters together so they share the same value, which can be changed by simply setting the value of the constantsourcenode.offset parameter.
... you may have times when you want to have multiple audio parameters be
linked so they share the same value even while being changed in some way.
...you simply need to create a constantsourcenode and connect it to all of the audioparams whose values should be
linked to always match each other.
...And 6 more matches
Web Audio API - Web APIs
basic audio operations are performed with audio nodes, which are
linked together to form an audio routing graph.
... audio nodes are
linked into chains and simple webs by their inputs and outputs.
... outputs of these nodes could be
linked to inputs of others, which mix or modify these streams of sound samples into different streams.
...And 6 more matches
Accessibility documentation index - Accessibility
this document provides a list of
links to all accessibility articles on the mozilla developer network.
... 22 using the aria-labelledby attribute aria, accessibility, broken
link 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.
... list multiple element ids in a space delimited fashion.this idea is similar to how the "for" attribute is used to
link a label to an input.assistive technology, such as screen readers, use this attribute to catalog the objects in a document so that users can navigate between them.
...And 6 more matches
Privacy and the :visited selector - CSS: Cascading Style Sheets
to mitigate this problem, browsers have limited the amount of information that can be obtained from visited
links.
... little white lies to preserve users' privacy, firefox and other browsers will lie to web applications under certain 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.
... if you use a sibling selector such as :visited + span, the adjacent element (span in this example) will be styled as if the
link were unvisited.
...And 6 more matches
Using HTML sections and outlines - Developer guides
by contrast, the <nav> sectioning element more clearly describes to browsers and other devices the content contained:
links or other navigational structures to help users move through and understand where they are in a site's or page's content.
... section elements in html5 html navigational element (<nav>) defines a section that contains navigation
links that appear often on a site.
... html footer element (<footer>) defines a page footer, which typically contains copyright or legal notices and sometimes some
links.
...And 6 more matches
cfx - Archive of obsolete content
updateurl and update
link if you choose to host the xpi yourself you should enable the host application to find new versions of your add-on.
...at the updateurl you host a file in the update rdf format: among other things, this includes another url called update
link which points to the updated xpi itself.
... the --update-
link and --update-url options simplify this process.
...And 5 more matches
Installing Extensions and Themes From Web Pages - Archive of obsolete content
there are a variety of ways you can install extensions and themes from web pages, including direct
linking to the xpi files and using the installtrigger object.
...the html <a> is the install
link.
... the href attribute contains a direct
link to the extension xpi file, this is what will show in the location bar when the
link is moused over.
...And 5 more matches
Inner-browsing extending the browser navigation paradigm - Archive of obsolete content
note this article is the version from 2003 with slight modifications (no images and no
links to samples).
... introduction when you click a
link on a web page, your web browser makes a request to a web server which usually results in a new web page as a response.
... that new page may have
links that take you to other pages, which may in turn have more
links, and so on.
...And 5 more matches
GRE - Archive of obsolete content
this document describes how embedders should dynamically
link to a gre.
... finding and using a gre from application code avoid
linking directly against xpcom.dll if an application wishes to use the gre, it must take careful steps to ensure that it
links against the proper libraries.
... if you
link directly against xpcom.dll/libxpcom.so (xpcom.lib import lib), your application will not launch unless xpcom.dll is in your path.
...And 5 more matches
Creating a Help Content Pack - Archive of obsolete content
to have the help viewer search through these additional data sources, define another rdf:li element like so: <rdf:li> <rdf:description nc:panelid="search" nc:datasources="" nc:emptysearchtext="[no matching items found.]" nc:emptysearch
link="chrome://foo/locale/bar.html"/> </rdf:li> nc:panelid should be set to search.
... nc:emptysearch
link specifies what uri should be shown when the pseudo-result "no results found" is accessed.
...the sample page chrome://help/locale/welcome.xhtml has a section on searching which may be a useful
link to use here.
...And 5 more matches
Migrate apps from Internet Explorer to Mozilla - Archive of obsolete content
tooltips legacy browsers introduced tooltips into html by showing them on
links and using the value of the alt attribute as a tooltip's content.
... the latest w3c html specification created the title attribute, which is meant to contain a detailed description of the
link.
...clicking on the
link will open mozilla's internal view source window with the offending line highlighted.
...And 5 more matches
Extensions - Archive of obsolete content
for instance, opening a context menu for a
link displays items to open the
link in a new window or tab and to save or bookmark the
link.
...for example, the following may be used to insert a command just after the 'select all' command: <popup id="contentareacontextmenu"> <menuitem label="select
links" oncommand="thumbnails.selectall
links();" insertafter="context-selectall"/> </popup> see firefox context menu for a list of the ids of the items found on the firefox context menu.
...for instance, the 'on
link' property is set to true when a
link was context-clicked.
...And 5 more matches
What is RSS - Archive of obsolete content
for example: <?xml version="1.0"?> <rss version="2.0"> <channel> <title>example news site</title> <description>this is an example news site.</description> <lastbuilddate>wed, 27 jul 2005 00:30:30 -0700</lastbuilddate> <
link>http://news.example.com/</
link> <item> <title>news flash: i like bread</title> <guid isperma
link="false">4d4a0a12-f188-4c97-908b-eea27213c2fe</guid> <pubdate>wed, 27 jul 2005 00:30:30 -0700</pubdate> <
link>http://news.example.com/artcle/554</
link> </item> <item> <title>big news today: birds fly</title> ...
... <guid isperma
link="false">c4a63f09-b45b-466b-8773-6ff264001ab7</guid> <pubdate>tue, 19 jul 2005 04:32:51 -0700</pubdate> <
link>http://news.example.com/artcle/553</
link> </item> <item> <title>fire is hot</title> <guid isperma
link="false">c1795324-d5ea-44fa-95b1-b5ce2090d4f1</guid> <pubdate>sun, 15 may 2005 13:02:08 -0700</pubdate> <
link>http://news.example.com/artcle/552</
link> </item> </channel> </rss> bloggers use rss to provide everyone with a list of their newest blog posts.
... for example: <?xml version="1.0"?> <rss version="2.0"> <channel> <title>joe blow's blog</title> <description>this is the weblog of joe blow</description> <lastbuilddate>sun, 15 may 2005 13:02:08 -0500</lastbuilddate> <
link>http://joe-blow.example.net/</
link> <item> <title>i be blogging...</title> <guid>http://joe-blow.example.net/log/21</guid> <pubdate>sun, 15 may 2005 13:02:08 -0500</pubdate> <
link>http://joe-blow.example.net/log/21</
link> </item> <item> <title>i am so smrt</title> <guid>http://joe-blow.example.net/log/20</guid> <pubdate>sat, 14 may 2005 22:19:18 -0500</pubdate> <
link>http://joe-blow.example.net/log/20</
link> </i...
...And 5 more matches
Typesetting a community school homepage - Learn web development
starting point to get this assessment started, you should: go and grab the html and css files for the exercise, and the provided external
link icon.
...
links: give the
link, visited, focus, and hover states some colors that go with the color of the horizontal bars at the top and bottom of the page.
... make it so that
links are underlined by default, but when you hover or focus them, the underline disappears.
...And 5 more matches
HTML basics - Learn web development
the enclosing tags can make a word or image hyper
link to somewhere else, can italicize words, can make the font bigger or smaller, and so on.
...in the mists of time, when html was young (around 1991/92), doctypes were meant to act as
links to a set of rules that the html page had to follow to be considered good html, which could mean automatic error checking and other useful things.
...
links
links are very important — they are what makes the web a web!
...And 5 more matches
Debugging HTML - Learn web development
prerequisites: html familiarity, as covered in, for example, getting started with html, html text fundamentals, and creating hyper
links.
...let's look at an example: <a href="https://www.mozilla.org/>
link to mozilla homepage</a> </ul> let's review the problems: the paragraph and list item elements have no closing tags.
...this seems to have caused the biggest problem — the
link has not rendered at all.
...And 5 more matches
Video and audio content - Learn web development
here is a <a href="rabbit320.webm">
link to the video</a> instead.</p> </video> the features of note are: src in the same way as for the <img> element, the src (source) attribute contains a path to the video you want to embed.
...this can be anything you like; in this case, we've provided a direct
link to the video file, so the user can at least access it some way regardless of what browser they are using.
... the embedded video will look something like this: you can try the example live here (see also the source code.) using multiple source formats to improve compatibility there's a problem with the above example, which you may have noticed already if you've tried to access the live
link above with an older browser like internet explorer or even an older version of safari.
...And 5 more matches
Implementing feature detection - Learn web development
download the latest version (see manual installation), unzip the zip file, copy the html5shiv-printshiv.min.js and html5shiv.min.js files into your example directory, and
link to one of the files by putting the following under your <title> element: <script src="html5shiv.min.js"></script> have a look at your example css files — you'll see that basic-styling.css handles all the styling that we want to give to every browser, whereas the other two css files contain the css we want to selectively apply to browser depending on their support levels.
... you can look at the different effects these two files have by manually changing the css file referred to by the second <
link> element, but let's instead implement some javascript to automatically swap them as needed.
... first, remove the contents of the second <
link> element's href attribute.
...And 5 more matches
How Mozilla's build system works
components are not
linked against by any other library.
...these libraries are installed to dist/bin and are
linked against.
...static libraries may also be
linked into an executable.
...And 5 more matches
nsIAccessibleEvent
x0043 event_table_column_reorder 0x0048 0x0044 event_window_activate 0x0049 0x0045 event_window_create 0x004a 0x0046 event_window_deactivate 0x004b 0x0047 event_window_destroy 0x004c 0x0048 event_window_maximize 0x004d 0x0049 event_window_minimize 0x004e 0x004a event_window_resize 0x004f 0x004b event_window_restore 0x0050 0x004c event_hyper
link_end_index_changed 0x0051 0x004d the ending index of this
link within the containing string has changed.
... event_hyper
link_number_of_anchors_changed 0x0052 0x004e the number of anchors associated with this hyper
link object has changed.
... event_hyper
link_selected_
link_changed 0x0053 0x004f the hyper
link selected state changed from selected to unselected or from unselected to selected.
...And 5 more matches
Waterfall - Firefox Developer Tools
javascript functions executed in the page are labeled with the reason the function was called: script tag setinterval settimeout requestanimationframe promise callback promise init worker javascript uri event handler stack call stack, with
links to functions.
... stack call stack, with
links to functions.
... stack call stack, with
links to functions.
...And 5 more matches
Document - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link:href="/docs/web/api/document" target="_top"><rect x="266" y="1" width="80" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="306" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="mi...
... document.
linksread only returns a list of all the hyper
links in the document.
...And 5 more matches
HTMLStyleElement - Web APIs
it inherits properties and methods from its parent, htmlelement, and from
linkstyle.
... <div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...And 5 more matches
Recommended Drag Types - Web APIs
dragging
links dragged hyper
links should include data of two types: text/uri-list, and text/plain.
... both types should use the
link’s url for their data.
... to drag multiple
links, separate each
link inside the text/uri-list data with a crlf linebreak.
...And 5 more matches
ARIA Test Cases - Accessibility
with firefox 3 and ie 8 beta 2 jaws 9 & 10 with firefox 3 jaws 9 & 10 with ie beta 2 nvda 0.6p2 with firefox 3 orca with firefox 3 window-eyes 7 with ie 8 beta 2 and firefox 3 voiceover (leopard) with safari 4.0.2 zoom (leopard) with safari 4.0.2, firefox 3.x and opera 9.x zoomtext 9.1 with firefox 3 and ie 8 beta 2 test case structure test cases are organized as follows: test case
links test details expected at behavior markup notes results table at firefox ie opera safari jaws 9 - - - - jaws 10 - 1.
... reference to
link example note regarding dojo/dijit test files the main purpose of dojo's dijit test files are for dojo developers to exercise and debug the code.
...when possible provide a
link to the bug in the database so that its status can be reviewed.
...And 5 more matches
jpm - Archive of obsolete content
on debian and ubuntu, this can be remedied by ensuring you installed the compatibility package, nodejs-legacy: sudo apt-get install nodejs-legacy on other distributions, you may have to create a local sym
link to nodejs manually: sudo ln -s "$(which nodejs)" /usr/local/bin/node installing jpm after you have npm installed and node on your path, install jpm just as you would any other npm package.
...add the following line to the end of the file $home/.profile to add it to your path permanently (as the file .profile is executed every time a new terminal is opened): export path="$home/node_modules/.bin/:$path" installing jpm from git alternatively, you can also get the latest version of jpm using git: git clone https://github.com/mozilla-jetpack/jpm.git cd jpm npm install npm
link after installing jpm after installation, at the command prompt, type: jpm you should see a screen summarizing the available jpm commands.
... your add-on failed validation, was not signed, and you got a
link to a detailed report.
...And 4 more matches
The Box Model - Archive of obsolete content
the control attribute
links the label to the textbox.
... text
links xul makes it very easy for you to create a label that is also a
link.
... all you need is to set the text-
link class to the label, and add an onclick handler (oncommand won't work for this).
...And 4 more matches
Menu - Archive of obsolete content
for example, the items of the page's context menu change depending on what the user clicks: images have a context menu,
links have a context menu, and so on.
...jetpack.menu.context.page is the set of context menus that appear on the page: the image menu,
link menu, and so on.
... for example, jetpack.menu.context.page.on("a[href]") does not match images contained in
links.
...And 4 more matches
Using Remote XUL - Archive of obsolete content
its primary mechanism--the hyper
link--was designed to be interspersed in content.
...the bar consists of a set of
links organized into four main categories: the mozilla organization, developer docs, testing, and tools.
... the bar also contains two
links that are independent of any category: faq and search.
...And 4 more matches
Reference - Archive of obsolete content
inheritance and private variables the guide section
links to an interesting document discussing how to create and use private variables in objects, which is great if you want to protect the various properties within an object from being poked at accidentally.
...in particular this means we should define activation object somewhere (and
link to it whenever we mention it).
... otherwise, i think we should just remove the "behavior in other versions" sections, and rename the "javascript 1.2" section headings to something like "differences with javascript 1.2," as well as include a
link to the yet-to-be-written javascript 1.2 page documenting the various oddities and deviations made in that version, something which i think we should do anyway.
...And 4 more matches
Accessible multimedia - Learn web development
here is a <a href="viper.mp3">
link to the audio</a> instead.</p> </audio> <br> <video controls> <source src="rabbit320.mp4" type="video/mp4"> <source src="rabbit320.webm" type="video/webm"> <p>your browser doesn't support html5 video.
... here is a <a href="rabbit320.mp4">
link to the video</a> instead.</p> </video> the controls attribute provides play/pause buttons, seek bar, etc.
...here is a <a href="rabbit320.mp4">
link to the video</a> instead.</p> </video> <div class="controls"> <button class="playpause">play</button> <button class="stop">stop</button> <button class="rwd">rwd</button> <button class="fwd">fwd</button> <div class="time">00:00</div> </div> </section> javascript basic setup we've inserted some simple control buttons below our video.
...And 4 more matches
Test your skills: HTML accessibility - Learn web development
html accessibility 3 in this task you are required to turn all the information
links in the paragraph into good, accessible
links.
... the first two
links just go to regular web pages.
... the third
link goes to a pdf, and it's large — 8mb.
...And 4 more matches
Cascade and inheritance - Learn web development
we can look at a list of
links and explore how the universal values work.
...if you remove the rule how does it change the color of the
link?
... do you understand why the third and fourth
links are the color that they are?
...And 4 more matches
Mozilla splash page - Learn web development
project brief in this assessment we are presenting you with a mostly-finished mozilla splash page, which aims to say something nice and interesting about what mozilla stands for, and provide some
links to further resources.
... along with mdn.svg, these images will be your icons to
link to further resources, inside the further-info area.
... you'll also
link to the firefox logo in the site header.
...And 4 more matches
Creating localizable web applications
for example, if not all the pages of your website are going to be localized, you may consider removing
links to the english-only pages from the navigation (headers, footers, sidebars) in the localized versions.
... echo $tab_labels($tab); // this will display the translation } indicate the language of the pages you
link to indicate the language of the pages you
link to if it is different from the user's current language.
... for english, add hreflang="en" to
links to resources that are not going to be localized or are external to your web application.
...And 4 more matches
L20n Javascript API
l20n javascript api var ctx = l20n.getcontext(); ctx.
linkresource('./locales/strings.l20n'); ctx.requestlocales(); when you freeze the context by calling requestlocales, the resource files will be retrieved, parsed and compiled.
... when a context instance is frozen, no more resources can be added or
linked.
... ctx.addresource('<hello "hello, world!">'); ctx.
linkresource(uri: string) add a resource identified by a url to the context instance.
...And 4 more matches
Gecko events
event_table_column_insert event_table_column_delete event_table_column_reorder event_window_activate event_window_deactivate event_window_destroy event_window_maximize event_window_minimize event_window_resize event_window_restore event_hyper
link_end_index_changed the ending index of this
link within the containing string has changed.
... event_hyper
link_number_of_anchors_changed the number of anchors assoicated with this hyper
link object has changed.
... event_hyper
link_selected_
link_changed the hyper
link selected state changed from selected to unselected or from unselected to selected.
...And 4 more matches
Examine and edit CSS - Firefox Developer Tools
filename and line number: on the right-hand side is a
link to the rule.
... see
link to css file.
...(note that this setting is independent of the "browser styles" checkbox in the computed view.) user-agent styles are displayed against a different background, and the
link to the filename and line number contains the prefix (user agent): element {} rule the element {} rule at the top of the rules list isn't actually a css rule.
...And 4 more matches
Console messages - Firefox Developer Tools
the console then provides a
link to the filename and line number that generated the message.
... the context menu for network messages includes a few extra items in addition the globally-available ones: copy
link location acts as you would expect, copying the url into the clipboard open in network panel switches context to the network tab, selects the request and shows you the details resend request sends the network request again.
... js javascript errors contain a "learn more"
link that takes you to the javascript error reference containing additional advice for fixing issues: source maps the web console understands source maps.
...And 4 more matches
HTMLBodyElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlbodyelement" target="_top"><re...
...And 4 more matches
Web-based protocol handlers - Web APIs
background it's fairly common to find web pages
link to resources using non-http protocols.
... an example is the mailto: protocol: <a href="mailto:webmaster@example.com">web master</a> web authors can use a mailto:
link when they want to provide a convenient way for users to send an email, directly from the webpage.
... when the
link is activated, the browser should launch the default desktop application for handling email.
...And 4 more matches
SVGAElement - Web APIs
properties this interface also inherits properties from its parent, svggraphicselement, and implements properties from svgurireference and htmlhyper
linkelementutils.
... svgaelement.hreflang is a domstring that reflects the hreflang attribute, indicating the language of the
linked resource.
... svgaelement.ping is a domstring that reflects the ping attribute, containing a space-separated list of urls to which, when the hyper
link is followed, post requests with the body ping will be sent by the browser (in the background).
...And 4 more matches
SVGSVGElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><r...
...And 4 more matches
:visited - CSS: Cascading Style Sheets
the :visited css pseudo-class represents
links that the user has already visited.
... /* selects any <a> that has been visited */ a:visited { color: green; } styles defined by the :visited pseudo-class will be overridden by any subsequent
link-related pseudo-class (:
link, :hover, or :active) that has at least equal specificity.
... to style
links appropriately, put the :visited rule after the :
link rule but before the :hover and :active rules, as defined by the lvha-order: :
link — :visited — :hover — :active.
...And 4 more matches
Alternative style sheets - CSS: Cascading Style Sheets
an example: specifying the alternative stylesheets the alternate stylesheets are commonly specified using a <
link> element with rel="alternate stylesheet" and title="..." attributes.
... for example: <
link href="reset.css" rel="stylesheet" type="text/css"> <
link href="default.css" rel="stylesheet" type="text/css" title="default style"> <
link href="fancy.css" rel="alternate stylesheet" type="text/css" title="fancy"> <
link href="basic.css" rel="alternate stylesheet" type="text/css" title="basic"> in this example, the styles "default style", "fancy", and "basic" will be listed in the page style submenu, with "default style" pre-selected.
... when style sheets are referenced with a title attribute on the <
link rel="stylesheeet"> or <style> element, the title becomes one of the choices offered to the user.
...And 4 more matches
Event reference
each event is listed along with the interface representing the object sent to recipients of the event (so you can find information about what data is provided with each event) as well as a
link to the specification or specifications that define the event.
... domactivate uievent dom l3 a button,
link, or state changing element is activated (use click instead).
... mozbrowseropensearch firefox os browser api-specific sent when a
link to a search engine is found.
...And 4 more matches
<img>: The Image Embed element - HTML: Hypertext Markup Language
alt text is also displayed on the page if the image can't be loaded for some reason: for example, network errors, content blocking, or
linkrot.
...fox, internet explorer, opera, safari svg scalable vector graphics image/svg+xml .svg chrome, edge, firefox, internet explorer, opera, safari tiff tagged image file format image/tiff .tif, .tiff none built-in; add-ons required webp web picture format image/webp .webp chrome, edge, firefox, opera the abbreviation 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.
... this attribute is also used when copying and pasting the image to text, or saving a
linked image to a bookmark.
...And 4 more matches
Browser detection using the user agent - HTTP
if the problem seems uncommon, it's worth checking if this bug has been reported to the browser vendor via their bug tracking system (mozilla; webkit; b
link; opera).
... seamonkey seamonkey/xyz chrome chrome/xyz chromium/xyz chromium chromium/xyz safari safari/xyz chrome/xyz or chromium/xyz safari gives two version numbers: one technical in the safari/xyz token, and one user-friendly in a version/xyz token opera opr/xyz [1] opera/xyz [1] opera 15+ (b
link-based engine) [2] opera 12- (presto-based engine) internet explorer ; msie xyz; [1] trident/7.0; .*rv:xyz [2] [1] internet explorer 10- [2] internet explorer 11 of course, there is absolutely no guarantee that another browser will not hijack some of these things (like chrome hijacked the safari string in the past).
... there are five major rendering engines: trident, gecko, presto, b
link, and webkit.
...And 4 more matches
X-DNS-Prefetch-Control - HTTP
the x-dns-prefetch-control http response header controls dns prefetching, a feature by which browsers proactively perform domain name resolution on both
links that the user may choose to follow as well as urls for items referenced by the document, including images, css, javascript, and so forth.
...this reduces latency when the user clicks a
link.
...this is useful if you don't control the
link on the pages, or know that you don't want to leak information to these domains.
...And 4 more matches
href - SVG: Scalable Vector Graphics
the href attribute defines a
link to a resource as a reference url.
... the exact meaning of that
link depends on the context of each element using it.
... note: specifications before svg 2 defined an x
link:href attribute, which is now rendered obsolete by the href attribute.
...And 4 more matches
<feComposite> - SVG: Scalable Vector Graphics
example svg <svg width="330" height="195" viewbox="0 0 1100 650" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <title>example fecomposite - examples of fecomposite operations</title> <desc>four rows of six pairs of overlapping triangles depicting the six different fecomposite operators under different opacity values and different clearing of the background.</desc> <defs> <desc>define two sets of six filters for each of the six compositing operators.
...=".5" k3=".5" k4=".5"/> </filter> <path id="blue100" d="m 0 0 l 100 0 l 100 100 z" fill="#00ffff" /> <path id="red100" d="m 0 0 l 0 100 l 100 0 z" fill="#ff00ff" /> <path id="blue50" d="m 0 125 l 100 125 l 100 225 z" fill="#00ffff" fill-opacity=".5" /> <path id="red50" d="m 0 125 l 0 225 l 100 125 z" fill="#ff00ff" fill-opacity=".5" /> <g id="twobluetriangles"> <use x
link:href="#blue100"/> <use x
link:href="#blue50"/> </g> <g id="bluetriangles"> <use transform="translate(275,25)" x
link:href="#twobluetriangles"/> <use transform="translate(400,25)" x
link:href="#twobluetriangles"/> <use transform="translate(525,25)" x
link:href="#twobluetriangles"/> <use transform="translate(650,25)" x
link:href="#twobluetriangles"/> <use tran...
...sform="translate(775,25)" x
link:href="#twobluetriangles"/> <use transform="translate(900,25)" x
link:href="#twobluetriangles"/> </g> </defs> <rect fill="none" stroke="blue" x="1" y="1" width="1098" height="648"/> <g font-family="verdana" font-size="40" shape-rendering="crispedges"> <desc>render the examples using the filters that draw on top of an opaque white surface, thus obliterating the background.</desc> <g enable-background="new"> <text x="15" y="75">opacity 1.0</text> <text x="15" y="115" font-size="27">(with feflood)</text> <text x="15" y="200">opacity 0.5</text> <text x="15" y="240" font-size="27">(with feflood)</text> <use x
link:href="#bluetriangles"/> <g transform="translate(275,25)"> <use x
link:href="#red...
...And 4 more matches
Tabbed browser - Archive of obsolete content
opening a url in the correct window/tab there are methods available in chrome://browser/content/utilityoverlay.js that make it easy to open url in tabs such as openui
linkin and openui
link.
... openui
linkin( url, where, allowthirdpartyfixup, postdata, referrerurl ) where: "current" current tab (if there aren't any browser windows, then in a new window instead) "tab" new tab (if there aren't any browser windows, then in a new window instead) "tabshifted" same as "tab" but in background if default is to select new tabs, and vice versa "window" new window "save" save to disk (with no filename hint!) openui
link( url, e, ignorebutton, ignorealt, allowkeywordfixup, postdata, referrerurl ) the following code will open a url in a new tab, an existing tab, or an existing window based on which mouse button was pressed and which hotkeys (ex: ctrl) are being held.
... xul: <menuitem oncommand="myextension.foo(event)" onclick="checkformiddleclick(this, event)" label="click me"/> js: var myextension = { foo: function(event) { openui
link("http://www.example.com", event, false, true); } } opening a url in an on demand tab cu.import("resource://gre/modules/xpcomutils.jsm"); xpcomutils.definelazyservicegetter(this, "gsessionstore", "@mozilla.org/browser/sessionstore;1", "nsisessionstore"); // create new tab, but don't load the content.
...And 3 more matches
Creating reusable content with CSS and XBL - Archive of obsolete content
but you must
link those files from the document as a whole.
...you can use xbl to
link selected elements to their own: stylesheets content properties and methods event handlers because you avoid
linking everything at the document level, you can make self-contained parts that are easy to maintain and reuse.
...copy and paste the content from here: <!doctype html public "-//w3c//dtd html 4.0//en"> <html> <head> <title>mozilla css getting started - xbl demonstration</title> <
link rel="stylesheet" type="text/css" href="style6.css"> </head> <body> <h1>xbl demonstration</h1> <div id="square">click me</div> </body> </html> make a new css file, style6.css.
...And 3 more matches
Document Loading - From Load Start to Finding a Handler - Archive of obsolete content
we start with the request to load a particular
link in a particular window, and proceed up to the point at which the data stream is dispatched to the proper handler.
...nsdocshell implements too many interfaces to count; the ones that matter to us most are nsiwebnavigation and nsi
linkhandler.
...06,432,371" href="#open"> <area alt="(4)" coords="90,384,127,417" href="#openuri-innards"> <area alt="(0) registercontentlistener()" coords="37,474,346,474,346,505,88,505,88,535,37,535" href="#registercontentlistener" shape="poly"> <area alt="(3) openuri() (nsuriloader)" coords="5,207,312,269" href="#openuri"> <area alt="(2)" coords="102,114,139,148" href="#internalload"> <area alt="(1) loaduri/on
linkclick" coords="77,5,449,59" href="#loaduri"> <area alt="nsiexternalhelperappservice" coords="527,305,839,339" href="#nsiexternalhelperappservice"> <area alt="category manager" coords="683,467,807,527" href="#nscategorymanager"> <area alt="nsdocumentopeninfo" coords="371,71,635,185" href="#nsdocumentopeninfo"> <area alt="necko" coords="721,113,821,157" href="#necko"> <area alt="nsuriloader" coords=...
...And 3 more matches
Modularization techniques - Archive of obsolete content
it can even be used to eliminate all
link time dependencies on the class and its factory entirely.
... the component manager one of the major goals of our modularization is to remove
link time dependencies.
... so how do you find a module if you've never
linked with it?
...And 3 more matches
tab - Archive of obsolete content
attributes accesskey, afterselected, beforeselected, command, crop, disabled, first-tab, image, label, last-tab,
linkedpanel, oncommand, pending, pinned, 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.
...using it with an anchor tag (an <a>
link) will have no effect.
...
linkedpanel type: id the id of the
linked tabpanel element that will be displayed when the tab is selected.
...And 3 more matches
Syndicating content with RSS - Archive of obsolete content
adding a special <
link> element to html page(s).
... adding the <
link> often the data in an rss feed is also made available on an html web page.
... when this is the case, the html web page can let people and machines know about the feed by using the <
link> element, like this: <
link rel="alternate" type="application/rss+xml" href="http://example.com/feed" /> adding the <a> while use of the html <
link> element is powerful, it is mostly hidden.
...And 3 more matches
Examples - Archive of obsolete content
le" example 4 <!-- this file should have a .html extension --> <!doctype html public "-//w3c//dtd xhtml 1.0 strict//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en-us" xml:lang="en-us"> <head> <title>example 4 - xhtml 1.0 strict as text/html</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <
link rel="stylesheet" type="text/css" href="style.css" /> </head> <body> <h1>example 4 - xhtml 1.0 strict as text/html</h1> <p> this document is valid xhtml 1.0 strict served as <code>text/html</code>.
... </p> <p> this document references css rules contained in an external stylesheet via <code>
link</code>.
...the article example 5 <!-- this file should have a .xml extension --> <!doctype html public "-//w3c//dtd xhtml 1.0 strict//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en-us" xml:lang="en-us"> <head> <title>example 5 - xhtml 1.0 strict as text/xml</title> <meta http-equiv="content-type" content="text/xml; charset=utf-8" /> <
link rel="stylesheet" type="text/css" href="style.css" /> </style> </head> <body> <h1>example 5 - xhtml 1.0 strict as text/xml</h1> <p> this document is valid xhtml 1.0 strict served as <code>text/xml</code>.
...And 3 more matches
Correctly Using Titles With External Stylesheets - Archive of obsolete content
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.
... this is because the title attribute on a <
link rel="stylesheeet"> element makes it either preferred or an alternative style sheet.
...here are two examples: <
link type="text/css" rel="stylesheet" title="basic styles" href="basic.css" /> <
link type="text/css" rel="stylesheet" title="fish and boats" href="ocean.css" /> according to the html 4.01 specification, only one of the preferred stylesheets can be used at a time.
...And 3 more matches
Test your skills: CSS and JavaScript accessibility - Learn web development
css accessibility 1 in the first task you are presented with a list of
links.
... however, their accessibility is pretty bad — there is no way to really tell that they are
links, or to tell which one the user is focussed on.
... we'd like you to assume that the existing ruleset with the a selector is supplied by some cms, and that you can't change it — instead, you need to create new rules to make the
links look and behave like
links, and for the user to be able to tell where they are in the list.
...And 3 more matches
Pseudo-classes and pseudo-elements - Learn web development
examples include: :hover — mentioned above; this only applies if the user moves their pointer over an element, typically a
link.
...below are tables listing them, with
links to their reference pages on mdn.
... :any-
link matches both the :
link and :visited states of a
link.
...And 3 more matches
How CSS is structured - Learn web development
you can
link a single css file to multiple web pages, styling all of them with the same css stylesheet.
... in the getting started with css, we
linked an external stylesheet to our web page.
... you reference an external css stylesheet from an html <
link> element: <!doctype html> <html> <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.
...And 3 more matches
What is CSS? - Learn web development
links are colored and underlined to distinguish them from the rest of the text.
... css can be used for very basic document text styling — for example changing the color and size of headings and
links.
...have a look at the
links in this paragraph for specific examples.
...And 3 more matches
What HTML features promote accessibility? - Learn web development
tabbing users who do not or cannot use pointing devices can tab through
links and, as such,
links should be in a logical tabbing order.
...
link titles if you have a
link that isn’t self-descriptive, or the
link destination could benefit from being explained in more detail, you can add information to a
link using the title attribute.
... <p>i'm really bad at writing
link text.
...And 3 more matches
Client-Server Overview - Learn web development
when you click a
link on a web page, submit a form, or run a search, the browser sends an http request to the server.
...as part of processing the browser may discover
links to other resources (e.g.
... get request/response example you can make a simple get request by clicking on a
link or searching on a site (like a search engine homepage).
...And 3 more matches
Routing in Ember - Learn web development
typically, when writing web applications, you want the page to be represented by the url so that if (for any reason), the page needs to refresh, the user isn't surprised by the state of the web app — they can
link directly to significant views of the app.
... getting the footer
links working so our route functionality is now all in place, but we can't access them from our app.
... let's get the footer
links active so that clicking on them goes to the desired routes.
...And 3 more matches
Accessibility API cross-reference
directory see <nav> if it really is a table of contents, use <toc> containing <toci> elements (which are wrappers for internal hyper
links in such a table).
... input n/a hypertext
link that can be on image or text
link n/a
link <a> <
link> according to the pdf 1.7 spec, a <
link> must not be a direct child of a <toci> (table of contents item).
... in such a case, they should be wrapped in a <reference> pragmatically however, user agents should expect to find <
link> tags as direct children of <toci> abstract role - a perceivable section containing content that is relevant to a specific, author-specified purpose and sufficiently important that users will likely want to be able to navigate to the section easily and to have it listed in a summary of the page.
...And 3 more matches
Gecko info for Windows accessibility vendors
role_
link xul: <label class="text-
link"> -- this should be changed, we need a real <
link> widget for xul html: <a> and <area> sets state_
linked if it is pointing somewhere.
... sets state_traversed if
link has been visited.
... role_graphic xul: <image> html: <img> sets state_
linked if within
link.
...And 3 more matches
Mozilla's Section 508 Compliance
caveats: 1) although sidebar cannot be customized without a mouse, all sidebar functions that come with the browser are available through other means 2) java and in-page plugins cannot be used with the keyboard, so they must not be installed for keyboard-only users additional features for the keyboard: 1) find as you type allows for quick navigation to
links and convenient text searching 2) browse with caret (f7 key toggles) allows users to select arbitrary content with the keyboard and move through content as if inside a readonly editor.
...caveat: normally mozilla uses a color change to indicate when a
link has been visited.
... however, the visited
link appearance can be altered via a user style sheet.
...And 3 more matches
Firefox UI considerations for web developers
top sites the top sites box lists a user-configurable number of rows of icons serving as quick
links to sites the user commonly visits, or that the user has chosen to pin to the top sites list in order to have quick access to them.
... rich icons the high resolution icons—also known as rich icons—are specified by setting the rel attribute to one of: apple-touch-icon apple-touch-icon-precomposed fluid-icon the size of each icon is taken from the size attribute specified on the <
link>, if it's provided.
... providing a top sites ready icon the simple rule is to provide an icon which is at least 96x96 pixels in size, using a <
link> element whose rel attribute is a reference to a file containing an icon of a supported type.
...And 3 more matches
nsIBrowserHistory
to use this service, use: var browserhistory = components.classes["@mozilla.org/browser/nav-history-service;1"] .getservice(components.interfaces.nsibrowserhistory); method overview void addpagewithdetails(in nsiuri auri, in wstring atitle, in long long alastvisited); obsolete since gecko 15.0 void markpageasfollowed
link(in nsiuri auri); obsolete since gecko 22.0 void markpageastyped(in nsiuri auri); obsolete since gecko 22.0 void registeropenpage(in nsiuri auri); obsolete since gecko 9.0 void removeallpages(); void removepage(in nsiuri auri); void removepages([array, size_is(alength)] in nsiuri auris, in unsigned long alength, in boolean adobatchnotify); v...
...oid removepagesbytimeframe(in long long abegintime, in long long aendtime); void removepagesfromhost(in autf8string ahost, in boolean aentiredomain); void removevisitsbytimeframe(in long long abegintime, in long long aendtime); void unregisteropenpage(in nsiuri auri); obsolete since gecko 9.0 note: the markpageasfollowed
link and markpageastyped methods were moved to nsinavhistoryservice in gecko 22.0 so that all markpageas* methods can be found in one interface.
... markpageasfollowed
link() obsolete since gecko 22.0 (firefox 22.0 / thunderbird 22.0 / seamonkey 2.19) note: this method was moved to another interface in gecko 22.0.
...And 3 more matches
nsIClipboardCommands
inherits from: nsisupports last changed in gecko 1.7 method overview boolean cancopyimagecontents(); boolean cancopyimagelocation(); boolean cancopy
linklocation(); boolean cancopyselection(); boolean cancutselection(); boolean canpaste(); void copyimagecontents(); void copyimagelocation(); void copy
linklocation(); void copyselection(); void cutselection(); void paste(); void selectall(); void selectnone(); methods cancopyimagecontents() returns whether we can copy an image's contents.
...cancopy
linklocation() returns whether we can copy a
link location.
... boolean cancopy
linklocation(); parameters none.
...And 3 more matches
nsIWebBrowserChrome3
1.0 66 introduced gecko 2.0 inherits from: nsiwebbrowserchrome2 last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) method overview astring onbefore
linktraversal(in astring originaltarget, in nsiuri
linkuri, in nsidomnode
linknode, in prbool isapptab); methods onbefore
linktraversal() determines the appropriate target for a
link.
... astring onbefore
linktraversal( in astring originaltarget, in nsiuri
linkuri, in nsidomnode
linknode, in prbool isapptab ); parameters originaltarget the original
link target.
...
linkuri
link destination uri.
...And 3 more matches
nsIWebBrowserPersist
persist_flags_fixup_
links_to_destination 256 fix
links relative to destination location (not origin) persist_flags_dont_fixup_
links 512 do not make any adjustments to
links.
... persist_flags_fail_on_broken_
links 4096 fail on broken in-line
links.
... encode_flags_absolute_
links 128 convert
links to absolute
links where possible.
...And 3 more matches
Accessibility Inspector - Firefox Developer Tools
here we are mainly talking about exposing information to people with visual disabilities — this is done via the accessibility apis available inside web browsers, which expose information on what roles the different elements on your page play (e.g., are they just text, or are they buttons,
links, form elements, etc.?).
... actions — a list of actions that can be performed on the item, for example, a pushbutton would have "press" listed, while a
link would have "jump" listed.
...this can mean different things depending on the type of the item; for example, a form input (role: entry) would have a value of whatever is entered in the input, whereas a
link's value would be the url in the corresponding <a> element's href.
...And 3 more matches
Using the CSS Typed Object Model - Web APIs
we start with some html: a paragraph with a
link, as well as a definition list to which we will add all the css property / value pairs.
... <p> <a href="https://example.com">
link</a> </p> <dl id="regurgitation"></dl> we add javascript to grab our unstyled
link and return back a definition list of all the default css property values impacting the
link using computedstylemap().
...in other browsers, you'll just see a
link.
...And 3 more matches
Document.execCommand() - Web APIs
most commands affect the document's selection (bold, italics, etc.), while others insert new elements (adding a
link), or affect an entire line (indenting).
... create
link creates an hyper
link from the selection, but only if there is a selection.
... requires a uri string as a value argument for the hyper
link's href.
...And 3 more matches
RTCPeerConnection - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/rtcpeerconnection" target="_top"><rect x="151" y="1" width="170" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="236" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">rtcpeerconnection</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructorrtcpeerconnection() the rtcpeerconnection() constructor returns a newly-created rtcpeerconnection, which represents a connection between the local device and a remote peer.propertiesalso inherits properties from: eventtargetcantrickleicecandidatesthe read-only rtcpeerconnection property cantrickleicecandidates returns a...
...the answer is delivered to the returned promise, and should then be sent to the source of the offer to continue the negotiation process.createdatachannel() the createdatachannel() method on the rtcpeerconnection interface creates a new channel
linked with the remote peer, over which any kind of data may be transmitted.createoffer()the createoffer() method of the rtcpeerconnection interface initiates the creation of an sdp offer for the purpose of starting a new webrtc connection to a remote peer.generatecertificate()the generatecertificate() method of the rtcpeerconnection interface creates and stores an x.509 certificate and corresponding ...
...And 3 more matches
SVGStyleElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgstyleelement" target="_top"><rect...
...And 3 more matches
ARIA: Navigation Role - Accessibility
the navigation landmark role is used to identify major groups of
links used for navigating through a website or page content.
... <div role="navigation" aria-label="main"> <!-- list of
links to main website locations --> </div> this is a website's main navigation.
...lists) of
links that are intended to be used for website or page content navigation.
...And 3 more matches
Text labels and names - Accessibility
use alt attribute to label area elements that have the href attribute in image maps, give each <area> element an alt attribute containing a name that describes what resources the areas
links to.
...interactive elements include
links (<a>), form elements, buttons, and any element that has a handler for mouse or keyboard events.
... the way to label an element depends on its type: for form elements, use a <label>; for
links, buttons and clickable elements, the text content of the element typically provides the label.
...And 3 more matches
<color> - CSS: Cascading Style Sheets
activetext text of active
links buttonface background of push buttons buttontext text of push buttons canvas background of application content or documents canvastext text in application content or documents field background of input fields fieldtext text in input fields graytext text that is disabled highlight background of items that are selected in a control highlighttext ...
... text of items that are selected in a control
linktext text of non-active, non-visited
links visitedtext text of visited
links deprecated system color keywords the following keywords were defined in earlier versions of the css color module.
... -moz-nativehyper
linktext default platform hyper
link color.
...And 3 more matches
<dfn>: The Definition element - HTML: Hypertext Markup Language
links to <dfn> elements if you include an id attribute on the <dfn> element, you can then
link to it using <a> elements.
... such
links should be uses of the term, with the intent being that the reader can quickly navigate to the term's definition if they're not already aware of it, by clicking on the term's
link.
... this is shown in the example under
links to definitions below.
...And 3 more matches
Using dns-prefetch - Web Performance
this could be a file loaded later or
link target a user tries to follow.
...the html <
link> element offers this functionality by way of a rel attribute value of dns-prefetch.
... the cross-origin domain is then specified in the href attribute: syntax <
link rel="dns-prefetch" href="https://fonts.gstatic.com/" > examples <html> <head> <
link rel="dns-prefetch" href="https://fonts.gstatic.com/"> <!-- and all other head elements --> </head> <body> <!-- your page content --> </body> </html> you should place dns-prefetch hints in the <head> element any time your site references resources on cross-origin domains, but there are some things to keep in mind.
...And 3 more matches
target - SVG: Scalable Vector Graphics
this attribute specifies the name of the browsing context (e.g., a browser tab or an (x)html iframe or object element) into which a document is to be opened when the
link is activated: only one element is using this attribute: <a> html, body, svg { height: 100%; } text { font: 20px arial, helvetica, sans-serif; fill: blue; text-decoration: underline; } <svg viewbox="0 0 300 120" xmlns="http://www.w3.org/2000/svg"> <a href="https://developer.mozilla.org" target="_self"> <text x="0" y="20">open
link within iframe</text> </a> <a href="https://developer.mozil...
...la.org" target="_blank"> <text x="0" y="60">open
link in new tab or window</text> </a> <a href="https://developer.mozilla.org" target="_top"> <text x="0" y="100">open
link in this tab or window</text> </a> </svg> usage notes value _self | _parent | _top | _blank | <xml-name> default value _self animatable yes _replace the current svg image is replaced by the
linked content in the same rectangular area in the same frame as the current svg image.
... _self the current svg image is replaced by the
linked content in the same browsing context as the current svg image.
...And 3 more matches
<metadata> - SVG: Scalable Vector Graphics
example <svg width="400" viewbox="0 0 400 300" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <metadata> <rdf:rdf xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:connect="http://www.w3.org/1999/08/29-svg-connections-in-rdf#"> <rdf:description about="#cablea"> <connect:ends rdf:resource="#socket1"/> <connect:ends rdf:resource="#computera"/> </rdf:description> <rdf:description about="#cableb">...
...work hub</desc> <text x="0" y="15">hub</text> <g transform="translate(0 20)"> <rect width="253" height="84"/> <rect width="229" height="44" x="12" y="10"/> <circle fill="red" cx="227" cy="71" r="7" /> <!-- five groups each using the defined socket --> <g id="sock1et" transform="translate(25 20)"> <title>socket 1</title> <use x
link:href="#hubplug"/> </g> <g id="socket2" transform="translate(70 20)"> <title>socket 2</title> <use x
link:href="#hubplug"/> </g> <g id="socket3" transform="translate(115 20)"> <title>socket 3</title> <use x
link:href="#hubplug"/> </g> <g id="socket4" transform="translate(160 20)"> <title>socket 4</title...
...> <use x
link:href="#hubplug"/> </g> <g id="socket5" transform="translate(205 20)"> <title>socket 5</title> <use x
link:href="#hubplug"/> </g> </g> </symbol> <!-- computer symbol --> <symbol id="computer"> <desc>a common desktop pc</desc> <g id="monitorstand" transform="translate(40 121)"> <title>monitor stand</title> <desc>one of those cool swivelling monitor stands that sit under the monitor</desc> <path d="m0,0 s 10 10 40 12"/> <path d="m80,0 s 70 10 40 12"/> <path d="m0,20 l 10 10 s 40 12 70 10 l 80 20z"/> </g> <g id="monitor"> <title>monitor</title> <desc>a very fancy monitor</desc> <rect width="160" height="120"/> <rect fil...
...And 3 more matches
<use> - SVG: Scalable Vector Graphics
most attributes (except for x, y, width, height and (x
link:)href) do not override those set in the ancestor.
... since svg 2, the x
link:href attribute is deprecated in favor of href.
... see x
link:href page for more information.
...And 3 more matches
Reddit Example - Archive of obsolete content
when the user clicks on the title of a story in the panel, the add-on opens the
linked story in a new tab in the main browser window.
... to accomplish this the add-on needs to run a content script in the context of the reddit page which intercepts mouse clicks on each title
link and fetches the
link's target url.
...tenturl: "http://www.reddit.com/.mobile?keep_extension=true", contentscriptfile: [data.url("jquery-2.1.0.min.js"), data.url("panel.js")] }); reddit_panel.port.on("click", function(url) { require("sdk/tabs").open(url); }); this code supplies two content scripts to the panel's constructor in the contentscriptfile option: the jquery library and the script that intercepts
link clicks.
...And 2 more matches
Install Manifests - Archive of obsolete content
link in the extension's context menu will show this dialog, rather than the default.
... <em:hasembeddedwebextension>true</em:hasembeddedwebextension> homepageurl a
link to the add-on's home page - intended for display in the user interface.
... <em:optionstype>3</em:optionstype> <em:optionsurl>chrome://myaddon/content/options.html</em:optionsurl> this section here contains an example of localized html page as an option panel in a new tab: bootstrapped extensions :: localization (l10n) (example
linked to is: github :: l10n-html-options).
...And 2 more matches
Space Manager Detailed Design - Archive of obsolete content
uint32* aresult) const; #endif private: // structure that maintains information about the region associated // with a particular frame struct frameinfo { nsiframe* const mframe; nsrect mrect; // rectangular region frameinfo* mnext; frameinfo(nsiframe* aframe, const nsrect& arect); #ifdef ns_build_refcnt_logging ~frameinfo(); #endif }; // doubly
linked list of band rects struct bandrect : prcliststr { nscoord mleft, mtop; nscoord mright, mbottom; printn mnumframes; // number of frames occupying this rect union { nsiframe* mframe; // single frame occupying the space nsvoidarray* mframes; // list of frames occupying the space }; bandrect(nscoord aleft, nscoord atop, nscoord ari...
...ght, nscoord abottom, nsiframe*); bandrect(nscoord aleft, nscoord atop, nscoord aright, nscoord abottom, nsvoidarray*); ~bandrect(); // list operations bandrect* next() const {return (bandrect*)pr_next_
link(this);} bandrect* prev() const {return (bandrect*)pr_prev_
link(this);} void insertbefore(bandrect* abandrect) {pr_insert_before(abandrect, this);} void insertafter(bandrect* abandrect) {pr_insert_after(abandrect, this);} void remove() {pr_remove_
link(this);} // split the band rect into two vertically, with this band rect becoming // the top part, and a new band rect being allocated and returned for the // bottom part // // does not insert the new band rect into the
linked list ban...
...drect* splitvertically(nscoord abottom); // split the band rect into two horizontally, with this band rect becoming // the left part, and a new band rect being allocated and returned for the // right part // // does not insert the new band rect into the
linked list bandrect* splithorizontally(nscoord aright); // accessor functions prbool isoccupiedby(const nsiframe*) const; void addframe(const nsiframe*); void removeframe(const nsiframe*); prbool hassameframelist(const bandrect* abandrect) const; print32 length() const; }; // circular
linked list of band rects struct bandlist : bandrect { bandlist(); // accessors prbool isempty() const {return pr_clist_is_empty((prcliststr*)this);} bandrect* head() const {retu...
...And 2 more matches
label - Archive of obsolete content
attributes accesskey, control, crop, disabled, href, value properties accesskey, accessibletype, 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.
...using it with an anchor tag (an <a>
link) will have no effect.
...requires the class attribute to include text-
link.
...And 2 more matches
NPN_GetURL - Archive of obsolete content
values: _blank or _new: load the
link in a new blank unnamed window.
... _self or _current: load the
link into the same window the plug-in instance occupies.
... _parent: load the
link into the immediate <frameset> parent of the plug-in instance's document.
...And 2 more matches
Prefetch - MDN Web Docs Glossary: Definitions of Web-related terms
they are most relevant when there are a plethora of
links to external websites that may be clicked on, like search engine results, dns prefetching resolves domain names in advance thereby speeding up load times by reducing the time associated with domain lookup at request time.
... <
link rel="dns-prefetch" href="https://example.com/">
link prefetching
link prefetching is a performance optimization technique that works by assuming which
links the user is likely to click, then downloading the content of those
links.
... if the user decides to click on one of the
links, then the page will be rendered instantly as the content has already been downloaded.
...And 2 more matches
Organizing your CSS - Learn web development
you will typically have rules set up for: body p h1, h2, h3, h4, h5 ul and ol the table properties
links in this section of the stylesheet we are providing default styling for the type on the site, setting up a default style for data tables and lists and so on.
...you can
link to multiple stylesheets from one page, and the normal rules of the cascade apply, with rules in stylesheets
linked later coming after rules in stylesheets
linked earlier.
...it would make sense to have those things in a different stylesheet, only
linked to on store pages.
...And 2 more matches
Advanced text formatting - Learn web development
if you want to make the source of the quotation available on the page you need to make it available in the text via a
link or some other appropriate way.
...there is no reason however why you couldn't
link the text inside <cite> to the quote source in some way: <p>according to the <a href="/docs/web/html/element/blockquote"> <cite>mdn blockquote page</cite></a>: </p> <blockquote cite="/docs/web/html/element/blockquote"> <p>the <strong>html <code><blockquote></code> element</strong> (or <em>html block quotation element</em>) indicates that the enclosed text is an extended quotation.</p> </blockquote> <p>the quote element — <code><q></code> — is <q cite="/docs/web/html/element/q">intended for short quotations that don't require paragraph breaks.</q> -- <a href="/docs/web/html/element/q"> <cite>mdn q page...
... wrap the title of each source in <cite> tags and turn each one into a
link to that source.
...And 2 more matches
Handling common HTML and CSS problems - Learn web development
to show you an example of how such plugins generally work: install atom (if you haven't got an up-to-date version already installed) — download it from the atom page
linked above.
... for example: <video id="video" controls preload="metadata" poster="img/poster.jpg"> <source src="video/tears-of-steel-battle-clip-medium.mp4" type="video/mp4"> <source src="video/tears-of-steel-battle-clip-medium.webm" type="video/webm"> <!-- offer download --> <p>your browser does not support html5 video; here is a
link to <a href="video/tears-of-steel-battle-clip-medium.mp4">view the video</a> directly.</p> </video> this example includes a simple
link allowing you to download the video if even the html5 video player doesn't work, so at least the user can still access the video.
...the syntax looks like this: <!--[if lte ie 8]> <script src="ie-fix.js"></script> <
link href="ie-fix.css" rel="stylesheet" type="text/css"> <![endif]--> this block will apply the ie-specific css and javascript only if the browser viewing the page is ie 8 or older.
...And 2 more matches
FileUtils.jsm
ed to import the code module into your javascript scope: components.utils.import("resource://gre/modules/fileutils.jsm"); the file constructor if you have a path to a file (or directory) you want to obtain an nsifile for, you can do so using the file constructor, like this: var f = new fileutils.file(mypath); method overview nsifile getfile(string key, array patharray, bool follow
links); nsifile getdir(string key, array patharray, bool shouldcreate, bool follow
links); nsifileoutputstream openfileoutputstream(nsifile file, int modeflags); nsifileoutputstream openatomicfileoutputstream(nsifile file, int modeflags); nsifileoutputstream opensafefileoutputstream(nsifile file, int modeflags); void closeatomicfileoutputstream(nsifileoutput...
... nsifile getfile( string key, array patharray, bool follow
links ); parameters key the nsidirectoryservice key to start from (see getting special files for more info) patharray an array of path components to locate beneath the directory specified by key.
... follow
links optional true if
links should be followed, false otherwise.
...And 2 more matches
Localizing with Mozilla Translator
browser |-- locales | |-- en-us | | |-- readme.txt | | |-- chrome | | | |-- branding | | | | |-- brand.dtd | | | | `-- brand.properties | | | |-- browser | | | | |-- aboutdialog.dtd as you see, there is ''
link'' point, usually at chrome (in cvs & mozilla-central), sometimes in a deeper point.
... so, what you have to do is export partial glossaries in each
link point of the ''old'' product and import them in the corresponding
link point of the ''new'' point.
... if you are using a filesystem with symbolic
links support (i.e., linux or mac), you can create symbolic
links in a separate directory so it contains just the locale part.
...And 2 more matches
Creating localizable web content
depending on context, find alternate strings or document an explanation of the string for localizers check that we don't
link in new pages to sub-pages with anchors.
...for video, use the code to display the video in an overlayed video player on the page instead of
linking to a video section in english.
... per-locale customizations check if there are alternative
links for localized pages (e.g.,
links to mdn, addons.mozilla.org, or other external resources, are there translated equivalents we can use).
...And 2 more matches
NSS API Guidelines
for example, in container structures, such as secitem, or maybe
linked list data structures.
...queued,
linked, and hash table stored objects should be examined with special care.
...examples of hash tables can be found in security/nss/lib/certdb/pcertdb.c lock over the entire search: for small
linked listed, queues, or arrays, you can lock over the entire search.
...And 2 more matches
Using the Places history service
when the user starts browsing (for example, by typing in a
link or following a bookmark), a new session id is created.
...this means that one "session" is comprised of going to a new page, and following a bunch of
links or redirects.
... basic querying of the history system nsiglobalhistory2.isvisited: called by gecko when rendering
links.
...And 2 more matches
nsINavHistoryService
to use this service, use: var historyservice = components.classes["@mozilla.org/browser/nav-history-service;1"] .getservice(components.interfaces.nsinavhistoryservice); method overview astring getpagetitle(in nsiuri auri); void markpageasfollowedbookmark(in nsiuri auri); void markpageasfollowed
link(in nsiuri auri); void markpageastyped(in nsiuri auri); boolean canadduri(in nsiuri auri); long long addvisit(in nsiuri auri, in prtime atime, in nsiuri areferringuri, in long atransitiontype, in boolean aisredirect, in long long asessionid); obsolete since gecko 22.0 nsinavhistoryquery getnewquery(); nsinavhistoryqueryoptions getnewqueryoptions(); ...
... constants transition type constants constant value description transition_
link 1 this transition type means the user followed a
link and got a new toplevel window.
... transition_framed_
link 8 this transition type is set when the user followed a
link that loaded a page in a frame.
...And 2 more matches
Standard OS Libraries
this article allows you to find out what types to give to values/arguments by supplying
links to the documentation of the os libraries.
...for finding out the values and types of arguments and returns of the functions you want to use from this api, you must visit the functions page on this
linked msdn site; it will give you all that information.
... components.utils.import("resource://gre/modules/ctypes.jsm"); var lib = ctypes.open("user32.dll"); /* note: if you go to getcursorpos page on msdn, it says first argument is of structure point, so lets create that structure, * the
link here shows that that x and y are type long which is ctypes.long */ // https://msdn.microsoft.com/en-us/library/windows/desktop/dd162805%28v=vs.85%29.aspx var point = new ctypes.structtype("tagpoint", [ { "x": ctypes.long }, { "y": ctypes.long } ]); /* declare the signature of the function we are going to call */ var getcursorpos = lib.declare('getcursorpos', ctypes.winapi_abi, ctype...
...And 2 more matches
DataTransfer.effectAllowed - Web APIs
the move operation is used to indicate that the data being dragged will be moved, and the
link operation is used to indicate that some form of relationship or connection will be created between the source and drop locations.
... copy
link a copy or
link operation is permitted.
...
link a
link may be established to the source at the new location.
...And 2 more matches
HTMLImageElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlimageelement" target="_top"><r...
...And 2 more matches
HTMLTextAreaElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmltextareaelement" target="_top"...
...And 2 more matches
SVGCircleElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 700 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25" x2="151" y2...
...="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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><polylin...
...e 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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="180"...
...And 2 more matches
SVGEllipseElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><r...
...And 2 more matches
SVGLineElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><r...
...And 2 more matches
SVGPathElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25" x2="...
...151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" widt...
...And 2 more matches
SVGPolygonElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><r...
...And 2 more matches
SVGPolylineElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><r...
...And 2 more matches
SVGRectElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><r...
...And 2 more matches
SVGTSpanElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25" x2="151" y2="25" stroke=...
..."#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="180" height="50" ...
...And 2 more matches
SVGTextElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25" x2=...
..."151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" wid...
...And 2 more matches
SVGTextPathElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="...
...25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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</te...
...xt></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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="...
...And 2 more matches
SVGTextPositioningElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><r...
...And 2 more matches
SVGURIReference - Web APIs
the svgurireference interface is used to reflect the href attribute and the deprecated x
link:href attribute.
... <div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/svgurireference" target="_top"><rect x="1" y="1" width="150" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-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 th...
...e value of the href attribute, and, on elements that are defined to support it, the deprecated x
link:href attribute.
...And 2 more matches
A basic 2D WebGL animation example - Web APIs
the shader set is passed into the function buildshaderprogram(), which returns the compiled and
linked shader program.
... compiling and
linking the shader program constructing and
linking the program the buildshaderprogram() function accepts as input an array of objects describing a set of shader functions to be compiled and
linked into the shader program and returns the shader program after it's been built and
linked.
... function buildshaderprogram(shaderinfo) { let program = gl.createprogram(); shaderinfo.foreach(function(desc) { let shader = compileshader(desc.id, desc.type); if (shader) { gl.attachshader(program, shader); } }); gl.
linkprogram(program) if (!gl.getprogramparameter(program, gl.
link_status)) { console.log("error
linking shader program:"); console.log(gl.getprograminfolog(program)); } return program; } first, gl.createprogram() is called to create a new, empty, glsl program.
...And 2 more matches
WebKit CSS extensions - CSS: Cascading Style Sheets
applications based on webkit or b
link, such as safari and chrome, support a number of special webkit extensions to css.
...property
links to the new synax.
... pseudo-classes :-webkit-animating-full-screen-transition :-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.
...And 2 more matches
HTTP headers - HTTP
referer the address of the previous web page from which a
link to the currently requested page was followed.
...
link the
link entity-header field provides a means for serialising one or more
links in http headers.
... it is semantically equivalent to the html <
link> element.
...And 2 more matches
Authoring MathML - MathML
there is also a similar script to display a warning at the top of the page for browsers without good mathml support and let the users choose 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.
...it's always good to provide a
link to mdn's font instructions, so that your visitors can verify whether they have appropriate fonts installed on their system.
... pros: this is very easy setup: only a few javascript and css files to upload and/or a
link to add to your document header.
...And 2 more matches
Image file type and format guide - Web media technologies
fox, internet explorer, opera, safari svg scalable vector graphics image/svg+xml .svg chrome, edge, firefox, internet explorer, opera, safari tiff tagged image file format image/tiff .tif, .tiff none built-in; add-ons required webp web picture format image/webp .webp chrome, edge, firefox, opera the abbreviation 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.
...additionally, their use for favicons has subsided in favor of using a png file and the <
link> element, as described in providing icons for different usage contexts in <
link>: the external resource
link element.
... mime type image/png file extension(s) .png specification w3.org/tr/png browser compatibility feature chrome edge firefox internet explorer opera safari basic support 1 12 1 5 3.5.1 (presto) 15 (b
link) 1 alpha channel 1 12 1 5 6 (presto) all (b
link) 1 gamma correction no yes 1 8 1 broken color correction no yes 3 9 no no interlacing no ?
...And 2 more matches
Populating the page: how browsers work - Web Performance
it occurs whenever a user requests a page by entering a url into the address bar, clicking a
link, submitting a form, as well as other actions.
... <!doctype html> <html> <head> <meta charset="utf-8"/> <title>my simple page</title> <
link rel="stylesheet" src="styles.css"/> <script src="myscript.js"></script> </head> <body> <h1 class="heading">my page</h1> <p>a paragraph with a <a href="https://example.com/about">
link</a></p> <div> <img src="myimage.jpg" alt="image description"/> </div> <script src="anotherscript.js"></script> </body> </html> this response for this initial request contains the first byte of data r...
...time to first byte (ttfb) is the time between when the user made the request—say by clicking on a
link—and the receipt of this first packet of html.
...And 2 more matches
Progressive web app structure - Progressive web apps (PWAs)
being
linkable, progressive and responsive by design it's important to remember the pwa advantages and keep them in mind when designing the application.
... the app shell approach allows websites to be:
linkable: even though it behaves like a native app, it is still a website — you can click on the
links within the page and send a url to someone if you want to share it.
...es</title> <meta name="description" content="a list of a-frame entries submitted to the js13kgames 2017 competition, used as an example for the mdn articles about progressive web apps."> <meta name="author" content="end3r"> <meta name="theme-color" content="#b12a34"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta property="og:image" content="icons/icon-512.png"> <
link rel="shortcut icon" href="favicon.ico"> <
link rel="stylesheet" href="style.css"> <
link rel="manifest" href="js13kpwa.webmanifest"> <script src="data/games.js" defer></script> <script src="app.js" defer></script> </head> <body> <header> <p><a class="logo" href="http://js13kgames.com"><img src="img/js13kgames.png" alt="js13kgames"></a></p> </header> <main> <h1>js13kgames a-frame entries</h1> ...
...And 2 more matches
Media - Progressive web apps (PWAs)
the document's markup language might allow the media type to be specified when the stylesheet is
linked to the document.
... for example, in html, you have the option to specify the media type with a media attribute in the
link element.
... there are five special selectors: selector selects e:hover any e element that has the pointer over it e:focus any e element that has keyboard focus e:active the e element that is involved in the current user action e:
link any e element that is a hyper
link to a url that the user has not visited recently e:visited any e element that is a hyper
link to a url that the user has visited recently note: the information that can be obtained from the :visited selector is restricted in gecko 2.0.
...And 2 more matches
begin - SVG: Scalable Vector Graphics
indefinite the begin of the animation will be determined by a beginelement() method call or a hyper
link targeted to the element.
...ne x1="110" y1="25" x2="110" y2="105" stroke="grey" stroke-width=".5" /> <line x1="10" y1="30" x2="110" y2="30" stroke="grey" stroke-width=".5" /> <line x1="10" y1="105" x2="110" y2="105" stroke="grey" stroke-width=".5" /> </svg> begin-1-offset.svg syncbase example <svg width="120" height="120" viewbox="0 0 120 120" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:x
link="http://www.w3.org/1999/x
link"> <!-- animated rectangles --> <rect x="10" y="35" height="15" width="0"> <animate attributetype="xml" attributename="width" to="50" id="first" begin="0s;third.end" dur="4s" /> </rect> <rect x="60" y="60" height="15" width="0"> <animate attributetype="xml" attributename="width" to="25" id="second" be...
...ine x1="110" y1="25" x2="110" y2="105" stroke="grey" stroke-width=".5" /> <line x1="10" y1="30" x2="110" y2="30" stroke="grey" stroke-width=".5" /> <line x1="10" y1="105" x2="110" y2="105" stroke="grey" stroke-width=".5" /> </svg> begin-2-syncbase.svg event example <svg width="120" height="120" viewbox="0 0 120 120" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:x
link="http://www.w3.org/1999/x
link"> <!-- animated rectangle --> <rect x="10" y="35" height="15" width="0"> <animate attributetype="xml" attributename="width" from="0" to="100" begin="startbutton.click" dur="8s" fill="freeze" /> </rect> <!-- trigger --> <rect id="startbutton" style="cursor:pointer;" x="19.5" y="62.5" rx="5" heig...
...And 2 more matches
requiredFeatures - SVG: Scalable Vector Graphics
://www.w3.org/tr/svg11/feature#graphicsattribute http://www.w3.org/tr/svg11/feature#marker http://www.w3.org/tr/svg11/feature#colorprofile http://www.w3.org/tr/svg11/feature#gradient http://www.w3.org/tr/svg11/feature#pattern http://www.w3.org/tr/svg11/feature#clip http://www.w3.org/tr/svg11/feature#mask http://www.w3.org/tr/svg11/feature#filter http://www.w3.org/tr/svg11/feature#x
linkattribute http://www.w3.org/tr/svg11/feature#font http://www.w3.org/tr/svg11/feature#extensibility http://www.w3.org/tr/svg11/feature#svgdom-static the browser supports all of the dom interfaces and methods that correspond to the language features for http://www.w3.org/tr/svg11/feature#svg-static.
... http://www.w3.org/tr/svg11/feature#svg-dynamic the browser supports all of the language features from http://www.w3.org/tr/svg11/feature#svg-animation plus the following features: http://www.w3.org/tr/svg11/feature#hyper
linking http://www.w3.org/tr/svg11/feature#scripting http://www.w3.org/tr/svg11/feature#view http://www.w3.org/tr/svg11/feature#cursor http://www.w3.org/tr/svg11/feature#graphicaleventsattribute http://www.w3.org/tr/svg11/feature#documenteventsattribute http://www.w3.org/tr/svg11/feature#animationeventsattribute http://www.w3.org/tr/svg11/feature#svgdom-dynamic the browser supports...
...e onfocusin, onfocusout, onactivate, onclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout and onload attributes http://www.w3.org/tr/svg11/feature#animationeventsattribute the browser supports the onbegin, onend, onrepeat and onload attributes http://www.w3.org/tr/svg11/feature#cursor the browser supports the <cursor> element http://www.w3.org/tr/svg11/feature#hyper
linking the browser supports the <a> element http://www.w3.org/tr/svg11/feature#x
linkattribute the browser supports the x
link:type, x
link:href, x
link:role, x
link:arcrole, x
link:title, x
link:show and x
link:actuate attributes http://www.w3.org/tr/svg11/feature#externalresourcesrequired the browser supports the externalresourcesrequired attribute http://www.w3.org/tr/svg11/feature#view ...
...And 2 more matches
Understanding WebAssembly text format - WebAssembly
this is very useful, as it allows dynamic
linking of multiple modules.
... so what
links the call_indirect to the table we are calling?
... mutating tables and dynamic
linking because javascript has full access to function references, the table object can be mutated from javascript using the grow(), get() and set() methods.
...And 2 more matches
Using the WebAssembly JavaScript API - WebAssembly
they allow a single memory object to be imported by multiple module instances, which is a critical building block for implementing dynamic
linking in webassembly.
... this allows the indirectly-callable set of functions to change over time, which is necessary for dynamic
linking techniques.
...this is very useful, as it allows dynamic
linking of multiple modules.
...And 2 more matches
panel - Archive of obsolete content
for example, here's an add-on whose content script intercepts mouse clicks on
links inside the panel, and sends the target url to the main add-on code.
... var myscript = "window.addeventlistener('click', function(event) {" + " var t = event.target;" + " if (t.nodename == 'a')" + " self.port.emit('click-
link', t.tostring());" + "}, false);" var mypanel = require("sdk/panel").panel({ contenturl: "http://www.bbc.co.uk/mobile/index.html", contentscript: myscript }); mypanel.port.on("click-
link", function(url) { console.log(url); }); mypanel.show(); this example uses contentscript to supply the script as a string.
... if the panel's content is packaged along with your add-on and specified using an html file in your data directory, you can style it by embedding css directly in the html file or by referencing a css file stored under data: <!doctype html> <html> <head> <
link href="panel-style.css" type="text/css" rel="stylesheet"> </head> <body> my panel content </body> </html> from firefox 31 onwards, you can style panel content using the contentstyle or contentstylefile options.
... mouse button shortcuts, such as using the middle button to open a
link in a new page, don't work.
tabs/utils - Archive of obsolete content
on firefox it's derived from its
linkedpanel property.
... parameters id : on firefox it's derived from its
linkedpanel property.
... gettabforbrowser(browser) get the tab
linked to the specified browser.
... returns tab : the xul tab element
linked to the specified browser, if any.
ui/frame - Archive of obsolete content
for example, this html document defines a <select> element and a couple of <span> elements, and includes a css file to style the content and a javascript script to implement behavior: <!doctype html> <html> <head> <
link href="city-info.css" rel="stylesheet"></
link> </head> <body> <select name="city" id="city-selector"></select> <span id="time" class="info-element"></span> <span id="weather" class="info-element"></span> <script type="text/javascript" src="city-info.js"></script> </body> </html> if we save this document as "city-info.html" under the add-on's "data" directory, we can creat...
...if you send a json object, the sdk takes care of serializing and deserializing it for you: // frame.js var label = window.document.getelementbyid("
linky"); label.addeventlistener("click", function() { window.parent.postmessage({ "type" : "ping", "reason" : "they clicked me" }, "*"); }, true); // main.js var { frame } = require("sdk/ui/frame"); var frame = new frame({ url: "./frame.html" }); frame.on("message", pong); function pong(e) { if (e.data.type == "ping") { console.log(e.data.reason); e.source.postmessage("p...
... message listen to this event if you want to receive messages from frame scripts that are sent using window.parent.postmessage(): // frame.js var label = window.document.getelementbyid("
linky"); label.addeventlistener("click", function() { window.parent.postmessage("ping", "*"); }, true); // main.js var { frame } = require("sdk/ui/frame"); var frame = new frame({ url: "./frame.html" }); frame.on("message", pong); function pong(e) { if (e.data == "ping") { e.source.postmessage("pong", e.origin); } } arguments event : this contains three properties: source, which...
...if the payload was a json object, you can access it like an object: // frame.js var label = window.document.getelementbyid("
linky"); label.addeventlistener("click", function() { window.parent.postmessage({ "type" : "ping", "reason" : "they clicked me" }, "*"); }, true); // main.js var { frame } = require("sdk/ui/frame"); var frame = new frame({ url: "./frame.html" }); frame.on("message", pong); function pong(e) { if (e.data.type == "ping") { console.log(e.data.reason); e.source.postmessage("p...
Storing annotations - Archive of obsolete content
ar newannotation = new annotation(annotationtext, anchor); simplestorage.storage.annotations.push(newannotation); } this function calls a constructor for an annotation object, which we also need to supply: function annotation(annotationtext, anchor) { this.annotationtext = annotationtext; this.url = anchor[0]; this.ancestorid = anchor[1]; this.anchortext = anchor[2]; } now we need to
link this code to the annotation editor, so that when the user presses the return key in the editor, we create and store the new annotation: var annotationeditor = panels.panel({ width: 220, height: 220, contenturl: data.url('editor/annotation-editor.html'), contentscriptfile: data.url('editor/annotation-editor.js'), onmessage: function(annotationtext) { if (annotationtext) handle...
... the user will be able to click
links in the panel, but we want to open them in the main browser window rather than the panel.
... so the content script binds a click handler to the
links which will send the url to the add-on.
... annotation list html and css here's the html for the annotation list: <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>saved annotations</title> <
link rel="stylesheet" type="text/css" href="annotation-list.css" /> </head> <body> <div id="annotation-list"> </div> <div id="template"> <div class="annotation-details"> <a class="url"></a> <div class="selection-text"></div> <div class="annotation-text"></div> </div> </div> </body> </html> here's the corresponding css: #annotation-list .annotation-details { padding: 10px; margin: 10px; border: solid 3px #eee; background-color: white; } #annotation-list .url, .selection-text, .annotation-text { padding: 5px; ...
getAttributeNS - Archive of obsolete content
while namespaced attributes are less common than namespaced elements, some standards such as x
link depend on them.
....getattribute(nsatt); } else if (ns === 'http://www.w3.org/xml/1998/namespace') { // this is assumed so don't try to get an xmlns for the 'xml' prefix return thisitem.getattribute('xml:'+nsatt); // prefix must be 'xml' per the specs } var attrs2, result; var attrs = thisitem.attributes; var prefixatt = new regexp('^(.*):'+nsatt.replace(/\./g, '\\.')+'$'); // e.g., x
link:href // find any prefixes with the local-name being searched (escape period since only character (besides colon) allowed in an xml name which needs escaping) for (var j = 0; j < attrs.length; j++) { // thisitem's atts // e.g., abc:href, x
link:href while (((result = prefixatt.exec(attrs[j].nodename)) !== null) && thisitem.nodename !== '#document' && thisitem.noden...
...ame !== '#document-fragment') { var xmlnsprefix = new regexp('^xmlns:'+result[1]+'$'); // e.g., xmnls:xl, xmlns:x
link // check higher up for xmlns:prefix // check the current node and if necessary, check for the next matching local name up in the hierarchy (until reaching the document root) while (thisitem.nodename !== '#document' && thisitem.nodename !== '#document-fragment') { attrs2 = thisitem.attributes; for (var i = 0; i < attrs2.length; i++) { // search for any prefixed xmlns declaration on thisitem which match prefixes found above with desired local name if (attrs2[i].nodename.match(xmlnsprefix) && attrs2[i].nodevalue === ns ) { // e.g., 'xmlns:x
link' and 'http://www.w3.org...
.../1999/x
link' 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/x
link', 'href')); // gets x
link:href, xl:href, etc.
Creating custom Firefox extensions with the Mozilla build system - Archive of obsolete content
the easiest way to accomplish the latter is to use inline implementations for all methods so you don't have any additional
linking dependencies.
... otherwise you will have to
link statically to your module if you use these public headers in other modules.
... personally i would discourage this practice (among other things, static
linking means the same code gets loaded more than once into memory, and the code won't be available from javascript or other non-c++ languages) and encourage the use of xpcom wherever possible.
...eventually it will reach your extension and generate a bunch of stuff under /mozilla/$(moz_objdir)/: exported header files and generated header files (from idl) in dist/include/ static libraries for your modules in dist/lib/ (in case other modules want to
link statically to your stuff instead of using xpcom).
Firefox addons developer guide - Archive of obsolete content
if you use the interface template when mentioning interfaces by name, mdc will automatically format them and generate
links to their documentation, like this: nsiconsoleservice.
... if you prefer, you can just
link to the articles directly.
... either way, these
links should be added.
... todo: all fixme notes inside the documents; add abbreviation definition to acronyms; add some
link to the internal mdc documentation when it makes sense; indent source code; make sure documentation is relevant for all platforms: gnu/linux, macos, windows; add anchor
links to figures & listings; add credits to original authors and license; completed sometimes, interfaces names are misspelled: s/nsl/nsi; talk about fuel; titles of chapters and sub-headings should have caps for first letter of each word; we should add a part abou...
Using Dependent Libraries In Extension Components - Archive of obsolete content
ppsrcs = bdsstubloader.cpp extra_dso_ldopts += \ $(dist)/lib/$(lib_prefix)xpcomglue_s.$(lib_suffix) \ $(xpcom_frozen_ldopts) \ $(nspr_libs) \ $(null) include $(topsrcdir)/config/rules.mk defines += -dmoz_dll_prefix=\"$(dll_prefix)\" extensions/stub/bdsstubloader.cpp // copyright (c) 2005 benjamin smedberg <benjamin@smedbergs.us> #include "nscore.h" #include "nsmodule.h" #include "pr
link.h" #include "nsilocalfile.h" #include "nsstringapi.h" #include "nscomptr.h" static char const *const kdependentlibraries[] = { // dependent1.dll on windows, libdependent1.so on linux moz_dll_prefix "dependent1" moz_dll_suffix, moz_dll_prefix "dependent2" moz_dll_suffix, nsnull // note: if the dependent libs themselves depend on other libs, the subdependencies // should be listed fi...
... you will also need to make sure you are properly
linking the xpcom glue libraries.
... see xpcom glue for the proper flags on how to
link to the glue libraries.
... nsgetmoduleproc getmoduleproc = (nsgetmoduleproc)lookupsymbol(componentlib, "_nsgetmodule"); if (!getmoduleproc) return ns_error_failure; return getmoduleproc(acompmgr, alocation, aresult); } // convienience method grabbed from // http://mxr.mozilla.org/mozilla-central/source/xpcom/glue/standalone/nsglue
linkingosx.cpp .
Creating a Microsummary - Archive of obsolete content
web pages can reference generators via <
link rel="microsummary"> elements in their <head> elements.
...then just
link to the microsummaries from within the pages themselves using a <
link rel="microsummary"> element, f.e.: <head> <
link rel="microsummary" href="index.php?view=microsummary"> </head> when firefox encounters a <
link rel="microsummary"> element, it loads the url in the href attribute.
...if we were the spread firefox webmasters, we might simply reference the generator within the page itself by adding a <
link rel="microsummary"> tag to its <head> element: <head> <
link rel="microsummary" href="path/to/our/generator.xml"> </head> since we're not that site's webmasters, however, we can specify the page to which the generator applies within the generator itself and then make the generator available for download and installation.
...to do so, we need to put it up on the web and then create a javascript
link on some web page that calls firefox's window.sidebar.addmicrosummarygenerator() method to download and install the generator.
Priority Content - Archive of obsolete content
keller in progress: rapid application development with mozilla original: author's page and planned host, ben's temporary host wiki location: toc and
links page still under construction.
... migrators: nigel mcfarlane and ben karel shorter works mostly completed: bypassing security restrictions and signing code original: bypassing security restrictions and signing code wiki location: bypassing security restrictions and signing code migrators: joel stanley i added the related
links from the original article.
... however, the
link about signtool seems to be broken.
... migrators: joel coreson note: the article
links some external example files, not sure how to migrate them (perhaps via "upload file" function that's normally used for images?) also check if any extra files live in the article's directory --jens.b 14:07, 26 apr 2005 (pdt) dependant on: mostly completed*: class xbdesignmode / devedge - joel coreson please put completed articles on the devedge page instead.
Venkman Introduction - Archive of obsolete content
fortunately, the xpinstall technology makes it possible to install new application modules in firefox by just clicking a hyper
link.
...first, from within the browser you want to host the debugger application, visit the firefox add-ons page and click on the "install"
link for the most recent version.
... on the fishcam page, press the "pause"
link.
... click the "pause"
link again on the fishcam page to resume the demo.
A XUL Bestiary - Archive of obsolete content
the parts of the document, such as the head, the
links, the body, any tags, are available as nodes whose attributes can be got and set.
...just as html is reflected in the dom as nodes like
link, layer, and img, xul is reflected in the application object model in the hierarchy of xul widgets: browser, menu, menuitem, and so on.
...documents will load, buttons will be clicked, and
links will be hovered over, and events will be raised for all these actions behind closed doors.
...in addition to the small matter of programming these serious things in c++ and compiling them platform for platform, the architects and developers of mozilla use three "xp" technologies to
link the core with the interface.
Index - Archive of obsolete content
106 dropped
linkhandler xul attributes, xul reference no summary!
... 178
linkedpanel xul attributes, xul reference no summary!
... 741
linkedpanel xul properties, xul reference no summary!
... 914 text-
link xul reference, xul_style_classes no summary!
Introduction to XUL - Archive of obsolete content
the effect a widget will have on its application will be defined as a combination of predefined application behaviour and
linkage between the widgets.
... this
linkage can be accomplished by including javascript in the xul, or by application code which walks the content model after it has been built from xul, and hooks up event listeners.
...it will send its command to the application for processing, generally using some simple javascript for
linkage.
...follow the
links for details.
browser - Archive of obsolete content
attributes autocompleteenabled, autocompletepopup, autoscroll, disablehistory, disableglobalhistory, disablesecurity, dropped
linkhandler, homepage, showcaret, src, type properties accessibletype, cangoback, cangoforward, contentdocument, contentprincipal, contenttitle, contentvieweredit, contentviewerfile, contentwindow, currenturi, docshell, documentcharsetinfo, homepage, markupdocumentviewer, messagemanager, preferences, securityui, sessionhistory, webbrowserfind, webnavigation, webprogress methods addprogressli...
... dropped
linkhandler type: function this function is called when
links are dropped to the browser element, with the following arguments.
... dropped
linkhandler(event, uri, name) -- firefox 51 or older dropped
linkhandler(event,
links) -- firefox 52 or newer event -- drop event, or null if no event is available uri -- uri string of the dropped
link name -- name string of the dropped
link links -- array of the dropped items with nsidropped
linkitem interface homepage type: url this attribute allows you to set a homepage for the browser element.
... load_flags_is_
link: this flag is used when the url is loaded because a user clicked on a
link.
Gecko Compatibility Handbook - Archive of obsolete content
more info clicking a
link results in a 404-page not found but works in internet explorer the
link may use an invalid form of a relative url.
... verify that all hyper
links use forward slashes (/) clicking on a
link displays a "download" or displays html code instead of rendering the page correctly, but works as expected in internet explorer the web server has incorrectly specified the mime type for the content.
...(related article) stylesheet is not being recognized the presence of the title attribute in a
link element that references an external stylesheet can cause the stylesheet may be causing the external stylesheet to be ignored.
...web site compatibility problems mozilla web developer community references using web standards in your web pages browser detection and cross browser support updating dhtml web pages html element cross reference dom client object cross-reference introduction to cross-browser javascript and dynamic html gecko user agent strings developer tools mozilla's doctype sniffing the main page
links to many more resources.
2006-10-27 - Archive of obsolete content
gavin responded to tony's posting saying that the log file shows a "no space left on device" error when trying to
link the final executable.
... peter weilbacher responded to alex's posting on the same day, stating that he is not sure what packaging system solaris 10 x86 uses but thinks that he might need to install the developer packages of x and/or xrender and freetype which should contain the libxrender.* and libfreetype.* files that are need for the
linking.
... october 26: masaki responded to alex's posting by providing a
link to a similar bug that provides a work around to the problem he was having.
...cédric's posting was about a french site which had already announced the availablity of ff 2.0 final release and provided download
links, even though the release was on october 24.
Implementation Status - Archive of obsolete content
document structure section title status notes bugs 3.1 namespaces supported 3.2.1 common attributes supported 3.2.2
linking attributes supported 3.2.3 single-node binding attributes 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 ...
... 4.4.19 xforms-submit-done supported 4.5 error indications partial we don't support the xforms-version-exception event, yet 4.5.1 xforms-binding-exception supported 4.5.2 xforms-compute-exception supported 4.5.3 xforms-
link-error partial not yet generated by load.
... 333782; 4.5.4 xforms-
link-exception supported 4.5.5 xforms-output-exception unsupported 4.5.6 xforms-submit-error supported 4.5.7 xforms-version-exception unsupported 4.6 event sequencing supported 4.6.1 for input, secret, textarea, range, or upload controls supported 4.6.2 for output controls supported 4.6.3 for select or select1 controls partial 4.6.4 for trigger controls supported ...
... 332231; 349805; 10.11 revalidate partial is dispatching events instead of calling directly 332231; 10.12 refresh partial is dispatching events instead of calling directly 332231; 10.13 reset supported 10.14 load partial no xforms-
link-error generated if @src invalid 333782; 10.15 send supported 10.16 message partial output inside message doesn't work correctly 366886; 10.17 conditional execution of xforms actions supported 10.18 iteration of xforms actions supported ...
Mobile accessibility - Learn web development
browsing web pages you can use the local context menu while in a web browser to find options to navigate web pages using just the headings, form controls, or
links, or navigate line by line, etc.
...you can double-tap an item to select it (e.g., follow a
link).
...
links: move between
links on the page.
... note: we won't provide a full discussion of responsive design techniques here, as they are covered in other places around mdn (see above
links).
Test your skills: Selectors - Learn web development
style
links, making the
link-state orange, visited
links green, and remove the underline on hover.
...you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want to be assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
The box model - Learn web development
the <a> element, used for
links, <span>, <em> and <strong> are all examples of elements that will display inline by default.
... where this can be useful is when you want to give a
link to a larger hit area by adding padding.
... <a> is an inline element like <span>; you can use display: inline-block to allow padding to be set on it, making it easier for a user to click the
link.
... add display: inline-block to the rule with the .
links-list a selector, and you will see how it fixes this issue by causing the padding to be respected by other elements.
Test your skills: values and units - Learn web development
you can find conversions for the hex color at this
link.
...you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Practical positioning examples - Learn web development
the unordered list contains three list items with
links inside, which will become the actual tabs to click on for displaying our content panels.
... add the following css: .info-box li { float: left; list-style-type: none; width: 150px; } .info-box li a { display: inline-block; text-decoration: none; width: 100%; line-height: 3; background-color: red; color: black; text-align: center; } finally for this section we'll set some styles on the
link states.
... used the cursor property to change the mouse cursor when it is hovering over the icon to a hand pointer (like the one you see when
links are hovered over), as an extra visual clue to users that the icon does something interesting.
...javascript and a
link or button might be more appropriate, but it is still fun to experiment with.
Using your new knowledge - Learn web development
the css properties that i have used are as follows — each one
links to its property page on mdn, which will give you more examples of its use.
... make the
links green on hover.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Using CSS generated content - Learn web development
you can specify text or image content within a stylesheet when that content is closely
linked to the document's structure.
...if you specify content in 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.
... html a text where i need to <span class="ref">something</span> css .ref::before { font-weight: bold; color: navy; content: "reference "; } output the character set of a stylesheet is utf-8 by default, but it can also be specified in the
link, in the stylesheet itself, or in other ways.
... this rule adds a space and an icon after every
link that has the class glossary: html <a href="developer.mozilla.org" class="glossary">developer.mozilla.org</a> css a.glossary::after { content: " " url("https://mdn.mozillademos.org/files/16322/glossary-icon.gif"); } ...
How does the Internet work? - Learn web development
deeper dive a simple network when two computers need to communicate, you have to
link them, either physically (usually with an ethernet cable) or wirelessly (for example with wifi or bluetooth systems).
...well, there are already cables
linked to your house, for example, electric power and telephone.
...an isp is a company that manages some special routers that are all
linked together and can also access other isps' routers.
...thus any computer
linked to a network has a unique address that identifies it, called an "ip address" (where ip stands for internet protocol).
CSS basics - Learn web development
paste the following line in the head (between the <head> and </head> tags): <
link href="styles/style.css" rel="stylesheet"> save index.html and load it in your browser.
...(for example, when a cursor hovers over a
link.) a:hover selects <a>, but only when the mouse pointer is hovering over the
link.
...add the <
link> element somewhere inside your index.html's head (anywhere between the <head> and </head> tags).
... it looks something like this: <
link href="https://fonts.googleapis.com/css?family=open+sans" rel="stylesheet"> this code
links your page to a style sheet that loads the open sans font family with your webpage.
Use JavaScript within a webpage - Learn web development
there are two ways to use script, depending on whether you're
linking to an external script or embedding a script right in your webpage.
...
linking an external script usually, you'll be writing scripts in their own .js files.
...likewise, your drop-down menus should be structured as unordered lists of
links.
... let users tab through all controls (e.g.,
links and form input) in a logical order.
HTML text fundamentals - Learn web development
a kind warning about underline: people strongly associate underlining with hyper
links.
... therefore, on the web, it's best to underline only
links.
...in the next article, we'll be looking in detail at how to create hyper
links, possibly the most important element on the web.
...metadata in html html text fundamentals creating hyper
links advanced text formatting document and website structure debugging html marking up a letter structuring a page of content ...
Structuring a page of content - Learn web development
you need to add a suitable wrapper for: the header the navigation menu the main content the welcome text the image sidebar the footer you should also: apply the provided css to the page by adding another <
link> element just below the existing one provided at the start.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
...metadata in html html text fundamentals creating hyper
links advanced text formatting document and website structure debugging html marking up a letter structuring a page of content ...
From object to iframe — other embedding technologies - Learn web development
say you wanted to include the mdn glossary on one of your web pages — you could try something like this: <iframe src="https://udn.realityripple.com/docs/glossary" width="100%" height="500" frameborder="0" allowfullscreen sandbox> <p> <a href="https://udn.realityripple.com/docs/glossary"> fallback
link for browsers that don't support iframes </a> </p> </iframe> this example includes the basic essentials needed to use an <iframe>: allowfullscreen if set, the <iframe> is able to be placed in fullscreen mode using the full screen api (somewhat beyond scope for this article.) frameborder if set to 1, this tells the browser to draw a border between this frame and other frames, which is ...
...in this case, we have included a
link to the page instead.
... however, you are unlikely to use these elements very much — applets haven't been used for years, flash is no longer very popular, due to a number of reasons (see the case against plugins, below), pdfs tend to be better
linked to than embedded, and other content such as images and video have much better, easier elements to handle those.
...they do still tend to be popular in some circles, but it is much better to
link to them so they can be downloaded or read on a separate page, rather than embedding them in a webpage.
What went wrong? Troubleshooting JavaScript - Learn web development
fixing syntax errors earlier on in the course we got you to type some simple javascript commands into the developer tools javascript console (if you can't remember how to open this in your browser, follow the previous
link to find out how).
... an error message to indicate what's gone wrong: "typeerror: guesssubmit.addeventlistener is not a function" a "learn more"
link that
links through to an mdn page that explains what this error means in greater detail.
... the name of the javascript file, which
links through to the debugger tab of the developer tools.
... if you follow this
link, you'll see the exact line where the error is highlighted.
Web performance resources - Learn web development
below is a quick review of best practices, tools, apis with
links to provide more information about each topic.
...as we learned in the critical rendering path document,
linking css with a tradional
link tag with rel="stylesheet" is synchronous and blocks rendering.
... <
link rel="stylesheet" href="/path/to/my.css" media="print" onload="this.media='all'"> <noscript><
link rel="stylesheet" href="/path/to/my.css"></noscript> the downside with this approach is the flash of unstyled text (fout.) the simplist way to address this is by inlining css that is required for any content that is rendered above the fold, or what you see in the browser viewport before scrolling.
... <style type="text/css"> // insert your css here </style> javascript avoid javascript blocking by using the async or defer attributes, or
link javascript assets after the page's dom elements.
Website security - Learn web development
an attacker can construct a search
link that contains a malicious script as a parameter (e.g., http://mysite.com?q=beer<script%20src="http://evilsite.com/tricky.js"></script>) and email it to another user.
... if the target user clicks this "interesting
link", the script will be executed when the search results are displayed.
...for html this includes elements, such as <script>, <object>, <embed>, and <
link>.
...john constructs a form that includes his bank details and an amount of money as hidden fields, and emails it to other site users (with the submit button disguised as a
link to a "get rich quick" site).
Deployment and next steps - Learn web development
link to existing project?
...[y/n] n
linked to opensas/mdn-svelte-tutorial (created .vercel) inspect: https://vercel.com/opensas/mdn-svelte-tutorial/[...] [1s] ✅ production: https://mdn-svelte-tutorial.vercel.app [copied to clipboard] [19s] deployed to production.
... run `vercel --prod` to overwrite later (https://vercel.
link/2f).
...to do this, we just remove the leading slashes (/) from the /global.css, /build/bundle.css, and /build/bundle.js urls, like this: <title>svelte to-do list</title> <
link rel='icon' type='image/png' href='favicon.png'> <
link rel='stylesheet' href='global.css'> <
link rel='stylesheet' href='build/bundle.css'> <script defer src='build/bundle.js'></script> do this now.
Introducing a complete toolchain - Learn web development
toolchains and their inherent complexity as with any chain, the more
links you have in your toolchain, the more complex and potentially brittle it is — for example it might be more complex to configure, and easier to break.
... conversely, the fewer
links, the more resilient the toolchain is likely to be.
... the smallest toolchain is one that has no
links at all.
... once you've signed up for github (click the sign up
link on the homepage if you don't already have an account, and follow the instructions), you can use your github account for authentication on netlify (click sign up, then choose github from the "sign up with one of the following" list), so technically you only need to create one new account.
Accessible Toolkit Checklist
get_accvalue: get the "value" of the iaccessible, for example a number in a slider, a url for a
link, the text a user entered in a field.
...is it a
link, static text, editable text, a checkbox, or a table cell, etc.
...pport, including the haspopup state default buttons ability to define in xml enter key fires it, but not when another widget has focus that needs the enter key layout engine - drawing dark border dynamically when the currently focused widget does not need the enter key events - making keystrokes do the right thing msaa support (default state)
links enter key activates
link (thus default button no longer shows dark border when
link is focused) msaa support, including
linked and traversed states, and accessible value that holds destination url text fields - single and multiple line it's probably best to use native widgets for these, otherwise accessibility support will be quite difficult tab should...
... always focus the next item, not insert a tab, unless there's a really good reason and another way to navigate always use system selection color, otherwise screen reader won't read the text make sure the caret is never b
linking when focus is not in text field handle standard editing keys, such as arrow keys, home, end, pageup, pagedown, ctrl+left/right, shifted keys for selection, delete, ctrl+delete, backspace, ctrl+backspace, ctrl+a, ctrl+b, ctrl+c, ctrl+i, ctrl+u, ctrl+x, ctrl+v, ctrl+[shift]+z in multiline text field, enter key inserts new line (thus default button no longer shows dark border when multiline text field is focused) in autocomplete text fields, make sure the autocomplete popup doesn't receive actual or msaa focus unless an up/down arrow is presse...
Old Thunderbird build
if you changed c or c++ files, run: ./mozilla/mach build binaries if you changed javascript or xul files, on mac os x or linux you don't have to rebuild since the files in the object directory are
linked to the ones in the source directory.
... check if your mozilla/ is a sym
link.
... a sym
link there is not supported.
... if on windows you get
link errors like "lnk1102: out of memory" or "lnk1318: unexpected pdb error; ok (0)", try deleting the largest .pdb files before rushing out the door to buy more ram.
Simple Thunderbird build
if you changed c or c++ files, run: ./mach build binaries if you changed javascript or xul files, on macos or linux you don't have to rebuild since the files in the object directory are
linked to the ones in the source directory.
... check if your mozilla/ is a sym
link.
... a sym
link there is not supported.
... if on windows you get
link errors like "lnk1102: out of memory" or "lnk1318: unexpected pdb error; ok (0)", try deleting the largest .pdb files before rushing out the door to buy more ram.
Gecko SDK
the gecko sdk contains all of the necessary tools and headers for making scriptable npapi plugins including the xpidl compiler/
linker and the latest npapi.h.
... download
link latest gecko (latest firefox) gecko 1.9.2 (firefox 3.6) gecko 1.9.1 (firefox 3.5) gecko 1.9 (firefox 3.0) gecko 1.8 (firefox 1.5 and 2.0) windows download download download download download mac x86_64 download n/a n/a n/a n/a mac i386 download download download download n/a mac ppc n/a download ...
... contents of the sdk the sdk contains the following: 1.9.2 idl files for frozen interfaces (under idl/) header files for frozen interfaces, xpcom functions, and nspr functions (under include/) import libraries or shared libraries (under lib/) static utility libraries (under lib/) various tools (under bin/) for more information about safely
linking xpcom components using the xpcom "glue" library, see xpcom glue.
... resources static xpidl.exe (non-official) if you are looking for a static
linked xpidl.exe, you can download here.
HTML parser threading
once a unicode decoder has been set up, dodataavailable passes the byte data to the decoder whose output is accumulated into a
linked list of nshtml5owningutf16buffer objects.
...if there is data in document.write() input after a an external script (or any data at all if a previous document.write() call has contained an external script and blocked the parser), the data is left in a
linked list of nshtml5owningutf16buffer objects.
...parseuntilblocked() parses data left by document.write() in the
linked list of buffers, because the parser was blocked.
...speculative loads when the tree builder on the parser thread encounters html script, stylesheet
link, video (with a poster frame), base or img or svg script, style or image elements, preload operations are appended to a speculative load queue.
How to Report a Hung Firefox
the crash report
link for a hang, obtained by following the steps below.
... create a new bug report at bugzilla.mozilla.org using this
link.
... create a new bug report at bugzilla.mozilla.org using this
link.
... create a new bug report at bugzilla.mozilla.org using this
link.
Internationalized Domain Names (IDN) Support in Mozilla Browsers
if end users input non-ascii characters as part of a domain name or if a web page contains a
link using a non-ascii domain name, the application must convert such input into a special encoded format using only the usual ascii subset characters.
... how mozilla browsers handle non-ascii domain names unicode and nameprep when mozilla receives idn input from the user via the location bar or a request to process non-ascii host name
links, it first turns them into unicode, then normalizes the input string to make it conform to general uri requirement.
...for example, most sample
links on the following test pages can be used without any further setting: http://www.nunames.nu/eu-lang-test.htm (domain names with latin 1 accented characters) http://www.nunames.nu/lldemo/default.htm (domain names in other languages) on july 10, 2003 and thereafter, you can access a large number of japanese domain name sites under the .jp top domain with no further setting on netscape 7.1/moz...
...for other bugs, see this
link.
JavaScript OS.Constants
permission denied eagain resource temporarily unavailable ebadf bad file descriptor eexist file exists efault bad address efbig file too large einval invalid argument eio input/output error eisdir is a directory eloop (not always available under windows) too many levels of symbolic
links.
... exdev cross-device
link opening files unix access rights defined on all platforms but meaningful only on unix.
... o_largefile o_nofollow do not follow symbolic
links.
... o_sym
link allow opening of symbolic
links.
OS.File.Info
using os.file.info example: determining if a file is a regular file the following snippet uses the main thread api to determine (asynchronously) whether some path is a regular file, or a directory, or a symbolic
link: let promise = os.file.stat(somepath); promise.then( function onsuccess(info) { // |info| is an instance of |os.file.info| if (info.isdir) { // |somepath| represents a directory } else if (info.issym
link) { // |somepath| represents a symbolic
link } else { // |somepath| represents a regular file } }, function onfailure(reason) { if (reason instanceof o...
... issym
link true if the false is a symbolic
link, false otherwise.
... (as of firefox 38 this is always true on all systems, this is a bug: bugzilla 1145885) (on windows this returns false for hard
links) size the number of bytes in the file.
...is any write/set of inode information (such as owner, group,
link count, mode, etc).
OS.File for the main thread
string path, [optional] in object options); promise<void> setcurrentdirectory(in string path); promise<void> setdates(in string path, in date|number accessdate, in date|number modificationdate); promise<void> setpermissions(in string path, in object options ); promise<file.info> stat(in string path, [optional] in object options); promise<void> unixsym
link(in string targetpath, in string createpath); promise<void> writeatomic(in string path, in arrayview data, in object options); methods os.file.open() use method os.file.open() to open a file.
... os.file.unixsym
link() create a symoblic
link file, also known as "alias" files on mac os.
... promise<undefined> unixsym
link( in string pathtarget, in string pathcreate ) arguments pathtarget the complete path to the file that should be launced by the symbolic
link.
...the file extension should be .
link.
Translation phase
below you'll find the list of all mozilla projects, their associated l10n tools, and
links to tutorials outlining their workflows.
...we've
linked a brief tutorial to each l10n tool name below.
...we've
linked a brief tutorial to each l10n tool name below.
...this is where you research and select the search plugins, content and protocol handlers, bookmarks, and
links to recommended sites on the in-product pages that your locale's users will find in their mozilla products.
Cryptography functions
if documentation is available for a function listed below, the function name is
linked to either its mdc wiki page or its entry in the old ssl reference.
... the mozilla cross reference (mxr)
link for each function provides access to the function definition, prototype definition, and source code references.
...d later pk11_isinternal mxr 3.2 and later pk11_ispresent mxr 3.2 and later pk11_isreadonly mxr 3.2 and later pk11_isremovable mxr 3.12 and later pk11_ivfromparam mxr 3.2 and later pk11_keygen mxr 3.2 and later pk11_
linkgenericobject mxr 3.9.2 and later pk11_listcerts mxr 3.2 and later.
...ter pk11_tokenkeygenwithflags mxr 3.10.2 and later pk11_tokenrefresh mxr 3.7.1 and later pk11_traversecertsfornicknameinslot mxr 3.2 and later pk11_traversecertsforsubjectinslot mxr 3.2 and later pk11_traverseslotcerts mxr 3.4 and later pk11_un
linkgenericobject mxr 3.9.2 and later pk11_unwrapsymkey mxr 3.2 and later pk11_unwrapsymkeywithflags mxr 3.2 and later pk11_unwrapsymkeywithflagsperm mxr 3.9 and later pk11_updateslotattribute mxr 3.8 and later pk11_userenableslot mxr 3.8 and later ...
Introduction to Network Security Services
the following shared libraries are standalone loadable modules, not meant to be
linked with directly: libfort.so/libfort.sl/fort32.dll provides support for hardware fortezza.
... platform for 32-bit cpus for 64-bit cpus solaris/sparc libfreebl_pure32_3.so libfreebl_hybrid_3.so hpux/parisc libfreebl_pure32_3.sl libfreebl_hybrid_3.sl aix (planned for a future release) libfreebl_pure32_3_shr.a libfreebl_hybrid_3_shr.a an application should not
link against these libraries, because they are dynamically loaded by nss at run time.
...
linking the application against one or the other of these libraries may produce an application program that can only run on one type of cpu (e.g.
...ncepts and techniques of public-key cryptography the secure sockets layer (ssl) protocol the pkcs #11 standard for cryptographic token interfaces cross-platform development issues and techniques where to find more information for information about pki and ssl that you should understand before using nss, see the following: introduction to public-key cryptography introduction to ssl for
links to api documentation, build instructions, and other useful information, see the nss project page.
NSS_3.12_release_notes.html
bug 429388: vfychain.main leaks memory bug 396044: warning: usage of uninitialized variable in ckfw/object.c(174) bug 396045: warning: usage of uninitialized variable in ckfw/mechanism.c(719) bug 401986: mac os x leopard build failure in legacydb bug 325805: diff considers mozilla/security/nss/cmd/pk11util/scripts/pkey a binary file bug 385151: remove the
link time dependency from nss to softoken bug 387892: add entrust root ca certificate(s) to nss bug 433386: when system clock is off by more than two days, oscp check fails, can result in crash if user tries to view certificate [[@ secitem_compareitem_util] [[@ memcmp] bug 396256: certutil and pp do not print all the generalnames in a crldp extension bug 398019: correct confusing and erroneous comment...
...bug 287061: crl number should be a big integer, not ulong bug 301213: combine internal libpkix function tests into a single statically
linked program bug 324740: add generation of sia and aia extensions to certutil bug 339737: libpkix ocsp checking calls cert_verifycert bug 358785: merge nss_libpkix_branch back to trunk bug 365966: infinite recursive call in vfy_verifydigestdirect bug 382078: pkix default http client returns error when try to get an ocsp response.
...bug 395093: pkix_pl_httpcertstore_processcertresponse is unable to process certs in der format bug 395224: don't reject certs with critical netscapecerttype extensions in libpkix bug 395427: pkix_pl_initialize must not call nss_init bug 395850: build of libpkix tests creates
links to nonexistant shared libraries and breaks windows build bug 398401: memory leak in pkix init.
...a program
linked with older nss 3.x shared libraries will work with nss 3.12 shared libraries without recompiling or re
linking.
Feed content access API
items) { 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><p>"; } doc.write("<blockquote>" + info); doc.write("</blockquote><p>"); } } ...
...we build the contents of the document by looking at the title,
link, summary, and content properties for each item.
... the full url of the
link is retrieved using the
link's resolve() method.
...this opens a new window containing the feed contents, with each item's title a clickable
link that takes you to the article itself.
XPCOM Glue without mozalloc
starting with xulrunner 2.0, the frozen
linkage dependent glue (xpcomglue_s.lib on windows, libxpcomglue_s.a on linux and mac) is dependent on the new infallible memory allocation routines (mozalloc).
... since these routines didn't exist prior to xulrunner 2.0, xpcom components that
link against the frozen
linkage dependent glue will not be compatible with xulrunner applications prior to 2.0.
... the solution is to
link against xpcomglue_s_nomozalloc instead (xpcomglue_s_nomozalloc.lib on windows, libxpcomglue_s_nomozalloc.a on linux and mac).
... simply change all references to "xpcomglue_s" in your compiler and
linker flags to "xpcomglue_s_nomozalloc".
nsIDragService
dragdrop_action_
link 4 the drag and drop operation should
link the object.
... aactiontype specified which of copy/move/
link are allowed.
... aactiontype specified which of copy/move/
link are allowed.
... aactiontype specified which of copy/move/
link are allowed adragevent the drag gesture event that initiated the drag.
nsISelectionController
void wordmove(in boolean forward, in boolean extend); attributes attribute type description caretvisible boolean this is true if the caret is enabled, visible, and currently b
linking.
... this is still true when the caret is enabled, visible, but in its "off" b
link cycle.
...an enabled caret will draw or b
link when made visible.
...an readonly caret will draw but not b
link when made visible.
XPCOM Interface Reference
component; nsiprefbranchextensionmanager (toolkit)iaccessible2iaccessibleactioniaccessibleapplicationiaccessiblecomponentiaccessibleeditabletextiaccessiblehyper
linkiaccessiblehypertextiaccessibleimageiaccessiblerelationiaccessibletableiaccessibletable2iaccessibletablecelliaccessibletextiaccessiblevalueidispatchijsdebuggeramiinstallcallbackamiinstalltriggeramiwebinstallinfoamiwebinstalllisteneramiwebinstallpromptamiwebinstallerimgicacheimgicontainerimgicontainerobserverimgidecoderimgidecoderobserverimgiencoderimgiloaderimgirequestinidomutilsjsdistackframemoziasyncfaviconsmoziasynchistorymozicoloranalyzermozijssubscriptloadermozipersonaldictionarymoziplaceinfomoziplacesautocompletemoziregistrymozirepresentativ...
...ementwrappermozistoragevacuumparticipantmozistoragevaluearraymozitxttohtmlconvmozithirdpartyutilmozivisitinfomozivisitinfocallbackmozivisitstatuscallbacknsiabcardnsiaboutmodulensiabstractworkernsiaccelerometerupdatensiaccessnodensiaccessibilityservicensiaccessiblensiaccessiblecaretmoveeventnsiaccessiblecoordinatetypensiaccessibledocumentnsiaccessibleeditabletextnsiaccessibleeventnsiaccessiblehyper
linknsiaccessiblehypertextnsiaccessibleimagensiaccessibleprovidernsiaccessiblerelationnsiaccessibleretrievalnsiaccessiblerolensiaccessiblescrolltypensiaccessibleselectablensiaccessiblestatechangeeventnsiaccessiblestatesnsiaccessibletablensiaccessibletablecellnsiaccessibletablechangeeventnsiaccessibletextnsiaccessibletextchangeeventnsiaccessibletreecachensiaccessiblevaluensiaccessiblewin32objectnsialer...
...indexlistenernsidirindexparsernsidirectoryenumeratornsidirectoryiteratornsidirectoryservicensidirectoryserviceprovidernsidirectoryserviceprovider2nsidiskcachestreaminternalnsidispatchsupportnsidocshellnsidocumentloadernsidownloadnsidownloadhistorynsidownloadmanagernsidownloadmanageruinsidownloadobservernsidownloadprogresslistenernsidownloadernsidragdrophandlernsidragservicensidragsessionnsidropped
linkhandlernsidropped
linkitemnsidynamiccontainernsieditornsieditorboxobjectnsieditordocshellnsieditorimesupportnsieditorloggingnsieditormailsupportnsieditorobservernsieditorspellchecknsieffectivetldservicensienumeratornsienvironmentnsierrorservicensieventlistenerinfonsieventlistenerservicensieventsourcensieventtargetnsiexceptionnsiextensionmanagernsiexternalhelperappservicensiexternalprotocolservicens...
...ervicensinavhistorybatchcallbacknsinavhistorycontainerresultnodensinavhistoryfullvisitresultnodensinavhistoryobservernsinavhistoryquerynsinavhistoryqueryoptionsnsinavhistoryqueryresultnodensinavhistoryresultnsinavhistoryresultnodensinavhistoryresultobservernsinavhistoryresulttreeviewernsinavhistoryresultviewobservernsinavhistoryresultviewernsinavhistoryservicensinavhistoryvisitresultnodensinetwork
linkservicensiobservernsiobserverservicensioutputstreamnsioutputstreamcallbacknsiparentalcontrolsservicensiparserutilsnsipasswordnsipasswordmanagernsipermissionnsipermissionmanagernsipipensiplacesimportexportservicensiplacesviewnsipluginhostnsiprefbranch2nsipreflocalizedstringnsiprefservicensiprincipalnsiprinterenumeratornsiprintingpromptnsiprivatebrowsingservicensiprocessnsiprocess2nsiprocessscriptlo...
nsIMsgCloudFileProvider
nsimsgcloudfileprovider is the interface that must be implemented by new file
link providers.
... serviceurl acstring readonly: a
link to the homepage of the service, if applicable.
... managementurl acstring readonly: a chrome url for an xhtml page displayed within the file
link preferences dialog, used for displaying and setting provider-specific settings once the account has already been set up.
... note: this function is not directly called by the file
link ui.
Index
25 file
link providers thunderbird file
link is a thunderbird feature that makes it easy for users to upload large attachments to web-based storage services such as hightail.
... 26 nsimsgcloudfileprovider nsimsgcloudfileprovider is the interface that must be implemented by new file
link providers.
...please feel free to add
links to threads.
... we will add a categorization system as the
link list grows.
Thunderbird extensions
these
links to help through this journey.
...all these concepts are related : a conversation contains messages which are
linked to identities (from field, to field) which are themselves part of a contact: indeed, a contact has multiple identities.
...learn more about gloda: an overview of gloda how to create your first message query and read the gloda examples gloda internals: gloda debugging, gloda indexing more thunderbird-specific
links some
links may be out of date, but they still provide valuable information on the codebase.
...m/protz/thunderbird-stdlib) developing new account types useful newsgroup discussions (anything that's very old should be regarded suspiciously, because there has been significant api rewrite over the past years making most techniques considerably easier) thunderbird api docs (mostly a collection of out-of-date pages, relevance is rather dubious) general
links finding the code for a feature mozillazine articles on thunderbird community / communications thunderbird specific : add-ons section on developer.thunderbird.net thunderbird communication channels add-on developers forum/mailing list #maildev irc channel more general : mozillazine extension development forum ...
Plug-in Basics - Plugins
with the plug-in api, you can create dynamically loaded plug-ins that can: register one or more mime types draw into a part of a browser window receive keyboard and mouse events obtain data from the network using urls post data to urls add hyper
links or hotspots that
link to new urls draw into sections on an html page communicate with javascript/dom from native code you can see which plug-ins are installed on your system and have been properly associated with the browser by consulting the installed plug-ins page.
... about distributions: example debian 64bit probably use: /lib/x86_64-linux-gnu/ --> for 64 libs /lib/i386-linux-gnu/ --> for 32 libs if exist /lib32/ --> this is sym
linked (or bind mounted) desired proper directory /lib64/ --> this is sym
linked (or bind mounted) desired proper directory more in https://wiki.debian.org/multiarch/thecaseformultiarch if something wrong, please edit.
... var plugin = mimetype.enabledplugin; if (plugin) { // yes, so show the data in-line document.writeln("here\'s a movie: <object data='mymovie.swf' height='100' width='100'></object>"); } else { // no, so provide a
link to the data document.writeln("<a href='mymovie.swf'>click here</a> to see a movie."); } } else { // no, so tell them so document.writeln("sorry, can't show you this movie."); } overview of plug-in structure this section is an overview of basic information you will need as you develop plug-ins.
... the plug-in file type depends on the platform: ms windows: .dll (dynamic
link library) files unix: .so or .dso (shared objects) files mac os x: ppc/x86/universal loadable mach-o bundle windowed and windowless plug-ins you can write plug-ins that are drawn in their own native windows or frames on a web page.
Introduction to DOM Inspector - Firefox Developer Tools
(note: this is now a dead
link.) when you first start the dom inspector, you are presented with a two-pane application window that looks a little like the main mozilla browser.
...by clicking around in the document pane, you'll see that the viewers are
linked; whenever you select a new node from the dom nodes viewer, the dom node viewer is automatically updated to reflect the information for that node.
...
linked viewers are the first major aspect to understand when learning how to use the dom inspector.
...the flasher from dom inspector apis from working correctly on certain platforms.) if you inspect the main browser window, for example, and select nodes in the dom nodes viewer (other than the elements which have no visible ui as is the case with the endless list of script elements that are loaded into browser.xul), you will see the various parts of the browser interface being highlighted with a b
linking red border.
Element.computedStyleMap() - Web APIs
examples we start with some simple html: a paragraph with a
link, and a definition list to which we will add all the css property / value pairs.
... <p> <a href="https://example.com">
link</a> </p> <dl id="regurgitation"></dl> we add a little bit of css a { --colour: red; color: var(--colour); } we add javascript to grab our
link and return back a definition list of all the css property values using computedstylemap().
...in other browsers you'll just see a
link.
... did you realize how many default css properties a
link had?
HTMLAudioElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlmediaelement" target="_top"><r...
..." width="160" height="50" fill="#fff" 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><polyline points="331,89 321,84 321,94 331,89" stroke="#d4dde4" fill="none"/><line x1="321" y1="89" x2="291" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/htmlaudioelement" target="_top"><rect x="131" y="65" width="160" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="211" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlaudioelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;...
HTMLIFrameElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmliframeelement" target="_top"><...
... htmliframeelement.referrerpolicy is a domstring that reflects the referrerpolicy html attribute indicating which referrer to use when fetching the
linked resource.
HTMLVideoElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlmediaelement" target="_top"><r...
..." width="160" height="50" fill="#fff" 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><polyline points="331,89 321,84 321,94 331,89" stroke="#d4dde4" fill="none"/><line x1="321" y1="89" x2="291" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/htmlvideoelement" target="_top"><rect x="131" y="65" width="160" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="211" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlvideoelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;...
Ajax navigation example - Web APIs
-nav" href="first_page.php">first example</a> | <a class="ajax-nav" href="second_page.php">second example</a> | <a class="ajax-nav" href="third_page.php">third example</a> | <a class="ajax-nav" href="unexisting.php">unexisting page</a> ] </p> include/header.php: <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="js/ajax_nav.js"></script> <
link rel="stylesheet" href="css/style.css" /> js/ajax_nav.js: "use strict"; const ajaxrequest = new (function () { function closereq () { oloadingbox.parentnode && document.body.removechild(oloadingbox); bisloading = false; } function abortreq () { if (!bisloading) { return; } oreq.abort(); closereq(); } function ajaxerror () { ...
...l(opageinfo.url, "json"), true); oreq.send(); oloadingbox.parentnode || document.body.appendchild(oloadingbox); } function requestpage (surl) { if (history.pushstate) { bupdateurl = true; getpage(surl); } else { /* ajax navigation is not supported */ location.assign(surl); } } function process
link () { if (this.classname === sajaxclass) { requestpage(this.href); return false; } return true; } function init () { opageinfo.title = document.title; history.replacestate(opageinfo, opageinfo.title, opageinfo.url); for (var o
link, nidx = 0, nlen = document.
links.length; nidx < nlen; document.
links[nidx++].onclick = p...
...rocess
link); } 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: "created", 202: "accepted"...
...attachevent("onload", init) : (onload = init); // public methods this.open = requestpage; this.stop = abortreq; this.rebuild
links = init; })(); for more information, please see: working with the history api.
Using IndexedDB - Web APIs
b
link/webkit supports the current version of the spec, as shipped in chrome 23+ and opera 17+; ie10+ does too.
...for more information on how to upgrade the version of the database in older webkit/b
link, see the idbdatabase reference article.
... '[' + cursor.key + '] ' + '(biblioid: ' + value.biblioid + ') ' + value.title + '</li>'); if (value.year != null) list_item.append(' - ' + value.year); if (value.hasownproperty('blob') && typeof value.blob != 'undefined') { var
link = $('<a href="' + cursor.key + '">file</a>');
link.on('click', function() { return false; });
link.on('mouseenter', function(evt) { setinviewer(evt.target.getattribute('href')); }); list_item.append(' / '); list_item.append(
link); } else { list_item.append(" / no attached file"); } pub_...
... setinviewer(key) { console.log("setinviewer:", arguments); key = number(key); if (key == current_view_pub_key) return; current_view_pub_key = key; var store = getobjectstore(db_store_name, 'readonly'); getblob(key, store, function(blob) { console.log("setinviewer blob:", blob); var iframe = newviewerframe(); // it is not possible to set a direct
link to the // blob to provide a mean to directly download it.
SVGAnimateElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25...
..." x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svganimationelement" target="_top"><rect x="291" y="6...
...idth="190" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="386" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svganimationelement</text></a><polyline points="291,89 281,84 281,94 291,89" stroke="#d4dde4" fill="none"/><line x1="281" y1="89" x2="251" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svganimateelement" target="_top"><rect x="81" y="65" width="170" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="166" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svganimateelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all...
SVGAnimateMotionElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1=...
..."121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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">e...
...lement</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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svganimationelement" target="_top"><rect ...
...idth="190" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="386" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svganimationelement</text></a><polyline points="291,89 281,84 281,94 291,89" stroke="#d4dde4" fill="none"/><line x1="281" y1="89" x2="251" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svganimatemotionelement" target="_top"><rect x="21" y="65" width="230" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="136" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svganimatemotionelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer...
SVGAnimateTransformElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svganimationelement" target="_top"><...
...idth="190" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="386" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svganimationelement</text></a><polyline points="291,89 281,84 281,94 291,89" stroke="#d4dde4" fill="none"/><line x1="281" y1="89" x2="251" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svganimatetransformelement" target="_top"><rect x="-9" y="65" width="260" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="121" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svganimatetransformelement</text></a></svg></div> a:hover text { fill: #0095dd; p...
SVGDefsElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25" x2="...
...151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" widt...
...h="180" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="391" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggraphicselement</text></a><polyline points="301,89 291,84 291,94 301,89" stroke="#d4dde4" fill="none"/><line x1="291" y1="89" x2="261" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgdefselement" target="_top"><rect x="121" y="65" width="140" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="191" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgdefselement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} ...
SVGFEFuncAElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25...
..." x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgcomponenttransferfunctionelement" target="_top"><r...
...ht="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="306" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgcomponenttransferfunctionelement</text></a><polyline points="131,89 121,84 121,94 131,89" stroke="#d4dde4" fill="none"/><line x1="121" y1="89" x2="91" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfefuncaelement" target="_top"><rect x="-79" y="65" width="170" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="6" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfefuncaelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;...
SVGFEFuncBElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25...
..." x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgcomponenttransferfunctionelement" target="_top"><r...
...ht="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="306" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgcomponenttransferfunctionelement</text></a><polyline points="131,89 121,84 121,94 131,89" stroke="#d4dde4" fill="none"/><line x1="121" y1="89" x2="91" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfefuncbelement" target="_top"><rect x="-79" y="65" width="170" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="6" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfefuncbelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;...
SVGFEFuncGElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25...
..." x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgcomponenttransferfunctionelement" target="_top"><r...
...ht="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="306" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgcomponenttransferfunctionelement</text></a><polyline points="131,89 121,84 121,94 131,89" stroke="#d4dde4" fill="none"/><line x1="121" y1="89" x2="91" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfefuncgelement" target="_top"><rect x="-79" y="65" width="170" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="6" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfefuncgelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;...
SVGFEFuncRElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25...
..." x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgcomponenttransferfunctionelement" target="_top"><r...
...ht="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="306" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgcomponenttransferfunctionelement</text></a><polyline points="131,89 121,84 121,94 131,89" stroke="#d4dde4" fill="none"/><line x1="121" y1="89" x2="91" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfefuncrelement" target="_top"><rect x="-79" y="65" width="170" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="6" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfefuncrelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;...
SVGForeignObjectElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><r...
...width="180" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="391" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggraphicselement</text></a><polyline points="301,89 291,84 291,94 301,89" stroke="#d4dde4" fill="none"/><line x1="291" y1="89" x2="261" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgforeignobjectelement" target="_top"><rect x="31" y="65" width="230" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="146" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgforeignobjectelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer...
SVGGElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25" x2="151" y...
...2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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><polyli...
...ne 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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="180...
..." height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="391" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggraphicselement</text></a><polyline points="301,89 291,84 291,94 301,89" stroke="#d4dde4" fill="none"/><line x1="291" y1="89" x2="261" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggelement" target="_top"><rect x="151" y="65" width="110" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="206" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties ...
SVGGeometryElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><r...
...width="180" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="391" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggraphicselement</text></a><polyline points="301,89 291,84 291,94 301,89" stroke="#d4dde4" fill="none"/><line x1="291" y1="89" x2="261" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggeometryelement" target="_top"><rect x="81" y="65" width="180" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="171" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggeometryelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: a...
SVGImageElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25" x2...
...="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" wi...
...dth="180" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="391" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggraphicselement</text></a><polyline points="301,89 291,84 291,94 301,89" stroke="#d4dde4" fill="none"/><line x1="291" y1="89" x2="261" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgimageelement" target="_top"><rect x="111" y="65" width="150" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="186" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgimageelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} ...
SVGLinearGradientElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x...
...1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggradientelement" target="_top"><rect...
...width="180" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="391" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggradientelement</text></a><polyline points="301,89 291,84 291,94 301,89" stroke="#d4dde4" fill="none"/><line x1="291" y1="89" x2="261" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svglineargradientelement" target="_top"><rect x="21" y="65" width="240" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="141" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svglineargradientelement</text></a></svg></div> a:hover text { fill: #0095dd; point...
SVGRadialGradientElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x...
...1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggradientelement" target="_top"><rect...
...width="180" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="391" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggradientelement</text></a><polyline points="301,89 291,84 291,94 301,89" stroke="#d4dde4" fill="none"/><line x1="291" y1="89" x2="261" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgradialgradientelement" target="_top"><rect x="21" y="65" width="240" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="141" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgradialgradientelement</text></a></svg></div> a:hover text { fill: #0095dd; point...
SVGSetElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25" x2="15...
...1" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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><po...
...lyline 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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svganimationelement" target="_top"><rect x="291" y="65" width...
...="190" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="386" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svganimationelement</text></a><polyline points="291,89 281,84 281,94 291,89" stroke="#d4dde4" fill="none"/><line x1="281" y1="89" x2="251" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgsetelement" target="_top"><rect x="121" y="65" width="130" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="186" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgsetelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} pr...
SVGSwitchElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25" ...
...x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" ...
...width="180" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="391" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggraphicselement</text></a><polyline points="301,89 291,84 291,94 301,89" stroke="#d4dde4" fill="none"/><line x1="291" y1="89" x2="261" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgswitchelement" target="_top"><rect x="101" y="65" width="160" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="181" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgswitchelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;...
SVGTextContentElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><r...
...width="180" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="391" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggraphicselement</text></a><polyline points="301,89 291,84 291,94 301,89" stroke="#d4dde4" fill="none"/><line x1="291" y1="89" x2="261" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgtextcontentelement" target="_top"><rect x="51" y="65" width="210" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="156" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgtextcontentelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-eve...
SVGUseElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line ...
...x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><rec...
...width="180" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="391" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggraphicselement</text></a><polyline points="301,89 291,84 291,94 301,89" stroke="#d4dde4" fill="none"/><line x1="291" y1="89" x2="261" y2="89" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svguseelement" target="_top"><rect x="131" y="65" width="130" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="196" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svguseelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} ...
WebGLProgram - Web APIs
after attaching the shader programs using attachshader(), you
link them into a usable program.
... var program = gl.createprogram(); // attach pre-existing shaders gl.attachshader(program, vertexshader); gl.attachshader(program, fragmentshader); gl.
linkprogram(program); if ( !gl.getprogramparameter( program, gl.
link_status) ) { var info = gl.getprograminfolog(program); throw 'could not compile webgl program.
... // use the program gl.useprogram(program); // bind existing attribute data gl.bindbuffer(gl.array_buffer, buffer); gl.enablevertexattribarray(attributelocation); gl.vertexattribpointer(attributelocation, 3, gl.float, false, 0, 0); // draw a single triangle gl.drawarrays(gl.triangles, 0, 3); deleting the program if there is an error
linking the program or you wish to delete an existing program, then it is as simple as running webglrenderingcontext.deleteprogram().
... this frees the memory of the
linked program.
Adding 2D content to a WebGL context - Web APIs
const fssource = ` void main() { gl_fragcolor = vec4(1.0, 1.0, 1.0, 1.0); } `; initializing the shaders now that we've defined the two shaders we need to pass them to webgl, compile them, and
link them together.
...it then creates a program, attaches the shaders and
links them together.
... if compiling or
linking fails the code displays an alert.
...nows how to draw our data // function initshaderprogram(gl, vssource, fssource) { const vertexshader = loadshader(gl, gl.vertex_shader, vssource); const fragmentshader = loadshader(gl, gl.fragment_shader, fssource); // create the shader program const shaderprogram = gl.createprogram(); gl.attachshader(shaderprogram, vertexshader); gl.attachshader(shaderprogram, fragmentshader); gl.
linkprogram(shaderprogram); // if creating the shader program failed, alert if (!gl.getprogramparameter(shaderprogram, gl.
link_status)) { alert('unable to initialize the shader program: ' + gl.getprograminfolog(shaderprogram)); return null; } return shaderprogram; } // // creates a shader of the given type, uploads the source and // compiles it.
A simple RTCDataChannel sample - Web APIs
in this example, we will open an rtcdatachannel connection
linking two elements on the same page.
...we'll cover the mechanics of accomplishing the connection and transmitting and receiving data, but we will save the bits about locating and
linking to a remote computer for another example.
... handling successful peer connection as each side of the peer-to-peer connection is successfully
linked up, the corresponding rtcpeerconnection's icecandidate event is fired.
...button.disabled = false; disconnectbutton.disabled = false; connectbutton.disabled = true; } else { messageinputbox.disabled = true; sendbutton.disabled = true; connectbutton.disabled = false; disconnectbutton.disabled = true; } } } if the channel's state has changed to "open", that indicates that we have finished establishing the
link between the two peers.
ARIA: button role - Accessibility
warning: be careful when marking up
links with the button role.
... buttons are expected to be triggered using the space or enter key, while
links are expected to be triggered using the enter key.
... in other words, when
links are used to behave like buttons, adding role="button" alone is not sufficient.
... best practices if a
link performs the action of a button, giving the element role="button" helps assistive technology users understand the function of the element.
WAI-ARIA Roles - Accessibility
if possible, use the html <aside> element instead.aria: contentinfo rolethe 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.
...if possible, you should use this element instead.aria: navigation rolethe navigation landmark role is used to identify major groups of
links used for navigating through a website or page content.aria: region rolethe region landmark role is used to identify an area in the document that the author has identified as significant.
... please claim the role you want to work on by adding your name after the role's name: (old pages are
linked from https://developer.mozilla.org/docs/web/accessibility/aria/aria_techniques).
... alertdialog banner combobox command columnheader (estelle) complementary composite definition directory feed gridcell (eric e) group input landmark
link - old page listbox log - old page marquee math menu menubar menuitem menuitemcheckbox menuitemradio none note option presentation progressbar - old page radio - old page radiogroup range region roletype rowheader(estelle) scrollbar searchbox section sectionhead select separator slider - old page spinbutton status - old page structure tab tablist (michiel) tabpanel (michiel) term timer toolbar tooltip tree treegrid treeitem widget window ...
Understandable - Accessibility
your site should provide a glossary that contains definitions of such words/terms that you can then
link to when they appear, or at the very least provide definitions somewhere in the surrounding text, or in a description list at the bottom of the page.
...a better way to handle this is to again provide
links to glossary pages containing the acronym expansion and explanation, or at the very least include them in the surrounding text in context.
...see also styling
links as buttons for a useful accessible navigation menu example.
...providing a dedicated
link to a help page or service on each page, providing examples showing what successful completion should look like.
:active - CSS: Cascading Style Sheets
styles defined by the :active pseudo-class will be overridden by any subsequent
link-related pseudo-class (:
link, :hover, or :visited) that has at least equal specificity.
... to style
links appropriately, put the :active rule after all other
link-related rules, as defined by the lvha-order: :
link — :visited — :hover — :active.
... syntax :active examples active
links html <p>this paragraph contains a
link: <a href="#">this
link will turn red while you click on it.</a> the paragraph will get a gray background while you click on it or the
link.
... </p> css a:
link { color: blue; } /* unvisited
links */ a:visited { color: purple; } /* visited
links */ a:hover { background: yellow; } /* hovered
links */ a:active { color: red; } /* active
links */ p:active { background: #eee; } /* active paragraphs */ result active form elements html <form> <label for="my-button">my button: </label> <button id="my-button" type="button">try clicking me or my label!</button> </form> css form :active { color: red; } form button { background: white; } result specifications specification status comment html living standardthe definition of ':active' in that specification.
:target - CSS: Cascading Style Sheets
ment (denoted by the # sign) that points to an element called section2: http://www.example.com/index.html#section2 the following element would be selected by a :target selector when the current url is equal to the above: <section id="section2">example</section> syntax :target examples a table of contents the :target pseudo-class can be used to highlight the portion of a page that has been
linked to from a table of contents.
... html <h3>table of contents</h3> <ol> <li><a href="#p1">jump to the first paragraph!</a></li> <li><a href="#p2">jump to the second paragraph!</a></li> <li><a href="#nowhere">this
link goes nowhere, because the target doesn't exist.</a></li> </ol> <h3>my fun article</h3> <p id="p1">you can target <i>this paragraph</i> using a url fragment.
... click on the
link above to try out!</p> <p id="p2">this is <i>another paragraph</i>, also accessible from the
links above.
...this technique relies on the ability of anchor
links to point to elements that are initially hidden on the page.
CSS Grid Layout and Accessibility - CSS: Cascading Style Sheets
likewise, rearranging grid items visually does not affect the default traversal order of sequential navigation modes (such as cycling through
links, see e.g.
...this means that someone navigating using the keyboard could be tabbing through
links on your site and suddenly find themselves jumping from the top to the bottom of the document due to a reordered item being next in line.
... in this example i have used grid to lay out a set of boxes that contain
links.
...however, if i tab from
link to
link the tab order still begins with box 1, as it comes first in the source.
Shorthand properties - CSS: Cascading Style Sheets
we can look at a list of
links and explore how the universal values work.
...if you remove the rule how does it change the color of the
link?
... do you understand why the third and fourth
links are the color that they are?
... which of the
links will change color if you define a new color for the <a> element — for example a { color: red; }?
text-decoration-line - CSS: Cascading Style Sheets
syntax /* single keyword */ text-decoration-line: none; text-decoration-line: underline; text-decoration-line: overline; text-decoration-line: line-through; text-decoration-line: b
link; /* multiple keywords */ text-decoration-line: underline overline; /* two decoration lines */ text-decoration-line: overline underline line-through; /* multiple decoration lines */ /* global values */ text-decoration-line: inherit; text-decoration-line: initial; text-decoration-line: unset; the text-decoration-line property is specified as none, or one or more space-separated v...
... b
link the text b
links (alternates between visible and invisible).
... conforming user agents may simply not b
link the text.
...it also applies to ::first-letter and ::first-line.inheritednocomputed valueas specifiedanimation typediscrete formal syntax none | [ underline | overline | line-through | b
link ] | spelling-error | grammar-error examples <p class="wavy">here's some text with wavy red underline!</p> <p class="both">this text has lines both above and below it.</p> .wavy { text-decoration-line: underline; text-decoration-style: wavy; text-decoration-color: red; } .both { text-decoration-line: underline overline; } specifications specification status comment css text decoration module level 3the definition of 'text-decoration-line' in that specification.
Content categories - Developer guides
main content categories metadata content elements belonging to the metadata content category modify the presentation or the behavior of the rest of the document, set up
links to other documents, or convey other out of band information.
... elements belonging to this category are <base>, <command>, <
link>, <meta>, <noscript>, <script>, <style> and <title>.
... a few other elements belong to this category, but only if a specific condition is fulfilled: <area>, if it is a descendant of a <map> element <
link>, if the itemprop attribute is present <meta>, if the itemprop attribute is present <style>, if the scoped attribute is present sectioning content elements belonging to the sectioning content model create a section in the current outline that defines the scope of <header> elements, <footer> elements, and heading content.
... a few other elements belong to this category, but only if a specific condition is fulfilled: <a>, if it contains only phrasing content <area>, if it is a descendant of a <map> element <del>, if it contains only phrasing content <ins>, if it contains only phrasing content <
link>, if the itemprop attribute is present <map>, if it contains only phrasing content <meta>, if the itemprop attribute is present embedded content embedded content imports another resource or inserts content from another mark-up language or namespace into the document.
<nav>: The Navigation Section element - HTML: Hypertext Markup Language
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.
... usage notes it's not necessary for all
links to be contained in a <nav> element.
... <nav> is intended only for major block of navigation
links; typically the <footer> element often has a list of
links that don't need to be in a <nav> element.
... examples in this example, a <nav> block is used to contain an unordered list (<ul>) of
links.
itemprop - HTML: Hypertext Markup Language
property values are either a string or a url and can be associated with a very wide range of elements including <audio>, <embed>, <iframe>, <img>, <
link>, <object>, <source> , <track>, and <video>.
...when a string value is a url, it is expressed using the <a> element and its href attribute, the <img> element and its src attribute, or other elements that
link to or embed external resources.
...value is the value of the element's content attribute if the element is an audio, embed, iframe, img, source, track, or video element the value is the resulting url string that results from parsing the value of the element's src attribute relative to the node document (part of the microdata dom api) of the element at the time the attribute is set if the element is an a, area, or
link element the value is the resulting url string that results from parsing the value of the element's href attribute relative to the node document of the element at the time the attribute is set if the element is an object element the value is the resulting url string that results from parsing the value of the element's data attribute relative to the node document of the element at...
...the url property elements are the a, area, audio, embed, iframe, img,
link, object, source, track, and video elements.
x-ms-format-detection - HTML: Hypertext Markup Language
the x-ms-format-detection attribute determines whether data formats within the element’s text, like phone numbers, are automatically converted to followable
links.
... existing
links, such as ones with the tel: scheme, are unaffected.
...
links created through format detection do not appear in the dom.
... phone phone number patterns are auto
linked.
Choosing between www and non-www URLs - HTTP
this includes always
linking to the chosen domain (which shouldn't be hard if you're using relative urls in your website) and always sharing
links (by email/social networks, etc.) to the same domain.
...all your absolute
links should use it.
... using <
link rel="canonical"> it is possible to add a special html <
link> element to a page to indicate what the canonical address of a page is.
...in the previous example, http://www.example.org/whaddup would serve the same content as http://example.org/whaddup, but with an additional <
link> element in the head: <
link href="http://example.org/whaddup" rel="canonical"> unlike the previous case, browser history will consider non-www and www urls as independent entries.
Index - HTTP
43 csp: referrer csp, directive, http, reference, security the http content-security-policy (csp) referrer directive used to specify information in the referer header (with a single r as this was a typo in the original spec) for
links away from a page.
... 94 referer http, reference, header, referer, referrer the referer request header contains the address of the previous web page from which a
link to the currently requested page was followed.
... 102 sourcemap http, http header, reference, response header, header the sourcemap http response header
links generated code to a source map, enabling the browser to reconstruct the original source and present the reconstructed original in the debugger.
... 117 x-dns-prefetch-control dns, http, header the x-dns-prefetch-control http response header controls dns prefetching, a feature by which browsers proactively perform domain name resolution on both
links that the user may choose to follow as well as urls for items referenced by the document, including images, css, javascript, and so forth.
Inheritance and the prototype chain - JavaScript
each object has a private property which holds a
link to another object called its prototype.
...by definition, null has no prototype, and acts as the final
link in this prototype chain.
...javascript objects have a
link to a prototype object.
... code
link setting a property to an object creates an own property.
WebAssembly.instantiate() - JavaScript
there must be one matching property for each declared import of the compiled module or else a webassembly.
linkerror is thrown.
... if the operation fails, the promise rejects with a webassembly.compileerror, webassembly.
linkerror, or webassembly.runtimeerror, depending on the cause of the failure.
...there must be one matching property for each declared import of module or else a webassembly.
linkerror is thrown.
... if the operation fails, the promise rejects with a webassembly.compileerror, webassembly.
linkerror, or webassembly.runtimeerror, depending on the cause of the failure.
WebAssembly - JavaScript
providing facilities to handle errors that occur in webassembly via the webassembly.compileerror()/webassembly.
linkerror()/webassembly.runtimeerror() constructors.
...this allows dynamic
linking of multiple modules.
... webassembly.instance() is a stateful, executable instance of a webassembly.module webassembly.
linkerror() indicates an error during module instantiation (besides traps from the start function).
... 52notes notes disabled in the firefox 52 extended support release (esr).opera android full support 43safari ios full support 11samsung internet android full support 7.0nodejs full support 8.0.0
linkerrorchrome full support 57edge full support 16firefox full support 52notes full support 52notes notes disabled in the firefox 52 extended support release (esr).ie no support ...
MathML attribute reference - MathML
the attributes background, color, fontfamily, fontsize, fontstyle, fontweight and x
link:href are deprecated.
... the x
link attributes on mathml elements: x
link:actuate, x
link:href, x
link:show and x
link:type are deprecated as well.
... href all used to set a hyper
link to a specified uri.
... x
link:href all can be used to set a hyper
link to a specfied uri.
Lazy loading - Web Performance
a practical example would be when, you land on the home page of an e-commerce site which has a
link to a cart page/section and all its resources (js, css, images...) are downloaded only when the user navigates to that cart page.
... <
link href="style.css" rel="stylesheet" media="all"> <
link href="portrait.css" rel="stylesheet" media="orientation:portrait"> <
link href="print.css" rel="stylesheet" media="print"> it is possible to perform some css optimizations to achieve that.
... it is possible to override the default behaviour and preload web font resources using <
link rel="preload">, the css font-display property, and the font loading api.
... see also: element
link images and iframes very often, webpages contain many images that contribute to data-usage and how fast a page can load.
Mobile first - Progressive web apps (PWAs)
third, combining the two is also a good option — why not have a single button at the top of the page, which
links to an anchor on the nav menu at bottom of the page?
... you could then also provide a
link to get back up to the top of the article.
...i have included two
links in my markup: <a id="top" href="#bottom">jump to menu</a> … <a id="bottom" href="#top">back to top</a> the first one is to jump down from the top of the article to the navigation menu, and the second one is to jump back up to the top of the article again.
...#eee; height: 100%; } body { width: 600px; height: inherit; margin: 0 auto; background: url(../img/firefox-os.png) bottom left no-repeat, linear-gradient(to bottom, #fff, #eee); } .main > p { background: rgba(255,255,255,0.3); } nav li a { padding: 0 10px; font-size: 2em; } } the first one cancels out the css display: table behaviour, hides the
links to jump to and from the navigation, as they are not needed anymore in the wider layout, and changes the vertical menu to a horizontal menu that makes better use of the horizontal space available.
Structural overview of progressive web apps - Progressive web apps (PWAs)
being
linkable, progressive, and responsive by design it's important to remember the pwa advantages and keep them in mind when designing the application.
... the app shell approach allows websites to be:
linkable: even though it behaves like a native app, it is still a website — you can click on the
links within the page and send a url to someone if you want to share it.
...es</title> <meta name="description" content="a list of a-frame entries submitted to the js13kgames 2017 competition, used as an example for the mdn articles about progressive web apps."> <meta name="author" content="end3r"> <meta name="theme-color" content="#b12a34"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta property="og:image" content="icons/icon-512.png"> <
link rel="shortcut icon" href="favicon.ico"> <
link rel="stylesheet" href="style.css"> <
link rel="manifest" href="js13kpwa.webmanifest"> <script src="data/games.js" defer></script> <script src="app.js" defer></script> </head> <body> <header> <p><a class="logo" href="http://js13kgames.com"><img src="img/js13kgames.png" alt="js13kgames"></a></p> </header> <main> <h1>js13kgames a-frame entries</h1> ...
...below the content is a <footer>, which provides a copyright notice and assorted
links.
d - SVG: Scalable Vector Graphics
examples html,body,svg { height:100% } <svg viewbox="0 0 200 100" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <!-- cubic bézier curve with absolute coordinates --> <path fill="none" stroke="red" d="m 10,90 c 30,90 25,10 50,10 s 70,90 90,90" /> <!-- cubic bézier curve with relative coordinates --> <path fill="none" stroke="red" d="m 110,90 c 20,0 15,-80 40,-80 s 20,80 40,80" /> <!-- highlight the cur...
...ne x1="50" y1="10" x2="75" y2="10" stroke="lightgrey" stroke-dasharray="2" /> <circle cx="75" cy="10" r="1.5" fill="lightgrey"/> <line x1="90" y1="90" x2="70" y2="90" stroke="lightgrey" /> <circle cx="70" cy="90" r="1.5" /> <!-- curve vertex points --> <circle cx="10" cy="90" r="1.5"/> <circle cx="50" cy="10" r="1.5"/> <circle cx="90" cy="90" r="1.5"/> </g> <use x
link:href="#controlpoints" x="100" /> </svg> quadratic bézier curve quadratic bézier curves are smooth curve definitions using three points: starting point (current point) po = {xo, yo} end point pn = {xn, yn} control point pc = {xc, yc} (controls curvature) after drawing, the end point (pn) becomes the current point for the next command (po′).
... formulae: po′ = pn = {xo + dx, yo + dy} examples html,body,svg { height:100% } <svg viewbox="0 0 200 100" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <!-- quadratic bézier curve with implicit repetition --> <path fill="none" stroke="red" d="m 10,50 q 25,25 40,50 t 30,0 30,0 30,0 30,0 30,0" /> <!-- highlight the curve vertex and control points --> <g> <polyline points="10,50 25,25 40,50" stroke="rgba(0,0,0,.2)" fill="none" /> <circle cx="25" cy="25" r="1.5" /> ...
...stroke-dasharray="2" fill="none" /> <circle cx="55" cy="75" r="1.5" fill="lightgrey" /> <circle cx="70" cy="50" r="1.5" /> </g> <g id="smoothquadraticup"> <polyline points="70,50 85,25 100,50" stroke="rgba(0,0,0,.2)" stroke-dasharray="2" fill="none" /> <circle cx="85" cy="25" r="1.5" fill="lightgrey" /> <circle cx="100" cy="50" r="1.5" /> </g> <use x
link:href="#smoothquadraticdown" x="60" /> <use x
link:href="#smoothquadraticup" x="60" /> <use x
link:href="#smoothquadraticdown" x="120" /> </g> </svg> elliptical arc curve elliptical arc curves are curves defined as a portion of an ellipse.
SVG and CSS - SVG: Scalable Vector Graphics
copy and paste the content from here, making sure that you scroll to get all of it: <svg width="600px" height="600px" viewbox="-300 -300 600 600" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <title>svg demonstration</title> <desc>mozilla css getting started - svg demonstration</desc> <defs> <radialgradient id="fade" cx="0" cy="0" r="200" gradientunits="userspaceonuse"> <stop id="fade-stop-1" offset="33%"/> <stop id="fade-stop-2" offset="95%"/> </radialgradient> </defs> <text id="heading" x="-280" y="-270">svg de...
... result notes about this demonstration: the svg document
links the stylesheet in the usual way.
...px" viewbox="-300 -300 600 600" xmlns="http://www.w3.org/2000/svg"> <title>svg demonstration</title> <desc>mozilla css getting started - svg demonstration</desc> <defs> <g id="segment" class="segment"> <path class="segment-fill" d="m0,0 v-200 a40,40 0 0,0 -62,10 z"/> <path class="segment-edge" d="m0,-200 a40,40 0 0,0 -62,10"/> </g> <g id="quadrant"> <use x
link:href="#segment"/> <use x
link:href="#segment" transform="rotate(18)"/> <use x
link:href="#segment" transform="rotate(36)"/> <use x
link:href="#segment" transform="rotate(54)"/> <use x
link:href="#segment" transform="rotate(72)"/> </g> <g id="petals"> <use x
link:href="#quadrant"/> <use x
link:href="#quadrant" transform="rotate(90)"/> <use x
link:href="#q...
...uadrant" transform="rotate(180)"/> <use x
link:href="#quadrant" transform="rotate(270)"/> </g> <radialgradient id="fade" cx="0" cy="0" r="200" gradientunits="userspaceonuse"> <stop id="fade-stop-1" offset="33%"/> <stop id="fade-stop-2" offset="95%"/> </radialgradient> </defs> <text id="heading" x="-280" y="-270">svg demonstration</text> <text id="caption" x="-280" y="-250">move your mouse pointer over the flower.</text> <g id="flower"> <circle id="overlay" cx="0" cy="0" r="200" stroke="none" fill="url(#fade)"/> <use id="outer-petals" x
link:href="#petals"/> <use id="inner-petals" x
link:href="#petals" transform="rotate(9) scale(0.33)"/> </g> </svg> what next?
How to fix a website with blocked mixed content - Web security
or use a free online crawler like ssl-check or missing padlock, a desktop crawler like httpschecker, or a cli tool like mcdetect to check your website recursively and find
links to insecure content.
... for your own domain, serve all content as https and fix your
links.
... often, the https version of the content already exists and this just requires adding an "s" to
links - http:// to https://.
...there are online as well as offline tools (depending on your operating system) such as
linkchecker to help resolve this.
Referer header: privacy and security concerns - Web security
the referrer problem the referer (sic) header contains the address of the previous web page from which a
link to the currently requested page was followed, which has lots of fairly innocent uses including analytics, logging, or optimized caching.
... for example, consider a "reset password" page with a social media
link in a footer.
... if the
link was followed, depending on how information was shared the social media site may receive the reset password url and may still be able to use the shared information, potentially compromising a user's security.
...see
link types and search for noreferrer for more information.
Introduction to using XPath in JavaScript - XPath
none yet =====any_type example===== <pre> </pre> examples within an html document the following code is intended to be placed in any javascript fragment within or
linked to the html document against which the xpath expression is to be evaluated.
...the full code for this is:
link to introductory xpath doc var headings = document.evaluate('//h2', document, null, xpathresult.any_type, null ); notice that, since html does not have namespaces, we have passed null for the namespaceresolver parameter.
... for example, one might try (incorrectly) to grab an element with a namespaced attribute as follows: var xpath
link = someelements[local-name(@*)="href" and namespace-uri(@*)='http://www.w3.org/1999/x
link']; this could inadvertently grab some elements if one of its attributes existed that had a local name of "href", but it was a different attribute which had the targeted (x
link) namespace (instead of @href).
... in order to accurately grab elements with the x
link @href attribute (without also being confined to predefined prefixes in a namespace resolver), one could obtain them as follows: var xpathels = 'someelements[@*[local-name() = "href" and namespace-uri() = "http://www.w3.org/1999/x
link"]]'; // grabs elements with any single attribute that has both the local name 'href' and the x
link namespace var thislevel = xml.evaluate(xpathels, xml, null, xpathresult.any_type, null); var thisitemel = thislevel.iteratenext(); xpathresult defined constants result type defined constant value description any_type 0 a result set containing whatever type naturally results from the evaluation of the expression.
context-menu - Archive of obsolete content
it does not occur when the user invokes the context menu on a
link, image, or other non-text node, or while a selection exists.
...the example above works because <img> elements can't contain other elements, but in the example below, node.nodename is not guaranteed to be "p" - for example, it won't be "p" if the user context-clicked a
link inside a paragraph: var cm = require("sdk/context-menu"); cm.item({ label: "a paragraph", context: cm.selectorcontext("p"), contentscript: 'self.on("context", function (node) {' + ' console.log(node.nodename);' + ' return true;' + '});' }); the content script is executed for every page that a context menu is shown for.
...
linkurl the href url of the element that the menu was invoked on, or null if it doesn't have one.
xml:base support in old browsers - Archive of obsolete content
var scheme = /(\w(\w|\d|\+|\- |\ .)*)\:\/\//; function getxmlbase
link (x
link, thisitem) { var xmlbase = ''; if (!x
link.match(scheme)) { // only check for xml base if there is no protocol // tests for 'scheme' per http://www.ietf.org/rfc/rfc2396.txt' xmlbase = getxmlbase (thisitem); if (!xmlbase.match(/\/$/) && !x
link.match(/\/$/)) { // if no preceding slash on x
link or trailing slash on xml:base, add one in between xmlbase += '/'; } else if (xmlbase.ma...
...tch(/\/$/) && x
link.match(/\/$/)) { xmlbase = xmlbase.substring(0, xmlbase.length-2); // strip off last slash to join with x
link path with slash } // alert(xmlbase + '::' + x
link); } var
link = xmlbase + x
link; if (!
link.match(scheme)) { // if there is no domain, we'll need to use the current domain var loc = window.location; if (
link.indexof('/') === 0 ) { // if
link is an absolute url, it should be from the host only
link = loc.protocol + '//' + loc.host +
link; } else { // if
link is relative, it should be from full path, minus the file var dirpath = loc.pathname.substring(0, loc.pathname.lastindexof('/')-1); if (
link.lastindexof('/') !==
link.length-1) {
link += '/'; }
link = loc.protocol + '//' + loc.host + dirpath +
link; } } ...
... return
link; } function getxmlbase (thisitem) { // fix: need to keep going up the chain if still a relative url!!!!!
Mozilla Documentation Roadmap - Archive of obsolete content
mdc is where this tutorial is hosted, and where most of its
links point to.
...it includes
links to tutorials and documentation, development tools, and most notably, the mozilla add-ons forum.
...you'll be able to navigate the full source tree, inspect the change history for all files, and
link to specific code lines.
Signing an XPI - Archive of obsolete content
this article is a mirror of the original, with minor reformatting, some new info and all
links updated in march 2010.
...within a few hours i received a confirmation email from a human accepting the id images and giving me a hyper
link to the certifcate download area.
... download the root ca and any intermediate certificates used to sign your certificate from the issuer; their web site will have a
link somewhere to their root cas and public certificates.
Index of archived content - Archive of obsolete content
addons developer guide code snippets creating a user interface firefox hub walkthrough initialization and cleanup prerequisites walkthrough webextensions for firefox for android listening to events in firefox extensions migrating from internal
linkage to frozen
linkage migrating raw components to add-ons multiple item extension packaging offering a context menu for form controls overlay extensions firefox addons developer guide appendix: what you should know about open-source software licenses chapter 1: introd...
... up for distribution making it into a static overlay prerequisites specifying the appearance tinderbox creating a release tag creating a skin for firefox/getting started creating a skin for mozilla faq getting started in-depth
links contents.rdf toolbarbindings.xml creating a skin for seamonkey 2.x getting started chrome.manifest install.rdf creating a hybrid cd creating regular expressions for a microsummary generator dtrace dehydra ...
...ler for xulrunner applications custom app bundles for mac os x debugging a xulrunner application deploying xulrunner dialogs in xulrunner getting started with xulrunner how to enable locale switching in a xulrunner application macfaq make your xulrunner app match the system locale opening a
link in the default browser specifying startup chrome window using crash reporting in a xulrunner application using ldap xpcom with xulrunner using soap in xulrunner 1.9 what xulrunner provides windows and menus in xulrunner xul application packaging xulrunner 1.8.0.1 release notes xulrunner 1.8...
Java in Firefox Extensions - Archive of obsolete content
liveconnect gives your extension's javascript code (
linked from or contained in xul code) access to 2 objects: java and packages (note that per this thread, although the new documentation for the liveconnect reimplementation states that these globals will be deprecated (in the context of applets), "firefox and the java plug-in will continue to support the global java/packages keywords, in particular in the context of firefox extensions.").
... these 2 objects let you make use of the standard jdk classes, e.g., var ajavalist = new java.util.
linkedlist(); if you want to load your own jars, then you can create your own java class loader.
... the following technique only works in javascript code
linked from or contained in xul files.
Plug-n-Hack Phase1 - Archive of obsolete content
example manifest (for owasp zap) is: { "toolname":"owasp zap", "protocolversion":"0.2", "features":{ "proxy":{ "pac":"http://localhost:8080/proxy.pac", "cacert":"http://localhost:8080/other/core/other/rootcert/" }, "commands":{ "prefix":"zap", "manifest":"http://localhost:8080/other/mitm/other/service/" } } } the top level manifest includes optional
links to a proxy pac and a root ca certificate.
... it also optionally
links to another manifest which describes the commands the browser can invoke.
... related
links plug-n-hack overview ...
Elements - Archive of obsolete content
the most useful namespaces could be html/xhtml, xul (xml user interface language), svg (scalable vector graphics) and x
link.
... this way a more-or-less universal namespace declaration in your bindings could be like: <bindings xmlns="http://www.mozilla.org/xbl" xmlns:html = "http://www.w3.org/1999/xhtml" xmlns:xul = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:svg = "http://www.w3.org/2000/svg" xmlns:x
link= "http://www.w3.org/1999/x
link"> binding <!entity % binding-content "(resources?,content?,implementation?,handlers?)"> <!element binding %binding-content;> <!attlist binding id id #required extends cdata #implied display cdata #implied inheritstyle true #implied > the binding element describes a single xbl binding.
... note: the normal same-origin policy is used for web sites; they can only
link to xbl files on the same domain, or within the chrome.
findbar - Archive of obsolete content
possible values are: find_normal (0): normal find find_typeahead (1): typeahead find find_
links (2):
link find methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsb...
... open( mode ) return type: no return value opens the findbar using the specified mode, which should be one of find_normal, find_typeahead, or find_
links.
... the mode should be one of find_normal, find_typeahead, or find_
links.
List of commands - Archive of obsolete content
list of commands (grouped by type) nsdomwindowcontroller commands (generally legal when there is a selection): cmd_copy - copy a selection to the clipboard cmd_cut - cut a selection into the clipboard cmd_paste - paste a selection from the clipboard cmd_selectall cmd_selectnone cmd_copy
link cmd_copyimagelocation cmd_copyimagecontents cmd_scrolltop cmd_scrollbottom cmd_scrollpageup cmd_scrollpagedown cmd_scrolllineup cmd_scrolllinedown cmd_scrollleft cmd_scrollright cmd_selectcharprevious cmd_selectcharnext cmd_wordprevious cmd_wordnext cmd_selectwordprevious cmd_selectwordnext cmd_beginline cmd_endline cmd_selectbeginline cmd_selectendline cmd_selectlineprevious...
...k cmd_bm_newbookmark cmd_bm_newfolder cmd_bm_newseparator cmd_bm_open cmd_bm_openinnewtab cmd_bm_openinnewwindow cmd_bm_paste cmd_bm_properties cmd_bm_rename cmd_bm_selectall cmd_bm_setnewbookmarkfolder cmd_bm_setnewsearchfolder cmd_bm_setpersonaltoolbarfolder cmd_bm_sortfolder cmd_bm_sortfolderbyname cmd_close cmd_closeothertabs cmd_closewindow cmd_copy cmd_copyimage cmd_copy
link cmd_cut cmd_delete cmd_editpage cmd_findtype
links cmd_findtypetext cmd_gotoline cmd_handlebackspace cmd_handleshiftbackspace cmd_minimizewindow cmd_neweditor cmd_neweditordraft cmd_neweditortemplate cmd_newnavigator cmd_newnavigatortab cmd_newtabwithtarget cmd_openhelp cmd_paste - paste a selection from the clipboard cmd_printsetup cmd_quit cmd_redo cmd_savepage cmd_scrollpa...
...gedown cmd_scrollpageup cmd_selectall cmd_switchdocumentdirection cmd_switchtextdirection cmd_textzoomenlarge cmd_textzoomreduce cmd_textzoomreset cmd_undo cmd_viewcomponentbar cmd_view
linktoolbar cmd_view
linktoolbar_false cmd_view
linktoolbar_maybe cmd_view
linktoolbar_true cmd_viewnavbar cmd_viewpersonaltoolbar cmd_viewtaskbar cmd_zoomwindow thanks for help of joe.user0 in compiling: http://readlist.com/lists/mozilla.or...l/3/15261.html .
The Joy of XUL - Archive of obsolete content
for this reason, xul is oriented toward application artifacts such as windows, labels, and buttons instead of pages, heading levels, and hypertext
links.
...to install a new application the user need only click a hypertext
link on a web page or in an email message and accept the new package through a mozilla install dialog.
...using xpinstall it was easy for the developers to package a version of calendar that could be installed directly over the internet by clicking a
link.
SeaMonkey - making custom toolbar (SM ver. 1.x) - Archive of obsolete content
copy and paste the line from here, to avoid typing errors: content,install,url,resource:/chrome/custombutton/ explanation: this line registers your custom toolbar button extension,
linking it into seamonkey.
...it also
links to the stylesheet and javascript code that the button uses.
...it
links to the button image, specifying the dimensions of the six parts of the image.
Skinning XUL Files by Hand - Archive of obsolete content
here is a very short (but complete!) cascading stylesheet that might be referenced and used by a xul file: toolbar.nav-bar { background-image: url("chrome://navigator/skin/navbar-bg.gif"); padding: 0px; padding-bottom: 2px; } box#navbar { background-color: lightblue; } a:
link { color: #fa8072; } this stylesheet exhibits three of the different types of style definitions described above.
... the third type of selector, thepseudo-class, is one you may have seen in the in-line style definitions for hyper
links which commonly appear in html documents.
...in this third type of style definition, the "a" element picks up the style information defined in the block only when it is, as a
link, active.
XUL Questions and Answers - Archive of obsolete content
for more information please look at the following
link: nsextensionmanager.js is nsivariant fully supported using python?
... load event is confirmed // or when the user switches tabs listobj.onlocationchange = function(aprogress, arequest, auri) { // do whatever you want to do return 0; } // for definitions of the remaining functions see xulplanet.com listobj.onprogresschange = function() { return 0 }; listobj.onstatuschange = function() { return 0 }; listobj.onsecuritychange = function() { return 0 }; listobj.on
linkiconavailable = function() { return 0 }; /* i use the progress listener to trap the end of a local html "template" file loading, and run xslt transormations.
... in addition i need to evaluate the browser contentdocument dom in order to clean "target" attributes on
links, and so on.
window - Archive of obsolete content
to add a favicon to the address bar and browser tab (ie dialog is not a popup) then use the following code snippet to use the html namespace and
link.
... <window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:html="http://www.w3.org/1999/xhtml"> <!-- icon from chrome --> <html:
link rel="icon" href="chrome://myextension/content/path/to/favicon.png"/> <!-- from a remote site --> <html:
link rel="icon" href="http://www.mozilla.org/favicon.ico"/> since firefox 3.6 the above listed code does not work correctly - it produces the following message: "warning: xul box for box element contained an inline
link child, forcing all its children to be wrapped in a block".
...the problem can be solved as follows: <html:
link rel="icon" href="chrome://myextension/content/path/to/favicon.png" style="display:none"/> or <html:head> <html:
link rel="icon" href="chrome://myextension/content/path/to/favicon.png"/> </html:head> ...
Archived Mozilla and build documentation - Archive of obsolete content
web pages can reference generators via <
link rel="microsummary"> elements in their <head> elements.
... creating a mozilla extension a mozilla extension is an installable enhancement to the mozilla browser that provides additional functionality (for example
linky, which adds an item to the context menu for opening multiple
links in a document or selection).
...liveconnect gives your extension's javascript code (
linked from or contained in xul code) access to 2 objects: java and packages (note that per this thread, although the new documentation for the liveconnect reimplementation states that these globals will be deprecated (in the context of applets), "firefox and the java plug-in will continue to support the global java/packages keywords, in particular in the context of...
Extentsions FAQ - Archive of obsolete content
these two
links should give you a starting point: http://www..xulplanet.com/tutorials/...u/advmenu.html http://www.xulplanet.com/tutorials/x...dommodify.html request for a thunderbird extension that can automatically detect the default domain when composing e-mails via autodetect.
... friday, october 13 - 20, 2006 (↑ top) is there an extension or script get the actual
link of a redirected zip file?
... how to get return
links from google search, and what security pitfalls to look out for while writing extension?
Building a Theme - Archive of obsolete content
firefox will detect the text
link to your theme directory and install the theme.
...you can
link to it and allow people to download and install it.
... installing from a web page there are a variety of ways you can install extensions from web pages, including direct
linking to the xpi files and using the installtrigger object.
Popup Window Controls - Archive of obsolete content
any attempt to open a popup window that is the direct result of user action, such as clicking on a hyper
link, should succeed in opening popup windows even if the user has popup controls enabled on your site.
...you can also provide a hyper
link which can be used to open a popup window even in the event that the user has suppressed unsolicited popups on your site.
... example the example tag
links to devedge-temp.mozilla.org this example illustrates detecting suppressed popup windows as well as an approach for replacing popup windows with inline html using innerhtml.
Using the Right Markup to Invoke Plugins - Archive of obsolete content
you cannot use a codebase attribute to
link to a signed cab file for the activex component, since this won't work in mozilla-based browsers such as netscape 7.
..."myflash"> <param name="movie" value="javascript_to_flash.swf" /> <param name="quality" value="high" /> <param name="swliveconnect" value="true" /> <embed src="javascript_to_flash.swf" quality="high" width="366" height="142" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/downloads/" name="myflash" swliveconnect="true"> </embed> </object>
links to the rules governing the use of the embed element can be found in the references section.
...
link: http://devedge-temp.mozilla.org/view.../index_en.html references general -- specifications html 4.01 specification xhtml 1.0 specification object element html 4.01 specification on object element embed element plugin api reference on embed element on devedge-temp java html 4.01 applet definition (deprecated) java plugin homepage sun documentation on object, embed, and app...
Bounding volume collision detection with THREE.js - Game development
usually we will want this aabb to be "
linked" to an object in our 3d world (like a character.) in three.js, geometry instances have a boundingbox property with min and max boundaries for the object.
... the advantages of using this helper are: it has an update() method that will resize its bounding box mesh if the
linked mesh rotates or changes its dimensions, and update its position.
...we need to call the update() method so the boxhelper instance matches its
linked mesh.
Client hints - MDN Web Docs Glossary: Definitions of Web-related terms
accept-ch: dpr, width, viewport-width, down
link and / or <meta http-equiv="accept-ch" content="dpr, width, viewport-width, down
link"> when a client receives the accept-ch header, if supported, it appends client hint headers that match the advertised field-values.
... for example, based on accept-ch example above, the client could append dpr, width, viewport-width, and down
link headers to all subsequent requests.
... example varying response: vary: accept, dpr, width, viewport-width, down
link see also client hints headers vary http header ...
Object reference - MDN Web Docs Glossary: Definitions of Web-related terms
a
link to an object.
... object references can be used exactly like the
linked objects.
...rather than holding a copy of the object, each assigned property holds object references that
link to the same object, so that when the object changes all properties referring to the object reflect the change.
MDN Web Docs Glossary: Definitions of Web-related terms
alpha (alpha channel) alpn api apple safari application context argument aria arpa arpanet array ascii asynchronous atag attribute b bandwidth base64 baseline beacon bézier curve bidi bigint b
link block block (css) block (scripting) block cipher mode of operation boolean boot2gecko bootstrap bounding box breadcrumb brotli browser browsing context buffer c cache cacheable caldav call stack callback function ...
...graceful degradation grid grid areas grid axis grid cell grid column grid container grid lines grid row grid tracks guard gutters gzip compression h hash head high-level programming language hmac hoisting host hot
link houdini hpkp hsts html html5 http http header http/2 http/3 https hyper
link hypertext i i18n iana icann ice ide idempotent identifier idl ietf iife imap immutable ...
...erver web standards webassembly webdav webextensions webgl webidl webkit webm webp webrtc websockets webvtt whatwg whitespace world wide web wrapper x xforms xhr (xmlhttprequest) xhtml xinclude x
link xml xpath xquery xslt other 404 502 alpn at-rule attack byte-order mark character set client cryptosystem debug digital signature execution flex-direction glsl interface library memory m...
Test your skills: WAI-ARIA - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: The Cascade - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want to be assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Fundamental CSS comprehension - Learn web development
link your css to your html file via a <
link> element.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Images and Form elements - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want to be assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Overflow - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want to be assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: The Box Model - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want to be assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
CSS selectors - Learn web development
the following for example selects paragraphs that are direct children of <article> elements using the child combinator (>): article > p { } next steps you can take a look at the reference table of selectors below for direct
links to the various types of selectors in this learn section or on mdn in general, or continue on to start your journey by finding out about type, class, and id selectors.
... previous overview: building blocks next reference table of selectors the below table gives you an overview of the selectors you have available to use, along with
links to the pages in this guide which will show you how to use each type of selector.
... i have also included a
link to the mdn page for each selector where you can check browser support information.
Test your skills: sizing - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Styling tables - Learn web development
link the css to the html by placing the following line of html inside your <head>: <
link href="style.css" rel="stylesheet" type="text/css"> spacing and layout the first thing we need to do is sort out the spacing/layout — default table styling is so cramped!
...you can go there and find a different one if you like; you'll just have to replace our provided <
link> element and custom font-family declaration with the ones google fonts gives you.
... first, add the following <
link> element into your html head, just above your existing <
link> element: <
link href='https://fonts.googleapis.com/css?family=rock+salt' rel='stylesheet' type='text/css'> now add the following css into your style.css file, below the previous addition: /* typography */ html { font-family: 'helvetica neue', helvetica, arial, sans-serif; } thead th, tfoot th { font-family: 'rock salt', cursive; } th { letter-spacing: 2px; } td { letter-spacing: 1px; } tbody td { text-align: center; } tfoot th { text-align: right; } there is nothing really specific to tables here; we are generally tweaking the font styling to make things easier to read: we have set a global sans-serif font stack; this is purely a stylistic choice.
Test your skills: tables - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: backgrounds and borders - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online editor.
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Writing Modes and Logical Properties - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Flexbox - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: floats - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test Your Skills: Fundamental layout comprehension - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Grid Layout - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Beginner's guide to media queries - Learn web development
for users who can hover, we might choose to make them available when a
link is hovered over.
... * { box-sizing: border-box; } body { width: 90%; margin: 2em auto; font: 1em/1.3 arial, helvetica, sans-serif; } a:
link, a:visited { color: #333; } nav ul, aside ul { list-style: none; padding: 0; } nav a:
link, nav a:visited { background-color: rgba(207, 232, 220, 0.2); border: 2px solid rgb(79, 185, 227); text-decoration: none; display: block; padding: 10px; color: #333; font-weight: bold; } nav a:hover { background-color: rgba(207, 232, 220, 0.7); } .related { ...
... </p> </aside> </article> <aside class="sidebar"> <h2>external vegetable-based
links</h2> <ul> <li> ...
Test your skills: Multicol - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: position - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Media Queries and Responsive Design - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
What is the difference between webpage, website, web server, and search engine? - Learn web development
to access a page, just type its address in your browser address bar: web site a website is a collection of
linked web pages (plus their associated resources) that share a unique domain name.
... each web page of a given website provides explicit
links—most of the time in the form of clickable portion of text—that allow the user to move from one page of the website to another.
... here is an instance of firefox showing a google search box as its default startup page: next steps dig deeper: what is a web server see how web pages are
linked into a web site: understanding
links on the web ...
Test your skills: Advanced styling - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Basic controls - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Form structure - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Form validation - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: HTML5 controls - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Other controls - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Styling basics - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Dealing with files - Learn web development
some servers will replace the areas in your filenames with "%20" (the character code for spaces in uris), resulting in all your
links being broken.
... some general rules for file paths: to
link to a target file in the same directory as the invoking html file, just use the filename, e.g.
... to
link to a target file in the directory above the invoking html file, write two dots.
Test your skills: Advanced HTML text - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: HTML text basics - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Introduction to HTML - Learn web development
it contains information such as the page <title>,
links to css (if you want to style your html content with css),
links to custom favicons, and metadata (data about the html, such as who wrote it, and important keywords that describe the document).
... creating hyper
links hyper
links are really important — they are what makes the web a web.
... this article shows the syntax required to make a
link and discusses best practices for
links.
Adding vector graphics to the Web - Learn web development
you can make the image into a hyper
link easily by nesting the <img> inside an <a> element.
... inlining svg is the only approach that lets you use css interactions (like :focus) and css animations on your svg image (even in your regular stylesheet.) you can make svg markup into a hyper
link by wrapping it in an <a> element.
...we've included some
links below that might help you if you wish to go and find out more about how it works.
Test your skills: HTML images - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Multimedia and embedding - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Structuring the web with HTML - Learn web development
html is used to specify whether your web content should be recognized as a paragraph, list, heading,
link, image, multimedia player, form, or one of many other available elements or even a new element that you define.
... introduction to html this module sets the stage, getting you used to important concepts and syntax, looking at applying html to text, how to create hyper
links, and how to use html to structure a webpage.
... solving common html problems use html to solve common problems provides
links to sections of content explaining how to use html to solve very common problems when creating a webpage: dealing with titles, adding images or videos, emphasizing content, creating a basic form, etc.
Test your skills: Conditionals - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Events - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Functions - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Loops - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Third-party APIs - Learn web development
this typically involves first
linking to a javascript library available on the server via a <script> element, as seen in our mapquest example: <script src="https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest.js"></script> <
link type="text/css" rel="stylesheet" href="https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest.css"/> you can then start using the objects available in that library.
....display = 'block'; } else { nav.style.display = 'none'; } if(articles.length === 0) { const para = document.createelement('p'); para.textcontent = 'no results returned.' section.appendchild(para); } else { for(var i = 0; i < articles.length; i++) { const article = document.createelement('article'); const heading = document.createelement('h2'); const
link = document.createelement('a'); const img = document.createelement('img'); const para1 = document.createelement('p'); const para2 = document.createelement('p'); const clearfix = document.createelement('div'); let current = articles[i]; console.log(current);
link.href = current.web_url;
link.textcontent = current.headline.main; para1.textconte...
...ateelement('span'); span.textcontent += current.keywords[j].value + ' '; para2.appendchild(span); } if(current.multimedia.length > 0) { img.src = 'http://www.nytimes.com/' + current.multimedia[0].url; img.alt = current.headline.main; } clearfix.setattribute('class','clearfix'); article.appendchild(heading); heading.appendchild(
link); article.appendchild(img); article.appendchild(para1); article.appendchild(para2); article.appendchild(clearfix); section.appendchild(article); } } } there's a lot of code here; let's explain it step by step: the while loop is a common pattern used to delete all of the contents of a dom element, in this case, the <section> element.
Test your skills: Arrays - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Math - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Strings - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: variables - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Object prototypes - Learn web development
in javascript, a
link is made between the object instance and its prototype (its __proto__ property, which is derived from the prototype property on the constructor), and the properties and methods are found by walking up the chain of prototypes.
... in this example, we have defined a constructor function, like so: function person(first, last, age, gender, interests) { // property and method definitions this.name = { 'first': first, 'last' : last }; this.age = age; this.gender = gender; //...see
link in summary above for full definition } we have then created an object instance like this: let person1 = new person('bob', 'smith', 32, 'male', ['music', 'skiing']); if you type "person1." into your javascript console, you should see the browser try to auto-complete this with the member names available on this object: in this list, you will see the members defined on person1's constructor �...
... note: before ecmascript 2015, there wasn't officially a way to access an object's prototype directly — the "
links" between the items in the chain are defined in an internal property, referred to as [[prototype]] in the specification for the javascript language (see ecmascript).
Test your skills: Object-oriented JavaScript - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Test your skills: Object basics - Learn web development
you can write the code yourself, or use the starting point files
linked to in the above sections.
... a
link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above).
... a
link to the actual task or assessment page, so we can find the question you want help with.
Introduction to client-side frameworks - Learn web development
routing the most essential feature of the web is that it allows users to navigate from one page to another – it is, after all, a network of inter
linked documents.
... when you follow a
link on this very website, your browser communicates with a server and fetches new content to display for you.
...people are used to being able to
link to specific pages in an application, travel forward and backward in their navigation history, etc., and their experience suffers when these standard web features are broken.
Getting started with React - Learn web development
</p> <a classname="app-
link" href="https://reactjs.org" target="_blank" rel="noopener noreferrer" > learn react </a> </header> </div> ); } export default app; the app.js file consists of three main parts: some import statements at the top, the app component in the middle, and an export statement at the bottom.
... </p> <a classname="app-
link" href="https://reactjs.org" target="_blank" rel="noopener noreferrer" > learn react </a> </header> </div> ); } the app function returns a jsx expression.
...now delete the <a> tag and save; the "learn react"
link will be gone.
Getting started with Svelte - Learn web development
finally the file public/index.html includes the generated bundle.css and bundle.js files: <!doctype html> <html lang="en"> <head> <meta charset='utf-8'> <meta name='viewport' content='width=device-width,initial-scale=1'> <title>svelte app</title> <
link rel='icon' type='image/png' href='/favicon.png'> <
link rel='stylesheet' href='/global.css'> <
link rel='stylesheet' href='/build/bundle.css'> <script defer src='/build/bundle.js'></script> </head> <body> </body> </html> the minified version of bundle.js weighs a little more than 3kb, which includes the "svelte runtime" (just 300 lines of javascript code) and the app.svelte compiled compon...
...o clone the repository you should execute: git clone https://github.com/opensas/mdn-svelte-tutorial.git then at the beginning of each article, you can just cd into the corresponding folder and start the app in dev mode to see what its current state should be, like this: cd 02-starting-our-todo-app npm install npm run dev if you want lo learn more about git and github, we've compiled a list of
links to useful guides — see git and github.
...for example, here's the
link for a repl running our complete app: https://svelte.dev/repl/378dd79e0dfe4486a8f10823f3813190?version=3.23.2.
Introduction to automated testing - Learn web development
to update node, the most reliable way is to download and install an updated installer package from their website (see
link above).
... see the
links above for full instructions on the different gulp packages we are using.
... when you first sign in, you should be on the live testing page; if not, click the live
link in the top nav menu.
Setting up your own test automation environment - Learn web development
there are other ways, but the best way to use selenium is via webdriver, a powerful api that builds on top of selenium and makes calls to a browser to automate it, carrying out actions such as "open this web page", "move over this element on the page", "click this
link", "see whether the
link opens this url", etc.
... note: if you want to find out how to use webdriver with other server-side environments, also check out platforms supported by selenium for some useful
links.
... now if you go back to the browserstack automation dashboard page, you'll see your test listed: if you click on the
link for your test, you'll get to a new screen where you will be able to see a video recording of the test, and multiple detailed logs of information pertaining to it.
Command line crash course - Learn web development
viewing the command line for the first time can be a daunting experience: a blank screen and a b
linking cursor, with very little obvious help available on what to do.
...the command line is the literal line where you enter commands and the cursor b
links.
... with prettier there's a number of ways automation can be achieved and though they're beyond the scope of this article, there's some excellent resources online to help (some of which have been
linked to).
Accessibility information for UI designers and developers
links vs buttons to keep your interface in line with user expectations, use
links for interactions that go somewhere (on the current page or another page) and buttons for interactions that do something (like submit a form or open an overlay).
...
links can be styled as buttons and vice versa, but designers are advised to avoid this where possible.
...it does not need to be exactly the same, it is fine to have a different current menu item or different subnavigation
links.
Embedding API for Accessibility
owser.display.background_color", "#abcdef" /* hex color value */); setboolpref("browser.display.use_system_colors", boolsystemcolors); setboolpref("browser.display.use_document_colors", booluseauthorcolors); /* setting use_document_colors also stops background images from loading */ moz 0.8
link appearance setcharpref("browser.anchor_color", "#abcdef" /* hex color value */); setcharpref("browser.visited_color", "#abcdef" /* hex color value */); setboolpref("browser.underline_anchors", boolunderline
links); moz 0.8 focus appearance setboolpref...
... setcharpref("alert.audio.timed_event_waiting", pathtosoundfile); /* these alerts will also be mirrored visually, either on the status bar or elsewhere */ no background images setboolpref("browser.accept.background_images", acceptbackgroundimages); no b
linking text setboolpref("browser.b
link_allowed", acceptb
linktext); no animations setcharpref("image.animation_mode", animationmode); animationmode: "normal", "none", "once" moz 0.8 applets setboolpref("brow...
... no timed events setboolpref("browser.accept.timed_events", accepttimedevents); no timer speed setintpref("timer.relative_speed", percent); /* 100 corresponds to normal speed, 200 to double speed */ no allow cycling in lists and
links setboolpref("keyboardnav.allow_cycling", allowcycling); no mouse pointer moves with keyboard focus setboolpref("keyboardnav.mouse_follows_keyboard_focus", mousefollows); /* if this pref is set, the mouse pointer will always be move to the 0,0 pixel of the current keyboard focus frame ...
What to do and what not to do in Bugzilla
include a
link to your bugzilla activity page in the bug description.
... you should look at all the open bugs you've reported (see the "my bugs"
link at the bottom of every bugzilla page) at least every two months and test whether they still exist.
...bugs which can no longer be reproduced should be marked worksforme instead of fixed if they can't be
linked to a single checkin.
mozbrowsercontextmenu
for example, if the user clicked on an image nested in an <a> tag, two menus are available — one with information related to the image, and one for the
link.
...in the case of an
link context menu, it is the
link's href.
... text a domstring representing the text of the
link clicked on, in the case of a
link context menu.
Browser API
<
link rel="icon"> or <
link rel="apple-touch-icon">) is available in the browser <iframe>'s content.
... mozbrowseropentab sent when a new tab is opened within a browser <iframe> as a result of the user issuing a command to open a
link target in a new tab (for example ctrl/cmd + click.) mozbrowserresize sent when the browser <iframe>'s window size has changed.
... mozbrowseropensearch sent when a
link to a search engine is found.
CustomizableUI.jsm
to avoid that, update your chrome manifest file with
links to two different versions of xul overlay, using manifest flags.
...ableui.area_navbar, label: 'my widget', // type: 'button', //we don't need to type this, the default type is button tooltiptext: 'this is my widget created with cui.jsm', oncommand: function(aevent) { var thisdomwindow = aevent.target.ownerdocument.defaultview; //this is the browser (xul) window var thiswindowsselectedtabswindow = thisdomwindow.gbrowser.selectedtab.
linkedbrowser.contentwindow; //this is the html window of the currently selected tab thiswindowsselectedtabswindow.alert('alert from html window of selected tab'); thisdomwindow.alert('alert from xul window'); } }); giving the button an icon non-style sheet method the style sheet method (below) is one way to add an icon.
...ableui.area_navbar, label: 'my widget', // type: 'button', //we don't need to type this, the default type is button tooltiptext: 'this is my widget created with cui.jsm', oncommand: function(aevent) { var thisdomwindow = aevent.target.ownerdocument.defaultview; //this is the browser (xul) window var thiswindowsselectedtabswindow = thisdomwindow.gbrowser.selectedtab.
linkedbrowser.contentwindow; //this is the html window of the currently selected tab thiswindowsselectedtabswindow.alert('alert from html window of selected tab'); thisdomwindow.alert('alert from xul window'); } }); //end - use customizableui.jsm to create the widget //start - use style sheet service to style our widget to give it an icon cu.import('resource://gre/modules/services...
Mozilla Web Developer FAQ
there are
links to more general web authoring faqs at the end of this document.
... the <
link> and <style> elements should be inside the <head> element.
... mathml svg (in svg-enabled builds only) xul (please note that xul is mozilla-specific and, therefore, using it on the public web causes interoperabilty problems.) xml:base is observed when following
links.
Reporting a Performance Problem
there will be a button in the top right labeled 'publish' which will allow you to upload this profile and once completed will write out a
link.
... once uploaded, copy perma
link url to your clipboard by right clicking and add the profile url to a bug for your performance problem and/or send it to the appropriate person.
...gecko profiler allows you to share a
link with the profile.
Midas
create
link a uri.
...if there is a selection, a
link will be inserted around the selection with the url parameter as the href of the
link.
... note: the shortcut key will automatically trigger this command (typically accel-z) un
link if the insertion point is within a
link or if the current selection contains a
link, the
link will be removed and the text will remain.
PRCList
a circular
linked list.
... syntax #include <prclist.h> typedef struct prcliststr prclist; typedef struct prcliststr { prclist *next; prclist *previous; }; description prclist defines a node in a circular
linked list.
... it can be used as the anchor of a list and can be embedded in data structures that are maintained in a
linked list.
NSS 3.45 release notes
bug 1550579 - replace arm32 curve25519 implementation with one from fiat-crypto bug 1551129 - support static
linking on windows bug 1552262 - expose a function pk11_findrawcertswithsubject for finding certificates with a given subject on a given slot bug 1546229 - add ipsec ike support to softoken bug 1554616 - add support for the elbrus lcc compiler (<=1.23) bug 1543874 - expose an external clock for ssl this adds new experimental functions: ssl_settimefunc, ssl_createantireplaycontext, ssl_setant...
... clients that might have copied the unit test code verbatim bug 1550022 - ensure nssutil3 gets built on android bug 1528174 - chacha20poly1305 should no longer modify output length on failure bug 1549382 - don't leak in pkcs#11 modules if c_getslotinfo() returns error bug 1551041 - fix builds using gcc < 4.3 on big-endian architectures bug 1554659 - add versioning to openbsd builds to fix
link time errors using nss bug 1553443 - send session ticket only after handshake is marked as finished bug 1550708 - fix gyp scripts on solaris sparc so that libfreebl_64fpu_3.so builds bug 1554336 - optimize away unneeded loop in mpi.c bug 1559906 - fipstest: use ckm_tls12_master_key_derive instead of vendor specific mechanism bug 1558126 - tls_aes_256_gcm_sha384 should be marked as fips comp...
...a program
linked with older nss 3.x shared libraries will work with nss 3.45 shared libraries without recompiling or re
linking.
NSS release notes template
nss 3.xx source distributions are available on ftp.mozilla.org for secure https download: source tarballs: https://ftp.mozilla.org/pub/mozilla.org/security/nss/releases/nss_3_xx_rtm/src/ (make a
link) new in nss 3.xx new functionality either: no new functionality is introduced in this release.
... bugs fixed in nss 3.xx this bugzilla query returns all the bugs fixed in nss 3.xx: https://bugzilla.mozilla.org/buglist.cgi?resolution=fixed&classification=components&query_format=advanced&product=nss&target_milestone=3.xx (make a
link) acknowledgements the nss development team would like to thank ...
...a program
linked with older nss 3.x shared libraries will work with nss 3.xx.y shared libraries without recompiling or re
linking.
NSS environment variables
see documentation at this
link.
... 3.12.8 nsdistmode string on operating systems other than windows, this controls whether copies, absolute sym
links, or relative sym
links of the output files should be published to mozilla/dist.
... the possible values are: copy: copies of files are published absolute_sym
link: sym
links whose targets are absolute pathnames are published if not specified, default to relative sym
links (sym
links whose targets are relative pathnames).
SSL functions
the nss home page
links to additional ssl documentation.
... if documentation is available for a function listed below, the function name is
linked to either its mdc wiki page or its entry in the old ssl reference.
... the mozilla cross reference (dxr)
link for each function provides access to the function definition, prototype definition, and source code references.
NSS Tools
the
links for each tool take you to the source code, documentation, plans, and related
links for each tool.
... the
links will become active when information is available.
... tools information tool description
links certutil 2.0 manage certificate and key databases (cert7.db and key3.db).
NSS tools : signtool
if the certificate authority's certificate isn't already installed in your copy of communicator, you typically install it by clicking the appropriate
link on the certificate authority's web site, for example on the page from which you initiated enrollment for your signing certificate.
...note that versions 1.1 and later of netscape signing tool correctly recognizes the codebase attribute, allows paths to be expressed for the class and src attributes instead of filenames only, processes
link tags and parses html correctly, and offers clearer error messages.
... references visible
links 1.
SpiderMonkey Build Documentation
you cannot use headers built for one version/configuration of jsapi to create object files which will be
linked against another.
... using the js-config script in addition to the spidermonkey libraries, header files, and shell, the spidermonkey build also produces a shell script named js-config which other build systems can use to find out how to compile code using the spidermonkey apis, and how to
link with the spidermonkey libraries.
... $ ./js-config --cflags # example output: -i/usr/local/include/js -i/usr/include/nspr when invoked with the --libs option, js-config prints the flags that you should pass to the c compiler when
linking an executable or shared library that uses spidermonkey.
Hacking Tips
nsigned char *) ($pc - 1) = 0x90 (gdb) x /1i $pc - 1 0x7ffff7fb1659: nop (gdb) # set a breakpoint at the previous location (gdb) b *0x7ffff7fb1659 breakpoint 2 at 0x7ffff7fb1659 printing ion generated assembly code (from gdb) if you want to look at the assembly code generated by ionmonkey, you can follow this procedure: place a breakpoint at codegenerator.cpp on the codegenerator::
link method.
...it might be simpler to use the codegenerator::
link lineno instead of the full qualified name to put the breakpoint.
...[new thread 0xf7903b40 (lwp 12563)] [new thread 0xf6bdeb40 (lwp 12564)] run#0 breakpoint 1, js::ion::codegenerator::
link (this=0x86badf8) at /home/code/mozilla-central/js/src/ion/codegenerator.cpp:4780 4780 { (gdb) n 4781 jscontext *cx = getioncontext()->cx; (gdb) n 4783
linker
linker(masm); (gdb) n 4784 ioncode *code =
linker.newcode(cx, jsc::ion_code); (gdb) n 4785 if (!code) (gdb) p code->code_ $1 = (uint8_t *) 0xf7fd25a8 "\201", <incomplete sequence \354\200> (gdb) x/2i 0xf7fd...
Index
385 js_
linkconstructorandprototype jsapi reference, reference, référence(2), spidermonkey js_
linkconstructorandprototype sets the prototype property of class constructor function, ctor, to prototype object, proto with jsprop_permanent | jsprop_readonly flags, and sets the constructor property of proto to ctor with no flag.
... 522 savedframe spidermonkey a savedframe instance is a singly
linked list of stack frames.
... 539 spidermonkey releases spidermonkey the easiest way to fetch the version corresponding to the current firefox release is to visit the treeherder page for the release repository and click on the first sm(pkg)
link you see.
JSAPI User Guide
but mozilla's javascript engine is a library that can be
linked into any c++ program, not just a browser.
... note: the foss wiki page contains a few
links to other libraries and programs that can make life easier when using spidermonkey and jsapi.
... protoobj = js_initclass(cx, globalobj, nullptr, &my_class, /* native constructor function and min arg count */ myclass, 0, /* prototype object properties and methods -- these will be "inherited" by all instances through delegation up the instance's prototype
link.
Thread Sanitizer
# if it's not already in your $path, then uncomment this next line: #export llvm_symbolizer="/path/to/llvm-symbolizer" # add tsan to our compiler flags export cflags="-fsanitize=thread -fpic -pie" export cxxflags="-fsanitize=thread -fpic -pie" # additionally, we need the tsan flag during
linking.
... normally, our c/cxxflags would # be used during
linking as well but there is at least one place in our build where # our cflags are not added during
linking.
... # note: the use of this flag causes clang to automatically
link the tsan runtime :) export ldflags="-fsanitize=thread -fpic -pie" # these three are required by tsan ac_add_options --disable-jemalloc ac_add_options --disable-crashreporter ac_add_options --disable-elf-hack # keep symbols to symbolize tsan traces export moz_debug_symbols=1 ac_add_options --enable-debug-symbols ac_add_options --disable-install-strip # settings for an opt build ac_add_options --enable-optimize="-o2 -gline-tables-only" ac_add_options --disable-debug starting the build process now you start the build process using the regular make -f client.mk command.
Secure Development Guidelines
most memory allocators use a
linked list or binary tree bbv: off-by-one the array index starts at 0 not at 1 char array[1024]; array[0] = first element!
... and descriptors file i/o: filename divided in directories, subdirectories, and the file itself ‘/’ is separator; in windows ‘\’ would work too int openfile(char *file) { handle fh; if (strstr(file, “\”)) return -1; fh = createfilea(file, ...); writefile(fh, data, sizeofdata, null, null); } could be a normal file, directory, device, or
link directory traversal (../../../../) file i/o: file permissions should be set correctly be sure not to make world-writable files sensitive files shouldn’t be world readable file i/o: file descriptors and handles could be a race if instances of fh are shared between threads fh inheritence: default in unix, needs to be set in windows int main(int argc, char **argv, char **envp) { ...
...eck the state of a file at one point in time and immediately after the state might have changed most file name operations suffer from these race conditions, but not when performed on file descriptors file i/o: race conditions consider the following example int main(int argc, char **argv) { char *file = argv[1]; int fd; struct stat statbuf; stat(file, &statbuf); if (s_is
link(statbuf.st_mode)) { bailout(“symbolic
link”); } else if (statbuf.st_uid != getuid) { bailout(“you don’t own the file”); } fd = open(file, o_rdwr); write(fd, argv[2], strlen(argv[2])); } file i/o: race conditions previous example contains a race condition the file may change between the call top stat() and open() this opens the possibilit...
Places utilities for JavaScript
type the content type of the data container the container the data was dropped or pasted into index the index within the container the item was dropped or pasted at copy the drag action was copy, so don't move folders or
links.
...if we don't call this, we'll treat those visits as transition_
link.
...if we don't call this, we'll treat those visits as transition_
link.
Querying Places
this session id is the same for all pages that were reached by clicking
links.
... a new session starts when the user types a new url or follows a bookmark (xxx
link to more details about what constitutes a session).
...the results are of type result_type_full_visit and have additional information about the visit, such as the referring visit, and how the transition happened (typed, redirect,
link, etc).
mozIRegistry
which explains how this information came to be associated with the notion of a "registry." someday (i hope) this page will be properly titled so that everybody knows it is the place to come to in order to find out how they are supposed to
link together the various xpcom components that together form the mozilla browser.
...nsrepository will be modified to use this interface, thereby enabling alternative registry implementations to be substituted at run/
link time.
...in the future, i'll either add the information about it or at least put in a
link to it's documentation.
nsIAccessibleRole
role_
link 30 represents a
link to something else.
...it is used for xul:label@class="text-
link", html:a, html:area, xforms:trigger@appearance="minimal".
... role_combobox_option 115 a item of list that is shown by combobox; role_image_map 116 an image map -- has child
links representing the areas.
nsIDOMNSHTMLDocument
mstring querycommandtext(in domstring commandid); obsolete since gecko 14.0 domstring querycommandvalue(in domstring commandid); void releaseevents(in long eventflags); void routeevent(in nsidomevent evt); void write(); obsolete since gecko 2.0 void writeln(); obsolete since gecko 2.0 attributes attribute type description a
linkcolor domstring same as body.a
link bgcolor domstring same as body.bgcolor compatmode domstring returns "backcompat" if the document is in quirks mode or "css1compat" if the document is in full standards or almost standards mode.
...obsolete since gecko 6.0
linkcolor domstring same as body.
link plugins nsidomhtmlcollection same as embeds for compatibility with netscape 4.x read only.
... v
linkcolor domstring same as body.v
link width long the width of the body element.
nsIFeedContainer
link nsiuri a uri containing the primary
link for the feed or entry.
...
links nsiarray an array of all
links for a feed or entry.
...see also nsiuri nsifeedtextconstruct interwiki
link ...
nsILocalFile
follow
links prbool determines whether or not the nsilocalfile will automatically resolve symbolic
links.
... note: the value of the follow
links attribute is not encoded in the persistent descriptor.
... example #include "pr
link.h" #include "nserror.h" #include "nsilocalfile.h" // load the dll corresponding to the given nsilocalfile...
nsIScriptError
this will be a hyper
link in the javascript console, so you should use a real url.
...this will be a hyper
link in the javascript console, so you should use a real url.
...this will be a hyper
link in the javascript console, so you should use a real url.
nsISelection
when the selection is collapsed(), and the content is focused and editable, the caret will b
link there.
...if content is focused and editable, the caret will b
link there.
...if content is focused and editable, the caret will b
link there.
Using the Gecko SDK
when those classes or functions are used, the component must
link with the corresponding static library.
...if your component does not use any of the glue classes or functions, then you do not need to
link against the glue library.
...
linking (
link line, version script to only expose nsgetmodule, etc.) ...
XPCOM
since binary components are
linked against a single gecko sdk, a dependency to a particular version of gecko is created.
...however, such decoders relied on servers sending correct mime types; images sent with incorrect mime types would not be correctly displayed.xpcom gluethe xpcom glue is a static library which component developers and embedders can
link against.
... it allows developers to
link only against the frozen xpcom method symbols and maintain compatibility with multiple versions of xpcom.xpcom guidethese articles provide tutorials and usage documentation for xpcom, including how to use it in your own projects and how to build xpcom components for your firefox add-ons and the like.xpcom ownership guidelines...naturally.
Tips and Tricks from the newsgroups
please feel free to add
links to threads.
... we will add a categorization system as the
link list grows.
... extensions load an extension in its own tab run shell scripts from an extension (for example, to create a sym
link) get extension metadata call java from thunderbird extensions (also an example here, written for firefox but compatible with thunderbird 3.x) define a custom protocol handler to call an external program save attachment and send it repeat image display using css sprites messages use reminderfox to open a message in the default thunderbird message window (when messageuri, folderuri and gdbview are unknown) determine whether a message has been flagged as junk imap: getting message key of copied message by nsimsgcopyservice::copyfilemessage access the plain text content...
Using COM from js-ctypes
this started out with dynamic data exchange (dde), which was superseded by object
linking and embedding (ole) and later by the component object model (com), automation objects, activex controls, and the .net framework.
... ishellitem ifileoperation ishell
link & ipersistfile - create shortcut files.
... example a - based on bugzilla :: bug 738501 - attachement 608538 exmaple b - based on example a ishell
link & ipersistfile & ipropertystore - uses ipropertystore to set and get the system.usermodelapp.id on shortcut files.
about:debugging - Firefox Developer Tools
if it still doesn't appear, it may be because the
link between your android device and your computer is not authorized yet.
... manifest url if you click the
link, the manifest for this extension is loaded in a new tab.
... just as it does with temporarily loaded extensions, the
link next to manifest url opens the loaded manifest in a new tab.
AudioBufferSourceNode - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/audionode" target="_top"><rect x="151" y="1" width="90" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="196" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">audionode</text></a><polyline points="241,25 251,20 251,30 241,25" stroke="#d4dde4" fill="none"/><line x1="251" y1="25" x2="281" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/audioscheduledsourcenode" target="_top"><rect x="281" y="1" width="240" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="401" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" ...
...alignment-baseline="middle">audioscheduledsourcenode</text></a><polyline points="521,25 531,20 531,30 521,25" stroke="#d4dde4" fill="none"/><line x1="531" y1="25" x2="561" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/audiobuffersourcenode" target="_top"><rect x="561" y="1" width="210" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="666" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">audiobuffersourcenode</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} an audiobuffersourcenode has no inputs and exactly one output, which has the same number of channels as the audiobuffer indicated by its buffer property.
AudioContext - Web APIs
the audiocontext interface represents an audio-processing graph built from audio modules
linked together, each represented by an audionode.
... <div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/audiocontext" target="_top"><rect x="151" y="1" width="120" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="211" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">audiocontext</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor audiocontext() creates and returns a new audiocontext object.
AudioNode - Web APIs
a filter like biquadfilternode or convolvernode), or volume control (like gainnode) <div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/audionode" target="_top"><rect x="151" y="1" width="90" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="196" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">audionode</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} note: an audionode can be target of events, therefore it implements the eventtarget interface.
...you can find examples of such usage on any of the examples
linked to on the web audio api landing page (for example violent theremin.) const audioctx = new audiocontext(); const oscillator = new oscillatornode(audioctx); const gainnode = new gainnode(audioctx); oscillator.connect(gainnode).connect(audioctx.destination); oscillator.context; oscillator.numberofinputs; oscillator.numberofoutputs; oscillator.channelcount; specifications specificat...
Blob - Web APIs
a
link to open that object url is created.
... click the
link to see the decoded object url.</p> javascript the main piece of this code for example purposes is the typedarraytourl() function, which creates a blob from the given typed array and returns an object url for it.
... function typedarraytourl(typedarray, mimetype) { return url.createobjecturl(new blob([typedarray.buffer], {type: mimetype})) } const bytes = new uint8array(59); for(let i = 0; i < 59; i++) { bytes[i] = 32 + i; } const url = typedarraytourl(bytes, 'text/plain'); const
link = document.createelement('a');
link.href = url;
link.innertext = 'open the array url'; document.body.appendchild(
link); result click the
link in the example to see the browser decode the object url.
CDATASection - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link:href="/docs/web/api/characterdata" target="_top"><rect x="266" y="1" width="130" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="331" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline=...
..."middle">characterdata</text></a><polyline points="396,25 406,20 406,30 396,25" stroke="#d4dde4" fill="none"/><line x1="406" y1="25" x2="436" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/text" target="_top"><rect x="436" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="473.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">text</text></a><polyline points="511,25 521,20 521,30 511,25" stroke="#d4dde4" fill="none"/><line x1="521" y1="25" x2="529" y2="25" stroke="#d4dde4"/><line x1="529" y1="25" x2="529" y2="90" stroke="#d4dde4"/><line x1="529" y1="90" x2="512" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/cdatasection" target="_top"><rect x=...
CSSStyleSheet - Web APIs
as the stylesheet list cannot be modified directly, there's no useful way to create a new cssstylesheet object manually (although constructable stylesheet objects is coming to the web platform soon and is already supported in b
link).
... to create a new stylesheet, insert a <style> or <
link> element into the document.
... stylesheets list getting the owner element/rule given the style sheet object the interface for the owner object getting the cssstylesheet object from the owner <style> and <
link> elements in the document yes .ownernode html
linkelement, htmlstyleelement, or svgstyleelement .sheet css @import rule in other style sheets applied to the document yes .ownerrule cssimportrule .stylesheet <?xml-stylesheet ?> processing instruction in the (non-html) document yes .ownernode processinginstruction .sheet http
link header ...
Comment - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link:href="/docs/web/api/characterdata" target="_top"><rect x="266" y="1" width="130" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="331" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline=...
..."middle">characterdata</text></a><polyline points="396,25 406,20 406,30 396,25" stroke="#d4dde4" fill="none"/><line x1="406" y1="25" x2="436" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/comment" target="_top"><rect x="436" y="1" width="75" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="473.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">comment</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface has no specific property, but inherits those of its parent, characterdata, and indirectly those of node.
DataTransfer - Web APIs
the value must be none, copy,
link or move.
...must be one of none, copy, copy
link, copymove,
link,
linkmove, move, all or uninitialized.
... examples every method 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.
Event.defaultPrevented - Web APIs
example this example logs attempts to visit
links from two <a> elements.
... javascript is used to prevent the second
link from working.
... html <p><a id="
link1" href="#
link1">visit
link 1</a></p> <p><a id="
link2" href="#
link2">try to visit
link 2</a> (you can't)</p> <p id="log"></p> javascript function stop
link(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', stop
link); document.addeventlistener('click', logclick); result specifications specification status comment domthe definition of 'event.defaultprevented()' in that ...
GlobalEventHandlers.onmousemove - Web APIs
examples tooltips this example creates
link tooltips that follow your mouse.
... html <p><a href="#" data-tooltip="first
link">see a tooltip here …</a></p> <p><a href="#" data-tooltip="second
link">… or here!</a></p> css .tooltip { position: absolute; z-index: 9999; padding: 6px; background: #ffd; border: 1px #886 solid; border-radius: 5px; } javascript const tooltip = new (function() { const node = document.createelement('div'); node.classname = 'tooltip'; node.setattribute('hidden', ''); document.body.appendchild(node); this.follow = function(event) { node.style.left = event.clientx + 20 + 'px'; node.style.top = event.clienty + 10 + 'px'; }; this.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.
HTMLBRElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlbrelement" target="_top"><rect...
HTMLBaseElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlbaseelement" target="_top"><re...
HTMLButtonElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlbuttonelement" target="_top"><...
HTMLCanvasElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlcanvaselement" target="_top"><...
HTMLDListElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmldlistelement" target="_top"><r...
HTMLDataElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmldataelement" target="_top"><re...
HTMLDataListElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmldatalistelement" target="_top"...
HTMLDivElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmldivelement" target="_top"><rec...
HTMLDocument - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link:href="/docs/web/api/document" target="_top"><rect x="266" y="1" width="80" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="306" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middl...
...e">document</text></a><polyline points="346,25 356,20 356,30 346,25" stroke="#d4dde4" fill="none"/><line x1="356" y1="25" x2="386" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/htmldocument" target="_top"><rect x="386" y="1" width="120" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="446" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmldocument</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} for the purposes of web development, you can generally think of htmldocument as an alias for document, upon which htmldocument is based.
HTMLElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link:href="/docs/web/api/htmlelement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#f4f7f8" 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></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, element, and implements those from documentandelementeventhandlers, elementcssinlinestyle, globaleventhandlers, htmlorforeignelement and toucheventhandlers.
HTMLEmbedElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlembedelement" target="_top"><r...
HTMLFieldSetElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlfieldsetelement" target="_top"...
HTMLFormElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlformelement" target="_top"><re...
HTMLHRElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlhrelement" target="_top"><rect...
HTMLHeadElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlheadelement" target="_top"><re...
HTMLHeadingElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlheadingelement" target="_top">...
HTMLHtmlElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlhtmlelement" target="_top"><re...
HTMLInputElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlinputelement" target="_top"><r...
HTMLLIElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmllielement" target="_top"><rect...
HTMLLabelElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmllabelelement" target="_top"><r...
HTMLLegendElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmllegendelement" target="_top"><...
HTMLMapElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlmapelement" target="_top"><rec...
HTMLMediaElement.onencrypted - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 8.571428571428571%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-20 0 700 60" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlmediaelement" target="_top"><r...
HTMLMediaElement.onwaitingforkey - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 8.571428571428571%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-20 0 700 60" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlmediaelement" target="_top"><r...
HTMLMediaElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 30%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 180" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlmediaelement" target="_top"><r...
HTMLMenuElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlmenuelement" target="_top"><re...
HTMLMenuItemElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlmenuitemelement" target="_top"...
HTMLMetaElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlmetaelement" target="_top"><re...
HTMLMeterElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlmeterelement" target="_top"><r...
HTMLModElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlmodelement" target="_top"><rec...
HTMLOListElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlolistelement" target="_top"><r...
HTMLObjectElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlobjectelement" target="_top"><...
HTMLOptGroupElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmloptgroupelement" target="_top"...
HTMLOptionElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmloptionelement" target="_top"><...
HTMLOutputElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmloutputelement" target="_top"><...
HTMLParagraphElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlparagraphelement" target="_top...
HTMLParamElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlparamelement" target="_top"><r...
HTMLPictureElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlpictureelement" target="_top">...
HTMLPreElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlpreelement" target="_top"><rec...
HTMLProgressElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlprogresselement" target="_top"...
HTMLQuoteElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlquoteelement" target="_top"><r...
HTMLScriptElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlscriptelement" target="_top"><...
HTMLSelectElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlselectelement" target="_top"><...
HTMLShadowElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1...
...="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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" 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 x
link:href="/docs/web/api/htmlshadowelement" target="_top"><rect...
HTMLSourceElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlsourceelement" target="_top"><...
HTMLSpanElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlspanelement" target="_top"><re...
HTMLTableCaptionElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmltablecaptionelement" target="_...
HTMLTableCellElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmltablecellelement" target="_top...
HTMLTableColElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmltablecolelement" target="_top"...
HTMLTableElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmltableelement" target="_top"><r...
HTMLTableRowElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmltablerowelement" target="_top"...
HTMLTableSectionElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmltablesectionelement" target="_...
HTMLTemplateElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="1...
...21" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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">ele...
...ment</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 x
link: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" 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 x
link:href="/docs/web/api/htmltemplateelement" target="_top"><rect ...
HTMLTimeElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmltimeelement" target="_top"><re...
HTMLTitleElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmltitleelement" target="_top"><r...
HTMLTrackElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmltrackelement" target="_top"><r...
HTMLUListElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlulistelement" target="_top"><r...
HTMLUnknownElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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" 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 x
link:href="/docs/web/api/htmlunknownelement" target="_top">...
Timing element visibility with the Intersection Observer API - Web APIs
we'll be using css grid to style and lay out the site, so we can be pretty straightforward here: <div class="wrapper"> <header> <h1>a fake blog</h1> <h2>showing intersection observer in action!</h2> </header> <aside> <nav> <ul> <li><a href="#
link1">a
link</a></li> <li><a href="#
link2">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.
...below that, we define the site's sidebar as a list of
links within an <aside> block.
... the sidebar our sidebar is used to present
links to other pages on the site.
KeyboardEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/uievent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="153.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">uievent</text></a><polyline points="191,25 201,20 201,30 191,25" stroke="#d4dde4" fill="none"/><line x1="201" y1="25" x2="231" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/keyboardevent" target="_top"><rect x="231" y="1" width="130" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="296" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle...
...in the list below, each event
links to the documentation for the document handler for the event, which applies generally to all of the recipients.
Location - Web APIs
the location interface represents the location (url) of the object it is
linked to.
...both the document and window interface have such a
linked location, accessible via document.location and window.location respectively.
...it is a synonym for htmlhyper
linkelementutils.href, though it can't be used to modify the value.
MediaSource - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/mediasource" target="_top"><rect x="151" y="1" width="110" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="206" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">mediasource</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor mediasource() constructs and returns a new mediasource object with no associated source buffers.
...this example was written by nick desaulniers and can be viewed live here (you can also download the source for further investigation.) var video = document.queryselector('video'); var asseturl = 'frag_bunny.mp4'; // need to be specific for b
link regarding codecs // ./mp4info frag_bunny.mp4 | grep codec var mimecodec = 'video/mp4; codecs="avc1.42e01e, mp4a.40.2"'; if ('mediasource' in window && mediasource.istypesupported(mimecodec)) { var mediasource = new mediasource(); //console.log(mediasource.readystate); // closed video.src = url.createobjecturl(mediasource); mediasource.addeventlistener('sourceopen', sourceopen); } else { ...
Recording a media element - Web APIs
the "download" button's
link is then set to refer to the stream as well.
...then url.createobjecturl() is used to create an url that references the blob; this is then made the value of the recorded video playback element's src attribute (so that you can play the video from the blob) as well as the target of the download button's
link.
...so by setting the download
link's download attribute to "recordedvideo.webm", we tell the browser that clicking the button should download a file named "recordedvideo.webm" whose contents are the recorded video.
Navigator.registerProtocolHandler() - Web APIs
for example, you can register to handle sms text message
links by passing the "sms" scheme.
...this will be displayed to the user, such as prompting “allow this site to handle [scheme]
links?” or listing registered handlers in the browser’s settings.
... otherwise, the scheme must be one of the following: bitcoin geo im irc ircs magnet mailto mms news nntp openpgp4fpr sip sms smsto ssh tel urn webcal wtai xmpp example if your site is burgers.example.com, you can register a protocol handler for it to handle web+burger:
links, like so: navigator.registerprotocolhandler("web+burger", "https://burgers.example.com/?burger=%s", "burger handler"); this creates a handler that lets web+burger:
links send the user to your site, inserting the accessed burger url into the %s placeholder.
NetworkInformation - Web APIs
networkinformation.down
link read only returns the effective bandwidth estimate in megabits per second, rounded to the nearest multiple of 25 kilobits per seconds.
... networkinformation.down
linkmax read only returns the maximum down
link speed, in megabits per second (mbps), for the underlying connection technology.
...this value is determined using a combination of recently observed round-trip time and down
link values.
OfflineAudioContext - Web APIs
the offlineaudiocontext interface is an audiocontext interface representing an audio-processing graph built from
linked together audionodes.
... <div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/audiocontext" target="_top"><rect x="151" y="1" width="120" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="211" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">audiocontext</text></a><polyline points="271,25 281,20 281,30 271,25" stroke="#d4dde4" fill="none"/><line x1="281" y1="25" x2="311" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/offlineaudiocontext" target="_top"><rect x="311" y="1" width="190" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="mid...
ProcessingInstruction - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 10%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 700 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link:href="/docs/web/api/characterdata" target="_top"><rect x="266" y="1" width="130" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="331" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline=...
..."middle">characterdata</text></a><polyline points="396,25 406,20 406,30 396,25" stroke="#d4dde4" fill="none"/><line x1="406" y1="25" x2="436" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/processinginstruction" target="_top"><rect x="436" y="1" width="210" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="541" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">processinginstruction</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties target (domstring) read only a name identifying the application to which the instruction is targeted, specification specification status comment domthe definition of...
RTCConfiguration - Web APIs
constants rtcbundlepolicy enum the rtcbundlepolicy enum defines string constants which are used to request a specific policy for gathering ice candidates if the remote peer isn't "bundle-aware" (compatible with the sdp bundle standard for bundling multiple media streams on a single transport
link).
...<<<add a
link to info about multiplexed rtcp.
... <<<--- add
link to information about identity --->>> example the configuration below establishes two ice servers.
SVGAElement.target - Web APIs
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.
... syntax my
link.target = 'value'; value an svganimatedstring indicating the ending resource target that opens the document when the
link is activated.
...var
linkref = document.queryselector('a');
linkref.target ='_blank'; ...
SVGAnimationElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svganimationelement" target="_top"><...
SVGClipPathElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgclippathelement" target="_top"><r...
SVGComponentTransferFunctionElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgcomponenttransferfunctionelement"...
SVGCursorElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgcursorelement" target="_top"><rec...
SVGDescElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25" x2="...
...151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgdescelement" target="_top"><rect x="341" y="65" width="1...
SVGElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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 from: documentandelementeventhandlers, element, elementcssinlinestyle, globaleventhandlers, htmlorforeignelement, svgelementinstance svgelement.datasetread only a domstringmap object which provides a...
SVGFEBlendElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25...
..." x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfeblendelement" target="_top"><rect x="311" y="65"...
SVGFEColorMatrixElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1=...
..."121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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">e...
...lement</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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfecolormatrixelement" target="_top"><r...
SVGFEComponentTransferElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfecomponenttransferelement" targe...
SVGFECompositeElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121...
..." y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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">eleme...
...nt</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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfecompositeelement" target="_top"><rect x=...
SVGFEConvolveMatrixElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfeconvolvematrixelement" target="...
SVGFEDiffuseLightingElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfediffuselightingelement" target=...
SVGFEDisplacementMapElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfedisplacementmapelement" target=...
SVGFEDistantLightElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x...
...1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfedistantlightelement" target="_top"...
SVGFEDropShadowElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="1...
...21" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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">ele...
...ment</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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfedropshadowelement" target="_top"><rect...
SVGFEFloodElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25...
..." x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfefloodelement" target="_top"><rect x="311" y="65"...
SVGFEGaussianBlurElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x...
...1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfegaussianblurelement" target="_top"...
SVGFEImageElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25...
..." x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfeimageelement" target="_top"><rect x="311" y="65"...
SVGFEMergeElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25...
..." x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfemergeelement" target="_top"><rect x="311" y="65"...
SVGFEMergeNodeElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121...
..." y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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">eleme...
...nt</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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfemergenodeelement" target="_top"><rect x=...
SVGFEMorphologyElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="1...
...21" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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">ele...
...ment</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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfemorphologyelement" target="_top"><rect...
SVGFEOffsetElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="...
...25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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</te...
...xt></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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfeoffsetelement" target="_top"><rect x="301" y="...
SVGFEPointLightElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="1...
...21" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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">ele...
...ment</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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfepointlightelement" target="_top"><rect...
SVGFESpecularLightingElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfespecularlightingelement" target...
SVGFESpotLightElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121...
..." y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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">eleme...
...nt</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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfespotlightelement" target="_top"><rect x=...
SVGFETileElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25" ...
...x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfetileelement" target="_top"><rect x="321" y="65" wi...
SVGFETurbulenceElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="1...
...21" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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">ele...
...ment</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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfeturbulenceelement" target="_top"><rect...
SVGFilterElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgfilterelement" target="_top"><rec...
SVGGradientElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggradientelement" target="_top"><r...
SVGGraphicsElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svggraphicselement" target="_top"><r...
SVGMPathElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25" x2...
...="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgmpathelement" target="_top"><rect x="331" y="65" width...
SVGMaskElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="midd...
...le">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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgmaskelement" target="_top"><rect ...
SVGMetadataElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="...
...25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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</te...
...xt></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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgmetadataelement" target="_top"><rect x="301" y="...
SVGPatternElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25...
..." x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgpatternelement" target="_top"><rect x="311" y="65"...
SVGScriptElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="...
...25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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</te...
...xt></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 x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgscriptelement" target="_top"><rect x="321" y="65...
SVGStopElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25" x2="...
...151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgstopelement" target="_top"><rect x="341" y="65" width="1...
SVGSymbolElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25" ...
...x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgsymbolelement" target="_top"><rect x="321" y="65" wi...
SVGTitleElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25" x2...
...="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link: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="25" stroke="#d4dde4"/><a x
link: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="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a x
link:href="/docs/web/api/svgtitleelement" target="_top"><rect x="331" y="65" width...
SourceBuffer - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/sourcebuffer" target="_top"><rect x="151" y="1" width="120" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="211" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">sourcebuffer</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties sourcebuffer.appendwindowend controls the timestamp for the end of the append window.
...this example was written by nick desaulniers and can be viewed live here (you can also download the source for further investigation.) var video = document.queryselector('video'); var asseturl = 'frag_bunny.mp4'; // need to be specific for b
link regarding codecs // ./mp4info frag_bunny.mp4 | grep codec var mimecodec = 'video/mp4; codecs="avc1.42e01e, mp4a.40.2"'; if ('mediasource' in window && mediasource.istypesupported(mimecodec)) { var mediasource = new mediasource(); //console.log(mediasource.readystate); // closed video.src = url.createobjecturl(mediasource); mediasource.addeventlistener('sourceopen', sourceopen); } else { ...
Text - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link:href="/docs/web/api/characterdata" target="_top"><rect x="266" y="1" width="130" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="331" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline=...
..."middle">characterdata</text></a><polyline points="396,25 406,20 406,30 396,25" stroke="#d4dde4" fill="none"/><line x1="406" y1="25" x2="436" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/text" target="_top"><rect x="436" y="1" width="75" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="473.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">text</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor text() returns a text node with the parameter as its textual content.
WebGLRenderingContext.getProgramInfoLog() - Web APIs
it contains errors that occurred during failed
linking or validation of webglprogram objects.
... return value a domstring that contains diagnostic messages, warning messages, and other information about the last
linking or validation operation.
... examples checking program errors var program = gl.createprogram(); // attach pre-existing shaders gl.attachshader(program, vertexshader); gl.attachshader(program, fragmentshader); gl.
linkprogram(program); gl.getprograminfolog(program); specifications specification status comment webgl 1.0the definition of 'getprograminfolog' in that specification.
WebGLRenderingContext.vertexAttribPointer() - Web APIs
this must be done before calling gl.
linkprogram().
...coordinates, normalized to [0, 1] gl.vertexattribpointer(2, 2, gl.unsigned_short, true, 20, 16); gl.enablevertexattribarray(2); //set the attributes in the vertex shader to the same indices gl.bindattriblocation(shaderprogram, 0, 'position'); gl.bindattriblocation(shaderprogram, 1, 'normal'); gl.bindattriblocation(shaderprogram, 2, 'texuv'); //since the attribute indices have changed, we must re-
link the shader //note that this will reset all uniforms that were previously set.
... gl.
linkprogram(shaderprogram); or we can use the index provided by the graphics card instead of setting the index ourselves; this avoids the re-
linking of the shader program.
WheelEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/uievent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="153.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">uievent</text></a><polyline points="191,25 201,20 201,30 191,25" stroke="#d4dde4" fill="none"/><line x1="201" y1="25" x2="231" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/mouseevent" target="_top"><rect x="231" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="281" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">mous...
...eevent</text></a><polyline points="331,25 341,20 341,30 331,25" stroke="#d4dde4" fill="none"/><line x1="341" y1="25" x2="371" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/wheelevent" target="_top"><rect x="371" y="1" width="100" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="421" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">wheelevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor wheelevent() creates a wheelevent object.
window.location - Web APIs
ipt> function shownode (onode) { document.documentelement.scrolltop = onode.offsettop; document.documentelement.scrollleft = onode.offsetleft; } function showbookmark (sbookmark, busehash) { if (arguments.length === 1 || busehash) { location.hash = sbookmark; return; } var obookmark = document.queryselector(sbookmark); if (obookmark) { shownode(obookmark); } } </script> <style> span.int
link { cursor: pointer; color: #0000ff; text-decoration: underline; } </style> </head> <body> <p>lorem ipsum dolor sit amet, consectetur adipiscing elit.
...praesent bibendum condimentum feugiat.</p> <p id="mybookmark1">[ <span class="int
link" onclick="showbookmark('#mybookmark2');">go to bookmark #2</span> ]</p> <p>vivamus blandit massa ut metus mattis in fringilla lectus imperdiet.
...pellentesque porttitor facilisis ultricies.</p> <p id="mybookmark2">[ <span class="int
link" onclick="showbookmark('#mybookmark1');">go to bookmark #1</span> | <span class="int
link" onclick="showbookmark('#mybookmark1', false);">go to bookmark #1 without using location.hash</span> | <span class="int
link" onclick="showbookmark('#mybookmark3');">go to bookmark #3</span> ]</p> <p>phasellus tempus fringilla nunc, eget sagittis orci molestie vel.
XMLDocument - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link:href="/docs/web/api/document" target="_top"><rect x="266" y="1" width="80" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="306" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middl...
...e">document</text></a><polyline points="346,25 356,20 356,30 346,25" stroke="#d4dde4" fill="none"/><line x1="356" y1="25" x2="386" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/xmldocument" target="_top"><rect x="386" y="1" width="110" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="441" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">xmldocument</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} property also inherits properties from: document xmldocument.async used with xmldocument.load() to indicate an asynchronous request.
ARIA: Main role - Accessibility
for those navigating via landmark roles, the main role is an alternative for "skip to main content"
links.there should only be one main landmark role per document.
... adding an id attribute to the element with a declaration of role="main" allows it to be a target of a skip navigation
link.
... <body> <a href="#main-content">skip to main content</a> <!-- navigation and header content --> <div id="main-content" role="main"> <!-- main page content --> </div> </body> webaim: "skip navigation"
links added benefits certain technologies such as browser extensions can generate lists of all landmark roles present on a page, allowing non-screen reader users to also quickly identify and navigate to large sections of the document.
Accessibility Information for Web Authors - Accessibility
the output data report is displayed in a clear and well structured table where each and all checkpoints are identified and described (along with an helpful clickable
link to the related reference guideline) into logical groups and according to measurable results: passed, warning, failed for automated verification, warning for manual verification, not selected, not available, not related, etc.
...you can also add a wave bookmarklet in firefox or even wave direct
links for checking a webpage.
...two panes are added at the bottom of the view source code window: the left pane contains the errors and warnings (with their correspondent line number) and the right pane identifies the checkpoint along with an example and a clickable
link to the reference/guideline.
Mobile accessibility checklist - Accessibility
colour colour contrast must comply with wcag 2.1 aa level requirements: contrast ratio of 4.5:1 for normal text (less than 18 point or 14 point bold.) contrast ratio of 3:1 for large text (at least 18 point or 14 point bold.) information conveyed via colour must be also available by other means too (underlined text for
links, etc.) visibility content hiding techniques such as zero opacity, z-index order and off-screen placement must not be used exclusively to handle visibility.
... focus all activatable elements must be focusable: standard controls such as
links, buttons, and form fields are focusable by default.
... non-standard controls must have an appropriate aria role assigned to them, such as button,
link, or checkbox.
Web accessibility for seizures and physical reactions - Accessibility
content that flickers, flashes, or b
links can trigger photosensitive epilepsy.
... seizures vestibuler disordera migraines nausea vomiting flashing, b
linking, & flickering although "flashing" and "b
linking" are sometimes used interchangably, they are not the same.
... according to the w3c, b
linking is a distraction problem, whereas flashing refers to content that occurs more than 3 times per second, is large enough, and bright enough.
:hover - CSS: Cascading Style Sheets
/* selects any <a> element when "hovered" */ a:hover { color: orange; } styles defined by the :active pseudo-class will be overridden by any subsequent
link-related pseudo-class (:
link, :visited, or :active) that has at least equal specificity.
... to style
links appropriately, put the :hover rule after the :
link and :visited rules but before the :active one, as defined by the lvha-order: :
link — :visited — :hover — :active.
... syntax :hover examples basic example html <a href="#">try hovering over this
link.</a> css a { background-color: powderblue; transition: background-color .5s; } a:hover { background-color: gold; } result image gallery you can use the :hover pseudo-class to build an image gallery with full-size images that show only when the mouse moves over a thumbnail.
Realizing common layouts using CSS Grid Layout - CSS: Cascading Style Sheets
each item contains a heading, some text of varying height, and a call to action
link.
...div class="cta"><a href="">call to action!</a></div> </li> <li> <h2>item five</h2> <div class="body"><p>the content of this listing item goes here.</p></div> <div class="cta"><a href="">call to action!</a></div> </li> </ul> * {box-sizing: border-box;} img {max-width: 100%; display: block;} body { font: 1.2em helvetica, arial, sans-serif; } a:
link, a:visited { text-decoration: none; color: #f08c00; } h2 { background-color: #f08c00; color: #fff; text-align: center; margin: 0; padding: 20px; } we are going to create a grid with a flexible number of flexible columns.
...<div class="cta"><a href="">call to action!</a></div> </li> <li> <h2>item five</h2> <div class="body"><p>the content of this listing item goes here.</p></div> <div class="cta"><a href="">call to action!</a></div> </li> </ul> * {box-sizing: border-box;} img {max-width: 100%; display: block;} body { font: 1.2em helvetica, arial, sans-serif; } a:
link, a:visited { text-decoration: none; color: #f08c00; } h2 { background-color: #f08c00; color: #fff; text-align: center; margin: 0; padding: 20px; } .listing li { border: 1px solid #ffe066; border-radius: 5px; display: flex; flex-direction: column; } .listing .cta { margin-top: auto; border-top: 1px solid #ffe066; padding: 10px; ...
CSS Layout cookbook - CSS: Cascading Style Sheets
css grid, flexbox split navigation a navigation pattern where some
links are visually separated from the others.
... flexbox, margin breadcrumb navigation creating a list of
links to allow the visitor to navigate back up through the page hierarchy.
... flexbox, box alignment pagination
links to pages of content (such as search results).
Mozilla CSS extensions - CSS: Cascading Style Sheets
border-style and outline-style -moz-bg-insetobsolete since gecko 1.9 -moz-bg-outsetobsolete since gecko 1.9 -moz-bg-solidobsolete since gecko 1.9 <color> keywords -moz-activehyper
linktext -moz-hyper
linktext -moz-visitedhyper
linktext -moz-buttondefault -moz-buttonhoverface -moz-buttonhovertext -moz-default-background-color -moz-default-color -moz-cellhighlight -moz-cellhighlighttext -moz-field -moz-fieldtext -moz-dialog -moz-dialogtext -moz-dragtargetzone -moz-mac-accentdarkestshadow -moz-mac-accentdarkshadow -moz-mac-accentface -moz-mac-accentlightesthighligh...
...t -moz-mac-accentlightshadow -moz-mac-accentregularhighlight -moz-mac-accentregularshadow -moz-mac-chrome-active -moz-mac-chrome-inactive -moz-mac-focusring -moz-mac-menuselect -moz-mac-menushadow -moz-mac-menutextselect -moz-menuhover -moz-menuhovertext -moz-win-communicationstext -moz-win-mediatext -moz-nativehyper
linktext display -moz-box -moz-inline-block -moz-inline-box -moz-inline-gridobsolete since gecko 62 -moz-inline-stackobsolete since gecko 62 -moz-inline-table -moz-gridobsolete since gecko 62 -moz-grid-groupobsolete since gecko 62 -moz-grid-lineobsolete since gecko 62 -moz-groupbox -moz-deckobsolete since gecko 62 -moz-popupobsolete since gecko 62 -moz-stackobsolete since gecko 62 -moz-markerobsolete since gecko 62 empty-cells -moz-...
...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-handler-blocked :-moz-handler-crashed :-moz-handler-disabled ::-moz-inline-table l :-moz-last-node :-moz-list-bullet :-moz-list...
Pseudo-classes - CSS: Cascading Style Sheets
index of standard pseudo-classes :active :any-
link :blank :checked :current :default :defined :dir() :disabled :drop :empty :enabled :first :first-child :first-of-type :fullscreen :future :focus :focus-visible :focus-within :has() :host :host() :host-context() :hover :indeterminate :in-range :invalid :is() :lang() :last-child :last-of-type :left :
link :local-
link :not() :nth-child() :nth...
... selectors level 4 working draft defined :any-
link, :blank, :local-
link, :scope, :drop, :current, :past, :future, :placeholder-shown, :user-invalid, :nth-col(), :nth-last-col(), :is() and :where().
... css level 1 recommendation defined :
link, :visited and :active, but without the associated semantic meaning.
content - CSS: Cascading Style Sheets
8e5); /* alt text for generated content, added in the level 3 specification */ content: url("http://www.example.com/test.png") / "this is the alt text"; /* values below can only be applied to generated content using ::before and ::after */ /* <string> value */ content: "prefix"; /* <counter> values */ content: counter(chapter_counter); content: counters(section_counter, "."); /* attr() value
linked to the html attribute value */ 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 ...
...</p> css q { color: blue; } q::before { content: open-quote; } q::after { content: close-quote; } h1::before { content: "chapter "; /* the trailing space creates separation between the added content and the rest of the content */ } result image combined with text this example inserts an image before the
link.
...ew-entry">halloween stories</li> <li>my biography</li> <li class="new-entry">vampire romance</li> </ol> css .new-entry::after { content: " new!"; /* the leading space creates separation between the added content and the rest of the content */ color: red; } result images and element attributes this example inserts an image before each
link, and adds its id attribute after.
HTML5 Parser - Developer guides
attributes in the x
link namespace must use the prefix x
link (e.g.
... x
link:href).
... please note that you shouldn't use end tags for void elements that don't have end tags: <area>, <base>, <br>, <col>, <command>, <embed>, <hr>, <img>, <input>, <keygen>, <
link>, <meta>, <param>, <source> and <wbr>.
Index - Developer guides
ax, dom, json, javascript, references, xmlhttprequest asynchronous javascript and xml, while not a technology in itself, is a term coined in 2005 by jesse james garrett, that describes a "new" approach to using a number of existing technologies together 3 community ajax if you know of useful mailing lists, newsgroups, forums, or other communities related to ajax, please
link to them here.
... 29 index guide, index found 31 pages: 30 introduction to web development beginner, css, codingscripting, development, html, javascript, web whether you're just getting started with web development, or are just expanding your horizons into new realms of web awesomeness, the
links here should help you get started.
...this article provides recommendations for managing user input and implementing controls in open web apps, along with faqs, real-world examples, and
links to further information for anyone needing more detailed information on the underlying technologies.
<audio>: The Embed Audio element - HTML: Hypertext Markup Language
here is a <a href="myaudio.mp4">
link to the audio</a> instead.</p> </audio> we offer a substantive and thorough guide to media file types and the audio codecs that can be used within them.
... also it's a good practice to provide some content (such as the direct download
link) as a fallback for viewers who use a browser in which the <audio> element is not supported: <audio controls> <source src="myaudio.mp3" type="audio/mpeg"> <source src="myaudio.ogg" type="audio/ogg"> <p> your browser doesn't support html5 audio.
... here is a <a href="myaudio.mp4">
link to download the audio</a> instead.
<base>: The Document Base URL element - HTML: Hypertext Markup Language
if either of the following attributes are specified, this element must come before other elements with attribute values of urls, such as <
link>’s href attribute.
... in-page anchors
links pointing to a fragment in the document — e.g.
...for example: given <base href="https://example.com"> ...and this
link: <a href="#anchor">anker</a> ...the
link points to https://example.com/#anchor.
<main> - HTML: Hypertext Markup Language
content that is repeated across a set of documents or document sections such as sidebars, navigation
links, copyright information, site logos, and search forms shouldn't be included unless the search form is the main function of the page.
... adding an id attribute to the <main> element lets it be a target of a skip navigation
link.
... <body> <a href="#main-content">skip to main content</a> <!-- navigation and header content --> <main id="main-content"> <!-- main page content --> </main> </body> webaim: "skip navigation"
links reader mode browser reader mode functionality looks for the presence of the <main> element, as well as heading and content sectioning elements when converting content into a specialized reader view.
<nextid>: The NeXT ID element (Obsolete) - HTML: Hypertext Markup Language
<form>, <input>, <textarea>, <select>, and <option> html version 2 strict level 1 this is like regular level 1 but it also excludes these depreciated elements, along with such constructs as nesting a header (<h*> element) within a
link (<a> element) html version 2 level 2 this is the default and includes and permits all html level 2 functions and elements and attributes html version 2 strict level 2 this excludes these depreciated elements and also forbids such constructs as nesting a header (<h*> element) within a
link (<a> element), or having a forms <input> element which is not within a block level element such as <p> h...
...</title> <
link, meta, base, etc.
...</title> <
link, meta, base, etc.
<noscript> - HTML: Hypertext Markup Language
permitted content when scripting is disabled and when it is a descendant of the <head> element: in any order, zero or more <
link> elements, zero or more <style> elements, and zero or more <meta> elements.
... examples <noscript> <!-- anchor
linking to external file --> <a href="https://www.mozilla.com/">external
link</a> </noscript> <p>rocks!</p> result with scripting enabled rocks!
... result with scripting disabled external
link rocks!
<style>: The Style Information element - HTML: Hypertext Markup Language
in general, it is better to put your styles in external stylesheets and apply them using <
link> elements.
... if you include multiple <style> and <
link> elements in your document, they will be applied to the dom in the order they are included in the document — make sure you include them in the correct order, to avoid unexpected cascade issues.
... in the same manner as <
link> elements, <style> elements can include media attributes that contain media queries, allowing you to selectively apply internal stylesheets to your document depending on media features such as viewport width.
hidden - HTML: Hypertext Markup Language
hidden elements shouldn't be
linked from non-hidden elements, and elements that are descendants of a hidden element are still active, which means that script elements can still execute and form elements can still submit.
... for example, it would be incorrect to use the href attribute to
link to a section marked with the hidden attribute.
... if the content is not applicable or relevant, then there is no reason to
link to it.
An overview of HTTP - HTTP
this means some parts of displayed text are
links which can be activated (usually by a click of the mouse) to fetch a new web page, allowing the user to direct their user-agent and navigate through the web.
... http is stateless, but not sessionless http is stateless: there is no
link between two requests being successively carried out on the same connection.
... sessions using http cookies allows you to
link requests with the state of the server.
451 Unavailable For Legal Reasons - HTTP
note: the
link header might also contain a rel="blocked-by" relation identifying the entity and implementing blockage, not any other entity mandating it.
... any attempt to identify the entity ultimately responsible for the resource being unavailable belongs in the response body, not in the rel="blocked-by"
link.
... http/1.1 451 unavailable for legal reasons
link: <https://spqr.example.org/legislatione>; rel="blocked-by" content-type: text/html <html> <head><title>unavailable for legal reasons</title></head> <body> <h1>unavailable for legal reasons</h1> <p>this request may not be serviced in the roman province of judea due to the lex julia majestatis, which disallows access to resources hosted on servers deemed to be operated by the people's front of judea.</p> </body> </html> specifications specification title rfc 7725: 451 unavailable for legal reasons an http status code to report legal...
HTTP response status codes - HTTP
103 early hints this status code is primarily intended to be used with the
link header, letting the user agent start preloading resources while the server prepares a response.
...(there is no standardized way of choosing one of the responses, but html
links to the possibilities are recommended so the user can pick.) 301 moved permanently the url of the requested resource has been changed permanently.
...clients are expected to remove their caches and
links to the resource.
Closures - JavaScript
run the code using this jsfiddle
link and notice that the alert() statement within the displayname() function successfully displays the value of the name variable, which is declared in its parent function.
...you can attach them to buttons (in this case hyper
links) as demonstrated in the following code example.
...) { var helptext = [ {'id': 'email', 'help': 'your e-mail address'}, {'id': 'name', 'help': 'your full name'}, {'id': 'age', 'help': 'your age (you must be over 16)'} ]; for (var i = 0; i < helptext.length; i++) { var item = helptext[i]; document.getelementbyid(item.id).onfocus = makehelpcallback(item.help); } } setuphelp(); run the code using this jsfiddle
link.
OpenSearch description format
(see reference material for
links to other browsers' documentation.) firefox also supports additional features not in the opensearch standard, such as search suggestions and the <searchform> element.
... to support autodiscovery, add a <
link> element for each plugin to the <head> of your web page: <
link rel="search" type="application/opensearchdescription+xml" title="searchtitle" href="pluginurl"> replace the bolded items as explained below: searchtitle the name of the search to perform, such as "search mdc" or "yahoo!
...for example: <
link rel="search" type="application/opensearchdescription+xml" title="mysite: by author" href="http://example.com/mysiteauthor.xml"> <
link rel="search" type="application/opensearchdescription+xml" title="mysite: by title" href="http://example.com/mysitetitle.xml"> this way, your site can offer plugins to search by author, or by title.
Web Performance
this could be a file loaded later or
link target a user tries to follow.
...here we'll introduce many of these features ad the basic level and provide
links to deeper dives to improve performance for each topic.
... web performance checklist a performance checklist of features to consider when developing applications with
links to tutorials on how to implement each feature, include service workers, diagnosing performance problems, font loading best practices, client hints, creating performant animations, etc.
Introduction to progressive web apps - Progressive web apps (PWAs)
for example, web apps are more discoverable than native apps; it's a lot easier and faster to visit a website than to install an application, and you can also share web apps by simply sending a
link.
...
linkable, so you can share it by simply sending a url.
...
linkability one of the most powerful features of the web is the ability to
link to an app at a specific url without the need for an app store or complex installation process.
Graphic design for responsive sites - Progressive web apps (PWAs)
interactive images if your images need to feature some level of interactivity, such as
links, other clickable areas, or animation, there are a number of options available.
... css as well as adding programmatic graphical effects to
links (and anywhere else you might want them), css3 also allows you to write declarative animations and transitions.
...you can also add
links direcly into svg and can create animations using smil (synchronized multimedia intergration language).
in - SVG: Scalable Vector Graphics
html <div style="width: 420px; height: 220px;"> <svg style="width:200px; height:200px; display: inline;" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <defs> <filter id="backgroundmultiply"> <!-- this will not work.
... --> <feblend in="backgroundimage" in2="sourcegraphic" mode="multiply"/> </filter> </defs> <image x
link:href="https://developer.mozilla.org/files/6457/mdn_logo_only_color.png" x="10%" y="10%" width="80%" height="80%"/> <circle cx="50%" cy="40%" r="40%" fill="#c00" style="filter:url(#backgroundmultiply);" /> </svg> <svg style="width:200px; height:200px; display: inline;" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <defs> <filter id="imagemultiply"> <!-- this is a workaround.
... --> <feimage x
link:href="https://developer.mozilla.org/files/6457/mdn_logo_only_color.png" x="10%" y="10%" width="80%" height="80%"/> <feblend in2="sourcegraphic" mode="multiply"/> </filter> </defs> <circle cx="50%" cy="40%" r="40%" fill="#c00" style="filter:url(#imagemultiply);"/> </svg> </div> result specifications specification status comment filter effects module level 1the definition of 'in' in that specification.
SVG Attribute reference - SVG: Scalable Vector Graphics
below is a list of all of the attributes available in svg along with
links to reference documentation to help you learn which elements support them and how they work.
...orm transform-origin type u u1 u2 underline-position underline-thickness unicode unicode-bidi unicode-range units-per-em v v-alphabetic v-hanging v-ideographic v-mathematical values vector-effect version vert-adv-y vert-origin-x vert-origin-y viewbox viewtarget visibility w width widths word-spacing writing-mode x x x-height x1 x2 xchannelselector x
link:actuate x
link:arcrole x
link:href x
link:role x
link:show x
link:title x
link:type xml:base xml:lang xml:space y y y1 y2 ychannelselector z z zoomandpan svg attributes by category generic attributes core attributes id, lang, tabindex, xml:base, xml:lang, xml:space style attributes class, style conditional processing attributes externalresourcesrequired, requiredextensi...
... x
link attributes x
link:href, x
link:type, x
link:role, x
link:arcrole, x
link:title, x
link:show, x
link:actuate presentation attributes note that all svg presentation attributes can be used as css properties.
<feImage> - SVG: Scalable Vector Graphics
age data from an external source and provides the pixel data as output (meaning if the external source is an svg image, it is rasterized.) usage context categoriesfilter primitive elementpermitted contentany number of the following elements, in any order:<animate>, <animatetransform>, <set> attributes global attributes core attributes presentation attributes filter primitive attributes x
link attributes class style externalresourcesrequired specific attributes preserveaspectratio x
link:href dom interface this element implements the svgfeimageelement interface.
... example svg <svg viewbox="0 0 200 200" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <defs> <filter id="image"> <feimage x
link:href="/files/6457/mdn_logo_only_color.png"/> </filter> </defs> <rect x="10%" y="10%" width="80%" height="80%" style="filter:url(#image);"/> </svg> result specifications specification status comment filter effects module level 1the definition of '<feimage>' in that specification.
... working draft added href attribute and deprecated x
link:href.
<image> - SVG: Scalable Vector Graphics
usage context categoriesgraphics element, graphics referencing elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements attributes global attributes conditional processing attributes core attributes graphical event attributes presentation attributes x
link attributes class style externalresourcesrequired transform specific attributes x: positions the image horizontally from the origin.
... href and x
link:href: points at a url for the image file.
... example basic rendering of a png image in svg: svg <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <image href="https://mdn.mozillademos.org/files/6457/mdn_logo_only_color.png" height="200" width="200"/> </svg> result specifications specification status comment scalable vector graphics (svg) 2the definition of '<image>' in that specification.
<linearGradient> - SVG: Scalable Vector Graphics
html,body,svg { height:100% } <svg viewbox="0 0 10 10" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <defs> <lineargradient id="mygradient" gradienttransform="rotate(90)"> <stop offset="5%" stop-color="gold" /> <stop offset="95%" stop-color="red" /> </lineargradient> </defs> <!-- using my linear gradient --> <circle cx="5" cy="5" r="4" fill="url('#mygradient')" /> </svg> attributes gradientunits this attribute defines the coordinate system for...
... value type: <length> ; default value: 100%; animatable: yes x
link:href an <iri> reference to another <lineargradient> element that will be used as a template.
...ement event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility x
link attributes x
link:href, x
link:title usage notes categoriesgradient elementpermitted contentany number of the following elements, in any order:descriptive elements<animate>, <animatetransform>, <set>, <stop> specifications specification status comment scalable vector graphics (svg) 2the definition of '<lineargradient>' in that specification.
<mpath> - SVG: Scalable Vector Graphics
usage context categoriesanimation elementpermitted contentany number of the following elements, in any order:descriptive elements attributes global attributes core attributes » x
link attributes » externalresourcesrequired specific attributes x
link:href dom interface this element implements the svgmpathelement interface.
... example svg <svg width="100%" height="100%" viewbox="0 0 500 300" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link" > <rect x="1" y="1" width="498" height="298" fill="none" stroke="blue" stroke-width="2" /> <!-- draw the outline of the motion path in blue, along with three small circles at the start, middle and end.
...--> <path d="m-25,-12.5 l25,-12.5 l 0,-87.5 z" fill="yellow" stroke="red" stroke-width="7.06" > <!-- define the motion path animation --> <animatemotion dur="6s" repeatcount="indefinite" rotate="auto" > <mpath x
link:href="#path1"/> </animatemotion> </path> </svg> result specifications specification status comment svg animations level 2the definition of '<mpath>' in that specification.
<pattern> - SVG: Scalable Vector Graphics
value type: <length>|<percentage> ; default value: 0; animatable: yes x
link:href deprecated since svg 2 this attribute reference a template pattern that provides default values for the <pattern> attributes.
... value type: <url>; default value: none; animatable: yes note: for browsers implementing href, if both href and x
link:href are set, x
link:href will be ignored and only href will be used.
...nsions, systemlanguage presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility x
link attributes most notably: x
link:title 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>,...
<radialGradient> - SVG: Scalable Vector Graphics
html,body,svg { height:100% } <svg viewbox="0 0 10 10" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <defs> <radialgradient id="mygradient"> <stop offset="10%" stop-color="gold" /> <stop offset="95%" stop-color="red" /> </radialgradient> </defs> <!-- using my linear gradient --> <circle cx="5" cy="5" r="4" fill="url('#mygradient')" /> </svg> attributes cx this attribute defines the x coordinate of the end circle of the radial gradient.
... value type: pad|reflect|repeat ; default value: pad; animatable: yes x
link:href an <iri> reference to another <lineargradient> element that will be used as a template.
...ement event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility x
link attributes x
link:href, x
link:title usage notes categoriesgradient elementpermitted contentany number of the following elements, in any order:descriptive elements<animate>, <animatetransform>, <set>, <stop> specifications specification status comment scalable vector graphics (svg) 2the definition of '<radialgradient>' in that specification.
SVG 2 support in Mozilla - SVG: Scalable Vector Graphics
r smil attribute implementation status unknown made <tspan> and <textpath> graphics elements implementation status unknown allow x, y, width, and height on <symbol> implementation status unknown made <use> element shadow trees consistent with shadow dom spec implementation status unknown role mapping of <a> element depending on whether it is a valid
link implementation status unknown aria state and property attributes animatable implementation status unknown styling change notes contentstyletype attribute removed implementation status unknown
linkstyle on svgstyleelement implemented (bug 1239128 (firefox 46.0 / thunderbird 46.0 / seamonkey 2.43)) inner <svg>s and <foreignobje...
...d implementation status unknown focusin and focusout instead of domfocusin and domfocusout implementation status unknown keyboard events implementation status unknown mutation events removed implementation status unknown svgzoomevent removed implementation status unknown <cursor> element deprecated implementation status unknown
linking change notes
link svg resources with fragment identifiers implementation status unknown x
link:type, x
link:role, x
link:arcrole, x
link:show, and x
link:actuate attributes removed implementation status unknown x
link:href attribute deprecated in favor of href implemented (bug 1245751) x
link:title attribute deprecated in favor of child <t...
...itle> implementation status unknown spaces in svg view fragments implementation status unknown pixel: and percent: spatial media fragments implementation status unknown
linking to <view> elements does not cause implicit box transformation to show nearest ancestor <svg> element implementation status unknown unspecified svg view fragment parameters don't cause corresponding attributes to be reset to initial values implementation status unknown viewtarget attribute of <view> and corresponding svg view fragment parameter removed implementation status unknown fragment-only urls are always same-document implementation status unknown additional attributes on <a> implemented (bug 1451823) scripting ...
Clipping and masking - SVG: Scalable Vector Graphics
creating clips we create the above mentioned semicircle based on a circle element: <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <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.
... <svg width="200" height="200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <defs> <lineargradient id="gradient"> <stop offset="0" stop-color="black" /> <stop offset="1" stop-color="white" /> </lineargradient> <mask id="mask"> <rect x="0" y="0" width="200" height="200" fill="url(#gradient)" /> </mask> </defs> <rect x="0" y="0" width="200" height="200" fill="green" /> <rect x="0" y="0" width="200"...
...hence, if you set a stroke opacity on an element, that also has a fill, the fill will shine through on half of the stroke, while on the other half the background will appear: <svg width="200" height="200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <rect x="0" y="0" width="200" height="200" fill="blue" /> <circle cx="100" cy="100" r="50" stroke="yellow" stroke-width="40" stroke-opacity=".5" fill="red" /> </svg> screenshotlive sample you see in this example the red circle on blue background.
SVG In HTML Introduction - SVG: Scalable Vector Graphics
e approach is backwards compatible to browsers that do not support svg; simply, no background appears in them it's very simple and performs very well the picture dynamically sizes itself to the required size in an intelligent way we can have declarative style rules applying to both html and svg the same script manipulates both html and svg the document is entirely standards-based to add a
linked image with dom methods to an embedded svg element, one has to use setattributens to set href.
... like in the following example: var img = document.createelementns("http://www.w3.org/2000/svg", "image"); img.setattributens("http://www.w3.org/1999/x
link", "x
link:href", "move.png"); details the viewbox attribute establishes a logical coordinate system which the svg picture's coordinates are relative to.
... related
links another svg in html example: a swarm of motes working example that works in both mozilla and in internet explorer with adobe's svg viewer installed.
Mixed content - Web security
active content examples this section lists some types of http requests which are considered active content: <script> (src attribute) <
link> (href attribute) (this includes css stylesheets) <iframe> (src attribute) xmlhttprequest requests fetch() requests all cases in css where a <url> value is used (@font-face, cursor, background-image, and so forth).
...the mixed content resource that was loaded via http will show up in red, along with the text "mixed content", which
links to this page.
...you could also use an online crawler like ssl-check or missing padlock that will check your website recursively and find
links to insecure content.
Tutorials
the
links on this page lead to a variety of tutorials and training materials.
... html tutorials introductory level introduction to html this module sets the stage, getting you used to important concepts and syntax, looking at applying html to text, how to create hyper
links, and how to use html to structure a webpage.
...we round off the module by looking at applying custom fonts to your page, and styling lists and
links.
Using shadow DOM - Web Components
as an example, consider the following html fragment: <!doctype html> <html> <head> <meta charset="utf-8"> <title>simple dom example</title> </head> <body> <section> <img src="dinosaur.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.
...-text="your card validation code (cvc) is an extra security feature — it is the last 3 or 4 numbers on the back of your card."> internal versus external styles in the above example we apply style to the shadow dom using a <style> element, but it is perfectly possible to do it by referencing an external stylesheet from a <
link> element instead.
... for example, take a look at this code from our popup-info-box-external-stylesheet example (see the source code): // apply external styles to the shadow dom const
linkelem = document.createelement('
link');
linkelem.setattribute('rel', 'stylesheet');
linkelem.setattribute('href', 'style.css'); // attach the created element to the shadow dom shadow.appendchild(
linkelem); note that <
link> elements do not block paint of the shadow root, so there may be a flash of unstyled content (fouc) while the stylesheet loads.
xml:base - XML: Extensible Markup Language
support was removed from b
link (chrome and opera) in 2015: chromium bug 341854 b
link-dev mailing list post and from firefox 66 in bug 903372.
... <html> <head> <base href="https://mydomain.com"> <style> .
link { stroke: #999; stroke-opacity: .6; } marker#arrow { fill: black; } </style> </head> <body> <svg width="100%" height="100%" xml:base=""> <defs> <marker id="arrow" viewbox="0 -5 10 10" refx="0" refy="0" markerwidth="20" markerheight="20" orient="auto"> <path d="m0,-5l10,0l0,5"></path> </marker> </defs> <line x1="100" y1="100" x2="333" y2="333" marker-start="url(#arrow)" class="
link"></line> </svg> </body> </html> imagine a svg with font references.
... <svg xml:base="https://foobar.s3-eu-west-1.amazonaws.com/uploads/15066845653629" width="909" height="1286" viewbox="0 0 909 1286"xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <defs> <style type="text/css"><![cdata[ .s9_999{ font-size: 9.17px; font-family: zapfdingbats_ghr; fill: #161615; } ]]></style> <text x="647" y="412" dx="0" class="s9_999" >r</text> <style type="text/css"><![cdata[ @font-face { font-family: zapfdingbats_ghr; src: url("fonts/zapfdingbats_ghr.woff") format("woff"); } ]]></style> </svg> setting the xml:base on the svg element means you can inline the svg and thereby bypass cors issue while not changing the base uri for your entire document.
Compiling from Rust to WebAssembly - WebAssembly
for more, consult the cargo and rust
linkage documentation.
... making our package availabe to npm let's use `npm
link` to make this package available to other javascript packages installed $ cd pkg $ npm
link we now have an npm package, written in rust, but compiled to webassembly.
...$ mkdir site $ cd site $ npm
link hello-wasm create a new file, package.json, and put the following code in it: { "scripts": { "serve": "webpack-dev-server" }, "dependencies": { "hello-wasm": "^0.1.0" }, "devdependencies": { "webpack": "^4.25.1", "webpack-cli": "^3.1.2", "webpack-dev-server": "^3.1.10" } } note that you need to fill in your own username, after the @, in the dependencies secti...
WebAssembly
this allows dynamic
linking of multiple modules.
... webassembly.
linkerror() creates a new webassembly
linkerror object.
... 52notes notes disabled in the firefox 52 extended support release (esr).opera android full support 43safari ios full support 11samsung internet android full support 7.0nodejs full support 8.0.0
linkerrorchrome full support 57edge full support 16firefox full support 52notes full support 52notes notes disabled in the firefox 52 extended support release (esr).ie no support ...
dev/panel - Archive of obsolete content
he panel document } }); // export the constructor exports.mypanel = mypanel; // create a new tool, initialized // with the new constructor const mytool = new tool({ panels: { mypanel: mypanel } }); panel document environment the panel document loaded from the url property can of course include css and javascript just like a normal web page: <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> it doesn't have access to any privileged apis, including the add-on sdk apis.
... to use volcan.js, you can just include it from your panel's html like 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", f...
ui/sidebar - Archive of obsolete content
so you can rewrite the above code like this: var sidebar = require("sdk/ui/sidebar").sidebar({ id: 'my-sidebar', title: 'my sidebar', url: "./sidebar.html" }); you can include javascript and css from the html as you would with any web page, for example using <script> and <
link> tags containing a path relative to the html file itself.
... <!doctype html> <html> <head> <
link href="stuff.css" type="text/css" rel="stylesheet"> </head> <body> <script type="text/javascript" src="stuff.js"></script> </body> </html> you can update the sidebar's content by setting the sidebar's url property.
Getting Started (jpm) - Archive of obsolete content
open it and add the following code: var buttons = require('sdk/ui/button/action'); var tabs = require("sdk/tabs"); var button = buttons.actionbutton({ id: "mozilla-
link", label: "visit mozilla", icon: { "16": "./icon-16.png", "32": "./icon-32.png", "64": "./icon-64.png" }, onclick: handleclick }); function handleclick(state) { tabs.open("http://www.mozilla.org/"); } note that "entry point" defaults to "index.js" in jpm, meaning that your main file is "index.js", and it is found directly in your add-on's root.
...for example, we could change the page that gets loaded: var buttons = require('sdk/ui/button/action'); var tabs = require("sdk/tabs"); var button = buttons.actionbutton({ id: "mozilla-
link", label: "visit mozilla", icon: { "16": "./icon-16.png", "32": "./icon-32.png", "64": "./icon-64.png" }, onclick: handleclick }); function handleclick(state) { tabs.open("https://developer.mozilla.org/"); } at the command prompt, execute jpm run again.
Getting started (cfx) - Archive of obsolete content
open it and add the following code: var buttons = require('sdk/ui/button/action'); var tabs = require("sdk/tabs"); var button = buttons.actionbutton({ id: "mozilla-
link", label: "visit mozilla", icon: { "16": "./icon-16.png", "32": "./icon-32.png", "64": "./icon-64.png" }, onclick: handleclick }); function handleclick(state) { tabs.open("https://www.mozilla.org/"); } save the file.
...for example, we could change the page that gets loaded: var buttons = require('sdk/ui/button/action'); var tabs = require("sdk/tabs"); var button = buttons.actionbutton({ id: "mozilla-
link", label: "visit mozilla", icon: { "16": "./icon-16.png", "32": "./icon-32.png", "64": "./icon-64.png" }, onclick: handleclick }); function handleclick(state) { tabs.open("https://developer.mozilla.org/"); } at the command prompt, execute cfx run again.
Dialogs and Prompts - Archive of obsolete content
programmatic button access if you want to access the accept ("ok") and cancel buttons from script, use this: // disable the ok and cancel btns document.documentelement.getbutton("accept").disabled = true; document.documentelement.getbutton("cancel").disabled = true;
links dialog.xml — xbl bindings for <dialog> and <dialogheader> elements.
...
links nsipromptservice open and save dialogs see also alerts and notifications ...
Embedding SVG - Archive of obsolete content
<?xml version="1.0" encoding="utf-8"?> <!doctype html public "-//w3c//dtd xhtml 1.0 strict//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <body> <!-- html and svg go here --> </body> </html> example: <?xml version="1.0" encoding="utf-8"?> <!doctype html public "-//w3c//dtd xhtml 1.0 strict//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <bo...
...svg:circle cx="50" cy="50" r="30" fill="blue"/> </svg:svg> <p>world</p> </body> </html> embedding into xul make sure you use the right namespace when embedding <?xml version="1.0"?> <?xml-stylesheet href="chrome://global/skin/" type="text/css"?> <window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:svg="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <!-- xul and svg go here --> </window> example: <?xml version="1.0"?> <?xml-stylesheet href="chrome://global/skin/" type="text/css"?> <window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:svg="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <vbox> <label value="hello"/> <svg:svg ...
Preferences - Archive of obsolete content
if you haven't yet, read other documents about mozilla preferences on mdn (
links below in resources section).
...look in the resources section below for the
link to a list of preferences-related interfaces.
JavaScript Client API - Archive of obsolete content
further, you agree (a) to maintain and
link to (including on websites from which your third party client may be downloaded) a separate, conspicuous, and reasonably detailed privacy policy detailing how data collected or transmitted by your third party client is managed and protected; (b) that your third party client will only store data in encrypted form on the firefox sync servers operated by mozilla; (c) that you and your third party cli...
...you can find out more about registering as an observer here: [
link].
Mozilla Application Framework in Detail - Archive of obsolete content
ml extras code module, which contains mozilla's web services support) soap scripts in mozilla (documentation on soap in mozilla from the engineer who implemented it) xpinstall, mozilla's cross platform installation technology one of the many things that makes the mozilla platform easy for both users and developers is that applications can be installed, extended, or upgraded with simple web page
links.
...a dom api, the open jvm integration (oji) facility, a java webclient api, and java plug-ins; nspr, a runtime engine that provides platform-independence (across over a dozen platforms) for non-gui operating system facilities with support for threads, thread synchronization, normal file and network i/o, interval timing and calendar time, basic memory management (malloc and free) and shared library
linking; psm, a set of libraries that perform cryptographic operations including setting up an ssl connection, object signing and signature verification, certificate management (including issuance and revocation), other common pki functions, and s/mime support; an sql support that provides the ability to set up data sources, query a database, and retrieve results as javascript objects or rdf data so...
Overview of how downloads work - Archive of obsolete content
one way is to encounter a file with an unknown content type, the other is to choose "save
link target as" from the context menu of a
link.
...get the .dia file here: mozilla_downloads.dia downloads via "save
link target as" and friends this diagram is an uml sequence diagram, and was created using dia.
Same origin policy for XBL - Archive of obsolete content
determining the originating principal 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.
...a call to checloaduriwithprincipal() is done to make sure the principal is able to
link to the given uri in the first place.
Space Manager High Level Design - Archive of obsolete content
bandrects are a
linked list (provided by prcliststr super-class) and also provide some geometry-management methods (splitvertically, splithorizontally) and some methods that query or manipulate the frames associated with the band (isoccupiedby, addframe, removeframe).
... frameinfo: a structure that keeps information about the rectangle associated with a specific frame, in a
linked list.
Tamarin build documentation - Archive of obsolete content
if you have trouble starting the app try this: $ export android_swt=$android_build_top/android-sdk-mac_86/tools/lib/x86_64 where $android_build_top is the full path to your sdk/ndk top folder - get the openssl-0.9.8r.tar (openssl-1.0.0c.tar.gz won't work) openssl files from http://www.openssl.org (use the source
link on the left).
... alternatively, run make, in which case the process will complete with errors when it tries to create the shared lib crt0.o: $ /android-public/android-ndk/toolchains/arm-eabi-4.4.0/prebuilt/darwin-x86/bin/../lib/gcc/arm-eabi/4.4.0/../../../../arm-eabi/bin/ld: crt0.o: no such file: no such file or directory collect2: ld returned 1 exit status make[2]: *** [
link_app.] error 1 make[1]: *** [openssl] error 2 make: *** [build_apps] error 1 you can ignore these errors.
Tamarin Build System Documentation - Archive of obsolete content
compile, smoke, or test to show the build slaves from the most recent phase run or click on an individual box to display the test result below the phase table the waterfall displays each buildstep and result the left side contains the time column and the user/revision
link to represent the revision triggering a build, mouse over the user to see the revision and submission notes each buildstep run on a slave is a box with color indicating status, red is failed, green passed, yellow has warnings click the stdio
link to see the output click on the build yellow box at the bottom of a set of buildsteps to see the result of all of the buildsteps for a build and the time...
... each buildstep took scroll down to see previous builds triggered at the bottom of the page click on the [next page]
link to display more previous builds what are the goals of the build system (qos)?
Example Sticky Notes - Archive of obsolete content
.org/check?uri=referer"><img src="https://udn.realityripple.com/samples/e2/dd625ef1cd.png" width="88" height="31" alt="valid html 4.01" style="border: 1px none"></a></p> </body> </html> notes.xml <?xml version="1.0"?> <bindings xmlns="http://www.mozilla.org/xbl" xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:svg="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <!-- in above only xbl namespace declaration is mandatory.
... the others are only needed if you plan to handle xul (xml user interface language) or/and svg (scalable vector graphics) in your bindings; x
link in xml also may come useful sometimes.
Install Wizards (aka: Stub Installers) - Archive of obsolete content
tall.) the stub installer code includes: the logic to display the install wizard widgets and dialogs the code that reads in the configuration file (config.ini) and dynamically installs from the net or from local xpi modules found next to the installer binary the code that processes user selections the code that calls the xpinstall engine through xpistub the libxpnet code that is statically
linked in the stub installers are written in code native to the platform using native widget toolkits including the windows api for windows, the mac toolbox for the mac, and gtk for the unix version.
... to learn more about the three platform-specific versions of the stub installer follow the
links below: unix stub installer mac stub installer windows stub installer what do we mean by xpistub?
InstallTrigger.installChrome - Archive of obsolete content
installtrigger.installchrome trigger scripts are typically invoked by javascript event handlers on hyper
links.
... when a user clicks the
link "install the new blue theme" in the example below, xpinstall downloads, registers, and installs the theme contained in newblue.xpi to the user's profile directory.
href - Archive of obsolete content
requires the class attribute to include text-
link.
... <label href="http://example.com" class="text-
link" value="click here to go to example.com"/> ...
Menus - Archive of obsolete content
editable text context-open
link opens a
link in a new window
links context-open
linkintab opens a
link in a new tab
links context-bookmark
link bookmarks a
link links context-save
link saves a
link links context-send
link sends a
link in an email
links context-copyemail copies an email address mailto:
links context-copy
link copies a
link ...
...
links context-viewimage views an image at full size images context-copyimage-contents copies an image to the clipboard images context-copyimage copies the url of an image to the clipboard images context-saveimage saves an image images context-sendimage sends an image in an email images context-setdesktopbackground sets an image as the desktop background images context-blockimage blocks an image images context-back goes back a page context-forward goes forward a page context-reload reloads a page context-stop stops loading a page context-bookmarkpage bookmarks a page context-savepage saves a pag...
ContextMenus - Archive of obsolete content
<menupopup id="
link-menu"> <menuitem label="open
link" default="true"/> <menuitem label="open in new window"/> <menuitem label="properties"/> </menupopup> the default attribute has been set to true on the first menu item ('open
link').
...for example, right clicking on an image might display items pertaining to images, whereas clicking on a
link would display items pertaining to
links.
Notes - Archive of obsolete content
implementing an nsicommandlinehandler on windows may trigger a bug that causes an error message ("windows cannot find the file specified") to be displayed when opening external
links (like from a shortcut or from an external application).
...some more
links on the matter: a mozillazine post.
Complete - Archive of obsolete content
when it is finished, it will get a category and
links from other pages.
...if you want to see these techniques in action, then you can download and install the complete allcustom extension: allcustom.xpi (the
link is external only because this wiki does not support xpi files.) the extension does not contain any useful functions.
Why RSS Slash is Popular - Counting Your Comments - Archive of obsolete content
an example using the most popular element of the rss slash module is shown below: <?xml version="1.0"> <rss version="2.0" xmlns:slash="http://purl.org/rss/1.0/modules/slash/" > <channel> <title>example</title> <description>an rss example with slash</description> <lastbuilddate>sun, 15 may 2005 13:02:08 -0500</lastbuilddate> <
link>http://www.example.com</
link> <item> <title>review of sin city</title> <guid>d77d2e80-0487-4e8c-a35d-a93f12a0ff7d:2005/05/15/114</guid> <pubdate>sun, 15 may 2005 13:02:08 -0500</lastbuilddate></pubdate> <
link>http://www.example.com/blog/2005/05/15/114</
link> <slash:comments>43</slash:comments> </item...
...> <item> <title>what is the 3571st prime number</title> <guid>d77d2e80-0487-4e8c-a35d-a93f12a0ff7d:2005/05/15/113</guid> <pubdate>sun, 15 may 2005 10:55:12 -0500</lastbuilddate></pubdate> <
link>d77d2e80-0487-4e8c-a35d-a93f12a0ff7d:2005/05/15/113</
link> <slash:comments>72</slash:comments> </item> <item> <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:...
Why Well-Formed Web RSS Module is Popular - Syndicating Your Comments - Archive of obsolete content
an example using the most popular element of the well-formed web rss module is shown below: <?xml version="1.0"> <rss version="2.0" xmlns:wfw="http://wellformedweb.org/commentapi/" > <channel> <title>example</title> <description>an rss example with wfw</description> <lastbuilddate>sun, 15 may 2005 13:02:08 -0500</lastbuilddate> <
link>http://www.example.com</
link> <item> <title>i like root beer</title> <guid>d77d2e80-0487-4e8c-a35d-a93f12a0ff7d:article:54321</guid> <pubdate>sun, 15 may 2005 13:02:08 -0500</pubdate> <
link>http://www.example.com/article/54321</
link> <wfw:commentrss>http://www.example.com/feed/rss/54321/comments</wfw:commentrss> </item> <item> <title>rain is wet</title> <guid>d77d2e80...
...-0487-4e8c-a35d-a93f12a0ff7d:article:54320</guid> <pubdate>sun, 15 may 2005 10:55:12 -0500</pubdate> <
link>http://www.example.com/article/54320</
link> <wfw:commentrss>http://www.example.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.
Well-Formed Web - Archive of obsolete content
the well-formed web rss module provides facilities for <item> level commenting: for
linking to comments contained in an external rss feed, and for posting new comments.
... documentation selected articles why well-formed web rss module is popular - syndicating your comments charles iliya krempeaux talks about the rss well-formed web module, why it is popular among some, and how it is used to
link to your comments (2005-08-22).
0.90 - Archive of obsolete content
examples rss 0.90 looked something like this: <?xml version="1.0"?> <rdf:rdf xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://my.netscape.com/rdf/simple/0.9/" > <channel> <title>mozilla dot org</title> <
link>http://www.mozilla.org</
link> <description>the mozilla organization web site</description> </channel> <image> <title>mozilla</title> <url>http://www.mozilla.org/images/moz.gif</url> <
link>http://www.mozilla.org</
link> </image> <item> <title>new status updates</title> <
link>http://www.mozilla.
...org/status/</
link> </item> <item> <title>bugzilla reorganized</title> <
link>http://www.mozilla.org/bugs/</
link> </item> <item> <title>mozilla party, 2.0!</title> <
link>http://www.mozilla.org/party/1999/</
link> </item> <item> <title>unix platform parity</title> <
link>http://www.mozilla.org/build/unix.html</
link> </item> <item> <title>npl 1.0m published</title> <
link>http://www.mozilla.org/npl/npl-1.0m.html</
link> </item> </rdf:rdf> note that here, rss is being used to list sections of the web site.
title - Archive of obsolete content
netscape rss 0.91 revision 3 example <?xml version="1.0"?> <!doctype rss system "http://my.netscape.com/publish/formats/rss-0.91.dtd"> <rss version="0.91"> <channel> <title>advogato</title> <
link>http://www.advogato.org/article/</
link> <description>recent advogato articles</description> <language>en-us</language> <image> <
link>http://www.advogato.org/</
link> <title>advogato</title> <url>http://www.advogato.org/image/tinyadvogato.png</url> </image> <item> <title>why c...
...an i not get any tang?!</title> <
link>http://www.advogato.org/article/10101.html</
link> <description>seriously.
Vulnerabilities - Archive of obsolete content
an attacker could craft a fraudulent email message that contains hyper
links that, when rendered in html, appear to the recipient to be benign but actually take the recipient to a malicious web site when they are clicked on.
... one of the trust assumptions in the design of the html content rendering feature was that users would not receive malicious hyper
links and click on them.
Common Firefox theme issues and solutions - Archive of obsolete content
to test this please go to bug 324777 using the default theme and activate the "click me"
link.
... mozillazine firefox nightly theme changes thread mozillazine's firefox nightly theme changes thread is a great resource for keeping up to date with the latest changes to the firefox ui and contains
links to the bugzilla bug reports, which detail what changes were made.
Using Firebug and jQuery (Screencast) - Archive of obsolete content
click the video
link to begin (14:39 minutes long, 59mb): http://developer.mozilla.org/presentations/screencasts/jresig-digg-firebug-jquery.mp4 download: right-click this
link and select save as...
... related
links: firebug firefox extension jquery javascript library jquery selector documentation digg learning jquery: jquerify bookmarklet if you wish to use greasemonkey instead of a bookmarklet, then by all means, please do so.
Browser Detection and Cross Browser Support - Archive of obsolete content
if (document.all) { // internet explorer 4+ document.write('<
link rel="stylesheet" type="text/css" src="style-ie.css">'); } else if (document.layers) { // navigator 4 document.write('<
link rel="stylesheet" type="text/css" src="style-nn.css">'); } note how the above example only provided stylesheets for internet explorer and navigator 4 and even then only if the visitor has javascript support turned on in their browser.
... see also window.navigator.useragent
links gecko compatibility handbook gecko user agent string reference object cross reference - navigator browser feature detection gecko user agent strings rfc 1945 - hypertext transfer protocol -- http 1.0 rfc 2068 - hypertext transfer protocol -- http 1.1 [mozilla's quirks mode] css enhancements in internet explorer 6 w3c w3c markup w3c technical recommendations w3c ht...
Browser Feature Detection - Archive of obsolete content
ementsbytagname() true true true document.title true true true document.referrer true true true document.domain true true true document.url true true true document.body true true true document.images true true true document.applets true true true document.
links true true true document.forms true true true document.anchors true true true document.cookie true true true document.open() true true true document.close() true true true document.write() true true true document.writeln() true true true document.geteleme...
... false}, {name: 'createattribute', 'supported': false}, {name: 'getelementsbytagname', 'supported': false}, {name: 'title', 'supported': false}, {name: 'referrer', 'supported': false}, {name: 'domain', 'supported': false}, {name: 'url', 'supported': false}, {name: 'body', 'supported': false}, {name: 'images', 'supported': false}, {name: 'applets', 'supported': false}, {name: '
links', 'supported': false}, {name: 'forms', 'supported': false}, {name: 'anchors', 'supported': false}, {name: 'cookie', 'supported': false}, {name: 'open', 'supported': false}, {name: 'close', 'supported': false}, {name: 'write', 'supported': false}, {name: 'writeln', 'supported': false}, {name: 'getelementbyid', 'supported': false}, {name: 'getelementsbyname', 'supported': false} ...
Back to the Server: Server-Side JavaScript On The Rise - Archive of obsolete content
lt, // 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 java code used to retrieve the feed data.
... listing 6 - creating the user interface <
link href="/jaxer_examples/js/ext-2.1/resources/css/ext-all.css" type="text/css" rel="stylesheet"/> <script src="/jaxer_examples/js/ext-2.1/adapter/ext/ext-base.js"/> <script src="/jaxer_examples/js/ext-2.1/ext-all.js"/> <
link href="/jaxer_examples/css/main.css" type="text/css" rel="stylesheet"/> <script runat="both" src="/jaxer_examples/js/validatecomments.js"/> <script> var txt_name; var txt_emai...
XForms Alert Element - Archive of obsolete content
if more than one source of message is specified in this element, the order of precedence is: single node binding attributes,
linking attributes, inline text.
... attributes single-node binding
linking src - url of a document whose contents will be retrieved by the alert element and used to provide the alert message for the containing form control.
XForms Help Element - Archive of obsolete content
if more than one source of message is specified in this element, the order of precedence is: single node binding attributes,
linking attributes, inline text.
... attributes single-node binding
linking src - url of a document whose contents will be retrieved by the help element and used to provide a help message for the containing form control.
XForms Hint Element - Archive of obsolete content
if more than one source of message is specified in this element, the order of precedence is: single node binding attributes,
linking attributes, inline text.
... attributes single-node binding
linking src - url of a document whose contents will be retrieved by the hint element and used to provide hint text for the containing form control.
XForms Label Element - Archive of obsolete content
if more than one source of label text is specified for this element, the order of precedence is: single node binding attributes,
linking attributes, inline text.
... single-node binding
linking src - url of a document whose contents will be retrieved by the label element and used to provide label text for the containing form control.
Working with windows in chrome code
the second parameter is the window's name; the name can be used in
links or forms as the target attribute.
...todo:
link to how to pass an xpcom object to a new window when it has a more useful example opener code: window.opendialog("chrome://test/content/progress.xul", "myprogress", "chrome,centerscreen", {status: "reading remote data", maxprogress: 50, progress: 10} ); progress.xul: <?xml version="1.0"?> <?xml-stylesheet href="chrome://global/skin/" type="text/css"?> <wind...
URLs - Plugins
this is the way that plug-ins provide hyper
links to other documents or retrieve data from the network.
... here's an example of getting a url: a plug-in instance draws a button that acts like a
link to another web page.
Version, UI, and Status Information - Plugins
displaying a status line message users are accustomed to checking the ui status line at the bottom of the browser window for updates on the progress of an operation or the url of a
link on the page.
...the user might appreciate seeing the percentage completed of the current operation or the url of a button or other
link object when the cursor is over it, all of which the browser shows.
Inspecting web app manifests - Firefox Developer Tools
when you open the application panel’s manifest view on a page that doesn't have an app manifest successfully deployed, you'll get the following output shown: deploying a manifest to get a manifest deployed successfully, you need to include a <
link> element in the <head> of your document that points to your .webmanifest file: <
link rel="manifest" href="/manifest.webmanifest"> the .webmanifest extension is recommended in the spec, and should be served with an application/manifest+json mime type, although browsers generally tend to support manifests with other appropriate extensions like .json (mime type: application/json).
...it provides a
link to the manifest file at the top which when clicked on brings up the json in a new tab.
Network request details - Firefox Developer Tools
for each line in the response headers section, a question mark
links to the documentation for that response header, if one is available.
...for each line in the request headers section, a question mark
links to the documentation for that request header, if one is available.
Allocations - Firefox Developer Tools
if a gc event was caused by allocation pressure, then the sidebar on the right of the marker in the waterfall view contains a
link labeled "show allocation triggers".
... if you click this
link, the devtools switches to the allocations view, and selects the region of time from the end of the last gc cycle to the start of the one you clicked on.
Style Editor - Firefox Developer Tools
the sidebar lists the rules and provides a
link to the line of the sheet where the rule is defined.
... viewing original sources now, if you check "show original sources" in the style editor settings, the
links next to css rules in the rules view will
link to the original sources in the style editor.
Validators - Firefox Developer Tools
tune-up wizard
links back to devedge if you're writing new code that isn't validating immediately, see the available standards-compliant authoring and development tools.
...
link checker this tool will check
links on a given web page.
AbstractRange - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/abstractrange" target="_top"><rect x="1" y="1" width="130" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="66" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">abstractrange</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} pr...
...each element's contents are
linked below it in the tree, potentially spawning a series of branches below as elements include other elements and text nodes.
AnalyserNode - Web APIs
akers" inheritance this interface inherits from the following parent interfaces: <div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/audionode" target="_top"><rect x="151" y="1" width="90" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="196" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">audionode</text></a><polyline points="241,25 251,20 251,30 241,25" stroke="#d4dde4" fill="none"/><line x1="251" y1="25" x2="281" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/analysernode" target="_top"><rect x="281" y="1" width="120" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="341" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment...
AnimationEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/animationevent" target="_top"><rect x="116" y="1" width="140" height="50" fill="#f4f7f8" stroke="#d4dde4" 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">animationevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor animationevent() creates an animationevent event with the given parameters.
Attr - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link:href="/docs/web/api/attr" target="_top"><rect x="266" y="1" width="75" height="50" fill="#f4f7f8" 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="midd...
BaseAudioContext - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/baseaudiocontext" target="_top"><rect x="151" y="1" width="160" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="231" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">baseaudiocontext</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties baseaudiocontext.audioworklet read only secure context returns the audioworklet object, which can be used to create and manage audionodes in which javascript code implementing the audioworkletprocessor interface are run in the background to process audio data.
BeforeInstallPromptEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 8.571428571428571%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-20 0 700 60" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/beforeinstallpromptevent" target="_top"><rect x="116" y="1" width="240" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="236" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">beforeinstallpromptevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor beforeinstallpromptevent() creates a new beforeinstallpromptevent.
BeforeUnloadEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/beforeunloadevent" target="_top"><rect x="116" y="1" width="170" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="201" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">beforeunloadevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} bubbles no cancelable yes target objects defaultview interface event examples window.addeventlistener("beforeunload", function( event ) { event.returnvalue = "\o/"; }); // is equivalent to window.addeventlistener("beforeunload", function( event ) { event.preventdefault(); }); webkit-der...
BluetoothDevice - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/bluetoothdevice" target="_top"><rect x="151" y="1" width="150" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="226" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">bluetoothdevice</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} interface interface bluetoothdevice { readonly attribute domstring id; readonly attribute domstring?
Body.text() - Web APIs
example in our fetch text example (run fetch text live), we have an <article> element and three
links (stored in the my
links array.) first, we loop through all of these and give each one an onclick event handler so that 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.
... let myarticle = document.queryselector('article'); let my
links = document.queryselectorall('ul a'); for(let i = 0; i <= my
links.length-1; i++) { my
links[i].onclick = function(e) { e.preventdefault(); let
linkdata = e.target.getattribute('data-page'); getdata(
linkdata); } }; function getdata(pageid) { console.log(pageid); var myrequest = new request(pageid + '.txt'); fetch(myrequest).then(function(response) { return response.text().then(function(text) { myarticle.inner...
BroadcastChannel - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/broadcastchannel" target="_top"><rect x="151" y="1" width="160" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="231" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">broadcastchannel</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor broadcastchannel() creates an object
linking to the named channel.
CSSCounterStyleRule - Web APIs
inheritance this interface inherits from the following parent interfaces: <div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/cssrule" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">cssrule</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y...
...1="25" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/csscounterstylerule" target="_top"><rect x="116" y="1" width="190" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="211" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">csscounterstylerule</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent cssrule.
CSSPrimitiveValue - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/cssvalue" target="_top"><rect x="1" y="1" width="80" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="41" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">cssvalue</text></a><polyline points="81,25 91,20 91,30 81,25" stroke="#d4dde4" fill="none"/><line x1="91" y...
...1="25" x2="121" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/cssprimitivevalue" target="_top"><rect x="121" y="1" width="170" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="206" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">cssprimitivevalue</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, cssvalue.
CSSValueList - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/cssvalue" target="_top"><rect x="1" y="1" width="80" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="41" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">cssvalue</text></a><polyline points="81,25 91,20 91,30 81,25" stroke="#d4dde4" fill="none"/><line x1="91" y...
...1="25" x2="121" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/cssvaluelist" target="_top"><rect x="121" y="1" width="120" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="181" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">cssvaluelist</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, cssvalue.
CanvasRenderingContext2D - Web APIs
non-standard apis b
link and webkit most of these apis are deprecated and were removed shortly after chrome 36.
... b
link only canvasrenderingcontext2d.iscontextlost() inspired by the same webglrenderingcontext method it returns true if the canvas context has been lost, or false if not.
CharacterData - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link:href="/docs/web/api/characterdata" target="_top"><rect x="266" y="1" width="130" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="331" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseli...
CompositionEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/uievent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="153.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">uievent</text></a><polyline points="191,25 201,20 201,30 191,25" stroke="#d4dde4" fill="none"/><line x1="201" y1="25" x2="231" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/compositionevent" target="_top"><rect x="231" y="1" width="160" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="311" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="mid...
DOMRect - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/domrectreadonly" target="_top"><rect x="1" y="1" width="150" height="50" fill="#fff" stroke="#d4dde4" stroke-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">domrectreadonly</text></a><polyline points="151,25 161,20 161,30 151,25" stroke="#d4dde4" fill="non...
...e"/><line x1="161" y1="25" x2="191" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/domrect" target="_top"><rect x="191" y="1" width="75" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="228.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">domrect</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor domrect() creates a new domrect object.
Document.referrer - Web APIs
the document.referrer property returns the uri of the page that
linked to this page.
... syntax var referrer = document.referrer; value the value is an empty string if the user navigated to the page directly (not through a
link, but, for example, by using a bookmark).
DocumentFragment - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link:href="/docs/web/api/documentfragment" target="_top"><rect x="266" y="1" width="160" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="346" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-bas...
DocumentOrShadowRoot.styleSheets - Web APIs
the stylesheets read-only property of the documentorshadowroot interface returns a stylesheetlist of cssstylesheet objects, for stylesheets explicitly
linked into or embedded in a document.
... examples function getstylesheet(unique_title) { for (var i=0; i<document.stylesheets.length; i++) { var sheet = document.stylesheets[i]; if (sheet.title == unique_title) { return sheet; } } } notes the returned list is ordered as follows: stylesheets retrieved from <
link> headers are placed first, sorted in header order.
DocumentType - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><line x1="121" y1="25" x2...
...="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link:href="/docs/web/api/documenttype" target="_top"><rect x="266" y="1" width="120" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="326" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">documentty...
Introduction to the DOM - Web APIs
options[this.selectedindex].value);"> <option value="black">black</option> <option value="red">red</option> </select> <p><b><tt>bgcolor</tt></b></p> <select onchange="setbodyattr('bgcolor', this.options[this.selectedindex].value);"> <option value="white">white</option> <option value="lightgrey">gray</option> </select> <p><b><tt>
link</tt></b></p> <select onchange="setbodyattr('
link', this.options[this.selectedindex].value);"> <option value="blue">blue</option> <option value="green">green</option> </select> <small> <a href="http://some.website.tld/page.html" id="sample"> (sample
link) </a> </small><br /> <input type="button" value="version" onclick...
... figure 0.1 sample dom test page in this example, the drop-down menus dynamically update such dom—accessible aspects of the web page as its background color (bgcolor), the color of the hyper
links (a
link), and color of the text (text).
Element - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="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 x
link:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#f4f7f8" 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="m...
ErrorEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/errorevent" target="_top"><rect x="116" y="1" width="100" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="166" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">errorevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties also inherits properties from its parent event.
ExtendableEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 8.571428571428571%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-20 0 700 60" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/extendableevent" target="_top"><rect x="116" y="1" width="150" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="191" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">extendableevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} note: this interface is only available when the global scope is a serviceworkerglobalscope.
File - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/blob" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">blob</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="25"...
... x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/file" target="_top"><rect x="116" y="1" width="75" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="153.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">file</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor file() returns a newly constructed file.
FocusEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/uievent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="153.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">uievent</text></a><polyline points="191,25 201,20 201,30 191,25" stroke="#d4dde4" fill="none"/><line x1="201" y1="25" x2="231" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/focusevent" target="_top"><rect x="231" y="1" width="100" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="281" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">f...
Using the Geolocation API - Web APIs
if sucessful, the available hyper
link is populated with an openstreetmap.org url that will show their location.
... body { padding: 20px; background-color:#ffffc9 } button { margin: .5rem 0; } html <button id = "find-me">show my location</button><br/> <p id = "status"></p> <a id = "map-
link" target="_blank"></a> javascript function geofindme() { const status = document.queryselector('#status'); const map
link = document.queryselector('#map-
link'); map
link.href = ''; map
link.textcontent = ''; function success(position) { const latitude = position.coords.latitude; const longitude = position.coords.longitude; status.textcontent = ''; map
link.href = `https://www.openstreetmap.org/#map=18/${latitude}/${longitude}`; map
link.textcontent = `latitude: ${latitude} °, longitude: ${longitude} °`; } function error() { status.textcontent = 'unable to retrieve ...
Geolocation API - Web APIs
if sucessful, the available hyper
link is populated with an openstreetmap.org url that will show their location.
... body { padding: 20px; background-color:#ffffc9 } button { margin: .5rem 0; } html <button id = "find-me">show my location</button><br/> <p id = "status"></p> <a id = "map-
link" target="_blank"></a> javascript function geofindme() { const status = document.queryselector('#status'); const map
link = document.queryselector('#map-
link'); map
link.href = ''; map
link.textcontent = ''; function success(position) { const latitude = position.coords.latitude; const longitude = position.coords.longitude; status.textcontent = ''; map
link.href = `https://www.openstreetmap.org/#map=18/${latitude}/${longitude}`; map
link.textcontent = `latitude: ${latitude} °, longitude: ${longitude} °`; } function error() { status.textcontent = 'unable to retrieve ...
HTMLAnchorElement.relList - Web APIs
it is a live domtokenlist containing the set of
link types indicating the relationship between the resource represented by the <a> element and the current document.
... syntax var relstr = anchorelt.rellist; example var anchors = document.getelementsbytagname("a"); var length = anchors.length; for (var i = 0; i < length; i++) { var list = anchors[i].rellist; var listlength = list.length; console.log("new anchor node found with", listlength, "
link types in rellist."); for (var j = 0; j < listlength; j++) { console.log(list[j]); } } specifications specification status comment html living standardthe definition of 'rellist' in that specification.
HTMLCanvasElement.mozGetAsFile() - Web APIs
html <canvas id="canvas" width="100" height="100"></canvas> <p><a href="#" id="
link">click here to try out mozgetasfile()</a>.</p> javascript the following code uses mozgetasfile() to create a file object from the canvas and appends it as an image to the page by loading it as a data url using the readasdataurl() method.
... function draw() { var canvas = document.getelementbyid('canvas'); var ctx = canvas.getcontext('2d'); ctx.fillstyle = 'rgb(200, 0, 0)'; ctx.fillrect(10, 10, 55, 50); ctx.fillstyle = 'rgba(0, 0, 200, 0.5)'; ctx.fillrect(30, 30, 55, 50); var
link = document.getelementbyid('
link');
link.addeventlistener('click', copy); } function copy() { var canvas = document.getelementbyid('canvas'); var f = canvas.mozgetasfile('test.png'); var reader = new filereader(); reader.readasdataurl(f); reader.onloadend = function() { var newimg = document.createelement('img'); newimg.src = reader.result; document.body.appendchild(newimg); } } window.addeventlistener('load', draw); specifications not part of any s...
HTMLFormControlsCollection - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/htmlcollection" target="_top"><rect x="1" y="1" width="140" height="50" fill="#fff" 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">htmlcollection</text></a><polyline points="141,25 151,20 151,30 141,25" stroke="#d4dde4" fill="none"...
.../><line x1="151" y1="25" x2="181" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/htmlformcontrolscollection" target="_top"><rect x="181" y="1" width="260" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="311" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlformcontrolscollection</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface inherits the properties of its parent, htmlcollection.
HTMLImageElement.alt - Web APIs
: flex; align-items: center; justify-content: center; } .left-margin img { width: 6em; } .contents { background-color: rgb(241, 240, 235, 255); height: 100%; margin-left: 2em; padding-top: 1em; padding-left: 2em; padding-right: 1em; } result images used as buttons when using an image as a button (by using it as the only visible child of an <a> element representing a hyper
link), the alt attribute must be used to convey the purpose of the button.
... for example, in the snippet of html below, a toolbar which uses icon images as
link labels provides alt attributes for each giving a textual label to use instead of the icon when the icons cannot be or are intentionally not used.
HTMLImageElement.longDesc - Web APIs
instead of using longdesc to provide a
link to a detailed description of an image, encapsulate the image within a
link using the <a> element.
... this can be easily converted into modern html: <a href="image-descriptions/taco-tuesday.html"> <img src="taco-tuesday.jpg"> </a> with that, the image is a
link to the html file describing the image in more detail.
HTMLOptionsCollection - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/htmlcollection" target="_top"><rect x="1" y="1" width="140" height="50" fill="#fff" 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">htmlcollection</text></a><polyline points="141,25 151,20 151,30 141,25" stroke="#d4dde4" fill="none"...
.../><line x1="151" y1="25" x2="181" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/htmloptionscollection" target="_top"><rect x="181" y="1" width="210" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="286" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmloptionscollection</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties name type description length unsigned long as optionally allowed by the spec, this property isn't read-only.
The HTML DOM API - Web APIs
access to lists of elements in the document's <head> block and body, as well as lists of the images,
links, scripts, etc.
...tmlcanvaselement htmldlistelement htmldataelement htmldatalistelement htmldetailselement htmldialogelement htmldirectoryelement htmldivelement htmlelement htmlembedelement htmlfieldsetelement htmlformelement htmlhrelement htmlheadelement htmlheadingelement htmlhtmlelement htmliframeelement htmlimageelement htmlinputelement htmllielement htmllabelelement htmllegendelement html
linkelement htmlmapelement htmlmediaelement htmlmenuelement htmlmetaelement htmlmeterelement htmlmodelement htmlolistelement htmlobjectelement htmloptgroupelement htmloptionelement htmloutputelement htmlparagraphelement htmlparamelement htmlpictureelement htmlpreelement htmlprogresselement htmlquoteelement htmlscriptelement htmlselectelement htmlslotelement htmlsourceelement html...
HTML Drag and Drop API - Web APIs
function dragstart_handler(ev) { // add different types of drag data ev.datatransfer.setdata("text/plain", ev.target.innertext); ev.datatransfer.setdata("text/html", ev.target.outerhtml); ev.datatransfer.setdata("text/uri-list", ev.target.ownerdocument.location.href); } for a list of common data types used in drag-and-drop (such as text, html,
links, and files), see recommended drag types.
...
link indicates that some form of relationship or connection will be created between the source and drop locations.
HashChangeEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/hashchangeevent" target="_top"><rect x="116" y="1" width="150" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="191" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">hashchangeevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits the properties of its parent, event.
IDBCursorWithValue - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/idbcursor" target="_top"><rect x="1" y="1" width="90" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="46" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">idbcursor</text></a><polyline points="91,25 101,20 101,30 91,25" stroke="#d4dde4" fill="none"/><line x1="1...
...01" y1="25" x2="131" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/idbcursorwithvalue" target="_top"><rect x="131" y="1" width="180" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="221" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">idbcursorwithvalue</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} methods inherits methods from its parent interface, idbcursor.
IDBDatabase - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/idbdatabase" target="_top"><rect x="151" y="1" width="110" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="206" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">idbdatabase</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties idbdatabase.name read only a domstring that contains the name of the connected database.
IDBOpenDBRequest - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/idbrequest" target="_top"><rect x="151" y="1" width="100" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="201" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">idbrequest</text></a><polyline points="251,25 261,20 261,30 251,25" stroke="#d4dde4" fill="none"/><line x1="261" y1="25" x2="291" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/idbopendbrequest" target="_top"><rect x="291" y="1" width="160" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="371" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" al...
IDBRequest - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/idbrequest" target="_top"><rect x="151" y="1" width="100" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="201" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">idbrequest</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties also inherits properties from eventtarget.
IDBTransaction - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/idbtransaction" target="_top"><rect x="151" y="1" width="140" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="221" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">idbtransaction</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} transactions are started when the transaction is created, not when the first request is placed; for example consider this: var trans1 = db.transaction("foo", "readwrite"); var trans2 = db.transaction("foo", "readwrite"); var objectstore2 = trans2.objectstore("foo") var objectstore1 = trans1.objectstore("foo") objectstore2.put("2", "key"...
InputEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/uievent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="153.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">uievent</text></a><polyline points="191,25 201,20 201,30 191,25" stroke="#d4dde4" fill="none"/><line x1="201" y1="25" x2="231" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/inputevent" target="_top"><rect x="231" y="1" width="100" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="281" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">i...
InstallEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 8.571428571428571%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-20 0 700 60" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/extendableevent" target="_top"><rect x="116" y="1" width="150" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="191" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">extendableevent</text></a><polyline points="266,25 276,20 276,30 266,25" stroke="#d4dde4" fill="none"/><line x1="276" y1="25" x2="306" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/installevent" target="_top"><rect x="306" y="1" width="120" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="366" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-ba...
Key Values - Web APIs
vk_instant_replay "
link" opens content liniked to the current program, if available and possible.
... vk_
link "listprogram" lists the current program.
MediaKeyMessageEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/mediakeymessageevent" target="_top"><rect x="116" y="1" width="200" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="216" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">mediakeymessageevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor mediakeymessageevent() creates a new instance of mediakeymessageevent.
MediaKeySession.onkeystatuseschange - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 8.571428571428571%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-20 0 700 60" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/mediakeysession" target="_top"><rect x="151" y="1" width="150" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="226" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">mediakeysession</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} syntax mediakeysession.onkeystatuseschange = function(keystatuschange) { ...
MediaKeySession.onmessage - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 8.571428571428571%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-20 0 700 60" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/mediakeysession" target="_top"><rect x="151" y="1" width="150" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="226" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">mediakeysession</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} syntax mediakeysession.onmessage = function(mediakeymessageevent) { ...
MediaStreamTrackEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/mediastreamtrackevent" target="_top"><rect x="116" y="1" width="210" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="221" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">mediastreamtrackevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} the events based on this interface are addtrack and removetrack properties also inherits properties from its parent interface, event.
Capabilities, constraints, and settings - Web APIs
each property is a
link to its documentation on mdn for the user's convenience.
... of course, there may be non-standard properties in this list, in which case you probably will find that the documentation
link doesn't help much.
MessageEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 13.333333333333334%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 80" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/messageevent" target="_top"><rect x="116" y="1" width="120" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="176" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">messageevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor messageevent() creates a new messageevent.
MouseEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/uievent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="153.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">uievent</text></a><polyline points="191,25 201,20 201,30 191,25" stroke="#d4dde4" fill="none"/><line x1="201" y1="25" x2="231" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/mouseevent" target="_top"><rect x="231" y="1" width="100" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="281" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">m...
Navigator.onLine - Web APIs
the update occurs when the user follows
links or when a script requests a remote page.
... for example, the property should return false when users click
links soon after they lose internet connection.
Node - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="50" fill="#f4f7f8" 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></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties in addition to the properties below, node inherits properties from its parent, eventtarget.
PageTransitionEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/pagetransitionevent" target="_top"><rect x="116" y="1" width="190" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="211" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">pagetransitionevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent, event.
PerformanceLongTaskTiming - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/performanceentry" target="_top"><rect x="1" y="1" width="160" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="81" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">performanceentry</text></a><polyline points="161,25 171,20 171,30 161,25" stroke="#d4dde4" fill="n...
...one"/><line x1="171" y1="25" x2="201" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/performancelongtasktiming" target="_top"><rect x="201" y="1" width="250" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="326" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">performancelongtasktiming</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties performancelongtasktiming.attribution read only returns a sequence of taskattributiontiming instances.
PerformanceMark - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/performanceentry" target="_top"><rect x="1" y="1" width="160" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="81" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">performanceentry</text></a><polyline points="161,25 171,20 171,30 161,25" stroke="#d4dde4" fill="n...
...one"/><line x1="171" y1="25" x2="201" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/performancemark" target="_top"><rect x="201" y="1" width="150" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="276" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">performancemark</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface has no properties but it extends the following performanceentry properties by qualifying/constraining the properties as follows: performanceentry.entrytype returns "mark".
PerformanceMeasure - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/performanceentry" target="_top"><rect x="1" y="1" width="160" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="81" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">performanceentry</text></a><polyline points="161,25 171,20 171,30 161,25" stroke="#d4dde4" fill="n...
...one"/><line x1="171" y1="25" x2="201" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/performancemeasure" target="_top"><rect x="201" y="1" width="180" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="291" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">performancemeasure</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface has no properties but it extends the following performanceentry properties by qualifying/constrainting the properties as follows: performanceentry.entrytype returns "measure".
PerformanceNavigationTiming - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/performanceentry" target="_top"><rect x="1" y="1" width="160" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="81" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">performanceentry</text></a><polyline points="161,25 171,20 171,30 161,25" stroke="#d4dde4" fill="n...
...one"/><line x1="171" y1="25" x2="201" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/performancenavigationtiming" target="_top"><rect x="201" y="1" width="270" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="336" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">performancenavigationtiming</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface extends the following performanceentry properties for navigation performance entry types by qualifying and constraining them as follows: performanceentry.entrytype read only returns "navigation".
PerformancePaintTiming - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/performanceentry" target="_top"><rect x="1" y="1" width="160" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="81" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">performanceentry</text></a><polyline points="161,25 171,20 171,30 161,25" stroke="#d4dde4" fill="n...
...one"/><line x1="171" y1="25" x2="201" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/performancepainttiming" target="_top"><rect x="201" y="1" width="220" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="311" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">performancepainttiming</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface has no properties but it extends the following performanceentry properties (for "paint" performance entry types) by qualifying and constraining the properties as follows: performanceentry.entrytype returns "paint".
PerformanceResourceTiming - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/performanceentry" target="_top"><rect x="1" y="1" width="160" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="81" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">performanceentry</text></a><polyline points="161,25 171,20 171,30 161,25" stroke="#d4dde4" fill="n...
...one"/><line x1="171" y1="25" x2="201" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/performanceresourcetiming" target="_top"><rect x="201" y="1" width="250" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="326" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">performanceresourcetiming</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} note: this feature is available in web workers.
ProgressEvent - Web APIs
the progressevent interface represents events measuring progress of an underlying process, like an http request (for an xmlhttprequest, or the loading of the underlying resource of an <img>, <audio>, <video>, <style> or <
link>).
... <div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="25" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/progressevent" target...
PromiseRejectionEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/promiserejectionevent" target="_top"><rect x="116" y="1" width="210" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="221" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">promiserejectionevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor promiserejectionevent() creates a promiserejectionevent event, given the type of event (unhandledrejection or rejectionhandled) and other details.
RTCDTMFSender - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/rtcdtmfsender" target="_top"><rect x="151" y="1" width="130" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="216" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">rtcdtmfsender</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties rtcdtmfsender.tonebuffer read only a domstring which contains the list of dtmf tones currently in the queue to be transmitted (tones which have already been played are no longer included in the string).
RadioNodeList - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/nodelist" target="_top"><rect x="1" y="1" width="80" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="41" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">nodelist</text></a><polyline points="81,25 91,20 91,30 81,25" stroke="#d4dde4" fill="none"/><line x1="91" y...
...1="25" x2="121" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/radionodelist" target="_top"><rect x="121" y="1" width="130" height="50" fill="#f4f7f8" stroke="#d4dde4" 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.
SVGDocument - Web APIs
referrer domstring returns the uri of the page that
linked to this page.
... the value is an empty string if the user navigated to the page directly (not through a
link, but, for example, via a bookmark).
ServiceWorkerGlobalScope - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 12.142857142857142%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-20 0 700 85" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/workerglobalscope" target="_top"><rect x="151" y="1" width="170" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="236" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">workerglobalscope</text></a><polyline points="321,25 331,20 331,30 321,25" stroke="#d4dde4" fill="none"/><line x1="331" y1="25" x2="361" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/serviceworkerglobalscope" target="_top"><rect x="361" y="1" width="240" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="481" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" t...
SourceBufferList - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/sourcebufferlist" target="_top"><rect x="151" y="1" width="160" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="231" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">sourcebufferlist</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties sourcebufferlist.length read only returns the number of sourcebuffer objects in the list.
StaticRange - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/abstractrange" target="_top"><rect x="1" y="1" width="130" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="66" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">abstractrange</text></a><polyline points="131,25 141,20 141,30 131,25" stroke="#d4dde4" fill="none"/>...
...<line x1="141" y1="25" x2="171" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/staticrange" target="_top"><rect x="171" y="1" width="110" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="226" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">staticrange</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor staticrange() creates a new staticrange object given the staticrangeinit dictionary specifying the default values for its properties.
StorageEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/storageevent" target="_top"><rect x="116" y="1" width="120" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="176" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">storageevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} method overview void initstorageevent( in domstring type, in boolean canbubble, in boolean cancelable, in domstring key, in domstring oldvalue, in domstring newvalue, in usvstring url, in storage storagearea ); attributes attribute type description key domstring represents the key changed.
StyleSheet.ownerNode - Web APIs
this is usually an html <
link> or <style> element, but can also return a processing instruction node in the case of <?xml-stylesheet ?>.
... syntax noderef = stylesheet.ownernode example <html lang="en"> <head> <
link rel="stylesheet" href="example.css"> </head> <body> <button onclick="alert(document.stylesheets[0].ownernode)">show example.css’s ownernode</button> </body> </html> // displays "object html
linkelement" notes for style sheets that are included by other style sheets, such as with @import, the value of this property is null.
SyncEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 8.571428571428571%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-20 0 700 60" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/extendableevent" target="_top"><rect x="116" y="1" width="150" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="191" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">extendableevent</text></a><polyline points="266,25 276,20 276,30 266,25" stroke="#d4dde4" fill="none"/><line x1="276" y1="25" x2="306" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/syncevent" target="_top"><rect x="306" y="1" width="90" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="351" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseli...
TaskAttributionTiming - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/performanceentry" target="_top"><rect x="1" y="1" width="160" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="81" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">performanceentry</text></a><polyline points="161,25 171,20 171,30 161,25" stroke="#d4dde4" fill="n...
...one"/><line x1="171" y1="25" x2="201" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/taskattributiontiming" target="_top"><rect x="201" y="1" width="210" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="306" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">taskattributiontiming</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties taskattributiontiming.containertype read only returns the type of frame container, one of iframe, embed, or object.
TimeEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/timeevent" target="_top"><rect x="116" y="1" width="90" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="161" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">timeevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties timeevent.detail read only is a long that specifies some detail information about the event, depending on the type of the event.
TouchEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/uievent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="153.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">uievent</text></a><polyline points="191,25 201,20 201,30 191,25" stroke="#d4dde4" fill="none"/><line x1="201" y1="25" x2="231" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/touchevent" target="_top"><rect x="231" y="1" width="100" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="281" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">t...
UIEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/uievent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="153.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">uievent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructors uievent() creates a uievent object.
WebGLContextEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/event" target="_top"><rect x="1" y="1" width="75" height="50" fill="#fff" 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">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="2...
...5" x2="116" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/webglcontextevent" target="_top"><rect x="116" y="1" width="170" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="201" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">webglcontextevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface inherits properties from its parent interface, event.
WebGLRenderingContext.createProgram() - Web APIs
these are then
linked into a usable program..
... examples creating a webgl program var program = gl.createprogram(); // attach pre-existing shaders gl.attachshader(program, vertexshader); gl.attachshader(program, fragmentshader); gl.
linkprogram(program); if ( !gl.getprogramparameter( program, gl.
link_status) ) { var info = gl.getprograminfolog(program); throw 'could not compile webgl program.
WebGLRenderingContext.getActiveUniform() - Web APIs
t_mat4x3 gl.sampler_2d gl.sampler_3d gl.sampler_cube gl.sampler_2d_shadow gl.sampler_2d_array gl.sampler_2d_array_shadow gl.sampler_cube_shadow gl.int_sampler_2d gl.int_sampler_3d gl.int_sampler_cube gl.int_sampler_2d_array gl.unsigned_int_sampler_2d gl.unsigned_int_sampler_3d gl.unsigned_int_sampler_cube gl.unsigned_int_sampler_2d_array when gl.
linkprogram is called, webgl creates a list of active uniforms.
... exceptions gl.invalid_value is generated if the program webglprogram is invalid (not
linked, deleted, etc.).
WebGLRenderingContext.uniform[1234][fi][v]() - Web APIs
all active uniform variables defined in a program object are initialized to 0 when the program object is
linked successfully.
... they retain the values assigned to them by a call to this method until the next successful
link operation occurs on the program object, when they are once again initialized to 0.
WebGLRenderingContext.validateProgram() - Web APIs
it checks if it is successfully
linked and if it can be used in the current webgl state.
... examples var program = gl.createprogram(); // attach pre-existing shaders gl.attachshader(program, vertexshader); gl.attachshader(program, fragmentshader); gl.
linkprogram(program); gl.validateprogram(program); if ( !gl.getprogramparameter( program, gl.
link_status) ) { var info = gl.getprograminfolog(program); throw 'could not compile webgl program.
Hello GLSL - Web APIs
gl.shadersource(vertexshader,source); gl.compileshader(vertexshader); source = document.queryselector("#fragment-shader").innerhtml var fragmentshader = gl.createshader(gl.fragment_shader); gl.shadersource(fragmentshader,source); gl.compileshader(fragmentshader); program = gl.createprogram(); gl.attachshader(program, vertexshader); gl.attachshader(program, fragmentshader); gl.
linkprogram(program); gl.detachshader(program, vertexshader); gl.detachshader(program, fragmentshader); gl.deleteshader(vertexshader); gl.deleteshader(fragmentshader); if (!gl.getprogramparameter(program, gl.
link_status)) { var
linkerrlog = gl.getprograminfolog(program); cleanup(); document.queryselector("p").innerhtml = "shader program did not
link successfully.
... " + "error log: " +
linkerrlog; return; } initializeattributes(); gl.useprogram(program); gl.drawarrays(gl.points, 0, 1); cleanup(); } var buffer; function initializeattributes() { gl.enablevertexattribarray(0); buffer = gl.createbuffer(); gl.bindbuffer(gl.array_buffer, buffer); gl.vertexattribpointer(0, 1, gl.float, false, 0, 0); } function cleanup() { gl.useprogram(null); if (buffer) gl.deletebuffer(buffer); if (program) gl.deleteprogram(program); } function getrenderingcontext() { var canvas = document.queryselector("canvas"); canvas.width = canvas.clientwidth; canvas.height = canvas.clientheight; var gl = canvas.getcontext("webgl") || canvas.getcontext("experimental-webgl"); if (!gl) { var paragraph = document.queryselector("p"); ...
Hello vertex attributes - Web APIs
gl.shadersource(vertexshader,source); gl.compileshader(vertexshader); source = document.queryselector("#fragment-shader").innerhtml var fragmentshader = gl.createshader(gl.fragment_shader); gl.shadersource(fragmentshader,source); gl.compileshader(fragmentshader); program = gl.createprogram(); gl.attachshader(program, vertexshader); gl.attachshader(program, fragmentshader); gl.
linkprogram(program); gl.detachshader(program, vertexshader); gl.detachshader(program, fragmentshader); gl.deleteshader(vertexshader); gl.deleteshader(fragmentshader); if (!gl.getprogramparameter(program, gl.
link_status)) { var
linkerrlog = gl.getprograminfolog(program); cleanup(); document.queryselector("p").innerhtml = "shader program did not
link successfully.
... " + "error log: " +
linkerrlog; return; } initializeattributes(); gl.useprogram(program); gl.drawarrays(gl.points, 0, 1); document.queryselector("canvas").addeventlistener("click", function (evt) { var clickxrelativtocanvas = evt.pagex - evt.target.offsetleft; var clickxinwebglcoords = 2.0 * (clickxrelativtocanvas- gl.drawingbufferwidth/2) / gl.drawingbufferwidth; gl.bufferdata(gl.array_buffer, new float32array([clickxinwebglcoords]), gl.static_draw); gl.drawarrays(gl.points, 0, 1); }, false); } var buffer; function initializeattributes() { gl.enablevertexattribarray(0); buffer = gl.createbuffer(); gl.bindbuffer(gl.array_buffer, buffer); gl.bufferdata(gl.array_buffer, new float32array([0.0]), ...
Textures from code - Web APIs
gl.shadersource(vertexshader,source); gl.compileshader(vertexshader); source = document.queryselector("#fragment-shader").innerhtml var fragmentshader = gl.createshader(gl.fragment_shader); gl.shadersource(fragmentshader,source); gl.compileshader(fragmentshader); program = gl.createprogram(); gl.attachshader(program, vertexshader); gl.attachshader(program, fragmentshader); gl.
linkprogram(program); gl.detachshader(program, vertexshader); gl.detachshader(program, fragmentshader); gl.deleteshader(vertexshader); gl.deleteshader(fragmentshader); if (!gl.getprogramparameter(program, gl.
link_status)) { var
linkerrlog = gl.getprograminfolog(program); cleanup(); document.queryselector("p").innerhtml = "shader program did not
link successfully.
... " + "error log: " +
linkerrlog; return; } initializeattributes(); gl.useprogram(program); gl.drawarrays(gl.points, 0, 1); cleanup(); } var buffer; function initializeattributes() { gl.enablevertexattribarray(0); buffer = gl.createbuffer(); gl.bindbuffer(gl.array_buffer, buffer); gl.bufferdata(gl.array_buffer, new float32array([0.0, 0.0]), gl.static_draw); gl.vertexattribpointer(0, 2, gl.float, false, 0, 0); } function cleanup() { gl.useprogram(null); if (buffer) gl.deletebuffer(buffer); if (program) gl.deleteprogram(program); } function getrenderingcontext() { var canvas = document.queryselector("canvas"); canvas.width = canvas.clientwidth; canvas.height = canvas.clientheight; var gl = canvas.getcontext("webgl") || canvas.getcontext("experime...
WebGL model view projection - Web APIs
in addition there is a jsfiddle
link at the bottom of each section.
...if you want to read a full explanation of the math behind it check out some of the following
links: opengl projection matrix perspective projection trying to understand the math behind the perspective projection matrix in webgl one important thing to note about the perspective projection matrix used below is that it flips the z axis.
Signaling and video calling - Web APIs
in this article, we will further enhance the websocket chat first created as part of our websocket documentation (this article
link is forthcoming; it isn't actually online yet) to support opening a two-way video call between users.
... each ice message suggests a communication protocol (tcp or udp), ip address, port number, connection type (for example, whether the specified ip is the peer itself or a relay server), along with other information needed to
link the two computers together.
Taking still photos with WebRTC - Web APIs
the rest is just some page layout fluff and a bit of text offering a
link back to this page.
... once the stream is
linked to the <video> element, we start it playing by calling htmlmediaelement.play().
Using WebRTC data channels - Web APIs
this will automatically trigger the rtcpeerconnection to handle the negotiations for you, causing the remote peer to create a data channel and
linking the two together across the network.
...this will
link the two objects across the rtcpeerconnection.
WebRTC API - Web APIs
more details and
links to relevant guides and tutorials needed webrtc reference because webrtc provides interfaces that work together to accomplish a variety of tasks, we have divided up the reference by category.
... using dtmf with webrtc webrtc's support for interacting with gateways that
link to old-school telephone systems includes support for sending dtmf tones using the rtcdtmfsender interface.
Using the Web Animations API - Web APIs
to prevent the cake from eating itself up before the user has had the chance to click on it, we call animation.pause() on it immediately after it is defined, like so: nommingcake.pause(); we can now use the animation.play() method to run it whenever we’re ready: nommingcake.play(); specifically, we want to
link it to alice’s animation, so she gets bigger as the cupcake gets eaten.
... and we can do the same thing when setting the cake and bottle durations: var drinking = document.getelementbyid('liquid').animate( [ { height: '100%' }, { height: '0' } ], { fill: 'forwards', duration: alicechange.effect.getcomputedtiming().duration / 2 }); drinking.pause(); now all three animations are
linked to just one duration, which we can change easily from one place.
Basic concepts behind Web Audio API - Web APIs
basic audio operations are performed with audio nodes, which are
linked together to form an audio routing graph.
... audio nodes are
linked via their inputs and outputs, forming a chain that starts with one or more sources, goes through one or more nodes, then ends up at a destination.
Web Authentication API - Web APIs
the parameters to the create() call are passed to the authenticator, along with a sha-256 hash of the clientdatajson (only a hash is sent because the
link to the authenticator may be a low-bandwidth nfc or bluetooth
link and the authenticator is just going to sign over the hash to ensure that it isn't tampered with).
...the parameters to the get() call are passed to the authenticator, along with a sha-256 hash of the clientdatajson (only a hash is sent because the
link to the authenticator may be a low-bandwidth nfc or bluetooth
link and the authenticator is just going to sign over the hash to ensure that it isn't tampered with).
Window.ondragdrop - Web APIs
if, from an external source, a tab, a
link, marked text or a file is dragged and dropped onto this window, the alert is fired.
... note how event.stoppropagation(); prevents the browser from loading the dropped tab,
link or file.
Window.opener - Web APIs
syntax const openerwindow = window.opener value a window referring to the window that opened the current window (using window.open(), or by a
link with target attribute set).
... if this window was not opened by being
linked to or created by another, returns null.
WindowOrWorkerGlobalScope.setInterval() - Web APIs
er(/* 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.int
link, a, a:visited { cursor: pointer; color: #000000; text-decoration: underline; } #info { width: 180px; height: 150px; float: right; background-color: #eeeeff; padding: 4px; overflow: auto; font-size: 12px; margin: 4px; border-radius: 5px; /* visibility: hidden; */ } </style> </head> <body> <p id="copyleft" style="font-style: italic; font-size: 12px; text-align: center;"...
...>copyleft 2012 by <a href="https://developer.mozilla.org/" target="_blank">mozilla developer network</a></p> <p id="controls" style="text-align: center;">[ <span class="int
link" onclick="otwexample1.play();">play</span> | <span class="int
link" onclick="otwexample1.pause();">pause</span> | <span class="int
link" onclick="otwexample1.terminate();">terminate</span> ]</p> <div id="info"> vivamus blandit massa ut metus mattis in fringilla lectus imperdiet.
XMLHttpRequest - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.076923076923077%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 650 150" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/xmlhttprequesteventtarget" target="_top"><rect x="151" y="1" width="250" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="276" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">xmlhttprequesteventtarget</text></a><polyline points="401,25 411,20 411,30 401,25" stroke="#d4dde4" fill="none"/><line x1="411" y1="25" x2="441" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/xmlhttprequest" target="_top"><rect x="441" y="1" width="140" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="511" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4...
XMLHttpRequestEventTarget - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">eventtarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#d4dde4" fill="none"/><lin...
...e x1="121" y1="25" x2="151" y2="25" stroke="#d4dde4"/><a x
link:href="/docs/web/api/xmlhttprequesteventtarget" target="_top"><rect x="151" y="1" width="250" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="276" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">xmlhttprequesteventtarget</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties xmlhttprequesteventtarget.onabort contains the function to call when a request is aborted and the abort event is received by this object.
XRWebGLLayer() - Web APIs
the webxr device api xrwebgllayer() constructor creates and returns a new xrwebgllayer object, providing the
linkage between the webxr device and the webgl graphics layer used to render the 3d scene.
... return value a newly-created xrwebgllayer which
links the specified xrsession to the webgl context given by context, which will be used as the renderer for the session.
Web APIs
t htmlbuttonelement htmlcanvaselement htmlcollection htmlcontentelement htmldlistelement htmldataelement htmldatalistelement htmldetailselement htmldialogelement htmldivelement htmldocument htmlelement htmlembedelement htmlfieldsetelement htmlfontelement htmlformcontrolscollection htmlformelement htmlframesetelement htmlhrelement htmlheadelement htmlheadingelement htmlhtmlelement htmlhyper
linkelementutils htmliframeelement htmlimageelement htmlinputelement htmlisindexelement htmlkeygenelement htmllielement htmllabelelement htmllegendelement html
linkelement htmlmapelement htmlmarqueeelement htmlmediaelement htmlmenuelement htmlmenuitemelement htmlmetaelement htmlmeterelement htmlmodelement htmlolistelement htmlobjectelement htmloptgroupelement htmloptionelement htmloptionscoll...
...ledeadline imagebitmap imagebitmaprenderingcontext imagecapture imagedata index inputdevicecapabilities inputevent installevent installtrigger intersectionobserver intersectionobserverentry interventionreportbody k keyboard keyboardevent keyboardlayoutmap keyframeeffect keyframeeffectoptions l largestcontentfulpaint layoutshift layoutshiftattribution linearaccelerationsensor
linkstyle localfilesystem localfilesystemsync localmediastream location lock lockmanager lockedfile m midiaccess midiconnectionevent midiinput midiinputmap midimessageevent midioutputmap mscandidatewindowhide mscandidatewindowshow mscandidatewindowupdate msgestureevent msgraphicstrust msmanipulationevent msrangecollection mssitemodeevent magnetometer mathmlelement mediacapabilities mediac...
Using the aria-describedby attribute - Accessibility
</div> </div> example 2: a close button in the example below, a
link that functions as a 'close' button on a dialog is described elsewhere in the document.
... the aria-describedby attribute is used to associate the description with the
link.
ARIA annotations - Accessibility
for example: <p id="description-id">an extended text description of some kind...</p> <div aria-describedby="description-id"> <!-- some kind of ui feature that needs an accessible description --> </div> aria-details is appropriate when
linking to descriptions or annotations that are a bit more complex — rather than a simple text string, it might contain multiple bits of semantic information: <div id="detail-id"> <h2>a heading</h2> <p>an extended text description of some kind…</p> <p><time datetime="...">a timestamp</time></p> </div> <div aria-details="detail-id"> <!-- some kind of ui feature that needs an accessible de...
... <p>pick your favourite fruit:</p> <form> <ul> <li><label>apple: <input type="radio" name="fruit" value="apple"></label></li> <li><label>orange: <input type="radio" name="fruit" value="orange"></label></li> <li><label>banana: <input type="radio" name="fruit" value="banana"></label></li> </ul> </form> </section> if the descriptive text does appear in the ui, you can
link the description to the widget using aria-describedby, like so: <p id="fruit-desc">choose your favourite fruit — the fruit with the highest number of votes will be added to the lunch options next week.</p> <section aria-describedby="fruit-desc"> <form> <ul> <li><label>apple: <input type="radio" name="fruit" value="apple"></label></li> <li><label>orange: <input type="radio" na...
ARIA: application role - Accessibility
the at will read any semantics like
links, headings, form controls, tables, lists, or images.
...such elements usually include headings, form fields, lists, tables,
links, graphics, or landmark regions.
Community - Accessibility
this document provides
links to mailing lists, newsgroups, forums, and other communities related to accessbility.
... if you know of other useful resources, please
link to them here.
Keyboard-navigable JavaScript widgets - Accessibility
using tabindex by default, when people use the tab key to browse a webpage, only interactive elements (like
links, form controls) get focused.
... the following table describes tabindex behavior in modern browsers: tabindex attribute focusable with mouse or javascript via element.focus() tab navigable not present follows the platform convention of the element (yes for form controls,
links, etc.).
Keyboard - Accessibility
focusable elements should have interactive semantics if an element can be focused using the keyboard, then it should be interactive; that is, the user should be able to do something to it and produce a change of some kind (for example, activating a
link or changing an option).
... standard focusable elements such as
links and input fields are given special styling by the browser by default, so you might not need to specify focus styling for such elements, unless you want the focus styling to be more distinctive.
Perceivable - Accessibility
complex images or charts should have an accessible alternative provided, either on the same page or via a
link.
... use a regular
link instead of a longdesc attribute.
Understanding the Web Content Accessibility Guidelines - Accessibility
for this reason, we have summarised the practical steps you need to take to satisfy the different recommendations, with further
links to more details where required.
... each of the
links below will take you to pages that further expand on these areas, giving you practical advice on how to write your web content so it conforms to the success criteria outlined in each of the wcag 2.0 and 2.1 guidelines that further sub-divides each principle.
::-webkit-progress-inner-element - CSS: Cascading Style Sheets
syntax ::-webkit-progress-inner-element examples these examples work only on b
link and webkit.
... html <progress value="10" max="50"> css progress { -webkit-appearance: none; } ::-webkit-progress-inner-element { border: 2px solid black; } result result screenshot if you're not using a b
link or webkit browsear, the above code resuls in a progress bar looking like this: specifications not part of any standard.
@import - CSS: Cascading Style Sheets
list-of-media-queries is a comma-separated list of media queries conditioning the application of the css rules defined in the
linked url.
... if the browser does not support any these queries, it does not load the
linked resource.
prefers-reduced-data - CSS: Cascading Style Sheets
in this example the montserrat-regular.woff2 font file will neither be preloaded nor downloaded if the user prefers reduced data, in this case the "system font stack" will serve as the fallback font: html <head> <
link rel="preload" href="fonts/montserrat-regular.woff2" as="font" media="(prefers-reduced-data: no-preference)" crossorigin> <
link rel="stylesheet" href="style.css"> </head> css @media (prefers-reduced-data: no-preference) { @font-face { font-family: montserrat; font-style: normal; font-weight: 400; font-display: swap; /* latin */ src: local('m...
...ontserrat regular'), local('montserrat-regular'), url('fonts/montserrat-regular.woff2') format('woff2'); unicode-range: u+0000-00ff, u+0131, u+0152-0153, u+02bb-02bc, u+02c6, u+02da, u+02dc, u+2000-206f, u+2074, u+20ac, u+2122, u+2191, u+2193, u+2212, u+2215, u+feff, u+fffd; } } body { font-family: montserrat, -apple-system, b
linkmacsystemfont, "segoe ui", roboto, helvetica, arial, "microsoft yahei", sans-serif, "apple color emoji", "segoe ui emoji", "segoe ui symbol"; } result specifications specification status comment media queries level 5the definition of 'reduced-data' in that specification.
Attribute selectors - CSS: Cascading Style Sheets
examples
links css a { color: blue; } /* internal
links, beginning with "#" */ a[href^="#"] { background-color: gold; } /*
links with "example" anywhere in the url */ a[href*="example"] { background-color: silver; } /*
links with "insensitive" anywhere in the url, regardless of capitalization */ a[href*="insensitive" i] { color: cyan; } /*
links with "case" anywhere in the url, with matching c...
...apitalization */ a[href*="case" s] { color: pink; } /*
links that end in ".org" */ a[href$=".org"] { color: red; } /*
links that start with "https" and end in ".org" */ a[href^="https"][href$=".org"] { color: green; } html <ul> <li><a href="#internal">internal
link</a></li> <li><a href="http://example.com">example
link</a></li> <li><a href="#insensitive">insensitive internal
link</a></li> <li><a href="http://example.org">example org
link</a></li> <li><a href="https://example.org">example https org
link</a></li> </ul> result languages css /* all divs with a `lang` attribute are bold.
Ordering Flex Items - CSS: Cascading Style Sheets
this allows authors to manipulate the visual presentation while leaving the source order intact for non-css uas and for linear models such as speech and sequential navigation.” - ordering and orientation if your items were
links or some other element that the user could tab to, then the tabbing order would be the order that these items appear in the document source — not your visual order.
... in the live example below i have added a focus style in order that as you tab from
link to
link you can see which is highlighted.
CSS grids, logical values, and writing modes - CSS: Cascading Style Sheets
in this next example i have a grid layout with a set of
links down one side.
...sea lettuce lettuce water chestnut eggplant winter purslane fennel azuki bean earthnut pea sierra leone bologi leek soko chicory celtuce parsley jícama salsify.</p> </div> <nav> <ul> <li><a href="">
link 1</a></li> <li><a href="">
link 2</a></li> <li><a href="">
link 3</a></li> </ul> </nav> </div> physical values and grid layout we encounter physical properties frequently when building websites, and while the grid placement and alignment properties and values respect writing modes, there are things you may want to do with grid that force...
Using the :target pseudo-class in selectors - CSS: Cascading Style Sheets
thus, to add a border to the #example fragment, we would write: #example:target { border: 1px solid black; } targeting all elements if the intent is to create a "blanket" style that will apply to all targeted elements, then the universal selector comes in handy: :target { color: red; } example in the following example, there are five
links that point to elements in the same document.
... selecting the "first"
link, for example, will cause <h1 id="one"> to become the target element.
CSS Text Decoration - CSS: Cascading Style Sheets
examples .under { text-decoration: underline red; } .over { text-decoration: wavy overline lime; } .line { text-decoration: line-through; } .plain { text-decoration: none; } .underover { text-decoration: dashed underline overline; } .thick { text-decoration: solid underline purple 4px; } .b
link { text-decoration: b
link; } <p class="under">this text has a line underneath it.</p> <p class="over">this text has a line over it.</p> <p class="line">this text has a line going through it.</p> <p>this <a class="plain" href="#">
link will not be underlined</a>, as
links generally are by default.
... be careful when removing the text decoration on anchors since users often depend on the underline to denote hyper
links.</p> <p class="underover">this text has lines above <em>and</em> below it.</p> <p class="thick">this text has a really thick purple underline in supporting browsers.</p> <p class="b
link">this text might b
link for you, depending on the browser you use.</p> specifications specification status comment css text decoration module level 4 working draft css text decoration module level 3 candidate recommendation css level 2 (revision 1) recommendation css level 1 recommendation initial definition ...
Pagination - CSS: Cascading Style Sheets
.pagination { list-style: none; margin: 0; padding: 0; display: flex; column-gap: 2px; } accessibility concerns we want to ensure that a person using a screenreader understands what this navigation does, and where they will go when clicking a
link.
... the "see also" section at the end of this document has
links to related accessibility topics.
Using media queries - CSS: Cascading Style Sheets
to target specific media for the <style>, <
link>, <source>, and other html elements with the media= attribute.
... note: a style sheet with a media query attached to its <
link> tag will still download even if the query returns false.
appearance (-moz-appearance, -webkit-appearance) - CSS: Cascading Style Sheets
the -moz-appearance and -webkit-appearance properties are non-standard versions of this propery, used (respectively) by gecko (firefox) and by webkit-based (e.g., safari) and b
link-based (e.g., chrome, opera) browsers to achieve the same thing.
... appearance: textarea; appearance: push-button; appearance: slider-horizontal; appearance: checkbox; appearance: radio; appearance: square-button; appearance: menulist; appearance: listbox; appearance: meter; appearance: progress-bar; /* partial list of available values in gecko */ -moz-appearance: scrollbarbutton-up; -moz-appearance: button-bevel; /* partial list of available values in webkit/b
link (as well as gecko and edge) */ -webkit-appearance: media-mute-button; -webkit-appearance: caret; values standard keywords value demo browser description none div{ color: black; -moz-appearance:none; -webkit-appearance:none; appearance:none; } <div>lorem</div> firefox chrome safari edge no special styling is applied.
border-collapse - CSS: Cascading Style Sheets
<table class="separate"> <caption><code>border-collapse: separate</code></caption> <tbody> <tr><th>browser</th> <th>layout engine</th></tr> <tr><td class="fx">firefox</td> <td class="gk">gecko</td></tr> <tr><td class="ed">edge</td> <td class="tr">edgehtml</td></tr> <tr><td class="sa">safari</td> <td class="wk">webkit</td></tr> <tr><td class="ch">chrome</td> <td class="bk">b
link</td></tr> <tr><td class="op">opera</td> <td class="bk">b
link</td></tr> </tbody> </table> <table class="collapse"> <caption><code>border-collapse: collapse</code></caption> <tbody> <tr><th>browser</th> <th>layout engine</th></tr> <tr><td class="fx">firefox</td> <td class="gk">gecko</td></tr> <tr><td class="ed">edge</td> <td class="tr">edgehtml</td></tr> <tr><td class="sa"...
...>safari</td> <td class="wk">webkit</td></tr> <tr><td class="ch">chrome</td> <td class="bk">b
link</td></tr> <tr><td class="op">opera</td> <td class="bk">b
link</td></tr> </tbody> </table> css .collapse { border-collapse: collapse; } .separate { border-collapse: separate; } table { display: inline-table; margin: 1em; border: dashed 5px; } table th, table td { border: solid 3px; } .fx { border-color: orange blue; } .gk { border-color: black red; } .ed { border-color: blue gold; } .tr { border-color: aqua; } .sa { border-color: silver blue; } .wk { border-color: gold blue; } .ch { border-color: red yellow green blue; } .bk { border-color: navy blue teal aqua; } .op { border-color: red; } result specifications specification status comment ...
mask-type - CSS: Cascading Style Sheets
formal definition initial valueluminanceapplies to<mask> elementsinheritednocomputed valueas specifiedanimation typediscrete formal syntax luminance | alpha examples setting an alpha mask html <div class="redsquare"></div> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link" width="0" height="0"> <defs> <mask id="m" maskcontentunits="objectboundingbox" style="mask-type:alpha"> <rect x=".1" y=".1" width=".8" height=".8" fill="red" fill-opacity="0.7"/> </mask> </defs> </svg> css .redsquare { height: 100px; width: 100px; background-color: rgb(128, 128, 128); border: solid 1px black; mask: url("...
...#m"); } result setting a luminance mask html <div class="redsquare"></div> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link" width="0" height="0"> <defs> <mask id="m" maskcontentunits="objectboundingbox" style="mask-type:luminance"> <rect x=".1" y=".1" width=".8" height=".8" fill="red" fill-opacity="0.7"/> </mask> </defs> </svg> css .redsquare { height: 100px; width: 100px; background-color: rgb(128, 128, 128); border: solid 1px black; mask: url("#m"); mask-type:luminance; } result specifications specification status comment css masking module level 1the definition of 'mask-type' in that specification.
text-decoration - CSS: Cascading Style Sheets
| <'text-decoration-style'> | <'text-decoration-color'> | <'text-decoration-thickness'> examples .under { text-decoration: underline red; } .over { text-decoration: wavy overline lime; } .line { text-decoration: line-through; } .plain { text-decoration: none; } .underover { text-decoration: dashed underline overline; } .thick { text-decoration: solid underline purple 4px; } .b
link { text-decoration: b
link; } <p class="under">this text has a line underneath it.</p> <p class="over">this text has a line over it.</p> <p class="line">this text has a line going through it.</p> <p>this <a class="plain" href="#">
link will not be underlined</a>, as
links generally are by default.
... be careful when removing the text decoration on anchors since users often depend on the underline to denote hyper
links.</p> <p class="underover">this text has lines above <em>and</em> below it.</p> <p class="thick">this text has a really thick purple underline in supporting browsers.</p> <p class="b
link">this text might b
link for you, depending on the browser you use.</p> specifications specification status comment css text decoration module level 4 working draft adds text-decoration-thickness; note that this isn't yet officially part of the shorthand — this is as yet unspecified.
vertical-align - CSS: Cascading Style Sheets
esrefer to the line-height of the element itselfcomputed valuefor percentage and length values, the absolute length, otherwise the keyword as specifiedanimation typea length formal syntax baseline | sub | super | text-top | text-bottom | middle | top | bottom | <percentage> | <length> examples basic example html <div>an <img src="https://udn.realityripple.com/samples/b4/e1f0faff5b.svg" alt="
link" width="32" height="32" /> image with a default alignment.</div> <div>an <img class="top" src="https://udn.realityripple.com/samples/b4/e1f0faff5b.svg" alt="
link" width="32" height="32" /> image with a text-top alignment.</div> <div>an <img class="bottom" src="https://udn.realityripple.com/samples/b4/e1f0faff5b.svg" alt="
link" width="32" height="32" /> image with a text-bottom alignment.</div> <d...
...iv>an <img class="middle" src="https://udn.realityripple.com/samples/b4/e1f0faff5b.svg" alt="
link" width="32" height="32" /> image with a middle alignment.</div> css img.top { vertical-align: text-top; } img.bottom { vertical-align: text-bottom; } img.middle { vertical-align: middle; } result specifications specification status comment css level 2 (revision 1)the definition of 'vertical-align' in that specification.
CSS: Cascading Style Sheets
we round off the module by looking at applying custom fonts to your page, and styling lists and
links.
... use css to solve common problems this module provides
links to sections of content explaining how to use css to solve common problems when creating a web page.
Demos of open web technologies
this page offers
links to interesting demonstrations of these technologies.
... if you know of a good demonstration or application of open web technology, please add a
link to the appropriate section here.
Community - Developer guides
if you know of useful mailing lists, newsgroups, forums, or other communities related to ajax, please
link to them here.
...matter.com: courses and events on javascript, ajax, and reverse ajax technologies telerik.com: an active community forum for ajax community.tableau.com: community support forum and courses available for ajax codementor.io: social platform with ajax forums and tutorials lynda.com: tutorials available for learning the fundamentals of ajax ajax interview questions and answer and answerinterwiki
links ...
Cross-browser audio basics - Developer guides
in this case, we've provided a simple paragraph including a
link to download the audio directly.
...such browsers can be covered using a simple
link to the media file, as we showed earlier, or via a fallback written in a plugin technology such as adobe flash or microsoft silverlight.
Creating a cross-browser video player - Developer guides
n" value="true" /> <param name="wmode" value="transparent" /> <param name="flashvars" value="controlbar=over&image=img/poster.jpg&file=flash-player.swf?videourl=video/tears-of-steel-battle-clip-medium.mp4" /> <img alt="tears of steel poster image" src="img/poster.jpg" width="1024" height="428" title="no video playback possible, please download the video from the
link below" /> </object> <!-- offer download --> <a href="video/tears-of-steel-battle-clip-medium.mp4">download mp4</a> </video> <figcaption>© blender foundation | <a href="http://mango.blender.org">mango.blender.org</a></figcaption> </figure> even though this player will define its own custom control set, the controls attribute is still added to the <video> element, and ...
...in addition a download
link is displayed to allow users to download the mp4 video file, should they wish to (providing those without flash installed with a method of viewing the video, a fallback for a fallback if you like).
Audio and Video Delivery - Developer guides
the general technique for achieving this is to omit the controls attribute so that the default browser controls are not displayed, create custom controls using html and css, then use javascript to
link your controls to the audio/video api.
...form based set up with domain specific
link to cdn hosted library.
Introduction to Web development - Developer guides
whether you're just getting started with web development, or are just expanding your horizons into new realms of web awesomeness, the
links here should help you get started.
... for another (overlapping) set of
links to learning resources, see the mdn learning pages.
Printing - Developer guides
<
link href="/path/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.
...,height=150'); my_window.document.write('<html><head><title>print me</title></head>'); my_window.document.write('<body onafterprint="self.close()">'); my_window.document.write('<p>when you print this window, it will close afterward.</p>'); my_window.document.write('</body></html>'); } </script> </head> <body> <p>to try out the <code>afterprint</code> event, click the
link below to open the window to print.
HTML attribute: crossorigin - HTML: Hypertext Markup Language
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.
... <
link rel="manifest" href="/app.webmanifest" crossorigin="use-credentials"> specifications specification status comment html living standardthe definition of 'cors settings attributes' in that specification.
<input type="search"> - HTML: Hypertext Markup Language
webkit and b
link only (safari, chrome, opera, etc.).
... incremental the boolean attribute incremental is a webkit and b
link extension (so supported by safari, opera, chrome, etc.) which, if present, tells the user agent to process the input as a live search.
<map> - HTML: Hypertext Markup Language
the html <map> element is used with <area> elements to define an image map (a clickable
link area).
... <area shape="circle" coords="75,75,75" href="left.html"> <area shape="circle" coords="275,75,75" href="right.html"> </map> <img usemap="#primary" src="https://udn.realityripple.com/samples/6a/7e559101b3.png" alt="350 x 150 pic"> result expected live example output the live example above should appear similar to the following images (when using your keyboard tab key): for the left.html
link: for the right.html
link specifications specification status comment html living standardthe definition of '<map>' in that specification.
MIME types (IANA media types) - HTTP
specifically if they download a text/plain file from a <
link> element declaring a css file, they will not recognize it as a valid css file if presented with text/plain.
...fox, internet explorer, opera, safari svg scalable vector graphics image/svg+xml .svg chrome, edge, firefox, internet explorer, opera, safari tiff tagged image file format image/tiff .tif, .tiff none built-in; add-ons required webp web picture format image/webp .webp chrome, edge, firefox, opera the abbreviation 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.
HTTP caching - HTTP
this is typical of the technical resources included and
linked from each web pages: javascript and css files change infrequently, but when they change you want them to be updated quickly.
...in order to have the new versions, all the
links to them must be changed, that is the drawback of this method: additional complexity that is usually taken care of by the tool chain used by web developers.
Content negotiation - HTTP
the accept header is defined by the browser, or any other user-agent, and can vary according to the context, like fetching an html page or an image, a video, or a script: it is different when fetching a document entered in the address bar or an element
linked via an <img>, <video> or <audio> element.
...in this negotiation, when facing an ambiguous request, the server sends back a page containing
links to the available alternative resources.
Content-Security-Policy - HTTP
style-src-elem specifies valid sources for stylesheets <style> elements and <
link> elements with rel="stylesheet".
... referrer used to specify information in the referer (sic) header for
links away from a page.
Referer - HTTP
the referer request header contains the address of the previous web page from which a
link to the currently requested page was followed.
... header type request header forbidden header name yes syntax referer: <url> directives <url> an absolute or partial address of the previous web page from which a
link to the currently requested page was followed.
User-Agent - HTTP
examples mozilla/5.0 (windows nt 6.1; win64; x64; rv:47.0) gecko/20100101 firefox/47.0 mozilla/5.0 (macintosh; intel mac os x x.y; rv:42.0) gecko/20100101 firefox/42.0 chrome ua string the chrome (or chromium/b
link-based engines) user agent string is similar to firefox’s.
... examples mozilla/5.0 (x11; linux x86_64) applewebkit/537.36 (khtml, like gecko) chrome/51.0.2704.103 safari/537.36 opera ua string the opera browser is also based on the b
link engine, which is why it almost looks the same, but adds "opr/<version>".
JavaScript language resources - JavaScript
the following ecmascript standards have been approved or are being worked on: name
links release date description current editions ecma-262 10th edition pdf, html, working draft, repository 2019 ecmascript 2019 language specification ecma-262 9th edition pdf, html, working draft, repository 2018 ecmascript 2018 language specification ecma-402 5th edition working draft, repository 2018 ecmascript 2018 internationalization api specification obsolete/historical editions ecma-262 pdf ...
... you can participate in or just track the work on the next revisions of the ecmascript language specification, code-named "harmony", and the ecmascript internationalization api specification via public wiki and the es-discuss mailing list
linked from ecmascript.org.
JavaScript error reference - JavaScript
errors displayed in the web console may include a
link to the corresponding page below to help you quickly comprehend the problem in your code.
...for more information, follow the
links below!
WebAssembly.instantiateStreaming() - JavaScript
there must be one matching property for each declared import of the compiled module or else a webassembly.
linkerror is thrown.
... if the operation fails, the promise rejects with a webassembly.compileerror, webassembly.
linkerror, or webassembly.runtimeerror, depending on the cause of the failure.
Web app manifests
unlike regular web apps with simple homescreen
links or bookmarks, pwas can be downloaded in advance and can work offline, as well as use regular web apis.
.../touch/homescreen168.png", "sizes": "168x168", "type": "image/png" }, { "src": "images/touch/homescreen192.png", "sizes": "192x192", "type": "image/png" }], "related_applications": [{ "platform": "play", "url": "https://play.google.com/store/apps/details?id=cheeaun.hackerweb" }] } deploying a manifest web app manifests are deployed in your html pages using a <
link> element in the <head> of a document: <
link rel="manifest" href="/manifest.webmanifest"> note: the .webmanifest extension is specified in the media type registration section of the specification (the response of the manifest file should return content-type: application/manifest+json).
Web media technologies
this article lists the various apis with
links to documentation you may find helpful in mastering them.
...<video> can also be used as a way to
link media apis with other html and dom technologies, including <canvas> (for frame grabbing and manipulation), for example.
Add to Home screen - Progressive web apps (PWAs)
to have a manifest file with the correct fields filled in,
linked from the html head.
...
link the html to the manifest to finish setting up your manifest, you need to reference it from the html of your application's home page: <
link rel="manifest" href="manifest.webmanifest"> browsers that support a2hs will know where to look for your manifest once this is in place.
Progressive loading - Progressive web apps (PWAs)
we can also split css files and add media types to them: <
link rel="stylesheet" href="style.css"> <
link rel="stylesheet" href="print.css" media="print"> this will tell the browser to load them only when the condition is met.
... we could rewrite the loading process to load not only the images, but the complete items consisting of full descriptions and
links.
The building blocks of responsive design - Progressive web apps (PWAs)
in this article we will discuss the main essential components of responsive design, with some
links to further information where necessary.
...to achieve this, we applied the brick css to the page using a separate <
link> element with a media attribute: <
link href="dist/brick.css" type="text/css" rel="stylesheet" media="all and (max-width: 480px)"> this says that the whole stylesheet will not be
linked to the html unless the viewport width is 480px or less.
end - SVG: Scalable Vector Graphics
ddle">8s</text> <line x1="110" y1="25" x2="110" y2="105" stroke="grey" stroke-width=".5" /> <line x1="10" y1="30" x2="110" y2="30" stroke="grey" stroke-width=".5" /> <line x1="10" y1="105" x2="110" y2="105" stroke="grey" stroke-width=".5" /> </svg> event example <svg width="120" height="120" viewbox="0 0 120 120" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:x
link="http://www.w3.org/1999/x
link"> <!-- animated rectangle --> <rect x="10" y="35" height="15" width="0"> <animate attributetype="xml" attributename="width" from="0" to="100" begin="0s" end="endbutton.click" dur="8s" repeatcount="indefinite" fill="freeze" /> </rect> <!-- trigger --> <rect id="endbutton" style="cursor:pointer;" ...
...dle">8s</text> <line x1="110" y1="25" x2="110" y2="55" stroke="grey" stroke-width=".5" /> <line x1="10" y1="30" x2="110" y2="30" stroke="grey" stroke-width=".5" /> <line x1="10" y1="55" x2="110" y2="55" stroke="grey" stroke-width=".5" /> </svg> accesskey example <svg width="120" height="120" viewbox="0 0 120 120" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:x
link="http://www.w3.org/1999/x
link"> <!-- animated rectangles --> <rect x="10" y="35" height="15" width="0"> <animate attributetype="xml" attributename="width" from="0" to="100" begin="0s" end="accesskey(e)" dur="8s" repeatcount="indefinite" fill="freeze" /> </rect> <!-- trigger --> <text x="60" y="80" text-anchor="middle" style...
<altGlyph> - SVG: Scalable Vector Graphics
value type: <string> ; default value: none; animatable: no x
link:href an <iri> reference either to a <glyph> element in an svg document or to an <altglyphdef> element.
...tion attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, dominant-baseline, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, text-anchor, transform, vector-effect, visibility x
link attributes x
link:href, x
link:type, x
link:role, x
link:arcrole, x
link:title, x
link:show, x
link:actuate dom interface this element implements the svgaltglyphelement interface.
<cursor> - SVG: Scalable Vector Graphics
usage context categoriesnonepermitted contentany number of the following elements, in any order:descriptive elements attributes global attributes conditional processing attributes core attributes x
link attributes externalresourcesrequired specific attributes x y x
link:href dom interface this element implements the svgcursorelement interface.
... candidate recommendation replaced x
link:href by href attribute.
<feGaussianBlur> - SVG: Scalable Vector Graphics
example simple example svg <svg width="230" height="120" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <filter id="blurme"> <fegaussianblur in="sourcegraphic" stddeviation="5" /> </filter> <circle cx="60" cy="60" r="50" fill="green" /> <circle cx="170" cy="60" r="50" fill="green" filter="url(#blurme)" /> </svg> result screenshotlive sample drop shadow example svg <svg width="120" height="120" xmlns="http://www.w3.org/2000/svg" xmlns:...
...x
link="http://www.w3.org/1999/x
link"> <filter id="dropshadow"> <fegaussianblur in="sourcealpha" stddeviation="3" /> <feoffset dx="2" dy="4" /> <femerge> <femergenode /> <femergenode in="sourcegraphic" /> </femerge> </filter> <circle cx="60" cy="60" r="50" fill="green" filter="url(#dropshadow)" /> </svg> result screenshotlive sample specifications specification status comment filter effects module level 1the definition of '<fegaussianblur>' in that specification.
<fePointLight> - SVG: Scalable Vector Graphics
example svg <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <defs> <filter id="spotlight"> <fespecularlighting result="spotlight" specularconstant="1.5" specularexponent="80" lighting-color="#fff"> <fepointlight x="50" y="50" z="220"/> </fespecularlighting> <fecomposite in="sourcegraphic" in2="spotlight" operator="arithmetic" k1="0" k2="1" k3="1" k4="0"/> </filter> <...
.../defs> <image x
link:href="/files/6457/mdn_logo_only_color.png" x="10%" y="10%" width="80%" height="80%" style="filter:url(#spotlight);"/> </svg> result specifications specification status comment filter effects module level 1the definition of '<fepointlight>' in that specification.
<feSpotLight> - SVG: Scalable Vector Graphics
example html content <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <defs> <filter id="spotlight"> <fespecularlighting result="spotlight" specularconstant="1.5" specularexponent="4" lighting-color="#fff"> <fespotlight x="600" y="600" z="400" limitingconeangle="5.5" /> </fespecularlighting> <fecomposite in="sourcegraphic" in2="spotlight" operator="out" k1="0" k2="1" k3="1" k4="0"/>...
... </filter> </defs> <image x
link:href="/files/6457/mdn_logo_only_color.png" x="10%" y="10%" width="80%" height="80%" style="filter:url(#spotlight);"/> </svg> result specifications specification status comment filter effects module level 1the definition of '<fespotlight>' in that specification.
<symbol> - SVG: Scalable Vector Graphics
html,body,svg { height:100% } <svg viewbox="0 0 80 20" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <!-- our symbol in its own coordinate system --> <symbol id="mydot" width="10" height="10" viewbox="0 0 2 2"> <circle cx="1" cy="1" r="1" /> </symbol> <!-- a grid to materialize our symbol positioning --> <path d="m0,10 h80 m10,0 v20 m25,0 v20 m40,0 v20 m55,0 v20 m70,0 v20" fill="none" stroke="pink" /> <!-- all instances of our symbol --> <us...
...e x
link:href="#mydot" x="5" y="5" style="opacity:1.0" /> <use x
link:href="#mydot" x="20" y="5" style="opacity:0.8" /> <use x
link:href="#mydot" x="35" y="5" style="opacity:0.6" /> <use x
link:href="#mydot" x="50" y="5" style="opacity:0.4" /> <use x
link:href="#mydot" x="65" y="5" style="opacity:0.2" /> </svg> attributes height this attribute determines the height of the symbol.
<tref> - SVG: Scalable Vector Graphics
usage context categoriestext content element, text content child elementpermitted contentany number of the following elements, in any order:descriptive elements<animate>, <animatecolor>, <set> attributes global attributes conditional processing attributes core attributes graphical event attributes presentation attributes x
link attributes class style externalresourcesrequired specific attributes x
link:href dom interface this element implements the svgtrefelement interface.
... example <svg width="100%" height="100%" viewbox="0 0 1000 300" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <defs> <text id="referencedtext"> referenced character data </text> </defs> <text x="100" y="100" font-size="45" > inline character data </text> <text x="100" y="200" font-size="45" fill="red" > <tref x
link:href="#referencedtext"/> </text> <!-- show outline of canvas using 'rect' element --> <rect x="1" y="1" width="998" height="298" fill="none" stroke-width="2" /> </svg> specifications specification status comment scalable vector graphics (svg) 1.1 (second edition)the definition of '<font>' in that specification.
<view> - SVG: Scalable Vector Graphics
tentany number of the following elements, in any order:descriptive elements attributes global attributes aria attributes » core attributes » global event attributes » externalresourcesrequired specific attributes viewbox preserveaspectratio zoomandpan viewtarget example svg <svg width="600" height="200" viewbox="0 0 600 200" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <defs> <radialgradient id="gradient"> <stop offset="0%" stop-color="#8cffa0" /> <stop offset="100%" stop-color="#8ca0ff" /> </radialgradient> </defs> <circle r="50" cx="180" cy="50" style="fill:url(#gradient)"/> <view id="halfsizeview" viewbox="0 0 1200 400"/> <view id="normalsizeview" viewbox="0 0 600 200"/> <view id="doublesizevi...
...ew" viewbox="0 0 300 100"/> <a x
link:href="#halfsizeview"> <text x="5" y="20" font-size="20">half size</text> </a> <a x
link:href="#normalsizeview"> <text x="5" y="40" font-size="20">normal size</text> </a> <a x
link:href="#doublesizeview"> <text x="5" y="60" font-size="20">double size</text> </a> </svg> result dom interface this element implements the svgviewelement interface.
Gradients in SVG - SVG: Scalable Vector Graphics
<lineargradient id="gradient2" x1="0" x2="0" y1="0" y2="1"> note: you can also use the x
link:href attribute on gradients too.
... <lineargradient id="gradient1"> <stop id="stop1" offset="0%"/> <stop id="stop2" offset="50%"/> <stop id="stop3" offset="100%"/> </lineargradient> <lineargradient id="gradient2" x1="0" x2="0" y1="0" y2="1" xmlns:x
link="http://www.w3.org/1999/x
link" x
link:href="#gradient1"/> i've included the x
link namespace here directly on the node, although usually you would define it at the top of your document.
Texts - SVG: Scalable Vector Graphics
textpath this element fetches via its x
link:href attribute an arbitrary path and aligns the characters, that it encircles, along this path: <path id="my_path" d="m 20,20 c 80,60 100,40 120,20" fill="transparent" /> <text> <textpath xmlns:x
link="http://www.w3.org/1999/x
link" x
link:href="#my_path"> a curve.
... </textpath> </text> playable code 2 <svg width="200" height="100" xmlns="http://www.w3.org/2000/svg"> <path id="my_path" d="m 20,20 c 80,60 100,40 120,20" fill="transparent" /> <text> <textpath xmlns:x
link="http://www.w3.org/1999/x
link" x
link:href="#my_path"> a curve.
Securing your site - Web security
this article offers an assortment of suggestions, as well as
links to other articles providing more useful information.
...you can ignore specific ips, restrict access to certain areas of website, protect different files, protect against image hot
linking, and a lot more.
Subresource Integrity - Web security
using subresource integrity you use the subresource integrity feature by specifying a base64-encoded cryptographic hash of a resource (file) you’re telling the browser to fetch, in the value of the integrity attribute of any <script> or <
link> element.
... how browsers handle subresource integrity browsers handle sri by doing the following: when a browser encounters a <script> or <
link> element with an integrity attribute, before executing the script or before applying any stylesheet specified by the <
link> element, the browser must first compare the script or stylesheet to the expected hash given in the integrity value.
Types of attacks - Web security
click-jacking click-jacking is the practice of tricking a user into clicking on a
link, button, etc.
... reflected xss attacks when a user is tricked into clicking a malicious
link, submitting a specially crafted form, or browsing to a malicious site, the injected code travels to the vulnerable website.
Using custom elements - Web Components
external styles in the above example we apply style to the shadow dom using a <style> element, but it is perfectly possible to do it by referencing an external stylesheet from a <
link> element instead.
... for example, take a look at this code from our popup-info-box-external-stylesheet example (see the source code): // apply external styles to the shadow dom const
linkelem = document.createelement('
link');
linkelem.setattribute('rel', 'stylesheet');
linkelem.setattribute('href', 'style.css'); // attach the created element to the shadow dom shadow.appendchild(
linkelem); note that <
link> elements do not block paint of the shadow root, so there may be a flash of unstyled content (fouc) while the stylesheet loads.
Communicating With Other Scripts - Archive of obsolete content
page scripts if a page includes its own scripts using <script> tags, either embedded in the page or
linked to it using the src attribute, there are a couple of ways a content script can communicate with it: using the dom postmessage() api using custom dom events using the dom postmessage api note that before firefox 31 code in content scripts can't use window to access postmessage() and addeventlistener() and instead must use document.defaultview.
RTCPeerConnection: datachannel event - Web APIs
pc.addeventlistener("datachannel", ev => { receivechannel = ev.channel; receivechannel.onmessage = myhandlemessage; receivechannel.onopen = myhandleopen; receivechannel.onclose = myhandleclose; }, false); receivechannel is set to the value of the event's channel property, which specifies the rtcdatachannel object representing the data channel
linking the remote peer to the local one.
Request.mode - Web APIs
however, for requests created other than 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.
SVGAltGlyphDefElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link: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;}...
SVGAltGlyphItemElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link: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: a...
SVGAnimateColorElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link: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: ...
SVGExternalResourcesRequired - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/svgexternalresourcesrequired" target="_top"><rect x="1" y="1" width="280" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="141" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgexternalresourcesrequired</text></a></svg></div> a:hover text { fill: #0095dd;...
SVGFilterPrimitiveStandardAttributes - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/svgfilterprimitivestandardattributes" target="_top"><rect x="1" y="1" width="360" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="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 ...
SVGFontElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/svgfontelement" 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">svgfontelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} ...
SVGFontFaceElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/svgfontfaceelement" 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">svgfontfaceelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;...
SVGFontFaceFormatElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/svgfontfaceformatelement" target="_top"><rect x="1" y="1" width="240" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="121" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfontfaceformatelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer...
SVGFontFaceNameElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/svgfontfacenameelement" 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">svgfontfacenameelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-eve...
SVGFontFaceSrcElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/svgfontfacesrcelement" 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">svgfontfacesrcelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-event...
SVGFontFaceUriElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/svgfontfaceurielement" 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">svgfontfaceurielement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-event...
SVGGlyphElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveaspectratio="xminymin meet"><a x
link:href="/docs/web/api/svgglyphelement" target="_top"><rect x="1" y="1" width="150" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-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">svgglyphelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} ...
SVGGlyphRefElement - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveaspectratio="xminymin meet"><a x
link: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;} prop...
clipPathUnits - SVG: Scalable Vector Graphics
</clippath> <!-- some reference rect to materialized to clip path --> <rect id="r1" x="0" y="0" width="45" height="45" /> <rect id="r2" x="0" y="55" width="45" height="45" /> <rect id="r3" x="55" y="55" width="45" height="45" /> <rect id="r4" x="55" y="0" width="45" height="45" /> <!-- the first 3 rect are clipped with usespaceonuse units --> <use clip-path="url(#myclip1)" x
link:href="#r1" fill="red" /> <use clip-path="url(#myclip1)" x
link:href="#r2" fill="red" /> <use clip-path="url(#myclip1)" x
link:href="#r3" fill="red" /> <!-- the last rect is clipped with objectboundingbox units --> <use clip-path="url(#myclip2)" x
link:href="#r4" fill="red" /> </svg> clippath for <clippath>, clippathunits define the coordinate system in use for the content of the elemen...
color-interpolation - SVG: Scalable Vector Graphics
for gradients which make use of the href or the deprecated x
link:href attribute to reference another gradient, the gradient uses the propertyʼs value from the gradient element which is directly referenced by the fill or stroke property.
divisor - SVG: Scalable Vector Graphics
height: 100%; } <svg viewbox="0 0 420 200" xmlns="http://www.w3.org/2000/svg"> <filter id="convolvematrix1" x="0" y="0" width="100%" height="100%"> <feconvolvematrix kernelmatrix="1 2 0 0 0 0 0 0 -1" divisor="1"/> </filter> <filter id="convolvematrix2" x="0" y="0" width="100%" height="100%"> <feconvolvematrix kernelmatrix="1 2 0 0 0 0 0 0 -1" divisor="8"/> </filter> <image x
link:href="//developer.mozilla.org/files/6457/mdn_logo_only_color.png" width="200" height="200" style="filter:url(#convolvematrix1);"/> <image x
link:href="//developer.mozilla.org/files/6457/mdn_logo_only_color.png" width="200" height="200" style="filter:url(#convolvematrix2); transform:translatex(220px);"/> </svg> usage notes value <number> default value sum ...
kernelMatrix - SVG: Scalable Vector Graphics
x> html, body, svg { height: 100%; } <svg viewbox="0 0 420 200" xmlns="http://www.w3.org/2000/svg"> <filter id="convolvematrix1" x="0" y="0" width="100%" height="100%"> <feconvolvematrix kernelmatrix="1 1 0 0 0 0 0 0 -1"/> </filter> <filter id="convolvematrix2" x="0" y="0" width="100%" height="100%"> <feconvolvematrix kernelmatrix="-1 0 0 0 0 0 0 0 1"/> </filter> <image x
link:href="//developer.mozilla.org/files/6457/mdn_logo_only_color.png" width="200" height="200" style="filter:url(#convolvematrix1);"/> <image x
link:href="//developer.mozilla.org/files/6457/mdn_logo_only_color.png" width="200" height="200" style="filter:url(#convolvematrix2); transform:translatex(220px);"/> </svg> usage notes value <list of numbers> default valu...
keyPoints - SVG: Scalable Vector Graphics
five elements are using this attribute: <animate>, <animatecolor>, <animatemotion>, <animatetransform>, and <set> html, body, svg { height: 100%; } <svg viewbox="0 0 120 120" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <path d="m10,110 a120,120 -45 0,1 110 10 a120,120 -45 0,1 10,110" stroke="lightgrey" stroke-width="2" fill="none" id="motionpath"/> <circle cx="10" cy="110" r="3" fill="lightgrey"/> <circle cx="110" cy="10" r="3" fill="lightgrey"/> <circle r="5" fill="red"> <animatemotion dur="3s" repeatcount="indefinite" keypoints="0;0.5;1" keytimes="0;0.15;1" calcmode="linear"> <mpath x
link:href="#motionpath"/> </animatemotion> </circle> ...
local - SVG: Scalable Vector Graphics
if both the x
link:href and the local attribute are specified, then the local file system is searched for the color profile first, and, if not available locally, then the resource identified by the x
link:href attribute is used.
maskContentUnits - SVG: Scalable Vector Graphics
.5" r=".35" /> </mask> <!-- some reference rect to materialized the mask --> <rect id="r1" x="0" y="0" width="45" height="45" /> <rect id="r2" x="0" y="55" width="45" height="45" /> <rect id="r3" x="55" y="55" width="45" height="45" /> <rect id="r4" x="55" y="0" width="45" height="45" /> <!-- the first 3 rect are masked with usespaceonuse units --> <use mask="url(#mymask1)" x
link:href="#r1" fill="red" /> <use mask="url(#mymask1)" x
link:href="#r2" fill="red" /> <use mask="url(#mymask1)" x
link:href="#r3" fill="red" /> <!-- the last rect is masked with objectboundingbox units --> <use mask="url(#mymask2)" x
link:href="#r4" fill="red" /> </svg> mask for <mask>, maskcontentunits defines the coordinate system in use for the content of the element.
maskUnits - SVG: Scalable Vector Graphics
"50" r="35" /> </mask> <!-- some reference rect to materialized the mask --> <rect id="r1" x="0" y="0" width="45" height="45" /> <rect id="r2" x="0" y="55" width="45" height="45" /> <rect id="r3" x="55" y="55" width="45" height="45" /> <rect id="r4" x="55" y="0" width="45" height="45" /> <!-- the first 3 rect are masked with usespaceonuse units --> <use mask="url(#mymask1)" x
link:href="#r1" fill="red" /> <use mask="url(#mymask1)" x
link:href="#r2" fill="red" /> <use mask="url(#mymask1)" x
link:href="#r3" fill="red" /> <!-- the last rect is masked with objectboundingbox units --> <use mask="url(#mymask2)" x
link: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 ...
mode - SVG: Scalable Vector Graphics
flood-color="seagreen" flood-opacity="1"/> <feblend in="sourcegraphic" in2="floodfill" mode="multiply"/> </filter> <filter id="blending2" x="0" y="0" width="100%" height="100%"> <feflood result="floodfill" x="0" y="0" width="100%" height="100%" flood-color="seagreen" flood-opacity="1"/> <feblend in="sourcegraphic" in2="floodfill" mode="color-dodge"/> </filter> <image x
link:href="//developer.mozilla.org/files/6457/mdn_logo_only_color.png" width="200" height="200" style="filter:url(#blending1);"/> <image x
link:href="//developer.mozilla.org/files/6457/mdn_logo_only_color.png" width="200" height="200" style="filter:url(#blending2); transform:translatex(220px);"/> </svg> usage notes value <blend-mode> default value normal ...
preserveAlpha - SVG: Scalable Vector Graphics
svg viewbox="0 0 420 200" xmlns="http://www.w3.org/2000/svg"> <filter id="convolvematrix1" x="0" y="0" width="100%" height="100%"> <feconvolvematrix kernelmatrix="1 -1 2 0 0 0 0 0 -2" preservealpha="true"/> </filter> <filter id="convolvematrix2" x="0" y="0" width="100%" height="100%"> <feconvolvematrix kernelmatrix="1 -1 2 0 0 0 0 0 -2" preservealpha="false"/> </filter> <image x
link:href="//developer.mozilla.org/files/6457/mdn_logo_only_color.png" width="200" height="200" style="filter:url(#convolvematrix1);"/> <image x
link:href="//developer.mozilla.org/files/6457/mdn_logo_only_color.png" width="200" height="200" style="filter:url(#convolvematrix2); transform:translatex(220px);"/> </svg> usage notes default value false value true | ...
stroke-linejoin - SVG: Scalable Vector Graphics
<!-- the following pink lines highlight the position of the path for each stroke --> <g id="highlight"> <path d="m1,5 a2,2 0,0,0 2,-3 a3,3 0 0 1 2,3.5" stroke="pink" fill="none" stroke-width="0.025" /> <circle cx="1" cy="5" r="0.05" fill="pink" /> <circle cx="3" cy="2" r="0.05" fill="pink" /> <circle cx="5" cy="5.5" r="0.05" fill="pink" /> </g> <use x
link:href="#highlight" x="6" /> <use x
link:href="#highlight" x="12" /> <use x
link:href="#highlight" x="2" y="6" /> <use x
link:href="#highlight" x="8" y="6" /> </svg> usage context value arcs | bevel |miter | miter-clip | round default value miter animatable yes arcs note: the arcs value as been introduced in svg2 and it isn't widely supported yet...
transform - SVG: Scalable Vector Graphics
html,body,svg { height:100% } <svg viewbox="-40 0 150 100" xmlns="http://www.w3.org/2000/svg" xmlns:x
link="http://www.w3.org/1999/x
link"> <g fill="grey" transform="rotate(-10 50 100) translate(-36 45.5) skewx(40) scale(1 0.5)"> <path id="heart" d="m 10,30 a 20,20 0,0,1 50,30 a 20,20 0,0,1 90,30 q 90,60 50,90 q 10,60 10,30 z" /> </g> <use x
link:href="#heart" fill="none" stroke="red"/> </svg> note: as of svg2, transform is a presentation attribute, meaning it can be used as a css property.
xChannelSelector - SVG: Scalable Vector Graphics
only one element is using this attribute: <fedisplacementmap> html, body, svg { height: 100%; } <svg viewbox="0 0 440 160" xmlns="http://www.w3.org/2000/svg"> <filter id="displacementfilter"> <feimage x
link:href="https://mdn.mozillademos.org/files/12668/mdn.svg" x="0" y="0" width="100%" height="100%" result="abc"/> <fedisplacementmap in2="abc" in="sourcegraphic" scale="30" xchannelselector="r"/> </filter> <filter id="displacementfilter2"> <feimage x
link:href="https://mdn.mozillademos.org/files/12668/mdn.svg" x="0" y="0" width="100%" height="100%" result="abc"/> <fedisplacementmap in2="abc" in="sourcegraphic" s...
yChannelSelector - SVG: Scalable Vector Graphics
only one element is using this attribute: <fedisplacementmap> html, body, svg { height: 100%; } <svg viewbox="0 0 440 160" xmlns="http://www.w3.org/2000/svg"> <filter id="displacementfilter"> <feimage x
link:href="https://mdn.mozillademos.org/files/12668/mdn.svg" x="0" y="0" width="100%" height="100%" result="abc"/> <fedisplacementmap in2="abc" in="sourcegraphic" scale="30" ychannelselector="r"/> </filter> <filter id="displacementfilter2"> <feimage x
link:href="https://mdn.mozillademos.org/files/12668/mdn.svg" x="0" y="0" width="100%" height="100%" result="abc"/> <fedisplacementmap in2="abc" in="sourcegraphic" s...
Content type - SVG: Scalable Vector Graphics
for example, the following iri can be used to specify the element whose id is "lamppost" within file somedrawing.svg: http://example.com/somedrawing.svg#lamppost iris are used in the x
link:href attribute.