Search completed in 1.86 seconds.
NSS 3.28.3 release notes
introduction network security services (nss) 3.2
8.3 is a patch release for nss 3.2
8.
... the bug fixes in nss 3.2
8.3 are described in the "bugs fixed" section below.
... distribution information the hg tag is nss_3_2
8_3_rtm.
...And 7 more matches
NSS 3.28.5 release notes
introduction network security services (nss) 3.2
8.5 is a patch release for nss 3.2
8.
... the bug fixes in nss 3.2
8.5 are described in the "bugs fixed" section below.
... distribution information the hg tag is nss_3_2
8_5_rtm.
...And 7 more matches
XULRunner 1.8.0.4 Release Notes - Archive of obsolete content
xulrunner 1.
8.0.4 is a stable developer preview of the mozilla xulrunner application framework.
... it replaces version 1.
8.0.1; all users should upgrade.
... as of december 200
8,xulrunner 1.9.0.4 is available in the "gecko 1.9.0" branch upon which firefox 3 is based.
...And 6 more matches
NSS 3.48.1 release notes
introduction network security services (nss) 3.4
8.1 is a patch release for nss 3.4
8.
... the bug fixes in nss 3.4
8.1 are described in the "bugs fixed" section below.
... distribution information the hg tag is nss_3_4
8_1_rtm.
...And 6 more matches
JS_CompileUTF8FileHandle
syntax jsobject * js_compileutf
8filehandle(jscontext *cx, jsobject *obj, const char *filename, file *file); jsobject * js_compileutf
8filehandleforprincipals( jscontext *cx, jsobject *obj, const char *filename, file *file, jsprincipals *principals); name type description cx jscontext * the context in which to compile the script.
... principals jsprincipals * (only in js_compileutf
8filehandleforprincipals) the security principals to associate with the new script, or null.
... description js_compileutf
8filehandle reads a script from a stdio file handle and compiles the script for execution by the javascript engine.
...And 6 more matches
XULRunner 1.8.0.1 Release Notes - Archive of obsolete content
xulrunner 1.
8.0.1 is the first stable developer preview release of xulrunner.
... xulrunner 1.
8.0.4 is now available as a security/stability update; all users should install this new version.
...the following directory is recommended: c:\program files\mozilla xulrunner\1.
8.0.1 .
...And 5 more matches
NSS 3.28.4 release notes
introduction network security services (nss) 3.2
8.4 is a security patch release for nss 3.2
8.
... the bug fixes in nss 3.2
8.4 are described in the "bugs fixed" section below.
... distribution information the hg tag is nss_3_2
8_4_rtm.
...And 5 more matches
NSS 3.36.8 release notes
introduction network security services (nss) 3.36.
8 is a patch release for nss 3.36.
... the bug fixes in nss 3.36.
8 are described in the "bugs fixed" section below.
... distribution information the hg tag is nss_3_36_
8_rtm.
...And 5 more matches
JS_CStringsAreUTF8
api users should switch to functions which take utf-
8 explicitly or handle their own string encoding and decoding.
... option to have the jsapi treat char strings as utf-
8.
... syntax jsbool js_cstringsareutf
8(void); void js_setcstringsareutf
8(void); // added in spidermonkey 1.
8 description by default, all c/c++ strings passed into the jsapi are treated as iso/iec
8859-1, also known as iso-latin-1.
...And 5 more matches
New in JavaScript 1.8 - Archive of obsolete content
the following is a changelog for javascript 1.
8.
...see bug 3
80236 for a tracking development bug for javascript 1.
8.
... using javascript 1.
8 in order to use some of the new features of javascript 1.
8 in html, use: <script type="application/javascript;version=1.
8"> ...
...And 4 more matches
ISO8601DateUtils.jsm
the iso
8601dateutils.jsm javascript code module provides methods that make it easy to convert javascript date objects into iso
8601 format date strings and back.
... to use this, you first need to import the code module into your javascript scope: components.utils.import("resource://gre/modules/iso
8601dateutils.jsm"); once you've imported the module, you can then use the iso
8601dateutils object it exports.
... using the iso
8601 date utilities to convert a date string into a date object, simply use: dateobj = iso
8601dateutils.parse(datestring); to convert a date object into a date string: datestring = iso
8601dateutils.create(dateobj); method overview string create(adate); date parse(adatestring); methods create creates an iso
8601 format date string, e.g.
...And 4 more matches
NSS 3.28.2 release notes
introduction network security services (nss) 3.2
8.2 is a patch release for nss 3.2
8.
... distribution information the hg tag is nss_3_2
8_2_rtm.
... nss 3.2
8.2 requires nspr 4.13.1 or newer.
...And 4 more matches
NSS 3.38 release notes
introduction the nss team has released network security services (nss) 3.3
8, which is a minor release.
... distribution information the hg tag is nss_3_3
8_rtm.
... nss 3.3
8 requires nspr 4.19 or newer.
...And 4 more matches
Mozilla's Section 508 Compliance
the united states federal rehabilitation act's section 50
8 is a new standard for defining accessibility requirements for software and other electronic and information technology.
... part of section 50
8 (§1194.21) specifically relates to mozilla, and the ability of us government agencies to buy software that contains mozilla software components.
... here is a detailed list of section 50
8 bugs in mozilla's seamonkey application suite.
...And 3 more matches
Rebranding SpiderMonkey (1.8.5)
for example the default brand for spidermonkey 1.
8.5 is 'mozjs1
85'.
...in the unix world we would issue the following command: find ./ -type f -exec sed -i "s/mozjs1
85/$brand/" {} \; windows users: notepad++ can be used to perform the recursive find and replace text operation.
...find ./ -type f -exec sed -i "s/$brand.pc/mozjs1
85.pc/" {} \; the last recursive search and replace, changes the file name of the static library: find ./ -type f -exec sed -i "s/js_static/$brand_static/" {} \; allright, almost there.
...And 3 more matches
about:debugging (before Firefox 68) - Firefox Developer Tools
before firefox 4
8 if you change files that are loaded on demand, like content scripts or popups, then changes you make are picked up automatically, and you'll see them the next time the content script is loaded or the popup is shown.
... note that before firefox 4
8, loading the add-on again by pressing "load temporary add-on" without restarting firefox does not work.
... firefox 4
8 onwards from firefox 4
8 onwards: as before: if you change files that are loaded on demand, like content scripts or popups, then changes you make are picked up automatically, and you'll see them the next time the content script is loaded or the popup is shown.
...And 3 more matches
JS::DeflateStringToUTF8Buffer
this article covers features introduced in spidermonkey 3
8 encode the given string as utf
8 into given buffer.
... syntax // new in jsapi 52 void deflatestringtoutf
8buffer(jsflatstring* src, mozilla::rangedptr<char> dst, size_t* dstlenp = nullptr, size_t* numcharsp = nullptr); // obsolete in spidermonkey 49 void deflatestringtoutf
8buffer(jsflatstring* src, mozilla::rangedptr<char> dst); name type description src jsflatstring * the pointer to the string to deflate.
... description js::deflatestringtoutf
8buffer encodes src as utf
8.
...And 2 more matches
JS_CompileUTF8File
syntax jsobject * js_compileutf
8file(jscontext *cx, jsobject *obj, const char *filename); name type description cx jscontext * the context in which to compile the script.
... description js_compileutf
8file compiles the text of script in an external file location for execution by the js engine.
... on success, js_compileutf
8file returns an object that represents the newly compiled script.
...And 2 more matches
Warning: 08/09 is not a legal ECMA-262 octal constant - JavaScript
the javascript warning "0
8 (or 09) is not a legal ecma-262 octal constant" occurs when 0
8 or 09 number literals are used.
... message warning: syntaxerror: 0
8 is not a legal ecma-262 octal constant.
... decimal literals can start with a zero (0) followed by another decimal digit, but if all digits after the leading 0 are smaller than
8, the number is interpreted as an octal number.
...And 2 more matches
UTF-8 - MDN Web Docs Glossary: Definitions of Web-related terms
utf-
8 (ucs transformation format
8) is the world wide web's most common character encoding.
...utf-
8 is backward-compatible with ascii and can represent any standard unicode character.
... the first 12
8 utf-
8 characters precisely match the first 12
8 ascii characters (numbered 0-127), meaning that existing ascii text is already valid utf-
8.
... learn more general knowledge utf-
8 on wikipedia faq about utf-
8 on unicode website ...
JS::GetDeflatedUTF8StringLength
this article covers features introduced in spidermonkey 3
8 returns the length of the char buffer required to encode given string as utf
8.
... syntax size_t getdeflatedutf
8stringlength(jsflatstring* s); name type description s jsflatstring * the pointer to the string to calculate the length.
... description js::getdeflatedutf
8stringlength returns the length of the char buffer required to encode s as utf
8.
... see also js::deflatestringtoutf
8buffer bug 1034627 ...
DataView.prototype.getInt8() - JavaScript
the getint
8() method gets a signed
8-bit integer (byte) at the specified byte offset from the start of the dataview.
... syntax dataview.getint
8(byteoffset) parameters byteoffset the offset, in byte, from the start of the view where to read the data.
... return value a signed
8-bit integer number.
... examples using the getint
8 method var buffer = new arraybuffer(
8); var dataview = new dataview(buffer); dataview.getint
8(1); // 0 specifications specification ecmascript (ecma-262)the definition of 'dataview.prototype.getint
8' in that specification.
DataView.prototype.getUint8() - JavaScript
the getuint
8() method gets an unsigned
8-bit integer (unsigned byte) at the specified byte offset from the start of the dataview.
... syntax dataview.getuint
8(byteoffset) parameters byteoffset the offset, in byte, from the start of the view where to read the data.
... return value an unsigned
8-bit integer number.
... examples using the getuint
8 method var buffer = new arraybuffer(
8); var dataview = new dataview(buffer); dataview.getuint
8(1); // 0 specifications specification ecmascript (ecma-262)the definition of 'dataview.prototype.getuint
8' in that specification.
Int8Array() constructor - JavaScript
the int
8array() constructor creates a typed array of twos-complement
8-bit signed integers.
... syntax new int
8array(); // new in es2017 new int
8array(length); new int
8array(typedarray); new int
8array(object); new int
8array(buffer [, byteoffset [, length]]); parameters length when called with a length argument, an internal array buffer is created in memory, of size length multiplied by bytes_per_element bytes, containing zeros.
... examples different ways to create an int
8array // from a length var int
8 = new int
8array(2); int
8[0] = 42; console.log(int
8[0]); // 42 console.log(int
8.length); // 2 console.log(int
8.bytes_per_element); // 1 // from an array var arr = new int
8array([21,31]); console.log(arr[1]); // 31 // from another typedarray var x = new int
8array([21, 31]); var y = new int
8array(x); console.log(y[0]); // 21 // from an arraybuffer var buffer = new ...
...arraybuffer(
8); var z = new int
8array(buffer, 1, 4); // from an iterable var iterable = function*(){ yield* [1,2,3]; }(); var int
8 = new int
8array(iterable); // int
8array[1, 2, 3] specifications specification ecmascript (ecma-262)the definition of 'typedarray constructors' in that specification.
Uint8Array() constructor - JavaScript
the uint
8array() constructor creates a typed array of
8-bit unsigned integers.
... syntax new uint
8array(); // new in es2017 new uint
8array(length); new uint
8array(typedarray); new uint
8array(object); new uint
8array(buffer [, byteoffset [, length]]); parameters length when called with a length argument, an internal array buffer is created in memory, of size length multiplied by bytes_per_element bytes, containing zeros.
... examples different ways to create a uint
8array // from a length var uint
8 = new uint
8array(2); uint
8[0] = 42; console.log(uint
8[0]); // 42 console.log(uint
8.length); // 2 console.log(uint
8.bytes_per_element); // 1 // from an array var arr = new uint
8array([21,31]); console.log(arr[1]); // 31 // from another typedarray var x = new uint
8array([21, 31]); var y = new uint
8array(x); console.log(y[0]); // 21 // from an arraybuffer var buff...
...er = new arraybuffer(
8); var z = new uint
8array(buffer, 1, 4); // from an iterable var iterable = function*(){ yield* [1,2,3]; }(); var uint
8 = new uint
8array(iterable); // uint
8array[1, 2, 3] specifications specification ecmascript (ecma-262)the definition of 'typedarray constructors' in that specification.
Uint8ClampedArray() constructor - JavaScript
the uint
8clampedarray() constructor creates a typed array of
8-bit unsigned integers clamped to 0-255; if you specified a value that is out of the range of [0,255], 0 or 255 will be set instead; if you specify a non-integer, the nearest integer will be set.
... syntax new uint
8clampedarray(); // new in es2017 new uint
8clampedarray(length); new uint
8clampedarray(typedarray); new uint
8clampedarray(object); new uint
8clampedarray(buffer [, byteoffset [, length]]); parameters length when called with a length argument, an internal array buffer is created in memory, of size length multiplied by bytes_per_element bytes, containing zeros.
... examples different ways to create a uint
8clampedarray // from a length var uintc
8 = new uint
8clampedarray(2); uintc
8[0] = 42; uintc
8[1] = 1337; console.log(uintc
8[0]); // 42 console.log(uintc
8[1]); // 255 (clamped) console.log(uintc
8.length); // 2 console.log(uintc
8.bytes_per_element); // 1 // from an array var arr = new uint
8clampedarray([21,31]); console.log(arr[1]); // 31 // from another typedarray var x = new uint
8clampedarray([21...
..., 31]); var y = new uint
8clampedarray(x); console.log(y[0]); // 21 // from an arraybuffer var buffer = new arraybuffer(
8); var z = new uint
8clampedarray(buffer, 1, 4); // from an iterable var iterable = function*(){ yield* [1,2,3]; }(); var uintc
8 = new uint
8clampedarray(iterable); // uint
8clampedarray[1, 2, 3] specifications specification ecmascript (ecma-262)the definition of 'typedarray constructors' in that specification.
NPN_UTF8FromIdentifier - Archive of obsolete content
« gecko plugin api reference « scripting plugins summary returns the utf-
8 string corresponding to the given string identifier.
... syntax #include <npruntime.h> nputf
8 *npn_utf
8fromidentifier(npidentifier identifier); parameters the function has the following parameter: <tt>identifier</tt> the string identifier whose corresponding string should be returned.
... returns a utf-
8 string as a sequence of nputf
8 bytes, or null if the specified <tt>identifier</tt> isn't a string identifier.
NPUTF8 - Archive of obsolete content
« gecko plugin api reference « scripting plugins summary nputf
8 is a byte representing an
8-bit unit of a utf-
8 character.
... this is not the same thing as an entire utf-
8 character, which may be comprised of multiple nputf
8 bytes.
... syntax typedef char nputf
8; description the nputf
8 type is used in constructing utf-
8 strings for use by the plugin scripting api extension.
New in JavaScript 1.8.1 - Archive of obsolete content
the following is a changelog for javascript 1.
8.1.
... javascript 1.
8.1 is a modest update syntactically to javascript; the main change in this release is the addition of the tracemonkey just-in-time compiler, which improves performance.
... new features in javascript 1.
8.1 object.getprototypeof() support for native json string.prototype.trim() string.prototype.trimleft() string.prototype.trimright() changed functionality in javascript 1.
8.1 implicit setting of properties in object and array initializers no longer execute setters in javascript.
308 Permanent Redirect - HTTP
the hypertext transfer protocol (http) 30
8 permanent redirect redirect status response code indicates that the resource requested has been definitively moved to the url given by the location headers.
... note: some web applications may use the 30
8 permanent redirect in a non-standard way and for other purposes.
... for example, google drive uses a 30
8 resume incomplete response to indicate to the client when an incomplete upload stalled.[1] status 30
8 permanent redirect specifications specification title rfc 753
8, section 3: 30
8 permanent redirect the hypertext transfer protocol status code 30
8 (permanent redirect) ...
408 Request Timeout - HTTP
the hypertext transfer protocol (http) 40
8 request timeout response status code means that the server would like to shut down this unused connection.
... a server should send the "close" connection header field in the response, since 40
8 implies that the server has decided to close the connection rather than continue waiting.
... status 40
8 request timeout specifications specification title rfc 7231, section 6.5.7: 40
8 request timeout hypertext transfer protocol (http/1.1): semantics and content ...
418 I'm a teapot - HTTP
the http 41
8 i'm a teapot client error response code indicates that the server refuses to brew coffee because it is, permanently, a teapot.
...this error is a reference to hyper text coffee pot control protocol defined in april fools' jokes in 199
8 and 2014.
... status 41
8 i'm a teapot specifications specification title rfc 2324, section 2.3.2: 41
8 i'm a teapot hyper text coffee pot control protocol (htcpcp/1.0): semantics and content rfc 716
8, section 2.3.3: 41
8 i'm a teapot the hyper text coffee pot control protocol for tea efflux appliances (htcpcp-tea): response codes ...
DataView.prototype.setInt8() - JavaScript
the setint
8() method stores a signed
8-bit integer (byte) value at the specified byte offset from the start of the dataview.
... syntax dataview.setint
8(byteoffset, value) parameters byteoffset the offset, in byte, from the start of the view where to store the data.
... examples using the setint
8 method var buffer = new arraybuffer(
8); var dataview = new dataview(buffer); dataview.setint
8(1, 3); dataview.getint
8(1); // 3 specifications specification ecmascript (ecma-262)the definition of 'dataview.prototype.setint
8' in that specification.
DataView.prototype.setUint8() - JavaScript
the setuint
8() method stores an unsigned
8-bit integer (byte) value at the specified byte offset from the start of the dataview.
... syntax dataview.setuint
8(byteoffset, value) parameters byteoffset the offset, in byte, from the start of the view where to store the data.
... examples using the setuint
8 method var buffer = new arraybuffer(
8); var dataview = new dataview(buffer); dataview.setuint
8(1, 3); dataview.getuint
8(1); // 3 specifications specification ecmascript (ecma-262)the definition of 'dataview.prototype.setuint
8' in that specification.
2006-12-08 - Archive of obsolete content
summary: mozilla.dev.tech.xpcom - dec 02- dec 0
8, 2006 announcements none during this week.
...however, the c++ call that's supposed to be invoking the method on the javascript object is returning with 0x
80004005 (ns_error_failure).
I18N - MDN Web Docs Glossary: Definitions of Web-related terms
i1
8n (from "internationalization", a 20-letter word) is the best practice that enables products or services to be readily adapted to any target culture.
...(the w3c definition) among other things, i1
8n requires support for multiple character sets (usually via unicode) units of measure (currency, °c/°f, km/miles, etc.) time and date formats keyboard layouts text directions learn more general knowledge i1
8n on wikipedia technical reference i1
8n on w3c i1
8n on gala-global.org learn about it i1
8n material on i1
8nguy.com ...
PRInt8
guaranteed to be a signed
8-bit integer on all platforms.
... syntax #include <prtypes.h> typedef definition print
8; ...
PRUint8
guaranteed to be an unsigned
8-bit integer on all platforms.
... syntax #include <prtypes.h> typedefdefinition pruint
8; ...
NS_ConvertUTF16toUTF8
class declaration a helper class that converts a utf-16 string to utf-
8 method overview constructors operator= get find rfind rfindchar findcharinset rfindcharinset compare equalsignorecase tofloat tointeger mid left right setcharat stripchars stripwhitespace replacechar replacesubstring trim compresswhitespace assignwithconversion appendwithconversion appendint appendfloat beginreading endreading beginwriting endwriting data length isempty isvoid isterminated charat operator[] first last countchar findchar equals equalsascii equalsliteral(const char equalsliteral(char lowercaseequalsascii lowerc...
... methods constructors void ns_convertutf16toutf
8(const prunichar*) - source a helper class that converts a utf-16 string to utf-
8 parameters prunichar* astring void ns_convertutf16toutf
8(const prunichar*, pruint32) - source parameters prunichar* astring pruint32 alength void ns_convertutf16toutf
8(const nsastring_internal&) - source parameters nsastring_internal& astring operator= nscautostring& operator=(const nscautostrin...
nsISupportsPRUint8
xpcom/ds/nsisupportsprimitives.idlscriptable this interface provides scriptable access for
8-bit unsigned integers.
... inherits from: nsisupportsprimitive last changed in gecko 1.2 method overview string tostring(); attributes attribute type description data pruint
8 provides access to the native type represented by the object.
nsIUTF8StringEnumerator
inherits from: nsisupports last changed in gecko 1.7 method overview autf
8string getnext(); boolean hasmore(); methods getnext() returns the next string in the enumerator.
...autf
8string getnext(); parameters none.
428 Precondition Required - HTTP
the http 42
8 precondition required response status code indicates that the server requires the request to be conditional.
... status 42
8 precondition required specifications specification title rfc 65
85, section 3: 42
8 precondition required additional http status codes ...
508 Loop Detected - HTTP
the hypertext transfer protocol (http) 50
8 loop detected response status code may be given in the context of the web distributed authoring and versioning (webdav) protocol.
... status 50
8 loop detected specifications specification title rfc 5
842, section 7.2: 50
8 loop detected web distributed authoring and versioning ...
2006-12-08 - Archive of obsolete content
summary: mozilla.dev.l10n - december
8, 2006 announcements mozilla sponsored server for l10n the server for mozilla sponsored server for l10n should be up and running soon.
2006-18-24 - Archive of obsolete content
summary: mozilla.dev.platform - november 1
8th - november 24th, 2006 announcements no announcements this week traffic xulrunner: <browser> not allowing javascript popup windows b notes that when using xul elements <browser/> and <tabbrowser/> the javascript popup windows don't work out of the box and asks what needs to be implement.
Key Values - Web APIs
vk_menu (0x12) vk_lmenu (0xa4) vk_rmenu (0xa5) kvk_option (0x3a) kvk_rightoption (0x3d) gdk_key_alt_l (0xffe9) gdk_key_alt_r (0xffea) qt::key_alt (0x01000023) keycode_alt_left (57) keycode_alt_right (5
8) "altgraph" [5] the altgr or altgraph (alternate graphics) key.
... vk_lwin (0x5b) vk_rwin (0x5c) kvk_command (0x37) kvk_rightcommand (0x36) gdk_key_meta_l (0xffe7) gdk_key_meta_r (0xffe
8) qt::key_meta (0x01000022) keycode_meta_left (117) keycode_meta_right (11
8) "numlock" the numlock (number lock) key.
... vk_shift (0x10) vk_lshift (0xa0) vk_rshift (0xa1) kvk_shift (0x3
8) kvk_rightshift (0x3c) gdk_key_shift_l (0xffe1) gdk_key_shift_r (0xffe2) qt::key_shift (0x01000020) keycode_shift_left (59) keycode_shift_right (60) "super" [4] the super key.
...And 125 more matches
WebGL constants - Web APIs
src_alpha_saturate 0x030
8 passed to blendfunc or blendfuncseparate to multiply a component by the minimum of source's alpha or one minus the destination's alpha.
... constant_color 0x
8001 passed to blendfunc or blendfuncseparate to specify a constant color blend function.
... one_minus_constant_color 0x
8002 passed to blendfunc or blendfuncseparate to specify one minus a constant color blend function.
...And 113 more matches
Index - MDN Web Docs Glossary: Definitions of Web-related terms
found 52
8 pages: # page tags and summary 1 mdn web docs glossary: definitions of web-related terms beginner, definitions, dictionary, glossary, index, landing, terminology web technologies contain long lists of jargon and abbreviations that are used in documentation and coding.
...
8 ascii glossary, infrastructure ascii (american standard code for information interchange) is one of the most popular coding method used by computers for converting letters, numbers, punctuation and control codes into digital form.
... since 2007, utf-
8 superseded it on the web.
...And 109 more matches
StringView - Archive of obsolete content
|*| http://www.gnu.org/licenses/lgpl-3.0.html |*| \*/ function stringview (vinput, sencoding /* optional (default: utf-
8) */, noffset /* optional */, nlength /* optional */) { var ftaview, awhole, araw, fputoutptcode, fgetoutptchrsize, ninptlen, nstartidx = isfinite(noffset) ?
... noffset : 0, ntranscrtype = 15; if (sencoding) { this.encoding = sencoding.tostring(); } encswitch: switch (this.encoding) { case "utf-
8": fputoutptcode = stringview.pututf
8charcode; fgetoutptchrsize = stringview.getutf
8charlength; ftaview = uint
8array; break encswitch; case "utf-16": fputoutptcode = stringview.pututf16charcode; fgetoutptchrsize = stringview.getutf16charlength; ftaview = uint16array; break encswitch; case "utf-32": ftaview = uint32array; ntranscrtype &= 14; break encswitch; default: /* case "ascii", or case "binarystring" or unknown cases */ ftaview = uint
8array; ntranscrtype &= 14; } typeswitch: switch (typeof vinput) { case "string": /* the input argum...
...ninptlen - nstartidx : nlength); break typeswitch; case uint32array: case uint16array: case uint
8array: /* the input argument is a typedarray: the buffer, and possibly the array itself, will be shared.
...And 77 more matches
Error codes returned by Mozilla APIs
ns_error_not_implemented (0x
80004001) this error is caused by methods which are not implemented.
... ns_error_no_interface (0x
80004002) an attempt was made to call queryinterface to retrieve an interface which an object does not support.
... ns_error_null_pointer (0x
80004003) an error occurred because a value was set to null when this was not expected.
...And 73 more matches
SVG documentation index - SVG: Scalable Vector Graphics
found 3
83 pages: # page tags and summary 1 svg: scalable vector graphics 2d graphics, graphics, icons, images, reference, responsive design, svg, scalable graphics, scalable images, vector graphics, web, l10n:priority scalable vector graphics (svg) are an xml-based markup language for describing two-dimensional based vector graphics.xml 2 applying svg effects to html content css, guide, html, svg modern browsers support using svg within css styles to apply graphical effects to html content.
...
8 other resources reference, svg here is a list of additional resources on svg: 9 project svg no summary!
... 1
8 svg styling attributes attribute, beginner, needsexample, reference, svg the svg styling attributes are all the attributes that can be specified on any svg element to apply css styling effects.
...And 67 more matches
Mozilla internal string guide
introduction the string classes are a library of c++ classes which are used to manage buffers of wide (16-bit) and narrow (
8-bit) character strings.
... the
8-bit and 16-bit string classes have completely separate base classes, but share the same apis.
... as a result, you cannot assign a
8-bit string to a 16-bit string without some kind of conversion helper class or routine.
...And 54 more matches
JSAPI reference
firefox 4 is the last release that has a corresponding spidermonkey release with the old scheme, where the jsapi has the version 1.
8.5.
...ete since jsapi 30 js_clearoperationcallback obsolete since javascript 1.9.1 js_getoperationlimit obsolete since javascript 1.9.1 js_setoperationlimit obsolete since javascript 1.9.1 js_max_operation_limit obsolete since javascript 1.9.1 js_operation_weight_base obsolete since javascript 1.9.1 js_setthreadstacklimit obsolete since jsapi 13 js_setscriptstackquota obsolete since javascript 1.
8.6 js_setoptions obsolete since jsapi 27 js_getoptions obsolete since jsapi 27 js_toggleoptions obsolete since jsapi 27 enum jsversion jsversion_ecma_3 jsversion_1_6 jsversion_1_7 jsversion_1_
8 jsversion_ecma_5 jsversion_default jsversion_unknown jsversion_latest js_getimplementationversion js_getversion js_setversionforcompartment added in spidermonke...
..._getglobalforscopechain obsolete since jsapi 25 js_getglobalobject obsolete since jsapi 24 js_setglobalobject obsolete since jsapi 25 js_initclass js_initstandardclasses js_resolvestandardclass js_enumeratestandardclasses js_enumerateresolvedstandardclasses obsolete since jsapi 24 js_isrunning js_saveframechain js_restoreframechain js_isassigning obsolete since javascript 1.
8.5 js_isconstructing obsolete since jsapi 26 js_isconstructing_possiblywithgiventhisobject obsolete since jsapi 17 js_getscopechain obsolete since javascript 1.
8.7 compartments: class jsautocompartment added in spidermonkey 24 js_newglobalobject added in spidermonkey 17 js_entercompartment added in spidermonkey 24 js_leavecompartment added in spidermonkey 24 js_getcompartmentprivate ...
...And 52 more matches
Image file type and format guide - Web media technologies
for example, an rgb color depth of
8 indicates that each of the red, green, and blue components are represented by an
8-bit value.
...conceptually similar to the animated gif format which has been in use for decades, apng is more capable in that it supports a variety of color depths, whereas animated gif supports only
8-bit indexed color.
... mime type image/apng file extension(s) .apng specification wiki.mozilla.org/apng_specification browser compatibility chrome 59, edge 12, firefox 3, opera 46, safari
8 maximum dimensions 2,147,4
83,647×2,147,4
83,647 pixels supported color modes color mode bits per component (d) description greyscale 1, 2, 4,
8, and 16 each pixel consists of a single d-bit value indicating the brightness of the greyscale pixel.
...And 49 more matches
HTTP Index - HTTP
8 identifying resources on the web domain, http, path, scheme, syntax, uri, url, url syntax, web, fragment, port, query, resources the target of an http request is called a "resource", whose nature isn't defined further; it can be a document, a photo, or anything else.
... 1
8 list of default accept values accept, content negotiation, http, reference this article documents the default values for the http accept header for specific inputs and browser versions.
... 2
8 reason: cors request external redirect not allowed cors, corsoriginheadernotadded, cross-origin, error, http, https, messages, reasons, security, console, troubleshooting the cors request was responded to by the server with an http redirect to a url on a different origin than the original request, which is not permitted during cors requests.
...And 48 more matches
Index - Learn web development
found 34
8 pages: # page tags and summary 1 learn web development beginner, css, html, index, intro, landing, learn, web welcome to the mdn learning area.
...
8 mobile accessibility accessibility, article, beginner, codingscripting, learn, mobile, responsive, screenreader, touch in this article, we have provided you with some details about common mobile accessibility-specific issues and how to overcome them.
... 1
8 how do you host your website on google app engine?
...And 47 more matches
Web video codec guide - Web media technologies
imagine the amount of data needed to store uncompressed video: a single frame of high definition (1920x10
80) video in full color (4 bytes per pixel) is
8,294,400 bytes.
... at a typical 30 frames per second, each second of hd video would occupy 24
8,
832,000 bytes (~249 mb).
...p4, webm avc (h.264) advanced video coding 3gp, mp4, webm h.263 h.263 video 3gp hevc (h.265) high efficiency video coding mp4 mp4v-es mpeg-4 video elemental stream 3gp, mp4 mpeg-1 mpeg-1 part 2 visual mpeg, quicktime mpeg-2 mpeg-2 part 2 visual mp4, mpeg, quicktime theora theora ogg vp
8 video processor
8 3gp, ogg, webm vp9 video processor 9 mp4, ogg, webm factors affecting the encoded video as is the case with any encoder, there are two basic groups of factors affecting the size and quality of the encoded video: specifics about the source video's format and contents, and the characteristics and configuration of the codec used while encoding the video...
...And 45 more matches
HTML documentation index - HTML: Hypertext Markup Language
6 date and time formats used in html date, element, format, html, iso
8601, input, reference, string, time, week, datetime, datetime-local, del, ins, month, month-year, week-year certain html elements use date and/or time values.
...
8 accesskey global attributes, html, reference, accesskey the accesskey global attribute provides a hint for generating a keyboard shortcut for the current element.
... 1
8 id global attributes, html, reference, web, id the id global attribute defines an identifier (id) which must be unique in the whole document.
...And 42 more matches
nsIAnnotationService
method overview void setpageannotation(in nsiuri auri, in autf
8string aname, in nsivariant avalue, in long aflags, in unsigned short aexpiration); void setitemannotation(in long long aitemid, in autf
8string aname, in nsivariant avalue, in long aflags, in unsigned short aexpiration); void setpageannotationstring(in nsiuri auri, in autf
8string aname, in astring avalue, in long aflags, in unsigned short aexpiration); boolean setitemann...
...otationstring(in long long aitemid, in autf
8string aname, in astring avalue, in long aflags, in unsigned short aexpiration); void setpageannotationint32(in nsiuri auri, in autf
8string aname, in long avalue, in long aflags, in unsigned short aexpiration); void setitemannotationint32(in long long aitemid, in autf
8string aname, in long avalue, in long aflags, in unsigned short aexpiration); void setpageannotationint64(in nsiuri auri, in autf
8string aname, in long long avalue, in long aflags, in unsigned short aexpiration); void setitemannotationint64(in long long aitemid, in autf
8string aname, in long long avalue, in long aflags, in unsigned short aexpiration); void setpageannotationdouble(in nsiuri auri, in autf
8string aname, in double avalue, in l...
...ong aflags, in unsigned short aexpiration); void setitemannotationdouble(in long long aitemid, in autf
8string aname, in double avalue, in long aflags, in unsigned short aexpiration); void setpageannotationbinary(in nsiuri auri, in autf
8string aname,[const, array, size_is(adatalen)] in octet adata, in unsigned long adatalen, in autf
8string amimetype, in long aflags, in unsigned short aexpiration); void setitemannotationbinary(in long long aitemid, in autf
8string aname,[const, array, size_is(adatalen)] in octet adata, in unsigned long adatalen, in autf
8string amimetype, in long aflags, in unsigned short aexpiration); nsivariant getpageannotation(in nsiuri auri, in autf
8string aname); nsivariant getitemannotation(in long long aitemid, in autf
8string...
...And 40 more matches
MCD, Mission Control Desktop, AKA AutoConfig - Archive of obsolete content
g"); // var env_user = prompt("indiquez votre login", toto); // 2) lock general preferences //ldap address book lockpref("ldap_2.prefs_migrated", true); lockpref("ldap_2.servers.ldapint.auth.savepassword", true); lockpref("ldap_2.servers.ldapint.description", "ldap int"); lockpref("ldap_2.servers.ldapint.filename", "abook-1.mab"); lockpref("ldap_2.servers.ldapint.uri", "ldap://ldap1.int-evry.fr:3
89/ou=people,dc=int-evry,dc=fr??sub"); lockpref("ldap_2.servers.history.filename", "history.mab"); lockpref("ldap_2.servers.history.replication.lastchangenumber", 0); lockpref("ldap_2.servers.pab.filename", "abook.mab"); lockpref("ldap_2.servers.pab.replication.lastchangenumber", 0); //account lockpref("mail.account.account1.server", "server1"); lockpref("mail.account.account2.identities", "id1");...
... getldapattributes("ldap2.int-evry.fr","ou=people,dc=int-evry,dc=fr","uid=" + env_user,"uid,cn,mail,labeleduri"); // close the try, and call the catch() } catch(e) { displayerror("lockedpref", e); } thunderbird.cfg (version 2 with ad) using thunderbird 9.0.1 and try to use a active directory (windows server 200
8) as ldap-source did not work with version 1.
...please see //(german) http://interop.blog.de/2010/02/13/kapitel-1-ldap-anfragen-linux-ad-
8001564/ //or search the net how to do it.
...And 37 more matches
NSS tools : certutil
this is used to migrate legacy nss databases (cert
8.db and key3.db) into the newer sqlite databases (cert9.db and key4.db).
... certutil supports two types of databases: the legacy security databases (cert
8.db, key3.db, and secmod.db) and new sqlite databases (cert9.db, key4.db, and pkcs11.txt).
...the minimum is 512 bits and the maximum is 163
84 bits.
...And 32 more matches
KeyboardEvent: code values - Web APIs
devent.code value code firefox chrome 0x0000 "unidentified" "" 0x0001 "escape" "escape" 0x0002 "digit0" "digit0" 0x0003 "digit1" "digit1" 0x0004 "digit2" "digit2" 0x0005 "digit3" "digit3" 0x0006 "digit4" "digit4" 0x0007 "digit5" "digit5" 0x000
8 "digit6" "digit6" 0x0009 "digit7" "digit7" 0x000a "digit
8" "digit
8" 0x000b "digit9" "digit9" 0x000c "minus" "minus" 0x000d "equal" "equal" 0x000e "backspace" "backspace" 0x000f "tab" "tab" 0x0010 "keyq" "keyq" 0x0011 "keyw" "keyw" 0x0012 "keye" ...
... "keye" 0x0013 "keyr" "keyr" 0x0014 "keyt" "keyt" 0x0015 "keyy" "keyy" 0x0016 "keyu" "keyu" 0x0017 "keyi" "keyi" 0x001
8 "keyo" "keyo" 0x0019 "keyp" "keyp" 0x001a "bracketleft" "bracketleft" 0x001b "bracketright" "bracketright" 0x001c "enter" "enter" 0x001d "controlleft" "controlleft" 0x001e "keya" "keya" 0x001f "keys" "keys" 0x0020 "keyd" "keyd" 0x0021 "keyf" "keyf" 0x0022 "keyg" "keyg" 0x0023 "keyh" "keyh" 0x0024 "keyj" "keyj" 0x0025 "keyk" "keyk" 0x0026 "keyl" "keyl" 0x0027 "semico...
...lon" "semicolon" 0x002
8 "quote" "quote" 0x0029 "backquote" "backquote" 0x002a "shiftleft" "shiftleft" 0x002b "backslash" "backslash" 0x002c "keyz" "keyz" 0x002d "keyx" "keyx" 0x002e "keyc" "keyc" 0x002f "keyv" "keyv" 0x0030 "keyb" "keyb" 0x0031 "keyn" "keyn" 0x0032 "keym" "keym" 0x0033 "comma" "comma" 0x0034 "period" "period" 0x0035 "slash" "slash" 0x0036 "shiftright" "shiftright" 0x0037 "numpadmultiply" "numpadmultiply" 0x003
8 "altleft" "altleft" 0x0039 "space" "space" 0x003a "capslock" "capslock" ...
...And 31 more matches
NSS_3.12_release_notes.html
nss 3.12 release notes 17 june 200
8 newsgroup: mozilla.dev.tech.crypto contents introduction distribution information new in nss 3.12 bugs fixed documentation compatibility feedback introduction network security services (nss) 3.12 is a minor release with the following new features: sqlite-based shareable certificate and key databases libpkix: an rfc 32
80 compliant certificate path validation library camellia cipher support tls session ticket extension (rfc 5077) nss 3.12 is tri-licensed under the mpl 1.1/gpl 2.0/lgpl 2.1.
...g_on_fresh_info cert_rev_m_continue_testing_on_fresh_info cert_rev_mi_test_each_method_separately cert_rev_mi_test_all_local_information_first cert_rev_mi_no_overall_info_requirement cert_rev_mi_require_some_fresh_info_available cert_policy_flag_no_mapping cert_policy_flag_explicit cert_policy_flag_no_any cert_enable_ldap_fetch cert_enable_http_fetch new macro in utilrename.h: smime_aes_cbc_12
8 the nssckbi pkcs #11 module's version changed to 1.70.
...ternal new mechanism flags (see secmod.h) public_mech_aes_flag public_mech_sha256_flag public_mech_sha512_flag public_mech_camellia_flag new oids (see secoidt.h) new ec signature oids sec_oid_ansix962_ecdsa_signature_recommended_digest sec_oid_ansix962_ecdsa_signature_specified_digest sec_oid_ansix962_ecdsa_sha224_signature sec_oid_ansix962_ecdsa_sha256_signature sec_oid_ansix962_ecdsa_sha3
84_signature sec_oid_ansix962_ecdsa_sha512_signature more id-ce and id-pe oids from rfc 32
80 sec_oid_x509_hold_instruction_code sec_oid_x509_delta_crl_indicator sec_oid_x509_issuing_distribution_point sec_oid_x509_cert_issuer sec_oid_x509_freshest_crl sec_oid_x509_inhibit_any_policy sec_oid_x509_subject_info_access camellia oids (rfc3657) sec_oid_camellia_12
8_cbc sec_oid_camellia_192_cbc sec_oi...
...And 30 more matches
certutil
this is used to merge legacy nss databases (cert
8.db and key3.db) into the newer sqlite databases (cert9.db and key4.db).
...this is used to migrate legacy nss databases (cert
8.db and key3.db) into the newer sqlite databases (cert9.db and key4.db).
... certutil supports two types of databases: the legacy security databases (cert
8.db, key3.db, and secmod.db) and new sqlite databases (cert9.db, key4.db, and pkcs11.txt).
...And 29 more matches
The "codecs" parameter in common media types - Web media technologies
video/webm; codecs="vp
8, vorbis" a webm file containing vp
8 video and/or vorbis audio.
... av1 codec parameter string components component details p the one-digit profile number: av1 profile numbers profile number description 0 "main" profile; supports yuv 4:2:0 or monochrome bitstreams with bit depth of
8 or 10 bits per component.
...this value must be one of
8, 10, or 12; which values are valid varies depending on the profile and other properties.
...And 27 more matches
MathML Torture Test
"texgyreschola">tex gyre schola</option> <option value="texgyretermes">tex gyre termes</option> <option value="xits">xits</option> </select> <br/> </p> <table> <tr> <td></td> <th scope="col">as rendered by tex</th> <th scope="col">as rendered by your browser</th></tr> <tr> <td>1</td> <td><img src="https://udn.realityripple.com/samples/45/d5a0dbbca3.png" width="3
8" height="22" alt="texbook, 16.2-16.3" /></td> <td> <math display="block"> <mrow> <msup> <mi>x</mi> <mn>2</mn> </msup> <msup> <mi>y</mi> <mn>2</mn> </msup> </mrow> </math> </td></tr> <tr> <td>2</td> <td><img src="https://udn.realityripple.com/samples/b
8/d...
...mn>2</mn></msub> <msub><mi>f</mi><mn>3</mn></msub> </mrow> --> <mrow> <mmultiscripts> <mi>f</mi> <mn>3</mn><none/> <mprescripts/> <mn>2</mn><none/> </mmultiscripts> </mrow> </math> </td></tr> <tr> <td>3</td> <td><img src="https://udn.realityripple.com/samples/
8a/1d0e6e073c.png" width="5
8" height="47" alt="texbook, 17-17.1" /></td> <td> <math display="block"> <mrow> <mfrac> <mrow> <mi>x</mi> <mo>+</mo> <msup> <mi>y</mi> <mn>2</mn> </msup> </mrow> <mrow> <mi>k</mi> <mo>+</mo> ...
... <mo>+</mo> <msup> <mi>y</mi> <mfrac> <mn>2</mn> <mrow> <mi>k</mi> <mo>+</mo> <mn>1</mn> </mrow> </mfrac> </msup> </mrow> </math> </td></tr> <tr> <td>5</td> <td><img src="https://udn.realityripple.com/samples/d2/921226dd
85.png" width="30" height="42" alt="texbook, 17-17.1" /></td> <td> <math display="block"> <mrow> <mfrac> <mi>a</mi> <mrow> <mi>b</mi> <mo>/</mo> <mn>2</mn> </mrow> </mfrac> </mrow> </math> </td></tr> <tr> <td>6</td> <td><img src="https://udn.realityripple.com...
...And 26 more matches
Index - Firefox Developer Tools
found 15
8 pages: # page tags and summary 1 firefox developer tools developing mozilla, guide, tools, web development, web development:tools, l10n:priority firefox developer tools is a set of web developer tools built into firefox.
...
8 dom inspector internals code, tools, internals, organisation, source there are three main facets to dom inspector.
... 1
8 debugger when called as a constructor, the debugger object creates a new debugger instance.
...And 26 more matches
NSS Tools ssltap
the following are well-known port numbers: http
80 https 443 smtp 25 ftp 21 imap 143 imaps 993 (imap over ssl) nntp 119 nntps 563 (nntp over ssl) examples you can use the ssl debugging tool to intercept any connection information.
...the simplest way to use the debugging tool is to execute the following command from a command shell: ssltap www.netscape.com:
80 the program waits for an incoming connection on the default port 1924.
... command ssltap.exe -sx -p 444 interzone.mcom.com:443 > sx.txt output output connected to interzone.mcom.com:443--> [alloclen = 66 bytes [ssl2] clienthellov2 { version = {0x03, 0x00} cipher-specs-length = 39 (0x27) sid-length = 0 (0x00) challenge-length = 16 (0x10) cipher-suites = { (0x0100
80) ssl2/rsa/rc4-12
8/md5 (0x0200
80) ssl2/rsa/rc4-40/md5 (0x0300
80) ssl2/rsa/rc2cbc12
8/md5 (0x0400
80) ssl2/rsa/rc2cbc40/md5 (0x060040) ssl2/rsa/des64cbc/md5 (0x0700c0) ssl2/rsa/3des192ede-cbc/md5 (0x000004) ssl3/rsa/rc4-12
8/md5 (0x00ffe0) ssl3/rsa-fips/3des192ede-cbc/sha ...
...And 25 more matches
filter - CSS: Cascading Style Sheets
"/> </filter> <image xlink: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.2
86 "lucida grande", "lucida sans unicode", "dejavu sans", lucida, arial, helvetica, sans-serif; color: rgb(51, 51, 51); height:100%; overflow:hidden; } #img2 { width:100%; height:auto; -webkit-filter:blur(5px); -ms-filter:blur(5px); filter:blur(5px); } table.standard-table { border: 1px solid rgb(1
87, 1
87, 1
87); border-collapse: collapse; border-spacing: 0; margin: 0 0 1.2
86...
...em; height: 100%; width:
85%; } table.standard-table th { border: 1px solid rgb(1
87, 1
87, 1
87); padding: 0px 5px; background: none repeat scroll 0% 0% rgb(23
8, 23
8, 23
8); text-align: left; font-weight: bold; } table.standard-table td { padding: 5px; border: 1px solid rgb(204, 204, 204); text-align: left; vertical-align: top; width:25%; height:auto; } #img3 { height:100%; } <svg style="position: absolute; top: -99999px" xmlns="http://www.w3.org/2000/svg"> <filter id="svgblur" x="-5%" y="-5%" width="110%" height="110%"> <fegaussianblur in="sourcegraphic" stddeviation="5"/> </filter> </svg> brightness() the brightness() function applies a linear multiplier to the input image, making it appear more or less bright.
...<tr> <th style="text-align: left;" scope="col">original image</th> <th style="text-align: left;" scope="col">live example</th> <th style="text-align: left;" scope="col">svg equivalent</th> <th style="text-align: left;" scope="col">static example</th> </tr> </thead> <tbody> <tr> <td><img alt="test_form.jpg" id="img1" class="internal default" src="/files/370
8/test_form.jpg" style="width: 100%;" /></td> <td><img alt="test_form.jpg" id="img2" class="internal default" src="/files/370
8/test_form.jpg" style="width: 100%;" /></td> <td><div class="svg-container"><svg xmlns="http://www.w3.org/2000/svg" id="img3" viewbox="0 0 2
86 217" color-interpolation-filters="srgb"> <filter id="brightness"> <fecomponenttransfer> <fefuncr type="line...
...And 25 more matches
NSS tools : ssltap
the following are well-known port numbers: * http
80 * https 443 * smtp 25 * ftp 21 * imap 143 * imaps 993 (imap over ssl) * nntp 119 * nntps 563 (nntp over ssl) usage and examples you can use the ssl debugging tool to intercept any connection information.
... example 1 $ ssltap.exe -sx -p 444 interzone.mcom.com:443 > sx.txt output connected to interzone.mcom.com:443 -->; [ alloclen = 66 bytes [ssl2] clienthellov2 { version = {0x03, 0x00} cipher-specs-length = 39 (0x27) sid-length = 0 (0x00) challenge-length = 16 (0x10) cipher-suites = { (0x0100
80) ssl2/rsa/rc4-12
8/md5 (0x0200
80) ssl2/rsa/rc4-40/md5 (0x0300
80) ssl2/rsa/rc2cbc12
8/md5 (0x0400
80) ssl2/rsa/rc2cbc40/md5 (0x060040) ssl2/rsa/des64cbc/md5 (0x0700c0) ssl2/rsa/3des192ede-cbc/md5 (0x000004) ssl3/rsa/rc4-12
8/md5 (0x00ffe0) ssl3/rsa-fips/3des192ede-cbc/s...
...ha (0x00000a) ssl3/rsa/3des192ede-cbc/sha (0x00ffe1) ssl3/rsa-fips/des64cbc/sha (0x000009) ssl3/rsa/des64cbc/sha (0x000003) ssl3/rsa/rc4-40/md5 (0x000006) ssl3/rsa/rc2cbc40/md5 } session-id = { } challenge = { 0xec5d 0x
8edb 0x37c9 0xb5c9 0x7b70 0x
8fe9 0xd1d3 0x2592 } } ] <-- [ sslrecord { 0: 16 03 00 03 e5 |.....
...And 24 more matches
Codecs used by WebRTC - Web media technologies
however, rfc 7742 specifies that all webrtc-compatible browsers must support vp
8 and h.264's constrained baseline profile for video, and rfc 7
874 specifies that browsers must support at least the opus codec as well as g.711's pcma and pcmu formats.
... mandatory video codecs codec name profile(s) browser compatibility vp
8 — chrome, edge, firefox, safari (12.1+) avc / h.264 constrained baseline (cb) chrome (52+), edge, firefox[1], safari [1] firefox for android 6
8 and later do not support avc (h.264) anymore.
... other video codecs codec name profile(s) browser compatibility vp9 — chrome (4
8+), firefox vp
8 vp
8, which we describe in general in the main guide to video codecs used on the web, has some specific requirements that must be followed when using it to encode or decode a video track on a webrtc connection.
...And 24 more matches
NSS tools : ssltab
the following are well-known port numbers: * http
80 * https 443 * smtp 25 * ftp 21 * imap 143 * imaps 993 (imap over ssl) * nntp 119 * nntps 563 (nntp over ssl) usage and examples you can use the ssl debugging tool to intercept any connection information.
...example 1 $ ssltap.exe -sx -p 444 interzone.mcom.com:443 > sx.txt output connected to interzone.mcom.com:443 -->; [ alloclen = 66 bytes [ssl2] clienthellov2 { version = {0x03, 0x00} cipher-specs-length = 39 (0x27) sid-length = 0 (0x00) challenge-length = 16 (0x10) cipher-suites = { (0x0100
80) ssl2/rsa/rc4-12
8/md5 (0x0200
80) ssl2/rsa/rc4-40/md5 (0x0300
80) ssl2/rsa/rc2cbc12
8/md5 (0x0400
80) ssl2/rsa/rc2cbc40/md5 (0x060040) ssl2/rsa/des64cbc/md5 (0x0700c0) ssl2/rsa/3des192ede-cbc/md5 (0x000004) ssl3/rsa/rc4-12
8/md5 (0x00ffe0) ssl3/rsa-fips/3des192ede-cbc/sha (0x00000a) ssl3/rsa/3des192ede-cbc/sha (0x00ffe1) ssl3/rsa-fips/des64cbc/sha (0x000009) ssl3/rsa/des64cbc/sha (0x000003) ssl3/rsa/...
...rc4-40/md5 (0x000006) ssl3/rsa/rc2cbc40/md5 } session-id = { } challenge = { 0xec5d 0x
8edb 0x37c9 0xb5c9 0x7b70 0x
8fe9 0xd1d3 0x2592 } } ] <-- [ sslrecord { 0: 16 03 00 03 e5 |.....
...And 23 more matches
NSS tools : ssltap
the following are well-known port numbers: * http
80 * https 443 * smtp 25 * ftp 21 * imap 143 * imaps 993 (imap over ssl) * nntp 119 * nntps 563 (nntp over ssl) usage and examples you can use the ssl debugging tool to intercept any connection information.
...example 1 $ ssltap.exe -sx -p 444 interzone.mcom.com:443 > sx.txt output connected to interzone.mcom.com:443 -->; [ alloclen = 66 bytes [ssl2] clienthellov2 { version = {0x03, 0x00} cipher-specs-length = 39 (0x27) sid-length = 0 (0x00) challenge-length = 16 (0x10) cipher-suites = { (0x0100
80) ssl2/rsa/rc4-12
8/md5 (0x0200
80) ssl2/rsa/rc4-40/md5 (0x0300
80) ssl2/rsa/rc2cbc12
8/md5 (0x0400
80) ssl2/rsa/rc2cbc40/md5 (0x060040) ssl2/rsa/des64cbc/md5 (0x0700c0) ssl2/rsa/3des192ede-cbc/md5 (0x000004) ssl3/rsa/rc4-12
8/md5 (0x00ffe0) ssl3/rsa-fips/3des192ede-cbc/sha (0x00000a) ssl3/rsa/3des192ede-cbc/sha (0x00ffe1) ssl3/rsa-fips/des64cbc/sha (0x000009) ssl3/rsa/des64cbc/sha (0x000003) ssl3/rsa/...
...rc4-40/md5 (0x000006) ssl3/rsa/rc2cbc40/md5 } session-id = { } challenge = { 0xec5d 0x
8edb 0x37c9 0xb5c9 0x7b70 0x
8fe9 0xd1d3 0x2592 } } ] <-- [ sslrecord { 0: 16 03 00 03 e5 |.....
...And 23 more matches
nsIDOMWindowUtils
1.0 66 introduced gecko 1.
8 inherits from: nsisupports last changed in gecko 49.0 (firefox 49.0 / thunderbird 49.0 / seamonkey 2.46) implemented by: window.
...armozafterpaintevents(); pruint32 comparecanvases(in nsidomhtmlcanvaselement acanvas1, in nsidomhtmlcanvaselement acanvas2, out unsigned long amaxdifference); double computeanimationdistance(in nsidomelement element, in astring property, in astring value1, in astring value2); nsicompositionstringsynthesizer createcompositionstringsynthesizer(); obsolete since gecko 3
8.0 void disablenontestmouseevents(in boolean adisable); boolean dispatchdomeventviapresshell(in nsidomnode atarget, in nsidomevent aevent, in boolean atrusted); nsidomelement elementfrompoint(in float ax, in float ay, in boolean aignorerootscrollframe, in boolean aflushlayout); void entermodalstate(); nsidomelement findelementwithviewid(in nsviewid ...
... void removesheet(in nsiuri sheeturi, in unsigned long type); void resumetimeouts(); void sendcompositionevent(in astring atype); obsolete since gecko 9 void sendcompositionevent(in astring atype, in astring adata, in astring alocale); obsolete since gecko 3
8.0 void sendcontentcommandevent(in astring atype, [optional] in nsitransferable atransferable); void getclassname(in object aobj); boolean sendkeyevent(in astring atype, in long akeycode, in long acharcode, in long amodifiers, [optional] in boolean apreventdefault); obsolete since gecko 15.0 boolean sendkeyevent(in astring atype, in long akeycode, in long ach...
...And 23 more matches
Hacking Tips
/jscntxt.cpp:495 495 if (maybecx) (gdb) call js::dumpbacktrace(maybecx) #0 (nil) typein:2 (0x7fffef1231c0 @ 0) #1 (nil) typein:2 (0x7fffef1231c0 @ 24) #2 (nil) typein:3 (0x7fffef1231c0 @ 47) #3 (nil) typein:2 (0x7fffef1231c0 @ 24) #4 (nil) typein:3 (0x7fffef1231c0 @ 47) […] #25157 0x7fffefbbc250 typein:2 (0x7fffef1231c0 @ 24) #2515
8 0x7fffefbbc1c
8 typein:3 (0x7fffef1231c0 @ 47) #25159 0x7fffefbbc140 typein:2 (0x7fffef1231c0 @ 24) #25160 0x7fffefbbc0b
8 typein:3 (0x7fffef1231c0 @ 47) #25161 0x7fffefbbc030 typein:5 (0x7fffef1232
80 @ 9) note, you can do the exact same exercise above using lldb (necessary on osx after apple removed gdb) by running lldb -f js then following the remaining steps.
... since spidermonkey 4
8, we have a gdb unwinder.
... $ gdb --args out/dist/bin/js ./foo.js […] spidermonkey unwinder is disabled by default, to enable it type: enable unwinder .* spidermonkey (gdb) b js::math_cos (gdb) run […] #0 js::math_cos (cx=0x14f2640, argc=1, vp=0x7fffffff6a
88) at js/src/jsmath.cpp:33
8 33
8 callargs args = callargsfromvp(argc, vp); (gdb) enable unwinder .* spidermonkey (gdb) backtrace 10 #0 0x0000000000f
89979 in js::math_cos(jscontext*, unsigned int, js::value*) (cx=0x14f2640, argc=1, vp=0x7fffffff6a
88) at js/src/jsmath.cpp:33
8 #1 0x0000000000ca9c6e in js::calljsnative(jscontext*, bool (*)(jscontext*, unsigned int, js::value*), js::callargs const&) (cx=0x14f2640, native=0xf
899...
...And 22 more matches
Tamarin build documentation - Archive of obsolete content
cross-platform build (general instructions - non-android) prerequisites: you need python 2.5 or later and gnu make 3.
81 or later.
... (gnu make 3.
80 does not work.
... $ make cppflags=-davmplus_verbose additional instructions for non-android cross-platform tamarin-redux build on osx 10.6 (snow leopard) (to build tamarin-central on mac please see previous cross-platform instructions here: https://developer.mozilla.org/index.php?title=en/tamarin/tamarin_build_documentation&revision=21 the bug when building on snow leopard (bug 537
817) has been fixed in the tamarin-redux repo.
...And 19 more matches
Python binding for NSS
python-nss internally supports utf-
8.
...if a python unicode object is passed to a nss/nspr function it will be encoded as utf-
8 first before being passed to nss/nspr.
...the initial release of python-nss occurred in september 200
8 with it's inclusion in the fedora distribution.
...And 19 more matches
nsIAccessibleEvent
constants constant gecko version description 1.7 - 1.
8.1 1.9 - 1.9.2 2.0 event_show 0x
8002 0x0001 an object has been created.
... event_hide 0x
8003 0x0002 an object has been destroyed.
... event_reorder 0x
8004 0x005c 0x0003 an object's children have changed.
...And 19 more matches
IDBObjectStore - Web APIs
25 full support 25 no support 25 — 57prefixed prefixed implemented with the vendor prefix: webkitfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support 1.5 full support 1.5 no support 1.5 — 7.0prefixed prefixed implemented with the vendor prefix: webkitaddchrome full support 24 full support 24 ...
... 25 full support 25 no support 25 — 57prefixed prefixed implemented with the vendor prefix: webkitfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support 1.5 full support 1.5 no support 1.5 — 7.0prefixed prefixed implemented with the vendor prefix: webkitautoincrementchrome full support 24 full support 24 ...
... 25 full support 25 no support 25 — 57prefixed prefixed implemented with the vendor prefix: webkitfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support 1.5 full support 1.5 no support 1.5 — 7.0prefixed prefixed implemented with the vendor prefix: webkitclearchrome full support 24 full support 24 ...
...And 19 more matches
Implementation Status - Archive of obsolete content
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 30216
8; 3.3.1 model supported 3.3.2 instance partial instance element with two child element does not trigger exception 337302; 3.3.3 submission partial no support for @indent and complex schema validation 27
8761; 27
8762; 3.3.4 bind partial using t...
... 27
844
8; 33
8146; 4.2 initialization events supported 4.2.1 xforms-model-construct supported 4.2.2 xforms-model-construct-done supported 4.2.3 xforms-ready supported 4.2.4 xforms-model-destruct support...
... 4.3.3 xforms-revalidate supported 4.3.4 xforms-refresh supported 4.3.5 xforms-reset supported 4.3.6 xforms-next xforms-previous supported 4.3.7 xforms-focus supported 4.3.
8 xforms-help xforms-hint supported 4.3.9 xforms-submit partial see section 11.2 for more details 4.3.10 xforms-submit-serialize supported 4.4 notification events supported 4.4.1 xforms-insert supported ...
...And 18 more matches
Legacy layout methods - Learn web development
add the following to the bottom of your css: div:nth-of-type(1) { width: 4
8%; } div:nth-of-type(2) { width: 4
8%; } here we've set both to be 4
8% of their parent's width — this totals 96%, leaving us 4% free to act as a gutter between the two columns, giving the content some space to breathe.
... now we just need to float the columns, like so: div:nth-of-type(1) { width: 4
8%; float: left; } div:nth-of-type(2) { width: 4
8%; float: right; } putting this all together should give us a result like so: simple two-column layout <h1>2 column layout example</h1> <div> <h2>first column</h2> <p>lorem ipsum dolor sit amet, consectetur adipiscing elit.
...cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p> </div> body { width: 90%; max-width: 900px; margin: 0 auto; } div:nth-of-type(1) { width: 4
8%; float: left; } div:nth-of-type(2) { width: 4
8%; float: right; } you'll notice here that we are using percentages for all the widths — this is quite a good strategy, as it creates a liquid layout, one that adjusts to different screen sizes and keeps the same proportions for the column widths at smaller screen sizes.
...And 18 more matches
Experimental features in Firefox
see bug
840640 for more details.
... nightly 7
8 yes developer edition 7
8 yes beta 7
8 yes release 7
8 no preference name network.preload css display stray control characters in css as hex boxes this feature renders control characters (unicode category cc) other than tab (u+0009), line feed (u+000a), form feed (u+000c), and carriage return (u+000d) as a hexbox when they are not ...
... see bug 1223
880 for more details.
...And 18 more matches
Mozilla Quirks Mode Behavior
add padding if the very first node in an li is another ul or ol (bug 9
8636).
...removed in firefox 50 (bug 64
8331).
... indent nested dl elements (bug
8749).
...And 18 more matches
PKCS #11 Module Specs
values can contain any printable ascii value, including utf
8 characters.
... manufacturerid override the default manufactureid value for the module returned in the ck_info, ck_slot_info, and ck_token_info structures with an internationalize string (utf
8).
... this value will be truncated at 32 bytes (no null, partial utf
8 characters dropped).
...And 18 more matches
nsIAccessibleRole
role_alert
8 represents an alert or a condition that a user should be notified about.
... role_dialog 1
8 represents a dialog box or message box.
... role_row 2
8 represents a row of cells within a table.
...And 18 more matches
nsIURI
inherits from: nsisupports last changed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) see the following rfcs for details: rfc3490: internationalizing domain names in applications (idna) rfc39
86: uniform resource identifier (uri): generic syntax rfc39
87: internationalized resource identifiers subclasses of nsiuri, such as nsiurl, impose further structure on the uri.
... prepath path scheme userpass host port ref ftp :// username@password @ hostname : portnumber /pathname?query=value #ref method overview nsiuri clone(); nsiuri cloneignoringref(); boolean equals(in nsiuri other); boolean equalsexceptref(in nsiuri other); autf
8string resolve(in autf
8string relativepath); boolean schemeis(in string scheme); attributes attribute type description asciihost acstring the uri host with an ascii compatible encoding.
... follows the idna draft specification for converting internationalized domain names (utf-
8) to ascii for compatibility with existing internet infrastructure.
...And 18 more matches
Index
found 11
8 pages: # page tags and summary 1 thunderbird thunderbird thunderbird is a mail/messaging application managed and developed by the thunderbird community.
...
8 address book examples mailnews, seamonkey, thunderbird this article provides examples on accessing and manipulating thunderbird address books.
... 1
8 cookies in thunderbird cookies, guide, thunderbird in versions of thunderbird prior to 3 the cookie policy was very restrictive (to rss only).
...And 17 more matches
Index - HTTP
8 access-control-allow-headers cors, http, reference, header the access-control-allow-headers response header is used in response to a preflight request which includes the access-control-request-headers to indicate which http headers can be used during the actual request.
... 1
8 authorization http, http header, reference, request header, header the http authorization request header contains the credentials to authenticate a user agent with a server, usually after the server has responded with a 401 unauthorized status and the www-authenticate header.
... 2
8 content-security-policy csp, http, reference, security, header the http content-security-policy response header allows web site administrators to control resources the user agent is allowed to load for a given page.
...And 17 more matches
nsIAppShellService
inherits from: nsisupports last changed in gecko
8.0 (firefox
8.0 / thunderbird
8.0 / seamonkey 2.5) implemented by: @mozilla.org/appshell/appshellservice;1 as a service: var appshellservice = components.classes["@mozilla.org/appshell/appshellservice;1"] .getservice(components.interfaces.nsiappshellservice); method overview void closetoplevelwindow(in nsixulwindow awindow); obsolete since gecko 1.
8 void createhiddenwindow(in nsiappshell aappshell); native code only!
... boolean createstartupstate(in long awindowwidth, in long awindowheight); obsolete since gecko 1.
8 nsixulwindow createtoplevelwindow(in nsixulwindow aparent, in nsiuri aurl, in pruint32 achromemask, in long ainitialwidth, in long ainitialheight, in nsiappshell aappshell); nsiwebnav createwindowlessbrowser (in bool aischrome) void destroyhiddenwindow(); void doprofilestartup(in nsicmdlineservice acmdlineservice, in boolean caninteract); obsolete since gecko 1.
8 void ensure1window(in nsicmdlineservice acmdlineservice); obsolete since gecko 1.
8 void enterlastwindowclosingsurvivalarea(); obsolete since gecko 1.
8 void exitlastwindowclosingsurvivalarea(); obsolete since gecko 1.
8 void gethiddenwindowandjscontext(out...
... void hidesplashscreen(); obsolete since gecko 1.
8 void initialize(in nsicmdlineservice acmdlineservice, in nsisupports nativeappsupportorsplashscreen); obsolete since gecko 1.
8 void quit(in pruint32 aferocity); obsolete since gecko 1.
8 void registertoplevelwindow(in nsixulwindow awindow); void run(); obsolete since gecko 1.
8 void toplevelwindowismodal(in nsixulwindow awindow, in boolean amodal); obsolete since gecko 1.9.1 void unregistertoplevelwindow(in nsixulwindow awindow); note: prior to gecko
8.0, all references to nsidomwindow used in this interface were nsidomwindowinternal.
...And 16 more matches
TextEncoder.prototype.encodeInto() - Web APIs
the textencoder.prototype.encodeinto() method takes a usvstring to encode and a destination uint
8array to put resulting utf-
8 encoded text into, and returns a dictionary object indicating the progress of the encoding.
... syntax b1 = encoder.encodeinto(string, uint
8array); parameters string is a usvstring containing the text to encode.
... uint
8array is a uint
8array object instance to place the resulting utf-
8 encoded text into.
...And 16 more matches
Accessibility documentation index - Accessibility
8 forms aria, accessibility the following pages provide various techniques for improving the accessibility of web forms: 9 alerts aria, accessibility, forms, web you have a form — a contact form, for example — that you want to put some accessible error checking into.
... 1
8 using the aria-describedby attribute aria, accessibility, attribute the aria-describedby attribute is used to indicate the ids of the elements that describe the object.
... 2
8 using the aria-valuenow attribute aria, accessibility, needscontent the aria-valuenow attribute is used to define the current value for a range widget such as a slider, spinbutton or progressbar.
...And 16 more matches
Chapter 3: Introduction to XUL—How to build a more intuitive UI - Archive of obsolete content
shimoda-san is a co-author of firefox 3 hacks (o'reilly japan, 200
8).
...the namespace uri is : http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul if the character encoding is utf-
8, both the encoding specifier and the xml declaration can be omitted.
... <?xml version="1.0" encoding="utf-
8"?> <?xml-stylesheet href="chrome://global/skin/"?> <window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <!-- contents go here.
...And 15 more matches
Chapter 5: Let's build a Firefox extension - Archive of obsolete content
change to your name --> <em:creator>gomita</em:creator> <!-- web page address through which extension is distributed --> <em:homepageurl>http://www.xuldev.org/helloworld/</em:homepageurl> <!-- this section gives details of the target application for the extension (in this case: firefox 2) --> <em:targetapplication> <description> <em:id>{ec
8030f7-c20a-464f-9b0e-13a3a9e973
84}</em:id> <em:minversion>2.0</em:minversion> <em:maxversion>4.0.0.*</em:maxversion> </description> </em:targetapplication> </description> </rdf> create the chrome manifest fill in the chrome.manifest file as shown in listing 2.
...create a new locale folder with subfolders and files within the helloworld folder, as shown in figure
8.
... fixme: figure
8: directory structure with locale package added table 3: files used in phase 3 fixme: make the table cleaner file name role locale\en-us\clock.dtd dtd definining entity references used in clock.xul (for english).
...And 15 more matches
sslfnc.html
in nss 2.
8, the ssl_enable_fdx option only affects the behavior of non-blocking ssl sockets.
...nss 2.
8 supports tls in addition to ssl2 and ssl3.
...nss 2.
8 will negotiate the higest protocol version with the peer application from among the set of protocols that are commonly enabled in both applications.
...And 15 more matches
Bytecode Descriptions
jsop::zero, jsop::one, jsop::int
8, jsop::uint16, and jsop::uint24 are all compact encodings for jsop::int32.
... int
8 operands: (int
8_t val) stack: ⇒ val push the int
8_t immediate operand as an int32value.
...format: jof_atom symbol operands: (uint
8_t symbol (the js::symbolcode of the symbol to use)) stack: ⇒ symbol push a well-known symbol.
...And 15 more matches
mozIStorageBindingParams
void bindutf
8stringbyindex(in unsigned long aindex, in autf
8string avalue); native code only!
... void bindbyname(in autf
8string aname, in nsivariant avalue); void bindblobbyname(in autf
8string aname, [array, const, size_is(avaluesize)] in octet avalue, in unsigned long avaluesize); void binddoublebyname(in autf
8string aname, in double avalue); native code only!
... void bindint32byname(in autf
8string aname, in long avalue); native code only!
...And 15 more matches
JavaScript modules - JavaScript
to change preferences in firefox, visit about:config.ie no support noopera full support 4
8safari full support 10.1webview android full support 61chrome android full support 61firefox android full support 60 full support 60 no support 54 �...
...to change preferences in firefox, visit about:config.opera android full support 45safari ios full support 10.3samsung internet android full support
8.0nodejs full support 13.2.0notes full support 13.2.0notes notes modules must either have a filename ending in .mjs, or the nearest parent package.json file must contain "type": "module".
... full support
8.5.0notes disabled notes module filenames must end with .mjs, not .js.
...And 15 more matches
Web audio codec guide - Web media technologies
audio encoder configuration effects on quality and size feature effect on quality effect on size lossless compression no loss of fidelity unlikely to get more than 40-50% compression lossy compression always some loss of fidelity; the higher the compression, the more the loss compression of up to
80-95% possible quality setting the higher the quality, the better the fidelity of the encoded audio the higher the fidelity, the larger the resulting file becomes, though the amount of change varies from codec to codec bit rate the higher the bit rate, the higher the quality can be the higher the bit rate, the larger the encoded file is likely to be audio fre...
...human speech generally resides within the audio frequency range of 300 hz to 1
8 khz.
... however, the vast majority of human vocalizations exist in the range 300 hz to
8 khz, and you can capture enough of human vocalizations in the frequency range 500 hz to 3 khz to still be understandable.
...And 15 more matches
Examples - Archive of obsolete content
--> <!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>problem 1 - < in xhtml</title> <meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-
8" /> <script type="text/javascript"> var i = 0; while (++i > 10) { // ...
...k to the article problem 2 <!-- this file should have a .xhtml 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>problem 2 - comments in xhtml</title> <meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-
8" /> <style type="text/css"> <!-- body {background-color: blue; color: yellow; } --> </style> <script type="text/javascript"> <!-- var i = 0; var sum = 0; for (i = 0; i < 10; ++i) { sum += i; } alert('sum = ' + sum); // --> </script> </head> <body> <h1>problem 2 - comments in xhtml</h1> <p> this document is valid xhtml 1.0 strict served as <...
... </p> <dl> <dt>mozilla 1.1+/opera 7</dt> <dd>do not apply css or execute the javascript.</dd> <dt>netscape 7.0x/mozilla 1.0.x</dt> <dd>do not apply css but does execute the javascript.</dd> <dt>internet explorer 5.5+</dt> <dd>can not display the document.</dd> </dl> <p> <a href="http://validator.w3.org/check/referer"><img src="https://udn.realityripple.com/samples/
8a/9e64asf935.png" alt="valid xhtml 1.0!" height="31" width="
88" /></a> </p> </body> </html> back to the article problem 3 <!-- this file should have a .xhtml extension and will generate an error when parsed.
...And 14 more matches
NSS_3.12.3_release_notes.html
the new behavior conforms to rfc 2
81
8.
...t.h: sec_oid_seed_cbc in sslproto.h: tls_rsa_with_seed_cbc_sha in sslt.h: ssl_calg_seed new structure for seed support: (see blapit.h) seedcontextstr seedcontext new functions in the nss shared library: cert_rfc14
85_escapeandquote (see cert.h) cert_comparecerts (see cert.h) cert_registeralternateocspaiainfocallback (see ocsp.h) pk11_getsymkeyhandle (see pk11pqg.h) util_setforkstate (see secoid.h) nss_getalgorithmpolicy (see secoid.h) nss_setalgorithmpolicy (see secoid.h) for the 2 functions above see also (in secoidt.h): nss_use_...
... bug 1594
83: cert name matching: rfc 2
81
8 vs.
...And 14 more matches
NSS Tools certutil
using the certificate database tool the certificate database tool is a command-line utility that can create and modify the netscape communicator cert
8.db and key3.db database files.
... it can also list, generate, modify, or delete certificates within the cert
8.db file and create or change the password, generate new public and private key pairs, display the contents of the key database, or delete key pairs within the key3.db file.
... the cert
8.db and key3.db database files must reside in the same directory.
...And 14 more matches
SubtleCrypto.importKey() - Web APIs
pkcs
8: pkcs #
8 format.
... supported formats this api supports four different key import/export formats: raw, pkcs #
8, subjectpublickeyinfo, and json web key.
... pkcs #
8 you can use this format to import or export rsa or elliptic curve private keys.
...And 14 more matches
SubtleCrypto.unwrapKey() - Web APIs
pkcs
8: pkcs #
8 format.
...*/ const saltbytes = [
89,113,135,234,16
8,204,21,36,55,93,1,132,242,242,192,156]; /* the wrapped key itself.
... */ const wrappedkeybytes = [171,223,14,36,201,233,233,120,164,6
8,217,192,226,
80, 224,39,199,235,239,60,212,169,100,23,61,54,244,197,160,
80,109,230,207, 225,57,197,175,71,
80,209]; /* convert an array of byte values to an arraybuffer.
...And 14 more matches
Linear-gradient Generator - CSS: Cascading Style Sheets
div data-value='px'> pixels (px) </div> <div data-value='%'> percentage (%) </div> </div> <div id="delete-axis" class="button"> delete line </div> </div> <div class="property"> <div class="ui-slider" data-topic="axis-rotation" data-info="rotation" data-min="-1
80" data-value="0" data-max="1
80"></div> </div> </div> <div id="tool-section" class="section"> <div class="title"> tool settings </div> <div class="property"> <div class="name"> alpha background </div> <div id="canvas-bg"></div> <div id="add-axis" class="button"> add ...
...nd:</span> <span class="value"></span> </div> </div> </div> css content /* * color picker tool */ .ui-color-picker { width: 420px; margin: 0; border: 1px solid #ddd; background-color: #fff; display: table; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .ui-color-picker .picking-area { width: 19
8px; height: 19
8px; margin: 5px; border: 1px solid #ddd; position: relative; float: left; display: table; } .ui-color-picker .picking-area:hover { cursor: default; } /* hsv format - hue-saturation-value(brightness) */ .ui-color-picker .picking-area { background: url("images/picker_mask.png"); background: -moz-linear-gradient(bottom, #000 0%, rgba(0, 0, 0, 0) 100%), -moz-linear-gradi...
...hsla(0, 0%, 100%, 0) 50%, hsla(0, 0%, 0%, 0) 50%, hsl(0, 0%, 0%) 100%), -o-linear-gradient(left, hsl(0, 0%, 50%) 0%, hsla(0, 0%, 50%, 0) 100%); background-color: #f00; } .ui-color-picker .picker { width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%; border: 1px solid #fff; position: absolute; top: 45%; left: 45%; } .ui-color-picker .picker:before { width:
8px; height:
8px; content: ""; position: absolute; border: 1px solid #999; border-radius: 50%; } .ui-color-picker .hue, .ui-color-picker .alpha { width: 19
8px; height: 2
8px; margin: 5px; border: 1px solid #fff; float: left; } .ui-color-picker .hue { background: url("images/hue_mask.png"); background: -moz-linear-gradient(left, #f00 0%, #ff0 16.66%, #0f0 33.33%, #0ff 50%, #00f 66.6...
...And 14 more matches
<blend-mode> - CSS: Cascading Style Sheets
<div id="div"></div> #div { width: 300px; height: 300px; background: url('https://mdn.mozillademos.org/files/
8543/br.png'), url('https://mdn.mozillademos.org/files/
8545/tr.png'); background-blend-mode: normal; } multiply the final color is the result of multiplying the top and bottom colors.
... <div id="div"></div> #div { width: 300px; height: 300px; background: url('https://mdn.mozillademos.org/files/
8543/br.png'), url('https://mdn.mozillademos.org/files/
8545/tr.png'); background-blend-mode: multiply; } screen the final color is the result of inverting the colors, multiplying them, and inverting that value.
... <div id="div"></div> #div { width: 300px; height: 300px; background: url('https://mdn.mozillademos.org/files/
8543/br.png'), url('https://mdn.mozillademos.org/files/
8545/tr.png'); background-blend-mode: screen; } overlay the final color is the result of multiply if the bottom color is darker, or screen if the bottom color is lighter.
...And 14 more matches
Proxy Auto-Configuration (PAC) file - HTTP
in chrome (versions 52 to 73), you can disable this by setting pachttpsurlstrippingenabled to false in policy or by launching with the --unsafe-pac-url command-line flag (in chrome 74, only the flag works, and from 75 onward, there is no way to disable path-stripping; as of chrome
81, path-stripping does not apply to http urls, but there is interest in changing this behavior to match https); in firefox, the preference is network.proxy.autoconfig_url.include_path.
... examples proxy w3proxy.netscape.com:
80
80; proxy mozilla.netscape.com:
80
81 primary proxy is w3proxy:
80
80; if that goes down start using mozilla:
80
81 until the primary proxy comes up again.
... proxy w3proxy.netscape.com:
80
80; proxy mozilla.netscape.com:
80
81; direct same as above, but if both proxies go down, automatically start making direct connections.
...And 14 more matches
Drawing graphics - Learn web development
note: basic canvas functionality is supported well across browsers, with the exception of ie
8 and below for 2d canvas, and ie 11 and below for webgl.
... function degtorad(degrees) { return degrees * math.pi / 1
80; }; next, start off your path by adding the following below your previous addition; here we set a color for our triangle, start drawing a path, and then move the pen to (50, 50) without drawing anything.
... try adding the following block to the bottom of your javascript: ctx.strokestyle = 'white'; ctx.linewidth = 1; ctx.font = '36px arial'; ctx.stroketext('canvas text', 50, 50); ctx.fillstyle = 'red'; ctx.font = '4
8px georgia'; ctx.filltext('canvas text', 50, 150); here we draw two lines of text, one outline and the other stroke.
...And 13 more matches
Debugging Frame Reflow
log file analysis the log file for a simple table like <!doctype html public "-//w3c//dtd html 4.01 transitional//en"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=iso-
8859-1"> </head> <body> <table width="100"> <tbody> <tr> <td>foo</td> </tr> </tbody> </table> </body> </html> will create the following log: vp 00b97c30 r=0 a=91
80,4470 c=91
80,4470 cnt=
856 scroll 00b97ee0 r=0 a=91
80,4470 c=91
80,4470 cnt=
857 scroll 00b97ee0 r=0 a=91
80,4470 c=91
80,4470 cnt=
85
8 canvas 00b97c6c r=0 a=91
80,uc c=91
80,4470 cnt=
859 area 02d7afe4 r=0 a=91
80,uc c=...
...91
80,uc cnt=
860 text 02d7b150 r=0 a=91
80,uc c=uc,uc cnt=
861 text 02d7b150 d=0,0 block 02d7b210 r=0 a=91
80,uc c=
8940,uc cnt=
862 block 02d7b210 d=
8940,0 area 02d7afe4 d=91
80,120 canvas 00b97c6c d=91
80,4470 scroll 00b97ee0 d=91
80,4470 scroll 00b97ee0 d=91
80,4470 vp 00b97c30 d=91
80,4470 vp 00b97c30 r=1 a=91
80,4470 c=91
80,4470 cnt=
863 scroll 00b97ee0 r=1 a=91
80,4470 c=91
80,4470 cnt=
864 scroll 00b97ee0 r=1 a=91
80,4470 c=91
80,4470 cnt=
865 canvas 00b97c6c r=1 a=91
80,uc c=91
80,4470 cnt=
866 area 02d7afe4 r=1 a=91
80,uc c=91
80,uc cnt=
867 block 02d7b210 r=1 a=91
80,uc c=
8940,uc cnt=
86
8 text 02d7b3f
8 r=0 a=
8940,uc c=uc,uc cnt=
869 text 02d7b3f
8 d=0,0 tblo 02d7b5f0 r=0 a=
8940,uc c=0,0 cnt=
870 tbl 02d7b7ec r=0 a=
8940,uc c=1500,uc cnt=
871 rowg 00b9...
...
84a4 r=0 a=uc,uc c=uc,uc cnt=
872 row 02d7baf
8 r=0 a=uc,uc c=uc,uc cnt=
873 cell 02d7bc9
8 r=0 a=uc,uc c=uc,uc cnt=
874 block 02d7bcf
8 r=0 a=uc,uc c=uc,uc cnt=
875 text 02d7be
84 r=0 a=uc,uc c=uc,uc cnt=
876 text 02d7be
84 d=300,2
85 me=300 block 02d7bcf
8 d=300,300 me=300 cell 02d7bc9
8 d=330,330 me=330 row 02d7baf
8 d=uc,330 rowg 00b9
84a4 d=uc,330 colg 02d7bfb0 r=0 a=uc,uc c=uc,uc cnt=
877 col 02d7c0d
8 r=0 a=0,0 c=1500,uc cnt=
87
8 col 02d7c0d
8 d=0,0 colg 02d7bfb0 d=0,0 rowg 00b9
84a4 r=2 a=1500,uc c=1500,uc cnt=
879 row 02d7baf
8 r=2 a=1500,uc c=1500,uc cnt=
880 cell 02d7bc9
8 r=2 a=1440,uc c=1410,uc cnt=
881 block 02d7bcf
8 r=2 a=1410,uc c=1410,uc cnt=
882 ...
...And 13 more matches
Localization and Plurals
plural rule #0 (1 form) families: asian (chinese, japanese, korean), persian, turkic/altaic (turkish), thai, lao everything: 0, 1, 2, 3, 4, 5, 6, 7,
8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 1
8, 19, 20, 21, 22, 23, 24, 25, 26, 27, 2
8, 29, 30, 31, 32, 33, 34, 35, 36, 37, 3
8, 39, 40, 41, 42, 43, 44, 45, 46, 47, 4
8, 49, … plural rule #1 (2 forms) families: germanic (danish, dutch, english, faroese, frisian, german, norwegian, swedish), finno-ugric (estonian, finnish, hungarian), language isolate (basque), latin/greek (greek), semitic (hebrew), rom...
...anic (italian, portuguese, spanish, catalan), vietnamese is 1: 1 everything else: 0, 2, 3, 4, 5, 6, 7,
8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 1
8, 19, 20, 21, 22, 23, 24, 25, 26, 27, 2
8, 29, 30, 31, 32, 33, 34, 35, 36, 37, 3
8, 39, 40, 41, 42, 43, 44, 45, 46, 47, 4
8, 49, 50, … plural rule #2 (2 forms) families: romanic (french, brazilian portuguese), lingala is 0 or 1: 0, 1 everything else: 2, 3, 4, 5, 6, 7,
8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 1
8, 19, 20, 21, 22, 23, 24, 25, 26, 27, 2
8, 29, 30, 31, 32, 33, 34, 35, 36, 37, 3
8, 39, 40, 41, 42, 43, 44, 45, 46, 47, 4
8, 49, 50, 51, … plural rule #3 (3 forms) families: baltic (latvian, latgalian) ends in 0: 0 ends in 1, excluding 11: 1, 21, 31, 41, 51, 61, 71,
81, 91, 101, 121, 131, 141, 151, 161, 171, 1
81, 191, 201, 221, 231, 241, 2...
...51, 261, 271, 2
81, 291, … everything else: 2, 3, 4, 5, 6, 7,
8, 9, 11, 12, 13, 14, 15, 16, 17, 1
8, 19, 22, 23, 24, 25, 26, 27, 2
8, 29, 32, 33, 34, 35, 36, 37, 3
8, 39, 42, 43, 44, 45, 46, 47, 4
8, 49, 52, 53, … plural rule #4 (4 forms) families: celtic (scottish gaelic) is 1 or 11: 1, 11 is 2 or 12: 2, 12 is 3-10 or 13-19: 3, 4, 5, 6, 7,
8, 9, 10, 13, 14, 15, 16, 17, 1
8, 19 everything else: 0, 20, 21, 22, 23, 24, 25, 26, 27, 2
8, 29, 30, 31, 32, 33, 34, 35, 36, 37, 3
8, 39, 40, 41, 42, 43, 44, 45, 46, 47, 4
8, 49, 50, 51, … plural rule #5 (3 forms) families: romanic (romanian) is 1: 1 is 0 or ends in 01-19, excluding 1: 0, 2, 3, 4, 5, 6, 7,
8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 1
8, 19, 101, 102, 103, 104, 105, 106, 107, 10
8, 109, 110, 111, 112, 113, 114, 115, 116, 117, 11
8, 119,...
...And 13 more matches
A Web PKI x509 certificate primer
in this document we will be referring to the current standard in use for web pki: x509 v3, which is described in detail in rfc 52
80.
... extensions while rfc 52
80 defines 16 extensions for webpki in this document we will be describing the six extensions we considered critical for understanding.
... certificates can have other extensions not described on rfc 52
80, but that is out of the scope of this document.
...And 13 more matches
nsIVariant
autf
8string getasautf
8string(); native code only!
... pruint
8 getasint
8(); native code only!
... pruint
8 getasuint
8(); native code only!
...And 13 more matches
nsIZipReader
to create an instance, use: var zipreader = components.classes["@mozilla.org/libjar/zip-reader;1"] .createinstance(components.interfaces.nsizipreader); about character sets and code pages note: nsizipreader has a code page problem; that is, in the zip specification, filenames are supposed to use 7-bit ascii; however, most modern filesystems use
8 bit code pages, such as utf-
8.
... starting in gecko 10.0 (firefox 10.0 / thunderbird 10.0 / seamonkey 2.7), the nsizipreader api supports a limited
8 bit code page usage.
... all functions now pass the filenames (both in and out) as autf
8string.
...And 13 more matches
IDBDatabase - Web APIs
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 xlink:href="/docs/web/api/idbdatabase" target="_top"><rect x="151" y="1" width="110" height="50" fill="#f4f7f
8" 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.
... 25 full support 25 no support 25 — 57prefixed prefixed implemented with the vendor prefix: webkitfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support 1.5 full support 1.5 no support 1.5 — 7.0prefixed prefixed implemented with the vendor prefix: webkitabort eventchrome full support 24 full support 24 ...
... 7webview android full support yeschrome android full support 25firefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support 1.5closechrome full support 24 full support 24 no support 23 — 24prefixed prefixed implemented with the vendor prefix: webkitedge full support 12firefox ...
...And 13 more matches
Writing a WebSocket server in C# - Web APIs
here's a barebones server implementation: using system.net.sockets; using system.net; using system; class server { public static void main() { tcplistener server = new tcplistener(ipaddress.parse("127.0.0.1"),
80); server.start(); console.writeline("server has started on 127.0.0.1:
80.{0}waiting for a connection...", environment.newline); tcpclient client = server.accepttcpclient(); console.writeline("a client connected."); } } tcpclient methods: system.net.sockets.networkstream getstream() gets the stream which is the communication channel.
... using system.text; using system.text.regularexpressions; while(client.available < 3) { // wait for enough bytes to be available } byte[] bytes = new byte[client.available]; stream.read(bytes, 0, bytes.length); //translate bytes of request to string string data = encoding.utf
8.getstring(bytes); if (regex.ismatch(data, "^get")) { } else { } the response is easy to build, but might be a little bit difficult to understand.
... you must: obtain the value of the "sec-websocket-key" request header without any leading or trailing whitespace concatenate it with "25
8eafa5-e914-47da-95ca-c5ab0dc
85b11" (a special guid specified by rfc 6455) compute sha-1 and base64 hash of the new value write the hash back as the value of "sec-websocket-accept" response header in an http response if (new system.text.regularexpressions.regex("^get").ismatch(data)) { const string eol = "\r\n"; // http/1.1 defines the sequence cr lf as the end-of-line marker byte[] response = encoding.utf
8.getbytes("http/1.1 101 switching protocols" + eol + "connection: upgrade" + eol ...
...And 13 more matches
Border-image generator - CSS: Cascading Style Sheets
border image generator html content <div id="container"> <div id="gallery"> <div id="image-gallery"> <img class="image" src="https://udn.realityripple.com/samples/2c/fa0192d1
8e.png" data-stateid="border1"/> <img class="image" src="https://udn.realityripple.com/samples/b
8/dacdd63e77.png" data-stateid="border2"/> <img class="image" src="https://udn.realityripple.com/samples/07/1fcc357205.png" data-stateid="border3"/> <img class="image" src="https://udn.realityripple.com/samples/7b/dd37c1d691.png" data-stateid="border4"/> <img class="image" src="https://udn.realityripple.com/samples/a9/b9fff72dab.png" data-stateid="bord...
...er5"/> <img class="image" src="https://udn.realityripple.com/samples/fb/c0b2
85d3da.svg" data-stateid="border6"/> </div> </div> <div id="load-actions" class="group section"> <div id="toggle-gallery" data-action="hide"> </div> <div id="load-image" class="button"> upload image </div> <input id="remote-url" type="text" placeholder="load an image from url"/> <div id="load-remote" class="button"> </div> </div> <div id="general-controls" class="group section"> <div class="name"> control box </div> <div class="separator"></div> <div class="property"> <div class="name">scale</div> <div class="ui-input-slider" data-topic="sca...
... <span class="name"> border-image-source: </span> <span id="out-border-source" class="value"> </span> </div> </div> </div> </div> css content /* grid of twelve * ========================================================================== */ .span_12 { width: 100%; } .span_11 { width: 91.46%; } .span_10 { width:
83%; } .span_9 { width: 74.54%; } .span_
8 { width: 66.0
8%; } .span_7 { width: 57.62%; } .span_6 { width: 49.16%; } .span_5 { width: 40.7%; } .span_4 { width: 32.24%; } .span_3 { width: 23.7
8%; } .span_2 { width: 15.32%; } .span_1 { width: 6.
86%; } /* sections * ========================================================================== */ .section { clear: both; padding: 0px...
...And 13 more matches
NSS 3.12.4 release notes
<center> 2009-0
8-20 </center> <center>newsgroup: mozilla.dev.tech.crypto</center> introduction network security services (nss) 3.12.4 is a patch release for nss 3.12.
... nss 3.12.4 requires nspr 4.
8.
...our qa tested nss 3.12.4 with nspr 4.
8, but it should work with nspr 4.7.1 or later.
...And 12 more matches
mozIStorageConnection
1.0 6
8 introduced gecko 1.
8 inherits from: nsisupports last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) for a general overview on how to use this interface, see storage.
... method overview void asyncclose([optional] in mozistoragecompletioncallback acallback); void begintransaction(); void begintransactionas(in print32 transactiontype); mozistoragestatement clone([optional] in boolean areadonly); void close(); void committransaction(); void createaggregatefunction(in autf
8string afunctionname, in long anumarguments, in mozistorageaggregatefunction afunction); mozistorageasyncstatement createasyncstatement(in autf
8string asqlstatement); void createfunction(in autf
8string afunctionname, in long anumarguments, in mozistoragefunction afunction); mozistoragestatement createstatement(in autf
8string asqlstatement); void createtable(in string atablename, in strin...
...g atableschema); mozistoragependingstatement executeasync([array, size_is(anumstatements)] in mozistoragebasestatement astatements, in unsigned long anumstatements, [optional] in mozistoragestatementcallback acallback ); void executesimplesql(in autf
8string asqlstatement); boolean indexexists(in autf
8string aindexname); void preload(); obsolete since gecko 1.9 void removefunction(in autf
8string afunctionname); mozistorageprogresshandler removeprogresshandler(); void rollbacktransaction(); void setgrowthincrement(in print32 aincrement, in autf
8string adatabasename); mozistorageprogresshandler setprogresshandler(in print32 agranularity, in mozistorageprogresshandler ahandler); boolean tableexists(in...
...And 12 more matches
mozIStorageStatement
method overview void initialize(in mozistorageconnection adbconnection, in autf
8string asqlstatement); obsolete since gecko 1.9.1 void finalize(); mozistoragestatement clone(); autf
8string getparametername(in unsigned long aparamindex); unsigned long getparameterindex(in autf
8string aname); autf
8string getcolumnname(in unsigned long acolumnindex); unsigned long getcolumnindex(in autf
8string aname); void reset(); ...
... astring escapestringforlike(in astring avalue, in wchar aescapechar); void bindparameters(in mozistoragebindingparamsarray aparameters); mozistoragebindingparamsarray newbindingparamsarray(); void bindutf
8stringparameter(in unsigned long aparamindex, in autf
8string avalue); void bindstringparameter(in unsigned long aparamindex, in astring avalue); void binddoubleparameter(in unsigned long aparamindex, in double avalue); void bindint32parameter(in unsigned long aparamindex, in long avalue); void bindint64parameter(in unsigned long aparamindex, in long long avalue); void bindnullparameter(in unsigned long aparamindex); void bindblobparameter(in unsigned long aparamindex, [array,const,size_is(avaluesize...
...this method exists back to gecko 1.
8.0.
...And 12 more matches
nsIWebBrowserPersist
persist_flags_ignore_iframes
8 ignore iframe content (usually adverts).
... persist_flags_fixup_original_dom 12
8 make changes to original dom rather than cloning nodes.
... persist_flags_serialize_output 1024 force serialization of output (one file at a time; not concurrent) persist_flags_dont_change_filenames 204
8 don't make any adjustments to filenames.
...And 12 more matches
Basic animations - Web APIs
50); // earth var time = new date(); ctx.rotate(((2 * math.pi) / 60) * time.getseconds() + ((2 * math.pi) / 60000) * time.getmilliseconds()); ctx.translate(105, 0); ctx.fillrect(0, -12, 40, 24); // shadow ctx.drawimage(earth, -12, -12); // moon ctx.save(); ctx.rotate(((2 * math.pi) / 6) * time.getseconds() + ((2 * math.pi) / 6000) * time.getmilliseconds()); ctx.translate(0, 2
8.5); ctx.drawimage(moon, -3.5, -3.5); ctx.restore(); ctx.restore(); ctx.beginpath(); ctx.arc(150, 150, 105, 0, math.pi * 2, false); // earth orbit ctx.stroke(); ctx.drawimage(sun, 0, 0, 300, 300); window.requestanimationframe(draw); } init(); <canvas id="canvas" width="300" height="300"></canvas> screenshotlive sample an animated clock this example draws an animated clo...
... function clock() { var now = new date(); var ctx = document.getelementbyid('canvas').getcontext('2d'); ctx.save(); ctx.clearrect(0, 0, 150, 150); ctx.translate(75, 75); ctx.scale(0.4, 0.4); ctx.rotate(-math.pi / 2); ctx.strokestyle = 'black'; ctx.fillstyle = 'white'; ctx.linewidth =
8; ctx.linecap = 'round'; // hour marks ctx.save(); for (var i = 0; i < 12; i++) { ctx.beginpath(); ctx.rotate(math.pi / 6); ctx.moveto(100, 0); ctx.lineto(120, 0); ctx.stroke(); } ctx.restore(); // minute marks ctx.save(); ctx.linewidth = 5; for (i = 0; i < 60; i++) { if (i % 5!= 0) { ctx.beginpath(); ctx.moveto(117, 0); ctx.lineto(120, 0); ctx.stroke(); } ctx.rotate(math.pi / 30); ...
...hr - 12 : hr; ctx.fillstyle = 'black'; // write hours ctx.save(); ctx.rotate(hr * (math.pi / 6) + (math.pi / 360) * min + (math.pi / 21600) *sec); ctx.linewidth = 14; ctx.beginpath(); ctx.moveto(-20, 0); ctx.lineto(
80, 0); ctx.stroke(); ctx.restore(); // write minutes ctx.save(); ctx.rotate((math.pi / 30) * min + (math.pi / 1
800) * sec); ctx.linewidth = 10; ctx.beginpath(); ctx.moveto(-2
8, 0); ctx.lineto(112, 0); ctx.stroke(); ctx.restore(); // write seconds ctx.save(); ctx.rotate(sec * math.pi / 30); ctx.strokestyle = '#d40000'; ctx.fillstyle = '#d40000'; ctx.linewidth = 6; ctx.beginpath(); ctx.moveto(-30, 0...
...And 12 more matches
IDBTransaction - Web APIs
e="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 xlink:href="/docs/web/api/idbtransaction" target="_top"><rect x="151" y="1" width="140" height="50" fill="#f4f7f
8" 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 examp...
...(bug
88859
8) transactions can have one of three modes: constant value description read_only "readonly" (0 in chrome) allows data to be read but not changed.
... 25 full support 25 no support 25 — 57prefixed prefixed implemented with the vendor prefix: webkitfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support 1.5 full support 1.5 no support 1.5 — 7.0prefixed prefixed implemented with the vendor prefix: webkitabortchrome full support 24 full support 24 ...
...And 12 more matches
reftest opportunities files - Archive of obsolete content
403b http://dbaron.org/css/test/specific http://dbaron.org/css/test/noncss1 http://dbaron.org/css/test/noncss2 http://dbaron.org/css/test/shortbox http://dbaron.org/css/test/shortbox2 http://dbaron.org/css/test/rootbox http://dbaron.org/css/test/listbox http://dbaron.org/css/test/margtest http://dbaron.org/css/test/shortborder http://dbaron.org/css/test/shortborder2 http://dbaron.org/css/test/sec0
805 http://dbaron.org/css/test/dborder http://dbaron.org/css/test/sec090102 http://dbaron.org/css/test/sec090201 http://dbaron.org/css/test/sec090203 http://dbaron.org/css/test/sec090204 http://dbaron.org/css/test/sec090205 http://dbaron.org/css/test/sec090301 http://dbaron.org/css/test/sec090302a http://dbaron.org/css/test/sec090302b http://dbaron.org/css/test/sec090302c http://dbaron.org/css/test...
...http://dbaron.org/css/test/sec170401 http://dbaron.org/css/test/sec170501 http://dbaron.org/css/test/sec170501a http://dbaron.org/css/test/sec170501b http://dbaron.org/css/test/sec170502 http://dbaron.org/css/test/sec170503 http://dbaron.org/css/test/sec170504 http://dbaron.org/css/test/tborder1 http://dbaron.org/css/test/tborder2 http://dbaron.org/css/test/sec1706c http://dbaron.org/css/test/sec1
801 http://dbaron.org/css/test/sec1
802 http://dbaron.org/css/test/sec1
803 http://dbaron.org/css/test/outline http://dbaron.org/css/test/sq_small http://dbaron.org/css/test/sq_large tests from mozilla source tree parser/htmlparser/tests/html/xmp005.html parser/htmlparser/tests/html/value001.html parser/htmlparser/tests/html/utf
8001.html parser/htmlparser/tests/html/usascii.html parser/htmlparser/t...
...ests/html/title01.html parser/htmlparser/tests/html/title.html parser/htmlparser/tests/html/tiny.html parser/htmlparser/tests/html/thead001.html parser/htmlparser/tests/html/text003.html parser/htmlparser/tests/html/text002.html parser/htmlparser/tests/html/text001.html parser/htmlparser/tests/html/tbody001.html parser/htmlparser/tests/html/target01.html parser/htmlparser/tests/html/tag00
8.html parser/htmlparser/tests/html/tag007.html parser/htmlparser/tests/html/tag006.html parser/htmlparser/tests/html/tag005.html parser/htmlparser/tests/html/tag004.html parser/htmlparser/tests/html/tag003.html parser/htmlparser/tests/html/tag002.html parser/htmlparser/tests/html/tag001.html parser/htmlparser/tests/html/tableall.html parser/htmlparser/tests/html/table205.html parser/htmlparser/tests/html/t...
...And 11 more matches
Choosing the right approach - Learn web development
≤37 full support ≤37 full support ≤37prefixed prefixed implemented with the vendor prefix: webkitchrome android full support 25 full support 25 full support 1
8prefixed prefixed implemented with the vendor prefix: webkitfirefox android full support 23 full support 23 no support 14 — 42prefixed prefixed implemented with the vendor prefix: mozopera android full support 14 full sup...
...spromisechrome full support 32edge full support 12firefox full support 29ie no support noopera full support 19safari full support
8webview android full support 4.4.3chrome android full support 32firefox android full support 29opera android full support 19safari ios full support
8samsung internet android ...
... 12firefox full support 29notes full support 29notes notes constructor requires a new operator since version 37.ie no support noopera full support 19safari full support
8notes full support
8notes notes constructor requires a new operator since version 10.webview android full support 4.4.3chrome android full support 32firefox android full support 29notes full support ...
...And 11 more matches
Mozilla’s UAAG evaluation report
longdesc for frame: not supported, see bug 365
8 noframe for frame: must use user style sheets to render this.
... 2.
8 no repair text.
... longdesc for frame: not supported, see bug 365
8 noframe for frame: must use user style sheets to render this.
...And 11 more matches
NSS 3.52 release notes
notable changes in nss 3.52 bug 160362
8 - update nss to support pkcs #11 v3.0.
... bugs fixed in nss 3.52 bug 163349
8 - fix unused variable 'getauxval' error on ios compilation.
... bug 163045
8 - fix problem of gyp msvc builds not producing debug symbol files.
...And 11 more matches
NSS functions
mxr 3.2 and later cert_getusepkixforvalidation mxr 3.12 and later cert_getvaliddnspatternsfromcert mxr 3.12 and later cert_gentime2formattedascii mxr 3.2 and later cert_hexify mxr 3.2 and later cert_importcachain mxr 3.2 and later cert_importcerts mxr 3.2 and later cert_isrootdercert mxr 3.
8 and later cert_isusercert mxr 3.6 and later cert_keyfromdercrl mxr 3.4 and later cert_makecanickname mxr 3.4 and later cert_mergeextensions mxr 3.10 and later cert_nametoascii mxr 3.2 and later cert_newcertlist mxr 3.2 and later cert_newtempcertificate mxr 3.12 and later cert_nickname...
...stringsfromcertlist mxr 3.4 and later cert_opencertdbfilename mxr 3.2 and later cert_ocspcachesettings mxr 3.11.7 and later cert_pkixverifycert mxr 3.12 and later cert_removecertlistnode mxr 3.6 and later cert_rfc14
85_escapeandquote mxr 3.2 and later cert_savesmimeprofile mxr 3.2 and later cert_setsloptime mxr 3.2 and later cert_setocspfailuremode mxr 3.11.7 and later cert_setocsptimeout mxr 3.12 and later cert_setusepkixforvalidation mxr 3.12 and later cert_startcertextensions mxr 3.5 and later cert_startcertificaterequestattributes mxr 3.10 and later cert_startcrlentryextensions mxr 3.10 and...
... pk11_getbestslotmultiple mxr 3.2 and later pk11_getbestwrapmechanism mxr 3.2 and later pk11_getblocksize mxr 3.2 and later pk11_getcertfromprivatekey mxr 3.9.3 and later pk11_getcurrentwrapindex mxr 3.2 and later pk11_getdefaultarray mxr 3.
8 and later pk11_getdefaultflags mxr 3.
8 and later pk11_getdisabledreason mxr 3.
8 and later pk11_getfirstsafe mxr 3.2 and later pk11_getinternalkeyslot mxr 3.2 and later pk11_getinternalslot mxr 3.2 and later pk11_getkeygen mxr 3.4 a...
...And 11 more matches
NSS Tools modutil
this tool can also create key3.db, cert
8.db, and secmod.db security database files.
... the tasks associated with security module database management are part of a process that typically also involves managing key databases (key3.db files) and certificate databases (cert
8.db files).
...the options and arguments for the modutil command are defined as follows: options -create create new secmod.db, key3.db, and cert
8.db files.
...And 11 more matches
FileSystemEntry - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetfilesystementry experimentalchrome full support
8alternate name full support
8alternate name alternate name uses the non-standard name: entryedge full support 79prefixed full support 79prefixed prefixed implemented with the vendor prefix: webkitfirefox full support 5...
...port nosafari full support 11.1webview android full support ≤37alternate name full support ≤37alternate name alternate name uses the non-standard name: entrychrome android full support 1
8alternate name full support 1
8alternate name alternate name uses the non-standard name: entryfirefox android full support 50opera android no support nosafari ios full support 11.3samsung internet android ...
... full support yesprefixed full support yesprefixed prefixed implemented with the vendor prefix: webkitcopyto experimentaldeprecatednon-standardchrome full support
8edge full support 79firefox no support noie no support noopera no support nosafari no support nowebview android full support ≤37chrome android full support 1
8firefox android no support...
...And 11 more matches
Chapter 4: Using XPCOM—Implementing advanced processes - Archive of obsolete content
shimoda is a co-author of firefox 3 hacks (o'reilly japan, 200
8).
... listing 1: calling xpcom functions using xpconnect <?xml version="1.0" encoding="utf-
8"?> <page xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <script type="application/javascript"><![cdata[ var ioservice = components.classes['@mozilla.org/network/io-service;1'] .getservice(components.interfaces.nsiioservice); alert(ioservice); ]]></script> </page> calling xpconnect using local files try saving the contents of listing 1 as the...
...see listing
8.
...And 10 more matches
SeaMonkey - making custom toolbar (SM ver. 1.x) - Archive of obsolete content
if your language uses accents or other non-latin characters, set your text editor to save files using the utf-
8 encoding.
...from seamonkey's menu bar, choose view – character encoding – unicode (utf-
8).
...if your text editor does not support utf-
8, search the internet for a better one that you can download.
...And 10 more matches
Obsolete Build Caveats and Tips
obsolete caveats and tips from simple_firefox_build install a version of visual studio that supports c++ development: vs 2012 for windows desktop pro or express (free), or vc++ 2010 pro or express (free), or vc++ 200
8 pro or express with sp1 (free) (warning !
... this note below seems redundant as this is true by default https://msdn.microsoft.com/en-us/library/dh
8che7s%2
8v=vs.110%29.aspx note: starting with gecko 7.0, you should no longer include "-zc:wchar_t-" in the command line when building on windows.
... from windows_sdk_versions visual c++ 9 (vs200
8) professional/express download and install the windows 7 sdk.
...And 10 more matches
OS.File for the main thread
example: read the contents of a file as text the following snippet opens a file "file.txt" and read its contents as a string, using the default encoding (utf-
8).
... let decoder = new textdecoder(); // this decoder can be reused for several reads let promise = os.file.read("file.txt"); // read the complete file as an array promise = promise.then( function onsuccess(array) { return decoder.decode(array); // convert this array to a text } ); this example requires firefox 1
8 or a more recent version.
... example: write a string to a file the following snippet writes the text "this is some text" to a string "file.txt", using the default encoding (utf-
8).
...And 10 more matches
MathML Accessibility in Mozilla
hence basic support is available in gecko 41.0 (firefox 41.0 / thunderbird 41.0 / seamonkey 2.3
8) and we are still trying to keep in sync with webkit/voiceover.
...see bug 11769
83 and webkit's bug 146454 a.
...see bug 11769
83 and webkit's bug 146454 a.
...And 10 more matches
NSS 3.54 release notes
(bug 152
8113).
... certificate authority changes the following ca certificates were added: bug 16451
86 - certsign root ca g2 sha-256 fingerprint: 657cfe2fa73faa3
8462571f332a2363a46fce7020951710702cdfbb6eeda3305 bug 1645174 - e-szigno root ca 2017 sha-256 fingerprint: beb00b30
839b9bc32c32e4447905950641f26421b15ed0
8919
8b51
8ae2ea1b99 bug 1641716 - microsoft ecc root certificate authority 2017 sha-256 fingerprint: 35
8df39d764af9e1b766e9c972df352ee15cfac227af6ad1d70e
8e4a6edcba02 bug 1641716 - microsoft rsa root certificate authority 2017 sha-256 fingerprint: c741f70f4b2a
8d
88bf2e71c14122ef53ef10eba0cfa5e64cfa20f41
8853073e0 the following ca certificates were removed: bug 1645199 - addtrust class 1 ca root ...
... sha-256 fingerprint:
8c7209279ac04e275e16d07fd3b775e
80154b596
8046e31f52dd25766324e9a7 bug 1645199 - addtrust external ca root sha-256 fingerprint: 6
87fa4513
8227
8fff0c
8b11f
8d43d576671c6eb2bceab413fb
83d965d06d2ff2 bug 164171
8 - luxtrust global root 2 sha-256 fingerprint: 54455f7129c20b1447c41
8f99716
8f24c5
8fc5023bf5da5be2eb6e1dd
8902ed5 bug 16399
87 - staat der nederlanden root ca - g2 sha-256 fingerprint: 66
8c
83947da63b724bece1743c31a0e6aed0db
8ec5b31be377bb7
84f91b6716f bug 161
8402 - symantec class 2 public primary certification authority - g4 sha-256 fingerprint: fe
863d0
822fe7a2353fa4
84d5924e
875656d3dc9fb5
8771f6f616f9d571bc592 bug 161
8402 - symantec class 1 public primary cert...
...And 10 more matches
nsINavBookmarksService
1.0 67 introduced gecko 1.
8 inherits from: nsisupports last changed in gecko 14.0 (firefox 14.0 / thunderbird 14.0 / seamonkey 2.11) implemented by: @mozilla.org/browser/nav-bookmarks-service;1.
...] .getservice(components.interfaces.nsinavbookmarksservice); method overview void addobserver(in nsinavbookmarkobserver observer, in boolean ownsweak); void beginupdatebatch(); obsolete since gecko 1.9 void changebookmarkuri(in long long aitemid, in nsiuri anewuri); long long createdynamiccontainer(in long long aparentfolder, in autf
8string aname, in astring acontractid, in long aindex); note: renamed from createcontainer in gecko 1.9 obsolete since gecko 13.0 long long createfolder(in long long aparentfolder, in autf
8string name, in long index); void endupdatebatch(); obsolete since gecko 1.9 void exportbookmarkshtml(in nsifile file); obsolete since gecko 1.9 nsiuri getbookmarkedurifor(in n...
... getidforitemat(in long long aparentid, in long aindex); prtime getitemdateadded(in long long aitemid); astring getitemguid(in long long aitemid); obsolete since gecko 14.0 long long getitemidforguid(in astring aguid); obsolete since gecko 14.0 long getitemindex(in long long aitemid); prtime getitemlastmodified(in long long aitemid); autf
8string getitemtitle(in long long aitemid); unsigned short getitemtype(in long long aitemid); astring getkeywordforbookmark(in long long aitemid); obsolete since gecko 40.0 astring getkeywordforuri(in nsiuri auri); obsolete since gecko 40.0 nsitransaction getremovefoldertransaction(in long long aitemid); nsiuri geturiforkeyword(in astring keyword); obs...
...And 10 more matches
nsIWebBrowserChrome
chrome_window_resize
8 value for the chromeflags attribute.
... chrome_statusbar 12
8 value for the chromeflags attribute.
... chrome_extra 204
8 value for the chromeflags attribute.
...And 10 more matches
nsIZipWriter
to create an instance, use: var zipwriter = components.classes["@mozilla.org/zipwriter;1"] .createinstance(components.interfaces.nsizipwriter); method overview void addentrychannel(in autf
8string azipentry, in prtime amodtime, in print32 acompression, in nsichannel achannel, in boolean aqueue); void addentrydirectory(in autf
8string azipentry, in prtime amodtime, in boolean aqueue); void addentryfile(in autf
8string azipentry, in print32 acompression, in nsifile afile, in boolean aqueue); void addentrystream(in autf
8string azipentry, in prtime amodtime, in p...
...rint32 acompression, in nsiinputstream astream, in boolean aqueue); void close(); nsizipentry getentry(in autf
8string azipentry); boolean hasentry(in autf
8string azipentry); void open(in nsifile afile, in print32 aioflags); void processqueue(in nsirequestobserver aobserver, in nsisupports acontext); void removeentry(in autf
8string azipentry, in boolean aqueue); attributes attribute type description comment acstring gets or sets the comment associated with the currently open zip file.
... void addentrychannel( in autf
8string azipentry, in prtime amodtime, in print32 acompression, in nsichannel achannel, in boolean aqueue ); parameters azipentry the path of the file entry to add to the zip file.
...And 10 more matches
Web Console remoting - Firefox Developer Tools
the remote web console is a feature introduced in firefox 1
8.
... ], }, } the response packet is a network event actor grip: { "to": "conn0.console9", "eventactor": { "actor": "conn0.netevent14", "starteddatetime": "2013-0
8-26t19:50:03.699z", "url": "http://localhost", "method": "get" "isxhr": true, "private": false } } you can also use the webconsoleclient.sendhttprequest(request, onresponse) method.
... the pageerror packet is: { "from": "conn0.console9", "type": "pageerror", "pageerror": { "errormessage": "referenceerror: foo is not defined", "sourcename": "http://localhost/~mihai/mozilla/test.js", "linetext": "", "linenumber": 6, "columnnumber": 0, "category": "content javascript", "timestamp": 134729450
8210, "error": false, "warning": false, "exception": true, "strict": false, "private": false, } } the packet is similar to nsiscripterror - for simplicity.
...And 10 more matches
IDBIndex - Web APIs
25 full support 25 no support 25 — 57prefixed prefixed implemented with the vendor prefix: webkitfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support 1.5 full support 1.5 no support 1.5 — 7.0prefixed prefixed implemented with the vendor prefix: webkitcountchrome full support 24 full support 24 ...
...— ?prefixed prefixed implemented with the vendor prefix: webkitchrome android full support 25firefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support 1.5getchrome full support 24 full support 24 no support 23 — 24prefixed prefixed implemented with the vendor prefix: webkitedge full support 12firefox ...
...— ?prefixed prefixed implemented with the vendor prefix: webkitchrome android full support 25firefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support 1.5getallchrome full support 4
8edge full support ≤1
8firefox full support 44ie no support noopera full support ...
...And 10 more matches
TextEncoder - Web APIs
textencoder takes a stream of code points as input and emits a stream of utf-
8 bytes.
... note: there is a polyfill implementation to support non-utf-
8 text encodings on github.
... example const encoder = new textencoder() const view = encoder.encode('€') console.log(view); // uint
8array(3) [226, 130, 172] constructor textencoder() returns a newly constructed textencoder that will generate a byte stream with utf-
8 encoding.
...And 10 more matches
Color picker tool - CSS: Cascading Style Sheets
x" data-info="z-index" data-max="20" data-sensivity="10"></div> </div> </div> css /* * color picker tool */ .ui-color-picker { width: 420px; margin: 0; border: 1px solid #ddd; background-color: #fff; display: table; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .ui-color-picker .picking-area { width: 19
8px; height: 19
8px; margin: 5px; border: 1px solid #ddd; position: relative; float: left; display: table; } .ui-color-picker .picking-area:hover { cursor: default; } /* hsv format - hue-saturation-value(brightness) */ .ui-color-picker .picking-area { background: url('https://mdn.mozillademos.org/files/5707/picker_mask_200.png') center center; background: -moz-linear-gradient(bottom, #00...
...p, hsl(0, 0%, 100%) 0%, hsla(0, 0%, 100%, 0) 50%, hsla(0, 0%, 0%, 0) 50%, hsl(0, 0%, 0%) 100%), -o-linear-gradient(left, hsl(0, 0%, 50%) 0%, hsla(0, 0%, 50%, 0) 100%); background-color: #f00; } .ui-color-picker .picker { width: 10px; height: 10px; border-radius: 50%; border: 1px solid #fff; position: absolute; top: 45%; left: 45%; } .ui-color-picker .picker:before { width:
8px; height:
8px; content: ""; position: absolute; border: 1px solid #999; border-radius: 50%; } .ui-color-picker .hue, .ui-color-picker .alpha { width: 19
8px; height: 2
8px; margin: 5px; border: 1px solid #fff; float: left; } .ui-color-picker .hue { background: url("https://mdn.mozillademos.org/files/5701/hue.png") center; background: -moz-linear-gradient(left, #f00 0%, #ff0 16.66%, #...
...0f0 33.33%, #0ff 50%, #00f 66.66%, #f0f
83.33%, #f00 100%); background: -webkit-linear-gradient(left, #f00 0%, #ff0 16.66%, #0f0 33.33%, #0ff 50%, #00f 66.66%, #f0f
83.33%, #f00 100%); background: -ms-linear-gradient(left, #f00 0%, #ff0 16.66%, #0f0 33.33%, #0ff 50%, #00f 66.66%, #f0f
83.33%, #f00 100%); background: -o-linear-gradient(left, #f00 0%, #ff0 16.66%, #0f0 33.33%, #0ff 50%, #00f 66.66%, #f0f
83.33%, #f00 100%); } .ui-color-picker .alpha { border: 1px solid #ccc; background: url("https://mdn.mozillademos.org/files/5705/alpha.png"); } .ui-color-picker .alpha-mask { width: 100%; height: 100%; background: url("https://mdn.mozillademos.org/files/60
89/alpha_mask.png"); } .ui-color-picker .slider-picker { width: 2px; height: 100%; border: 1px solid #777; b...
...And 10 more matches
Using CSS transitions - CSS: Cascading Style Sheets
nsition-timing-function: ease-in-out; transition-property: width height background-color font-size left top transform -webkit-transform color; transition-duration: 0.5s; transition-timing-function: ease-in-out; } .box1{ transform: rotate(270deg); -webkit-transform: rotate(270deg); width: 50px; height: 50px; background-color: blue; color: yellow; font-size: 1
8px; left: 150px; top: 25px; position: absolute; -webkit-transition-property: width height background-color font-size left top transform -webkit-transform color; -webkit-transition-duration: 0.5s; -webkit-transition-timing-function: ease-in-out; transition-property: width height background-color font-size left top transform -webkit-transformv color; transition-durati...
... 1s; -webkit-transition-timing-function: ease-in-out; transition-property: width height background-color font-size left top transform color; transition-duration: 1s; transition-timing-function: ease-in-out; } .box1{ transform: rotate(270deg); -webkit-transform: rotate(270deg); width: 50px; height: 50px; background-color: blue; color: yellow; font-size: 1
8px; left: 150px; top: 25px; position: absolute; -webkit-transition-property: width height background-color font-size left top -webkit-transform transform color; -webkit-transition-duration: 1s; -webkit-transition-timing-function: ease-in-out; transition-property: width height background-color font-size left top transform -webkit-transform color; transition-duration:...
...ransition-timing-function: ease-in-out; transition-property: width height background-color font-size left top transform -webkit-transform color; transition-duration: 2s; transition-timing-function: ease-in-out; } .box1{ transform: rotate(270deg); -webkit-transform: rotate(270deg); width: 50px; height: 50px; background-color: blue; color: yellow; font-size: 1
8px; left: 150px; top: 25px; position: absolute; -webkit-transition-property: width height background-color font-size left top transform -webkit-transform color; -webkit-transition-duration: 2s; -webkit-transition-timing-function: ease-in-out; transition-property: width height background-color font-size left top transform -webkit-transform color; transition-duration:...
...And 10 more matches
Localizations and character encodings - Developer guides
the html specification recommends the use of the utf-
8 encoding (which can represent all of unicode) and regardless of the encoding used requires web content to declare what encoding was used.
... to specify that a page is using, for example, the utf-
8 character encoding (as per the recommendation), simply place the following line in the <head> block: <meta charset="utf-
8"> details and browser internals when the encoding is declared by web content like the html specification requires, firefox will use that encoding for turning the bytes into the internal representation.
... unfortunately, using utf-
8 and declaring that utf-
8 was used was not always the prevalent way of offering web content.
...And 10 more matches
<input type="datetime-local"> - HTML: Hypertext Markup Language
you can set a default value for the input by including a date and time inside the value attribute, like so: <label for="party">enter a date and time for your party booking:</label> <input id="party" type="datetime-local" name="partydate" value="2017-06-01t0
8:30"> one thing to note is that the displayed date and time formats differ from the actual value; the displayed date and time are formatted according to the user's locale as reported by their operating system, whereas the date/time value is always formatted yyyy-mm-ddthh:mm.
... when the above value submitted to the server, for example, it will look like partydate=2017-06-01t0
8:30.
...partydate=2017-06-01t0
8%3a30.
...And 10 more matches
WebAssembly - JavaScript
rt 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.0compileerrorchrome 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 ...
...rt 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.0globalchrome full support 69edge no support nofirefox full support 62ie no support noopera no support nosafari no support nowe...
...rt 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.0linkerrorchrome 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 ...
...And 10 more matches
The building blocks of responsive design - Progressive web apps (PWAs)
first of all, as expected, there is a media query in our main css, which is quite weighty, so we'll go through it in parts: @media all and (max-width: 4
80px) { x-card:nth-child(1), x-card:nth-child(2), x-card:nth-child(3) { width: 100%; float: none; padding: 0; } button { margin-top: 0; border-radius: 0; } x-card:nth-child(1) video, x-card:nth-child(2) img { border-radius: 0px; border: none; padding: 0; background-color: 0; } this first block resets a number of different things from the widescreen...
... nav { width: 100%; position: absolute; z-index: 1000; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; } nav button { font-size: 6.
8vw; -webkit-flex: 1; -moz-flex: 1; -ms-flex: 1; flex: 1; border-left: 1px solid rgba(100,100,100,0.4); } nav button:first-child { border-left: 0; } } in this last set of rules, we change the display value of the <nav> to flex to make it show (it was set to none in the default css at the top of the stylesheet, as it wasn't needed for the other views.) we t...
... next up, the font-size of the buttons is set to 6.
8vw.
...And 10 more matches
SVG and CSS - SVG: Scalable Vector Graphics
example make a new svg document as a plain text file, doc
8.svg.
...00/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <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="-2
80" y="-270">svg demonstration</text> <text id="caption" x="-2
80" 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)"/> <g id="outer-petals"> <g class="quadrant"> <g class="segment"> <path class="segment-fill" d="m0,0 v-200 a40,40 0 0,0 -62,10 z"/> <path c...
...lass="segment-edge" d="m0,-200 a40,40 0 0,0 -62,10"/> </g> <g class="segment" transform="rotate(1
8)"> <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 class="segment" transform="rotate(36)"> <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 class="segment" transform="rotate(54)"> <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 class="segment" transform="rotate(72)"> <path class="segment-fill" d="m0,0 v-200...
...And 10 more matches
WebAssembly
rt 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.0compileerrorchrome 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 ...
...rt 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.0globalchrome full support 69edge no support nofirefox full support 62ie no support noopera no support nosafari full support 13...
...rt 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.0linkerrorchrome 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 ...
...And 10 more matches
Introduction to SSL - Archive of obsolete content
in addition, ssl 2.0 support is entirely removed in firefox
8.
...to ensure that red hat console can control an ssl-enabled server, the server must enable at least one of the following cipher suites for ssl 3.0: rc4 with 12
8-bit encryption and md5 message authentication rc4 with 40-bit encryption and md5 message authentication rc2 with 40-bit encryption and md5 message authentication no encryption, md5 message authentication only cipher suites with rsa key exchange table 1 lists the cipher suites supported by ssl that use the rsa key-exchange algorithm.
... triple des with 16
8-bit encryption and sha-1 message authentication triple des is the strongest cipher supported by ssl, but it is not as fast as rc4.
...And 9 more matches
Responsive images - Learn web development
the standard <img> element traditionally only lets you point the browser to a single source file: <img src="elva-fairy-
800w.jpg" alt="elva dressed as a fairy"> we can however use two new attributes — srcset and sizes — to provide several additional source images along with hints to help the browser pick the right one.
... you can see an example of this in our responsive.html example on github (see also the source code): <img srcset="elva-fairy-4
80w.jpg 4
80w, elva-fairy-
800w.jpg
800w" sizes="(max-width: 600px) 4
80px,
800px" src="elva-fairy-
800w.jpg" alt="elva dressed as a fairy"> the srcset and sizes attributes look complicated, but they're not too hard to understand if you format them as shown above, with a different part of the attribute value on each line.
...for each one, we write: an image filename (elva-fairy-4
80w.jpg) a space the image's intrinsic width in pixels (4
80w) — note that this uses the w unit, not px as you might expect.
...And 9 more matches
What went wrong? Troubleshooting JavaScript - Learn web development
in this case, we've got line
86, character number 3.
... if we look at line
86 in our code editor, we'll find this line: guesssubmit.addeventlistener('click', checkguess); the error message says "guesssubmit.addeventlistener is not a function", which means that the function we're calling is not recognized by the javascript interpreter.
... this time the error being reported is "typeerror: loworhi is null", on line 7
8.
...And 9 more matches
Index
found 6
89 pages: # page tags and summary 1 add-ons add-ons, extension, extensions, landing, mozilla add-ons allow developers to extend and modify the functionality of firefox.
... 676 index add-ons, glossary, guide, index found 6
89 pages: 677 signing and distributing your add-on add-ons, extensions, webextensions, distribution, publication, reviews, signing add-ons need to be signed before they can be installed into release and beta versions of firefox.
... 67
8 make money from browser extensions guide, monetization, webextensions, distribution while users can download browser extensions for firefox free of cost from addons.mozilla.org (amo), this doesn’t mean you can’t make money from browser extensions, and to a more limited extent themes.
...And 9 more matches
about:memory
for example: 5
85 (100.0%) -- preference-service └──5
85 (100.0%) -- referent ├──493 (
84.27%) ── strong └───92 (15.73%) -- weak ├──92 (15.73%) ── alive └───0 (00.00%) ── dead leaf nodes represent actual measurements; the value of each internal node is the sum of all its children.
... 191.
89 mb (100.0%) -- explicit ├───63.15 mb (32.91%) -- window-objects │ ├──24.57 mb (12.
80%) -- top(http://edition.cnn.com/, id=
8) │ │ ├──20.1
8 mb (10.52%) -- active │ │ │ ├──10.57 mb (05.51%) -- window(http://edition.cnn.com/) │ │ │ │ ├───4.55 mb (02.37%) ++ js-compartment(http://edition.cnn.com/) │ │ │ │ ├───2.6...
...0 mb (01.36%) ++ layout │ │ │ │ ├───1.94 mb (01.01%) ── style-sheets │ │ │ │ └───1.4
8 mb (00.77%) -- (2 tiny) │ │ │ │ ├──1.43 mb (00.75%) ++ dom │ │ │ │ └──0.05 mb (00.02%) ── property-tables │ │ │ └───9.61 mb (05.01%) ++ (1
8 tiny) │ │ └───4.39 mb (02.29%) -- js-zone(0x7f69425b5
800) │ ├──15.75 mb (0
8.21%) ++ top(http://techcrunch.com/, id=20) │ ├──12.
85 mb (06.69%) ++ top(http://arstechnica.com/, id=14) │ ├───6.40 mb (03.33%) ++ top(chrome://browser/content/browser.xul, id=3) │ └───3.59 mb (01.
87%) ++ (4 tiny) ├───45.74 mb (23.
84%) ++ js-non-window ├───33.73 mb (17.5
8%) ── heap-unclassified ├──�...
...And 9 more matches
NSS 3.14.2 release notes
new types: in certt.h cert_pi_useonlytrustanchors in secoidt.h sec_oid_ms_ext_key_usage_ctl_signing notable changes in nss 3.14.2 bug
805604 - support for aes-ni and avx accelerated aes-gcm was contributed by shay gueron of intel.
...if so, nss uses the optimized code path, reducing the cpu cycles per byte to 1/20 of what was required before the patch (https://bugzilla.mozilla.org/show_bug.cgi?id=
805604 and https://crypto.stanford.edu/realworldcrypto/slides/gueron.pdf).
...(https://bugzilla.mozilla.org/show_bug.cgi?id=5409
86) sqlite has been updated to 3.7.15.
...And 9 more matches
NSS tools : modutil
modutil supports two types of databases: the legacy security databases (cert
8.db, key3.db, and secmod.db) and new sqlite databases (cert9.db, key4.db, and pkcs11.txt).
... --dbprefix prefix specify the prefix used on the database files, such as my_ for my_cert
8.db.
...for example: platforms { linux:5.4.0
8:x
86 { modulename { "example pkcs #11 module" } modulefile { crypto.so } defaultmechanismflags{0x0000} cipherenableflags{0x0000} files { crypto.so { path{ /tmp/crypto.so } } setup.sh { executable path{ /tmp/setup.sh } } } } linux:6.0.0:x
86 { equivalentplatform { l...
...And 9 more matches
XPCOM array guide
as of gecko
8, safeelementat() is now directly available on nstarray for arrays instantiated with pointer types.
... nsistringenumerator / nsiutf
8stringenumerator - enumerators for strings obsolete arrays / enumerators there are some deprecated classes which should not be used by new code.
...for example: var value = myarray.safeelementat(idx, defaultvalue); if (value == defaultvalue) { /* the index idx was out of bounds, or the value at that index was the default value */ } note: as of gecko
8.0, if the element type is a pointer type, you can use the safeelementat() method without providing a default value.
...And 9 more matches
Setting up the Gecko SDK
the sdk is available for windows, linux, and mac operating systems, and versions for other operating systems are being developed, and can be retrieved from as a single archive from the following platform-specific locations (need correction for last version (now 1.9.2.
8).
... there is now separate archive with gecko-sdk, just xul-runner-sdk.): linux: http://ftp.mozilla.org/pub/mozi....
8.0.4.tar.bz2 windows: http://ftp.mozilla.org/pub/mozi...vc-1.
8.0.4.zip mac: http://ftp.mozilla.org/pub/mozi...ac-1.
8.0.4.zip note that the version number for the archives above is 1.
8.
...you may want to check for newer versions at gecko versions prior to 1.7: http://ftp.mozilla.org/pub/mozi...illa/releases/ gecko versions after 1.
8: http://ftp.mozilla.org/pub/mozi...nner/releases/ once you download the sdk, you can expand it into any convenient location.
...And 9 more matches
nsIDBFolderInfo
inherits from: nsisupports last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) implemented by: ?????????????????????????????????????.
...ta); void changenummessages(in long delta); void changenumunreadmessages(in long delta); boolean getbooleanproperty(in string propertyname, in boolean defaultvalue); void getcharacterset(out acstring charset, out boolean overriden); void getcharactersetoverride(out boolean charactersetoverride); obsolete since gecko 1.
8 string getcharptrcharacterset(); string getcharptrproperty(in string propertyname); void getlocale(in nsstring result); native code only!
... obsolete since gecko 1.
8 void getmailboxname(in nsstring boxname); native code only!
...And 9 more matches
nsIIOService
implemented by @mozilla.org/network/io-service;1 as a service: var ioservice = components.classes["@mozilla.org/network/io-service;1"] .getservice(components.interfaces.nsiioservice); method overview boolean allowport(in long aport, in string ascheme); acstring extractscheme(in autf
8string urlstring); unsigned long getprotocolflags(in string ascheme); nsiprotocolhandler getprotocolhandler(in string ascheme); nsichannel newchannel(in autf
8string aspec, in string aorigincharset, in nsiuri abaseuri); obsolete since gecko 4
8 nsichannel newchannel2(in autf
8string aspec, in string aorigincharset, in nsiuri abaseuri, in nsidomnode aloadingnode, in...
... nsiprincipal aloadingprincipal, in nsiprincipal atriggeringprincipal, in uint32_t asecurityflags, in uint32_t acontentpolicytype); nsichannel newchannelfromuri(in nsiuri auri); obsolete since gecko 4
8 nsichannel newchannelfromuri2(in nsiuri auri, in nsidomnode aloadingnode, in nsiprincipal aloadingprincipal, in nsiprincipal atriggeringprincipal, in unsigned long asecurityflags, in unsigned long acontentpolicytype); nsichannel newchannelfromuriwithloadinfo(in nsiuri auri, in nsiloadinfo aloadinfo); nsichannel newchannelfromuriwithproxyflags2(in nsiuri auri, in nsiuri aproxyuri, in uint32_t aproxyflags,in nsidomnode aloadingnode, in nsiprincipal aloadingprincipal, in nsiprincipal atriggeringprincipal, in uint32_t asecurityflags, in uint32_t acontentpolicy...
...type); nsiuri newfileuri(in nsifile afile); nsiuri newuri(in autf
8string aspec, in string aorigincharset, in nsiuri abaseuri); attributes attribute type description offline boolean returns true if networking is in "offline" mode.
...And 9 more matches
nsINavHistoryResultObserver
1.0 66 introduced gecko 2.0 inherits from: nsisupports last changed in gecko 11.0 (firefox 11.0 / thunderbird 11.0 / seamonkey 2.
8) note: in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1), this interface replaced the older nsinavhistoryresultviewer interface, which only allowed one client at a time.
...pened(in nsinavhistorycontainerresultnode acontainernode); deprecated since gecko 2.0 obsolete since gecko 11.0 void containerstatechanged(in nsinavhistorycontainerresultnode acontainernode, in unsigned long aoldstate, in unsigned long anewstate); void invalidatecontainer(in nsinavhistorycontainerresultnode acontainernode); void nodeannotationchanged(in nsinavhistoryresultnode anode, in autf
8string aannoname); void nodedateaddedchanged(in nsinavhistoryresultnode anode, in prtime anewvalue); void nodehistorydetailschanged(in nsinavhistoryresultnode anode, in prtime anewvisitdate, in unsigned long anewaccesscount); void nodeiconchanged(in nsinavhistoryresultnode anode); void nodeinserted(in nsinavhistorycontainerresultnode aparent, in nsinavhistoryresultnode anode, in unsigned l...
...ong anewindex); void nodekeywordchanged(in nsinavhistoryresultnode anode, in autf
8string anewkeyword); void nodelastmodifiedchanged(in nsinavhistoryresultnode anode, in prtime anewvalue); void nodemoved(in nsinavhistoryresultnode anode, in nsinavhistorycontainerresultnode aoldparent, in unsigned long aoldindex, in nsinavhistorycontainerresultnode anewparent, in unsigned long anewindex); void noderemoved(in nsinavhistorycontainerresultnode aparent, in nsinavhistoryresultnode aitem, in unsigned long aoldindex); void nodereplaced(in nsinavhistorycontainerresultnode aparentnode, in nsinavhistoryresultnode aoldnode, in nsinavhistoryresultnode anewnode, in unsigned long aindex); void nodetagschanged(in nsinavhistoryresultnode anode); void nodetitlechanged(in nsinavhistoryresultnode ...
...And 9 more matches
Component; nsIPrefBranch
inherits from: nsisupports last changed in gecko 5
8 (firefox 5
8 / thunderbird 5
8 / seamonkey 2.55) this object is created with a "root" value which describes the base point in the preferences "tree" from which this "branch" stems.
...tring adomain, in nsiobserver aobserver, in boolean aholdweak); void clearuserpref(in string aprefname); void deletebranch(in string astartingat); boolean getboolpref(in string aprefname, requires gecko 54 [optional] in boolean adefaultvalue); string getcharpref(in string aprefname,requires gecko 54 [optional] in string adefaultvalue); requires gecko 5
8 utf
8tring getstringpref(in string aprefname, [optional] in utf
8string adefaultvalue); void getchildlist(in string astartingat, [optional] out unsigned long acount, [array, size_is(acount), retval] out string achildarray); void getcomplexvalue(in string aprefname, in nsiidref atype, [iid_is(atype), retval] out nsqiresult avalue); long getintpref(in string aprefname,requi...
...prefname); boolean prefhasuservalue(in string aprefname); boolean prefislocked(in string aprefname); void removeobserver(in string adomain, in nsiobserver aobserver); void resetbranch(in string astartingat); void setboolpref(in string aprefname, in long avalue); void setcharpref(in string aprefname, in string avalue); requires gecko 5
8 void setstringpref(in string aprefname, in utf
8string avalue); void setcomplexvalue(in string aprefname, in nsiidref atype, in nsisupports avalue); void setintpref(in string aprefname, in long avalue); void unlockpref(in string aprefname); attributes attribute type description root string called to get the root on which this branch ...
...And 9 more matches
Working with ArrayBuffers
the js-ctypes equivalent is a ctypes.uint
8_t.array(###) (ctypes.unsigned_char are also ctypes.uint
8_t).
... this feature is based on the following work: //github.com/realityripple/uxp/blob/master/js/src/ctypes/ctypes.cpp#30
80 //github.com/realityripple/uxp/blob/master/js/src/vm/arraybufferobject.cpp#1301 example 1 - image data the following example illustrates how to transfer a byte array pointed by ctypes.uint
8_t.ptr to imagedata of canvas.
... this example is based on the fact that the imagedata returned from canvasrenderingcontext2d.getimagedata is a uint
8clampedarray view for an arraybuffer.
...And 9 more matches
<color> - CSS: Cascading Style Sheets
specification keyword rgb hex value live keyword css level 1 black #000000 silver #c0c0c0 gray #
80
80
80 white #ffffff maroon #
800000 red #ff0000 purple #
8000
80 fuchsia #ff00ff green #00
8000 lime #00ff00 olive #
80
8000 yellow #ffff00 navy #0000
80 blue #0000ff teal #00
80
80 aqua #00ffff ...
... css level 2 (revision 1) orange #ffa500 css color module level 3 aliceblue #f0f
8ff antiquewhite #faebd7 aquamarine #7fffd4 azure #f0ffff beige #f5f5dc bisque #ffe4c4 blanchedalmond #ffebcd blueviolet #
8a2be2 brown #a52a2a burlywood #deb
887 cadetblue #5f9ea0 chartreuse #7fff00 chocolate #d2691e coral #ff7f50 cornflowerblue #6495ed cornsilk #fff
8dc crimson #dc143c cyan (synonym of aqua) #00ffff darkblue #0000
8b darkcyan #00
8b
8b darkgoldenrod #...
...b
8860b darkgray #a9a9a9 darkgreen #006400 darkgrey #a9a9a9 darkkhaki #bdb76b darkmagenta #
8b00
8b darkolivegreen #556b2f darkorange #ff
8c00 darkorchid #9932cc darkred #
8b0000 darksalmon #e9967a darkseagreen #
8fbc
8f darkslateblue #4
83d
8b darkslategray #2f4f4f darkslategrey #2f4f4f darkturquoise #00ced1 darkviolet #9400d3 deeppink #ff1493 deepskyblue #00bfff dimgray #696969 dimgrey #696969 dodgerblue #1e90ff firebrick #b22222 floralwhi...
...And 9 more matches
Rich-Text Editing in Mozilla - Developer guides
--fumble 1
8:13, 24 apr 2005 (pdt) example 1 the first example is an html document setting its own designmode to "on".
...y onload=\"print();\">" + odoc.innerhtml + "<\/body><\/html>"); oprntwin.document.close(); } </script> <style type="text/css"> .intlink { cursor: pointer; } img.intlink { 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: 49
8px; min-height: 200px; } #editmode label { cursor: pointer; } </style> </head> <body onload="initdoc();"> <form name="compform" method="post" action="sample.php" onsubmit="if(validatemode()){this.mydoc.value=odoc.innerhtml;return true;}return false;"> <input type="hidden" name="mydoc"> <div id="toolbar1"> <select onchange="formatdoc('formatblock',this[this.selectedindex].value);this.selectedinde...
...n value="red">red</option> <option value="green">green</option> <option value="black">black</option> </select> </div> <div id="toolbar2"> <img class="intlink" title="clean" onclick="if(validatemode()&&confirm('are you sure?')){odoc.innerhtml=sdeftxt};" src="data:image/gif;base64,r0lgodlhfgawaiqbad04ktrlyzfrjlldzl9vj1dusy14wyodhpwibbsvfy6o7ioxw5qbms+wubcztca0ccs4kddqjdtltmrl1o3yitha7opcsd/f4pfvrvdv
8pv5xv///////////////////yh5baekab
8alaaaaaawabyaaav
84ceozgmeakqubmteyzk547qobcfwtm/jgshq4rhmloxfiehqqsawr+z4iayaj0kegtfolizlwre4ocqwrxototaihmcz0tvgmbqkzhayyfewev14eq
8iflhnehmfdqkaiskqci2pdc4qbg+oajc0ewadncogo6anqkkoiqa7" /> <img class="intlink" title="print" onclick="printdoc();" src="data:image/png;base64,ivborw0kggoaaaansuheugaaabyaaaawcayaaadetgw7aaaabgdbtueaalgpc/xhbqaaaazis0deap
8a/wd/ol2nkwaa...
...And 9 more matches
requiredFeatures - SVG: Scalable Vector Graphics
.org/tr/svg11/feature#svg-static --> <rect class="ko" x="10" y="60" height="25" width="430" /> <rect class="ok" x="10" y="60" height="25" width="430" requiredfeatures="http://www.w3.org/tr/svg11/feature#svg-static" /> <text x="20" y="77">http://www.w3.org/tr/svg11/feature#svg-static</text> <!-- testing : http://www.w3.org/tr/svg11/feature#svgdom-static --> <rect class="ko" x="10" y="
85" height="25" width="430" /> <rect class="ok" x="10" y="
85" height="25" width="430" requiredfeatures="http://www.w3.org/tr/svg11/feature#svgdom-static" /> <text x="20" y="102">http://www.w3.org/tr/svg11/feature#svgdom-static</text> <!-- testing : http://www.w3.org/tr/svg11/feature#svg-animation --> <rect class="ko" x="10" y="110" height="25" width="430" /> <rect class="ok" x="10" y=...
...svg11/feature#svg-dynamic --> <rect class="ko" x="10" y="160" height="25" width="430" /> <rect class="ok" x="10" y="160" height="25" width="430" requiredfeatures="http://www.w3.org/tr/svg11/feature#svg-dynamic" /> <text x="20" y="177">http://www.w3.org/tr/svg11/feature#svg-dynamic</text> <!-- testing : http://www.w3.org/tr/svg11/feature#svgdom-dynamic --> <rect class="ko" x="10" y="1
85" height="25" width="430" /> <rect class="ok" x="10" y="1
85" height="25" width="430" requiredfeatures="http://www.w3.org/tr/svg11/feature#svgdom-dynamic" /> <text x="20" y="202">http://www.w3.org/tr/svg11/feature#svgdom-dynamic</text> <!-- testing : http://www.w3.org/tr/svg11/feature#coreattribute --> <rect class="ko" x="10" y="210" height="25" width="430" /> <rect class="ok" x="10"...
...#basicstructure --> <rect class="ko" x="10" y="260" height="25" width="430" /> <rect class="ok" x="10" y="260" height="25" width="430" requiredfeatures="http://www.w3.org/tr/svg11/feature#basicstructure" /> <text x="20" y="277">http://www.w3.org/tr/svg11/feature#basicstructure</text> <!-- testing : http://www.w3.org/tr/svg11/feature#containerattribute --> <rect class="ko" x="10" y="2
85" height="25" width="430" /> <rect class="ok" x="10" y="2
85" height="25" width="430" requiredfeatures="http://www.w3.org/tr/svg11/feature#containerattribute" /> <text x="20" y="302">http://www.w3.org/tr/svg11/feature#containerattribute</text> <!-- testing : http://www.w3.org/tr/svg11/feature#conditionalprocessing --> <rect class="ko" x="10" y="310" height="25" width="430" /> <rect c...
...And 9 more matches
LIR - Archive of obsolete content
5 allocp pointer allocate stack space (result is an address) 6 reti void return an int 7 retq void 64 bit return a quad
8 retd void return a double 9 livei void extend live range of an int 10 liveq void 64 bit extend live range of a quad 11 lived void extend live range of a double 12 file void source filename for debug symbols 13 line void source line number for debug symbols 14 comment void a comment shown, on its own line, ...
...in lir dumps 15 not in use load 16 not in use 17 ldc2i integer load char and sign-extend to an int 1
8 lds2i integer load short and sign-extend to an int 19 lduc2ui integer load unsigned char and zero-extend to an unsigned int 20 ldus2ui integer load unsigned short and zero-extend to an unsigned int 21 ldi integer load int 22 ldq quad 64 bit load quad 23 ldd double load double 24 ldf2d double load float and extend to a double store 25 sti2c void store int truncated to char 26 sti2s void store int truncated to short 27 sti void store int 2
8 stq void 64 bit store quad 29 std void ...
...g precision) 31 not in use call 32 not in use 33 callv void call subroutine that returns void 34 calli integer call subroutine that returns an int 35 callq quad 64 bit call subroutine that returns a quad 36 calld double call subroutine that returns a double branch 37 j void jump always 3
8 jt void jump if true 39 jf void jump if false 40 jtbl void jump to address in table 41 label void a jump target (no machine code is emitted for this) 42 not in use guards 43 x void exit always 44 xt void exit if true 45 xf void exit if false 46 xtbl void exit via indirec...
...And 8 more matches
Table Layout Regression Tests - Archive of obsolete content
ility data="0 1 1.000000" /> <table data="0 0 4 -1 1 " /> <tableborder data="1 null null 0 2 " /> <content data="0 0 0 null " /> <quotes data="0 " /> <ui data="3 0 0 1 " /> <uireset data="7 0 4" /> <xul data="0 0 0 0 0 1 <svg data="0 1.000000 1.000000 0 1.000000" /> </stylecontext> the baseline log will look like: type manifest file: e:\moz_src\mozilla\obj-i5
86-pc-msvc\dist\bin\components\xpti.dat +++ javascript debugging hooks installed.
...a typical part of the verify log would look like: type manifest file: e:\moz_src\mozilla\obj-i5
86-pc-msvc\dist\bin\components\xpti.dat +++ javascript debugging hooks installed.
...writing regression data to e:\moz_src\mozilla\layout\html\tests\table\core\verify\standards1.rgd comparing to regression data from e:\moz_src\mozilla\layout\html\tests\table\core\baseline\standards1.rgd frame bbox mismatch: 0,26437,4
824,600 vs.
...And 8 more matches
Starting our Svelte Todo list app - Learn web development
repl to code along with us using the repl, start at https://svelte.dev/repl/b7b
831ea3a354d37
89cefbc31e2ca495?version=3.23.2 todo list app features this is how our todo list app wil look like once it's ready: using this ui our user will be able to: browse their tasks.
... for example, if we add an <img> element to our todos.svelte component without its corresponding alt prop: <h1>svelte to-do list</h1> <img height="32" width="
88" src="https://udn.realityripple.com/samples/b0/9
8dase3c7d.png"> the compiler will issue the following warning: (!) plugin svelte: a11y: <img> element should have an alt attribute src/components/todos.svelte 1: <h1>svelte to-do list</h1> 2: 3: <img height="32" width="
88" src="https://udn.realityripple.com/samples/b0/9
8dase3c7d.png"> ^ created public/build/bundle.js in 220ms [2020-07-15 04:...
... moreover, our editor can display this warning even before calling the compiler: you can tell svelte to ignore this warning for the next block of markup with a comment beginning with svelte-ignore, like this: <!-- svelte-ignore a11y-missing-attribute --> <img height="32" width="
88" src="https://udn.realityripple.com/samples/b0/9
8dase3c7d.png"> note: with vscode you can automatically add this ignore comment by clicking on the quick fix...
...And 8 more matches
Linux compatibility matrix
distribution kernel glibc glib gtk+2 gtk+3 pixman stdc++ gcc clang python3 released eol fedora 16 3.1 2.14 2.30 2.24 3.2 0.22 4.6 4.6 2.9 n/a nov 2011 feb 2013 fedora 17 3.3 2.15 2.32 2.24 3.4 0.24 4.7 4.7 3.0 n/a may 2012 jul 2013 fedora 1
8 3.6 2.16 2.34 2.24 3.6 0.26 4.7 4.7 3.1 n/a jan 2013 jan 2014 fedora 19 3.9 2.17 2.36 2.24 3.
8 0.30 4.
8.1 4.
8 3.3 n/a jul 2013 jan 2015 fedora 20 3.11 2.1
8 2.3
8 2.24 3.10 0.30 4.
8.2 4.
8 3.3 n/a dec 2013 jun 2015 fedora 21 3.17 2.20 2.42 2.24 3.14 ...
... 0.32 4.9 4.9 3.4 n/a dec 2014 dec 2015 fedora 22 4.0 2.21 2.44 2.24 3.16 0.32 5.1 4.9, 5.1 3.5 n/a may 2015 jul 2016 fedora 23 4.2 2.22 2.46 2.24 3.1
8 0.33 5.1 5.1 3.7 n/a nov 2015 dec 2016 fedora 24 4.5 2.23 2.4
8 2.24 3.20 0.34 6.1 6.1 3.
8 n/a jun 2016 aug 2017 fedora 25 4.
8 2.24 2.50 2.24 3.22.2 0.34 6.2 6.2 3.
8 n/a nov 2016 dec 2017 fedora 26 4.11 2.25 2.52 2.24 3.22.16 0.34 7.1 7.1 4.0 n/a jul 2017 jun 201
8 fedora 27 4.13 2.26 2.54 2.24 3.22.24 0.34 7.2 7.2 4.0 n/a nov 2017 dec 201
8 fedora 2
8 ...
... 4.16 2.27 2.56 2.24 3.22.30 0.34
8.0.1
8.0.1 6.0 n/a may 201
8 may 2019 fedora 29 4.1
8 2.2
8 2.5
8 2.24 3.24.1 0.34
8.2.1
8.2.1 7.0 3.7 oct 201
8 nov 2019 fedora 30 5.0 2.29 2.60 2.24 3.24.
8 0.34 9.0.1 9.0.1
8.0 3.7 apr 2019 ?
...And 8 more matches
NSS tools : modutil
please contribute to the initial review in mozilla nss bug
836477[1] description the security module database tool, modutil, is a command-line utility for managing pkcs #11 module information both within secmod.db files and within hardware tokens.
... modutil supports two types of databases: the legacy security databases (cert
8.db, key3.db, and secmod.db) and new sqlite databases (cert9.db, key4.db, and pkcs11.txt).
... --dbprefix prefix specify the prefix used on the database files, such as my_ for my_cert
8.db.
...And 8 more matches
SpiderMonkey Build Documentation
when building a version older than 2
8, you'll additionally need nspr.
... to generate a compile_commands.json with the spidermonkey configure script, enable the compiledb backend, like this: /bin/sh ../configure.in <options> --enable-build-backends=compiledb,recursivemake (recursivemake is there as you'd likely also want to be able to build!) windows builds since version 2
8, threadsafe builds are the default, and should work out of the box on all posix platforms.
...to create a 64-bit build, note that you must configure with --target=x
86_64-pc-mingw32 --host=x
86_64-pc-mingw32.
...And 8 more matches
JS::PersistentRooted
syntax js::persistentrooted<t> var; // added in spidermonkey 3
8 js::persistentrooted<t> var(cx); js::persistentrooted<t> var(cx, initial); js::persistentrooted<t> var(rt); js::persistentrooted<t> var(rt, initial); name type description cx jscontext * the context to get the runtime in which to add the root rt jsruntime * the runtime in which to add the root.
...added in spidermonkey 3
8 void init(jscontext* cx, t initial) void init(jsruntime* rt) void init(jsruntime* rt, t initial) void reset() reset the value to initial value of the type.
... added in spidermonkey 3
8 t& get() returns ptr.
...And 8 more matches
nsIAccessibleStates
state_pressed 0x0000000
8 the object is pressed.
... state_hottracked 0x000000
80 the object is hot-tracked by the mouse, which means that its appearance has changed to indicate that the mouse pointer is located over it.
... state_busy 0x00000
800 the control cannot accept input at this time.
...And 8 more matches
nsIURL
-service;1"] .getservice(components.interfaces.nsiioservice) .newuri("http://developer.mozilla.org", null, null); try { var myurl = myuri.queryinterface(components.interfaces.nsiurl); } catch(e) { // the uri is not an url } or using instanceof: if (myuri instanceof components.interfaces.nsiurl) { // your code here } method overview autf
8string getcommonbasespec(in nsiuri auritocompare); autf
8string getrelativespec(in nsiuri auritocompare); attributes attribute type description directory autf
8string directory portion of a url.
... filebasename autf
8string file basename portion of a filename in a url.
... fileextension autf
8string file extension portion of a filename in a url.
...And 8 more matches
WebIDL bindings
webidl type argument type return type dictionary/member type any js::handle<js::value> js::mutablehandle<js::value> js::value boolean bool bool bool byte int
8_t int
8_t int
8_t bytestring const nsacstring& nscstring& (outparam) nsacstring& (outparam) nscstring date mozilla::dom::date domstring const nsastring& mozilla::dom::domstring& (outparam) nsastring& (outparam) nsstring& (outparam) nsstring utf
8string const nsacstring& nsacstring& (outparam) nscstring ...
... interface: non-nullable foo& already_addrefed<foo> foo* owningnonnull<foo> interface: nullable foo* already_addrefed<foo> foo* refptr<foo> long int32_t int32_t int32_t long long int64_t int64_t int64_t object js::handle<jsobject*> js::mutablehandle<jsobject*> jsobject* octet uint
8_t uint
8_t uint
8_t sequence const sequence<t>& nstarray<t>& (outparam) short int16_t int16_t int16_t unrestricted double double double double unrestricted float float float float unsigned long uint32_t uint32_t uint32_t unsigned long long uint64_t uint64_t uint64_t unsigned s...
... utf
8string utf
8string is a string with guaranteed-valid utf-
8 contents.
...And 8 more matches
Migrating from Firebug - Firefox Developer Tools
the devtools do not have a side panel like the command editor (which is requested in bug 1133
849), but therefore has a separate tool called scratchpad, which can be added as panel to the toolbox or opened in a separate window via firefox menu > developer > scratchpad or shift + f4.
...only the live preview of changes is currently missing, which is tracked in bug 106731
8 and bug
815464.
...this is covered by bug 9
87
877.
...And 8 more matches
NavigationPreloadManager - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetnavigationpreloadmanager experimentalchrome full support 62edge full support 1
8firefox no support nonotes no support nonotes notes implementation tracked in bug 129095
8ie ?
... webview android full support 62chrome android full support 62firefox android no support nonotes no support nonotes notes implementation tracked in bug 129095
8opera android full support 46safari ios ?
... samsung internet android full support
8.0disable experimentalchrome full support 62edge full support 1
8firefox no support nonotes no support nonotes notes implementation tracked in bug 129095
8ie ?
...And 8 more matches
Box-shadow generator - CSS: Cascading Style Sheets
e] width height top left z-index background-color box-shadow transform -webkit-transform -ms-transform"> </div> </div> </div> </div> </div> </div> css content /* grid of twelve * ========================================================================== */ .span_12 { width: 100%; } .span_11 { width: 91.46%; } .span_10 { width:
83%; } .span_9 { width: 74.54%; } .span_
8 { width: 66.0
8%; } .span_7 { width: 57.62%; } .span_6 { width: 49.16%; } .span_5 { width: 40.7%; } .span_4 { width: 32.24%; } .span_3 { width: 23.7
8%; } .span_2 { width: 15.32%; } .span_1 { width: 6.
86%; } /* sections * ========================================================================== */ .section { clear: both; padding: 0px...
...ext-align: center; font-size: 16px; font-family: "segoe ui", arial, helvetica, sans-serif; line-height: 1.5em; color: #fff; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .ui-checkbox > input { display: none; } .ui-checkbox > label { font-size: 12px; padding: 0.333em 1.666em 0.5em; height: 1em; line-height: 1em; background-color: #
888; background-image: url("https://mdn.mozillademos.org/files/56
83/disabled.png"); background-position: center center; background-repeat: no-repeat; color: #fff; border-radius: 3px; font-weight: bold; float: left; } .ui-checkbox .text { padding-left: 34px; background-position: center left 10px; } .ui-checkbox .left { padding-right: 34px; padding-left: 1.666em; background-position: c...
...enter right 10px; } .ui-checkbox > label:hover { cursor: pointer; } .ui-checkbox > input:checked + label { background-image: url("https://mdn.mozillademos.org/files/56
81/checked.png"); background-color: #379b4a; } /* * box shadow generator tool */ body { max-width: 1000px; height:
800px; margin: 20px auto 0; font-family: "segoe ui", arial, helvetica, sans-serif; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; } #container { width: 100%; padding: 2px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } /* container with shadows stacks */ #stack_container { height: 400px; overflow: hidden; position: relative; borde...
...And 8 more matches
Auto-placement in CSS Grid Layout - CSS: Cascading Style Sheets
* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 10px; } <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> </div> default rules for auto-placement as you can see with the above example, if you create a grid all child items will lay themselves out one i...
...to cause all created rows to be 100 pixels tall for example you would use: * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> </div> .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 10px; grid-auto-rows: 100px; } you can use minmax() in your value for grid-auto-rows enabling the creation of rows that are a minimum s...
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four <br>this cell <br>has extra <br>content.
...And 8 more matches
Date and time formats used in HTML - HTML: Hypertext Markup Language
example html date and time strings string date and/or time 2005-06-07 june 7, 2005 [details] 0
8:45
8:45 am [details] 0
8:45:25
8:45 am and 25 seconds [details] 0033-0
8-04t03:40 3:40 am on august 4, 33 [details] 1977-04-01t14:00:30 30 seconds after 2:00 pm on april 1, 1977 [details] 1901-01-01t00:00z midnight utc on january 1, 1901 [details] 1901-01-01t00:00:01-04:00 1 second past midnight eastern standard time (est...
...html uses a variation of the iso
8601 standard for its date and time strings.
... it's worth reviewing the descriptions of the formats you're using in order to ensure that your strings are in fact compatible with html, as the html specification includes algorithms for parsing these strings that is actually more precise than iso
8601, so there can be subtle differences in how date and time strings are expected to look.
...And 8 more matches
Creating a Microsummary - Archive of obsolete content
to begin building the generator, create a new empty text file and add an xml declaration and empty <generator> tag to it: <?xml version="1.0" encoding="utf-
8"?> <generator xmlns="http://www.mozilla.org/microsummaries/0.1"> </generator> giving it a name generators should have name attributes which are arbitrary descriptions of the microsummaries the generator creates.
...since our generator will be creating microsummaries displaying the firefox download count, let's give it the name "firefox download count": <?xml version="1.0" encoding="utf-
8"?> <generator xmlns="http://www.mozilla.org/microsummaries/0.1" name="firefox download count"> </generator> adding an xslt transform sheet generators must include an xslt transform sheet (also known as an xslt stylesheet) which transforms the page content into its microsummary.
... add the xslt transform sheet to the generator by including it within a <template> element: <?xml version="1.0" encoding="utf-
8"?> <generator xmlns="http://www.mozilla.org/microsummaries/0.1" name="firefox download count"> <template> <transform xmlns="http://www.w3.org/1999/xsl/transform" version="1.0"> </transform> </template> </generator> note that while microsummary generators can include arbitrary xslt, including xslt that produces rich text output, firefox currently only displays the text version of the xslt output.
...And 7 more matches
New Skin Notes - Archive of obsolete content
--nickolay 10:3
8, 31 aug 2005 (pdt) existing fixes should be on test/docs/ now.
... edit page textarea needs to 'scale' better with page width (so large whitespace area's are non-existant), suggest min-width:some-em-size; width:
88%; and max-width set to 95% or something like that.
...--maian 21:0
8, 1 sep 2005 (pdt) in the new mw1.5 skin (not the one currently available here) there's class "wrong" and class "wrong-inline".
...And 7 more matches
Writing to Files - Archive of obsolete content
the default character set is 'utf-
8' but this can be changed using an additional, yet optional, argument to the newoutputstream method.
...writing text files characters are written to a text input stream using a specified character encoding, which defaults to utf-
8.
... this means that a single character will occupy several bytes if it has a value greater than 12
8.
...And 7 more matches
Custom toolbar button - Archive of obsolete content
if your language uses accents or other non-latin characters, set your text editor to save files using the utf-
8 encoding.
... from firefox's menu bar, choose view – character encoding – unicode (utf-
8).
... if your text editor does not support utf-
8, search the internet for a better one that you can download.
...And 7 more matches
Mozilla release FAQ - Archive of obsolete content
the source to mozilla was first released on 31 march 199
8.
... the code has been continually available since then via cvs (see section 1.
8), and occasional binary releases (first as milestones, and more recently as versioned releases) have been made.
...this list will be updated with time, but (according to netscape.public.mozilla.general) the following platforms have been built successfully: solaris 2.4, 2.5, 2.6 freebsd 2.2, 3.0 linux/intel and alpha 2.0, 2.1 macos winnt 4.0 irix 5.3, 6.2, 6.3, 6.4 win95, win9
8 digital unix 4.0 netbsd openbsd bsdi hp/ux 9.05, 10.20, 11.0 (see 2.7) hurd .03 dg/ux mac os x i'm *still* having problems getting mozilla to build on my platform!
...And 7 more matches
Introduction to Public-Key Cryptography - Archive of obsolete content
contents of a certificate the contents of certificates are organized according to the x.509 v3 certificate specification, which has been recommended by the international telecommunications union (itu), an international standards body, since 19
88.
...for comprehensive information about dns, see a string representation of distinguished names] at the following url: https://www.ietf.org/rfc/rfc14
85.txt a typical certificate every x.509 certificate consists of two sections: the data section includes the following information: the version number of the x.509 standard supported by the certificate.
... here are the data and signature sections of a certificate in human-readable format: certificate: data: version: v3 (0x2) serial number: 3 (0x3) signature algorithm: pkcs #1 md5 with rsa encryption issuer: ou=ace certificate authority, o=ace industry, c=us validity: not before: fri oct 17 1
8:36:25 1997 not after: sun oct 17 1
8:36:25 1999 subject: cn=jane doe, ou=finance, o=ace industry, c=us subject public key info: algorithm: pkcs #1 rsa encryption public key: modulus: 00:ca:fa:79:9
8:
8f:19:f
8:d7:de:e4:49:
80:4
8:e6:2a:2a:
86: ed:27:40:4d:
86:b3:05:c0:01:bb:50:15:c9:de:dc:
85:19:22: 43:7d:45:6d:71:4e:17:3d:f0:36:4b:5b:7f:a
8:51:a3:a1:00: 9
8:ce:7f:47:50:2c:93:36:...
...And 7 more matches
background-size - Archive of obsolete content
are based on webkit, like netscape 6-
8, seamonkey, camino, flock, fennec, blackbird etc.
...[that said, the popularity of chrome let me think of a table row like safari, chrome (webkit) | 4.0, 2.0 (52
8).
...user:jürgen jeka 2009-0
8-04 <hr> is there anyway to have the -moz-border-image only apply if -moz-background-size is not supported?
...And 7 more matches
Floats - Learn web development
.special { background-color: rgb(79,1
85,227); padding: 10px; color: #fff; } to make the effect easier to see, change the margin-right on your float to margin, so you get space all around the float.
...cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p> body { width: 90%; max-width: 900px; margin: 0 auto; font: .9em/1.2 arial, helvetica, sans-serif } .box { float: left; margin: 15px; width: 150px; height: 150px; border-radius: 5px; background-color: rgb(207,232,220); padding: 1em; } .special { background-color: rgb(79,1
85,227); padding: 10px; color: #fff; } the line boxes of our following element have been shortened so the text runs around the float, but due to the float being removed from normal flow the box around the paragraph still remains full width.
...cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p> body { width: 90%; max-width: 900px; margin: 0 auto; font: .9em/1.2 arial, helvetica, sans-serif } .box { float: left; margin: 15px; width: 150px; height: 150px; border-radius: 5px; background-color: rgb(207,232,220); padding: 1em; } .special { background-color: rgb(79,1
85,227); padding: 10px; color: #fff; } .cleared { clear: left; } you should see that the following paragraph clears the floated element and no longer comes up alongside it.
...And 7 more matches
What’s in the head? Metadata in HTML - Learn web development
let's revisit the simple html document we covered in the previous article: <!doctype html> <html> <head> <meta charset="utf-
8"> <title>my test page</title> </head> <body> <p>this is my page</p> </body> </html> the html head is the contents of the <head> element — unlike the contents of the <body> element (which are displayed on the page when loaded in a browser), the head's content is not displayed on the page.
...in the above example, the head is quite small: <head> <meta charset="utf-
8"> <title>my test page</title> </head> in larger pages however, the head can get quite full.
... specifying your document's character encoding in the example we saw above, this line was included: <meta charset="utf-
8"> this element simply specifies the document's character encoding — the character set that the document is permitted to use.
...And 7 more matches
Chrome registration
bug resolved in mozilla 1.9; see bug 1321
83.
... note: there was a bug in gecko 1.
8.1.5 (firefox 2.0.0.5) and earlier where you could not use a relative url for the new-resolved-uri parameter.
... this example shows how a different overlay can be used for different applications: overlay chrome://browser/content/browser.xul chrome://myaddon/content/ffoverlay.xul application={ec
8030f7-c20a-464f-9b0e-13a3a9e973
84} overlay chrome://messenger/content/mailwindowoverlay.xul chrome://myaddon/content/tboverlay.xul application={3550f703-e5
82-4d05-9a0
8-453d09bdfdc6} overlay chrome://songbird/content/xul/layoutbaseoverlay.xul chrome://myaddon/content/sboverlay.xul application=songbird@songbirdnest.com appversion extensions may install into multiple versions of an application.
...And 7 more matches
Command line options
firefox -new-instance -p "another profile" note: not available for windows, see bug
855
899.
...instances created with this parameter do not accept or send remote commands, see bug 65007
8.
...does not work in firefox 31 on linux mint 17 nor on firefox 4
8 on windows 7.
...And 7 more matches
Investigating leaks using DMD heap scan mode
the result of that grep will contain output that looks something like this: cc-edges.15
873.log:0x7f0
8970
82c00 [rc=12
85] nsglobalwindowinner # 21474
83662 inner https://www.example.com/ * cc-edges.15
873.log: the first part is the file name where it was found.
... 15
873 is the pid of the process that leaked.
... * 0x7f0
8970
82c00: this is the address of the leaking window.
...And 7 more matches
NSS 3.15.1 release notes
hmac-sha256 cipher suites (rfc 5246 and rfc 52
89) are supported, allowing tls to be used without md5 and sha-1.
... tls_dhe_rsa_with_aes_256_cbc_sha256, tls_rsa_with_aes_256_cbc_sha256, tls_ecdhe_ecdsa_with_aes_12
8_cbc_sha256, tls_ecdhe_rsa_with_aes_12
8_cbc_sha256, tls_dhe_rsa_with_aes_12
8_cbc_sha256, tls_rsa_with_aes_12
8_cbc_sha256, tls_rsa_with_null_sha256 - new tls 1.2 only hmac-sha256 cipher suites.
...notable changes in nss 3.15.1 bug
856060 - enforce name constraints on the common name in libpkix when no subjectaltname is present.
...And 7 more matches
nsIBinaryOutputStream
inherits from: nsioutputstream last changed in gecko 1.7 method overview void setoutputstream(in nsioutputstream aoutputstream); void write
8(in pruint
8 abyte); void write16(in pruint16 a16); void write32(in pruint32 a32); void write64(in pruint64 a64); void writeboolean(in prbool aboolean); void writebytearray([array, size_is(alength)] in pruint
8 abytes, in pruint32 alength); void writebytes(alength)] in string astring, in pruint32 alength); void writedouble(in double adouble); void writefloat(in float afloat); void ...
...writestringz(in string astring); void writeutf
8z(in wstring astring); void writewstringz(in wstring astring); methods setoutputstream() sets the stream to which output is directed.
... write
8() writes an
8-bit integer to the stream.
...And 7 more matches
Capabilities, constraints, and settings - Web APIs
for example: let constraints = { width: 1920, height: 10
80, aspectratio: 1.77777777
8 }; mytrack.applyconstraints(constraints); in this case, the constraints indicate that any values are fine for nearly all properties, but that a standard high definition (hd) video size is desired, with the standard 16:9 aspect ratio.
...as an example, if the browser running the code above couldn't provide a 1920x10
80 track but could do 1920x900, then that's what would be provided.
...} else { let constraints = { width: { min: 640, ideal: 1920, max: 1920 }, height: { min: 400, ideal: 10
80 }, aspectratio: 1.77777777
8, framerate: { max: 30 }, facingmode: { exact: "user" } }; mytrack.applyconstraints(constraints).then(function() => { /* do stuff if constraints applied successfully */ }).catch(function(reason) { /* failed to apply constraints; reason is why */ }); } here, after ensuring that the constrainable properties for which matches must be found a...
...And 7 more matches
SubtleCrypto.wrapKey() - Web APIs
pkcs
8: pkcs #
8 format.
...*/ async function wrapcryptokey(keytowrap) { // get the key encryption key const keymaterial = await getkeymaterial(); salt = window.crypto.getrandomvalues(new uint
8array(16)); const wrappingkey = await getkey(keymaterial, salt); return window.crypto.subtle.wrapkey( "raw", keytowrap, wrappingkey, "aes-kw" ); } /* generate an encrypt/decrypt secret key, then wrap it.
... */ window.crypto.subtle.generatekey( { name: "aes-gcm", length: 256, }, true, ["encrypt", "decrypt"] ) .then((secretkey) => { return wrapcryptokey(secretkey); }) .then((wrappedkey) => { console.log(wrappedkey); }); pkcs #
8 wrap this example wraps an rsa private signing key.
...And 7 more matches
Using XMLHttpRequest - Web APIs
method: post; encoding type: multipart/form-data: content-type: multipart/form-data; boundary=---------------------------3149117
88813
839 -----------------------------3149117
88813
839 content-disposition: form-data; name="foo" bar -----------------------------3149117
88813
839 content-disposition: form-data; name="baz" the first line.
... -----------------------------3149117
88813
839-- however, if you are using the get method, a string like the following will be simply added to the url: ?foo=bar&baz=the%20first%20line.%0athe%20second%20line.
...for this reason, here we place a complete (yet didactic) framework, able to use all four ways to submit, and to upload files: <!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-
8" /> <title>sending forms with pure ajax – mdn</title> <script type="text/javascript"> "use strict"; /*\ |*| |*| :: xmlhttprequest.prototype.sendasbinary() polyfill :: |*| |*| https://developer.mozilla.org/docs/dom/xmlhttprequest#sendasbinary() \*/ if (!xmlhttprequest.prototype.sendasbinary) { xmlhttprequest.prototype.sendasbinary = function(sdata) { var nbytes = sdata.length, ui
8...
...And 7 more matches
:is() (:matches(), :any()) - CSS: Cascading Style Sheets
note: :matches() was renamed to :is() in csswg issue #325
8.
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internet:is()chrome full support 6
8notes disabled full support 6
8notes disabled notes combinators in the selector list argument may not match correctly (see bug
842157).disabled from version 6
8: this feature is behind the #enable-experimental-web-platform-features preference (needs to be set to enabled).
... no support 66 — 71notes alternate name disabled notes combinators in the selector list argument may not match correctly (see bug
842157).alternate name uses the non-standard name: :matches()disabled from version 66 until version 71 (exclusive): this feature is behind the #enable-experimental-web-platform-features preference (needs to be set to enabled).
...And 7 more matches
Basic Concepts of grid layout - CSS: Cascading Style Sheets
.wrapper { display: grid; } * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } all the direct children are now grid items.
...wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> </div> .wrapper { display: grid; grid-template-columns: 200px 200px 200px; } * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } the fr unit tracks can be defined using any length unit.
...lass="wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> </div> .wrapper { display: grid; grid-template-columns: 1fr 1fr 1fr; } * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } in this next example, we create a definition with a 2fr track then two 1fr tracks.
...And 7 more matches
Relationship of grid layout to other layout methods - CSS: Cascading Style Sheets
* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> </div> .wrapper { width: 500px; display: flex; flex-wrap: wrap; } .wrapper > div { flex: 1 1 150px; } in the image, you can see that two items have wrapped onto a new line.
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> </div> .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); } a simple question to ask yourself when deciding between grid or flexbox is: do i only need to control the layout by row or column – use a flexbox do i need...
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } <div class="wrapper"> <div class="box1">one</div> <div class="box2">two</div> <div class="box3">three</div> </div> .wrapper { display: flex; align-items: flex-end; min-height: 200px; } .box1 { align-self: stretch; } .box2 { align-self: flex-start; } alignment in css grids this second example uses a grid to create the same layout.
...And 7 more matches
position - CSS: Cascading Style Sheets
mdn understanding wcag, guideline 1.4 explanations visual presentation: understanding sc 1.4.
8 | understanding wcag 2.0 performance & accessibility scrolling elements containing fixed or sticky content can cause performance and accessibility issues.
...in the example below, box "one" is fixed at
80 pixels from the top of the page and 10 pixels from the left.
... </p> <div class="box" id="one">one</div> </div> css .box { width: 100px; height: 100px; background: red; color: white; } #one { position: fixed; top:
80px; left: 10px; background: blue; } .outer { width: 500px; height: 300px; overflow: scroll; padding-left: 150px; } result sticky positioning sticky positioning can be thought of as a hybrid of relative and fixed positioning.
...And 7 more matches
Making content editable - Developer guides
y onload=\"print();\">" + odoc.innerhtml + "<\/body><\/html>"); oprntwin.document.close(); } </script> <style type="text/css"> .intlink { cursor: pointer; } img.intlink { 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: 49
8px; min-height: 200px; } #editmode label { cursor: pointer; } </style> </head> <body onload="initdoc();"> <form name="compform" method="post" action="sample.php" onsubmit="if(validatemode()){this.mydoc.value=odoc.innerhtml;return true;}return false;"> <input type="hidden" name="mydoc"> <div id="toolbar1"> <select onchange="formatdoc('formatblock',this[this.selectedindex].value);this.selectedinde...
...n value="red">red</option> <option value="green">green</option> <option value="black">black</option> </select> </div> <div id="toolbar2"> <img class="intlink" title="clean" onclick="if(validatemode()&&confirm('are you sure?')){odoc.innerhtml=sdeftxt};" src="data:image/gif;base64,r0lgodlhfgawaiqbad04ktrlyzfrjlldzl9vj1dusy14wyodhpwibbsvfy6o7ioxw5qbms+wubcztca0ccs4kddqjdtltmrl1o3yitha7opcsd/f4pfvrvdv
8pv5xv///////////////////yh5baekab
8alaaaaaawabyaaav
84ceozgmeakqubmteyzk547qobcfwtm/jgshq4rhmloxfiehqqsawr+z4iayaj0kegtfolizlwre4ocqwrxototaihmcz0tvgmbqkzhayyfewev14eq
8iflhnehmfdqkaiskqci2pdc4qbg+oajc0ewadncogo6anqkkoiqa7" /> <img class="intlink" title="print" onclick="printdoc();" src="data:image/png;base64,ivborw0kggoaaaansuheugaaabyaaaawcayaaadetgw7aaaabgdbtueaalgpc/xhbqaaaazis0deap
8a/wd/ol2nkwaa...
...aalwsflzaaalewaacxmbajqcgaaaaad0su1fb9oebxczfmgboiwaaaaidevydenvbw1lbnqa9sywvwaaaufjrefuomvtlutsjfeux//n3nn0ydpbh1abrpt4lfqtqkc3jrkkneisiiribbehjjpklivo4m1rrmkkjqirmjruqudkpt71qpipirkpaqdf55tv5vvuszjqtjolseukd3xu/3dpzusc/22wtu2wrn+jg5so/ocdh
8ycmjdflehmlkjkvk7kuyn+ufza/rtth76zavocdptrxzqtni3mrwupc+6cktlxz/sddp2uu9uxlmyxz6qm
8v4tz
8lhf1h+zdqxt7s
8olmxtbf4e
8qafhjj3kbp2mzkkthpitjp9vh6ihia+whtasx5brpwuemgdondf/2a4m7ukds1jw662+xkqtkeuoqjktojm2h53yfl15psj04zc94wdtibr26fxlc2mzrvbccebz2kirfd414tkmlezbvgt33+qcohgha
81swysew0r1uzfnylmtpx
80pngqq91lwvk2jgvgnfvzg6ycyrat16gftw5kkkfo1eqltfh5q2ett0biwf+aitq4fdbk+imyo1oxvgf03wafjqvbckvdffryetxqiffygazths0zwagd7fg5tnnyntp
8/fzvgwjofmgg7gox0sakkgqgdmgkbi0njgmeimpgdk5+wacewed0ywblhguz4hw5oduekrblt7dtgdegxacsiznx
8zpmwh7k4rkpjcuhdxcul6mdsmmbxdlwch2+xozsgbnzsncee4euyv4...
...And 7 more matches
MIME types (IANA media types) - HTTP
it is defined and standardized in ietf's rfc 6
83
8.
...to specify a utf-
8 text file, the mime type text/plain;charset=utf-
8 is used.
...other common examples include application/pdf, application/pkcs
8, and application/zip.
...And 7 more matches
Lexical grammar - JavaScript
only the following unicode code points are treated as line terminators in ecmascript, other line breaking characters are treated as white space (for example, next line, nel, u+00
85 is considered as white space).
... \r u+202
8 line separator <ls> wikipedia u+2029 paragraph separator <ps> wikipedia comments comments are used to add hints, notes, suggestions, or warnings to javascript code.
...so use utf-
8 without bom if you want to run scripts directly from shell.
...And 7 more matches
begin - SVG: Scalable Vector Graphics
the time syntax is based upon the syntax defined in iso
8601.
... examples offset example <svg width="120" height="120" viewbox="0 0 120 120" xmlns="http://www.w3.org/2000/svg" version="1.1"> <!-- animated rectangles --> <rect x="10" y="35" height="15" width="0"> <animate attributetype="xml" attributename="width" to="100" begin="0s" dur="
8s" fill="freeze" /> </rect> <rect x="35" y="60" height="15" width="0"> <animate attributetype="xml" attributename="width" to="75" begin="2s" dur="6s" fill="freeze" /> </rect> <rect x="60" y="
85" height="15" width="0"> <animate attributetype="xml" attributename="width" to="50" begin="4s" dur="4s" ...
..."10" y="20" text-anchor="middle">0s</text> <line x1="10" y1="25" x2="10" y2="105" stroke="grey" stroke-width=".5" /> <text x="35" y="20" text-anchor="middle">2s</text> <line x1="35" y1="25" x2="35" y2="105" stroke="grey" stroke-width=".5" /> <text x="60" y="20" text-anchor="middle">4s</text> <line x1="60" y1="25" x2="60" y2="105" stroke="grey" stroke-width=".5" /> <text x="
85" y="20" text-anchor="middle">6s</text> <line x1="
85" y1="25" x2="
85" y2="105" stroke="grey" stroke-width=".5" /> <text x="110" y="20" text-anchor="middle">
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-...
...And 7 more matches
jpm - Archive of obsolete content
install a different version of firefox as of firefox 4
8, it is not possible to use unsigned add-ons (i.e.
... jpm post --post-url http://localhost:
8888/ see using post and watchpost for more information.
... -v --verbose verbose operation: jpm post --post-url http://localhost:
8888/ -v jpm watchpost this command packages the add-on as an xpi file then posts it to some url whenever a file in the current working directory changes.
...And 6 more matches
Appendix D: Loading Scripts - Archive of obsolete content
the script will be read with the utf-
8 encoding, based on the encoding of the overlay, and will execute as javascript version 1.
8, based on the version specified in the script tag.
... <?xml version="1.0" encoding="utf-
8"?> <!doctype overlay> <overlay id="script-overlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <script type="application/javascript;version=1.
8" src="overlay.js"/> </overlay> evalinsandbox the components.utils.evalinsandbox method may be used to load arbitrary code into components.utils.sandbox objects.
...some known issues include: e4x xml objects cannot be wrapped for passage between compartments: bug 613142 there are a number of type detection issues, including: string.replace does not recognize regexp objects from foreign compartments: bug 633
830 debugging: support for sandbox evaluation in development tools is uneven.
...And 6 more matches
Migrate apps from Internet Explorer to Mozilla - Archive of obsolete content
browser sniffing is usually done through the useragent, such as: mozilla/5.0 (x11; u; linux i6
86; en-us; rv:1.5) gecko/20031016 while using the useragent to sniff the browser provides detailed information on the browser in use, code that handles useragents often can make mistakes when new browser versions arrive, thus requiring code changes.
... value description 1 element node 2 attribute node 3 text node 4 cdata section node 5 entity reference node 6 entity node 7 processing instruction node
8 comment node 9 document node 10 document type node 11 document fragment node 12 notation node nodevalue returns the value of the current node.
...for example, an element node has type 1, while a text node has type 3 and a comment node is type
8.
...And 6 more matches
Table Cellmap - Archive of obsolete content
79 // this union relies on the assumption that an object (not primitive type) does
80 // not start on an odd bit boundary.
... if mspan is 0 then morigcell is in effect
81 // and the data does not represent a span.
... if mspan is 1, then mbits is in
82 // effect and the data represents a span.
...And 6 more matches
SSL and TLS - Archive of obsolete content
the recommended rsa key-length is 204
8 bits.
... though many web servers continue to use 1024-bit keys, web servers should migrate to at least 204
8 bits.
...all cas should use at least 204
8-bit keys, and stronger keys (such as 3072 or 4096 bits) if possible.
...And 6 more matches
Browser Detection and Cross Browser Support - Archive of obsolete content
user agent strings are defined in the http protocol and are available to web servers (see rfc 1945 - hypertext transfer protocol 1.0 and rfc 206
8 - hypertext transfer protocol 1.1).
...s_nav6up, is_gecko, is_ie3, is_ie4, is_ie4up, is_ie5, is_ie5up, is_ie5_5, is_ie5_5up, is_ie6, is_ie6up, is_hotjava3, is_hotjava3up, is_opera2, is_opera3, is_opera4, is_opera5, is_opera5up javascript version number is_js (float indicating full javascript version number: 1, 1.1, 1.2 ...) os platform and version is_win, is_win16, is_win32, is_win31, is_win95, is_winnt, is_win9
8, is_winme, is_win2k, is_os2, is_mac, is_mac6
8k, is_macppc, is_unix, is_sun, is_sun4, is_sun5, is_suni
86, is_irix, is_irix5, is_irix6, is_hpux, is_hpux9, is_hpux10, is_aix, is_aix1, is_aix2, is_aix3, is_aix4, is_linux, is_sco, is_unixware, is_mpras, is_reliant, is_dec, is_sinix, is_freebsd, is_bsd, is_vms detecting browsers using this level of detail is unworkable, unmaintainable and violat...
...(see mozilla user-agent strings and gecko user agent strings) mozilla/5.0 (...) gecko/2000110
8 netscape6/6.0 the first vendor/version (mozilla/5.0) indicates that netscape 6 is a fifth generation browser and is not identical to earlier browsers.
...And 6 more matches
Reference - Archive of obsolete content
--nickolay 1
8:40, 16 july 2006 (pdt) js 1.2 and gecko 1.
8 per the fix for bug 255
895, "javascript1.2" values for the script's language attribute no longer work, e.g.
...--maian 07:11,
8 september 2005 (pdt) if you want to make them consistent, i think we should go with the "first word only" capitalization, rather than the book-title style.
...--maian 20:24, 25 aug 2005 (pdt) help:custom_templates#template:deprecated_header --nickolay 00:5
8, 26 aug 2005 (pdt) hmm, that was a bad question.
...And 6 more matches
Using the Right Markup to Invoke Plugins - Archive of obsolete content
here's an example of this kind of usage for ie: <!-- ie only code --> <object classid="clsid:d27cdb6e-ae6d-11cf-96b
8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="366" height="142" id="myflash"> <param name="movie" value="javascript-to-flash.swf" /> <param name="quality" value="high" /> <param name="swliveconnect" value="true" /> </object> in the above example, the classid attribute that goes along with the object element points...
...thus, in the following example, instead of stopping at the activex control, ie will display the same animation twice since it also understands the mime type for flash: <!-- usage will not work as intended --> <object classid="clsid:d27cdb6e-ae6d-11cf-96b
8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="366" height="142" id="myflash"> <param name="movie" value="javascript-to-flash.swf" /> <param name="quality" value="high" /> <param name="swliveconnect" value="true" /> <object type="application/x-shockwave-flash" data="javascript-to-flash.swf" width="366" height="14...
...adding an additional layer of convenience in the form of automatic retrieval is the subject of a bug 1
80411 in the mozilla open source code.
...And 6 more matches
Basic math in JavaScript — numbers and operators - Learn web development
floating point numbers (floats) have decimal points and decimal places, for example 12.5, and 56.77
86543.
... octal — base
8, uses 0–7 in each column.
...type the following lines into your browser's console: let lotsofdecimal = 1.7665
8495
8675746364; lotsofdecimal; let twodecimalplaces = lotsofdecimal.tofixed(2); twodecimalplaces; converting to number data types sometimes you might end up with a number that is stored as a string type, which makes it difficult to perform calculations with it.
...And 6 more matches
Debugging on Windows
in vc 7 and
8 this option is called project > properties > debugging > command arguments.
... vc
8 also allows you to set environment variables there.
...by default it will be: vc++ 6.0: c:\program files\microsoft visual studio\common\msdev9
8\bin\autoexp.dat vc++ 7.0: c:\program files\microsoft visual studio .net 2003\common7\packages\debugger\autoexp.dat the file has information about the format in the beginning, and after a little practice you should be well on your way.
...And 6 more matches
DMD
unreported { 150 blocks in heap block record 2
83 of 5,495 21,600 bytes (20,400 requested / 1,200 slop) individual block sizes: 144 x 150 0.00% of the heap (16.
85% cumulative) 0.02% of unreported (94.6
8% cumulative) allocated at { #01: replace_malloc (/home/njn/moz/mi5/go64dmd/memory/replace/dmd/../../../../memory/replace/dmd/dmd.cpp:12
86) #02: malloc (/home/njn/moz/mi5/go64dmd/memory/build/../../../memory/build/replace_malloc...
....c:153) #03: moz_xmalloc (/home/njn/moz/mi5/memory/mozalloc/mozalloc.cpp:
84) #04: nscyclecollectingautorefcnt::incr(void*, nscyclecollectionparticipant*) (/home/njn/moz/mi5/go64dmd/dom/xul/../../dist/include/nsisupportsimpl.h:250) #05: nsxulelement::create(nsxulprototypeelement*, nsidocument*, bool, bool,mozilla::dom::element**) (/home/njn/moz/mi5/dom/xul/nsxulelement.cpp:2
87) #06: nsxblcontentsink::createelement(char16_t const**, unsigned int, mozilla::dom::nodeinfo*, unsigned int, nsicontent**, bool*, mozilla::dom::fromparser) (/home/njn/moz/mi5/dom/xbl/nsxblcontentsink.cpp:
874) #07: nscomptr<nsicontent>::startassignment() (/home/njn/moz/mi5/go64dmd/dom/xml/../../dist/include/nscomptr.h:753) #0
8: nsxmlcontentsink::handlestartelement(char16_t const*, char16_t const*...
...for example: reported at { #01: mozilla::dmd::report(void const*) (/home/njn/moz/mi2/memory/replace/dmd/dmd.cpp:1740) 0x7f6
86525
81ca #02: cyclecollectormallocsizeof(void const*) (/home/njn/moz/mi2/xpcom/base/nscyclecollector.cpp:300
8) 0x7f6
860fdfe02 #03: nspurplebuffer::sizeofexcludingthis(unsigned long (*)(void const*)) const (/home/njn/moz/mi2/xpcom/base/nscyclecollector.cpp:933) 0x7f6
860fdb7af #04: nscyclecollector::sizeofincludingthis(unsigned long (*)(void const*), unsigned long*, unsigned long*, unsigned lo...
...And 6 more matches
powermetrics
the following is example output from such an invocation: *** sampled system activity (fri sep 4 17:15:14 2015 +1000) (5009.63ms elapsed) *** *** running tasks *** name id cpu ms/s user% deadlines (<2 ms, 2-5 ms) wakeups (intr, pkg idle) gpu ms/s com.apple.terminal 293 447.66 274.
83 120.35 221.74 firefox
84627 77.59 55.55 15.37 2.59 91.42 42.12 204.47 plugin-container
8462
8 377.22 37.1
8 43.91 1
8.56 17
8.65 75.
85 17.29 terminal 694 9.
86 79.94 0.00 0.00 4.39 2.20 0.00 powermetrics ...
...
84694 1.21 31.53 0.00 0.00 0.20 0.20 0.00 com.google.chrome 4
89 233.
83 4
8.10 25.95 0.00 google chrome helper
846
88 1
81.57 92.
81 0.00 0.00 23.95 12.77 0.00 google chrome
846
81 57.26 76.07 4.39 0.00 23.75 12.97 0.00 google chrome helper
846
85 0.13 4
8.0
8 0.00 0.00 0.40 0.20 0.00 kernel_coalition 1 12
8.64 7
80.19 330.52 0.00 kernel_task 0 109.97 0.00 0.20 0.00 779.47 330.35 0.00 ...
... launchd 1 1
8.
88 2.44 0.00 0.00 0.40 0.20 0.00 com.apple.safari 4
88 90.60 10
8.5
8 56.4
8 26.65 com.apple.webkit.webcontent
84679 64.21
84.69 0.00 0.00 104.19 54.
89 26.66 com.apple.webkit.networking
8467
8 26.
89 5
8.
89 0.40 0.00 1.60 0.00 0.00 safari
84676 1.56 55.74 0.00 0.00 2.59 1.40 0.00 com.apple.safari.searchhelper
84690 0.15 49.49 0.00 0.00 0.20 0.20 0.00 org.mozilla.firefox 4
82 76.56 124.34 63.
...And 6 more matches
NSS_3.12.2_release_notes.html
nss 3.12.2 release notes 200
8-10-20 newsgroup: mozilla.dev.tech.crypto contents introduction distribution information new in nss 3.12.2 bugs fixed documentation compatibility feedback introduction network security services (nss) 3.12.2 is a patch release for nss 3.12.
... bug 200704: pkcs11: invalid session handle 0 bug 205434: fully implement new libpkix cert verification api from bug 294531 bug 302670: use the installed libz.so where available bug 305693: shlibsign generates pqg for every run bug 3114
83: exposing includecertchain as a parameter to sec_pkcs12addcertandkey bug 390527: get rid of pkixerrormsg variable in pkix_error bug 391560: libpkix does not consistently return pkix_validatenode tree that truly represent failure reasons bug 40
8260: certutil usage doesn't give enough information about trust arguments bug 412311: replace pr_interval_no_wait with pr_interval_no_timeout in c...
...lient initialization calls bug 423
839: add multiple pkcs#11 token password command line option to nss tools.
...And 6 more matches
NSS 3.47 release notes
introduction the nss team has released network security services (nss) 3.47 on 1
8 october 2019, which is a minor release.
... upcoming changes to default tls configuration the next nss team plans to make two changes to the default tls configuration in nss 3.4
8, which will be released in early december: tls 1.3 will be the default maximum tls version.
... see bug 157311
8 for details.
...And 6 more matches
Introduction to the JavaScript shell
countheap([start[, kind]]) added in spidermonkey 1.
8 count the number of live gc things in the heap, or things reachable from start when it is given and is not null.
... dumpheap([filename[, start[, tofind[, maxdepth[, toignore]]]]]) added in spidermonkey 1.
8 dump the graph of all existing objects (or a specific interesting subgraph) to a file.
... gcparam(name[, value]) added in spidermonkey 1.
8 read or configure garbage collector parameters.
...And 6 more matches
JSAPI User Guide
it amounts to about
80 lines of code, as shown below.
... jsruntime *rt = js_newruntime(
8l * 1024l * 1024l); if (!rt) return 1; // create a context.
... jscontext *cx = js_newcontext(rt,
8192); if (!cx) return 1; js_seterrorreporter(rt, reporterror); int status = run(cx); // shut everything down.
...And 6 more matches
Property attributes
some property attributes are defined in the ecmascript standard, in ecma 262-3 §
8.6.1.
... mxr id search for jsprop_permanent jsprop_propop_accessors passed to js_define(uc)property* and js_defineelement if getters/setters are jspropertyop/jsstrictpropertyop added in spidermonkey 3
8.
...added in spidermonkey 3
8 mxr id search for jsprop_define_late jsfun_stub_gsops use js_propertystub getter/setter instead of defaulting to class gsops for property holding function.
...And 6 more matches
nsIBinaryInputStream
inherits from: nsiinputstream last changed in gecko 1.7 method overview pruint
8 read
8(); pruint16 read16(); pruint32 read32(); pruint64 read64(); unsigned long readarraybuffer(in pruint32 alength, in jsval aarraybuffer); prbool readboolean(); void readbytearray(in pruint32 alength, [array, size_is(alength), retval] out pruint
8 abytes); void readbytes(in pruint32 alength, [size_is(alength), retval] out string astr...
...ing); acstring readcstring(); double readdouble(); float readfloat(); astring readstring(); void setinputstream(in nsiinputstream ainputstream); methods read
8() reads from the stream.
... pruint
8 read
8(); parameters none.
...And 6 more matches
nsIIDNService
inherits from: nsisupports last changed in gecko 1.9 (firefox 3) implemented by: @mozilla.org/network/idn-service;1 as a service: var idnservice = components.classes["@mozilla.org/network/idn-service;1"] .getservice(components.interfaces.nsiidnservice); method overview autf
8string convertacetoutf
8(in acstring input); autf
8string converttodisplayidn(in autf
8string input, out boolean isascii); acstring convertutf
8toace(in autf
8string input); boolean isace(in acstring input); autf
8string normalize(in autf
8string input); methods convertacetoutf
8() converts an ace (ascii compatible encoding) hostname into unicode format, returning a utf-
8 format string.
... this combines two operations: running the rfc 3490 "tounicode" operation on the original string, then converting the resulting unicode string into utf-
8 format.
... autf
8string convertacetoutf
8( in acstring input ); parameters input the ace encoded hostname to convert into utf-
8 format.
...And 6 more matches
nsIMsgHeaderParser
autf
8string extractheaderaddressmailboxes( in string line ); parameters line the header line to parse.
... autf
8string extractheaderaddressnames( in string line ); parameters line the header line to parse.
... autf
8string extractheaderaddressname( in string line ); parameters line the header line to parse.
...And 6 more matches
Xptcall Porting Status
status status platform contributors and <font color="red">?</font> possible contributors notes <font color="white">done</font> win32 x
86 john bandhauer <jband@netscape.com> win32 <font color="white">done</font> linux x
86 john bandhauer <jband@netscape.com> ulrich drepper <drepper@cygnus.com> unix <font color="white">done</font> freebsd and netbsd x
86 christoph toshok <toshok@hungry.com>, john bandhauer <jband@netscape.com> unix (same as linux
86 code) <font color="white">done</font> bsd/os x
86 bert driehuis <bert_drie...
...huis@nl.compuware.com> unix (same as linux
86 code) bert contributed patches that *should* do the right thing for all the unixish-x
86 versions of this code for gcc 2.7 or 2.
8 vs.
...i have not tested it with older gnu compilers such as gcc 2.
8.x.
...And 6 more matches
XPIDL
parameter js type notes boolean bool bool* boolean char char char* string only chars in range \u0000-\u00ff permitted double double double* number float float float* number long int32_t int32_t* number long long int64_t int64_t* number octet uint
8_t uint
8_t* number short int16_t int16_t* number string const char* char** string only chars in range \u0000-\u00ff permitted most of the time you don't want to use this type but autf
8string or acstring unsigned long uint32_t uint32_t* number unsigned long long uint64_t uint64_t* number ...
... nsqiresult void* void** object should only be used with methods that act like queryinterface autf
8string const nsacstring& nsacstring& string full unicode set permitted (translated to utf-
8) acstring const nsacstring& nsacstring& string only chars in range \u0000-\u00ff permitted astring const nsastring& nsastring& string full unicode set permitted jsval const jsval& jsval* anything jsid jsid jsid* no...
... ptr the type is really (native str)* ref the type is really (native str)& utf
8string this is an nsacstring declaration whose text is utf-
8.
...And 6 more matches
Zombie compartments
that more fine-graned representation may look like this │ ├───2
8.45 mb (05.71%) -- top(https://www.google.de/, id=141) │ │ ├──13.66 mb (02.74%) -- active/window(https://www.google.de/) │ │ │ ├───7.
83 mb (01.57%) -- js-compartment(https://www.google.de/) │ │ │ │ ├──3.56 mb (00.71%) -- objects │ │ │ │ │ ├──3.04 mb (00.61%) ++ gc-heap │ │ │ │ │ ├──0.51 mb (00.10%) ++ ...
... mb (00.49%) -- shapes │ │ │ │ │ ├──1.47 mb (00.29%) ++ gc-heap │ │ │ │ │ └──0.96 mb (00.19%) ++ malloc-heap │ │ │ │ ├──1.03 mb (00.21%) -- scripts │ │ │ │ │ ├──0.72 mb (00.14%) ── gc-heap [2] │ │ │ │ │ └──0.31 mb (00.06%) ── malloc-heap/data [2] │ │ │ │ ├──0.
80 mb (00.16%) -- type-inference │ │ │ │ │ ├──0.66 mb (00.13%) ── type-scripts [2] │ │ │ │ │ ├──0.13 mb (00.03%) ── allocation-site-tables [2] │ │ │ │ │ └──0.02 mb (00.00%) ── object-type-tables [2] │ │ │ │ └──0.01 mb (00.00%) -- sundries │ │ │ │ ├──0.01 mb (00.00%) ── mal...
...loc-heap [2] │ │ │ │ └──0.00 mb (00.00%) ── gc-heap [2] │ │ │ └───5.
83 mb (01.17%) -- (4 tiny) │ │ │ ├──4.19 mb (00.
84%) ++ layout │ │ │ ├──1.03 mb (00.21%) ── style-sheets [2] │ │ │ ├──0.60 mb (00.12%) ++ dom │ │ │ └──0.01 mb (00.00%) ── property-tables [2] │ │ ├───
8.
86 mb (01.7
8%) -- cached/window(https://www.google.de/?gws_rd=ssl) │ │ │ ├──4.23 mb (00.
85%) -- layout │ │ │ │ ├──3.
80 mb (00.76%) ── style-sets │ │ │ │ ├──0.29 mb (00.06%) ── pres-shell │ │ │ │ ├──0.05 mb (00.01%) ── rule-nodes │ │ │ │ ├──0.04 mb (00.01%) ── style-conte...
...And 6 more matches
Type conversion
target type source type ctypes.int16_t ctypes.int
8_t ctypes.uint
8_t ctypes.short ctypes.uint16_t ctypes.uint
8_t ctypes.unsigned_short ctypes.short ctypes.int
8_t ctypes.uint
8_t ctypes.int16_t ctypes.unsigned_short ctypes.uint
8_t ctypes.uint16_t ctypes.int32_t ctypes.int
8_t ctypes.uint
8_t ctypes.int16_t ctypes.uint16_t ...
... ctypes.short ctypes.unsigned_short ctypes.int ctypes.uint32_t ctypes.uint
8_t ctypes.uint16_t ctypes.unsigned_short ctypes.unsigned_int ctypes.int ctypes.int
8_t ctypes.uint
8_t ctypes.int16_t ctypes.uint16_t ctypes.short ctypes.unsigned_short ctypes.int32_t ctypes.unsigned_int ctypes.uint
8_t ctypes.uint16_t ctypes.unsigned_short ctypes.uint32_t ctypes.int64_t ctypes.int
8_t ctypes.uint
8_t ctypes.int16_t ctypes.uint16_t ctypes.short ctypes.unsigned_short ctypes.int32_t ctypes.uint32_t ctypes.int ctypes.unsigned_int ctypes.long_l...
...ong ctypes.uint64_t ctypes.uint
8_t ctypes.uint16_t ctypes.unsigned_short ctypes.uint32_t ctypes.unsigned_int ctypes.unsigned_long_long ctypes.long_long ctypes.int
8_t ctypes.uint
8_t ctypes.int16_t ctypes.uint16_t ctypes.short ctypes.unsigned_short ctypes.int32_t ctypes.uint32_t ctypes.int ctypes.unsigned_int ctypes.int64_t ctypes.unsigned_long_long ctypes.uint
8_t ctypes.uint16_t ctypes.unsigned_short ctypes.uint32_t ctypes.unsigned_int ctypes.uint64_t ctypes.float32_t ctypes.int
8_t ctypes.uint
8_t ctypes.int16_t ctypes.uint16_t ctype...
...And 6 more matches
CData
methods available on string objects these methods must be called on objects that are arrays or pointers to
8-bit or 16-bit character or integer types, terminated by a null character.
...
8-bit strings are assumed to be encoded as utf-
8.
... if the
8-bit string contains invalid encoded character, a typeerror exception is thrown.
...And 6 more matches
FileReaderSync - Web APIs
the optional encoding parameter indicates the encoding to be used (e.g., iso-
8859-1 or utf-
8).
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetfilereadersyncchrome full support yesedge full support 12firefox full support
8ie full support yesopera full support yessafari full support yeswebview android full support yeschrome android full support yesfirefox android full support ...
...
8opera android full support yessafari ios full support yessamsung internet android full support yesreadasarraybufferchrome full support yesedge full support 12firefox full support
8ie full support yesopera full support yessafari full support yeswebview android full support yeschrome android full support ...
...And 6 more matches
IDBKeyRange - Web APIs
7webview android full support yeschrome android full support yesfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support yesboundchrome full support 24 full support 24 no support 23 — 24prefixed prefixed implemented with the vendor prefix: webkitedge full support 12firefox ...
... 7webview android full support yeschrome android full support yesfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support yesincludeschrome full support 52edge full support ≤1
8firefox full support 47ie ?
... 7webview android full support yeschrome android full support yesfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support yeslowerboundchrome full support 24 full support 24 no support 23 — 24prefixed prefixed implemented with the vendor prefix: webkitedge full support 12fire...
...And 6 more matches
SubtleCrypto.exportKey() - Web APIs
pkcs
8: pkcs #
8 format.
...*/ async function exportcryptokey(key) { const exported = await window.crypto.subtle.exportkey( "raw", key ); const exportedkeybuffer = new uint
8array(exported); const exportkeyoutput = document.queryselector(".exported-key"); exportkeyoutput.textcontent = `[${exportedkeybuffer}]`; } /* generate an encrypt/decrypt secret key, then set up an event listener on the "export" button.
... */ window.crypto.subtle.generatekey( { name: "aes-gcm", length: 256, }, true, ["encrypt", "decrypt"] ).then((key) => { const exportbutton = document.queryselector(".raw"); exportbutton.addeventlistener("click", () => { exportcryptokey(key); }); }); pkcs #
8 export this example exports an rsa private signing key as a pkcs #
8 object.
...And 6 more matches
WebGLRenderingContext.texImage2D() - Web APIs
uminance unsigned_byte 1 1 alpha unsigned_byte 1 1 other possible values in webgl2 for the versions of teximage2d that take an arraybufferview or a glintptr offset sized format base format r bits g bits b bits a bits shared bits color renderable texture filterable r
8 red
8 ● ● r
8_snorm red s
8 ● rg
8 rg
8 8 ● ● rg
8_snorm rg s
8 s
8 ● rgb
8 rgb
8 8 8 ● ● rgb
8_snorm rgb s
8 s
8 s
8 ● rgb565 rgb 5 6 5 ● ● ...
... rgba4 rgba 4 4 4 4 ● ● rgb5_a1 rgba 5 5 5 1 ● ● rgba
8 rgba
8 8 8 8 ● ● rgba
8_snorm rgba s
8 s
8 s
8 s
8 ● rgb10_a2 rgba 10 10 10 2 ● ● rgb10_a2ui rgba ui10 ui10 ui10 ui2 ● srgb
8 rgb
8 8 8 ● srgb
8_alpha
8 rgba
8 8 8 8 ● ● r16f red f16 ● rg16f rg f16 f16 ● rgb16f rgb f16 f16 f16 ● rgba16f rgba f16 f16 f16 f16 ● r32f red f32 ...
... rg32f rg f32 f32 rgb32f rgb f32 f32 f32 rgba32f rgba f32 f32 f32 f32 r11f_g11f_b10f rgb f11 f11 f10 ● rgb9_e5 rgb 9 9 9 5 ● r
8i red i
8 ● r
8ui red ui
8 ● r16i red i16 ● r16ui red ui16 ● r32i red i32 ● r32ui red ui32 ● rg
8i rg i
8 i
8 ● rg
8ui rg ui
8 ui
8 ● rg16i rg i16 i16 ...
...And 6 more matches
Writing a WebSocket server in Java - Web APIs
java.net.serversocket; import java.net.socket; import java.security.messagedigest; import java.security.nosuchalgorithmexception; import java.util.base64; import java.util.scanner; import java.util.regex.matcher; import java.util.regex.pattern; public class websocket { public static void main(string[] args) throws ioexception, nosuchalgorithmexception { serversocket server = new serversocket(
80); try { system.out.println("server has started on 127.0.0.1:
80.\r\nwaiting for a connection..."); socket client = server.accept(); system.out.println("a client connected."); socket methods: java.net.socket getinputstream() returns an input stream for this socket.
... inputstream in = client.getinputstream(); outputstream out = client.getoutputstream(); scanner s = new scanner(in, "utf-
8"); handshaking when a client connects to a server, it sends a get request to upgrade the connection to a websocket from a simple http request.
... you must, obtain the value of sec-websocket-key request header without any leading and trailing whitespace link it with "25
8eafa5-e914-47da-95ca-c5ab0dc
85b11" compute sha-1 and base64 code of it write it back as value of sec-websocket-accept response header as part of a http response.
...And 6 more matches
Web Video Text Tracks Format (WebVTT) - Web APIs
webvtt is a text based format, which must be encoded using utf-
8.
... 14 00:01:14.
815 --> 00:01:1
8.114 - what?
... 15 00:01:1
8.171 --> 00:01:20.991 - this is big bat country.
...And 6 more matches
Example and tutorial: Simple synth keyboard - Web APIs
</option> </select> </div> </div> css .container { overflow-x: scroll; overflow-y: hidden; width: 660px; height: 110px; white-space: nowrap; margin: 10px; } .keyboard { width: auto; padding: 0; margin: 0; } .key { cursor: pointer; font: 16px "open sans", "lucida grande", "arial", sans-serif; border: 1px solid black; border-radius: 5px; width: 20px; height:
80px; text-align: center; box-shadow: 2px 2px darkgray; display: inline-block; position: relative; margin-right: 3px; user-select: none; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; } .key div { position: absolute; bottom: 0; text-align: center; width: 100%; pointer-events: none; } .key div sub { font-size: 10px; pointer-events: none; }...
... .key:hover { background-color: #eef; } .key:active { background-color: #000; color: #fff; } .octave { display: inline-block; padding: 0 6px 0 0; } .settingsbar { padding-top:
8px; font: 14px "open sans", "lucida grande", "arial", sans-serif; position: relative; vertical-align: middle; width: 100%; height: 30px; } .left { width: 50%; position: absolute; left: 0; display: table-cell; vertical-align: middle; } .left span, .left input { vertical-align: middle; } .right { width: 50%; position: absolute; right: 0; display: table-cell; vertical-align: middle; } .right span { vertical-align: middle; } .right input { vertical-align: baseline; } javascript the javascript code begins by initializing a number of variables.
... function createnotetable() { let notefreq = []; for (let i=0; i< 9; i++) { notefreq[i] = []; } notefreq[0]["a"] = 27.500000000000000; notefreq[0]["a#"] = 29.135235094
880619; notefreq[0]["b"] = 30.
86770632
8507756; notefreq[1]["c"] = 32.703195662574
829; notefreq[1]["c#"] = 34.647
82
8872109012; notefreq[1]["d"] = 36.70
80959
89675945; notefreq[1]["d#"] = 3
8.
890
872965260113; notefreq[1]["e"] = 41.20344461410
8741; notefreq[1]["f"] = 43.65352
89291254
85; notefreq[1]["f#"] = 46.249302
83
8954299; notefreq[1]["g"] = 4
8.99942949771
8661; notefreq[1]["g#"] ...
...And 6 more matches
Box alignment in CSS Grid Layout - CSS: Cascading Style Sheets
perty on the grid container, to align the items using one of the following values: auto normal start end center stretch baseline first baseline last baseline * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } .wrapper { display: grid; grid-template-columns: repeat(
8, 1fr); grid-gap: 10px; grid-auto-rows: 100px; grid-template-areas: "a a a a b b b b" "a a a a b b b b" "c c c c d d d d" "c c c c d d d d"; align-items: start; } .item1 { grid-area: a; } .item2 { grid-area: b; } .item3 { grid-area: c; } .item4 { grid-area: d;...
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } .wrapper { display: grid; grid-template-columns: repeat(
8, 1fr); grid-gap: 10px; grid-auto-rows: 100px; grid-template-areas: "a a a a b b b b" "a a a a b b b b" "c c c c d d d d" "c c c c d d d d"; } .item1 { grid-area: a; } .item2 { grid-area: b; align-self: start; } .item3 { grid-area: c; align-self: end; } .item4...
...the first item in the example demonstrates this default alignment: * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } .wrapper { display: grid; grid-template-columns: repeat(
8, 1fr); grid-gap: 10px; grid-auto-rows: 100px; grid-template-areas: "a a a a b b b b" "a a a a b b b b" "c c c c d d d d" "c c c c d d d d"; } .item1 { grid-area: a; } .item2 { grid-area: b; justify-self: start; } .item3 { grid-area: c; justify-self: end; } .i...
...And 6 more matches
Line-based placement with CSS Grid - CSS: Cascading Style Sheets
* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 100px); } <div class="wrapper"> <div class="box1">one</div> <div class="box2">two</div> <div class="box3">three</div> <div class="box4">four</div> </div> positioning items by line number we can use line-based placement to control ...
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 100px); } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } <div class="wrapper"> <div class="box1">one</div> <div class="box2">two</div> <div class="box3">three</div> <div class="box4">four</div> </div> .box1 { grid-column-start: 1; grid-column-end: 2; grid-row-start: 1; grid-row-end: 4; } .box2 { grid-column-start: 3; grid-column-end: 4; grid-row-start: 1; grid-row-end: ...
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 100px); } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } <div class="wrapper"> <div class="box1">one</div> <div class="box2">two</div> <div class="box3">three</div> <div class="box4">four</div> </div> .box1 { grid-column: 1 / 2; grid-row: 1 / 4; } .box2 { grid-column: 3 / 4; grid-row: 1 / 3; } .box3 { grid-column: 2 / 3; grid-row: 1 / 2; } .box4 { grid-column: 2 / 4; g...
...And 6 more matches
<input type="time"> - HTML: Hypertext Markup Language
12-hour 24-hour chrome
83 in chrome
83, the ui controls have been updated with a new look and feel.
...in the following example we are setting a minimum time of 12:00 and a maximum time of 1
8:00: <form> <label for="appt-time">choose an appointment time (opening hours 12:00 to 1
8:00): </label> <input id="appt-time" type="time" name="appt-time" min="12:00" max="1
8:00"> <span class="validity"></span> </form> here's the css used in the above example.
... div { margin-bottom: 10px; position: relative; } input[type="number"] { width: 100px; } input + span { padding-right: 30px; } input:invalid+span:after { position: absolute; content: '✖'; padding-left: 5px; } input:valid+span:after { position: absolute; content: '✓'; padding-left: 5px; } the result here is that: only times between 12:00 and 1
8:00 will be seen as valid; times outside that range will be denoted as invalid.
...And 6 more matches
Date.parse() - JavaScript
syntax direct call: date.parse(datestring) implicit call: new date(datestring) parameters datestring a string representing a simplification of the iso
8601 calendar date extended format.
... description the parse() method takes a date string (such as "2011-10-10t14:4
8:00") and returns the number of milliseconds since january 1, 1970, 00:00:00 utc.
... date time string format the standard string representation of a date time string is a simplification of the iso
8601 calendar date extended format.
...And 6 more matches
encodeURIComponent() - JavaScript
the encodeuricomponent() function encodes a uri by replacing each instance of certain characters by one, two, three, or four escape sequences representing the utf-
8 encoding of the character (will only be four escape sequences for characters composed of two "surrogate" characters).
... // %3b%2c%2f%3f%3a%40%26%3d%2b%24 console.log(encodeuricomponent(set2)); // -_.!~*'() console.log(encodeuricomponent(set3)); // %23 console.log(encodeuricomponent(set4)); // abc%20abc%20123 (the space gets encoded as %20) note that a urierror will be thrown if one attempts to encode a surrogate which is not part of a high-low pair, e.g., // high-low pair ok console.log(encodeuricomponent('\ud
800\udfff')); // lone high surrogate throws "urierror: malformed uri sequence" console.log(encodeuricomponent('\ud
800')); // lone low surrogate throws "urierror: malformed uri sequence" console.log(encodeuricomponent('\udfff')); use encodeuricomponent() on user-entered fields from forms post'd to the server.
... to be more stringent in adhering to rfc 39
86 (which reserves !, ', (, ), and *), even though these characters have no formalized uri delimiting uses, the following can be safely used: function fixedencodeuricomponent(str) { return encodeuricomponent(str).replace(/[!'()*]/g, function(c) { return '%' + c.charcodeat(0).tostring(16); }); } examples encoding for content-disposition and link headers the following example provides th...
...And 6 more matches
SVG 2 support in Mozilla - SVG: Scalable Vector Graphics
sourcesrequired removed never implemented svgelement.viewportelement and svgelement.ownersvgelement nullable implementation status unknown svgelement.getpresentationattribute() removed never implemented (prototype removed in bug 921456) svgcolor and svgicccolor removed never implemented svgelement.focus(), svgelement.blur() not implemented (bug 77
8654) svgelement.tabindex implemented (bug 77
8654) document.activeelement implementation status unknown globaleventhandlers on svgelement implementation status unknown options dictionary attribute for svggraphicselement.getbbox() implemented behind the preference svg.new-getbbox.enabled (bug 999964, bug 1019326) allow leading and trailing whi...
...2705) <switch> not affecting <style> implementation status unknown requiredfeatures attribute removed implementation status unknown svgsvgelement.currentview and svgsvgelement.usecurrentview removed svgsvgelement.currentview was never implemented, svgsvgelement.usecurrentview not removed yet (bug 1174097) svgunknownelement not implemented (bug 123921
8) lang attribute without namespace implemented (bug 721920) svgsvgelement.viewport removed never implemented xml:base attribute removed implementation status unknown reorder descendent elements of <switch> having systemlanguage attribute according to allowreorder smil attribute implementation status unknown made <tspan> and <textpath> graphi...
... 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 123912
8 (firefox 46.0 / thunderbird 46.0 / seamonkey 2.43)) inner <svg>s and <foreignobjects>s not overflow: hidden; in ua style sheet implementation status unknown overflow: hidden; on <hatch> in ua style sheet implementation status unknown 0 0 as default value of transform-origin except root <svg> and <svg> children of <foreign> implementation status unknown ...
...And 6 more matches
Paths - SVG: Scalable Vector Graphics
for instance, since our box is
80×
80, the <path> element could have been written as: <path d="m 10 10 h
80 v
80 h -
80 z" fill="transparent" stroke="black"/> the path will move to point (10,10) and then move horizontally
80 points to the right, then
80 points down, then
80 points to the left, and then back to the start.
... <svg width="190" height="160" xmlns="http://www.w3.org/2000/svg"> <path d="m 10 10 c 20 20, 40 20, 50 10" stroke="black" fill="transparent"/> <path d="m 70 10 c 70 20, 110 20, 110 10" stroke="black" fill="transparent"/> <path d="m 130 10 c 120 20, 1
80 20, 170 10" stroke="black" fill="transparent"/> <path d="m 10 60 c 20
80, 40
80, 50 60" stroke="black" fill="transparent"/> <path d="m 70 60 c 70
80, 110
80, 110 60" stroke="black" fill="transparent"/> <path d="m 130 60 c 120
80, 1
80
80, 170 60" stroke="black" fill="transparent"/> <path d="m 10 110 c 20 140, 40 140, 50 110" stroke="black" fill="transparent"/> <path d="m 70 110 c 70 140...
..., 110 140, 110 110" stroke="black" fill="transparent"/> <path d="m 130 110 c 120 140, 1
80 140, 170 110" stroke="black" fill="transparent"/> </svg> the example above creates nine cubic bézier curves.
...And 6 more matches
JavaScript Daemons Management - Archive of obsolete content
examples example #1: a standard instantiation – new daemon() <!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-
8" /> <title>new daemon(…)</title> <script type="text/javascript" src="daemon.js"></script> <script type="text/javascript" src="daemon-methods.js"></script> <script type="text/javascript"> function perform (nindex, nlength, bbackw) { // http://tyleregeto.com/text-animation-in-javascript for (var oletter, nletter = 0; nletter < aletters.length; nletter++) { oletter = aletters[nletter...
...]; var ndist = nmaxdist - nmaxdist * nindex / nlength; oletter.pos += 0.0
8; oletter.elem.style.top = math.sin(oletter.pos) * ndist + "px"; oletter.elem.style.left = math.cos(oletter.pos) * ndist * 5 + "px"; } } function prepare () { // build letters list // http://tyleregeto.com/text-animation-in-javascript this.textcontent = ""; aletters.length = 0; for (var ospan, oletter, nletter = 0, nlen = stext.length; nletter < nlen; nletter++) { ospan = document.createelement("span"); ospan.textcontent = stext[nletter]; oletter = { "elem": ospan, "parent": this }; aletters.push(oletter); oletter.pos = math.random() * 50; oletter.elem.style.position = "relative"; this.appendchild(ospan); } } var nmaxdist = 25, aletters = [], stext = "do yo...
...llo" value="33" style="width: 40px;" onkeypress="return event.charcode===0||/\d/.test(string.fromcharcode(event.charcode));" onkeyup="if(isfinite(this.value)&&number(this.value)>0){orecompose.setrate(this.value);}" /></p> </body> </html> example #2: a practical instantiation – daemon.buildaround() <!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-
8" /> <title>daemon.buildaround(…)</title> <script type="text/javascript" src="daemon.js"></script> <script type="text/javascript" src="daemon-methods.js"></script> <script type="text/javascript"> /*\ |*| |*| :: daemon.buildaround(@context[, @rate, @length]) :: |*| |*| returns a new daemon built around a @context object.
...And 5 more matches
Extension Versioning, Update and Compatibility - Archive of obsolete content
<?xml version="1.0" encoding="utf-
8"?> <rdf:rdf xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:em="http://www.mozilla.org/2004/em-rdf#"> <!-- this description resource includes all the update and compatibility information for a single add-on with the id foobar@developer.mozilla.org.
...df:seq> <!-- each li is a different version of the same add-on --> <rdf:li> <rdf:description> <em:version>2.2</em:version> <!-- this is the version number of the add-on --> <!-- one targetapplication for each application the add-on is compatible with --> <em:targetapplication> <rdf:description> <em:id>{ec
8030f7-c20a-464f-9b0e-13a3a9e973
84}</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:updatelink>https://www.mysite.com/foobar2.2.xpi</em:updatelink> <!-- 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>{ec
8030f7-c20a-464f-9b0e-13a3a9e973
84}</em:id> <em:minversion>1.5</em:minversion> <em:maxversion>2.0.0.*</em:maxversion> <em:updatelink>http://www.mysite.com/foobar2.5.xpi</em:updatelink> <em:updatehash>sha256:7
8fc1d2
887eda35b4ad2e3a0b60120ca271ce6e64ad2e3a0b60120ca271ce6e6</em:updatehash> </rdf:description> </em:targ...
...And 5 more matches
JXON - Archive of obsolete content
swatch image="red_cardigan.jpg">red</color_swatch> <color_swatch image="burgundy_cardigan.jpg">burgundy</color_swatch> </size> <size description="large"> <color_swatch image="red_cardigan.jpg">red</color_swatch> <color_swatch image="burgundy_cardigan.jpg">burgundy</color_swatch> </size> </catalog_item> <catalog_item gender="women's"> <item_number>rrx9
856</item_number> <discount_until>dec 25, 1995</discount_until> <price>42.50</price> <size description="medium"> <color_swatch image="black_cardigan.jpg">black</color_swatch> </size> </catalog_item> </product> <script type="text/javascript"><![cdata[function matchwo(a,b) { if (a < b && a < 0) { return 1; } else { return 0; } }]]></script> </catalog> first...
...s": { "image": "burgundy_cardigan.jpg" } }], "purchased": { "keyvalue": null }, "keyvalue": null, "keyattributes": { "description": "large" } }], "keyvalue": null, "keyattributes": { "gender": "men's" } }, { "item_number": { "keyvalue": "rrx9
856" }, "discount_until": { "keyvalue": new date(1995, 11, 25) }, "price": { "keyvalue": 42.5 }, "size": { "color_swatch": { "keyvalue": "black", "keyattributes": { "image": "black_cardigan.jpg" } }, "keyvalue": null, "keyattributes": { "descriptio...
...}], "@description": "medium" }, { "color_swatch": [{ "keyvalue": "red", "@image": "red_cardigan.jpg" }, { "keyvalue": "burgundy", "@image": "burgundy_cardigan.jpg" }], "@description": "large" }], "@gender": "men's" }, { "item_number": { "keyvalue": "rrx9
856" }, "discount_until": { "keyvalue": new date(1995, 11, 25) }, "price": { "keyvalue": 42.5 }, "size": { "color_swatch": { "keyvalue": "black", "@image": "black_cardigan.jpg" }, "@description": "medium" }, "@gender": "women's" }], "@description": "c...
...And 5 more matches
No Proxy For configuration - Archive of obsolete content
y ("www.otherdomain.localhost") a hostname (with domain) domain name "www.mozilla.org" does not block hostnames or domains that end in the same string (other-www.mozilla.org) an ip address ip address "1.2.3.4" does not block hostnames that resolve to the ip address ("127.0.0.1" does not block "localhost") a network network w/ cidr block "10.0.0.0/
8" does not block hostnames that resolve to the ip address range (10.0.0.0/
8 is not "no proxy for intranet hostnames") optional - port-specific (optional) ":" + port number "<filter>:
81" only black-lists port.
...port-only filters ":
80" or "*:
80" are not supported.
...proxy connections that fail return an error "the proxy server you have configured cannot be found", so configure your browser to use a non-existent http proxy (hostname: "imaginary", port "
80").
...And 5 more matches
Creating regular expressions for a microsummary generator - Archive of obsolete content
here's a url for an auction item page on ebay: http://cgi.ebay.com/ws/ebayisapi.dll?viewitem&item=2
8001
8439106 in this url, the domain name is "cgi.ebay.com", the file path is "/ws/ebayisapi.dll", and the query parameters are "?viewitem&item=2
8001
8439106".
... here's a regular expression that matches our example url: http://cgi\.ebay\.com/ws/ebayisapi\.dll\?viewitem&item=2
8001
8439106 it looks almost the same as the url.
... matching from the start of the url while this expression matches the url, it also matches other urls that contain this url in their query parameters, for example: http://www.example.com/redirect.php?url=http://cgi.ebay.com/ws/ebayisapi.dll?viewitem&item=2
8001
8439106 that's probably not what we want, since urls that contain our example url probably aren't auction item pages themselves.
...And 5 more matches
Using cross commit - Archive of obsolete content
getting the script "make -f client.mk pull_all" from a working copy of the trunk now pulls cross-commit, and that'll work on the 1.
8 branch soon, too, so you might already have the script.
... using the script quick overview there are a couple of common ways to use cross-commit: land something simultaneously on the trunk and mozilla_1_
8_branch # modify the files (probably by applying the patch) patch -p0 < ~/caret.patch # commit on trunk and branch at once # make sure to use -m "commit message" when doing so tools/cross-commit -m "fix some sort of security bug" layout/base/nscaret.h land something on two other branches that has already landed on the trunk # update to the first branch you want to land on cvs update -rmozilla_1_
8_branch layout/base/nscaret.h # modif...
...y the files (probably by applying the patch) patch -p0 < ~/caret.patch # commit on all the branches at once # make sure to use -m "commit message" when doing so tools/cross-commit --moz1
8 --branch mozilla_1_
8_0_branch -m "fix some sort of security bug" layout/base/nscaret.h notes note that you must use a -m option with a cvs checkin message.
...And 5 more matches
Using gdb on wimpy computers - Archive of obsolete content
-g ./mozilla-bin mozilla_five_home=/home/blizzard/src/mozilla/mozilla/dist/bin ld_library_path=/home/blizzard/src/mozilla/mozilla/dist/bin shlib_path=/home/blizzard/src/mozilla/mozilla/dist/bin libpath=/home/blizzard/src/mozilla/mozilla/dist/bin moz_program=./mozilla-bin moz_toolkit= moz_debug=1 moz_debugger= /usr/bin/gdb ./mozilla-bin -x /tmp/mozargs222
88 gnu gdb 19991004 copyright 199
8 free software foundation, inc.
...this gdb was configured as "i3
86-redhat-linux"...
... (gdb) b main breakpoint 1 at 0x
804ec45: file nsapprunner.cpp, line
811.
...And 5 more matches
Elements - Archive of obsolete content
see bug
83
830 for more information and for workarounds.
... default encoding in xml documents (including xbl files) is utf-
8.
... an explicit encoding declarations may be present to override the default, for example <?xml version="1.0" encoding="iso-
8859-1"?> uri in namespace declarations is an opaque string used to uniquely identify the namespace.
...And 5 more matches
Reading from Files - Archive of obsolete content
the default character encoding is utf-
8 which means that characters below value 12
8 will occupy a single byte whereas characters above value 12
8 will occupy multiple bytes, depending on their value.
...fortunately as a character is always at least one byte long in the default utf-
8 encoding, the number of characters will always be equal to or smaller than the number of bytes available.
...reading other character encodings the default character encoding is utf-
8.
...And 5 more matches
What is RSS - Archive of obsolete content
le: <?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 ispermalink="false">4d4a0a12-f1
88-4c97-90
8b-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 ispermalink="false">c4a63f09-b45b-466b-
8773-6ff264001ab7</guid> <pubdate>tue, 19 jul 2005 04:32:51 -0700</pubdate> <lin...
...k>http://news.example.com/artcle/553</link> </item> <item> <title>fire is hot</title> <guid ispermalink="false">c1795324-d5ea-44fa-95b1-b5ce2090d4f1</guid> <pubdate>sun, 15 may 2005 13:02:0
8 -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:0
8 -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:0
8 -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:1
8 -0500</pubdate> <link>http://joe-blow.example.net/log/20</link> ...
...And 5 more matches
New in JavaScript - Archive of obsolete content
ecmascript next support implementation status for upcoming ecma-262 features as per the yearly (es2016/es2017/es201
8/...) release schedule in mozilla-based engines and products.
...firefox 4 was the last version which referred to a javascript version (1.
8.5).
...released on october 19, 199
8.
...And 5 more matches
Index - Game development
8 game distribution cocoonio, game, game publishing, games, gaming, html5, javascript, mobile game distribution, phonegap, web stores, distribution distribution is the way to give the world access to your game.
... 1
8 building up a basic demo with playcanvas 3d, animation, beginner, canvas, games, playcanvas, tutorial, webgl, camera, lighting, rendering of course, it depends on your approach — designers may favor the online editor while programmers will prefer having the full control over the coding environment and will probably use the engine's source files.
...in gecko, async compilation allows the javascript engine to compile the asm.js off the main thread when the game is loading and cache the generated machine code so that the game doesn't need to be compiled on subsequent loads (starting in firefox 2
8).
...And 5 more matches
Grids - Learn web development
simple grid example body { width: 90%; max-width: 900px; margin: 2em auto; font: .9em/1.2 arial, helvetica, sans-serif; } .container > div { border-radius: 5px; padding: 10px; background-color: rgb(207,232,220); border: 2px solid rgb(79,1
85,227); } <div class="container"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> <div>six</div> <div>seven</div> </div> .container { display: grid; grid-template-columns: 200px 200px 200px; } flexible grids with the fr unit in addition to creating grids using lengths and percentages, we can use the fr unit to flexibly size grid rows an...
... simple grid example with fr units body { width: 90%; max-width: 900px; margin: 2em auto; font: .9em/1.2 arial, helvetica, sans-serif; } .container { display: grid; grid-template-columns: 2fr 1fr 1fr; } .container > div { border-radius: 5px; padding: 10px; background-color: rgb(207,232,220); border: 2px solid rgb(79,1
85,227); } <div class="container"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> <div>six</div> <div>seven</div> </div> note: the fr unit distributes available space, not all space.
... simple grid example with fr units body { width: 90%; max-width: 900px; margin: 2em auto; font: .9em/1.2 arial, helvetica, sans-serif; } .container { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-gap: 20px; } .container > div { border-radius: 5px; padding: 10px; background-color: rgb(207,232,220); border: 2px solid rgb(79,1
85,227); } <div class="container"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> <div>six</div> <div>seven</div> </div> note: the *gap properties used to be prefixed by grid-, but this has been changed in the spec, as the intention is to make them usable in multiple layout methods.
...And 5 more matches
Making decisions in your code — conditionals - Learn web development
for example, we could update our weather forecast application to show a further set of choices depending on what the temperature is: if (choice === 'sunny') { if (temperature <
86) { para.textcontent = 'it is ' + temperature + ' degrees outside — nice and sunny.
... let\'s go out to the beach, or the park, and get an ice cream.'; } else if (temperature >=
86) { para.textcontent = 'it is ' + temperature + ' degrees outside — really hot!
... to give you an and example, the previous example snippet can be rewritten to this: if (choice === 'sunny' && temperature <
86) { para.textcontent = 'it is ' + temperature + ' degrees outside — nice and sunny.
...And 5 more matches
Debugging Table Reflow
the table layout strategy can be visualized by defining in the makefiles the constant debug_table_strategy.if one takes for instance the following table code: <table border width="300"> <colgroup> <col> <col width="50%"> <col width="1*"> <col> </colgroup> <tr> <td style="width:
80px">cell 1</td> <td>cell 2</td> <td>cell 3</td> <td>cell 4</td> </tr> </table> rendering: <colgroup><col><col width="50%"><col width="1*"><col></colgroup>cell 1cell 2cell 3cell 4 it will produce the following log at the entrance of assignnonpctcolwidths: assignnonpctcolwidths en max=4500 count=0 ***start table dump*** mcolwidths=-1 -1 -1 -1 col frame cache -> 0=00b9313
8 1=00b931f0 2=0...
...24dd72
8 3=024dd7
80 **start col dump** colindex=0 isanonymous=0 constraint=0 widths=-1 -1 -1 -1 -1 -1 -1 -1 -1 -1 **end col dump** **start col dump** colindex=1 isanonymous=0 constraint=0 widths=-1 -1 -1 -1 -1 -1 -1 -1 -1 -1 **end col dump** **start col dump** colindex=2 isanonymous=0 constraint=0 widths=-1 -1 -1 -1 -1 -1 -1 -1 -1 -1 **end col dump** **start col dump** colindex=3 isanonymous=0 constraint=0 widths=-1 -1 -1 -1 -1 -1 -1 -1 -1 -1 **end col dump** ***end table dump*** the en stands for entrance (ex for leaving a routine).
... the first line of the data dump shows that no width has yet been assigned to the columns mcolwidths=-1 -1 -1 -1, -1 stands for: #define width_not_set -1 this is followed by a reference to the column frame pointers: col frame cache -> 0=00b9313
8 1=00b931f0 2=024dd72
8 3=024dd7
80 this is followed by the information which width has been set for each column.
...And 5 more matches
Simple Thunderbird build
8 gb or more is recommended.
...you should copy 17 of the 1
8 header files to a windows sdk include directory so that the build process will find the files, that is c:\program files (x
86)\windows kits\10\include\10.0.nnnnn.0\shared, where nnnnn is the highest number present on the system.
... note that the downloaded outlook 2010 mapi header files contain 1
8 fies, of which only 17 are needed.
...And 5 more matches
DeferredTask.jsm
firefox 2
8 note interface was changed in firefox 2
8, and old methods were removed.
... the deferredtask constructor requires gecko 1
8.0(firefox 1
8.0 / thunderbird 1
8.0 / seamonkey 2.15) if you have a function call you want to defer for two seconds, you can do so using the deferredtask constructor, like this: var task = new deferredtask(myfunction, 2000); you can also pass a generator function as the first argument of constructor.
... method overview bool ispending();obsolete since gecko 2
8 void start();obsolete since gecko 2
8 void flush();obsolete since gecko 2
8 void cancel();obsolete since gecko 2
8 void arm(); void disarm(); promise finalize(); attributes isarmed boolean indicates whether the task is currently requested to start again later, regardless of whether it is currently running.
...And 5 more matches
TimerFirings logging
-991946
880[7f46c365ba00]: [6775] fn timer (slack 100 ms): layeractivitytracker -991946
880[7f46c365ba00]: [6775] fn timer (one_shot 250 ms): presshell::spaintsuppressioncallback -991946
880[7f46c365ba00]: [6775] fn timer (one_shot 160 ms): nsbrowserstatusfilter::timeouthandler -991946
880[7f46c365ba00]: [6775] iface timer (one_shot 200 ms): 7f46964d7f
80 -13406435
84[7f46c365ec00]: [6775] ...
... -991946
880[7f46c365ba00]: [6775] fn timer (one_shot 0 ms): [content] chrome://browser/content/tabbrowser.xml:1
816:0 71163756
8[7f3219c4
8000]: [6
835] fn timer (one_shot 100 ms): [content] http://edition.cnn.com/:5:7231 71163756
8[7f3219c4
8000]: [6
835] fn timer (one_shot 100 ms): [content] http://a.visualrevenue.com/vrs.js:6:9423 these js timers are annotated with [content] and show the jav...
... 20
82435
840[100445640]: [
81190] fn timer (one_shot
8000 ms): [from dladdr] gfxfontinfoloader::delayedstartcallback(nsitimer*, void*) second, on linux the code uses dladdr to get the symbol library and address, which can be post-processed by tools/rb/fix_stacks.py.
...And 5 more matches
NSS_3.12.1_release_notes.html
nss 3.12.1 release notes 200
8-09-05 newsgroup: mozilla.dev.tech.crypto contents introduction distribution information new in nss 3.12.1 bugs fixed documentation compatibility feedback introduction network security services (nss) 3.12.1 is a patch release for nss 3.12.
... new in nss 3.12.1 new functions in the nss shared library: cert_nametoasciiinvertible (see cert.h) convert an certname into its rfc14
85 encoded equivalent.
... bug 67
890: create self-signed cert with existing key that signed csr bug 129303: nss needs to expose interfaces to deal with multiple token sources of certs.
...And 5 more matches
NSS 3.21 release notes
nss 3.21 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_21_rtm/src/ security fixes in nss 3.21 bug 115
84
89 / cve-2015-7575 - prevent md5 downgrade in tls 1.2 signatures.
... new in nss 3.21 new functionality certutil now supports a --rename option to change a nickname (bug 1142209) tls extended master secret extension (rfc 7627) is supported (bug 1117022) new info functions added for use during mid-handshake callbacks (bug 10
84669) new functions in nss.h nss_optionset - sets nss global options nss_optionget - gets the current value of nss global options in secmod.h secmod_createmoduleex - create a new secmodmodule structure from module name string, module parameters string, nss specific parameters string, and nss configuration parameter string.
...linfo to indicate that a tls version has been selected ssl_preinfo_cipher_suite - used with sslpreliminarychannelinfo to indicate that a tls cipher suite has been selected ssl_preinfo_all - used with sslpreliminarychannelinfo to indicate that all preliminary information has been set notable changes in nss 3.21 nss now builds with elliptic curve ciphers enabled by default (bug 12056
88) nss now builds with warnings as errors (bug 11
82667) the following ca certificates were removed cn = verisign class 4 public primary certification authority - g3 sha1 fingerprint: c
8:ec:
8c:
87:92:69:cb:4b:ab:39:e9:
8d:7e:57:67:f3:14:95:73:9d cn = utn-userfirst-network applications sha1 fingerprint: 5d:9
8:9c:db:15:96:11:36:51:65:64:1b:56:0f:db:ea:2a:c2:3e:f1...
...And 5 more matches
NSS 3.56 release notes
nss 3.56 requires nspr 4.2
8 or newer.
... notable changes in nss 3.56 nspr dependency updated to 4.2
8.
... bugs fixed in nss 3.56 bug 1650702 - support sha-1 hw acceleration on armv
8 bug 16569
81 - use mpi comba and mulq optimizations on x
86-64 macos.
...And 5 more matches
NSS tools : pk12util
pk12util supports two types of databases: the legacy security databases (cert
8.db, key3.db, and secmod.db) and new sqlite databases (cert9.db, key4.db, and pkcs11.txt).
... return codes o 0 - no error o 1 - user cancelled o 2 - usage error o 6 - nls init error o
8 - certificate db open error o 9 - key db open error o 10 - file initialization error o 11 - unicode conversion error o 12 - temporary file creation error o 13 - pkcs11 get slot error o 14 - pkcs12 decoder start error o 15 - error read from import file o 16 - pkcs12 decode error o 17 - pkcs12 decoder verify error o 1
8 - pkcs12 decoder validate bags error o 19 - pkcs12 decoder import bag...
...s error o 20 - key db conversion version 3 to version 2 error o 21 - cert db conversion version 7 to version 5 error o 22 - cert and key dbs patch error o 23 - get default cert db error o 24 - find cert by nickname error o 25 - create export context error o 26 - pkcs12 add password itegrity error o 27 - cert and key safes creation error o 2
8 - pkcs12 add cert and key error o 29 - pkcs12 encode error examples importing keys and certificates the most basic usage of pk12util for importing a certificate or key is the pkcs#12 input file (-i) and some way to specify the security database being accessed (either -d for a directory or -h for a token).
...And 5 more matches
JS_EncodeString
this article covers features introduced in spidermonkey 1.
8 convert a javascript string to a c string.
... syntax char * js_encodestring(jscontext *cx, jsstring *str); char * js_encodestringtoutf
8(jscontext *cx, js::handlestring str); // added in spidermonkey 24 name type description cx jscontext * a context.
... description js_encodestring and js_encodestringtoutf
8 convert the specified javascript str to a c string (an array of
8-bit chars).
...And 5 more matches
nsICryptoHash
the hash algorithms supported are md2, md5, sha-1, sha-256, sha-3
84, and sha-512.
... 1.0 66 introduced gecko 1.
8 inherits from: nsisupports last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) method overview acstring finish(in prbool aascii); void init(in unsigned long aalgorithm); void initwithstring(in acstring aalgorithm); void update([const, array, size_is(alen)] in octet adata, in unsigned long alen); void updatefromstream(in nsiinputstream astream, in unsigned long alen); constants hash algorithms these constants are used by the init() method to indicate which hashing function to use.
... constant value description md2 1 message digest algorithm 2 md5 2 message-digest algorithm 5 sha1 3 secure hash algorithm 1 sha256 4 secure hash algorithm 256 sha3
84 5 secure hash algorithm 3
84 sha512 6 secure hash algorithm 512 methods finish() completes the hash object and produces the actual hash data.
...And 5 more matches
nsIDocumentLoader
inherits from: nsisupports last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) implemented by: @mozilla.org/docloaderservice;1.
... to create an instance, use: var documentloader = components.classes["@mozilla.org/docloaderservice;1"] .createinstance(components.interfaces.nsidocumentloader); method overview void clearparentdocloader(); obsolete since gecko 1.
8 void createdocumentloader(out nsidocumentloader aninstance); obsolete since gecko 1.
8 void destroy(); obsolete since gecko 1.
8 void fireonlocationchange(in nsiwebprogress awebprogress, in nsirequest arequest, in nsiuri auri); obsolete since gecko 1.
8 void fireonstatuschange(in nsiwebprogress awebprogress, in nsirequest arequest, in nsresult astatus, in wstring amessage); obsolete since gecko 1.
8 void getcontentviewercontainer(in nsisupports adocumentid, out nsicontentviewercontainer aresu...
...obsolete since gecko 1.
8 nsiloadgroup getloadgroup(); obsolete since gecko 1.
8 boolean isbusy(); obsolete since gecko 1.
8 void stop(); attributes attribute type description container nsisupports read only.
...And 5 more matches
nsIDownloadManager
ring adisplayname, in nsimimeinfo amimeinfo, in prtime astarttime, in nsilocalfile atempfile, in nsicancelable acancelable, in boolean aisprivate); void addlistener(in nsidownloadprogresslistener alistener); void canceldownload(in unsigned long aid); void cleanup(); void endbatchupdate(); obsolete since gecko 1.9.1 void flush(); obsolete since gecko 1.
8 nsidownload getdownload(in unsigned long aid); void onclose(); obsolete since gecko 1.9.1 void open(in nsidomwindow aparent, in nsidownload adownload); obsolete since gecko 1.9.1 void openprogressdialogfor(in nsidownload adownload, in nsidomwindow aparent, in boolean acanceldownloadonclose); obsolete since gecko 1.9.1 void pausedownload(in unsigned l...
...ong aid); void removedownload(in unsigned long aid); void removedownloadsbytimeframe(in long long abegintime, in long long aendtime); void removelistener(in nsidownloadprogresslistener alistener); void resumedownload(in unsigned long aid); void retrydownload(in unsigned long aid); void savestate(); obsolete since gecko 1.
8 void startbatchupdate(); obsolete since gecko 1.9.1 attributes attribute type description activedownloadcount long the number of files currently being downloaded.
...obsolete since gecko 1.
8 dbconnection mozistorageconnection the database connection to the downloads database.
...And 5 more matches
nsIINIParser
inherits from: nsisupports last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) typically, you'll create an nsiiniparser object by calling nsiiniparserfactory.createiniparser().
... nsiutf
8stringenumerator getkeys(in autf
8string asection); nsiutf
8stringenumerator getsections(); autf
8string getstring(in autf
8string asection, in autf
8string akey); methods getkeys() returns an nsiutf
8stringenumerator providing the keys available within the specified section of the ini file.
... nsiutf
8stringenumerator getkeys( in autf
8string asection ); parameters asection the name of the section whose keys you wish to enumerate.
...And 5 more matches
nsIAbCard/Thunderbird3
ersarymonth, anniversaryday birthyear, birthmonth, birthday webpage1 (work), webpage2 (home) custom1, custom2, custom3, custom4 notes integral properties: lastmodifieddate popularityindex prefermailformat (see nsiabprefermailformat) boolean properties: allowremotecontent inherits from: nsiabitem method overview nsivariant getproperty(in autf
8string name, in nsivariant defaultvalue); [noscript] astring getpropertyasastring(in string name); [noscript] autf
8string getpropertyasautf
8string(in string name); [noscript] pruint32 getpropertyasuint32(in string name); [noscript] boolean getpropertyasbool(in string name); void setproperty(in autf
8string name, in nsivariant value); [noscript] ...
...void setpropertyasastring(in string name, in astring value); [noscript] void setpropertyasautf
8string(in string name, in autf
8string value); [noscript] void setpropertyasuint32(in string name, in pruint32 value); [noscript] void setpropertyasbool(in string name, in boolean value); void deleteproperty(in autf
8string name); autf
8string translateto(in autf
8string atype); void copy(in nsiabcard srccard) boolean equals(in nsiabcard card) astring generatephoneticname(in boolean alastnamefirst) attributes attribute type description properties nsisimpleenumerator readonly: a list of all the properties that this card has as an enumerator, whose members are all nsiproperty objects.
... nsivariant getproperty(in autf
8string name, in nsivariant defaultvalue); parameters name the case-sensitive name of the property to get.
...And 5 more matches
Using COM from js-ctypes
basis and reference for this article bugzilla :: bug 73
8501 - implement ability to create windows shortcuts from javascript - comment 4 relavent topic bugzilla :: bug 505907 - support c++ calling from jsctypes converting com code to c code to convert com code to js-ctypes, we need to write c++ vtable pointers in c.
... let { ctypes } = components.utils.import("resource://gre/modules/ctypes.jsm", {}); // some groundwork let is64bit; if (ctypes.voidptr_t.size == 4 /* 32-bit */) { is64bit = false; } else if (ctypes.voidptr_t.size ==
8 /* 64-bit */) { is64bit = true; } let winabi = is64bit ?
...d_short; let wchar = ctypes.jschar; // advanced types - based on simple types let hresult = long; let lpcwstr = wchar.ptr; // guess types - these just work i couldnt find a proper defintion for it let lpunknown = ctypes.voidptr_t; // structures // simple structures let guid = ctypes.structtype('guid', [ { 'data1': ulong }, { 'data2': ushort }, { 'data3': ushort }, { 'data4': byte.array(
8) } ]); // advanced structures let clsid = guid; let iid = guid; // super advanced structures let refiid = iid.ptr; let refclsid = clsid.ptr; // vtables let ispvoicevtbl = ctypes.structtype('ispvoicevtbl'); let ispvoice = ctypes.structtype('ispvoice', [{ 'lpvtbl': ispvoicevtbl.ptr }]); ispvoicevtbl.define([ // start inherit from iunknown { 'queryinterface': ctypes.voidptr_t }, {...
...And 5 more matches
Using Objective-C from js-ctypes
nsstring* text = [nsstring initwithcstring: "hello, firefox!" encoding: nsutf
8stringencoding]; this will be converted into the following c code.
... nsutf
8stringencoding is defined as 4.
... id nsstring = (id)objc_getclass("nsstring"); sel initwithcstring_encoding = sel_registername("initwithcstring:encoding:"); int nsutf
8stringencoding = 4; id tmp = objc_msgsend(nsstring, alloc); id text = objc_msgsend(tmp, initwithcstring_encoding, "hello, firefox!", nsutf
8stringencoding); note that you need to release this allocated nsstring instance.
...And 5 more matches
Network request details - Firefox Developer Tools
the screenshots and descriptions in this section reflect firefox 7
8.
...ll, the entire header is copied in json format, giving you something like this (after running the results through a json validator): { "response headers (1.113 kb)": { "headers": [ { "name": "accept-ranges", "value": "bytes" }, { "name": "age", "value": "0" }, { "name": "backend-timing", "value": "d=74716 t=156025
8099074460" }, { "name": "cache-control", "value": "private, must-revalidate, max-age=0" }, { "name": "content-disposition", "value": "inline; filename=api-result.js" }, { "name": "content-encoding", "value": "gzip" }, { "name": "content-length", "value": "673" }, { "n...
...ame": "content-type", "value": "text/javascript; charset=utf-
8" }, { "name": "date", "value": "tue, 11 jun 2019 13:01:39 gmt" }, { "name": "mediawiki-login-suppressed", "value": "true" }, { "name": "p3p", "value": "cp=\"this is not a p3p policy!
...And 5 more matches
Drawing shapes with canvas - Web APIs
to convert degrees to radians you can use the following javascript expression: radians = (math.pi/1
80)*degrees.
...the endangle starts at 1
80 degrees (half a circle) in the first column and is increased by steps of 90 degrees, culminating in a complete circle in the last column.
... id="canvas" width="150" height="150"></canvas> </body> </html> function draw() { var canvas = document.getelementbyid('canvas'); if (canvas.getcontext) { var ctx = canvas.getcontext('2d'); // cubic curves example ctx.beginpath(); ctx.moveto(75, 40); ctx.beziercurveto(75, 37, 70, 25, 50, 25); ctx.beziercurveto(20, 25, 20, 62.5, 20, 62.5); ctx.beziercurveto(20,
80, 40, 102, 75, 120); ctx.beziercurveto(110, 102, 130,
80, 130, 62.5); ctx.beziercurveto(130, 62.5, 130, 25, 100, 25); ctx.beziercurveto(
85, 25, 75, 37, 75, 40); ctx.fill(); } } screenshotlive sample rectangles in addition to the three methods we saw in drawing rectangles, which draw rectangular shapes directly to the canvas, there's also the rect() method, which adds a recta...
...And 5 more matches
Permissions - Web APIs
safari ios no support nosamsung internet android full support
8.0accessibility-events permissionchrome full support 62edge full support 79firefox ?
... safari ios no support nosamsung internet android full support
8.0ambient-light-sensor permissionchrome full support 62edge full support 79firefox ?
... safari ios no support nosamsung internet android full support
8.0background-sync permissionchrome full support 62edge full support 79firefox ?
...And 5 more matches
TextDecoder() - Web APIs
syntax decoder = new textdecoder(utflabel, options); parameters utflabeloptional is a domstring, defaulting to "utf-
8", containing the label of the encoder.
... each label is associated with a specific encoding type: possible values of utflabel encoding "unicode-1-1-utf-
8", "utf-
8", "utf
8" 'utf-
8' "
866", "cp
866", "csibm
866", "ibm
866" 'ibm
866' "csisolatin2", "iso-
8859-2", "iso-ir-101", "iso
8859-2", "iso
88592", "iso_
8859-2", "iso_
8859-2:19
87", "l2", "latin2" 'iso-
8859-2' "csisolatin3", "iso-
8859-3", "iso-ir-109", "iso
8859-3", "iso
88593", "iso_
8859-3", "iso_
8859-3:19
88", "l3", "latin3" 'iso-
8859-3' "csisolatin4", "iso-
8859-4", "iso-ir-110", "iso
8859-4", "iso
88594", "iso_
8859-4", "iso_
8859-4:19
88", "l4", "latin4" 'iso-
8859-4' "csisolatincyrillic", "cyrillic", "iso-
8859-5", "iso-ir-144", "iso
88595", "iso_
8859-5", "iso_
8859-5:19
88" 'iso...
...-
8859-5' "arabic", "asmo-70
8", "csiso
88596e", "csiso
88596i", "csisolatinarabic", "ecma-114", "iso-
8859-6", "iso-
8859-6-e", "iso-
8859-6-i", "iso-ir-127", "iso
8859-6", "iso
88596", "iso_
8859-6", "iso_
8859-6:19
87" 'iso-
8859-6' "csisolatingreek", "ecma-11
8", "elot_92
8", "greek", "greek
8", "iso-
8859-7", "iso-ir-126", "iso
8859-7", "iso
88597", "iso_
8859-7", "iso_
8859-7:19
87", "sun_eu_greek" 'iso-
8859-7' "csiso
8859
8e", "csisolatinhebrew", "hebrew", "iso-
8859-
8", "iso-
8859-
8-e", "iso-ir-13
8", "iso
8859-
8", "iso
8859
8", "iso_
8859-
8", "iso_
8859-
8:19
88", "visual" 'iso-
8859-
8' "csiso
8859
8i", "iso-
8859-
8-i", "logical" 'iso-
8859-
8i' "csisolatin6", "iso-
8859-10", "iso-ir-157", "iso
8859-10", "iso
885910", "l6", "latin6" 'iso-
8859-10...
...And 5 more matches
Visualizations with Web Audio API - Web APIs
the analyser node will then capture audio data using a fast fourier transform (fft) in a certain frequency domain, depending on what you specify as the analysernode.fftsize property value (if no value is specified, the default is 204
8.) note: you can also specify a minimum and maximum power value for the fft data scaling range, using analysernode.mindecibels and analysernode.maxdecibels, and different data averaging constants using analysernode.smoothingtimeconstant.
...the first one produces 32-bit floating point numbers, and the second and third ones produce
8-bit unsigned integers, therefore a standard javascript array won't do — you need to use a float32array or uint
8array array, depending on what data you are handling.
... so for example, say we are dealing with an fft size of 204
8.
...And 5 more matches
text-overflow - CSS: Cascading Style Sheets
css value direction: ltr direction: rtl expected result live result expected result live result visible overflow 1234567
890 1234567
890 09
87654321 1234567
890 text-overflow: clip 1234567
890 1234567
890 text-overflow: '' 12345 1234567
890 54321 1234567
890 text-overflow: ellipsis 1234… 1234567
890 …4321 1234567
890 text-overflow: '.' 1234.
... 1234567
890 .4321 1234567
890 text-overflow: clip clip 123456 1234567
890 654321 1234567
890 text-overflow: clip ellipsis 1234… 1234567
890 6543… 1234567
890 text-overflow: clip '.' 1234.
... 1234567
890 6543.
...And 5 more matches
<input type="tel"> - HTML: Hypertext Markup Language
here, we have an tel input with the placeholder 123-4567-
8901.
... <input id="telno" name="telno" type="tel" placeholder="123-4567-
8901"> controlling the input size you can control not only the physical length of the input box, but also the minimum and maximum lengths allowed for the input text itself.
...<div> <button>submit</button> </div> </form> and let's include the following css to highlight valid entries with a checkmark and invalid entries with a cross: div { margin-bottom: 10px; position: relative; } input[type="number"] { width: 100px; } input + span { padding-right: 30px; } input:invalid+span:after { position: absolute; content: '✖'; padding-left: 5px; color: #
8b0000; } input:valid+span:after { position: absolute; content: '✓'; padding-left: 5px; color: #009000; } the output looks like this: pattern validation if you want to further restrict entered numbers so they also have to conform to a specific pattern, you can use the pattern attribute, which takes as its value a regular expression that entered values have to match.
...And 5 more matches
<nextid>: The NeXT ID element (Obsolete) - HTML: Hypertext Markup Language
next would then add, within the header of the html document, a special tag, <nextid n="z
8">, to inform where to continue its naming convention.
...when opening the document, the next editor finds and reads this <nextid n="z
8"> tag, and now knows to give the first of these new sections the name of z
8 in the table of contents, and z14 to the content body.
...as applicable for the head of this document> <nextid n="z20"> </head> <body> <a name="z0" href="#z4">first section heading</a> <a name="z1" href="#z5">second section heading</a> <a name="z
8" href="#z14">newly inserted third section heading</a> <a name="z9" href="#z15">newly inserted fourth section heading</a> <a name="z2" href="#z6">original third (now fifth) section heading</a> <a name="z3" href="#z7">original fourth (now sixth) section heading</a> <a name="z10" href="#z16">seventh section heading</a> <a name="z11" href="#z17">eighth section heading</a> <a name="z12" href="#z1
8">nint...
...And 5 more matches
Evolution of HTTP - HTTP
developed by tim berners-lee and his team between 19
89-1991, http has seen many changes, keeping most of the simplicity and further shaping its flexibility.
... invention of the world wide web in 19
89, while he was working at cern, tim berners-lee wrote a proposal to build a hypertext system over the internet.
... at this point, a typical request and response looked like this: get /mypage.html http/1.0 user-agent: ncsa_mosaic/2.0 (windows 3.1) 200 ok date: tue, 15 nov 1994 0
8:12:31 gmt server: cern/3.0 libwww/2.17 content-type: text/html <html> a page with an image <img src="/myimage.gif"> </html> followed by a second connection and request to fetch the image (followed by a response to that request): get /myimage.gif http/1.0 user-agent: ncsa_mosaic/2.0 (windows 3.1) 200 ok date: tue, 15 nov 1994 0
8:12:32 gmt server: cern/3.0 libwww/2.17 content-type: text/gif (...
...And 5 more matches
Cross-Origin Resource Sharing (CORS) - HTTP
e client and the server, using cors headers to handle the privileges: let's look at what the browser will send to the server in this case, and let's see how the server responds: get /resources/public-data/ http/1.1 host: bar.other user-agent: mozilla/5.0 (macintosh; intel mac os x 10.14; rv:71.0) gecko/20100101 firefox/71.0 accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.
8 accept-language: en-us,en;q=0.5 accept-encoding: gzip,deflate connection: keep-alive origin: https://foo.example the request header of note is origin, which shows that the invocation is coming from https://foo.example.
... http/1.1 200 ok date: mon, 01 dec 200
8 00:23:53 gmt server: apache/2 access-control-allow-origin: * keep-alive: timeout=2, max=100 connection: keep-alive transfer-encoding: chunked content-type: application/xml […xml data…] in response, the server sends back an access-control-allow-origin header.
...the first exchange is the preflight request/response: options /doc http/1.1 host: bar.other user-agent: mozilla/5.0 (macintosh; intel mac os x 10.14; rv:71.0) gecko/20100101 firefox/71.0 accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.
8 accept-language: en-us,en;q=0.5 accept-encoding: gzip,deflate connection: keep-alive origin: http://foo.example access-control-request-method: post access-control-request-headers: x-pingother, content-type http/1.1 204 no content date: mon, 01 dec 200
8 01:15:39 gmt server: apache/2 access-control-allow-origin: https://foo.example access-control-allow-methods: post, get, options access-control-a...
...And 5 more matches
List of default Accept values - HTTP
user agent value comment firefox text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.
8 (since firefox 66) text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.
8 (in firefox 65) text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.
8 (before) in firefox 65 and earlier, this value can be modified using the network.http.accept.default parameter.
... (source) safari, chrome text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.
8 (source) safari 5 text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.
8 this is an improvement over earlier accept headers as it no longer ranks image/png above text/html internet explorer
8 image/jpeg, application/x-ms-application, image/gif, application/xaml+xml, image/pjpeg, application/x-ms-xbap, application/x-shockwave-flash, application/msword, */* see ie and the accept header (ieinternals' msdn blog).
... user agent value comment firefox image/webp,*/* (since firefox 65) */* (since firefox 47) image/png,image/*;q=0.
8,*/*;q=0.5 (before) this value can be modified using the image.http.accept parameter.
...And 5 more matches
Firefox user agent string reference - HTTP
windows version gecko user agent string windows nt on x
86 cpu mozilla/5.0 (windows nt x.y; rv:10.0) gecko/20100101 firefox/10.0 windows nt on x64 cpu mozilla/5.0 (windows nt x.y; win64; x64; rv:10.0) gecko/20100101 firefox/10.0 macintosh here, x.y is the version of mac os x (for instance, mac os x 10.6).
... mac os x version gecko user agent string mac os x on intel x
86 or x
86_64 mozilla/5.0 (macintosh; intel mac os x x.y; rv:10.0) gecko/20100101 firefox/10.0 mac os x on powerpc mozilla/5.0 (macintosh; ppc mac os x x.y; rv:10.0) gecko/20100101 firefox/10.0 linux linux is a more diverse platform.
... linux version gecko user agent string linux desktop on i6
86 cpu mozilla/5.0 (x11; linux i6
86; rv:10.0) gecko/20100101 firefox/10.0 linux desktop on x
86_64 cpu mozilla/5.0 (x11; linux x
86_64; rv:10.0) gecko/20100101 firefox/10.0 nokia n900 linux mobile, on the fennec browser mozilla/5.0 (maemo; linux armv7l; rv:10.0) gecko/20100101 firefox/10.0 fennec/10.0 android (version 40 and below) form factor gecko user agent string phone mozilla/5.0 (android; mobile; rv:40.0) gecko/40.0 firefox/40.0 tablet mozilla/5.0 (android; tablet; rv:40.0) gecko/40.0 firefox/40.0 ...
...And 5 more matches
TypedArray - JavaScript
it is only directly accessible through object.getprototypeof(int
8array) and similar.
...int
8array), an array buffer is created internally in memory or, if an arraybuffer object is given as constructor argument, then this is used instead.
... typedarray objects type value range size in bytes description web idl type equivalent c type int
8array -12
8 to 127 1
8-bit two's complement signed integer byte int
8_t uint
8array 0 to 255 1
8-bit unsigned integer octet uint
8_t uint
8clampedarray 0 to 255 1
8-bit unsigned integer (clamped) octet uint
8_t int16array -3276
8 to 32767 2 16-bit two's complement signed integer short int16_t uint16array 0 to 65535 2 16-bit unsigned integer unsigned short uint16_t ...
...And 5 more matches
JavaScript typed arrays - JavaScript
each entry in a javascript typed array is a raw binary value in one of a number of supported formats, from
8-bit integers to 64-bit floating-point numbers.
... typed array views typed array views have self-descriptive names and provide views for all the usual numeric types like int
8, uint32, float64 and so forth.
... there is one special typed array view, the uint
8clampedarray.
...And 5 more matches
<metadata> - SVG: Scalable Vector Graphics
example <svg width="400" viewbox="0 0 400 300" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <metadata> <rdf:rdf xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:connect="http://www.w3.org/1999/0
8/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"> <connect:ends rdf:resource="#socket2"/> <connect:ends rdf:resource="#computerb"/> </rdf:description> <rdf:description about="#cablen"> ...
...used by hub symbol --> <symbol id="hubplug"> <desc>a 10baset/100basetx socket</desc> <path d="m0,10 h5 v-9 h12 v9 h5 v16 h-22 z"/> </symbol> <!-- hub symbol --> <symbol id="hub"> <desc>a typical 10baset/100basetx network 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 xlink:href="#hubplug"/> </g> <g id="socket2" transform="translate(70 20)"> <title>socket 2</title> ...
...ink: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="m
80,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 fill="lightgrey" width="13
8" height="95" x="11" y="12"/> </g> <g id="processor" transform="translate(0 142)"> <title>the computer</title> ...
...And 5 more matches
Forms related code snippets - Archive of obsolete content
date picker (before implementing it in a working environment, please read the note about the const statement compatibility) <!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-
8" /> <title>datepicker example - mdn</title> <script type="text/javascript"> /*\ |*| |*| datepicker example mdndeveloper network |*| |*| https://developer.mozilla.org/docs/code_snippets/forms |*| https://developer.mozilla.org/user:fusionchess |*| |*| this snippet is released under the gnu public license, version 3 or later.
...0; nitem < nlen; new datepicker(afields[nitem++])); } const /* customizable by user */ sprefs = "zdp"; sdpclass = "date-picker", smonthsnames = ["jan", "feb", "mar", "apr", "may", "jun", "jul", "aug", "sep", "oct", "nov", "dec"], sdays = ["m", "t", "w", "t", "f", "s", "s"], bzeroismonday = true, /* internal usage */ ainstances = [], amonthlengths = [31, 2
8, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31], rbgnnan = /^\d+/, rbgnandend = /^\d+|\d+\d+$/g, rmonth = /\-month\-/, rdecrease = /\-decr\-/; var /* customizable by user */ nzindex = 1000; window.addeventlistener ?
...it is supported in firefox & chrome (v
8) and partially supported in opera 9+ and safari.
...And 4 more matches
Install Manifests - Archive of obsolete content
layout the basic layout of an install manifest is like so: <?xml version="1.0" encoding="utf-
8"?> <rdf xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:em="http://www.mozilla.org/2004/em-rdf#"> <description about="urn:mozilla:install-manifest"> <!-- properties --> </description> </rdf> some properties are required, some are optional.
... examples <em:targetapplication> <description> <em:id>{ec
8030f7-c20a-464f-9b0e-13a3a9e973
84}</em:id> <!--firefox--> <em:minversion>1.5</em:minversion> <em:maxversion>3.0.*</em:maxversion> </description> </em:targetapplication> gecko 1.9 based applications allow you to use the special targetapplication id toolkit@mozilla.org to say that the add-on is compatible with any toolkit app with a toolkit version matching the minversion and maxversion.
... 2 extensions 4 themes
8 locale 32 multiple item package 64 spell check dictionary 12
8 telemetry experiment 256 webextension experiment examples <em:type>2</em:type> this property was added for firefox 1.5, and is only required for add-on types other than extensions and themes.
...And 4 more matches
jspage - Archive of obsolete content
var mootools={version:"1.2.4",build:"0d9113241a90b9cd5643b926795
852a2026710d4"};var native=function(k){k=k||{};var a=k.name;var i=k.legacy;var b=k.protect; var c=k.implement;var h=k.generics;var f=k.initialize;var g=k.afterimplement||function(){};var d=f||i;h=h!==false;d.constructor=native;d.$family={name:"native"}; if(i&&f){d.prototype=i.prototype;}d.prototype.constructor=d;if(a){var e=a.tolowercase();d.prototype.$family={name:e};native.typize(d,e);}var j=function(n,l,o,m){if(!b||m||!n.prototype[l]){n.prototype[l]=o; }if(h){native.genericize(n,l,b);}g.call(n,l,o);return n;};d.alias=function(n,l,p){if(typeof n=="string"){var o=this.prototype[n];if((n=o)){return j(this,l,n,p); }}for(var m in n){this.alias(m,n[m],l);}return this;};d.implement=function(m,l,o){if(typeof m=="string"){ret...
...mentsbyclassname)?950:925)); },trident:function(){return(!window.activexobject)?false:((window.xmlhttprequest)?((document.queryselectorall)?6:5):4);},webkit:function(){return(navigator.taintenabled)?false:((browser.features.xpath)?((browser.features.query)?525:420):419); },gecko:function(){return(!document.getboxobjectfor&&window.mozinnerscreenx==null)?false:((document.getelementsbyclassname)?19:1
8);}}},browser||{});browser.platform[browser.platform.name]=true; browser.detect=function(){for(var b in this.engines){var a=this.engines[b]();if(a){this.engine={name:b,version:a};this.engine[b]=this.engine[b+a]=true; break;}}return{name:b,version:a};};browser.detect();browser.request=function(){return $try(function(){return new xmlhttprequest();},function(){return new activexobject("msxml2.xmlhttp...
...ment; break;case"mouseout":l=a.relatedtarget||a.toelement;}if(!(function(){while(l&&l.nodetype==3){l=l.parentnode;}return true;}).create({attempt:browser.engine.gecko})()){l=false; }}}}return $extend(this,{event:a,type:j,page:i,client:c,rightclick:e,wheel:h,relatedtarget:l,target:g,code:b,key:m,shift:a.shiftkey,control:a.ctrlkey,alt:a.altkey,meta:a.metakey}); }});event.keys=new hash({enter:13,up:3
8,down:40,left:37,right:39,esc:27,space:32,backspace:
8,tab:9,"delete":46});event.implement({stop:function(){return this.stoppropagation().preventdefault(); },stoppropagation:function(){if(this.event.stoppropagation){this.event.stoppropagation();}else{this.event.cancelbubble=true;}return this;},preventdefault:function(){if(this.event.preventdefault){this.event.preventdefault(); }else{this.event.retu...
...And 4 more matches
Reading textual data - Archive of obsolete content
xxx: document nsiunicharstreamlistener (gecko 1.
8) xxx: also document nsistreamlistener here?
... converting read data if you read data from nsiscriptableinputstream as described on the file i/o code snippets page, you can convert it to utf-
8 // sstream is nsiscriptableinputstream var str = sstream.read(4096); var utf
8converter = components.classes["@mozilla.org/intl/utf
8converterservice;1"].
... getservice(components.interfaces.nsiutf
8converterservice); var data = utf
8converter.converturispectoutf
8 (str, "utf-
8"); gecko 1.
8 and newer reading strings starting with gecko 1.
8 (seamonkey 1.0, firefox 1.5), you can use nsiconverterinputstream to read strings from a stream (nsiinputstream).
...And 4 more matches
Writing textual data - Archive of obsolete content
some character encodings (utf-
8, utf-16, utf-32) can represent "all" characters (the full repertoire of unicode) while others can only represent a subset of the full repertoire.
... when the file is to be read only by the application/extension itself, using utf-
8 is often the best choice — it can represent all characters, and ascii characters are represented efficiently.
... writing to a stream in gecko 1.
8 (seamonkey 1.0, firefox 1.5), you can use nsiconverteroutputstream: var charset = "utf-
8"; // can be any character encoding name that mozilla supports var os = components.classes["@mozilla.org/intl/converter-output-stream;1"] .createinstance(components.interfaces.nsiconverteroutputstream); // this assumes that fos is the nsioutputstream you want to write to os.init(fos, charset, 0, 0x0000); os.writestring("umlaute: \u00fc \u00e4\n"); os.writestring("hebrew: \u05d0 \u05d1\n"); // etc.
...And 4 more matches
International characters in XUL JavaScript - Archive of obsolete content
gecko 1.
8, as used in firefox 1.5 and other applications, added support for non-ascii characters in javascript files loaded from xul files.
... earlier versions always interpreted js files loaded from xul as iso-
8859-1 (latin-1), in both local and remote cases.
... how the character encoding is determined in gecko 1.
8 and later when the javascript file is loaded from a chrome:// url, a byte order mark (fixme: )(bom) is used to determine the character encoding of the script.
...And 4 more matches
XULRunner tips - Archive of obsolete content
xulrunner 1.
8.0 does not load extensions from the application directory; only the xulrunner directory and the user profile directory are checked.
...://mozapps/content/extensions/extensions.xul?type=themes"); pref("xpinstall.dialog.progress.chrome", "chrome://mozapps/content/extensions/extensions.xul?type=extensions"); pref("xpinstall.dialog.progress.type.skin", "extension:manager-themes"); pref("xpinstall.dialog.progress.type.chrome", "extension:manager-extensions"); pref("extensions.update.enabled", true); pref("extensions.update.interval",
86400); pref("extensions.dss.enabled", false); pref("extensions.dss.switchpending", false); pref("extensions.ignoremtimechanges", false); pref("extensions.logging.enabled", false); pref("general.skins.selectedskin", "classic/1.0"); // nb these point at amo pref("extensions.update.url", "chrome://mozapps/locale/extensions/extensions.properties"); pref("extensions.getmoreextensionsurl", "chrome://moz...
...in addition, a branding content package must be registered to include the application logos: content branding chrome/branding/ 3 files should be provided in this folder: about.png, icon4
8.png and icon64.png.
...And 4 more matches
2006-11-24 - Archive of obsolete content
summary: mozilla.dev.builds - november 17th to november 24th 2006 trouble building xulrunner 1.
8.4 on winxp using mingw32 november 20th: joe is trying to build xulrunner using the ming compiler on windowsxp.
... he is using make 3.
80, working with the source tarball for xulrunner 1.
8.4,running "make -f client.mk distclean" followed by "make -f client.mk build_all".
... luke is migrating all of his code to compile with vc
8 and is having some problems.
...And 4 more matches
2D maze game with device orientation - Game development
you can create this yourself if you want to follow along: <!doctype html> <html> <head> <meta charset="utf-
8" /> <title>cyber orb demo</title> <style> body { margin: 0; background: #333; } </style> <script src="src/phaser-arcade-physics.2.2.2.min.js"></script> <script src="src/boot.js"></script> <script src="src/preloader.js"></script> <script src="src/mainmenu.js"></script> <script src="src/howto.js"></script> <script src="src/game.js"></script> </head> <body> <script> (...
...function() { var game = new phaser.game(320, 4
80, phaser.canvas, 'game'); game.state.add('boot', ball.boot); game.state.add('preloader', ball.preloader); game.state.add('mainmenu', ball.mainmenu); game.state.add('howto', ball.howto); game.state.add('game', ball.game); game.state.start('boot'); })(); </script> </body> </html> so far we have a simple html website with some basic content in the <head> section: charset, title, css styling and the inclusion of the javascript files.
... var game = new phaser.game(320, 4
80, phaser.canvas, 'game'); the line above will initialize the phaser instance — the arguments are the width of the canvas, height of the canvas, rendering method (we're using canvas, but there are also webgl and auto options available) and the optional id of the dom container we want to put the canvas in.
...And 4 more matches
Introduction to CSS layout - Learn web development
floats example body { width: 90%; max-width: 900px; margin: 0 auto; } p { line-height: 2; word-spacing: 0.1rem; } .box { background-color: rgb(207,232,220); border: 2px solid rgb(79,1
85,227); padding: 10px; border-radius: 5px; } <h1>simple float example</h1> <div class="box">float</div> <p> lorem ipsum dolor sit amet, consectetur adipiscing elit.
... will all feature the same html, which is as follows: <h1>positioning</h1> <p>i am a basic block level element.</p> <p class="positioned">i am a basic block level element.</p> <p>i am a basic block level element.</p> this html will be styled by default using the following css: body { width: 500px; margin: 0 auto; } p { background-color: rgb(207,232,220); border: 2px solid rgb(79,1
85,227); padding: 10px; margin: 10px; border-radius: 5px; } the rendered output is as follows: relative positioning relative positioning allows you to offset an item from the position in normal flow it would have by default.
... adding this code will give the following result: relative positioning example <h1>relative positioning</h1> <p>i am a basic block level element.</p> <p class="positioned">this is my relatively positioned element.</p> <p>i am a basic block level element.</p> body { width: 500px; margin: 0 auto; } p { background-color: rgb(207,232,220); border: 2px solid rgb(79,1
85,227); padding: 10px; margin: 10px; border-radius: 5px; } .positioned { position: relative; background: rgba(255,
84,104,.3); border: 2px solid rgb(255,
84,104); top: 30px; left: 30px; } absolute positioning absolute positioning is used to completely remove an element from normal flow, and place it using offsets from the edges of a containing block.
...And 4 more matches
How do you set up a local testing server? - Learn web development
at the bottom of the page, choose the windows x
86 executable installer and download it.
... enter the command to start up the server in that directory: # if python version returned above is 3.x python3 -m http.server # on windows try "python" instead of "python3", or "py -3" # if python version returned above is 2.x python -m simplehttpserver by default, this will run the contents of the directory on a local web server, on port
8000.
... you can go to this server by going to the url localhost:
8000 in your web browser.
...And 4 more matches
Advanced text formatting - Learn web development
a light brown color.</textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 9
8%; } body { margin: 10px; background: #f5f9fa; } const textarea = document.getelementbyid('code'); const reset = document.getelementbyid('reset'); const solution = document.getelementbyid('solution'); const output = document.queryselector('.output'); const code = textarea.value; const userentry = textarea.value; function updatecode() { output.innerhtml = textarea.value; } reset.addeventl...
... need to eliminate negative self talk (as mentioned in affirmations for positive thinking.)</p> </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 9
8%; } body { margin: 10px; background: #f5f9fa; } const textarea = document.getelementbyid('code'); const reset = document.getelementbyid('reset'); const solution = document.getelementbyid('solution'); const output = document.queryselector('.output'); const code = textarea.value; const userentry = textarea.value; function updatecode() { output.innerhtml = textarea.value; } reset.addeventl...
..." class="input" style="min-height: 50px; width: 95%"> <p>nasa sure does some exciting work.</p> </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 9
8%; } body { margin: 10px; background: #f5f9fa; } const textarea = document.getelementbyid('code'); const reset = document.getelementbyid('reset'); const solution = document.getelementbyid('solution'); const output = document.queryselector('.output'); const code = textarea.value; const userentry = textarea.value; function updatecode() { output.innerhtml = textarea.value; } reset.addeventl...
...And 4 more matches
Getting started with HTML - Learn web development
</textarea> <div class="controls"> <input id="reset" type="button" value="reset" /> <input id="solution" type="button" value="show solution" /> </div> html { font-family: 'open sans light',helvetica,arial,sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 9
8%; } body { margin: 10px; background: #f5f9fa; } var textarea = document.getelementbyid('code'); var reset = document.getelementbyid('reset'); var solution = document.getelementbyid('solution'); var output = document.queryselector('.output'); var code = textarea.value; var userentry = textarea.value; function updatecode() { output.innerhtml = textarea.value; } reset.addeventlistener('cl...
...nput" style="min-height: 100px;width: 95%"> <p>a link to my favorite website.</p> </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 9
8%; } body { margin: 10px; background: #f5f9fa; } var textarea = document.getelementbyid('code'); var reset = document.getelementbyid('reset'); var solution = document.getelementbyid('solution'); var output = document.queryselector('.output'); var code = textarea.value; var userentry = textarea.value; function updatecode() { output.innerhtml = textarea.value; } reset.addeventlistener('cli...
...next, let's examine how individual elements combine to form an entire html page: <!doctype html> <html> <head> <meta charset="utf-
8"> <title>my test page</title> </head> <body> <p>this is my page</p> </body> </html> here we have: <!doctype html>: the doctype.
...And 4 more matches
Looping code - Learn web development
let's say we wanted to draw 100 random circles on a <canvas> element (press the update button to run the example again and again to see different random sets): hidden code <!doctype html> <html> <head> <meta charset="utf-
8"> <title>random canvas circles</title> <style> html { width: 100%; height: inherit; background: #ddd; } canvas { display: block; } body { margin: 0; } button { position: absolute; top: 5px; left: 5px; } </style> </head> <body> <button>update</button> <canvas></c...
... const cats = ['bill', 'jeff', 'pete', 'biggles', 'jasmin']; let info = 'my cats are called '; const para = document.queryselector('p'); for (let i = 0; i < cats.length; i++) { info += cats[i] + ', '; } para.textcontent = info; this gives us the following output: hidden code 2 <!doctype html> <html> <head> <meta charset="utf-
8"> <title>basic for loop example</title> <style> </style> </head> <body> <p></p> <script> const cats = ['bill', 'jeff', 'pete', 'biggles', 'jasmin']; let info = 'my cats are called '; const para = document.queryselector('p'); for (let i = 0; i < cats.length; i++) { info += cats[i] + ', '; } para.textcontent = info; </script> </body>...
...first, some simple html — a text <input> allowing us to enter a name to search for, a <button> element to submit a search, and a <p> element to display the results in: <label for="search">search by contact name: </label> <input id="search" type="text"> <button>search</button> <p></p> now on to the javascript: const contacts = ['chris:2232322', 'sarah:3453456', 'bill:7654322', 'mary:999
8769', 'dianne:93
84975']; const para = document.queryselector('p'); const input = document.queryselector('input'); const btn = document.queryselector('button'); btn.addeventlistener('click', function() { let searchname = input.value.tolowercase(); input.value = ''; input.focus(); for (let i = 0; i < contacts.length; i++) { let splitcontact = contacts[i].split(':'); if (splitcontact...
...And 4 more matches
Client-Server Overview - Learn web development
w&topic=apps&topic=html&topic=css&topic=js&topic=api&topic=webdev http/1.1 host: developer.mozilla.org connection: keep-alive pragma: no-cache cache-control: no-cache upgrade-insecure-requests: 1 user-agent: mozilla/5.0 (windows nt 10.0; wow64) applewebkit/537.36 (khtml, like gecko) chrome/52.0.2743.116 safari/537.36 accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.
8 referer: https://developer.mozilla.org/ accept-encoding: gzip, deflate, sdch, br accept-charset: iso-
8859-1,utf-
8;q=0.7,*;q=0.7 accept-language: en-us,en;q=0.
8,es;q=0.6 cookie: sessionid=6ynxs23n521lu21b1t136rhbv7ezngie; csrftoken=zipujsazv6pcgcbjscj1zu6pqzbfmuat; dwf_section_edit=false; dwf_sg_task_completion=false; _gat=1; _ga=ga1.2.16
88886003.1471911953; ffo=true the first and second lines c...
... it can accept the specified set of characters (accept-charset: iso-
8859-1,utf-
8;q=0.7,*;q=0.7) and languages (accept-language: de,en;q=0.7,en-us;q=0.3).
... we can also see that it uses the utf-
8 character set (content-type: text/html; charset=utf-
8).
...And 4 more matches
Beginning our React todo list - Learn web development
implementing our styles paste the following css code into src/index.css so that it replaces what's currently there: /* resets */ *, *::before, *::after { box-sizing: border-box; } *:focus { outline: 3px dashed #22
8bec; outline-offset: 0; } html { font: 62.5% / 1.15 sans-serif; } h1, h2 { margin-bottom: 0; } ul { list-style: none; padding: 0; } button { border: none; margin: 0; padding: 0; width: auto; overflow: visible; background: transparent; color: inherit; font: inherit; line-height: normal; -webkit-font-smoothing: inherit; -moz-osx-font-smoothing: inherit; -webkit-appe...
...arance: none; } button::-moz-focus-inner { border: 0; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { overflow: visible; } input[type="text"] { border-radius: 0; } body { width: 100%; max-width: 6
8rem; margin: 0 auto; font: 1.6rem/1.25 arial, sans-serif; background-color: #f5f5f5; color: #4d4d4d; } @media screen and (min-width: 620px) { body { font-size: 1.9rem; line-height: 1.31579; } } /*end resets*/ /* global styles */ .form-group > input[type="text"] { display: inline-block; margin-top: 0.4rem; } .btn { padding: 0.
8rem 1rem 0.7rem; border: 0.2rem solid #4d4d4d; cursor: pointer; text-transform: capitalize; } .btn.toggle-btn { border-width: 1px; border...
...sed="true"] { text-decoration: underline; border-color: #4d4d4d; } .btn__danger { color: #fff; background-color: #ca3c3c; border-color: #bd2130; } .btn__filter { border-color: lightgrey; } .btn__primary { color: #fff; background-color: #000; } .btn-group { display: flex; justify-content: space-between; } .btn-group > * { flex: 1 1 49%; } .btn-group > * + * { margin-left: 0.
8rem; } .label-wrapper { margin: 0; flex: 0 0 100%; text-align: center; } .visually-hidden { position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; } [class*="stack"] > * { margin-top: 0; margin-bottom: 0; } .stack-small > * + * { margin-top: 1.25rem; } .stack-large > * + *...
...And 4 more matches
Styling Vue components with CSS - Learn web development
add the following contents to the reset.css file: /*reset.css*/ /* resets */ *, *::before, *::after { box-sizing: border-box; } *:focus { outline: 3px dashed #22
8bec; } html { font: 62.5% / 1.15 sans-serif; } h1, h2 { margin-bottom: 0; } ul { list-style: none; padding: 0; } button { border: none; margin: 0; padding: 0; width: auto; overflow: visible; background: transparent; color: inherit; font: inherit; line-height: normal; -webkit-font-smoothing: inherit; -moz-osx-font-smoothing: inherit; -webkit-appearance: none; } butto...
...n::-moz-focus-inner { border: 0; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { /* 1 */ overflow: visible; } input[type="text"] { border-radius: 0; } body { width: 100%; max-width: 6
8rem; margin: 0 auto; font: 1.6rem/1.25 "helvetica neue", helvetica, arial, sans-serif; background-color: #f5f5f5; color: #4d4d4d; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } @media screen and (min-width: 620px) { body { font-size: 1.9rem; line-height: 1.31579; } } /*end resets*/ next, in your src/main.js file, import the reset.css file like so: import './assets/reset.css'; this will cause the file to get picked up during the build step and automatica...
... update your app.vue file’s <style> element so it looks like so: <style> /* global styles */ .btn { padding: 0.
8rem 1rem 0.7rem; border: 0.2rem solid #4d4d4d; cursor: pointer; text-transform: capitalize; } .btn__danger { color: #fff; background-color: #ca3c3c; border-color: #bd2130; } .btn__filter { border-color: lightgrey; } .btn__danger:focus { outline-color: #c
82333; } .btn__primary { color: #fff; background-color: #000; } .btn-group { display: flex; justify-content: space-between...
...And 4 more matches
Package management basics - Learn web development
create index.html in your test directory, and give it the following contents: <!doctype html> <html lang="en-us"> <head> <meta charset="utf-
8"> <title>my test page</title> </head> <body> <script src="./index.js"></script> </body> </html> next, we need to add an index.js file in the same directory as index.html.
... in the index.js file, add the following code and save it: import { formatdistancetonow } from 'date-fns' const date = '1996-09-13 10:00:00'; document.body.textcontent = formatdistancetonow(new date(date)) + ' ago'; go back to http://localhost:1234 and you'll see how long ago it is since the author turned 1
8.
... dist/my-project.fb76efcf.js.map 64
8.5
8 kb 64ms dist/my-project.fb76efcf.js 195.74 kb
8.43s dist/index.html 2
88 b
806ms again, the destination for our production files is the dist directory.
...And 4 more matches
Embedding API for Accessibility
be aware that in debug builds, this can cause a great number of assertions (bug 7159
8) to use prefs in embedding, use something like the following code: #include "nsipref.h"; nsresult rv; nscomptr<nsipref> prefs(do_getservice(ns_pref_contractid, &rv)); prefs->setboolpref("bool.pref.name", pr_true /* or pr_false */); prefs->setintpref("int.pref.name", newvalue); prefs->setcharpref("string.pref.name", newcharstarvalue); to manually add a pref to your settings, add a line lik...
...accessibility prefs give us (or will give us), for accessibility: functionality implementation works as of images setintpref("network.image.imagebehavior", behavior); /* behavior: 0=accept, 1=accept images from originating server only, 2=no images */ moz 0.
8 cookies setintpref("network.cookie.cookiebehavior", behavior); /* behavior: 0=accept, 1=accept cookies from originating server only, 2=no cookies */ setboolpref("network.cookie.warnaboutcookies", boolwarn); moz 0.
8 fonts setchar...
...pref("font.name.monospace.x-western", newfontname); setcharpref("font.name.serif.x-western", newfontname); setcharpref("font.name.sans-serif.x-western", newfontname); /* for other i1
8n charsets, change x-western to x-central-euro, x-cyrillic, x-unicode, x-user-def, x-baltic, el, tr, he, ar, th, ja, zh-cn or zh-tw */ setintpref("font.size.fixed.x-western", newfontsize); setintpref("font.size.variable.x-western", newfontsize); /* for other i1
8n charsets, change the name as explained above for font face*/ setcharpref("font.default","serif"); /* or "sans-serif" */ ...
...And 4 more matches
Mozilla MathML Status
see bug 95
8957.
...the mathvariant attribute is fully supported starting with (firefox 2
8.0 / thunderbird 2
8.0 / seamonkey 2.25).
... see bug
83
8509.
...And 4 more matches
Mozilla Port Blocking
background on 0
8/15/2001, cert issued a vulnerability note vu#476267 for a "cross-protocol" scripting attack, known as the html form protocol attack which allowed sending arbitrary data to most tcp ports.
..."access to the port number given has been disabled for security reasons." "establishing a connection to an unsafe or otherwise banned port was prohibited" "0x
804b0013 (ns_error_port_access_not_allowed)" if your product or web site uses a port which is blocked by mozilla's default port blocking rules, you can either change the port of your service to a unblocked value (recommended if possible) or ask your mozilla users to enable the port.
... 7 echo 9 discard 11 systat 13 daytime 15 netstat 17 qotd 19 chargen 20 ftp data 21 ftp control 22 ssh 23 telnet 25 smtp 37 time 42 name 43 nicname 53 domain 77 priv-rjs 79 finger
87 ttylink 95 supdup 101 hostriame 102 iso-tsap 103 gppitnp 104 acr-nema 109 pop2 110 pop3 111 sunrpc 113 auth 115 sftp 117 uucp-path 119 nntp 123 ntp 135 loc-srv / epmap 139 netbios 143 imap2 179 ...
...And 4 more matches
BloatView
== bloatview: all (cumulative) leak and bloat statistics, tab process 1
862 |<----------------class--------------->|<-----bytes------>|<----objects---->| | | per-inst leaked| total rem| 0 |total | 17 24
84|25395333
8 3
8| 17 |asynctransactiontrackersholder | 40 40| 10594 1| 7
8 |compositorchild | 472 472| ...
... 1 1| 79 |condvar | 24 4
8| 30
86 2| 279 |messagepump |
8 8| 30 1| 2
85 |mutex | 20 60|
899
87 3| 302 |pcompositorchild | 412 412| 1 1| 30
8 |pimagebridgechild | 416 416| 1 1| the first line tells you the pid of the leaking process, along with the type of process.
... byte bloats name file date blank blank.txt tue aug 29 14:17:40 2000 mozilla mozilla.txt tue aug 29 14:1
8:42 2000 yahoo yahoo.txt tue aug 29 14:19:32 2000 netscape netscape.txt tue aug 29 14:20:14 2000 the numbers do not include malloc 'd data such as string contents.
...And 4 more matches
NSS 3.12.6 release notes
nss 3.12.6 requires nspr 4.
8.4.
... you also need to download the nspr 4.
8.4 binary distributions to get the nspr 4.
8.4 header files and shared libraries, which nss 3.12.6 requires.
... nspr 4.
8.4 binary distributions are in https://ftp.mozilla.org/pub/mozilla.org/nspr/releases/v4.
8.4/.
...And 4 more matches
NSS 3.12.9 release notes
nss 3.12.9 requires nspr 4.
8.7.
... you also need to download the nspr 4.
8.7 binary distributions to get the nspr 4.
8.7 header files and shared libraries, which nss 3.12.9 requires.
... nspr 4.
8.7 binary distributions are in https://ftp.mozilla.org/pub/mozilla.org/nspr/releases/v4.
8.7/.
...And 4 more matches
NSS 3.15.2 release notes
bug
894370 - (cve-2013-1739) avoid uninitialized data read in the event of a decryption failure.
... new in nss 3.15.2 new functionality aes-gcm ciphersuites: aes-gcm cipher suite (rfc 52
88 and rfc 52
89) support has been added when tls 1.2 is negotiated.
... specifically, the following cipher suites are now supported: tls_ecdhe_ecdsa_with_aes_12
8_gcm_sha256 tls_ecdhe_rsa_with_aes_12
8_gcm_sha256 tls_dhe_rsa_with_aes_12
8_gcm_sha256 tls_rsa_with_aes_12
8_gcm_sha256 new functions pk11_cipherfinal has been introduced, which is a simple alias for pk11_digestfinal.
...And 4 more matches
NSS 3.34 release notes
nss 3.34 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_34_rtm/src/ notable changes in nss 3.34 the following ca certificates were added: cn = gdca trustauth r5 root sha-256 fingerprint: bf:ff:
8f:d0:44:33:4
8:7d:6a:
8a:a6:0c:1a:29:76:7a:9f:c2:bb:b0:5e:42:0f:71:3a:13:b9:92:
89:1d:3
8:93 trust flags: websites cn = ssl.com root certification authority rsa sha-256 fingerprint:
85:66:6a:56:2e:e0:be:5c:e9:25:c1:d
8:
89:0a:6f:76:a
8:7e:c1:6d:4d:7d:5f:29:ea:74:19:cf:20:12:3b:69 trust flags: websites, email cn = ssl.com root certification authority ecc ...
... sha-256 fingerprint: 34:17:bb:06:cc:60:07:da:1b:96:1c:92:0b:
8a:b4:ce:3f:ad:
82:0e:4a:a3:0b:9a:cb:c4:a7:4e:bd:ce:bc:65 trust flags: websites, email cn = ssl.com ev root certification authority rsa r2 sha-256 fingerprint: 2e:7b:f1:6c:c2:24:
85:a7:bb:e2:aa:
86:96:75:07:61:b0:ae:39:be:3b:2f:e9:d0:cc:6d:4e:f7:34:91:42:5c trust flags: websites cn = ssl.com ev root certification authority ecc sha-256 fingerprint: 22:a2:c1:f7:bd:ed:70:4c:c1:e7:01:b5:f4:0
8:c3:10:
88:0f:e9:56:b5:de:2a:4a:44:f9:9c:
87:3a:25:a7:c
8 trust flags: websites cn = trustcor rootcert ca-1 sha-256 fingerprint: d4:0e:9c:
86:cd:
8f:e4:6
8:c1:77:69:59:f4:9e:a7:74:fa:54:
86:
84:b6:c4:06:f3:90:92:61:f4:dc:e2:57:5c trust flags: websites, email c...
...n = trustcor rootcert ca-2 sha-256 fingerprint: 07:53:e9:40:37:
8c:1b:d5:e3:
83:6e:39:5d:ae:a5:cb:
83:9e:50:46:f1:bd:0e:ae:19:51:cf:10:fe:c7:c9:65 trust flags: websites, email cn = trustcor eca-1 sha-256 fingerprint: 5a:
88:5d:b1:9c:01:d9:12:c5:75:93:
88:93:
8c:af:bb:df:03:1a:b2:d4:
8e:91:ee:15:5
8:9b:42:97:1d:03:9c trust flags: websites, email the following ca certificates were removed: cn = certum ca, o=unizeto sp.
...And 4 more matches
NSS 3.46 release notes
notable changes in nss 3.46 certificate authority changes the following ca certificates were removed: bug 1574670 - remove expired class 2 primary root certificate sha-256 fingerprint: 0f993c
8aef97baaf56
87140ed59ad1
821bb4afacf0aa9a5
8b5d57a33
8a3afbcb bug 1574670 - remove expired utn-userfirst-client root certificate sha-256 fingerprint: 43f257412d440d627476974f
877da
8f1fc2444565a367ae60eddc27a412531ae bug 1574670 - remove expired deutsche telekom root ca 2 root certificate sha-256 fingerprint: b6191a50d0c3977f7da99bcdaac
86a227daeb9679ec70ba3b0c...
...9d92271c170d3 bug 1566569 - remove swisscom root ca 2 root certificate sha-256 fingerprint: f09b122c7114f4a09bd4ea4f4a99d55
8b46e4c25cd
81140d29c05613914c3
841 upcoming changes to default tls configuration the next nss team plans to make two changes to the default tls configuration in nss 3.47, which will be released in october: tls 1.3 will be the default maximum tls version.
... see bug 157311
8 for details.
...And 4 more matches
NSS 3.55 release notes
notable changes in nss 3.55 p3
84 and p521 elliptic curve implementations are replaced with verifiable implementations from fiat-crypto and ecckiila.
... dtls 1.3 implementation is updated to draft-3
8.
... bugs fixed in nss 3.55 bug 16315
83 (cve-2020-6
829, cve-2020-12400) - replace p3
84 and p521 with new, verifiable implementations from fiat-crypto and ecckiila.
...And 4 more matches
Overview of NSS
nss 3.x has been certified on 1
8 platforms.
... tls v1.3 (rfc
8446), tls v1.2 (rfc 5246), tls v1.1 (rfc 4346), tls v1 (rfc 2246).
... pkcs #
8.
...And 4 more matches
NSS tools : crlutil
please contribute to the initial review in mozilla nss bug
836477[1] description the certificate revocation list (crl) management tool, crlutil, is a command-line utility that can list, generate, modify, or delete crls within the nss security database file(s) and list, create, modify or delete certificates entries in a particular crl.
... -p dbprefix specify the prefix used on the nss security database files (for example, my_cert
8.db and my_key3.db).
...list of possible algorithms: md2 | md4 | md5 | sha1 | sha256 | sha3
84 | sha512 -n nickname specify the nickname of a certificate or key to list, create, add to a database, modify, or validate.
...And 4 more matches
NSS tools : pk12util
pk12util supports two types of databases: the legacy security databases (cert
8.db, key3.db, and secmod.db) and new sqlite databases (cert9.db, key4.db, and pkcs11.txt).
... return codes o 0 - no error o 1 - user cancelled o 2 - usage error o 6 - nls init error o
8 - certificate db open error o 9 - key db open error o 10 - file initialization error o 11 - unicode conversion error o 12 - temporary file creation error o 13 - pkcs11 get slot error o 14 - pkcs12 decoder start error o 15 - error read from import file o 16 - pkcs12 decode error o 17 - pkcs12 decoder verify error o 1
8 - pkcs12 decoder val...
... bags error o 20 - key db conversion version 3 to version 2 error o 21 - cert db conversion version 7 to version 5 error o 22 - cert and key dbs patch error o 23 - get default cert db error o 24 - find cert by nickname error o 25 - create export context error o 26 - pkcs12 add password itegrity error o 27 - cert and key safes creation error o 2
8 - pkcs12 add cert and key error o 29 - pkcs12 encode error examples importing keys and certificates the most basic usage of pk12util for importing a certificate or key is the pkcs#12 input file (-i) and some way to specify the security database being accessed (either -d for a directory or -h for a token).
...And 4 more matches
JS_GetStringBytes
obsolete since jsapi 1.
8.5this feature is obsolete.
... syntax char * js_getstringbytes(jsstring *str); const char * js_getstringbytesz(jscontext *cx, jsstring *str); // added in jsapi 1.
8.2 name type description cx jscontext * (js_getstringbytesz and js_encodestring only) a context.
... description js_getstringbytes and js_getstringbytesz convert the specified javascript string, str, to a c string (an array of
8-bit chars).
...And 4 more matches
SpiderMonkey 45
you can download full source code from https://ftp.mozilla.org/pub/spidermonkey/releases/45.0.2/mozjs-45.0.2.tar.bz2 sha256: 570530b1e551bf4a459d7cae
875f33f99d5ef0c29ccc7742a1b6f5
88e5eadbee md5: 2ca34f99
8d
8b5ea79d
8616dd26b5fbab spidermonkey 45 is the javascript engine that shipped in firefox 45.
...you may wish to make the bugs block bug
837921 (aliased as "sm.embedding").
...it is supported on x
86, x
86_64, and arm architectures.
...And 4 more matches
Secure Development Guidelines
introduction provide developers with information on specific security issues cover common coding mistakes and how they affect a product how to avoid making them how to mitigate them everything is oriented toward c/c++ introduction: gaining control specifics about the underlying architecture, using x
86 as an example 6 basic registers (eax, ebx, ecx, edx, edi, esi) 2 stack-related registers (esp, ebp) mark top and bottom of current stack frame status register (eflags) contains various state information instruction pointer (eip) points to register being executed; can’t be modified directly introduction: gaining control (2) eip is modified using call or...
... bits maximum value that can be represented data type
8 2
8-1 255 char 16 216-1 65535 short 32 232-1 4294967295 int 64 264-1 1
8446744073709551615 long long integer overflows/underflows example of an integer overflow int main() { unsigned int foo = 0xffffffff; printf(“foo: 0x%0
8x\r\n”, foo); foo++; printf(“foo: 0x%0
8x\r\n”, foo); } integer overflows/...
...underflows example of an integer underflow int main() { unsigned int foo = 0; printf(“foo: 0x%0
8x\r\n”, foo); foo--; printf(“foo: 0x%0
8x\r\n”, foo); } integer overflows/underflows real-life example (bug 303213) jsbool js_str_escape(jscontext *cx, jsobject *obj, unsigned int argc, jsval *argv, jsval *rval){ ...
...And 4 more matches
imgIContainer
obsolete since gecko 2.0 void appendframe(in print32 ax, in print32 ay, in print32 awidth, in print32 aheight, in gfximageformat aformat, [array, size_is(imagelength)] out pruint
8 imagedata, out unsigned long imagelength); native code only!
... obsolete since gecko 2.0 void appendpalettedframe(in print32 ax, in print32 ay, in print32 awidth, in print32 aheight, in gfximageformat aformat, in pruint
8 apalettedepth, [array, size_is(imagelength)] out pruint
8 imagedata, out unsigned long imagelength, [array, size_is(palettelength)] out pruint32 palettedata, out unsigned long palettelength); native code only!
... void endframedecode(in unsigned long framenumber); obsolete since gecko 2.0 void ensurecleanframe(in unsigned long aframenum, in print32 ax, in print32 ay, in print32 awidth, in print32 aheight, in gfximageformat aformat, [array, size_is(imagelength)] out pruint
8 imagedata, out unsigned long imagelength); native code only!
...And 4 more matches
nsIDocShell
obsolete since gecko 1.
8 nsisimpleenumerator getdocshellenumerator(in long aitemtype, in long adirection); nsidomstorage getsessionstorageforprincipal(in nsiprincipal principal, in domstring documenturi, in boolean create); nsidomstorage getsessionstorageforuri(in nsiuri uri, in domstring documenturi); void historypurged(in long numentries); void internalload(in nsiuri auri...
... note: starting in gecko
8.0, isactive is false for documents in minimized windows.
...obsolete since gecko 1.
8 prescontext nsprescontext presentation context for the currently loaded document.
...And 4 more matches
nsIWindowsShellService
inherits from: nsishellservice last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) method overview string getregistryentry(in long ahkeyconstant, in string asubkeyname, in string avaluename); obsolete since gecko 1.
8 void restorefilesettings(in boolean aforallusers); obsolete since gecko 1.9 void shortcutmaintenance(); attributes attribute type description desktopbackgroundcolor unsigned long the desktop background color, visible when no background image is used, or if the background image is centered and does not fill the entire screen.
... a rgb value, where (r << 24 | g << 16 | b) obsolete since gecko 1.
8 unreadmailcount unsigned long the number of unread mail messages for the current user.
...obsolete since gecko 1.
8 hkcc 1 hkey_current_config.
...And 4 more matches
nsMsgFolderFlagType
[scriptable,uuid(fbe7cba
8-3141-4c44-9660-99af6b53f27e)] interface nsmsgfolderflags { /** * @name folder type flags * these flags define the type of folder.
... * (note that directories may have zero children.) */ const nsmsgfolderflagtype directory = 0x0000000
8; /** whether the children of this folder are currently hidden in the listing.
... const nsmsgfolderflagtype unused2 = 0x000000
80; /** @} */ /** @name mail folder flags * these flags only occur in folders which have * the nsmsgfolderflags::mail bit set, and do * not have the nsmsgfolderflags::directory or * nsmsgfolderflags::elided bits set.
...And 4 more matches
Autoconfiguration in Thunderbird
if you support email aliases and the user's login name is not part of the email address (for example, users may have "hero@example.com" as email address, but the imap/pop/smtp login name is neither "hero" nor "hero@example.com", but "u6757
8"), you need to set up a configuration server, which does the email address -> login name lookup.
...in the apache configuration files, that means something like: listen 10.2.3.4:
80 (of course, you use a public ip address that you own) <virtualhost 10.2.3.4:
80> #must be the first and only virtual host with this ip!
...also, they must use charset utf-
8 (esp.
...And 4 more matches
Working with data
if the type is an array of
8-bit characters and value is a utf-16 string, the new cdata object is the result of converting the utf-16 string to utf-
8, with a null terminator.
... note: the source c string is assumed to be utf-
8, and is assumed to be null terminated.
... for example: var jsstring = timestr.readstring(); converting javascript strings to c happily, converting javascript strings to c formatted strings is easy; just create a character array containing the javascript string: var myutf
8string = ctypes.char.array()("original string."); this creates a utf-
8 format null-terminated string in the character array named myutf
8string.
...And 4 more matches
BasicCardResponse - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetbasiccardresponsechrome no support noedge no support ≤1
8 — 79firefox full support 56notes disabled full support 56notes disabled notes available only in nightly builds.disabled from version 56: this feature is behind the dom.payments.request.enabled preference (needs to be set to true) and the dom.payments.request.supportedregions preference (needs to be set to...
... samsung internet android full support 7.0billingaddresschrome no support noedge no support ≤1
8 — 79firefox full support 56notes disabled full support 56notes disabled notes available only in nightly builds.disabled from version 56: this feature is behind the dom.payments.request.enabled preference (needs to be set to true).
... samsung internet android full support 7.0cardholdernamechrome no support noedge no support ≤1
8 — 79firefox full support 56notes disabled full support 56notes disabled notes available only in nightly builds.disabled from version 56: this feature is behind the dom.payments.request.enabled preference (needs to be set to true).
...And 4 more matches
Using images - Web APIs
<html> <body onload="draw();"> <canvas id="canvas" width="1
80" height="150"></canvas> </body> </html> function draw() { var ctx = document.getelementbyid('canvas').getcontext('2d'); var img = new image(); img.onload = function() { ctx.drawimage(img, 0, 0); ctx.beginpath(); ctx.moveto(30, 96); ctx.lineto(70, 66); ctx.lineto(103, 76); ctx.lineto(170, 15); ctx.stroke(); }; img.src = 'https://mdn.mozillademos.org/files...
...the image is scaled to one third of its original size, which is 50x3
8 pixels.
... <html> <body onload="draw();"> <canvas id="canvas" width="150" height="150"></canvas> </body> </html> function draw() { var ctx = document.getelementbyid('canvas').getcontext('2d'); var img = new image(); img.onload = function() { for (var i = 0; i < 4; i++) { for (var j = 0; j < 3; j++) { ctx.drawimage(img, j * 50, i * 3
8, 50, 3
8); } } }; img.src = 'https://udn.realityripple.com/samples/db/f374e9c6fc.jpg'; } the resulting canvas looks like this: screenshotlive sample slicing the third and last variant of the drawimage() method has eight parameters in addition to the image source.
...And 4 more matches
EXT_texture_compression_bptc - Web APIs
ext.compressed_rgba_bptc_unorm_ext compresses
8-bit fixed-point data.
... each 4x4 block of texels consists of 12
8 bits of rgba or image data.
... ext.compressed_srgb_alpha_bptc_unorm_ext compresses
8-bit fixed-point data.
...And 4 more matches
Element.classList - Web APIs
see https://bugzilla.mozilla.org/show_bug.cgi?id=
814014 polyfill the legacy onpropertychange event can be used to create a living classlist mockup thanks to a element.prototype.classname property that fires the specified event once it is changed.
...).split(wsre), ci=0, clen=toks.length, sub=0; ci !== clen; ++ci){ for (var inneri=0; inneri !== ci; ++inneri) if (toks[inneri] === toks[ci]) { sub++; continue a; } this[ci-sub] = toks[ci]; } protoobjproto.length = clen-sub, protoobjproto.value = ele.classname, protoobjproto[" ucl"] = ele; if (defineproperty) { defineproperty(ele, "classlist", { // ie
8 & ie9 allow defineproperty on the dom enumerable: 1, get: function(){return restokenlist}, configurable: 0, set: function(newval){ skippropchange = 1, ele.classname = protoobjproto.value = (newval += ""), skippropchange = 0; var toks = newval.trim().split(wsre), oldlen = protoobjproto.length; a: for(var ci = 0, clen = proto...
...rable: 0, writeable: 0, value: protoobj.prototype }); defineproperty(protoobjproto, " ucl", { enumerable: 0, configurable: 0, writeable: 0, value: ele }); } else { ele.classlist=restokenlist, ele[" ucl"]=restokenlist, ele[" uclp"]=protoobj.prototype; } ele.attachevent( "onpropertychange", whenpropchanges ); } try { // much faster & cleaner version for ie
8 & ie9: // should work in ie
8 because element.prototype instanceof node is true according to the specs window.object.defineproperty(window.element.prototype, "classlist", { enumerable: 1, get: function(val){ if (!hasownprop.call(this, "classlist")) polyfillclasslist(this); return this.classlist; ...
...And 4 more matches
FileSystemDirectoryEntry - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetfilesystemdirectoryentry experimentalchrome full support
8alternate name full support
8alternate name alternate name uses the non-standard name: directoryentryedge full support 79prefixed full support 79prefixed prefixed implemented with the vendor prefix: webkitfirefox full support ...
...h the vendor prefix: webkitsafari full support 11.1webview android full support ≤37alternate name full support ≤37alternate name alternate name uses the non-standard name: directoryentrychrome android full support 1
8alternate name full support 1
8alternate name alternate name uses the non-standard name: directoryentryfirefox android full support 50opera android no support nosafari ios full support 11.3samsung internet android ...
... full support 50ie no support noopera no support nosafari full support 11.1webview android full support ≤37chrome android full support 1
8firefox android full support 50opera android no support nosafari ios full support 11.3samsung internet android full support yesgetdirectory experimentalchrome full support
8ed...
...And 4 more matches
Using IndexedDB - Web APIs
<iframe> content) cannot access indexeddb if the browser is set to never accept third party cookies (see bug 1147
821.) warning about browser shutdown when the browser shuts down (because the user chose the quit or exit option), the disk containing the database is removed unexpectedly, or permissions are lost to the database store, the following things happen: each transaction on every affected database (or all open databases, in the case of browser shutdown) is aborted with an aborterror.
...see bug
870645.
... full indexeddb example html content <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.
8.3/jquery.min.js"></script> <h1>indexeddb demo: storing blobs, e-publication example</h1> <div class="note"> <p> works and tested with: </p> <div id="compat"> </div> </div> <div id="msg"> </div> <form id="register-form"> <table> <tbody> <tr> <td> <label for="pub-title" class="required"> ...
...And 4 more matches
Transcoding assets for Media Source Extensions - Web APIs
throughout this tutorial, you'll see the filename trailer_10
80p.mov which is the download.
... [0] (c) copyright 200
8, blender foundation / www.bigbuckbunny.org / https://peach.blender.org/about/ tools required when working with mse, the following tools are a must have: ffmpeg — a command-line utility for transcoding your media into the required formats.
... to check if the browser supports a particular container, you can pass a string of the mime type to the mediasource.istypesupported method: mediasource.istypesupported('audio/mp3'); // false mediasource.istypesupported('video/mp4'); // true mediasource.istypesupported('video/mp4; codecs="avc1.4d402
8, mp4a.40.2"'); // true the string is the mime type of the container, optionally followed by a list of codecs.
...And 4 more matches
ScreenOrientation - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetscreenorientationchrome full support 3
8edge full support 79firefox full support 43ie no support noopera full support 25safari no support nowebview android full support 3...
...
8chrome android full support 3
8firefox android full support 43opera android full support 25safari ios no support nosamsung internet android full support 3.0anglechrome full support 3
8edge full support 79firefox full support 43ie no support noopera full support 25safari no support nowebview android ...
... full support 3
8chrome android full support 3
8firefox android full support 43opera android full support 25safari ios no support nosamsung internet android full support 3.0lockchrome full support 3
8edge full support 79firefox full support 43ie no support noopera full support 25safari no support ...
...And 4 more matches
Screen Orientation API - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetscreenorientationchrome full support 3
8edge full support 79firefox full support 43ie no support noopera full support 25safari no support nowebview android full support 3...
...
8chrome android full support 3
8firefox android full support 43opera android full support 25safari ios no support nosamsung internet android full support 3.0anglechrome full support 3
8edge full support 79firefox full support 43ie no support noopera full support 25safari no support nowebview android ...
... full support 3
8chrome android full support 3
8firefox android full support 43opera android full support 25safari ios no support nosamsung internet android full support 3.0lockchrome full support 3
8edge full support 79firefox full support 43ie no support noopera full support 25safari no support ...
...And 4 more matches
SubtleCrypto.encrypt() - Web APIs
aes-ctr this represents aes in counter mode, as specified in nist sp
800-3
8a.
... aes-cbc this represents aes in cipher block chaining mode, as specified in nist sp
800-3
8a.
... aes-gcm this represents aes in galois/counter mode, as specified in nist sp
800-3
8d.
...And 4 more matches
WEBGL_compressed_texture_etc - Web APIs
ext.compressed_rgb
8_etc2 compresses rgb
8 data with no alpha channel.
... ext.compressed_rgba
8_etc2_eac compresses rgba
8 data.
... ext.compressed_srgb
8_etc2 compresses srgb
8 data with no alpha channel.
...And 4 more matches
WebGL best practices - Web APIs
in practice, effectively all systems support at least the following: max_cube_map_texture_size: 4096 max_renderbuffer_size: 4096 max_texture_size: 4096 max_viewport_dims: [4096,4096] max_vertex_texture_image_units: 4 max_texture_image_units:
8 max_combined_texture_image_units:
8 max_vertex_attribs: 16 max_varying_vectors:
8 max_vertex_uniform_vectors: 12
8 max_fragment_uniform_vectors: 64 aliased_point_size_range: [1,100] your desktop may support 16k textures, or maybe 16 texture units in the vertex shader, but most other systems don't, and content that works for you will not work for them!
...gl_fragment_precision_high precision highp float; #else precision mediump float; #endif essl100 minimum requirements (webgl 1) float think range min above zero precision highp float24* (-2^62, 2^62) 2^-62 2^-16 relative mediump ieee float16 (-2^14, 2^14) 2^-14 2^-10 relative lowp 10-bit signed fixed (-2, 2) 2^-
8 2^-
8 absolute int think range highp int17 (-2^16, 2^16) mediump int11 (-2^10, 2^10) lowp int9 (-2^
8, 2^
8) *float24: sign bit, 7-bit for exponent, 16-bit for mantissa essl300 minimum requirements (webgl 2) float think range min above zero precision highp ieee float32 (-2^126, ...
...2^127) 2^-126 2^-24 relative mediump ieee float16 (-2^14, 2^14) 2^-14 2^-10 relative lowp 10-bit signed fixed (-2, 2) 2^-
8 2^-
8 absolute (u)int think int range unsigned int range highp (u)int32 [-2^31, 2^31] [0, 2^32] mediump (u)int16 [-2^15, 2^15] [0, 2^16] lowp (u)int9 [-2^
8, 2^
8] [0, 2^9] prefer builtins like dot, mix, and normalize instead of buiding your own at best, custom implementations of builtins might run as fast as the builtins they replace, but don't expect them to.
...And 4 more matches
Writing WebSocket servers - Web APIs
for example, let's assume that your server is listening on example.com, port
8000, and your socket server responds to get requests at example.com/chat.
... warning: the server may listen on any port it chooses, but if it chooses any port other than
80 or 443, it may have problems with firewalls and/or proxies.
...the client will send a pretty standard http request with headers that looks like this (the http version must be 1.1 or greater, and the method must be get): get /chat http/1.1 host: example.com:
8000 upgrade: websocket connection: upgrade sec-websocket-key: dghlihnhbxbszsbub25jzq== sec-websocket-version: 13 the client can solicit extensions and/or subprotocols here; see miscellaneous for details.
...And 4 more matches
WindowOrWorkerGlobalScope.setInterval() - Web APIs
this effectively limits delay to 21474
83647 ms, since it's specified as a signed integer in the idl.
... <!doctype html> <html> <head> <meta charset="utf-
8" /> <title>setinterval/clearinterval example</title> <script> var nintervid; function changecolor() { nintervid = setinterval(flashtext, 1000); } function flashtext() { var oelem = document.getelementbyid('my_box'); oelem.style.color = oelem.style.color == 'red' ?
... <!doctype html> <html> <head> <meta charset="utf-
8" /> <title>javascript typewriter - mdn example</title> <script> function typewriter (sselector, nrate) { function clean () { clearinterval(nintervid); btyping = false; bstart = true; ocurrent = null; asheets.length = nidx = 0; } function scroll (osheet, npos, beraseandstop) { if (!osheet.hasownproperty('parts') || amap.length < npos) { return true; } var ore...
...And 4 more matches
How to check the security state of an XMLHTTPRequest over SSL - Web APIs
// adapted from the patch for moztcpsocket error reporting (bug
861196).
... // calculating the difference let sslerr = math.abs(nsinsserrorsservice.nss_ssl_error_base) - (status & 0xffff); switch (sslerr) { case 3: // ssl_error_no_certificate, ssl(3) errname = 'securitynocertificateerror'; break; case 4: // ssl_error_bad_certificate, ssl(4) errname = 'securitybadcertificateerror'; break; case
8: // ssl_error_unsupported_certificate_type, ssl(
8) errname = 'securityunsupportedcertificatetypeerror'; break; case 9: // ssl_error_unsupported_version, ssl(9) errname = 'securityunsupportedtlsversionerror'; break; case 12: // ssl_error_bad_cert_domain, ssl(12) errname = 'securitycertificatedomainmismatcherror'; break; ...
... default: errname = 'securityerror'; break; } } } else { errtype = 'network'; switch (status) { // connect to host:port failed case 0x
804b000c: // ns_error_connection_refused, network(13) errname = 'connectionrefusederror'; break; // network timeout error case 0x
804b000e: // ns_error_net_timeout, network(14) errname = 'networktimeouterror'; break; // hostname lookup failed case 0x
804b001e: // ns_error_unknown_host, network(30) errname = 'domainnotfounderror'; break; case 0x
804b0047: // ns_error_net_interrupt, network(71) errname = 'networkinterrupterror'; break; default: errname = 'networkerror'; break; } } // x...
...And 4 more matches
ARIA Test Cases - Accessibility
tested ua/at combinations: dragon 10 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 ...
... new tests for internet explorer
8 rc1 on this msdn page the aria state/role mapping in ie
8 to msaa roles can be directly checked.
... ms ie
8 tab control example expected at behavior: as focus first lands on the tabs, screen reader announces the label and role of the focused tab item, and whether it is selected.
...And 4 more matches
ARIA: grid role - Accessibility
examples calendar example html <table role="grid" aria-labelledby="calendarheader" aria-readonly=true> <caption id="calendarheader">september 201
8</caption> <thead role="rowgroup"> <tr role="row"> <td></td> <th role="columnheader" aria-label="sunday">s</th> <th role="columnheader" aria-label="monday">m</th> <th role="columnheader" aria-label="tuesday">t</th> <th role="columnheader" aria-label="wednesday">w</th> <th role="columnheader" aria-label="thursday">t</th> <th role="columnheader" aria-l...
...abel="friday">f</th> <th role="columnheader" aria-label="saturday">s</th> </tr> </thead> <tbody role="rowgroup"> <tr role="row"> <th scope="row" role="rowheader">week 35</th> <td>26</td> <td>27</td> <td>2
8</td> <td>29</td> <td>30</td> <td>31</td> <td role="gridcell" tabindex="-1">1</td> </tr> <tr role="row"> <th scope="row" role="rowheader">week 36</th> <td role="gridcell" tabindex="-1"> 2 </td> <td role="gridcell" tabindex="-1"> 3 </td> <td role="gridcell" tabindex="-1"> 4 </td> <td role="gridcell" tabindex="-1"> 5 </td> <td role="gridcell" tabindex="-1"> 6 </td> <td role="gridcell" tabindex="-1"> ...
... 7 </td> <td role="gridcell" tabindex="-1">
8 </td> </tr> <tr role="row"> <th scope="row" role="rowheader">week 37</th> <td role="gridcell" tabindex="-1"> 9 </td> <td role="gridcell" tabindex="-1"> 10 </td> <td role="gridcell" tabindex="-1"> 11 </td> <td role="gridcell" tabindex="-1"> 12 </td> <td role="gridcell" tabindex="-1"> 13 </td> <td role="gridcell" tabindex="-1"> 14 </td> <td role="gridcell" tabindex="-1"> 15 </td> </tr> <tr role="row"> <th scope="row" role="rowheader">week 3
8</th> <td role="gridcell" tabindex="-1"> 16 </td> <td role="gridcell" tabindex="-1"> ...
...And 4 more matches
Layout using named grid lines - CSS: Cascading Style Sheets
* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } when defining the grid, i name my lines inside square brackets.
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } i’m using the same grid definitions as above, however this time i am going to place a single item into the named area content.
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } .wrapper { display: grid; grid-template-columns: repeat(9, 1fr); grid-auto-rows: minmax(100px, auto); grid-template-areas: "hd hd hd hd hd hd hd hd hd" "sd sd sd main main main main main main" "ft ft ft ft ft ft ft ft ft"; } .header { grid-area: hd; } .footer { grid-area: ft; } .content { grid-area: main; }...
...And 4 more matches
Viewport concepts - CSS: Cascading Style Sheets
if you query the width or height of the window and document in chrome or firefox, you may get: document.documentelement.clientwidth /* 1200 */ window.innerwidth /* 1200 */ window.outerwidth /* 1200 */ document.documentelement.clientheight /*
800 */ window.innerheight /*
800 */ window.outerheight /* 900 */ there are several dom properties that can help you query viewport size, and other similar lengths: the document element's element.clientwidth is the inner width of a document in css pixels, including padding (but not borders, margins, or vertical scrollbars, if present).
...when zoomed in you may get: document.documentelement.clientwidth /*
800 */ window.innerwidth /*
800 */ window.outerwidth /*
800 in firefox, 1200 in chrome */ document.documentelement.clientheight /* 533 */ window.innerheight /* 533 */ window.outerheight /* 596 in firefox, 900 in chrome */ the viewport was originally 1200 x
800 pixels.
... upon zooming in, the viewport became
800 x 533 pixels.
...And 4 more matches
conic-gradient() - CSS: Cascading Style Sheets
blue, red); /* a a bluish purple box: the gradient goes from blue to red, but as only the bottom right quadrant is visible, as the center of the conic gradient is in at the top left corner */ conic-gradient(from 90deg at 0 0, blue, red); /* colorwheel */ background: conic-gradient( hsl(360, 100%, 50%), hsl(315, 100%, 50%), hsl(270, 100%, 50%), hsl(225, 100%, 50%), hsl(1
80, 100%, 50%), hsl(135, 100%, 50%), hsl(90, 100%, 50%), hsl(45, 100%, 50%), hsl(0, 100%, 50%) ); values <angle> preceded by the from keyterm, and taking an angle as its value, defines the gradient rotation in clockwise direction.
...the following two gradients are equivalent conic-gradient(red, orange, yellow, green, blue); conic-gradient(red 0deg, orange 90deg, yellow 1
80deg, green 270deg, blue 360deg); by default, colors transition smoothly from the color at one color stop to the color at the subsequent color stop, with the midpoint between the colors being the half way point between the color transition.
...the following is solid red from the start to the 10% mark, transitions from red to blue over
80% of the turn, with the final 10% being solid blue.
...And 4 more matches
Setting up adaptive streaming media sources - Developer guides
<?xml version="1.0" encoding="utf-
8"?> <mpd xmlns:xsi="http://www.w3.org/2001/xmlschema-instance" xmlns="urn:mpeg:dash:schema:mpd:2011" xsi:schemalocation="urn:mpeg:dash:schema:mpd:2011 dash-mpd.xsd" type="static" mediapresentationduration="pt654s" minbuffertime="pt2s" profiles="urn:mpeg:dash:profile:isoff-on-demand:2011"> <baseurl>http://example.com/ondemand/</baseurl> <period> <!-- english audio --> <adap...
...tationset mimetype="audio/mp4" codecs="mp4a.40.5" lang="en" subsegmentalignment="true" subsegmentstartswithsap="1"> <representation id="1" bandwidth="64000"> <baseurl>elephantsdream_aac4
8k_064.mp4.dash</baseurl> </representation> </adaptationset> <!-- video --> <adaptationset mimetype="video/mp4" codecs="avc1.42401e" subsegmentalignment="true" subsegmentstartswithsap="1"> <representation id="2" bandwidth="100000" width="4
80" height="360"> <baseurl>elephantsdream_h264bpl30_0100.264.dash</baseurl> </representation> <representation id="3" bandwidth="175000" width="4
80" height="360"> <baseurl>elephantsdream_h264bpl30_0175.264.dash</baseurl> </representation> <representation id="4" bandwidth="250000" width="4
80" height...
...="360"> <baseurl>elephantsdream_h264bpl30_0250.264.dash</baseurl> </representation> <representation id="5" bandwidth="500000" width="4
80" height="360"> <baseurl>elephantsdream_h264bpl30_0500.264.dash</baseurl> </representation> </adaptationset> </period> </mpd> once you have generated your mpd file you can reference it from within the video tag.
...And 4 more matches
<tr>: The Table Row element - HTML: Hypertext Markup Language
pan="2">balance</th> </tr> <tr> <th>joined</th> <th>canceled</th> </tr> <tr> <th>margaret nguyen</td> <td>427311</td> <td><time datetime="2010-06-03">june 3, 2010</time></td> <td>n/a</td> <td>0.00</td> </tr> <tr> <th>edvard galinski</td> <td>533175</td> <td><time datetime="2011-01013">january 13, 2011</time></td> <td><time datetime="2017-0400
8">april
8, 2017</time></td> <td>37.00</td> </tr> <tr> <th>hoshi nakamura</td> <td>601942</td> <td><time datetime="2012-07-23">july 23, 2012</time></td> <td>n/a</td> <td>15.00</td> </tr> </table> the differences that matter here—for the purposes of discussing row and column spans—are in the first few lines of the code above.
...d</th> </tr> </thead> <tbody> <tr> <th scope="row">margaret nguyen</td> <td>427311</td> <td><time datetime="2010-06-03">june 3, 2010</time></td> <td>n/a</td> <td>0.00</td> </tr> <tr> <th scope="row">edvard galinski</td> <td>533175</td> <td><time datetime="2011-01013">january 13, 2011</time></td> <td><time datetime="2017-0400
8">april
8, 2017</time></td> <td>37.00</td> </tr> <tr> <th scope="row">hoshi nakamura</td> <td>601942</td> <td><time datetime="2012-07-23">july 23, 2012</time></td> <td>n/a</td> <td>15.00</td> </tr> </tbody> </table> the differences that matter here—for the purposes of discussing row and column spans—are in the first few lines of the code above...
...d</th> </tr> </thead> <tbody> <tr> <th scope="row">margaret nguyen</td> <td>427311</td> <td><time datetime="2010-06-03">june 3, 2010</time></td> <td>n/a</td> <td>0.00</td> </tr> <tr> <th scope="row">edvard galinski</td> <td>533175</td> <td><time datetime="2011-01013">january 13, 2011</time></td> <td><time datetime="2017-0400
8">april
8, 2017</time></td> <td>37.00</td> </tr> <tr> <th scope="row">hoshi nakamura</td> <td>601942</td> <td><time datetime="2012-07-23">july 23, 2012</time></td> <td>n/a</td> <td>15.00</td> </tr> </tbody> </table> css this time, the html is unchanged, so let's dive right into the css.
...And 4 more matches
HTTP Public Key Pinning (HPKP) - HTTP
openssl s_client -servername www.example.com -connect www.example.com:443 | openssl x509 -pubkey -noout | openssl pkey -pubin -outform der | openssl dgst -sha256 -binary | openssl enc -base64 example hpkp header public-key-pins: pin-sha256="cupctazwkaasuywhhnedttwpy3obake3h2+sozs7sws="; pin-sha256="m
8hztczm3eluxkcjr2s5p4hhybnf6lhkmjahkhpgpwe="; max-age=51
84000; includesubdomains; report-uri="https://www.example.org/hpkp-report" in this example, pin-sha256="cupctazwkaasuywhhnedttwpy3obake3h2+sozs7sws=" pins the server's public key used in production.
... the second pin declaration pin-sha256="m
8hztczm3eluxkcjr2s5p4hhybnf6lhkmjahkhpgpwe=" also pins the backup key.
... max-age=51
84000 tells the client to store this information for two months, which is a reasonable time limit according to the ietf rfc.
...And 4 more matches
HTTP resources and specifications - HTTP
rfc 7231 hypertext transfer protocol (http/1.1): semantics and content proposed standard rfc 7232 hypertext transfer protocol (http/1.1): conditional requests proposed standard rfc 7233 hypertext transfer protocol (http/1.1): range requests proposed standard rfc 7234 hypertext transfer protocol (http/1.1): caching proposed standard rfc 5
861 http cache-control extensions for stale content informational rfc
8246 http immutable responses proposed standard rfc 7235 hypertext transfer protocol (http/1.1): authentication proposed standard rfc 6265 http state management mechanism defines cookies proposed standard draft spec cookie prefixes ietf draft draft spe...
...c same-site cookies ietf draft draft spec deprecate modification of 'secure' cookies from non-secure origins ietf draft rfc 2145 use and interpretation of http version numbers informational rfc 65
85 additional http status codes proposed standard rfc 753
8 the hypertext transfer protocol status code 30
8 (permanent redirect) proposed standard rfc 7725 an http status code to report legal obstacles on the standard track rfc 2397 the "data" url scheme proposed standard rfc 39
86 uniform resource identifier (uri): generic syntax internet standard rfc 59
88 web linking defines the link header proposed standard experimental spec hypertext transfer protocol (http...
...) keep-alive header informational (expired) draft spec http client hints ietf draft rfc 757
8 returning values from forms: multipart/form-data proposed standard rfc 6266 use of the content-disposition header field in the hypertext transfer protocol (http) proposed standard rfc 21
83 communicating presentation information in internet messages: the content-disposition header field only a subset of syntax of the content-disposition header can be used in the context of http messages.
...And 4 more matches
Numbers and dates - JavaScript
numbers in javascript, numbers are implemented in double-precision 64-bit binary format ieee 754 (i.e., a number between ±2−1022 and ±2+1023, or about ±10−30
8 to ±10+30
8, with a numeric precision of 53 bits).
... decimal numbers 1234567
890 42 // caution when using leading zeros: 0
888 //
888 parsed as decimal 0777 // parsed as octal in non-strict mode (511 in decimal) note that decimal literals can start with a zero (0) followed by another decimal digit, but if every digit after the leading 0 is smaller than
8, the number gets parsed as an octal number.
... var flt_signbit = 0b10000000000000000000000000000000; // 21474
8364
8 var flt_exponent = 0b01111111100000000000000000000000; // 2139095040 var flt_mantissa = 0b00000000011111111111111111111111; //
83
88607 octal numbers octal number syntax uses a leading zero.
...And 4 more matches
Character classes - JavaScript
has one of the following meanings: matches any single character except line terminators: \n, \r, \u202
8 or \u2029.
... es201
8 added the s "dotall" flag, which allows the dot to also match line terminators.
...for example, /\w/ matches "a" in "apple", "5" in "$5.2
8", and "3" in "3d".
...And 4 more matches
JSON.stringify() - JavaScript
, 'bar']; a['baz'] = 'quux'; // a: [ 0: 'foo', 1: 'bar', baz: 'quux' ] json.stringify(a); // '["foo","bar"]' json.stringify({ x: [10, undefined, function(){}, symbol('')] }); // '{"x":[10,null,null,null]}' // standard data structures json.stringify([new set([1]), new map([[1, 2]]), new weakset([{a: 1}]), new weakmap([[{a: 1}, 2]])]); // '[{},{},{},{}]' // typedarray json.stringify([new int
8array([1]), new int16array([1]), new int32array([1])]); // '[{"0":1},{"0":1},{"0":1}]' json.stringify([new uint
8array([1]), new uint
8clampedarray([1]), new uint16array([1]), new uint32array([1])]); // '[{"0":1},{"0":1},{"0":1},{"0":1}]' json.stringify([new float32array([1]), new float64array([1])]); // '[{"0":1},{"0":1}]' // tojson() json.stringify({ x: 5, y: 6, tojson(){ return this.x + this.y; ...
...the literal code points u+202
8 line separator and u+2029 paragraph separator could appear literally in string literals and property names in json text.
... but they could not appear literally in similar context in javascript text, only using unicode escapes as \u202
8 and \u2029.
...And 4 more matches
WebAssembly.Table - JavaScript
the table2.wasm module contains two functions (one that returns 42 and another that returns
83) and stores both into elements 0 and 1 of the imported table (see text representation).
...rt 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.0table() constructorchrome 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 ...
...rt 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.0getchrome 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 ...
...And 4 more matches
Authoring MathML - MathML
prior to gecko 31.0 (firefox 31.0 / thunderbird 31.0 / seamonkey 2.2
8), it was a bit tedious to setup math fonts, see the font instructions for mozilla 2.0.
... for gecko 31.0 (firefox 31.0 / thunderbird 31.0 / seamonkey 2.2
8), this is much simpler and is compatible with any web rendering engine with mathml support.
... for example, here is a minimal stylesheet to use latin modern for the text and latin modern math for the mathematics: @namespace url('http://www.w3.org/1999/xhtml'); @namespace m url('http://www.w3.org/199
8/math/mathml'); body, m|mtext { font-family: latin modern; } m|math { font-family: latin modern math; } you can then use the @font-face rule as usual to provide woff fallback for latin modern and latin modern math.
...And 4 more matches
Mobile first - Progressive web apps (PWAs)
volo has a number of useful commands available, of which we will just use a couple: volo server: starts a local web server at localhost:
80
80 and runs your app through it: great for easy testing.
...and it works in ie
8+.
...i had to make sure both of these were not direct children of the <article>, otherwise the following would not work: #bottom, #top { font-size: 0.
8em; position:absolute; right: 1em; text-decoration: none; } #top { color: white; top: 0.5em; } #bottom { bottom: 0.5em; } i also set their parents to be positioned relatively, so they would become the positioning contexts of the absolutely positioned elements (you don't want them to be positioned relative to the <body> element.) adding a mobile first layout the above layout is fin...
...And 4 more matches
end - SVG: Scalable Vector Graphics
the time syntax is based upon the syntax defined in iso
8601.
... examples offset example <svg width="120" height="120" viewbox="0 0 120 120" xmlns="http://www.w3.org/2000/svg" version="1.1"> <!-- animated rectangles --> <rect x="10" y="35" height="15" width="0"> <animate attributetype="xml" attributename="width" to="100" begin="0s" end="
8s" fill="freeze" /> </rect> <rect x="10" y="60" height="15" width="0"> <animate attributetype="xml" attributename="width" to="75" begin="0s" end="6s" fill="freeze" /> </rect> <rect x="10" y="
85" height="15" width="0"> <animate attributetype="xml" attributename="width" to="50" begin="0s" end="4s" ...
..."10" y="20" text-anchor="middle">0s</text> <line x1="10" y1="25" x2="10" y2="105" stroke="grey" stroke-width=".5" /> <text x="35" y="20" text-anchor="middle">2s</text> <line x1="35" y1="25" x2="35" y2="105" stroke="grey" stroke-width=".5" /> <text x="60" y="20" text-anchor="middle">4s</text> <line x1="60" y1="25" x2="60" y2="105" stroke="grey" stroke-width=".5" /> <text x="
85" y="20" text-anchor="middle">6s</text> <line x1="
85" y1="25" x2="
85" y2="105" stroke="grey" stroke-width=".5" /> <text x="110" y="20" text-anchor="middle">
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-...
...And 4 more matches
XPCOM Objects - Archive of obsolete content
if you want to see the list in your current firefox installation, just run the following code in the error console: var str = ""; for (var i in components.classes) { str += i + "\n" }; str a run on firefox 3.6.2 with a few extensions installed yields
876 strings.
... } }; finally, here's a table summarizing the types you will most likely encounter in xpcom interfaces, and how to handle them: js type idl types notes strings autf
8string, string, wstring, char*, others historically there have been several string types in xpcom.
... the currently favored type for most cases is autf
8string.
...And 3 more matches
Index of archived content - Archive of obsolete content
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.0.4 release notes xulrunner 1.9 release notes xulrunner 1.9.1 release notes xulrunner 1.9.2 release notes xulrunner 2.0 release notes xulrunner faq xulrunner hall of fame xulrunner tips xulrunner/old releases toolkit.defaultchromefeatures ...
... 2006-11-24 2006-12-01 mozilla-dev-embedding mozilla-dev-extensions 2006-09-29 2006-10-06 2006-10-13 2006-10-20 2006-10-27 2006-11-03 2006-11-10 2006-11-17 2006-11-24 2006-12-01 2006-12-0
8 extentsions faq mozilla-dev-i1
8n 2006-09-22 mozilla-dev-l10n 2006-10-06 2006-10-13 2006-10-20 2006-10-27 2006-11-10 2006-11-17 2006-11-24 2006-11-3 2006-...
...12-01 2006-12-0
8 mozilla-dev-planning 2006-07-17 2006-09-22 2006-10-06 2006-10-13 2006-10-20 2006-10-27 2006-11-03 2006-11-10 2006-11-17 2006-11-24 2006-12-01 mozilla-dev-platform 2006-09-29 2006-10-06 2006-10-13 2006-10-20 2006-10-27 2006-11-03 2006-11-10 2006-11-17 2006-12-01 2006-1
8-24 mozilla-dev-quality 2006-09-29 2006-10-06 ...
...And 3 more matches
MMgc - Archive of obsolete content
/** * flags to be passed as second argument to alloc */ enum allocflags { kzero=1, kcontainspointers=2, kfinalize=4, krcobject=
8 }; kzero zeros out the memory.
...sample stack trace: xmlclass.cpp:391 toplevel.cpp:164 toplevel.cpp:507 interpreter.cpp:109
8 interpreter.cpp:20 methodenv.cpp:47 allocation traces, deletion traces etc.
...the memory profiler use srtti and stack traces to get information by location and type: class avmplus::growablebuffer - 24.9% - 3015 kb 514 items, avg 6007b 9
8.9% - 29
83 kb - 512 items - poolobject.cpp:29 abcparser.cpp:94
8 … 0.
8% - 24 kb - 1 items - poolobject.cpp:29 abcparser.cpp:94
8 … class avmplus::string - 13.2% - 1602 kb 15675 items, avg 104b 65.6% - 1051 kb - 14397 items - stringobject.cpp:46 avmcore.cpp:2300 … 20.4% - 326 kb - 10439 items - avmcore.cpp:2300 abcparser.cpp:1077 … 6.5% - 103 kb - 3311 items - avmcore...
...And 3 more matches
The new nsString class implementation (1999) - Archive of obsolete content
the deficiencies of the current implementation are: class based -- making it unsuitable for cross-dll usage due to fragility little intrinsic i1
8n support few efficiencies, notably a lack of support for narrow (1-byte) character strings no support for external memory management policy lack of xpcom interface notable features of the new nsstrimpl implementation are: intrinsic support for 1 and 2 byte character widths provides automatic conversion between strings with different character sizes inviolate base structure eliminates clas...
...i1
8n issues another concern (mainly of the i1
8n team) has to do with the use of a 1-byte (ascii) nscstring at all.
... the i1
8n team correctly points out that that anarchy will prevail if judicious control over their use is not mandated.
...And 3 more matches
Venkman - Archive of obsolete content
note that it is not included in the gecko-based browsers such as k-meleon, galeon and netscape
8.x.
... brief history in 199
8, john bandhauer was in charge of creating the netscape 4.x javascript debugger.
...venkman builds on the js/jsd portion of john's 199
8 work, exposing it as an xpcom component.
...And 3 more matches
Using nsIXULAppInfo - Archive of obsolete content
starting with mozilla/xulrunner 1.
8, there now is a way to find out which application, application version, and gecko version your code is running on.
... note that while firefox 1.5, thunderbird 1.5, and xulrunner 1.
8-based applications support nsixulappinfo, older applications, such as firefox and thunderbird 1.0, do not support it.
... const firefox_id = "{ec
8030f7-c20a-464f-9b0e-13a3a9e973
84}"; const thunderbird_id = "{3550f703-e5
82-4d05-9a0
8-453d09bdfdc6}"; const seamonkey_id = "{92650c4d-4b
8e-4d2a-b7eb-24ecf4f6b63a}"; var appinfo = components.classes["@mozilla.org/xre/app-info;1"] .getservice(components.interfaces.nsixulappinfo); if(appinfo.id == firefox_id) { // running under firefox } else if(appinfo.id == thunderbird_id)...
...And 3 more matches
Browser Feature Detection - Archive of obsolete content
test summary standard netscape 7.0x firefox 1.5 safari 2 opera 7 /
8.5-9.0 internet explorer 6 / 7 dom core 1 100% 100% 100% 75% / 91% 75% / 75% dom core 2 100% 100% 100% 70% / 94% 5
8% / 5
8% dom 1 html 100% 100% 100% 100% / 100% 100% / 100% dom css 1 100% 100% 100% 100% / 100% 96% / 96% dom css 2 100% 9
8% 67% 71% /
83% 3
8% / 42% tes...
...t results cross reference dom core level 1 support for properties/methods in document name firefox 1.5 ie 6 & 7 opera
8.54 - 9.01 document.doctype true true true document.implementation true true true document.documentelement true true true document.createelement() true true true document.createdocumentfragment() true true true document.createtextnode() true true true document.createcomment() true true true document.createcdatasection() true false true document.createprocessinginstruction() true false true document.createattribute() true true true document.createentityreference()obsol...
...ete since gecko 7 (method present but only returns null: bug 9
850) false false document.getelementsbytagname() true true true dom core level 2 support for properties/methods in document name firefox 1.5 ie 6 & 7 opera
8.54 - 9.01 document.doctype true true true document.implementation true true true document.documentelement true true true document.createelement() true true true document.createdocumentfragment() true true true document.createtextnode() true true true document.createcomment() true true true document.createcdatasection() true false true document.createprocessinginstruction(...
...And 3 more matches
Debug - Archive of obsolete content
the debug object only works in internet explorer and windows
8 and windows phone
8.1 store apps.
... there are different ways to debug internet explorer and windows
8.x store apps.
... in windows
8.x store apps, the write and writeln functions of the debug object display strings in the visual studio output window at run time.
...And 3 more matches
Multiple-column layout - Learn web development
.container { column-count: 3; column-gap: 20px; column-rule: 4px dotted rgb(79, 1
85, 227); } try adding rules of different styles and colors.
... styling the columns body { width: 90%; max-width: 900px; margin: 2em auto; font: .9em/1.2 arial, helvetica, sans-serif; } .container { column-count: 3; column-gap: 20px; column-rule: 4px dotted rgb(79, 1
85, 227); } <div class="container"> <h1>simple multicol example</h1> <p> lorem ipsum dolor sit amet, consectetur adipiscing elit.
... spanning the columns body { width: 90%; max-width: 900px; margin: 2em auto; font: .9em/1.2 arial, helvetica, sans-serif; } .container { column-count: 3; column-gap: 20px; column-rule: 4px dotted rgb(79, 1
85, 227); } h2 { column-span: all; background-color: rgb(79, 1
85, 227); color: white; padding: .5em; } <div class="container"> <h1>simple multicol example</h1> <p> lorem ipsum dolor sit amet, consectetur adipiscing elit.
...And 3 more matches
create fancy boxes - Learn web development
as you will notice, color gradients are considered to be images and can be manipulated as such */ background-image: linear-gradient(175deg, rgba(0,0,0,0) 95%, #
8da3
89 95%), linear-gradient(
85deg, rgba(0,0,0,0) 95%, #
8da3
89 95%), linear-gradient(175deg, rgba(0,0,0,0) 90%, #b4b07f 90%), linear-gradient(
85deg, rgba(0,0,0,0) 92%, #b4b07f 92%), linear-gradient(175deg, rgba(0,0,0,0)
85%, #c5a6
8e
85%), linear-gradient(
85deg, rgba(0,0,0,0)
89%, #c5a6
8e
89%), ...
... linear-gradient(175deg, rgba(0,0,0,0)
80%, #ba9499
80%), linear-gradient(
85deg, rgba(0,0,0,0)
86%, #ba9499
86%), linear-gradient(175deg, rgba(0,0,0,0) 75%, #9f
8fa4 75%), linear-gradient(
85deg, rgba(0,0,0,0)
83%, #9f
8fa4
83%), linear-gradient(175deg, rgba(0,0,0,0) 70%, #74a6ae 70%), linear-gradient(
85deg, rgba(0,0,0,0)
80%, #74a6ae
80%); } gradients can be used in some very creative ways.
...i want to be fancy.</div> let's have an example by turning our box into a cloud: .fancy { text-align: center; /* same trick as previsouly used to make circles */ box-sizing: border-box; width : 150px; height : 150px; padding :
80px 1em 0 1em; /* we make room for the "ears" of our cloud */ margin : 0 100px; position: relative; background-color: #a4c9cf; /* well, actually we are not making a full circle as we want the bottom of our cloud to be flat.
...And 3 more matches
Basic native form controls - Learn web development
the following screenshot shows default, focused and disabled text input types in firefox 71 and safari on macos and in chrome 79 and edge 1
8 on windows 10.
... <input type="hidden" id="timestamp" name="timestamp" value="12
86705410"> if you create such an element, it's required to set its name and value attributes.
... the following screenshots show default, focused and disabled checkboxes in firefox 71 and safari 13 on macos and chrome 79 and edge 1
8 on windows 10: note: any checkboxes and radio buttons with the checked attribute on load match the :default pseudo class, even if they are no longer checked.
...And 3 more matches
Useful string methods - Learn web development
t.createelement('li'); listitem.textcontent = input; list.appendchild(listitem); } } </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 9
8%; } body { margin: 10px; background: #f5f9fa; } const textarea = document.getelementbyid('code'); const reset = document.getelementbyid('reset'); const solution = document.getelementbyid('solution'); let code = textarea.value; let userentry = textarea.value; function updatecode() { eval(textarea.value); } reset.addeventlistener('click', function() { textarea.value = code; userentry ...
...document.createelement('li'); listitem.textcontent = result; list.appendchild(listitem); } </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 9
8%; } body { margin: 10px; background: #f5f9fa; } const textarea = document.getelementbyid('code'); const reset = document.getelementbyid('reset'); const solution = document.getelementbyid('solution'); let code = textarea.value; let userentry = textarea.value; function updatecode() { eval(textarea.value); } reset.addeventlistener('click', function() { textarea.value = code; userentry ...
...for example: man675
8475
8374
8sjt567654;manchester piccadilly we want to extract the station code and name, and put them together in a string with the following structure: man: manchester piccadilly we'd recommend doing it like this: extract the three-letter station code and store it in a new variable.
...And 3 more matches
Implementing feature detection - Learn web development
the problem here is browser support — @supports is not supported at all in ie, and only supported in very recent versions of safari/ios webkit (9+/9.2+), whereas the javascript version should work in much older browsers (probably back to ie
8 or 9, although older versions of ie will have additional problems, such as not supporting document.queryselector, and having a messed up box model).
...it looks like this: if (window.matchmedia("(max-width: 4
80px)").matches) { // run javascript in here.
... } as an example, our snapshot demo makes use of it to selectively apply the brick javascript library and use it to handle the ui layout, but only for the small screen layout (4
80px wide or less).
...And 3 more matches
Strategies for carrying out testing - Learn web development
ie
8 is listed as being significant too, but it is older and no longer capable.
... b grade: ie
8 and 9 for windows, opera mini.
... you may notice from the text in the example that it won't work in ie
8 — this is a problem according to our support chart, which you'll have to work on, perhaps by using a feature detection library to implement the functionality in a different way if the browser doesn't support css transitions (see implementing feature detection, later on in the course).
...And 3 more matches
Windows SDK versions
visual studio professional 2013 this comes with the windows
8.1 sdk included.
... visual studio express 2013 for windows desktop this comes with the windows
8.1 sdk included.
... visual studio professional 2012 this comes with the windows
8.0 sdk included.
...And 3 more matches
HTTP Cache
it will soon be completely obsoleted and removed (bug 913
82
8).
...immediately); there is currently no way to opt out of this feature (watch bug 93
81
86).
...this functionality is currently pending in bug 976
866.
...And 3 more matches
MathML Demo: <mfrac> - fractions
inline, display style, thick line x - 1 0.9
8 × 10 2 + y , the superscripted 2 should be script size.
... inline, display style, no line 1.234567
89 + x the end.
... inline binomial, auto, no line ( 5
8 ) the end.
...And 3 more matches
Leak-hunting strategies and tips
because (1) large graphs of leaked objects tend to include some objects pointed to by global variables that confuse gc-based leak detectors, which can make leaks look smaller (as in bug 991
80) or hide them completely and (2) large graphs of leaked objects tend to hide smaller ones, it's much better to go after the large graphs of leaks first.
...see bug 106
860 and bug
84136 for examples.
...--jesse) dropping a reference on the floor by: forgetting to release (because you weren't using nscomptr when you should have been): see bug 991
80 or bug 930
87 for an example or bug 2
8555 for a slightly more interesting one.
...And 3 more matches
Cryptography functions
pk11_getbestslotmultiple mxr 3.2 and later pk11_getbestwrapmechanism mxr 3.2 and later pk11_getblocksize mxr 3.2 and later pk11_getcertfromprivatekey mxr 3.9.3 and later pk11_getcurrentwrapindex mxr 3.2 and later pk11_getdefaultarray mxr 3.
8 and later pk11_getdefaultflags mxr 3.
8 and later pk11_getdisabledreason mxr 3.
8 and later pk11_getfirstsafe mxr 3.2 and later pk11_getinternalkeyslot mxr 3.2 and later pk11_getinternalslot mxr 3.2 and later pk11_getkeygen mxr 3.4 a...
...updated 3.
8 with new options.
... see bug 2151
86 pk11_listfixedkeysinslot mxr 3.4 and later pk11_listprivkeysinslot mxr 3.4 and later pk11_listpublickeysinslot mxr 3.4 and later pk11_loadprivkey mxr 3.4 and later pk11_logoutall mxr 3.4 and later pk11_makekeapubkey mxr 3.2 and later pk11_mappbemechanismtocryptomechanism mxr 3.2 and later pk11_mapsignkeytype mxr 3.11 and later pk11_mechanismtoalgtag mxr 3.4 and later pk11_mergetokens mxr 3.12 and later pk11_movesymkey mxr 3.9 and later pk11_needlogin ...
...And 3 more matches
NSS Key Log Format
note: starting with nss 3.24 (used by firefox 4
8 and 49 only), the sslkeylogfile approach is disabled by default for optimized builds using the makefile (those using gyp via build.sh are not affected).
...(see bug 11
88657.) notably, debian does not have this option enabled, see debian bug
842292.
... the following labels are defined, followed by a description of the secret: rsa: 4
8 bytes for the premaster secret, encoded as 96 hexadecimal characters (removed in nss 3.34) client_random: 4
8 bytes for the master secret, encoded as 96 hexadecimal characters (for ssl 3.0, tls 1.0, 1.1 and 1.2) client_early_traffic_secret: the hex-encoded early traffic secret for the client side (for tls 1.3) client_handshake_traffic_secret: the hex-encoded handshake traffic secret for the cli...
...And 3 more matches
NSS_3.11.10_release_notes.html
nss 3.11.10 release notes 200
8-12-10 newsgroup: <ahref="news: mozilla.dev.tech.crypto"="" news.mozilla.org="">mozilla.dev.tech.crypto</ahref="news:> contents introduction distribution information bugs fixed documentation compatibility feedback introduction network security services (nss) 3.11.10 is a patch release for nss 3.11.
... bug 2913
84: certutil -k behavior doesn't match usage bug 374247: modutil -disable command not disabling modules' slots bug 3
84459: certification path validation fails when authority key identifier extension contains key identifier bug 3
85946: can't import certificate into cert database in fips mode (certutil).
... bug 3
87
892: add entrust root ca certificate(s) to nss bug 396999: pk11_authenticate bug 39747
8: lock from ssl_initsymwrapkeyslock not freed on selfserv shutdown.
...And 3 more matches
NSS 3.12.5 release_notes
nss 3.12.5 requires nspr 4.
8.
... you can check out the source from cvs by cvs co -r nspr_4_
8_rtm nspr cvs co -r nss_3_12_5_rtm nss see the documentation section for the build instructions.
... bug 510435: remove unused make variable dso_ldflags bug 510436: add macros for build numbers (4th component of version number) to nssutil.h bug 511227: firefox 3.0.13 fails to compile on freebsd/powerpc bug 511312: nss fails to load softoken, looking for sqlite3.dll bug 5117
81: add new tls 1.2 cipher suites implemented in windows 7 to ssltap bug 516101: if pk11_importcert fails, it leaves the certificate undiscoverable by cert_pkixverifycert bug 51
8443: pk11_importandreturnprivatekey leaks an arena bug 51
8446: pk11_derencodepublickey leaks a certsubjectpublickeyinfo bug 51
8457: seckey_encodedersubjectpublickeyinfo and pk11_derencodepublickey are duplicate bug 522...
...And 3 more matches
NSS 3.16.3 release notes
notable changes in nss 3.16.3 the following 1024-bit ca certificates were removed cn = entrust.net secure server certification authority sha1 fingerprint: 99:a6:9b:e6:1a:fe:
88:6b:4d:2b:
82:00:7c:b
8:54:fc:31:7e:15:39 cn = gte cybertrust global root sha1 fingerprint: 97:
81:79:50:d
8:1c:96:70:cc:34:d
8:09:cf:79:44:31:36:7e:f4:74 ou = valicert class 1 policy validation authority sha1 fingerprint: e5:df:74:3c:b6:01:c4:9b:9
8:43:dc:ab:
8c:e
8:6a:
81:10:9f:e4:
8e ou = valicert class 2 policy validation authority sha1 ...
...fingerprint: 31:7a:2a:d0:7f:2b:33:5e:f5:a1:c3:4e:4b:57:e
8:b7:d
8:f1:fc:a6 ou = valicert class 3 policy validation authority sha1 fingerprint: 69:bd:
8c:f4:9c:d3:00:fb:59:2e:17:93:ca:55:6a:f3:ec:aa:35:fb additionally, the following ca certificate was removed as requested by the ca ou = tdc internet root ca sha1 fingerprint: 21:fc:bd:
8e:7f:6c:af:05:1b:d1:b3:43:ec:a
8:e7:61:47:f2:0f:
8a the following ca certificates were added cn = certification authority of wosign sha1 fingerprint: b9:42:94:bf:91:ea:
8f:b6:4b:e6:10:97:c7:fb:00:13:59:b6:76:cb cn = ca 沃通根证书 sha1 fingerprint: 16:32:47:
8d:
89:f9:21:3a:92:00:
85:63:f5:a4:a7:d3:12:40:
8a:d6 cn = digicert assured id root g2 ...
... sha1 fingerprint: a1:4b:4
8:d9:43:ee:0a:0e:40:90:4f:3c:e0:a4:c0:91:93:51:5d:3f cn = digicert assured id root g3 sha1 fingerprint: f5:17:a2:4f:9a:4
8:c6:c9:f
8:a2:00:26:9f:dc:0f:4
8:2c:ab:30:
89 cn = digicert global root g2 sha1 fingerprint: df:3c:24:f9:bf:d6:66:76:1b:26:
80:73:fe:06:d1:cc:
8d:4f:
82:a4 cn = digicert global root g3 sha1 fingerprint: 7e:04:de:
89:6a:3e:66:6d:00:e6:
87:d3:3f:fa:d9:3b:e
8:3d:34:9e cn = digicert trusted root g4 sha1 fingerprint: dd:fb:16:cd:49:31:c9:73:a2:03:7d:3f:c
8:3a:4d:7d:77:5d:05:e4 cn = quovadis root ca 1 g3 sha1 fingerprint: 1b:
8e:ea:57:96:29:1a:c9:39:ea:b
8:0a:
81:1a:73:73:c0:93:79:67 cn = quovadis root ca 2 g3 sha1 fingerprint: 09:3c...
...And 3 more matches
NSS 3.23 release notes
notable changes in nss 3.23 the copy of sqlite shipped with nss has been updated to version 3.10.2 (bug 123469
8) the list of tls extensions sent in the tls handshake has been reordered to increase compatibility of the extended master secret with servers (bug 1243641) the build time environment variable nss_enable_zlib has been renamed to nss_ssl_enable_zlib (bug 1243
872).
... the following ca certificates were removed cn = staat der nederlanden root ca sha-256 fingerprint: d4:1d:
82:9e:
8c:16:59:
82:2a:f9:3f:ce:62:bf:fc:de:26:4f:c
8:4e:
8b:95:0c:5f:f2:75:d0:52:35:46:95:a3 cn = netlock minositett kozjegyzoi (class qa) tanusitvanykiado sha-256 fingerprint: e6:06:dd:ee:e2:ee:7f:5c:de:f5:d9:05:
8f:f
8:b7:d0:a9:f0:42:
87:7f:6a:17:1e:d
8:ff:69:60:e4:cc:5e:a5 cn = netlock kozjegyzoi (class a) tanusitvanykiado sha-256 fingerprint: 7f:12:cd:5f:7e:5e:29:0e:c7:d
8:51:79:d5:b7:2c:20:a5:be:75:0
8:ff:db:5b:f
8:1a:b9:6
8:4a:7f:c9:f6:67 cn = netlock uzleti (class b) tanusitvany...
...kiado sha-256 fingerprint: 39:df:7b:6
8:2b:7b:93:
8f:
84:71:54:
81:cc:de:
8d:60:d
8:f2:2e:c5:9
8:
87:7d:0a:aa:c1:2b:59:1
8:2b:03:12 cn = netlock expressz (class c) tanusitvanykiado sha-256 fingerprint: 0b:5e:ed:4e:
84:64:03:cf:55:e0:65:
84:
84:40:ed:2a:
82:75:
8b:f5:b9:aa:1f:25:3d:46:13:cf:a0:
80:ff:3f friendly name: verisign class 1 public pca – g2 sha-256 fingerprint: 34:1d:e9:
8b:13:92:ab:f7:f4:ab:90:a9:60:cf:25:d4:bd:6e:c6:5b:9a:51:ce:6e:d0:67:d0:0e:c7:ce:9b:7f friendly name: verisign class 3 public pca sha-256 fingerprint: a4:b6:b3:99:6f:c2:f3:06:b3:fd:
86:
81:bd:63:41:3d:
8c:50:09:cc:4f:a3:29:c2:cc:f0:e2:fa:1b:14:03:05 friendly name: verisign class 3 public pca – g2 sha-256 fingerprint:
83:ce:3c:12:29:6...
...And 3 more matches
NSS 3.35 release notes
nss 3.35 requires nspr 4.1
8, or newer.
...this includes a large number of changes since 3.34, which supported only draft -1
8.
...nss supports two different database file formats: dbm: the legacy file format, based on berkeley db, using filenames cert
8.db, key3.db and secmod.db.
...And 3 more matches
NSS 3.41 release notes
introduction the nss team has released network security services (nss) 3.41 on 7 december 201
8, which is a minor release.
... nss 3.41 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_41_rtm/src/ new in nss 3.41 new functionality bug 1252
891 - implemented eku handling for ipsec ike.
... bug 1493215 - enabled the following ciphersuites by default: tls_ecdhe_ecdsa_with_aes_256_gcm_sha3
84 tls_ecdhe_rsa_with_aes_256_gcm_sha3
84 tls_dhe_rsa_with_aes_256_gcm_sha3
84 tls_rsa_with_aes_256_gcm_sha3
84 new functions none notable changes in nss 3.41 the following ca certificates were added: cn = certigna root ca sha-256 fingerprint: d4
8d3d23eedb50a459e55197601c27774b9d7b1
8c94d5a059511a10250b9316
8 cn = gts root r1 sha-256 fingerprint: 2a575471e31340bc215
81cbd2cf13e15
8463203ece94bcf9d3cc196bf09a5472 cn = gts root r2 sha-256 fingerprint: c45d7bb0
8e6d67e62e4235110b564e5f7
8fd92ef05
8c
840aea4e6455d75
85c60 cn = gts root r3 sha-256 fingerprint: 15d5b
8774619ea7d54ce1ca6...
...And 3 more matches
NSS 3.45 release notes
see bug 154
8360.
...see bug 156307
8.
... 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 1543
874 - expose an external clock for ssl this adds new experimental functions: ssl_settimefunc, ssl_createantireplaycontext, ssl_setantireplaycontext, and ssl_releaseantireplaycontext.
...And 3 more matches
NSS 3.51.1 release notes
notable changes in nss 3.51.1 bug 161796
8 - update delegated credentials implementation to draft-07.
... bug 161
8739 - don't assert fuzzer behavior in ssl_parsesessionticket.
... bug 161
8915 - fix ubsan issue in ssl_parsesessionticket.
...And 3 more matches
NSS 3.53 release notes
nss 3.53 will be a long-term support release, supporting firefox 7
8 esr.
...(bug 290526) seed is now moved into a new freebl directory freebl/deprecated (bug 16363
89).
...(bug 161
8404, bug 1621159) if a builtin certificate has a cka_nss_server_distrust_after timestamp before the sct or notbefore date of a certificate that builtin issued, then clients can elect not to trust it.
...And 3 more matches
NSS Tools crlutil
-p dbprefix specify the prefix used on the nss security database files (for example, my_cert
8.db and my_key3.db).
...list of possible algorithms: md2 | md4 | md5 | sha1 | sha256 | sha3
84 | sha512 -n nickname specify the nickname of a certificate or key to list, create, add to a database, modify, or validate.
...for more information see rfc #32
80 add the authority key identifier extension: the authority key identifier extension provides a means of identifying the public key corresponding to the private key used to sign a crl.
...And 3 more matches
How to embed the JavaScript engine
*/ static jsclass global_class = { "global", jsclass_global_flags, js_propertystub, js_deletepropertystub, js_propertystub, js_strictpropertystub, js_enumeratestub, js_resolvestub, js_convertstub, }; int main(int argc, const char *argv[]) { jsruntime *rt = js_newruntime(
8l * 1024 * 1024, js_use_helper_threads); if (!rt) return 1; jscontext *cx = js_newcontext(rt,
8192); if (!cx) return 1; { // scope for our various stack objects (jsautorequest, rootedobject), so they all go // out of scope before we js_destroycontext.
... jsclass global_class = { "global", jsclass_global_flags, js_propertystub, js_deletepropertystub, js_propertystub, js_strictpropertystub, js_enumeratestub, js_resolvestub, js_convertstub, nullptr, nullptr, nullptr, nullptr, js_globalobjecttracehook }; int main(int argc, const char *argv[]) { js_init(); jsruntime *rt = js_newruntime(
8l * 1024 * 1024, js_use_helper_threads); if (!rt) return 1; jscontext *cx = js_newcontext(rt,
8192); if (!cx) return 1; { // scope for our various stack objects (jsautorequest, rootedobject), so they all go // out of scope before we js_destroycontext.
...const char *filename = "noname"; int lineno = 1; bool ok = js_evaluatescript(cx, global, script, strlen(script), filename, lineno, &rval); if (!ok) return 1; } jsstring *str = rval.tostring(); printf("%s\n", js_encodestring(cx, str)); } js_destroycontext(cx); js_destroyruntime(rt); js_shutdown(); return 0; } spidermonkey 3
8 // following code might be needed in some case // #define __stdc_limit_macros // #include <stdint.h> #include "jsapi.h" /* the class of the global object.
...And 3 more matches
JSObjectOps.defaultValue
obsolete since javascript 1.
8.5this feature is obsolete.
...see bug 40
8416 for details.
... description the jsobjectops.defaultvalue callback corresponds to the [[defaultvalue]] method defined in ecma 262-3 §
8.6.2.6.
...And 3 more matches
JS_EncodeCharacters
convert a 16-bit string to an
8-bit string.
... description js_encodecharacters copies the characters of a jschar array into a char array, converting the 16-bit values to
8-bit values.
... if spidermonkey was built with js_c_strings_are_utf
8 defined or js_setcstringsareutf
8 was called, the string is converted to utf-
8.
...And 3 more matches
JS_NewObject
syntax // added in spidermonkey 45 jsobject * js_newobject(jscontext *cx, const jsclass *clasp); bool js_newobjectwithgivenproto(jscontext *cx, const jsclass *clasp, js::handle<jsobject*> proto); // obsolete since spidermonkey 3
8 jsobject * js_newobject(jscontext *cx, const jsclass *clasp, js::handle<jsobject*> proto, js::handle<jsobject*> parent); jsobject * js_newobjectwithgivenproto(jscontext *cx, const jsclass *clasp, js::handle<jsobject*> proto, js::handle<jsobject*> parent); // added in spidermonkey 1.
8 name type description cx jscontext * the context in which to create the new object.
... added in spidermonkey 1.
8.1 clasp->flags must not have the jsclass_global_flags bits set (use js_newglobalobject instead).
...obsolete since jsapi 3
8 js_newobject now always uses a default prototype object.
...And 3 more matches
JS_SetOptions
mxr id search for jsoption_dont_report_uncaught jsoption_relimit added in spidermonkey 1.
8 throw an exception if a regular expression backtracks more than n3 times, where n is the length of the input string.
... mxr id search for jsoption_relimit jsoption_anonfunfix added in spidermonkey 1.
8 disallow function () {} in statement context, per ecma-262 edition 3.
... mxr id search for jsoption_anonfunfix jsoption_jit obsolete since jsapi 11 added in spidermonkey 1.
8.1 enables the jit compilation of code in the context.
...And 3 more matches
Setting up an update server
most likely, a different maintenance service is already installed, probably at c:\program files (x
86)\mozilla maintenance service\maintenanceservice.exe.
...also, the mozilla maintenance service is only used if the install directory is within c:\program files or c:\program files (x
86), so make sure your install directory is in one of those locations.
... <?xml version="1.0" encoding="utf-
8"?> <updates> <update type="minor" displayversion="2000.0a1" appversion="2000.0a1" platformversion="2000.0a1" buildid="211
81002100236"> <patch type="complete" url="http://127.0.0.1:
8000/<mar name>" hashfunction="sha512" hashvalue="<hash>" size="<size>"/> </update> </updates> if you've downloaded the mar you're using, you'll find the sha512 value in a file called sha512sums in the ...
...And 3 more matches
Avoiding leaks in JavaScript XPCOM components
this problem is only in versions of mozilla prior to mozilla 1.
8.
...the situation with javascript properties on dom nodes may also improve—see bug 2
83129—but it requires substantial changes.) things not to do everybody writing, reviewing, or checking in javascript code to mozilla cvs should understand why these things are bad.
...if you implement nsiobserver in javascript and register that observer (without using weak references) with a service (for example, with the observer service bug 239
833 or with the pref service bug 256
822), the service will do exactly what you tell it to do: notify the observer you just created until you unregister the observer.
...And 3 more matches
nsIHttpChannelInternal
localaddress autf
8string the local ip address to which the channel is bound, in the same format produced by pr_netaddrtostring().
...see bug 53469
8 and bug 526207.
...see bug 53469
8 and bug 526207.
...And 3 more matches
nsINavHistoryResultViewer
method overview void containerclosed(in nsinavhistorycontainerresultnode acontainernode); void containeropened(in nsinavhistorycontainerresultnode acontainernode); void invalidatecontainer(in nsinavhistorycontainerresultnode acontainernode); void nodeannotationchanged(in nsinavhistoryresultnode anode, in autf
8string aannoname); void nodedateaddedchanged(in nsinavhistoryresultnode anode, in prtime anewvalue); void nodelastaddedchanged(in nsinavhistoryresultnode anode, in prtime anewvalue); void nodehistorydetailschanged(in nsinavhistoryresultnode anode, in prtime anewvisitdate, in unsigned long anewaccesscount); void nodeiconchanged(in nsinavhistoryresultnode anod...
...e); void nodekeywordchanged(in nsinavhistoryresultnode anode, in autf
8string anewkeyword); void nodemoved(in nsinavhistoryresultnode anode, in nsinavhistorycontainerresultnode aoldparent, in unsigned long aoldindex, in nsinavhistorycontainerresultnode anewparent, in unsigned long anewindex); void nodetitlechanged(in nsinavhistoryresultnode anode, in autf
8string anewtitle); void noderemoved(in nsinavhistorycontainerresultnode aparent, in nsinavhistoryresultnode anode, in unsigned long aoldindex); void nodetagschanged(in nsinavhistoryresultnode anode); void nodeurichanged(in nsinavhistoryresultnode anode, in autf
8string anewuri); void nodereplaced(in nsinavhistorycontainerresultnode parent, in nsinavhistoryresultnode olditem,...
... void nodeannotationchanged( in nsinavhistoryresultnode anode, in autf
8string aannoname ); parameters anode the node whose title has changed.
...And 3 more matches
nsIProxyInfo
last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) inherits from: nsisupports attributes attribute type description failoverproxy nsiproxyinfo this attribute specifies the proxy to failover to when this proxy fails.
... host autf
8string this attribute specifies the hostname of the proxy server.
... note: prior to gecko 1.
8 host was available by the host method.
...And 3 more matches
nsISocketTransportService
nsisockettransport createtransport(in array<acstring> asockettypes, in autf
8string ahost, in long aport, in nsiproxyinfo aproxyinfo); void init(); obsolete since gecko 1.
8 void notifywhencanattachsocket(in nsirunnable aevent); native code only!
... void shutdown(); obsolete since gecko 1.
8 attributes attribute type description autodialenabled boolean controls whether or not the socket transport service should poke the autodialer on connection failure.
... obsolete since gecko 1.
8 methods native code only!
...And 3 more matches
nsITreeView
method overview boolean candrop(in long index, in long orientation, in nsidomdatatransfer datatransfer); boolean candropbeforeafter(in long index, in boolean before); obsolete since gecko 1.
8 boolean candropon(in long index); obsolete since gecko 1.
8 void cyclecell(in long row, in nsitreecolumn col); void cycleheader(in nsitreecolumn col); void drop(in long row, in long orientation, in nsidomdatatransfer datatransfer); astring getcellproperties(in long row, in nsitreecolumn col, in nsisupportsarray properties obsolete since gecko 22); ...
... constants constant value description progress_normal 1 note: renamed from progressnormal in gecko 1.
8 progress_undetermined 2 note: renamed from progressundetermined in gecko 1.
8 progress_none 3 note: renamed from progressnone in gecko 1.
8 drop_before -1 drop_on 0 drop_after 1 indropbefore 0 obsolete since gecko 1.
8 indropon 1 obsolete since gecko 1.
8 indropaf...
...ter 2 obsolete since gecko 1.
8 methods candrop() methods used by the drag feedback code to determine if a drag is allowable at the current location.
...And 3 more matches
nsIURIFixup
: nsisupports last changed in gecko 9.0 (firefox 9.0 / thunderbird 9.0 / seamonkey 2.6) implemented by: @mozilla.org/docshell/urifixup;1 as a service: var urifixup = components.classes["@mozilla.org/docshell/urifixup;1"] .createinstance(components.interfaces.nsiurifixup); method overview nsiuri createexposableuri(in nsiuri auri); nsiuri createfixupuri(in autf
8string auritext, in unsigned long afixupflags); nsiuri keywordtouri(in autf
8string akeyword); nsiurifixupinfo getfixupuriinfo(in autf
8string auritext, in unsigned long afixupflags); constants constant value description fixup_flag_none 0 no fixup flags.
... fixup_flag_use_utf
8 4 use utf-
8 to encode the uri instead of the platform character set.
... fixup_flag_fix_scheme_typos
8 fix common scheme typos.
...And 3 more matches
nsIWebNavigation
load_flags_replace_history 12
8 this flag specifies that any existing history entry should be replaced.
... load_flags_stop_content 204
8 if this flag is set, stop() will be called before the load starts and will stop both content and network activity (the default is to only stop network activity).
... load_flags_allow_third_party_fixup
8192 this flag specifies that the uri may be submitted to a third-party server for correction.
...And 3 more matches
nsIMsgCloudFileProvider
constant value description offlineerr 0x
80550014 returned when it appears that there is no active network connection.
... autherr 0x
8055001e returned when authorizing has failed.
... uploaderr 0x
8055311a returned when uploading has failed for an unknown reason.
...And 3 more matches
ctypes
type description int
8_t signed
8-bit integer.
... uint
8_t unsigned
8-bit integer.
... character types character types are
8-bit values that behave like their c counterparts.
...And 3 more matches
Mozilla
if the bitmaps resulting from displaying the two files in an
800x1000 window are identical, the test passes.
... creating sandboxed http connections starting with gecko 1.
8.1 (firefox 2), it is possible to create sandboxed http connections which don't affect the user's cookies.
... integrated authentication this entails support for the the simple and protected gss-api negotiation mechanism (spnego) internet standard (rfc 247
8) to negotiate either kerberos, ntlm, or other authentication protocols supported by the operating system.
...And 3 more matches
Plug-in Basics - Plugins
i found other way how check which paths support firefox : $ strace -y /usr/bin/firefox 2>&1 | grep acces | grep -v search | grep plugins access("/home/user_name/.mozilla/firefox/dqh2nb5k.default-1441
864569209/plugins", f_ok) = -1 enoent (no such file or directory) access("/home/user_name/.mozilla/plugins", f_ok) = -1 enoent (no such file or directory) access("/usr/lib64/firefox/browser/plugins", f_ok) = -1 enoent (no such file or directory) access("/usr/lib/mozilla/plugins", f_ok) = 0 this output i have after close firefox.
... about distributions: example debian 64bit probably use: /lib/x
86_64-linux-gnu/ --> for 64 libs /lib/i3
86-linux-gnu/ --> for 32 libs if exist /lib32/ --> this is symlinked (or bind mounted) desired proper directory /lib64/ --> this is symlinked (or bind mounted) desired proper directory more in https://wiki.debian.org/multiarch/thecaseformultiarch if something wrong, please edit.
... 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/x
86/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.
...And 3 more matches
AnalyserNode.getByteFrequencyData() - Web APIs
the getbytefrequencydata() method of the analysernode interface copies the current frequency data into a uint
8array (unsigned byte array) passed into it.
...for example, for 4
8000 sample rate, the last item of the array will represent the decibel value for 24000 hz.
... syntax var audioctx = new audiocontext(); var analyser = audioctx.createanalyser(); var dataarray = new uint
8array(analyser.frequencybincount); // uint
8array should be the same length as the frequencybincount void analyser.getbytefrequencydata(dataarray); // fill the uint
8array with data returned from getbytefrequencydata() parameters array the uint
8array that the frequency domain data will be copied to.
...And 3 more matches
AnalyserNode - Web APIs
udionode" 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="2
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/analysernode" target="_top"><rect x="2
81" y="1" width="120" height="50" fill="#f4f7f
8" 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-baseline="middle">analysernode</text></a></svg></div> a:hover text { fill: #...
... analysernode.getbytefrequencydata() copies the current frequency data into a uint
8array (unsigned byte array) passed into it.
... analysernode.getbytetimedomaindata() copies the current waveform, or time-domain, data into a uint
8array (unsigned byte array) passed into it.
...And 3 more matches
AudioWorkletProcessor.process - Web APIs
important: currently, audio data blocks are always 12
8 frames long—that is, they contain 12
8 32-bit floating-point samples for each of the inputs' channels.
...each channel is a float32array containing 12
8 samples.
... if the automation rate of the parameter is "a-rate", the array will contain 12
8 values — one for each frame in the current audio block.
...And 3 more matches
console - Web APIs
the object is:", someobject); this output will look like this: [09:2
8:22.711] my first car was a dodge charger .
...you've called me %d times.", "bob", i+1); } the output looks like this: [13:14:13.4
81] hello, bob.
...[13:14:13.4
83] hello, bob.
...And 3 more matches
Using Fetch - Web APIs
mdata.append('photos', photos.files[i]); } fetch('https://example.com/posts', { method: 'post', body: formdata, }) .then(response => response.json()) .then(result => { console.log('success:', result); }) .catch(error => { console.error('error:', error); }); processing a text file line by line the chunks that are read from a response are not broken neatly at line boundaries and are uint
8arrays, not strings.
...the following example shows one way to do this by creating a line iterator (for simplicity, it assumes the text is utf-
8, and doesn't handle fetch errors).
... async function* maketextfilelineiterator(fileurl) { const utf
8decoder = new textdecoder('utf-
8'); const response = await fetch(fileurl); const reader = response.body.getreader(); let { value: chunk, done: readerdone } = await reader.read(); chunk = chunk ?
...And 3 more matches
HTMLImageElement.srcset - Web APIs
all of the following are valid image candidate strings: "images/team-photo.jpg 1x, images/team-photo-retina.jpg 2x, images/team-photo-full 204
8w" this string provides versions of an image to be used at the standard pixel density (1x) as well as double that pixel density (2x).
... also available is a version of the image for use at a width of 204
8 pixels (204
8w).
... <div class="box"> <img src="/files/16797/clock-demo-200px.png" alt="clock" srcset="/files/16
864/clock-demo-200px.png 1x, /files/16797/clock-demo-400px.png 2x"> </div> css the css simply specifies that the image and its surrounding box should be 200 pixels square and should have a simple border around it.
...And 3 more matches
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 1
80" preserveaspectratio="xminymin meet"><a xlink: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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4...
...e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:h...
...And 3 more matches
KeyboardEvent.location - Web APIs
dom_key_location_mobile obsolete since gecko 3
8 4 the key was on a mobile device; this can be on either a physical keypad or a virtual keyboard.
... note: gecko always returns dom_key_location_mobile on android (prior to 1
8) and maemo.
... however, at gecko 3
8, this is dropped.
...And 3 more matches
MediaDevices.getUserMedia() - Web APIs
the following expresses a preference for 12
80x720 camera resolution: { audio: true, video: { width: 12
80, height: 720 } } the browser will try to honour this, but may return other resolutions if an exact match is not available, or the user overrides it.
...the following demands a minimum resolution of 12
80x720: { audio: true, video: { width: { min: 12
80 }, height: { min: 720 } } } if no camera exists with this resolution or higher, then the returned promise will be rejected with overconstrainederror, and the user will not be prompted.
...here's a full example: { audio: true, video: { width: { min: 1024, ideal: 12
80, max: 1920 }, height: { min: 576, ideal: 720, max: 10
80 } } } an ideal value, when used, has gravity, which means that the browser will try to find the setting (and camera, if you have more than one), with the smallest fitness distance from the ideal values given.
...And 3 more matches
PerformanceLongTaskTiming - Web APIs
: 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 xlink: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="none"/><line x1="171" y1="25" x2="201" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/performancelongtasktiming" target="_top"><rect x="201" y="1" wi...
...dth="250" height="50" fill="#f4f7f
8" 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.
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetperformancelongtasktiming experimentalchrome full support 5
8edge full support ≤79firefox no support nonotes no support nonotes notes see bug 134
8405.ie ?
...And 3 more matches
PushEvent - Web APIs
full support 17firefox full support 44notes full support 44notes notes extended support releases (esr) before firefox 7
8 esr do not support service workers and the push api.ie no support noopera full support 37safari no support nowebview android no support nochrome android full support 42firefo...
...x android full support 44 full support 44 full support 4
8notes notes push enabled by default.opera android full support 37safari ios no support nosamsung internet android full support 4.0pushevent() constructor experimentalchrome full support 42edge full support 16disabled full support 16disabled disabled from version 16: this feature is behind the enable service workers preference.
... full support 17firefox full support 44notes full support 44notes notes extended support releases (esr) before firefox 7
8 esr do not support service workers and the push api.ie no support noopera full support 37safari no support nowebview android no support nochrome android full support 42firefox android full support 44 full support 44 ...
...And 3 more matches
ReadableStreamDefaultReader.read() - Web APIs
each chunk is read sequentially and output to the ui as an array of utf-
8 bytes, until the stream has finished being read, at which point we return out of the recursive function and print the entire stream to another part of the ui.
... if (done) { console.log("stream complete"); para.textcontent = result; return; } // value for fetch streams is a uint
8array charsreceived += value.length; const chunk = value; let listitem = document.createelement('li'); listitem.textcontent = 'received ' + charsreceived + ' characters so far.
...it deals with stream chunks not ending on line boundaries and converting from uint
8array to strings.
...And 3 more matches
SubtleCrypto.digest() - Web APIs
supported values are: sha-1 (but don't use this in cryptographic applications) sha-256 sha-3
84 sha-512.
... sha-1 this algorithm is specified in fips 1
80-4, section 6.1, and produces an output 160 bits long.
... sha-256 this algorithm is specified in fips 1
80-4, section 6.2, and produces an output 256 bits long.
...And 3 more matches
Matrix math for the web - Web APIs
multiply a matrix and a point — multiplymatrixandpoint(): // point • matrix function multiplymatrixandpoint(matrix, point) { // give a simple variable name to each part of the matrix, a column and row number let c0r0 = matrix[ 0], c1r0 = matrix[ 1], c2r0 = matrix[ 2], c3r0 = matrix[ 3]; let c0r1 = matrix[ 4], c1r1 = matrix[ 5], c2r1 = matrix[ 6], c3r1 = matrix[ 7]; let c0r2 = matrix[
8], c1r2 = matrix[ 9], c2r2 = matrix[10], c3r2 = matrix[11]; let c0r3 = matrix[12], c1r3 = matrix[13], c2r3 = matrix[14], c3r3 = matrix[15]; // now set some simple names for the point let x = point[0]; let y = point[1]; let z = point[2]; let w = point[3]; // multiply the point against each part of the 1st column, then add together let resultx = (x * c0r0) + (y * c0r1) + (z * c0r2)...
...the function from above can be re-used to help out in this process: //matrixb • matrixa function multiplymatrices(matrixa, matrixb) { // slice the second matrix up into rows let row0 = [matrixb[ 0], matrixb[ 1], matrixb[ 2], matrixb[ 3]]; let row1 = [matrixb[ 4], matrixb[ 5], matrixb[ 6], matrixb[ 7]]; let row2 = [matrixb[
8], matrixb[ 9], matrixb[10], matrixb[11]]; let row3 = [matrixb[12], matrixb[13], matrixb[14], matrixb[15]]; // multiply each row by matrixa let result0 = multiplymatrixandpoint(matrixa, row0); let result1 = multiplymatrixandpoint(matrixa, row1); let result2 = multiplymatrixandpoint(matrixa, row2); let result3 = multiplymatrixandpoint(matrixa, row3); // turn the result rows back int...
...o a single matrix return [ result0[0], result0[1], result0[2], result0[3], result1[0], result1[1], result1[2], result1[3], result2[0], result2[1], result2[2], result2[3], result3[0], result3[1], result3[2], result3[3] ]; } let's look at this function in action: let somematrix = [ 4, 0, 0, 0, 0, 3, 0, 0, 0, 0, 5, 0, 4,
8, 4, 1 ] let identitymatrix = [ 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1 ]; // returns a new array equivalent to somematrix let somematrixresult = multiplymatrices(identitymatrix, somematrix); important: these matrix functions are written for clarity of explanation, not for speed or memory management.
...And 3 more matches
Functions and classes available to Web Workers - Web APIs
3
8 (3
8) no support no support no support cache cache api provides the ability to programmatically control cache storage associated with current origin.
... 3
8 (3
8) (yes) (yes) (yes) crypto the crypto interface represents basic cryptography features available in the current context.
... 4
8 (4
8) (yes) (yes) (yes) domrequest and domcursor respectively, these objects represents an ongoing operation (with listeners for reacting to the operation completely successfully, or failing, for example), and an ongoing operation over a list of results.
...And 3 more matches
Accessibility Information for Web Authors - Accessibility
guidelines and regulations section 50
8 guidelines for web authors these guidelines must be followed by u.s.
... automated checking & repair cynthia says™ from hisoftware® company "cynthia says™" is a free online webpage accessibility validation service that is designed to identify errors in webpage related to section 50
8 standards and/or the wcag guidelines.
...the web author chooses the guidelines (as a basis for errors and warnings) to be used by "cynthia says™": section 50
8, wcag priorities 1, 2 and 3.
...And 3 more matches
CSS grids, logical values, and writing modes - CSS: Cascading Style Sheets
.wrapper > p { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; margin: 1em; color: #d94
80f; max-width: 300px; } <div class="wrapper"> <p style="writing-mode: horizontal-tb">i have writing mode set to the default <code>horizontal-tb</code></p> <p style="writing-mode: vertical-rl">i have writing mode set to <code>vertical-rl</code></p> </div> writing modes in grid layouts if we now take a look at a grid layout exa...
...it then moves onto the next line, creating a new row track, and fills in more items: * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } .wrapper { display: grid; grid-template-columns: repeat(3, 100px); grid-template-rows: repeat(2, 100px); grid-gap: 10px; } <div class="wrapper"> <div class="item1">item 1</div> <div class="item2">item 2</div> <div class="item3">item 3</div> <div class="item4">item 4</div> <div class="item5">item 5</div> </div> if we add writin...
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } .wrapper { writing-mode: vertical-lr; display: grid; grid-template-columns: repeat(3, 100px); grid-template-rows: repeat(2, 100px); grid-gap: 10px; } <div class="wrapper"> <div class="item1">item 1</div> <div class="item2">item 2</div> <div class="item3">item 3</div> <div class="item4">item 4</div> <div class="item5">item 5</div>...
...And 3 more matches
Grid template areas - CSS: Cascading Style Sheets
hd hd hd hd hd hd hd" "sd sd sd main main main main main main" "ft ft ft ft ft ft ft ft ft"; } * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; max-width: 940px; margin: 0 auto; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } <div class="wrapper"> <div class="header">header</div> <div class="sidebar">sidebar</div> <div class="content">content</div> <div class="footer">footer</div> </div> using this method we do not need to specify anything at all on the individual grid items, everything happens on our grid container.
....header { grid-area: hd; } .footer { grid-area: ft; } .content { grid-area: main; } .sidebar { grid-area: sd; } * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; max-width: 940px; margin: 0 auto; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } .wrapper { display: grid; grid-template-columns: repeat(9, 1fr); grid-auto-rows: minmax(100px, auto); grid-template-areas: "hd hd hd hd hd hd hd hd hd" "sd sd sd main main main main main main" ".
....header { grid-area: hd; } .footer { grid-area: ft; } .content { grid-area: main; } .sidebar { grid-area: sd; } * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; max-width: 940px; margin: 0 auto; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } .wrapper { display: grid; grid-template-columns: repeat(9, 1fr); grid-auto-rows: minmax(100px, auto); grid-template-areas: "hd hd hd hd hd hd hd hd hd" "sd sd sd main main main main main main" "sd sd sd ft ft ft ft ft ft"; } <div class="wrapper"> <div class="header">header</div> <div cla...
...And 3 more matches
Realizing common layouts using CSS Grid Layout - CSS: Cascading Style Sheets
* {box-sizing: border-box;} .wrapper { max-width: 1024px; margin: 0 auto; font: 1.2em helvetica, arial, sans-serif; } .wrapper > * { border: 2px solid #f0
8c00; background-color: #ffec99; border-radius: 5px; padding: 10px; } nav ul { list-style: none; margin: 0; padding: 0; } <div class="wrapper"> <header class="main-head">the header</header> <nav class="main-nav"> <ul> <li><a href="">nav 1</a></li> <li><a href="">nav 2</a></li>...
... .wrapper { max-width: 1024px; margin: 0 auto; font: 1.2em helvetica, arial, sans-serif; } .wrapper > * { border: 2px solid #f0
8c00; background-color: #ffec99; border-radius: 5px; padding: 10px; } .wrapper { display: grid; grid-template-columns: repeat(12, [col-start] 1fr); grid-gap: 20px; } to demonstrate how this grid system works i have four child elements inside my wrapper.
... * {box-sizing: border-box;} .wrapper { max-width: 1024px; margin: 0 auto; font: 1.2em helvetica, arial, sans-serif; } .wrapper > * { border: 2px solid #f0
8c00; background-color: #ffec99; border-radius: 5px; padding: 10px; } nav ul { list-style: none; margin: 0; padding: 0; } <div class="wrapper"> <header class="main-head">the header</header> <nav class="main-nav"> <ul> <li><a href="">nav 1</a></li> <li><a href="">nav 2</a></li>...
...And 3 more matches
Using CSS gradients - CSS: Cascading Style Sheets
<div class="multicolor-linear"></div> div { width: 120px; height: 120px; } .multicolor-linear { background: linear-gradient(to left, lime 2
8px, red 77%, cyan); } creating hard lines to create a hard line between two colors, creating a stripe instead of a gradual transition, adjacent color stops can be set to the same location.
... <div class="multiposition-stops"></div> <div class="multiposition-stop2"></div> div { width: 120px; height: 120px; float: left; margin-right: 10px; box-sizing: border-box; } .multiposition-stops { background: linear-gradient(to left, lime 20%, red 30%, red 45%, cyan 55%, cyan 70%, yellow
80% ); background: linear-gradient(to left, lime 20%, red 30% 45%, cyan 55% 70%, yellow
80% ); } .multiposition-stop2 { background: linear-gradient(to left, lime 25%, red 25%, red 50%, cyan 50%, cyan 75%, yellow 75% ); background: linear-gradient(to left, lime 25%, red 25% 50%, cyan 50% 75%, yellow 75% ); } in the first example above, the lime goes from the 0% mark, ...
... <div class="stacked-linear"></div> div { width: 200px; height: 200px; } .stacked-linear { background: linear-gradient(217deg, rgba(255,0,0,.
8), rgba(255,0,0,0) 70.71%), linear-gradient(127deg, rgba(0,255,0,.
8), rgba(0,255,0,0) 70.71%), linear-gradient(336deg, rgba(0,0,255,.
8), rgba(0,0,255,0) 70.71%); } using radial gradients radial gradients are similar to linear gradients, except that they radiate out from a central point.
...And 3 more matches
animation-timing-function - CSS: Cascading Style Sheets
tion-timing-function: cubic-bezier(0.1, 0.7, 1.0, 0.1); animation-timing-function: steps(4, end); /* steps function keywords */ animation-timing-function: steps(4, jump-start); animation-timing-function: steps(10, jump-end); animation-timing-function: steps(20, jump-none); animation-timing-function: steps(5, jump-both); animation-timing-function: steps(6, start); animation-timing-function: steps(
8, end); /* multiple animations */ animation-timing-function: ease, step-start, cubic-bezier(0.1, 0.7, 1.0, 0.1); /* global values */ animation-timing-function: inherit; animation-timing-function: initial; animation-timing-function: unset; timing functions may be specified on individual keyframes in a @keyframes rule.
... ease-out equal to cubic-bezier(0, 0, 0.5
8, 1.0), starts quickly, slowing down the animation continues.
... • ease-in-out equal to cubic-bezier(0.42, 0, 0.5
8, 1.0), with the animating properties slowly transitioning, speeding up, and then slowing down again.
...And 3 more matches
transition-timing-function - CSS: Cascading Style Sheets
function: steps(4, jump-end); transition-timing-function: cubic-bezier(0.1, 0.7, 1.0, 0.1); /* steps function keywords */ transition-timing-function: steps(4, jump-start); transition-timing-function: steps(10, jump-end); transition-timing-function: steps(20, jump-none); transition-timing-function: steps(5, jump-both); transition-timing-function: steps(6, start); transition-timing-function: steps(
8, end); /* multiple timing functions */ transition-timing-function: ease, step-start, cubic-bezier(0.1, 0.7, 1.0, 0.1); /* global values */ transition-timing-function: inherit; transition-timing-function: initial; transition-timing-function: unset; values <timing-function> each <timing-function> represents the timing function to link to the corresponding property to transition, as defined i...
... ease-out equal to cubic-bezier(0, 0, 0.5
8, 1.0), starts transitioning quickly, slowing down the transition continues.
... • ease-in-out equal to cubic-bezier(0.42, 0, 0.5
8, 1.0), starts transitioning slowly, speeds up, and then slows down again.
...And 3 more matches
Index - Developer guides
8 creating a cross-browser video player apps, html5, video, full screen this article describes a simple html5 video player that uses the media and fullscreen apis and works across most major desktop and mobile browsers.
... 1
8 creating and triggering events advanced, dom, guide, javascript, needscontent, events this article demonstrates how to create and dispatch dom events.
... 2
8 guide to web apis api, guide, landing, web the web includes a wide array of apis that can be used from javascript to build increasingly more powerful and capable applications, running either on the web, locally, or through technology such as node.js, on a server.
...And 3 more matches
DASH Adaptive Streaming for HTML 5 Video - HTML: Hypertext Markup Language
see bug 77
8617 for details.
... for example: the file in.video can be any container with at least one audio and one video stream that can be decoded by ffmpeg, create the audio using: ffmpeg -i in.video -vn -acodec libvorbis -ab 12
8k -dash 1 my_audio.webm create each video variant.
... ffmpeg -i in.video -c:v libvpx-vp9 -keyint_min 150 -g 150 -tile-columns 4 -frame-parallel 1 -f webm -dash 1 \ -an -vf scale=160:90 -b:v 250k -dash 1 video_160x90_250k.webm ffmpeg -i in.video -c:v libvpx-vp9 -keyint_min 150 -g 150 -tile-columns 4 -frame-parallel 1 -f webm -dash 1 \ -an -vf scale=320:1
80 -b:v 500k -dash 1 video_320x1
80_500k.webm ffmpeg -i in.video -c:v libvpx-vp9 -keyint_min 150 -g 150 -tile-columns 4 -frame-parallel 1 -f webm -dash 1 \ -an -vf scale=640:360 -b:v 750k -dash 1 video_640x360_750k.webm ffmpeg -i in.video -c:v libvpx-vp9 -keyint_min 150 -g 150 -tile-columns 4 -frame-parallel 1 -f webm -dash 1 \ -an -vf scale=640:360 -b:v 1000k -dash 1 video_640x360_1000k.webm ffmpeg -i in.video -c:v libvpx-vp9 -keyint_min 150 -g 150 -tile-columns 4 -frame-parallel 1 -f...
...And 3 more matches
Microformats - HTML: Hypertext Markup Language
dt-published when the entry was published p-summary short entry summary e-content full content of the entry parsed reply h-entry example <div class="h-entry"> <p><span class="p-author h-card"> <a href="https://quickthoughts.jgregorymcverry.com/profile/jgmac1106" ><img class="u-photo" src="https://quickthoughts.jgregorymcverry.com/file/2d6c9cfed7ac
8e
849f492b5bc7e6a630/thumb.jpg"/></a> <a class="p-name u-url" href="https://quickthoughts.jgregorymcverry.com/profile/jgmac1106">greg mcverry</a></span> replied to <a class="u-in-reply-to" href="/docs/web/html/microformats">a post on <strong>developer.mozilla.org</strong> </a>: </p> <p class="p-name e-content">hey thanks for making this microformats resource</p> <p> <a href="htt...
...tml": "hey thanks for making this microformats resource", "value": "hey thanks for making this microformats resource", "lang": "en" } ], "author": [ { "type": [ "h-card" ], "properties": { "name": [ "greg mcverry" ], "photo": [ "https://quickthoughts.jgregorymcverry.com/file/2d6c9cfed7ac
8e
849f492b5bc7e6a630/thumb.jpg" ], "url": [ "https://quickthoughts.jgregorymcverry.com/profile/jgmac1106" ] }, "lang": "en", "value": "greg mcverry" } ] }, "lang": "en" } h-feed the h-feed is a stream or feed of h-entry posts, like complete posts on a home page or archive pages, or summaries or other brief lists ...
...h-event is often used with both event listings and individual event pages <div class="h-event"> <h1 class="p-name">microformats meetup</h1> <p>from <time class="dt-start" datetime="2013-06-30 12:00">30<sup>th</sup> june 2013, 12:00</time> to <time class="dt-end" datetime="2013-06-30 1
8:00">1
8:00</time> at <span class="p-location">some bar in sf</span></p> <p class="p-summary">get together and discuss all things microformats-related.</p> </div> properties property description p-name event name (or title) p-summary short summary of the event dt-start datetime the event starts dt-end datetime the event ends ...
...And 3 more matches
A typical HTTP session - HTTP
with tcp the default port, for an http server on a computer, is port
80.
... other ports can also be used, like
8000 or
80
80.
... the url of a page to fetch contains both the domain name, and the port number, though the latter can be omitted if it is
80.
...And 3 more matches
HTTP response status codes - HTTP
20
8 already reported (webdav) used inside a <dav:propstat> response element to avoid repeatedly enumerating the internal members of multiple bindings to the same collection.
... 30
8 permanent redirect this means that the resource is now permanently located at another uri, specified by the location: http response header.
... 40
8 request timeout this response is sent on an idle connection by some servers, even without any previous request by the client.
...And 3 more matches
Functions - JavaScript
a non-primitive value, such as array or a user-defined object) as a parameter and the function changes the object's properties, that change is visible outside the function, as shown in the following example: function myfunc(theobject) { theobject.make = 'toyota'; } var mycar = {make: 'honda', model: 'accord', year: 199
8}; var x, y; x = mycar.make; // x gets the value "honda" myfunc(mycar); y = mycar.make; // y gets the value "toyota" // (the make property was changed by the function) function expressions while the function declaration above is syntactically a statement, functions can also be created by a function expression.
... function map(f, a) { let result = []; // create a new array let i; // declare variable for (i = 0; i != a.length; i++) result[i] = f(a[i]); return result; } const f = function(x) { return x * x * x; } let numbers = [0, 1, 2, 5, 10]; let cube = map(f,numbers); console.log(cube); function returns: [0, 1,
8, 125, 1000].
... // returns 41 since the inner function forms a closure, you can call the outer function and specify arguments for both the outer and inner function: function outside(x) { function inside(y) { return x + y; } return inside; } fn_inside = outside(3); // think of it like: give me a function that adds 3 to whatever you give // it result = fn_inside(5); // returns
8 result1 = outside(3)(5); // returns
8 preservation of variables notice how x is preserved when inside is returned.
...And 3 more matches
Arrow function expressions - JavaScript
shorter functions var elements = [ 'hydrogen', 'helium', 'lithium', 'beryllium' ]; // this statement returns the array: [
8, 6, 7, 9] elements.map(function(element) { return element.length; }); // the regular function above can be written as the arrow function below elements.map((element) => { return element.length; }); // [
8, 6, 7, 9] // when there is only one parameter, we can remove the surrounding parentheses elements.map(element => { return element.length; }); // [
8, 6, 7, 9] // when the only statement i...
...n an arrow function is `return`, we can remove `return` and remove // the surrounding curly brackets elements.map(element => element.length); // [
8, 6, 7, 9] // in this case, because we only need the length property, we can use destructuring parameter: // notice that the `length` corresponds to the property we want to get whereas the // obviously non-special `lengthfoobarx` is just the name of a variable which can be changed // to any valid variable name you want elements.map(({ length: lengthfoobarx }) => lengthfoobarx); // [
8, 6, 7, 9] // this destructuring parameter assignment can also be written as seen below.
...elements.map(({ length }) => length); // [
8, 6, 7, 9] no separate this before arrow functions, every new function defined its own this value based on how the function was called: a new object in the case of a constructor.
...And 3 more matches
String.prototype.charAt() - JavaScript
var str = 'a \ud
87e\udc04 z'; // we could also use a non-bmp character directly for (var i = 0, chr; i < str.length; i++) { if ((chr = getwholechar(str, i)) === false) { continue; } // adapt this line at the top of each loop, passing in the whole string and // the current iteration and returning a variable to represent the // individual character console.log(chr); } function getwholechar(str, i) ...
...{ var code = str.charcodeat(i); if (number.isnan(code)) { return ''; // position not found } if (code < 0xd
800 || code > 0xdfff) { return str.charat(i); } // high surrogate (could change last hex to 0xdb7f to treat high private // surrogates as single characters) if (0xd
800 <= code && code <= 0xdbff) { if (str.length <= (i + 1)) { throw 'high surrogate without following low surrogate'; } var next = str.charcodeat(i + 1); if (0xdc00 > next || next > 0xdfff) { throw 'high surrogate without following low surrogate'; } return str.charat(i) + str.charat(i + 1); } // low surrogate (0xdc00 <= code && code <= 0xdfff) if (i === 0) { throw 'low surrogate without preceding high surrogate'; } var prev = str.charcodeat(i...
... - 1); // (could change last hex to 0xdb7f to treat high private // surrogates as single characters) if (0xd
800 > prev || prev > 0xdbff) { throw 'low surrogate without preceding high surrogate'; } // we can pass over low surrogates now as the second component // in a pair which we have already processed return false; } in an ecmascript 2016 environment which allows destructured assignment, the following is a more succinct and somewhat more flexible alternative in that it does increment for an incrementing variable automatically (if the character warrants it in being a surrogate pair).
...And 3 more matches
Digital audio concepts - Web media technologies
some older audio file formats—which you won't find in use on the web—used
8-bit integer samples.
...at the common sample rate of 4
8 khz (4
8,000 samples per second), this means each second of audio occupies 192 kb of memory.
... the most common sample rates are:
8000 hz the international g.711 standard for audio used in telephony uses a sample rate of
8000 hz (
8 khz).
...And 3 more matches
Index - XSLT: Extensible Stylesheet Language Transformations
8 interface list needscontent, reference see xsltprocessor in the web api documentation section.
... 15 for further reading needscontent, needshelp, transforming_xml_with_xslt, xml, xslt http://www.amazon.com/xslt-programme.../dp/0764543
814 16 resources extensions, needscontent, needsexample, needslivesample, xml, xsl no summary!
... 1
8 using the mozilla javascript interface to xsl transformations xslt this document describes the javascript interface in mozilla 1.2 and up to the xslt processing engine (transformiix).
...And 3 more matches
Release notes - Archive of obsolete content
removed tab-browser, app-strings and api-utils.publicconstructor details github commits made between firefox 2
8 and firefox 29.
... bugs fixed between firefox 2
8 and firefox 29.
... firefox 2
8 highlights added wildcard event type "*".
...And 2 more matches
File I/O - Archive of obsolete content
createinstance(components.interfaces.nsiscriptableunicodeconverter); converter.charset = "utf-
8"; var istream = converter.converttoinputstream(data); // the last argument (the callback) is optional.
... createinstance(components.interfaces.nsiconverterinputstream); fstream.init(file, -1, 0, 0); cstream.init(fstream, "utf-
8", 0, 0); // you can use another encoding here if you wish let (str = {}) { let read = 0; do { read = cstream.readstring(0xffffffff, str); // read as much as we can and put it in str.value data += str.value; } while (read != 0); } cstream.close(); // this closes fstream alert(data); reading line by line note: the sample code below does not handle text with non-ascii characters.
...fostream.init(file, 0x02 | 0x0
8 | 0x20, 0666, 0); // write, create, truncate // in a c file operation, we have no need to set file mode with or operation, // directly using "r" or "w" usually.
...And 2 more matches
Migrating from Internal Linkage to Frozen Linkage - Archive of obsolete content
ndstring = someotherstring; - nsstring combostring = firststring + secondstring; + nsstring combostring = firststring;+ combostring += secondstring; // or: combostring.append(secondstring); - nsresult rv = somefunc(promiseflatstring(combostring)); + nsresult rv = somefunc(combostring); removing the nsreadableutils.h from the headers list also means that we would not have access to appendutf16toutf
8 kind of functions.
... all these functions are now available via the new string api - appendutf16toutf
8(srcstring, deststring); + deststring.append(ns_convertutf16toutf
8(srcstring)); the signatures of the find methods differ between the two apis.
...the (lossy)copy(ascii|utf
8|16)to(ascii|utf
8|16) do not accept character pointer parameters.
...And 2 more matches
Autodial for Windows NT - Archive of obsolete content
a brief history of autodial on windows in the consumer versions of windows, (windows 95, windows 9
8, windows me) autodial for all applications is controlled from the control panel, in the internet options applet, under the tab connections.
...so, as more people move to windows xp from windows 9
8, the autodial suddenly stops working for them.
... in fact, it's not mozilla that is broken, it's that microsoft has changed the way things work from windows 9
8 to windows xp.
...And 2 more matches
Modularization techniques - Archive of obsolete content
the ids are unique 12
8 bit numbers that are based on uuids.
... for those who like gory details, their structure is this: struct nsid { pruint32 m0; pruint16 m1, m2; pruint
8 m3[
8]; }; frequently you see them represented as strings, like this: {221ffe10-ae3c-11d1-b66c-00
805f
8a2676} to initialize an id struct you declare them like this: id = {0x221ffe10, 0xae3c, 0x11d1, {0xb6, 0x6c, 0x00, 0x
80, 0x5f, 0x
8a, 0x26, 0x76}}; why the b66c couplet gets broken up and grouped with the last set of bytes is probably a footnote somewhere.
... #include "nsisupports.h" // {57ecad90-ae1a-11d1-b66c-00
805f
8a2676} #define ns_isample_iid \ {0x57ecad90, 0xae1a, 0x11d1, \ {0xb6, 0x6c, 0x00, 0x
80, 0x5f, 0x
8a, 0x26, 0x76}} /* * nsisample interface declaration */ class nsisample: public nsisupports { public: ns_imethod hello() = 0; }; file nssample.h nssample.h defines the class id (cid) for our sample class.
...And 2 more matches
Video presentations - Archive of obsolete content
(as quicktime; 19
8 mb) laying out and drawing documents (slides) this presentation describes how a document is laid out and painted to the display by the gecko engine.
... (as quicktime; 2
82 mb) community these presentations provide insight into the mozilla community and how the project works.
...(as quicktime; 170 mb and
80 mb) mozilla-seneca projects q&a with mike shaver (part 1, part 2) mike shaver answers questions about the mozilla project.
...And 2 more matches
Learn XPI Installer Scripting by Example - Archive of obsolete content
ne discussed here, take the following basic form (in pseudo-code and with links to the sections in which these installation steps are documented): initinstall(); if (verify_space()) { err = add_dirs_and_files; register_files; if (err==success) { performinstall() }; else { cancelinstall() }; } as you can see in the code listing, the verification process at the top is on lines 1 to 1
8; the file addition process, here part of the main installation block, is on lines 24 to 41; the registration part of the main installation block is on lines 42-5
8; and the execution at the end of the main block is on lines 59 to 71.
...in the browser.xpi installation, this function appears at line 20: var err = initinstall("netscape seamonkey", "browser", "6.0.0.2000110
807"); if you call a method on the install object before initinstall(), you will get an error.
...in the example above, "netscape seamonkey" is the display name, "browser" is the registry name, and the version is "6.0.0.2000110
807." see initinstall in the xpinstall api reference for more information on the initialization process.
...And 2 more matches
Custom Tree Views - Archive of obsolete content
note: the tree-related interfaces changed in gecko 1.
8.
...in the older versions of mozilla (before firefox 1.5 or mozilla 1.
8), the columns are supplied as the values of the id attribute on the columns.
... here is an example of defining such as object, which can be called whatever you want: //moz 1.
8 var treeview = { rowcount : 10000, getcelltext : function(row,column){ if (column.id == "namecol") return "row "+row; else return "february 1
8"; }, settree: function(treebox){ this.treebox = treebox; }, iscontainer: function(row){ return false; }, isseparator: function(row){ return false; }, issorted: function(){ return false; }, getlevel: function(row){ return 0; }, getimagesrc: function(row,col){ return null; }, getrowproperties: function(row,props){}, getcellproper...
...And 2 more matches
Deploying XULRunner - Archive of obsolete content
you should copy this file from /library/frameworks/xul.framework/versions/1.
8/xulrunner.) libmozglue.dylib (the main xul library) ...
... xulrunner 3
8 and earlier in xulrunner 3
8 and earlier, xulrunner is provided in a mac os x framework bundle, which is placed in your application bundle's frameworks directory.
... the complete bundle structure is as follows: myapp.app/ contents/ info.plist pkginfo frameworks/ xul.framework/ files copied from /library/frameworks/xul.framework/versions/1.
8/...
...And 2 more matches
nsIContentPolicy - Archive of obsolete content
type_refresh
8 indicates a timed refresh.
... type_xslt 1
8 indicates a style sheet transformation.
... type_internal_frame 2
8 an internal constant used to represent content loaded from <frame> elements.
...And 2 more matches
Adobe Flash - Archive of obsolete content
example 2: javascript to flash communication note: javascript to flash communication may not work with flash player versions older than version
8 if the user has installed multiple mozilla based browsers onto the same machine (see bug 2
84057 and bug 233533).
... fscommands: accessing javascript from flash note: fscommand may not work with flash player versions older than version
8 if the user has installed multiple mozilla based browsers onto the same machine (see bug 3204
8 and bug 233533).
...this issue is being tracked in mozilla's bug 1
84722.
...And 2 more matches
Common Firefox theme issues and solutions - Archive of obsolete content
please see the following threads on mozillazine for solutions to this issue: http://forums.mozillazine.org/viewtopic.php?f=1
8&t=2131121 http://forums.mozillazine.org/viewtopic.php?f=1
8&t=1953371&start=60 windows 7 aero not going into full screen mode properly on win7 with aero glass support firefox doesn't always go to full screen mode from a normal window properly.
... mac os x os x lion missing toolbar button icons due to firefox bug 67970
8 and bug 70255
8, some toolbar buttons icons may be missing on firefox
8 and later running on mac os x lion.
...in/identity-icons-https-ev.png); } #identity-box:hover > #identity-box-inner > #page-proxy-stack > #page-proxy-favicon { -moz-image-region: rect(0, 32px, 16px, 16px); } #identity-box:hover:active > #identity-box-inner > #page-proxy-stack > #page-proxy-favicon, #identity-box[open=true] > #identity-box-inner > #page-proxy-stack > #page-proxy-favicon { -moz-image-region: rect(0, 4
8px, 16px, 32px); } #page-proxy-favicon[pageproxystate="invalid"] { opacity: 0.5; } for more information about identity boxes please see the identity box section of the amo editors theme review guidelines no visual clue for disabled url bars there needs to be a visual clue when url bar is disabled.
...And 2 more matches
Plug-in Development Overview - Gecko Plugin API Reference
for more information about mime types, see these mime rfcs: rfc-2045: "multipurpose internet mail extensions (mime) part one: format of internet message bodies" rfc-2046: "multipurpose internet mail extensions (mime) part two: media types" rfc-42
88: "media type specifications and registration procedures" there are some variations to how plug-ins are handled on different platforms.
...'str#' 12
8 should contain a list of mime types and file extensions in alternating strings.
... for example: str 12
8 mime type string 1 video/quicktime string 2 mov, moov string 3 audio/aiff string 4 aiff string 5 image/jpeg string 6 jpg several other optional strings may contain useful information about the plug-in.
...And 2 more matches
Organizing your CSS - Learn web development
some developers put all of the rules onto a single line, like so: .box { background-color: #567
895; } h2 { background-color: black; color: white; } other developers prefer to break everything onto a new line: .box { background-color: #567
895; } h2 { background-color: black; color: white; } css doesn't mind which one you use.
... .comment { display: grid; grid-template-columns: 1fr 3fr; } .comment img { border: 1px solid grey; } .comment .content { font-size: .
8rem; } .list-item { display: grid; grid-template-columns: 1fr 3fr; border-bottom: 1px solid grey; } .list-item .content { font-size: .
8rem; } in oocss, you would create one pattern called media that would have all of the common css for both patterns — a base class for things that are generally the shape of the media object.
... .media { display: grid; grid-template-columns: 1fr 3fr; } .media .content { font-size: .
8rem; } .comment img { border: 1px solid grey; } .list-item { border-bottom: 1px solid grey; } in your html the comment would need both the media and comment classes applied: <div class="media comment"> <img /> <div class="content"></div> </div> the list-item would have media and list-item applied: <ul> <li class="media list-item"> <img /> <div class="content"></div> </li> </ul> the work that nicole sullivan did in describing this approach and promoting it means that even people who are not strictly following an oocss approach today will generally be r...
...And 2 more matches
How CSS is structured - Learn web development
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 fi...
... the html for an internal stylesheet might look like this: <!doctype html> <html> <head> <meta charset="utf-
8"> <title>my css experiment</title> <style> h1 { color: blue; background-color: yellow; border: 1px solid black; } p { color: red; } </style> </head> <body> <h1>hello world!</h1> <p>this is my first css example</p> </body> </html> in some circumstances, internal stylesheets can be useful.
...the implementation of an inline style in an html document might look like this: <!doctype html> <html> <head> <meta charset="utf-
8"> <title>my css experiment</title> </head> <body> <h1 style="color: blue;background-color: yellow;border: 1px solid black;">hello world!</h1> <p style="color:red;">this is my first css example</p> </body> </html> avoid using css in this way when possible.
...And 2 more matches
Client-side form validation - Learn web development
"your password needs to be between
8 and 30 characters long and contain one uppercase letter, one symbol, and a number." (a very specific data format is required for your data).
...again, feel free to build this along with us: <form novalidate> <p> <label for="mail"> <span>please enter an email address:</span> <input type="email" id="mail" name="mail" required minlength="
8"> <span class="error" aria-live="polite"></span> </label> </p> <button>submit</button> </form> this simple form uses the novalidate attribute to turn off the browser's automatic validation; this lets our script take control over validation.
... our input to validate is an <input type="email">, which is required, and has a minlength of
8 characters.
...And 2 more matches
HTML text fundamentals - Learn web development
my legs are made of cardboard and i am married to a fish.</textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 9
8%; } body { margin: 10px; background: #f5f9fa; } var textarea = document.getelementbyid('code'); var reset = document.getelementbyid('reset'); var solution = document.getelementbyid('solution'); var output = document.queryselector('.output'); var code = textarea.value; var userentry = textarea.value; function updatecode() { output.innerhtml = textarea.value; } reset.addeventlistener('cli...
... <textarea id="code" class="input" style="min-height: 100px; width: 95%">milk eggs bread hummus</textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 9
8%; } body { margin: 10px; background: #f5f9fa; } var textarea = document.getelementbyid('code'); var reset = document.getelementbyid('reset'); var solution = document.getelementbyid('solution'); var output = document.queryselector('.output'); var code = textarea.value; var userentry = textarea.value; function updatecode() { output.innerhtml = textarea.value; } reset.addeventlistener('cli...
...oundabouts turn left at the third roundabout the school is on your right, 300 meters up the road</textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 9
8%; } body { margin: 10px; background: #f5f9fa; } var textarea = document.getelementbyid('code'); var reset = document.getelementbyid('reset'); var solution = document.getelementbyid('solution'); var output = document.queryselector('.output'); var code = textarea.value; var userentry = textarea.value; function updatecode() { output.innerhtml = textarea.value; } reset.addeventlistener('cli...
...And 2 more matches
TypeScript support in Svelte - Learn web development
==================================== ./svelte-todo-typescript/src/components/alert.svelte:
8:7 warn: variable 'visible' implicitly has an 'any' type, but a better type may be inferred from usage.
...(ts) let timeout ./svelte-todo-typescript/src/components/alert.svelte:11:2
8 warn: parameter 'message' implicitly has an 'any' type, but a better type may be inferred from usage.
...(ts) const focusoninit = (node) => node && typeof node.focus === 'function' && node.focus() ./07-next-steps/src/components/todo.svelte:47:2
8 warn: parameter 'node' implicitly has an 'any' type, but a better type may be inferred from usage.
...And 2 more matches
Deployment and next steps - Learn web development
code along with us git clone the github repo (if you haven't already done it) with: git clone https://github.com/opensas/mdn-svelte-tutorial.git then to get to the current app state, run cd mdn-svelte-tutorial/0
8-next-steps or directly download the folder's content: npx degit opensas/mdn-svelte-tutorial/0
8-next-steps remember to run npm install && npm run dev to start your app in development mode.
... your generated bundle.js and bundle.css files will be something like this (file size on the left): 504 jul 13 02:43 bundle.css 959
81 jul 13 02:43 bundle.js to compile our application for production we have to run npm run build instead.
... so, after running npm run build, our generated bundle.js and bundle.css files will be more like this: 504 jul 13 02:43 bundle.css 217
82 jul 13 02:43 bundle.js try running npm run build in your app's root directory now.
...And 2 more matches
Working with Svelte stores - Learn web development
repl to code along with us using the repl, start at https://svelte.dev/repl/d1fa
84a5a4494366b179c
87395940039?version=3.23.2 dealing with our app state we have already seen how our components can communicate with each other using props, two-way data binding, and events.
... value) ondestroy(unsubscribe) </script> {#if alertcontent} <div on:click={() => alertcontent = ''}> <p>{ alertcontent }</p> </div> {/if} <style> div { position: fixed; cursor: pointer; margin-right: 1.5rem; margin-left: 1.5rem; margin-top: 1rem; right: 0; display: flex; align-items: center; border-radius: 0.2rem; background-color: #565656; color: #fff; font-size: 0.
875rem; font-weight: 700; padding: 0.5rem 1.4rem; font-size: 1.5rem; z-index: 100; opacity: 95%; } div p { color: #fff; } div svg { height: 1.6rem; fill: currentcolor; width: 1.4rem; margin-right: 0.5rem; } </style> let's walk through this piece of code in detail.
...nmessagechange ondestroy(()=> cleartimeout(timeout)) // make sure we clean-up the timeout </script> and update the alert.svelte markup section like so: {#if visible} <div on:click={() => visible = false}> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 20 20"><path d="m12.432 0c1.34 0 2.01.912 2.01 1.957 0 1.305-1.164 2.512-2.679 2.512-1.269 0-2.009-.75-1.974-1.99c9.7
89 1.436 10.67 0 12.432 0zm
8.309 20c-1.05
8 0-1.
833-.652-1.093-3.524l1.214-5.092c.211-.
814.246-1.141 0-1.141-.317 0-1.6
89.562-2.502 1.117l-.52
8-.
88c2.572-2.1
86 5.531-3.467 6.
801-3.467 1.057 0 1.233 1.273.705 3.23l-1.391 5.352c-.246.945-.141 1.271.106 1.271.317 0 1.357-.392 2.379-1.207l.6.
814c12.09
8 19.02 9.365 20
8.309 20z"/></svg> <p>{ $alert }</p> </div> {/if} here we first create the prop m...
...And 2 more matches
Creating MozSearch plugins
the following xml is the bundled firefox 2 search plugin for searching using yahoo!: <searchplugin xmlns="http://www.mozilla.org/2006/browser/search/"> <shortname>yahoo</shortname> <description>yahoo search</description> <inputencoding>utf-
8</inputencoding> <image width="16" height="16">data:image/x-icon;base64,r0lgodlheaaqajecap
8aaaaaap///waaach5baeaaaialaaaaaaqabaaaaipli+py+0nogquybdened2khkffwuamezmpzsfmaihphrrguum/ft+uwaaow==</image> <url type="application/x-suggestions+json" method="get" template="http://ff.search.yahoo.com/gossip?output=fxjson&command={searchterms}" /> <url type="text/html" method="get" template="http:...
...//search.yahoo.com/search"> <param name="p" value="{searchterms}"/> <param name="ei" value="utf-
8"/> <mozparam name="fr" condition="pref" pref="yahoo-fr" /> </url> <searchform>http://search.yahoo.com/</searchform> </searchplugin> let's say the user chooses to use the yahoo!
...firefox will use the above search engine description to construct the following search url: http://search.yahoo.com/search?p=mozilla&ei=utf-
8&fr=moz2 if the user clicks the magnifying glass icon in the search bar, or chooses the web search option in the tools menu when the search bar isn't visible, the browser will take them to http://search.yahoo.com/, the value of the <searchform> element.
...And 2 more matches
Old Thunderbird build
8 gb or more is recommended.
...for example, a mac user may get an object directory name of obj-x
86_64-apple-darwin10.7.3/.
... on windows: check that the mapi header files from https://www.microsoft.com/en-us/download/details.aspx?id=12905 are installed because the mapi header files are not bundled with visual studio 2013/2015 (windows sdk
8.1/10).
...And 2 more matches
Eclipse CDT
(having to move the mouse slightly is eclipse bug 26
873).
... headers are only parsed once for performance reasons, eclipse only processes header files that have include guards once, using the compiler options for the first source file it encounters that includes that header (eclipse bug 3
80511).
... fixing eclipse bug 3
81601 would considerably reduce the impact of the "unresolved inclusion" issue.
...And 2 more matches
Encodings for localization files
in general, files in the mozilla repositories are utf-
8 encoded.
... installer the windows installer can’t handle utf-
8, but only the codepages provided by windows.
...for most western scripts, ‘ms sans serif’ and ‘
8’ are good defaults for the font settings.
...And 2 more matches
Creating localizable web applications
good: body.de foo, body.fr foo, body.pl foo { /* locale-specific rules for the foo element */ width: 10em; /* originally
8em */ } adapt the interaction to rtl locales right-to-left locales not only require good images handling (see images), but also should be taken into account when designing the interaction on the website.
...bad: <p class="description"><?= _("<strong>description:</strong>");?></p> snippet
8.
...ance-chart.png): html: (in this case, no gettext was used and the localizers worked on pure html files) <div id="performance-chart"> <h4>firefox performance: fast — faster — <em>fastest</em></h4> <p>results of a sunspider test on a windows xp machine</p> <img src="/img/tignish/firefox/performance-chart.png" alt="firefox 2, firefox 3, firefox 3.5 performance chart" /> <ul> <li>1
8,14
8 ms</li> <li>3,669 ms</li> <li>1,524 ms!</li> </ul> </div> in the above example, not only does the text above the clock charts require translation, but so do the milliseconds captions below them.
...And 2 more matches
What every Mozilla translator should know
files for [ab-cd] locale corresponding firefox version branches in hg mozilla-central l10n-central firefox.next (trunk) mozilla-1.9.2 l10n-mozilla-1.9.2 firefox 3.6 mozilla-1.9.1 l10n-mozilla-1.9.1 firefox 3.5 and, on the former revision control system, cvs: cvs trunk (the default branch) -> firefox/thunderbird 3.0.x branch mozilla_1_
8_branch -> firefox/thunderbird 2.0 branch mozilla cross-reference mozilla cross-reference is a web site mirroring the content of the hg server.
... do the changes in your local disk create a diff file with the changes $ hg diff -p -u
8 filename create a new bug: product: mozilla localization component: your language ...
...asking for approval (use the appropriate branch) if you get the approval you will see who_is_ap:approval1.
8.xxx+ now, you can upload the changes approved to the cvs server.
...And 2 more matches
Using the viewport meta tag to control layout on mobile browsers
for example, if a mobile screen has a width of 640px, pages might be rendered with a virtual viewport of 9
80px, and then it will be shrunk down to fit into the 640px space.
... enter viewport meta tag however, this mechanism is not so good for pages that are optimized for narrow screens using media queries — if the virtual viewport is 9
80px for example, media queries that kick in at 640px or 4
80px or less will never be used, limiting the effectiveness of such responsive design techniques.
...for example, recent smartphones generally have a 5-inch screens with resolutions upwards of 1920—10
80 pixels (~400 dpi).
...And 2 more matches
NSS 3.20 release notes
nss 3.20 requires nspr 4.10.
8 or newer.
... support for the following ciphersuites has been added: tls_dhe_dss_with_aes_12
8_gcm_sha256 tls_dhe_dss_with_aes_12
8_cbc_sha256 tls_dhe_dss_with_aes_256_cbc_sha256 by default, the server side tls implementation will use dhe parameters with a size of 204
8 bits when using dhe ciphersuites.
... nss embeds fixed dhe parameters sized 204
8, 3072, 4096, 6144 and
8192 bits, which were copied from version 0
8 of the internet-draft "negotiated finite field diffie-hellman ephemeral parameters for tls", appendix a.
...And 2 more matches
NSS 3.29.1 release notes
bugs fixed in nss 3.29.1 nss version 3.2
8, 3.2
8.1, 3.2
8.2 and 3.29 contained changes that were in violation with the nss compatibility promise.
...the change has been reverted to the original state in bug 133410
8.
... note that nss 3.2
8.3 from the older nss 3.2
8.x branch has also been released with the identical fixes.
...And 2 more matches
NSS 3.32 release notes
cn = addtrust class 1 ca root sha-256 fingerprint:
8c:72:09:27:9a:c0:4e:27:5e:16:d0:7f:d3:b7:75:e
8:01:54:b5:96:
80:46:e3:1f:52:dd:25:76:63:24:e9:a7 cn = swisscom root ca 2 sha-256 fingerprint: f0:9b:12:2c:71:14:f4:a0:9b:d4:ea:4f:4a:99:d5:5
8:b4:6e:4c:25:cd:
81:14:0d:29:c0:56:13:91:4c:3
8:41 the following ca certificates were removed: cn = addtrust public ca root sha-256 fingerprint: 07:91:ca:07:49:b2...
...:07:
82:aa:d3:c7:d7:bd:0c:df:c9:4
8:5
8:35:
84:3e:b2:d7:99:60:09:ce:43:ab:6c:69:27 cn = addtrust qualified ca root sha-256 fingerprint:
80:95:21:0
8:05:db:4b:bc:35:5e:44:2
8:d
8:fd:6e:c2:cd:e3:ab:5f:b9:7a:99:42:9
8:
8e:b
8:f4:dc:d0:60:16 cn = china internet network information center ev certificates root sha-256 fingerprint: 1c:01:c6:f4:db:b2:fe:fc:22:55:
8b:2b:ca:32:56:3f:49:
84:4a:cf:c3:2b:7b:e4:b0:ff:59:9f:9e:
8c:7a:f7 cn = cnnic root sha-256 fingerprint: e2:
83:93:77:3d:a
8:45:a6:79:f2:0
8:0c:c7:fb:44:a3:b7:a1:c3:79:2c:b7:eb:77:29:fd:cb:6a:
8d:99:ae:a7 cn = comsign secured ca sha-256 fingerprint: 50:79:41:c7:44:60:a0:b4:70:
86:22:0d:4e:99:32:57:2a:b5:d1:b5:bb:cb:
89:
80:ab:1c:b1:76:51:a
8:44:d2 cn = geotrust ...
...global ca 2 sha-256 fingerprint: ca:2d:
82:a0:
86:77:07:2f:
8a:b6:76:4f:f0:35:67:6c:fe:3e:5e:32:5e:01:21:72:df:3f:92:09:6d:b7:9b:
85 cn = secure certificate services sha-256 fingerprint: bd:
81:ce:3b:4f:65:91:d1:1a:67:b5:fc:7a:47:fd:ef:25:52:1b:f9:aa:4e:1
8:b9:e3:df:2e:34:a7:
80:3b:e
8 cn = swisscom root ca 1 sha-256 fingerprint: 21:db:20:12:36:60:bb:2e:d4:1
8:20:5d:a1:1e:e7:a
8:5a:65:e2:bc:6e:55:b5:af:7e:7
8:99:c
8:a2:66:d9:2e cn = swisscom root ev ca 2 sha-256 fingerprint: d9:5f:ea:3c:a4:ee:dc:e7:4c:d7:6e:75:fc:6d:1f:f6:2c:44:1f:0f:a
8:bc:77:f0:34:b1:9e:5d:b2:5
8:01:5d cn = trusted certificate services sha-256 fingerprint: 3f:06:e5:56:
81:d4:96:f5:be:16:9e:b5:3
8:9f:9f:2b:
8f:f6:1e:17:0
8:df:6
8:
81:72:4
8:49:cd:...
...And 2 more matches
nss tech note2
to enable this mode, set: nspr_log_modules=nss_mod_log:1 nspr_log_file=<logfile> the output format is: osthreadid[nsprthreadid]: c_xxx osthreadid[nsprthreadid]: rv = 0xyyyyyyyy for example, 1024[
805ef10]: c_initialize 1024[
805ef10]: rv = 0x0 1024[
805ef10]: c_getinfo 1024[
805ef10]: rv = 0x0 1024[
805ef10]: c_getslotlist 1024[
805ef10]: rv = 0x0 2.
...osthreadid[nsprthreadid]: argn = 0xaaaaaaaa osthreadid[nsprthreadid]: rv = 0xyyyyyyyy for example, 1024[
805ef10]: c_initialize 1024[
805ef10]: pinitargs = 0x4010c93
8 1024[
805ef10]: rv = 0x0 1024[
805ef10]: c_getinfo 1024[
805ef10]: pinfo = 0xbffff340 1024[
805ef10]: rv = 0x0 1024[
805ef10]: c_getslotlist 1024[
805ef10]: tokenpresent = 0x0 1024[
805ef10]: pslotlist = 0x0 1024[
805ef10]: pulcount = 0xbffff33c 1024[
805ef10]: *pulcount = 0x2 1024[
805ef10]: rv = 0x0 note that when a pkcs #11 function takes a pointer argumen...
...for example, 1024[
805ef10]: c_findobjectsinit 1024[
805ef10]: hsession = 0x1000001 1024[
805ef10]: ptemplate = 0xbffff410 1024[
805ef10]: ulcount = 3 1024[
805ef10]: cka_label = localhost.nyc.rr.com [20] 1024[
805ef10]: cka_token = ck_true [1] 1024[
805ef10]: cka_class = cko_certificate [4] 1024[
805ef10]: rv = 0x0 1024[
805ef10]: c_findobjects 1024[
805ef10]: hsession = 0x1000001 1024[
805ef10]: phobject = 0x
806d
810 1024[
805ef10]: ulmaxobjectcount = 16...
...And 2 more matches
nss tech note3
there are
8 key usages: cert_sign crl_sign data_encipherment digital_signature govt_approved key_agreement key_encipherment non_repudiation there are 9 cert types: email email_ca object_signing object_signing_ca ssl_ca ssl_client ssl_server status_responder time_stamp for the cert being checked, the requirements are: cert usage requried key usage required cert type ----------------...
...the oid for this extension is { 2 16
840 1 113730 1 1 } encoded in hex as 0x60, 0x
86, 0x4
8, 0x01, 0x
86, 0xf
8, 0x42, 0x01, 0x01 in addition to netscape's own cert type extension, nss recognizes various x.509 extensions.
... if present, this extension directly determines the values of the
8 key usages defined above.
...And 2 more matches
NSS Tools pk12util
-p prefix specify the prefix used on the cert
8.db and key3.db files (for example, my_cert
8.db and my_key3.db).
... symmetric cbc ciphers for pkcs #5 v2: "des_cbc" "rc2-cbc" "rc5-cbcpad" "des-ede3-cbc" --- default for key encryption "aes-12
8-cbc" "aes-192-cbc" "aes-256-cbc" "camellia-12
8-cbc" "camellia-192-cbc" "camellia-256-cbc" pkcs #12 pbe ciphers: "pkcs #12 pbe with sha1 and 12
8 bit rc4" "pkcs #12 pbe with sha1 and 40 bit rc4" "pkcs #12 pbe with sha1 and triple des cbc" "pkcs #12 pbe with sha1 and 12
8 bit rc2 cbc" "pkcs #12 pbe with sha1 and 40 bit rc2 cbc" "pkcs12 v2 pbe with sha1 and 12
8 bit rc4" "pkcs12 v2 pbe with sha1 a...
...nd 40 bit rc4" --- default for pfx encryption in non-fips mode, no encryption on fips mode "pkcs12 v2 pbe with sha1 and 3key triple des-cbc" "pkcs12 v2 pbe with sha1 and 2key triple des-cbc" "pkcs12 v2 pbe with sha1 and 12
8 bit rc2 cbc" "pkcs12 v2 pbe with sha1 and 40 bit rc2 cbc" pkcs #5 pbe ciphers: "pkcs #5 password based encryption with md2 and des cbc" "pkcs #5 password based encryption with md5 and des cbc" "pkcs #5 password based encryption with sha1 and des cbc" it should be noted that the the crypto provider may be the softtoken module or an external hardware module.
...And 2 more matches
NSS tools : crlutil
-p dbprefix specify the prefix used on the nss security database files (for example, my_cert
8.db and my_key3.db).
...list of possible algorithms: md2 | md4 | md5 | sha1 | sha256 | sha3
84 | sha512 -n nickname specify the nickname of a certificate or key to list, create, add to a database, modify, or validate.
...for more information see rfc #32
80 * add the authority key identifier extension: the authority key identifier extension provides a means of identifying the public key corresponding to the private key used to sign a crl.
...And 2 more matches
SpiderMonkey Internals
other values are encoded as a value and a type tag: on x
86, arm, and similar 32-bit platforms, we use what we call "nunboxing", in which non-double values are a 32-bit type tag and a 32-bit payload, which is normally either a pointer or a signed 32-bit integer.
...a second tier jit, code-named ionmonkey was enabled in firefox 1
8.
...line2pc(perfect, ln); var ln2 = pc2line(perfect, pc); print("\tline " + ln + " => pc " + pc + " => line " + ln2); } the result of the for loop over lines 0 to 40 inclusive is: line 0 => pc 0 => line 16 line 1 => pc 0 => line 16 line 2 => pc 0 => line 16 line 3 => pc 0 => line 16 line 4 => pc 0 => line 16 line 5 => pc 0 => line 16 line 6 => pc 0 => line 16 line 7 => pc 0 => line 16 line
8 => pc 0 => line 16 line 9 => pc 0 => line 16 line 10 => pc 0 => line 16 line 11 => pc 0 => line 16 line 12 => pc 0 => line 16 line 13 => pc 0 => line 16 line 14 => pc 0 => line 16 line 15 => pc 0 => line 16 line 16 => pc 0 => line 16 line 17 => pc 19 => line 20 line 1
8 => pc 19 => line 20 line 19 => pc 19 => line 20 line 20 => pc 19 => line 20 line 21 => pc 36 => line 21 line 22 => pc 53 => line ...
...And 2 more matches
JSExtendedClass
obsolete since javascript 1.
8.5this feature is obsolete.
... syntax struct jsextendedclass { jsclass base; jsequalityop equality; jsobjectop outerobject; jsobjectop innerobject; jsiteratorop iteratorobject;// added in spidermonkey 1.
8 jsobjectop wrappedobject; // added in spidermonkey 1.
8 ...and additional reserved fields.
... iteratorobject jsiteratorop added in spidermonkey 1.
8 optional.
...And 2 more matches
JSProtoKey
rror typeerror mxr search for jsproto_typeerror jsproto_urierror urierror mxr search for jsproto_urierror jsproto_iterator iterator mxr search for jsproto_iterator jsproto_stopiteration stopiteration mxr search for jsproto_stopiteration jsproto_arraybuffer arraybuffer mxr search for jsproto_arraybuffer jsproto_int
8array int
8array mxr search for jsproto_int
8array jsproto_uint
8array uint
8array mxr search for jsproto_uint
8array jsproto_int16array int16array mxr search for jsproto_int16array jsproto_uint16array uint16array mxr search for jsproto_uint16array jsproto_int32array int32array mxr search for jsproto_int32array jsproto...
..._uint32array uint32array mxr search for jsproto_uint32array jsproto_float32array float32array mxr search for jsproto_float32array jsproto_float64array float64array mxr search for jsproto_float64array jsproto_uint
8clampedarray uint
8clampedarray mxr search for jsproto_uint
8clampedarray jsproto_proxy proxy mxr search for jsproto_proxy jsproto_weakmap weakmap mxr search for jsproto_weakmap jsproto_map map mxr search for jsproto_map jsproto_set set mxr search for jsproto_set jsproto_dataview dataview mxr search for jsproto_dataview jsproto_symbol symbol added in spidermonkey 3
8 mxr search for jsproto_symbol jsproto_sharedarraybu...
...ntl mxr search for jsproto_intl jsproto_typedobject typedobject (nightly only) mxr search for jsproto_typedobject jsproto_generatorfunction generatorfunction added in spidermonkey 31 mxr search for jsproto_generatorfunction jsproto_simd simd (nightly only) mxr search for jsproto_simd jsproto_weakset weakset added in spidermonkey 3
8 mxr search for jsproto_weakset jsproto_sharedint
8array sharedint
8array (nightly only) mxr search for jsproto_sharedint
8array jsproto_shareduint
8array shareduint
8array (nightly only) mxr search for jsproto_shareduint
8array jsproto_sharedint16array sharedint16array (nightly only) mxr search for jsproto_sharedint16array jsproto_sharedu...
...And 2 more matches
JS_FS
// added in spidermonkey 3
8 #define js_fninfo(name,call,info,nargs,flags) ...
...// added in spidermonkey 3
8 #define js_sym_fnspec(symbol, call, info, nargs, flags, selfhostedname) ...
... // added in spidermonkey 3
8 #define js_fnspec(name,call,info,nargs,flags,selfhostedname) ...
...And 2 more matches
JS_SetGCZeal
this article covers features introduced in spidermonkey 1.
8 enable gc zeal, a testing and debugging feature that helps find gc-related bugs in jsapi applications.
... syntax void js_setgczeal(jscontext *cx, uint
8_t zeal, uint32_t frequency); name type description cx jscontext * a context.
... zeal uint
8_t the desired level of garbage collection.
...And 2 more matches
Animated PNG graphics
it is intended to be a replacement for simple animated images that have traditionally used the gif format, while adding support for 24-bit images and
8-bit transparency.
... for purposes of chunk descriptions, an unsigned int shall be a 32-bit unsigned integer in network byte order limited to the range 0 to (2^32)-1; an unsigned short shall be a 16-bit unsigned integer in network byte order with the range 0 to (2^16)-1; and a byte shall be an
8-bit unsigned integer with the range 0 to (2^
8)-1.
...
8 height unsigned int height of the following frame.
...And 2 more matches
Querying Places
not yet implemented -- see bug 320
831.
...eadonly attribute prtime absolutebegintime attribute prtime endtime attribute unsigned long endtimereference readonly attribute boolean hasendtime readonly attribute prtime absoluteendtime attribute astring searchterms readonly attribute boolean hassearchterms attribute long minvisits attribute long maxvisits attribute boolean onlybookmarked attribute boolean domainishost attribute autf
8string domain readonly attribute boolean hasdomain attribute boolean uriisprefix attribute nsiuri uri readonly attribute boolean hasuri attribute boolean annotationisnot attribute autf
8string annotation readonly attribute boolean hasannotation readonly attribute unsigned long foldercount basic query configuration options const unsigned short group_by_day = 0 const unsigned short grou...
... unsigned short sort_by_title_ascending = 1 const unsigned short sort_by_title_descending = 2 const unsigned short sort_by_date_ascending = 3 const unsigned short sort_by_date_descending = 4 const unsigned short sort_by_uri_ascending = 5 const unsigned short sort_by_uri_descending = 6 const unsigned short sort_by_visitcount_ascending = 7 const unsigned short sort_by_visitcount_descending =
8 const unsigned short sort_by_keyword_ascending = 9 const unsigned short sort_by_keyword_descending = 10 const unsigned short sort_by_dateadded_ascending = 11 const unsigned short sort_by_dateadded_descending = 12 const unsigned short sort_by_lastmodified_ascending = 13 const unsigned short sort_by_lastmodified_descending = 14 const unsigned short sort_by_annotation_ascending = 15 const un...
...And 2 more matches
Starting WebLock
the xpidl for iweblock appears below: iweblock #include "nsisupports.idl" interface nsisimpleenumerator; [scriptable, uuid(ea54eee4-954
8-4b63-b94d-c519ffc91d09)] interface iweblock : nsisupports { void lock(); void unlock(); // assume strings are utf-
8 void addsite(in string url); void removesite(in string url); attribute nsisimpleenumerator sites; }; the first line includes the file nsisupports.idl, which defines the nsisupports interface from which all xpcom interfaces must derive, and makes it possible for the iw...
... [scriptable, uuid(ea54eee4-954
8-4b63-b94d-c519ffc91d09)] the rest of the line provides a uuid for this interface.
... [scriptable, uuid(d1
899240-f9d2-11d2-bdd6-000064657374)] interface nsisimpleenumerator : nsisupports { /** * called to determine whether or not the enumerator has * any elements that can be returned via getnext().
...And 2 more matches
nsIAnnotationObserver
1.0 66 introduced gecko 1.
8 inherits from: nsisupports last changed in gecko 1.9 (firefox 3) method overview void onitemannotationremoved(in long long aitemid, in autf
8string aname); void onitemannotationset(in long long aitemid, in autf
8string aname); void onpageannotationremoved(in nsiuri auri, in autf
8string aname); void onpageannotationset(in nsiuri apage, in autf
8string aname); methods onitemannotationremoved() this method is called when an annotation is deleted for an item.
...void onitemannotationremoved( in long long aitemid, in autf
8string aname ); parameters aitemid the item whose annotation is to be deleted.
...void onitemannotationset( in long long aitemid, in autf
8string aname ); parameters aitemid the item on which the annotation is to be set.
...And 2 more matches
nsICookieManager2
to create an object implementing this interface: components.utils.import("resource://gre/modules/services.jsm"); var cookieservice = services.cookies; method overview void add(in autf
8string ahost, in autf
8string apath, in acstring aname, in acstring avalue, in boolean aissecure, in boolean aishttponly, in boolean aissession, in print64 aexpiry); boolean cookieexists(in nsicookie2 acookie); unsigned long countcookiesfromhost(in autf
8string ahost); boolean findmatchingcookie(in nsicookie2 acookie, out unsigned long acountfromhost); obsolete since gec...
...ko 1.9 nsisimpleenumerator getcookiesfromhost(in autf
8string ahost); void importcookies(in nsifile acookiefile); methods add() adds a cookie.
... void add( in autf
8string ahost, in autf
8string apath, in acstring aname, in acstring avalue, in boolean aissecure, in boolean aishttponly, in boolean aissession, in print64 aexpiry ); parameters ahost the host or domain for which the cookie is set.
...And 2 more matches
nsIDNSService
method overview nsicancelable asyncresolve(in autf
8string ahostname, in unsigned long aflags, in nsidnslistener alistener, in nsieventtarget alistenertarget); void init(); obsolete since gecko 1.
8 nsidnsrecord resolve(in autf
8string ahostname, in unsigned long aflags); void shutdown(); obsolete since gecko 1.
8 attributes attribute type description myhostname autf
8string read only.
...nsicancelable asyncresolve( in autf
8string ahostname, in unsigned long aflags, in nsidnslistener alistener, in nsieventtarget alistenertarget ); parameters ahostname the host name or ip-address-literal to resolve.
... init() obsolete since gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) called to initialize the dns service.
...And 2 more matches
nsIFaviconService
1.0 66 introduced gecko 1.
8 inherits from: nsisupports last changed in gecko 22.0 (firefox 22.0 / thunderbird 22.0 / seamonkey 2.19) implemented by: @mozilla.org/browser/favicon-service;1.
... to use this service, use: var faviconservice = components.classes["@mozilla.org/browser/favicon-service;1"] .getservice(components.interfaces.nsifaviconservice); method overview void addfailedfavicon(in nsiuri afaviconuri); void expireallfavicons(); void getfavicondata(in nsiuri afaviconuri, out autf
8string amimetype, [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 getfaviconlinkforicon(in nsiuri afavico...
...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 nsiuri afaviconuri, [const,array,size_is(adatalen)] in octet adata, in unsigned long adatalen, in autf
8string amimetype, in prtime aexpiration); obsolete since gecko 22.0 void setfavicondatafromdataurl(in nsiuri afaviconuri, in astring adataurl, in prtime aexpiration); obsolete since gecko 22.0 void setfaviconurlforpage(in nsiuri apageuri, in nsiuri afaviconuri); obsolete since gecko 22.0 attributes attribute type description defaultfavicon nsiuri...
...And 2 more matches
nsIFileProtocolHandler
inherits from: nsiprotocolhandler last changed in gecko 1.9.2 (firefox 3.6 / thunderbird 3.1 / fennec 1.0) method overview nsifile getfilefromurlspec(in autf
8string url); autf
8string geturlspecfromactualfile(in nsifile file); autf
8string geturlspecfromdir(in nsifile file); autf
8string geturlspecfromfile(in nsifile file); nsiuri newfileuri(in nsifile afile); nsiuri readurlfile(in nsifile file); methods getfilefromurlspec() converts the url string into the corresponding nsifile if possible.
...nsifile getfilefromurlspec( in autf
8string url ); parameters url the url string to convert.
... autf
8string geturlspecfromactualfile( in nsifile file ); parameters file the nsifile to convert.
...And 2 more matches
nsINavBookmarkObserver
1.0 66 introduced gecko 1.
8 inherits from: nsisupports last changed in gecko 21.0 (firefox 21.0 / thunderbird 21.0 / seamonkey 2.1
8) method overview void onbeforeitemremoved(in long long aitemid, in unsigned short aitemtype, in long long aparentid, in acstring aguid, in acstring aparentguid); obsolete since gecko 21.0 void onbeginupdatebatch(); void onendupdatebatch(); void onfolderadded(in print64 folder, in print64 parent, in print32 index); obsolete since gecko 1.9 void onfolderchanged(in print64 folder, in acstring property); obsolete since gecko 1.9 void onfoldermoved(in print64 ...
...folder, in print64 oldparent, in print32 oldindex, in print64 newparent, in print32 newindex); obsolete since gecko 1.9 void onfolderremoved(in print64 folder, in print64 parent, in print32 index); obsolete since gecko 1.9 void onitemadded(in long long aitemid, in long long aparentid, in long aindex, in unsigned short aitemtype, in nsiuri auri, in autf
8string atitle, in prtime adateadded, in acstring aguid, in acstring aparentguid); void onitemchanged(in long long aitemid, in acstring aproperty, in boolean aisannotationproperty, in autf
8string anewvalue, in prtime alastmodified, in unsigned short aitemtype, in long long aparentid, in acstring aguid, in acstring aparentguid); void onitemmoved(in long long aitemid, in long long aoldparentid, in long aoldind...
... nsiuri auri, in long long aparentid, in acstring aguid, in acstring aparentguid); void onseparatoradded(in print64 parent, in print32 index); obsolete since gecko 1.9 void onseparatorremoved(in print64 parent, in print32 index); obsolete since gecko 1.9 methods onbeforeitemremoved() obsolete since gecko 21.0 (firefox 21.0 / thunderbird 21.0 / seamonkey 2.1
8) note: this method was removed in gecko 21.0 as part of bug
826409.
...And 2 more matches
nsINavHistoryService
1.0 66 introduced gecko 1.
8 inherits from: nsisupports last changed in gecko 22 (firefox 22 / thunderbird 22 / seamonkey 2.19) implemented by: "@mozilla.org/browser/nav-history-service;1".
... getnewquery(); nsinavhistoryqueryoptions getnewqueryoptions(); nsinavhistoryresult executequery(in nsinavhistoryquery aquery, in nsinavhistoryqueryoptions options); nsinavhistoryresult executequeries([array,size_is(aquerycount)] in nsinavhistoryquery aqueries, in unsigned long aquerycount, in nsinavhistoryqueryoptions options); void querystringtoqueries(in autf
8string aquerystring, [array, size_is(aresultcount)] out nsinavhistoryquery aqueries, out unsigned long aresultcount, out nsinavhistoryqueryoptions options); autf
8string queriestoquerystring([array, size_is(aquerycount)] in nsinavhistoryquery aqueries, in unsigned long aquerycount, in nsinavhistoryqueryoptions options); void addobserver(in nsinavhistoryobserver observer, in boolea...
... 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
nsINetworkLinkService
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 networklinkservice = components.classes["@mozilla.org/network/network-link-service;1"] .getservice(components.interfaces.nsinetworklinkservice); attributes attribute type description islinkup boolean this is set to true when the system is believed to have a usable network connection.
... note: as of gecko
8.0, all operating systems currently return link_type_unknown.
... as of gecko 2
8.0 android support is available again, see bug 9396
80.
...And 2 more matches
nsIPasswordManager
to create an instance, use: var passwordmanager = components.classes["@mozilla.org/passwordmanager;1"] .getservice(components.interfaces.nsipasswordmanager); method overview void adduser(in autf
8string ahost, in astring auser, in astring apassword); void removeuser(in autf
8string ahost, in astring auser); void addreject(in autf
8string ahost); void removereject(in autf
8string ahost); attributes attribute type description enumerator nsisimpleenumerator readonly: an enumeration of ...
... astring adduser(in autf
8string ahost, in astring auser, in astring apassword); parameters ahost the hostname of the password to store.
... void removeuser(in autf
8string ahost, in astring auser); parameters ahost the hostname of the password to remove.
...And 2 more matches
nsIPrincipal
obsolete since gecko 1.
8 commonname string the common name for the certificate.
...obsolete since gecko 1.
8 csp nsicontentsecuritypolicy a content security policy associated with this principal.
... fingerprint autf
8string the fingerprint id of this principal's certificate.
...And 2 more matches
nsIProtocolHandler
inherits from: nsisupports last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) method overview boolean allowport(in long port, in string scheme); nsichannel newchannel(in nsiuri auri); nsiuri newuri(in autf
8string aspec, in string aorigincharset, in nsiuri abaseuri); attributes attribute type description defaultport long the default port is the port the protocol uses by default.
... uri_is_ui_resource 1<<
8 the uris for this protocol refer to resources that are part of the application's user interface.
... newuri() makes a uri object that is suitable for loading by this protocol, where the uri string is given as an utf-
8 string.
...And 2 more matches
nsISelectionController
void scrollselectionintoview(in short type, in short region, in short flags); void selectall(); void setcaretenabled(in boolean enabled); void setcaretreadonly(in boolean readonly); void setcaretvisibilityduringselection(in boolean visibility); void setcaretwidth(in short pixels); obsolete since gecko 1.
8 void setdisplayselection(in short toggle); void wordextendfordelete(in boolean forward); native code only!
...tants selection constants constant gecko version description 1.7 - 1.9 1.9.1 - 1.9.2 2.0 selection_none 0 selection_normal 1 selection_spellcheck 2 selection_ime_rawinput 4 selection_ime_selectedrawtext
8 selection_ime_convertedtext 16 selection_ime_selectedconvertedtext 32 selection_accessibility 64 for accessibility api usage.
... selection_find 12
8 num_selectiontypes
8 9 selection_anchor_region 0 selection_focus_region 1 selection_whole_selection 2 num_selection_regions 2 3 selection_off 0 selection_hidden 1 hidden displays selection.
...And 2 more matches
nsIToolkitProfileService
os.file is available from gecko 1
8 (firefox 1
8.0 / thunderbird 1
8.0 / seamonkey 2.15).
... method overview nsitoolkitprofile createprofile(in nsilocalfile arootdir, in autf
8string aname); void flush(); nsitoolkitprofile getprofilebyname(in autf
8string aname); nsiprofilelock lockprofilepath(in nsilocalfile adirectory, in nsilocalfile atempdirectory); attributes attribute type description profilecount unsigned long the number of user profiles currently in existence.
...this may throw an ns_error_failure (0x
80004005) when trying to get the current profile if it's unavailable or if permissions restrict access.
...And 2 more matches
nsIXULRuntime
1.0 66 introduced gecko 1.
8 inherits from: nsisupports last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) implemented by: @mozilla.org/xre/app-info;1.
... os autf
8string a string tag identifying the current operating system.
... widgettoolkit autf
8string a string tag identifying the target widget toolkit in use.
...And 2 more matches
XPCOM primitive
(however, if you are designing that kind of api today, you should probably use nsivariant instead.) idl data type interface component idl nsidptr nsisupportsid @mozilla.org/supports-id;1 [scriptable, uuid(d1
8290a0-4a1c-11d3-9
890-00600
8962422)] interface nsisupportsid : nsisupportsprimitive { attribute nsidptr data; string tostring(); }; astring nsisupportsstring @mozilla.org/supports-string;1 [scriptable, uuid(d79dc970-4a1c-11d3-9
890-00600
8962422)] interface nsisupportsstring : nsisupportsprimitive { attribute astring data; wstring tostring(); }; prbool nsisupportsprbool @mozilla.o...
...rg/supports-prbool;1 [scriptable, uuid(ddc3b490-4a1c-11d3-9
890-00600
8962422)] interface nsisupportsprbool : nsisupportsprimitive { attribute prbool data; string tostring(); }; pruint
8 nsisupportspruint
8 @mozilla.org/supports-pruint
8;1 [scriptable, uuid(dec2e4e0-4a1c-11d3-9
890-00600
8962422)] interface nsisupportspruint
8 : nsisupportsprimitive { attribute pruint
8 data; string tostring(); }; pruint16 nsisupportspruint16 @mozilla.org/supports-pruint16;1 [scriptable, uuid(dfacb090-4a1c-11d3-9
890-00600
8962422)] interface nsisupportspruint16 : nsisupportsprimitive { attribute pruint16 data; string tostring(); }; pruint32 nsisupportspruint32 @mozilla.org/supports-pruint32;1 [scriptable, uuid(e01dc470-4a1c-11d3-9
890-00600
8962422)] interface nsisupportspruint32 : nsisupp...
...ortsprimitive { attribute pruint32 data; string tostring(); }; pruint64 nsisupportspruint64 @mozilla.org/supports-pruint64;1 [scriptable, uuid(e13567c0-4a1c-11d3-9
890-00600
8962422)] interface nsisupportspruint64 : nsisupportsprimitive { attribute pruint64 data; string tostring(); }; prtime nsisupportsprtime @mozilla.org/supports-prtime;1 [scriptable, uuid(e2563630-4a1c-11d3-9
890-00600
8962422)] interface nsisupportsprtime : nsisupportsprimitive { attribute prtime data; string tostring(); }; char nsisupportschar @mozilla.org/supports-char;1 [scriptable, uuid(e2b05e40-4a1c-11d3-9
890-00600
8962422)] interface nsisupportschar : nsisupportsprimitive { attribute char data; string tostring(); }; print16 nsisupportsprint16 @mozilla.org/supports-print16;1 [scrip...
...And 2 more matches
Standard OS Libraries
this comes shipped by default with all installations of windows operating systems since win9
8.
... 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/dd162
805%2
8v=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, ctypes.bool, point.ptr ); /* use it like this */ var point = point(); var ret = getcursorpos(point.address()); components.utils.report...
...attempting to install firefox on a a non-gtk+ based linux build such as kaosx, which is qt based (details on kaosx at the time of this writing: kdelibs version 4.1.4.3, qt version 4.
8.6, 64bit) would install gtk+ libraries along with it in order to enable firefox to work on the qt system.
...And 2 more matches
Plug-in Development Overview - Plugins
for more information about mime types, see these mime rfcs: rfc-2045: "multipurpose internet mail extensions (mime) part one: format of internet message bodies" rfc-2046: "multipurpose internet mail extensions (mime) part two: media types" rfc-42
88: "media type specifications and registration procedures" there are some variations to how plug-ins are handled on different platforms.
...'str#' 12
8 should contain a list of mime types and file extensions in alternating strings.
... for example: str 12
8 mime type string 1 video/quicktime string 2 mov, moov string 3 audio/aiff string 4 aiff string 5 image/jpeg string 6 jpg several other optional strings may contain useful information about the plug-in.
...And 2 more matches
Streams - Plugins
the browser can write a smaller amount of data if desired or necessary (for example, if only
8k of data is available in a network buffer).
... for instance, suppose the plug-in allocates, in npp_newstream, an
8k buffer to hold the data written from that stream.
... in the first call, npp_writeready could return
8192, resulting in a call to npp_write with a buffer of up to
8k bytes.
...And 2 more matches
Aggregate view - Firefox Developer Tools
before firefox 4
8, this was the default view of a heap snapshot.
... after firefox 4
8, the default view is the tree map view, and you can switch to the aggregate view using the dropdown labeled "view:": the aggregate view looks something like this: it presents a breakdown of the heap's contents, as a table.
...so, for example, the first entry says that: 4,
832,592 bytes, comprising 93% of the total heap usage, were allocated in a function at line 35 of "alloc.js", or in functions called by that function we can use the disclosure triangle to drill down the call tree, to find the exact place your code made those allocations.
...And 2 more matches
AesGcmParams - Web APIs
for details of how to supply appropriate values for this parameter, see the specification for aes-gcm: nist sp
800-3
8d, in particular section 5.2.1.1 on input data.
...section
8.2 of the specification outlines methods for constructing ivs.
... according to the web crypto specification this must have one of the following values: 32, 64, 96, 104, 112, 120, or 12
8.
...And 2 more matches
AnalyserNode.fftSize - Web APIs
must be a power of 2 between 252^5 and 2152^15, so one of: 32, 64, 12
8, 256, 512, 1024, 204
8, 4096,
8192, 163
84, and 3276
8.
... defaults to 204
8.
...for more complete applied examples/information, check out our voice-change-o-matic demo (see app.js lines 12
8–205 for relevant code).
...And 2 more matches
CanvasRenderingContext2D.rotate() - Web APIs
you can use degree * math.pi / 1
80 to calculate a radian from a degree.
... html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // point of transform origin ctx.arc(0, 0, 5, 0, 2 * math.pi); ctx.fillstyle = 'blue'; ctx.fill(); // non-rotated rectangle ctx.fillstyle = 'gray'; ctx.fillrect(100, 0,
80, 20); // rotated rectangle ctx.rotate(45 * math.pi / 1
80); ctx.fillstyle = 'red'; ctx.fillrect(100, 0,
80, 20); // reset transformation matrix to the identity matrix ctx.settransform(1, 0, 0, 1, 0, 0); result the center of rotation is blue.
... html <canvas id="canvas"></canvas> javascript the shape is a rectangle with its corner at (
80, 60), a width of 140, a height of 30.
...And 2 more matches
Compositing example - Web APIs
function createcanvas() { var canvas = document.createelement("canvas"); canvas.style.background = "url("+op_
8x
8.data+")"; canvas.style.border = "1px solid #000"; canvas.style.margin = "5px"; canvas.width = width/2; canvas.height = height/2; return canvas; } function runcomposite() { var dl = document.createelement("dl"); document.body.appendchild(dl); while(gco.length) { var pop = gco.pop(); var dt = document.createelement("dt"); dt.textcontent = p...
...todrawresult = createcanvas(); var ctx = canvastodrawresult.getcontext('2d'); ctx.clearrect(0, 0, width, height) ctx.save(); ctx.drawimage(canvas1, 0, 0, width/2, height/2); ctx.globalcompositeoperation = pop; ctx.drawimage(canvas2, 0, 0, width/2, height/2); ctx.globalcompositeoperation = "source-over"; ctx.fillstyle = "rgba(0,0,0,0.
8)"; ctx.fillrect(0, height/2 - 20, width/2, 20); ctx.fillstyle = "#fff"; ctx.font = "14px arial"; ctx.filltext(pop, 5, height/2 - 5); ctx.restore(); var ctx = canvastodrawon.getcontext('2d'); ctx.clearrect(0, 0, width, height) ctx.save(); ctx.drawimage(canvas1, 0, 0, width/2, height/2); ctx.fillstyle = "rgba(0,0,0,0.
8...
...fillrect(0, height/2 - 20, width/2, 20); ctx.fillstyle = "#fff"; ctx.font = "14px arial"; ctx.filltext('existing content', 5, height/2 - 5); ctx.restore(); var ctx = canvastodrawfrom.getcontext('2d'); ctx.clearrect(0, 0, width, height) ctx.save(); ctx.drawimage(canvas2, 0, 0, width/2, height/2); ctx.fillstyle = "rgba(0,0,0,0.
8)"; ctx.fillrect(0, height/2 - 20, width/2, 20); ctx.fillstyle = "#fff"; ctx.font = "14px arial"; ctx.filltext('new content', 5, height/2 - 5); ctx.restore(); dd.appendchild(canvastodrawon); dd.appendchild(canvastodrawfrom); dd.appendchild(canvastodrawresult); dl.appendchild(dd); } }; utility functions the program rel...
...And 2 more matches
Pixel manipulation with canvas - Web APIs
data a uint
8clampedarray representing a one-dimensional array containing the data in the rgba order, with integer values between 0 and 255 (included).
... the data property returns a uint
8clampedarray which can be accessed to look at the raw pixel data; each pixel is represented by four one-byte values (red, green, blue, and alpha, in that order; that is, "rgba" format).
... the uint
8clampedarray contains height × width × 4 bytes of data, with index values ranging from 0 to (height×width×4)-1.
...And 2 more matches
EventTarget.addEventListener() - Web APIs
polyfill you can work around addeventlistener(), removeeventlistener(), event.preventdefault(), and event.stoppropagation() not being supported by internet explorer
8 by using the following code at the beginning of your script.
... note: usecapture is not supported, as ie
8 does not have any alternative method.
... the following code only adds ie
8 support.
...And 2 more matches
FileSystem - Web APIs
eroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetfilesystemchrome full support 7alternate name full support 7alternate name alternate name uses the non-standard name: domfilesystemedge full support ≤1
8prefixed notes full support ≤1
8prefixed notes prefixed implemented with the vendor prefix: webkitnotes edge only supports this api in drag-and-drop scenarios using the the datatransferitem.webkitgetasentry() method.
...th the vendor prefix: webkitsafari full support 11.1webview android full support ≤37alternate name full support ≤37alternate name alternate name uses the non-standard name: domfilesystemchrome android full support 1
8alternate name full support 1
8alternate name alternate name uses the non-standard name: domfilesystemfirefox android full support 50opera android full support 14prefixed full support 14prefixed prefixed implemented wit...
...full support 11.3samsung internet android full support 1.0prefixed full support 1.0prefixed prefixed implemented with the vendor prefix: webkitnamechrome full support 7edge full support ≤1
8firefox full support 50ie no support noopera full support 15safari full support 11.1webview android full support ≤37chrome android full support ...
...And 2 more matches
FileSystemFileEntry - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetfilesystemfileentrychrome full support
8alternate name full support
8alternate name alternate name uses the non-standard name: fileentryedge full support 79prefixed full support 79prefixed prefixed implemented with the vendor prefix: webkitfirefox full support ...
... nosafari full support 11.1webview android full support ≤37alternate name full support ≤37alternate name alternate name uses the non-standard name: fileentrychrome android full support 1
8alternate name full support 1
8alternate name alternate name uses the non-standard name: fileentryfirefox android full support 50opera android no support nosafari ios full support 11.3samsung internet android ...
... full support yesprefixed full support yesprefixed prefixed implemented with the vendor prefix: webkitcreatewriter deprecatednon-standardchrome full support
8edge full support 79firefox no support 50 — 52notes no support 50 — 52notes notes while the createwriter() method existed, it immediately called errorcallback with the ns_error_dom_security_err error.ie no support noopera no support nosafari no support nowebview android ...
...And 2 more matches
Fullscreen API - Web APIs
no support 9 — 65alternate name alternate name uses the non-standard name: mozfullscreenie no support noopera full support 5
8 full support 5
8 full support 15alternate name alternate name uses the non-standard name: webkitisfullscreensafari full support 6alternate name full support 6alternate name alternate name uses the non-standard name: web...
... 71 full support 71 full support ≤37alternate name alternate name uses the non-standard name: webkitisfullscreenchrome android full support 71 full support 71 full support 1
8alternate name alternate name uses the non-standard name: webkitisfullscreenfirefox android full support 64 full support 64 no support 49 — 65disabled disabled from version 49 until version 65 (exclusive): this feature is behind the full-screen-api.unprefix.enabled preference (need...
...t exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetfullscreenelementchrome full support 53prefixed full support 53prefixed prefixed implemented with the vendor prefix: webkitedge full support ≤1
8prefixed full support ≤1
8prefixed prefixed implemented with the vendor prefix: webkit full support 12prefixed prefixed implemented with the vendor prefix: msfirefox full support 64 full support 64 no sup...
...And 2 more matches
HTMLElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" y="1" width="110" height="50" fill="#f4f7f
8" 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...
... htmlelement.oncopy returns the event handling code for the copy event (bug 2
80959).
...And 2 more matches
Ajax navigation example - Web APIs
l ajax pages.</p> include/before_content.php: <p> [ <a class="ajax-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; } ore...
...status-codes.xml */ { 100: "continue", 101: "switching protocols", 102: "processing", 200: "ok", 201: "created", 202: "accepted", 203: "non-authoritative information", 204: "no content", 205: "reset content", 206: "partial content", 207: "multi-status", 20
8: "already reported", 226: "im used", 300: "multiple choices", 301: "moved permanently", 302: "found", 303: "see other", 304: "not modified", 305: "use proxy", 306: "reserved", 307: "temporary redirect", 30
8: "permanent redirect", 400: "bad request", 401: ...
..."unauthorized", 402: "payment required", 403: "forbidden", 404: "not found", 405: "method not allowed", 406: "not acceptable", 407: "proxy authentication required", 40
8: "request timeout", 409: "conflict", 410: "gone", 411: "length required", 412: "precondition failed", 413: "request entity too large", 414: "request-uri too long", 415: "unsupported media type", 416: "requested range not satisfiable", 417: "expectation failed", 422: "unprocessable entity", 423: "locked", 424: "failed dependency", 425: "unassigned", 426: "upgrade required", ...
...And 2 more matches
IDBFactory - Web APIs
25 full support 25 no support 25 — 57prefixed prefixed implemented with the vendor prefix: webkitfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support 1.5 full support 1.5 no support 1.5 — 7.0prefixed prefixed implemented with the vendor prefix: webkitcmpchrome full support 24 full support 24 ...
...— ?prefixed prefixed implemented with the vendor prefix: webkitchrome android full support 25firefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support 1.5databases experimentalchrome full support 71edge full support 79firefox no support nonotes no support nonotes notes see bug 934640.ie...
... no support noopera full support 5
8safari no support nowebview android full support 71chrome android full support 71firefox android no support nonotes no support nonotes notes see bug 934640.opera android full support yessafari ios no support nosamsung internet android full support 10.0deletedatabasechrome full support ...
...And 2 more matches
NotificationEvent - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetnotificationevent experimentalchrome full support 42edge full support ≤1
8firefox full support 44notes full support 44notes notes extended support releases (esr) before firefox 7
8 esr do not support service workers and the push api.ie ?
... samsung internet android full support 4.0notificationevent() constructor experimentalchrome full support 42edge full support ≤1
8firefox full support 44notes full support 44notes notes extended support releases (esr) before firefox 7
8 esr do not support service workers and the push api.ie ?
... samsung internet android full support 4.0action experimentalchrome full support 4
8edge full support ≤1
8firefox full support 44notes full support 44notes notes extended support releases (esr) before firefox 7
8 esr do not support service workers and the push api.ie ?
...And 2 more matches
SVGCircleElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svggeometryelement" target="_top"><rect x="
81" y="65" width="1
80" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="171" y="94" font-siz...
...And 2 more matches
SVGTSpanElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svgtextcontentelement" target="_top"><rect x="51" y="65" width="210" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="156" y="94" font-...
...And 2 more matches
SVGTextElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svgtextcontentelement" target="_top"><rect x="51" y="65" width="210" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="156" y="94" font-...
...And 2 more matches
Using server-sent events - Web APIs
echo "event: ping\n"; $curdate = date(date_iso
8601); echo 'data: {"time": "' .
...each event's data is a json object containing the iso
8601 timestamp corresponding to the time at which the event was generated.
... evtsource.close(); event stream format the event stream is a simple stream of text data which must be encoded using utf-
8.
...And 2 more matches
WEBGL_compressed_texture_astc - Web APIs
constants the compressed texture formats are exposed by 2
8 constants and can be used in two functions: compressedteximage2d() and compressedtexsubimage2d().
... constants blocks bits per pixel arraybuffer bytelength bytes if height and width are 512 ext.compressed_rgba_astc_4x4_khr ext.compressed_srgb
8_alpha
8_astc_4x4_khr 4x4
8.00 floor((width + 3) / 4) * floor((height + 3) / 4) * 16 262144 ext.compressed_rgba_astc_5x4_khr ext.compressed_srgb
8_alpha
8_astc_5x4_khr 5x4 6.40 floor((width + 4) / 5) * floor((height + 3) / 4) * 16 210944 ext.compressed_rgba_astc_5x5_khr ext.compressed_srgb
8_alpha
8_astc_5x5_khr 5x5 5.12 floor((width + 4) / 5) * floor((height + 4) / 5) * 16 169744 ext.compressed_rgba_astc_6x5_khr ext.compressed_srgb
8_alpha
8_astc_6x5_khr 6x5 4.27 floor((width + 5) / 6) * floor((height + 4) / 5) * 16 14172
8 ex...
...t.compressed_rgba_astc_6x6_khr ext.compressed_srgb
8_alpha
8_astc_6x6_khr 6x6 3.56 floor((width + 5) / 6) * floor((height + 5) / 6) * 16 11
8336 ext.compressed_rgba_astc_
8x5_khr ext.compressed_srgb
8_alpha
8_astc_
8x5_khr
8x5 3.20 floor((width + 7) /
8) * floor((height + 4) / 5) * 16 105472 ext.compressed_rgba_astc_
8x6_khr ext.compressed_srgb
8_alpha
8_astc_
8x6_khr
8x6 2.67 floor((width + 7) /
8) * floor((height + 5) / 6) * 16
88064 ext.compressed_rgba_astc_
8x
8_khr ext.compressed_srgb
8_alpha
8_astc_
8x
8_khr
8x
8 2.00 floor((width + 7) /
8) * floor((height + 7) /
8) * 16 65536 ext.compressed_rgba_astc_10x5_khr ext.compressed_srgb
8_alpha
8_astc_10x5_khr 10x5 2.56 floor((width + 9) / 10) * ...
...And 2 more matches
Using Web Workers - Web APIs
event.data.hasownproperty('querymethod') && event.data.hasownproperty('querymethodarguments')) { queryablefunctions[event.data.querymethod] .apply(self, event.data.querymethodarguments); } else { defaultreply(event.data); } } here are the full implementation: example.html (the main page): <!doctype html> <html> <head> <meta charset="utf-
8" /> <title>mdn example - queryable worker</title> <script type="text/javascript"> /* queryableworker instances methods: * sendquery(queryable function name, argument to pass 1, argument to pass 2, etc.
... passing data by transferring ownership (transferable objects) google chrome 17+ and firefox 1
8+ contain an additional way to pass certain types of objects (transferable objects, that is objects implementing the transferable interface) to or from a worker with high performance.
...var uint
8array = new uint
8array(1024 * 1024 * 32); // 32mb for (var i = 0; i < uint
8array.length; ++i) { uint
8array[i] = i; } worker.postmessage(uint
8array.buffer, [uint
8array.buffer]); note: for more information on transferable objects, performance, and feature-detection for this method, read transferable objects: lightning fast!
...And 2 more matches
Window.open() - Web APIs
google chrome (55.0.2
883.
87 m ) on the other hand will do it only from the same parent (as if the window was created dependent, which is the "opener").
... outerwidth (only on firefox, obsolete from firefox
80) specifies the width of the whole browser window in pixels.
... outerheight (only on firefox, obsolete from firefox
80) specifies the height of the whole browser window in pixels.
...And 2 more matches
Sending and Receiving Binary Data - Web APIs
this example reads an image as a binary file and creates an
8-bit unsigned integer array from the raw bytes.
... var oreq = new xmlhttprequest(); oreq.open("get", "/myfile.png", true); oreq.responsetype = "arraybuffer"; oreq.onload = function (oevent) { var arraybuffer = oreq.response; // note: not oreq.responsetext if (arraybuffer) { var bytearray = new uint
8array(arraybuffer); for (var i = 0; i < bytearray.bytelength; i++) { // do something with each byte in the array } } }; oreq.send(null); you can also read a binary file as a blob by setting the string "blob" to the responsetype property.
... var myarray = new arraybuffer(512); var longint
8view = new uint
8array(myarray); // generate some data for (var i=0; i< longint
8view.length; i++) { longint
8view[i] = i % 256; } var xhr = new xmlhttprequest; xhr.open("post", url, false); xhr.send(myarray); this is building a 512-byte array of
8-bit integers and sending it; you can use any binary data you'd like, of course.
...And 2 more matches
ARIA: table role - Accessibility
<div role="table" aria-label="semantic elements" aria-describedby="semantic_elements_table_desc" aria-rowcount="
81"> <div id="semantic_elements_table_desc">semantic elements to use instead of aria's roles</div> <div role="rowgroup"> <div role="row"> <span role="columnheader" aria-sort="none">aria role</span> <span role="columnheader" aria-sort="none">semantic element</span> </div> </div> <div role="rowgroup"> <div role="row" aria-rowindex="11"> <span role="cell">header</span> <span role="cell">h1</span> </div> <div role="...
...row" aria-rowindex="16"> <span role="cell">header</span> <span role="cell">h6</span> </div> <div role="row" aria-rowindex="1
8"> <span role="cell">rowgroup</span> <span role="cell">thead</span> </div> <div role="row" aria-rowindex="24"> <span role="cell">term</span> <span role="cell">dt</span> </div> </div> </div> description an element with role="table" is a static tabular structure with rows containing cells.
... examples <div role="table" aria-label="semantic elements" aria-describedby="semantic_elements_table_desc" aria-rowcount="
81"> <div id="semantic_elements_table_desc">semantic elements to use instead of aria's roles</div> <div role="rowgroup"> <div role="row"> <span role="columnheader" aria-sort="none">aria role</span> <span role="columnheader" aria-sort="none">semantic element</span> </div> </div> <div role="rowgroup"> <div role="row" aria-rowindex="11"> <span role="cell">h...
...And 2 more matches
Perceivable - Accessibility
1.2.
8 provide an alternative for prerecorded media (aaa) for all content that features video, a descriptive text transcript should be provided, for example a script of the movie you are watching.
...larger text is defined as at least 1
8pt, or 14pt bold.
...larger text is defined as at least 1
8pt, or 14pt bold.
...And 2 more matches
<angle> - CSS: Cascading Style Sheets
examples: 0grad, 100grad, 3
8.
8grad.
...one full circle is 2π radians which approximates to 6.2
832rad.
... 1rad is 1
80/π degrees.
...And 2 more matches
background-position - CSS: Cascading Style Sheets
syntax /* keyword values */ background-position: top; background-position: bottom; background-position: left; background-position: right; background-position: center; /* <percentage> values */ background-position: 25% 75%; /* <length> values */ background-position: 0 0; background-position: 1cm 2cm; background-position: 10ch
8em; /* multiple images */ background-position: 0 0, center; /* edge offsets values */ background-position: bottom 10px right 20px; background-position: right 3em bottom 10px; background-position: bottom 10px right; background-position: top right 10px; /* global values */ background-position: inherit; background-position: initial; background-position: unset; the background-position property is...
... html <div class="exampleone">example one</div> <div class="exampletwo">example two</div> <div class="examplethree">example three</div> css /* shared among all <div>s */ div { background-color: #ffee99; background-repeat: no-repeat; width: 300px; height:
80px; margin-bottom: 12px; } /* these examples use the `background` shorthand property */ .exampleone { background: url("https://mdn.mozillademos.org/files/119
87/startransparent.gif") #ffee99 2.5cm bottom no-repeat; } .exampletwo { background: url("https://mdn.mozillademos.org/files/119
87/startransparent.gif") #ffee99 left 4em bottom 1em no-repeat; } /* multiple background images: each imag...
...*/ .examplethree { background-image: url("https://mdn.mozillademos.org/files/119
87/startransparent.gif"), url("https://mdn.mozillademos.org/files/7693/catfront.png"); background-position: 0px 0px, right 3em bottom 2em; } result specifications specification status comment css backgrounds and borders module level 3the definition of 'background-position' in that specification.
...And 2 more matches
background-size - CSS: Cascading Style Sheets
note: the behavior of <gradient>s changed in gecko
8.0 (firefox
8.0 / thunderbird
8.0 / seamonkey 2.5).
...rendering of <gradient>s in such cases changed in firefox
8, and at present is generally inconsistent across browsers, which do not all implement rendering in full accordance with the css3 background-size specification and with the css3 image values gradient specification.
... not safe to use */ background-size: 25px; background-size: 50%; background-size: auto 50px; background-size: auto 50%; /* safe to use */ background-size: 25px 50px; background-size: 50% 50%; } note that it's particularly not recommended to use a pixel dimension and an auto dimension with a <gradient>, because it's impossible to replicate rendering in versions of firefox prior to
8, and in browsers not implementing firefox
8's rendering, without knowing the exact size of the element whose background is being specified.
...And 2 more matches
clamp() - CSS: Cascading Style Sheets
the <h1> element's font-size is set as clamp(1.
8rem, 2.5vw, 2.
8rem).
... this means that the font-size will be set at 1.
8rem, until the computed value of 2.5vw becomes greater than that of 1.
8rem.
... at this point, font-size will be set at 2.5vw, until 2.5vw's computed value becomes greater than that of 2.
8rem.
...And 2 more matches
font-variant-east-asian - CSS: Cascading Style Sheets
font-variant-east-asian: normal; font-variant-east-asian: ruby; font-variant-east-asian: jis7
8; /* <east-asian-variant-values> */ font-variant-east-asian: jis
83; /* <east-asian-variant-values> */ font-variant-east-asian: jis90; /* <east-asian-variant-values> */ font-variant-east-asian: jis04; /* <east-asian-variant-values> */ font-variant-east-asian: simplified; /* <east-asian-variant-values> */ font-variant-east-asian: traditional; /* <east-asian-variant-values> */ font-variant-east-asian: full-width; /* <east-asian-width-values> */ font-variant-east-asian: proportional-width; /* <east-a...
...sian-width-values> */ font-variant-east-asian: ruby full-width jis
83; /* global values */ font-variant-east-asian: inherit; font-variant-east-asian: initial; font-variant-east-asian: unset; syntax values normal this keyword leads to the deactivation of the use of such alternate glyphs.
...possible values are: keyword standard defining the glyphs opentype equivalent jis7
8 jis x 020
8:197
8 jp7
8 jis
83 jis x 020
8:19
83 jp
83 jis90 jis x 020
8:1990 jp90 jis04 jis x 0213:2004 jp04 simplified none, use the simplified chinese glyphs smpl traditional none, use the traditional chinese glyphs trad <east-asian-width-values> these values control the sizing of f...
...And 2 more matches
font-variant - CSS: Cascading Style Sheets
the possible values are: jis7
8, jis
83, jis90, jis04, simplified, traditional, full-width, proportional-width, ruby.
...res ]<historical-lig-values> = [ historical-ligatures | no-historical-ligatures ]<contextual-alt-values> = [ contextual | no-contextual ]<feature-value-name> = <custom-ident><numeric-figure-values> = [ lining-nums | oldstyle-nums ]<numeric-spacing-values> = [ proportional-nums | tabular-nums ]<numeric-fraction-values> = [ diagonal-fractions | stacked-fractions ]<east-asian-variant-values> = [ jis7
8 | jis
83 | jis90 | jis04 | simplified | traditional ]<east-asian-width-values> = [ full-width | proportional-width ] examples setting the small-caps font variant html <p class="normal">firefox rocks!</p> <p class="small">firefox rocks!</p> css p.normal { font-variant: normal; } p.small { font-variant: small-caps; } result specifications specification status comment ...
... full support 1ie full support 4opera full support 3.5safari full support 1webview android full support 1chrome android full support 1
8firefox android full support 4opera android full support 11safari ios full support 1samsung internet android full support 1.0css fonts module level 3 shorthandchrome full support ...
...And 2 more matches
font-weight - CSS: Cascading Style Sheets
syntax /* keyword values */ font-weight: normal; font-weight: bold; /* keyword values relative to the parent */ font-weight: lighter; font-weight: bolder; /* numeric keyword values */ font-weight: 100; font-weight: 200; font-weight: 300; font-weight: 400;// normal font-weight: 500; font-weight: 600; font-weight: 700;// bold font-weight:
800; font-weight: 900; /* global values */ font-weight: inherit; font-weight: initial; font-weight: unset; the font-weight property is specified using any one of the values listed below.
... in earlier versions of the font-weight specification, the property accepts only keyword values and the numeric values 100, 200, 300, 400, 500, 600, 700,
800, and 900; non-variable fonts can only really make use of these set values, although fine-grained values (e.g.
... inherited value bolder lighter 100 400 100 200 400 100 300 400 100 400 700 100 500 700 100 600 900 400 700 900 400
800 900 700 900 900 700 common weight name mapping the numerical values 100 to 900 roughly correspond to the following common weight names (see the opentype specification): value common weight name 100 thin (hairline) 200 extra light (ultra light) 300 light 400 normal (regular) 500 medium ...
...And 2 more matches
min-width - CSS: Cascading Style Sheets
opera supports applying min-width to table elements.safari full support 1webview android full support 4.4chrome android full support 1
8firefox android full support 4notes full support 4notes notes css 2.1 leaves the behavior of min-width with table undefined.
...in-width.edge full support 12notes full support 12notes notes edge uses auto as the initial value for min-width.firefox full support 34 full support 34 no support 16 — 22notes notes firefox 1
8 and later (until the value was removed), used auto as the initial value for min-width.ie no support noopera full support 12.1notes full support 12.1notes notes opera uses auto as the initial value for min-width.safari no support ...
...oid full support 25notes full support 25notes notes chrome uses auto as the initial value for min-width.firefox android full support 34 full support 34 no support 16 — 22notes notes firefox 1
8 and later (until the value was removed), used auto as the initial value for min-width.opera android full support 14notes full support 14notes notes opera uses auto as the initial value for min-width.safari ios no support nosamsung internet android ...
...And 2 more matches
mix-blend-mode - CSS: Cascading Style Sheets
ont: 1em monospace; } .row { display: flex; flex: 1 auto; flex-direction: row; flex-wrap: wrap; height: auto; } .col { display: flex; flex: 1 auto; flex-direction: column; height: auto; } .cell { margin: .5em; padding: .5em; background-color: #fff; overflow: hidden; text-align: center; } .note { background: #fff3d4; padding: 1em; margin: .5em .5em 0; font: .
8em sans-serif; text-align: left; white-space: nowrap; } .note + .row .cell { margin-top: 0; } .container { position: relative; background: linear-gradient(to right, #000 0%, transparent 50%, #fff 100%), linear-gradient(to bottom, #ff0 0%, #f0f 50%, #0ff 100%); width: 150px; height: 150px; margin: 0 auto; } .r { transform-origin: center; transform: rotate(-30deg...
...ue .item { mix-blend-mode: hue; } .saturation .item { mix-blend-mode: saturation; } .color .item { mix-blend-mode: color; } .luminosity .item { mix-blend-mode: luminosity; } using mix-blend-mode with html html <div class="isolate"> <div class="circle circle-1"></div> <div class="circle circle-2"></div> <div class="circle circle-3"></div> </div> css .circle { width:
80px; height:
80px; border-radius: 50%; mix-blend-mode: screen; position: absolute; } .circle-1 { background: red; } .circle-2 { background: lightgreen; left: 40px; } .circle-3 { background: blue; left: 20px; top: 40px; } .isolate { isolation: isolate; /* without isolation, the background color will be taken into account */ position: relative; } result using mix-blen...
...d-mode with svg svg <svg> <g class="isolate"> <circle cx="40" cy="40" r="40" fill="red"/> <circle cx="
80" cy="40" r="40" fill="lightgreen"/> <circle cx="60" cy="
80" r="40" fill="blue"/> </g> </svg> css circle { mix-blend-mode: screen; } .isolate { isolation: isolate; } /* without isolation, the background color will be taken into account */ result specifications specification status comment compositing and blending level 1the definition of 'mix-blend-mode' in that specification.
...And 2 more matches
Video player styling basics - Developer guides
basic styling the html video and its controls are all contained within a <figure> element, which is given a maximum width and height (based on the dimensions of the video used) and centered within the page: figure { max-width:64rem; width:100%; max-height:30.
875rem; height:100%; margin:1.25rem auto; padding:1.051%; background-color:#666; } the video controls container itself also needs some styling so that it is set up the correct way: .controls { width:100%; height:
8.097165991902
83400
8097165991902
8%; /* of figure's height */ position:relative; } the height of the .controls class is set to be (a very precise!) percentage of the ...
... progress bar the <progress> element has the following basic style set up: .controls progress { display:block; width:100%; height:
81%; margin-top:0.125rem; border:none; color:#0095dd; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; } like the <button> elements, <progress> also has a default border, which is removed here.
... as mentioned in the previous article, there is a fallback provided for browsers that do not support the <progress> element; this also needs to be styled appropriately: .controls progress[data-state="fake"] { background:#e6e6e6; height:65%; } .controls progress span { width:0%; height:100%; display:inline-block; background-color:#2a
84cd; } a .data-state class is also used here when a <progress> element is being "faked"; when it's in this state the background colour needs to be set.
...And 2 more matches
Audio and Video Delivery - Developer guides
for further info see cross browser audio basics (html5 audio in detail) html video <video controls width="640" height="4
80" poster="initialimage.png" autoplay muted> <source src="videofile.mp4" type="video/mp4"> <!-- fallback for browsers that don't support mp4 --> <source src="videofile.webm" type="video/webm"> <!-- specifying subtitle files --> <track src="subtitles_en.vtt" kind="subtitles" srclang="en" label="english"> <track src="subtitles_no.vtt" kind="subtitles" srclang="no" label="norwegian"> ...
... <!-- fallback for browsers that don't support video tag --> <a href="videofile.mp4">download video</a> </video> the code above creates a video player of dimensions 640x4
80 pixels, displaying a poster image until the video is played.
... javascript video var myvideo = document.createelement('video'); if (myvideo.canplaytype('video/mp4')) { myvideo.setattribute('src','videofile.mp4'); } else if (myvideo.canplaytype('video/webm')) { myvideo.setattribute('src','videofile.webm'); } myvideo.width = 4
80; myvideo.height = 320; we set the source of the video depending on the type of video file the browser supports we then set the width and height of the video.
...And 2 more matches
Using device orientation with 3D transforms - Developer guides
there are however two corrections that should be applied to those values: the initial alpha value is 1
80 (device flat on the back, top of the screen pointing 12:00), so the rotatez value should be alpha - 1
80 the y axis of the screen coordinate system is inverted, such that translatey(100px) moves an element 100px down, so the rotatey value should be -gamma finally, the order of the three different rotations is very important to accurately convert an orientation to a 3d rotation: rotatez, then r...
...here's a simple code snippet to sum it up: var elem = document.getelementbyid("view3d"); window.addeventlistener("deviceorientation", function(e) { // remember to use vendor-prefixed transform property elem.style.transform = "rotatez(" + ( e.alpha - 1
80 ) + "deg) " + "rotatex(" + e.beta + "deg) " + "rotatey(" + ( -e.gamma ) + "deg)"; }); orientation compensation compensating the orientation of the device can be useful to create parallax effects or augmented reality.
... this is achieved by inverting the previous order of rotations and negating the alpha value: var elem = document.getelementbyid("view3d"); window.addeventlistener("deviceorientation", function(e) { // again, use vendor-prefixed transform property elem.style.transform = "rotatey(" + ( -e.gamma ) + "deg)" + "rotatex(" + e.beta + "deg) " + "rotatez(" + - ( e.alpha - 1
80 ) + "deg) "; }); rotate3d to orientation should you ever need to convert a rotate3d axis-angle to orientation euler angles, you can use the following algorithm: // convert a rotate3d axis-angle to deviceorientation angles function orient( aa ) { var x = aa.x, y = aa.y, z = aa.z, a = aa.a, c = math.cos( aa.a ), s = math.sin( aa.a ), t = 1 - c, // axis-angle to rotation ma...
...And 2 more matches
Applying color to HTML elements using CSS - HTML: Hypertext Markup Language
our two colored boxes share a number of properties in common, so next we establish a class, .box, that defines those shared properties: .box { width: 290px; height: 100px; margin: 0; padding: 4px 6px; font: 2
8px "marker felt", "zapfino", cursive; display: flex; justify-content: center; align-items: center; } in brief, .box establishes the size of each box, as well as the configuration of the font used within.
... .boxright { float: right; background-color: hsl(270deg, 50%, 75%); outline: 4px dashed rgb(110, 20, 120); color: hsl(0deg, 100%, 100%); text-decoration: underline wavy #
88ff
88; text-shadow: 2px 2px 3px black; } finally, the .boxright class describes the unique properties of the box that's drawn on the right.
... <div id="box"> <label for="colorpicker">border color:</label> <input type="color" value="#
8888ff" id="colorpicker"> <p id="output"></p> </div> css the css simply establishes a size for the box and some basic styling for appearances.
...And 2 more matches
<input type="date"> - HTML: Hypertext Markup Language
the date is formatted according to iso
8601, described in format of a valid date string in date and time formats used in html.
... for date inputs, the value of step is given in days; and is treated as a number of milliseconds equal to
86,400,000 times the step value (the underlying numeric value is in milliseconds).
...plest use of <input type="date"> involves one <input> combined with its <label>, as seen below: <form action="https://example.com"> <label> enter your birthday: <input type="date" name="bday"> </label> <p><button>submit</button></p> </form> this html submits the entered date under the key bday to https://example.com — resulting in a url like https://example.com/?bday=1955-06-0
8.
...And 2 more matches
<input type="text"> - HTML: Hypertext Markup Language
the example below requires that the entered value be 4–
8 characters in length.
... <form> <div> <label for="uname">choose a username: </label> <input type="text" id="uname" name="name" required size="10" placeholder="username" minlength="4" maxlength="
8"> <span class="validity"></span> </div> <div> <button>submit</button> </div> </form> div { margin-bottom: 10px; position: relative; } input + span { padding-right: 30px; } input:invalid+span:after { position: absolute; content: '✖'; padding-left: 5px; } input:valid+span:after { position: absolute; content: '✓'; padding-left: 5px; } this renders like so: if you try to submit the form with less than 4 characters, you'll be given an appropriate error message (which differs between browsers).
... if you try to enter more than
8 characters, the browser won't let you.
...And 2 more matches
<input type="week"> - HTML: Hypertext Markup Language
<input> elements of type week create input fields allowing easy entry of a year plus the iso
8601 week number during that year (i.e., week 1 to 52 or 53).
... for week inputs, the value of step is given in weeks, with a scaling factor of 604,
800,000 (since the underlying numeric value is in milliseconds).
...there are multiple ways in which people could write week values; for example: week 1 2017 jan 2-
8 2017 2017-w01 etc.
...And 2 more matches
<tbody>: The Table Body element - HTML: Hypertext Markup Language
th, td { border: 1px solid #bbb; padding: 2px
8px 0; text-align: left; } then the style is set for the majority of the cells in the table, including all data cells but also those styles shared between our <td> and <th> cells.
... the cells are given a light gray outline which is a single pixel thick, padding is adjusted, and all cells are left-aligned using text-align thead > tr > th { background-color: #cce; font-size: 1
8px; border-bottom: 2px solid #999; } finally, header cells contained within the <thead> block are given additional styling.
... result first, the resulting table, so you know what we're building: html the revised html looks like this: <table> <thead> <tr> <th>student id</th> <th>name</th> </tr> </thead> <tbody> <tr> <th colspan="2">computer science</th> </tr> <tr> <td>3741255</td> <td>jones, martha</td> </tr> <tr> <td>4077
830</td> <td>pierce, benjamin</td> </tr> <tr> <td>5151701</td> <td>kirk, james</td> </tr> </tbody> <tbody> <tr> <th colspan="2">russian literature</th> </tr> <tr> <td>3971244</td> <td>nim, victor</td> </tr> </tbody> <tbody> <tr> <th colspan="2">astrophysics</th> </tr> <tr> <td>4100332</td> <td>petr...
...And 2 more matches
Data URLs - HTTP
data:text/plain;base64,sgvsbg
8sifdvcmxkiq== base64-encoded version of the above data:text/html,%3ch1%3ehello%2c%20world!%3c%2fh1%3e an html document with <h1>hello, world!</h1> data:text/html,<script>alert('hi');</script> an html document that executes a javascript alert.
... echo -n hello|base64 # outputs to console: agvsbg
8= echo -n hello>a.txt base64 a.txt # outputs to console: agvsbg
8= base64 a.txt>b.txt # outputs to file b.txt: agvsbg
8= encoding on microsoft windows encoding on windows can be done through powershell or some dedicated tool.
... [convert]::tobase64string([text.encoding]::utf
8.getbytes("hello")) # outputs to console: agvsbg
8= bash -c "echo -n hello`|base64" # outputs to console: agvsbg
8= # the backtick (`) is used to escape the piping (|) character here common problems this section describes problems that commonly occur when creating and using data urls.
...And 2 more matches
Identifying resources on the Web - HTTP
a more complex example might look like this: http://www.example.com:
80/path/to/myfile.html?key1=value1&key2=value2#somewhereinthedocument urns a uniform resource name (urn) is a uri that identifies a resource by name in a particular namespace.
... urn:isbn:97
80141036144 urn:ietf:rfc:7230 the two urns correspond to the book nineteen eighty-four by george orwell, the ietf specification 7230, hypertext transfer protocol (http/1.1): message syntax and routing.
... port :
80 is the port in this instance.
...And 2 more matches
Accept-Charset - HTTP
in early versions of http/1.1, a default character encoding was defined: iso-
8859-1.
... utf-
8 is now well-supported and the overwhelmingly preferred character encoding.
... to guarantee better privacy through less configuration-based entropy, all browsers omit the accept-charset header: internet explorer
8+, safari 5+, opera 11+, firefox 10+ and chrome 27+ no longer send it.
...And 2 more matches
Expressions and operators - JavaScript
exponentiation operator (**) calculates the base to the exponent power, that is, baseexponent 2 ** 3 returns
8.
... for example, var status = (age >= 1
8) ?
...the code prints the values of the diagonal elements in the array: var x = [0,1,2,3,4,5,6,7,
8,9] var a = [x, x, x, x, x]; for (var i = 0, j = 9; i <= j; i++, j--) // ^ console.log('a[' + i + '][' + j + ']= ' + a[i][j]); unary operators a unary operation is an operation with only one operand.
...And 2 more matches
Grammar and types - JavaScript
you can use most of iso
8859-1 or unicode letters such as å and ü in identifiers.
... numeric literals number and bigint types can be written in decimal (base 10), hexadecimal (base 16), octal (base
8) and binary (base 2).
... some examples of numeric literals are: 0, 117, -345, 1234567
891234567
89n (decimal, base 10) 015, 0001, -0o77, 0o777777777777n (octal, base
8) 0x1123, 0x00111, -0xf1a7, 0x1234567
89abcdefn (hexadecimal, "hex" or base 16) 0b11, 0b0011, -0b11, 0b11101001010101010101n (binary, base 2) for more information, see numeric literals in the lexical grammar reference.
...And 2 more matches
Regular expression syntax cheatsheet - JavaScript
has one of the following meanings: matches any single character except line terminators: \n, \r, \u202
8 or \u2029.
... es201
8 added the s "dotall" flag, which allows the dot to also match line terminators.
...for example, /\w/ matches "a" in "apple", "5" in "$5.2
8", and "3" in "3d".
...And 2 more matches
Date - JavaScript
instead, it is defined in ecma-262 that a maximum of ±100,000,000 (one hundred million) days relative to january 1, 1970 utc (that is, april 20, 271
821 bce ~ september 13, 275760 ce) can be represented by the standard date object (equivalent to ±
8,640,000,000,000,000 milliseconds).
... date.prototype.todatestring() returns the "date" portion of the date as a human-readable string like 'thu apr 12 201
8'.
... date.prototype.toisostring() converts a date to a string following the iso
8601 extended format.
...And 2 more matches
String.prototype.charCodeAt() - JavaScript
the first 12
8 unicode code points are a direct match of the ascii character encoding.
...fixedcharcodeat('\ud
800\udc00', 0); // 65536 // ex.
... fixedcharcodeat('\ud
800\udc00', 1); // false idx = idx || 0; var code = str.charcodeat(idx); var hi, low; // high surrogate (could change last hex to 0xdb7f // to treat high private surrogates // as single characters) if (0xd
800 <= code && code <= 0xdbff) { hi = code; low = str.charcodeat(idx + 1); if (isnan(low)) { throw 'high surrogate not followed by ' + 'low surrogate in fixedcharcodeat()'; } return ( (hi - 0xd
800) * 0x400) + (low - 0xdc00) + 0x10000; } if (0xdc00 <= code && code <= 0xdfff) { // low surrogate // we return false to allow loops to skip // this iteration since should have already handled // high surrogate above in the previous iteration return false; // hi = str.charcodeat(idx - 1); /...
...And 2 more matches
WebAssembly.Module - JavaScript
rt 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.0module() constructorchrome 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 ...
...rt 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.0customsectionschrome 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 ...
...rt 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.0exportschrome 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 ...
...And 2 more matches
parseInt() - JavaScript
(for example, a radix of 10 converts from a decimal number,
8 converts from octal, 16 from hexadecimal, and so on.) for radices above 10, letters of the english alphabet indicate numerals greater than 9.
... if the input string begins with "0" (a zero), radix is assumed to be
8 (octal) or 10 (decimal).
... parseint('0e0') // 0 parseint('0
8') // 0, because '
8' is not an octal digit.
...And 2 more matches
Media container formats (file types) - Web media technologies
video codecs supported by 3gp codec browser support chrome edge firefox safari avc (h.264) yes1,2 h.263 yes1 mpeg-4 part 2 (mp4v-es) yes1 vp
8 yes1 [1] firefox only supports 3gp on openmax-based devices, which currently means the boot to gecko (b2g) platform.
... video codecs supported by ogg codec browser support chrome edge firefox safari theora yes vp
8 yes vp9 yes audio codecs supported by ogg codec browser support chrome edge firefox safari flac yes opus yes vorbis yes quicktime the quicktime file format (qtff, qt, or mov) was created by apple for use by its media framework of the same...
...compliant implementations of webm are required to support the vp
8 and vp
8 video codecs and the theora and opus audio codecs.
...And 2 more matches
Populating the page: how browsers work - Web Performance
if you navigate to https://example.com, the html page is located on the server with ip address of 93.1
84.216.34.
... after the
8 round trips, the browser is finally able to make the request.
... <!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 received...
...And 2 more matches
Subresource Integrity - Web security
an integrity value begins with at least one string, with each string including a prefix indicating a particular hash algorithm (currently the allowed prefixes are sha256, sha3
84, and sha512), followed by a dash, and ending with the actual base64-encoded hash.
... example integrity string with base64-encoded sha3
84 hash: sha3
84-oqvuafxrkap7fdgccy5uykm6+r9gqq
8k/uxy9rx7hnqlgyl1kpzqho1wx4jwy
8wc so oqvuafxrkap7fdgccy5uykm6+r9gqq
8k/uxy9rx7hnqlgyl1kpzqho1wx4jwy
8wc is the "hash" part, and the prefix sha3
84 indicates that it's a sha3
84 hash.
... tools for generating sri hashes you can generate sri hashes from the command-line with openssl using a command invocation such as this: cat filename.js | openssl dgst -sha3
84 -binary | openssl base64 -a or with shasum using a command invocation such as this: shasum -b -a 3
84 filename.js | awk '{ print $1 }' | xxd -r -p | base64 notes: the pipe-through-xxd step takes the hexadecimal output from shasum and converts it to binary.
...And 2 more matches
Index - XPath
8 descendant-or-self axe, xpath the descendant-or-self axis indicates the context node and all of its descendants.
... 1
8 boolean xslt, xslt_reference the boolean function evaluates an expression and returns true or false.
... 2
8 floor xslt, xslt_reference the floor function evaluates a decimal number and returns the largest integer less than or equal to the decimal number.
...And 2 more matches
Compiling an Existing C Module to WebAssembly - WebAssembly
luckily, the canvas api has canvasrenderingcontext2d.getimagedata — that gives you an uint
8clampedarray containing the image data in rgba: async function loadimage(src) { // load image const imgblob = await fetch(src).then(resp => resp.blob()); const img = await createimagebitmap(imgblob); // make canvas same size as image const canvas = document.createelement('canvas'); canvas.width = img.width; canvas.height = img.height; // draw image onto canvas const ctx = canva...
...for that, you need to expose two additional functions — one that allocates memory for the image inside wasm and one that frees it up again: #include <stdlib.h> // required for malloc definition emscripten_keepalive uint
8_t* create_buffer(int width, int height) { return malloc(width * height * 4 * sizeof(uint
8_t)); } emscripten_keepalive void destroy_buffer(uint
8_t* p) { free(p); } the create_buffer() function allocates a buffer for the rgba image — hence 4 bytes per pixel.
...se that number to find the start of our buffer and copy the image data: const api = { version: module.cwrap('version', 'number', []), create_buffer: module.cwrap('create_buffer', 'number', ['number', 'number']), destroy_buffer: module.cwrap('destroy_buffer', '', ['number']), }; const image = await loadimage('./image.jpg'); const p = api.create_buffer(image.width, image.height); module.heap
8.set(image.data, p); // ...
...And 2 more matches
base64 - Archive of obsolete content
the only accepted value is "utf-
8".
... in order to encode and decode unicode strings, the charset parameter needs to be set: var base64 = require("sdk/base64"); var encodeddata = base64.encode(unicodestring, "utf-
8"); returns string : the encoded string decode(data, charset) decodes a string of data which has been encoded using base-64 encoding.
...the only accepted value is "utf-
8".
... in order to encode and decode unicode strings, the charset parameter needs to be set: var base64 = require("sdk/base64"); var decodeddata = base64.decode(encodeddata, "utf-
8"); returns string : the decoded string ...
panel - Archive of obsolete content
you can load remote html into the panel: var mypanel = require("sdk/panel").panel({ width: 1
80, height: 1
80, contenturl: "https://en.wikipedia.org/w/index.php?title=jetpack&useformat=mobile" }); mypanel.show(); you can also load html that's been packaged with your add-on, and this is most probably how you will create dialogs.
... the html <datalist> element doesn't give you autocomplete suggestions (bug 91
8600).
... you can't embed flash (bug 95257
8).
... you can't provide tooltips using title attributes (bug 91
8600).
widget - Archive of obsolete content
deprecated in firefox 29 and removed in firefox 3
8.
...l will not be anchored: data = require("sdk/self").data var clockpanel = require("sdk/panel").panel({ width:215, height:160, contenturl: data.url("clock.html") }); require("sdk/widget").widget({ id: "open-clock-btn", label: "clock", contenturl: data.url("history.png"), panel: clockpanel, onclick: function() { // will not be anchored this.panel.show(); } }); see bug 63
8142.
...this issue is currently tracked as bug
825434.
...this issue is currently tracked as bug
825434.
Finding window handles - Archive of obsolete content
that means if you use the top level nsibasewindow as a param, null will be returned in the chain and cause crash of firefox, that's a bug of firefox.(https://bugzilla.mozilla.org/show_bug.cgi?id=4
89045) now, let's move forward.
...i.nsidocshelltreeitem) .treeowner .queryinterface(ci.nsiinterfacerequestor) .getinterface(ci.nsibasewindow); var hwndstring = basewindow.nativehandle; components.utils.import('resource://gre/modules/ctypes.jsm'); var user32 = ctypes.open('user32.dll'); /* http://msdn.microsoft.com/en-us/library/ms633539%2
8v=vs.
85%29.aspx * bool winapi setforegroundwindow( * __in_ hwnd hwnd * ); */ var setforegroundwindow = user32.declare('setforegroundwindow', ctypes.winapi_abi, ctypes.bool, // return bool ctypes.voidptr_t // hwnd ); var hwnd = ctypes.voidptr_t(ctypes.uint64(hwndstring)); var rez_setforegroundwindow = setforegroundwindow(hwnd); console.log('rez_setforegroundwindow:', rez_setforegrou...
... is made into an actual gdkwindow* like this: var gdkwindow = ctypes.structtype('gdkwindow'); var gdkwindowptrstring = basewindow.nativehandle; var gdkwinptr = gdkwindow.ptr(ctypes.uint64(gdkwindowptrstring)); working with gdkwindow* gdkwindow* to xid var gdkwindow = ctypes.structtype('gdkwindow'); var gdkdrawable = ctypes.structtype('gdkdrawable'); var card32 = /^(alpha|hppa|ia64|ppc64|s390|x
86_64)-/.test(services.appinfo.xpcomabi) ?
...basewindow); var gdkwindowptrstring = basewindow.nativehandle; components.utils.import('resource://gre/modules/ctypes.jsm'); var gdk = ctypes.open('libgdk-x11-2.0.so.0'); var x11 = ctypes.open('libx11.so.6'); // types let guint32 = ctypes.uint32_t; let gdkwindow = ctypes.structtype('gdkwindow'); let gdkdrawable = ctypes.structtype('gdkdrawable'); let card32; if (/^(alpha|hppa|ia64|ppc64|s390|x
86_64)-/.test(services.appinfo.xpcomabi)) { card32 = ctypes.unsigned_int; } else { card32 = ctypes.unsigned_long; } let xid = card32; //https://developer.gnome.org/gdk2/stable/gdk2-x-window-system-interaction.html#gdk-x11-drawable-get-xid var gdk_x11_drawable_get_xid = gdk.declare('gdk_x11_drawable_get_xid', ctypes.default_abi, xid, gdkdrawable.ptr); var browserwindow_madeintogdkwinptr ...
How to convert an overlay extension to restartless - Archive of obsolete content
mappings, so that you can access your files with custom paths such as: resource://myaddon/filename.ext chrome://myaddon/content/filename.ext step 2: no more resource:// uris for files internal to your bundle unfortunately, resource mappings in your chrome.manifest were not usable in restartless add-ons until mozilla finally fixed this bug in firefox 3
8, which looked bad, but only because mozilla is still using resource:// uris internally and in examples.
...32-bit integers, or fun stuff like 4
8-bit integers).
...here are some functions to handle this: function getgenericpref(branch,prefname) { switch (branch.getpreftype(prefname)) { default: case 0: return undefined; // pref_invalid case 32: return getucharpref(prefname,branch); // pref_string case 64: return branch.getintpref(prefname); // pref_int case 12
8: return branch.getboolpref(prefname); // pref_bool } } function setgenericpref(branch,prefname,prefvalue) { switch (typeof prefvalue) { case "string": setucharpref(prefname,prefvalue,branch); return; case "number": branch.setintpref(prefname,prefvalue); return; case "boolean": branch.setboolpref(prefname,prefvalue);...
... step
8: window icons firefox does not scan the chrome/icons/default directory of restartless or extrationless extensions for window icons.
Promises - Archive of obsolete content
let info = yield os.file.stat(configpath); if (info.lastmodificationdate <= timestamp) return; timestamp = info.lastmodificationdate; // read the file as a utf-
8 string, parse as json.
... let config = json.parse( yield os.file.read(configpath, { encoding: "utf-
8" })); let files = []; // get the directory contents from a list of directories.
... config.indexstats = processor.stats; yield os.file.writeatomic(configpath, json.stringify(config), { tmppath: configpath + "." + math.random(), encoding: "utf-
8" }) timestamp = new date; }); http requests http requests should, in nearly all circumstances, be made via the standard xmlhttprequest api.
... try { this.data = json.parse( yield os.file.read(this.path, { encoding: "utf-
8" })); } catch (e if e.becausenosuchfile) { this.data = json.parse(json.stringify(default_)); } // create a saver to write our json-stringified data to our // path, at 1000ms minimum intervals.
List of Mozilla-Based Applications - Archive of obsolete content
name description additional information 3
89 directory server ldap server uses nss a3
80 seatback entertainment system media software this blog post mentions a reference to mozilla being used but i couldn't find more information about it.
...romium uses mozilla nss and npapi libraries emusic download manager music downloader for emusic emusic remote music manager enlis genome personal genome browser esxx javascript application server uses mozilla rhino etna xml wysiwyg editor eudora mail and news application the upcoming version
8 will be based on thunderbird evergreen library automation system evolution email client uses nss exe elearning xhtml editor seems to be using xul for some of their webui facebook open platform facebook open platform the fbml parser used in the platform is based on mozilla code fennec browser for mobiles as mark notes: fen...
...er part of instant-on operating system sqlite-manager database manager standalone version of add-on stealthsurfer secure internet tools on usb key uses firefox and thunderbird streambase complex event processing platform seems to use xulrunner stylizer css editor css editor css editor with built-in firebug-like diagnostics and gecko 1.
8 preview sun java enterprise system server products uses nss sundial browser with advanced domain name technology based on firefox surfeasy private and secure web browsing sweet16 apple ii computer emulator uses spidermonkey as a scriptable debugger for software running in the emulator mozilla sunbird/mozilla lightning calend...
...widgets desktop widgets uses mozilla spidermonkey yoono desktop social networking app standalone version of yoono firefox add-on zap sip client status update from august 200
8 zimbra desktop email and calendar application uses prism zinc video browser according to faq the standalone version is based on firefox zk web application framework makes use of xul zotero reference manager firefox extension and xulrunner application note: this page was previously hosted on mozpad.org and the history for that page...
Source code directories overview - Archive of obsolete content
windows contains source code for windows 95, windows 9
8 and windows nt 4.0.
... mac contains source code for macos: both the powerpc and 6
8000 versions.
... qt contains source code for the qt toolkit, a c class library which runs on x-windows on unix, windows 95, windows 9
8 and window nt 4.0.
... original document information author(s): daniel howard other contributors: heikki toivonen (11-nov-1999), hervé renault (for the french translation) (16-nov-1999) last updated date: michael kaply 2-june-2005 copyright information: portions of this content are © 199
8-2007 by individual mozilla.org contributors; content available under a creative commons license | details.
Structure of an installable bundle - Archive of obsolete content
(>=2.0) /chrome.manifest chrome registration manifest (>=1.
8) /components/* xpcom components (*.js, *.dll), and interface files from *.xpt (>=1.7) /defaults/preferences/*.js default preferences (>=1.7) /plugins/* npapi plugins (>=1.
8) /chrome/icons/default/* window icons (>=1.
8) /icon.png extension icon, for display in the add-ons manager, 32px × 32px (>=1.9.2) /icon64.png...
... for example: binary-component components/windows/mycomponent.dll abi=winnt_x
86-msvc binary-component components/mac/mycomponent.dylib abi=darwin_x
86-gcc3 binary-component components/mac/mycomponent64.dylib abi=darwin_x
86_64-gcc3 binary-component components/linux/mycomponent.so abi=linux_x
86-gcc3 this also means you can no longer have platform-specific preference files in your bundle.
...to facilitate the first case, the extension/app loader has special sub-directories specifically for platform-specific files (starting with toolkit/gecko 1.
8, firefox/thunderbird 1.5).
...for example, if a plugin vendor wanted to make a plugin available for consumer computers running linux(of the form: /platform/linux*/), macintosh(of the form: /platform/darwin*/), and windows(of the form: /platform/win*/), it would provide the following files: /platform/linux_x
86-gcc3/plugins/libmyplugin.so /platform/winnt_x
86-msvc/plugins/myplugin.dll /platform/darwin_ppc-gcc3/plugins/libmyplugin.dylib because xpt files are not platform-specific, any associated xpt files would go in the generic components directory: /components/myplugin.xpt if an extension has non-binary platform-specific code (such as code which uses the windows registry from script), it can also ...
Compiling The npruntime Sample Plugin in Visual Studio - Archive of obsolete content
build create a new project in visual studio for a win32 gui library (dll) (in .net 2003: win32 template, then switch to dll in application settings in the following dialog, export symbols too?)(in visual studio 200
8, it is visualc++|win32|win32 project, then check dll in the wizard).
... add the following preprocessor definitions to project properties|(all configurations)|c++|preprocessor|preprocessor definitions: win32;_windows;xp_win32;xp_win;_x
86_;npsimple_exports disable precompiled headers using project properties|(all configurations)|c++|precompiled headers|create/use precompiled header.
...
8.3?) and copy it in mozilla's "plugins" folder start mozilla and open about:plugins to verify the plugin is detected open the file "test.html" and begin testing.
... visual c++ 200
8 express don't support c99 standard about int32_t, uint32_t.
Document Loading - From Load Start to Finding a Handler - Archive of obsolete content
bird's eye view <map id="loaddiagrammap" name="loaddiagrammap"><area alt="(13) docontent()" coords="534,239,715,300" href="#nsiexternalhelperappservice::docontent"> <area alt="(10) getcategoryentry()" coords="575,41
8,
821,41
8,
821,455,629,455,629,4
84,575,4
84" href="#categorymanager" shape="poly"> <area alt="(12)" coords="539,133,5
83,163" href="#stream-converter"> <area alt="(11)" coords="4
85,133,537,163" href="#contenthandler"> <area alt="(9)" coords="445,132,4
84,165" href="#nsdocumentopeninfo::dispatchcontent"> <area alt="(
8)" coords="405,133,439,162" href="#onstartrequest-innards"> <area alt="(7) onstartreque...
...st()" coords="639,129,703,129,703,165,
833,165,
833,204,639,204" href="#onstartrequest" shape="poly"> <area alt="(6) asyncopen()" coords="637,121,709,121,709,96,7
83,96,7
83,5
8,637,5
8" href="#asyncopen" shape="poly"> <area alt="(5) open()" coords="311,306,432,371" href="#open"> <area alt="(4)" coords="90,3
84,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,14
8" href="#internalload"> <area alt="(1) loaduri/onlinkclick" coords="77,5,449,59" href="#loaduri"> <area alt="nsiexternalhelperappservice" coords="527,305,
839,339" href="#nsiexternalhelperappservice"> <...
...area alt="category manager" coords="6
83,467,
807,527" href="#nscategorymanager"> <area alt="nsdocumentopeninfo" coords="371,71,635,1
85" href="#nsdocumentopeninfo"> <area alt="necko" coords="721,113,
821,157" href="#necko"> <area alt="nsuriloader" coords="23,335,215,455" href="#nsuriloader"> <area coords="227,515,4
85,575" href="#nsiuricontentlistener"> <area alt="nsdocshell" coords="47,
83,203,153" href="#nsdocshell"></map> this block diagram is out of date as of january 2012 with regard to some minor control flow shuffling in nsuriloader.
... original document information author(s): boris zbarsky last updated date: october 24, 2003 copyright information: portions of this content are © 199
8–2007 by individual mozilla.org contributors; content available under a creative commons license | details.
Creating a Help Content Pack - Archive of obsolete content
starting with firefox 1.1 and the mozilla 1.
8 platform, only the table of contents data source will be displayed.
... nc:platform (added in mozilla 1.
8b2/firefox 1.1) when present specifies the platforms to which the information stored in the referenced data sources applies.
...strings recognized from 1.
8 onward are win, mac, os2, and unix; more will be added as required.
... nc:platform (added in mozilla 1.
8b2/firefox 1.1) may be used on search data sources as it's used on table of contents, index, and glossary definitions.
Introducing the Audio API extension - Archive of obsolete content
obsolete since gecko 2
8 (firefox 2
8 / thunderbird 2
8 / seamonkey 2.25 / firefox os 1.3)this feature is obsolete.
...this api has been deprecated since gecko 22, disabled since gecko 2
8, and removed from gecko 31.
...you can see an example below: // write samples using a js array var samples = [0.242, 0.127, 0.0, -0.05
8, -0.242, ...]; var numbersampleswritten = audiooutput.mozwriteaudio(samples); // write samples using a typed array var samples = new float32array([0.242, 0.127, 0.0, -0.05
8, -0.242, ...]); var numbersampleswritten = audiooutput.mozwriteaudio(samples); in the following example, we create an audio pulse: <!doctype html> <html> <head> <title>generating audio in real time</title> <script...
...for example, if working with two channels at 44100 samples per second, a writing interval of 100 ms, and a pre-buffer equal to 500 ms, one would write an array of (2 * 44100 / 10) =
8820 samples, and a total of (currentsampleoffset + 2 * 44100 / 2).
Table Layout Strategy - Archive of obsolete content
+ padding #define min_adj 3 // minimum width + padding due to col spans #define des_adj 4 // desired width + padding due to col spans #define fix_adj 5 // fixed width + padding due to col spans #define pct 6 // percent width of cell or col #define pct_adj 7 // percent width of cell or col from percent colspan #define min_pro
8 // desired width due to proportional <col>s or cols attribute #define final 9 // width after the table has been balanced, considering all of the others the priority of allocations for columns is as follows: max(min_con, min_adj) max (pct, pct_adj) fix fix_adj max(des_con, des_adj), but use min_pro if present for a fixed width table, the column may get more space if the sum of t...
...one would expect the first column to be
80 px and the second to be 120 px .
...the second table has <col width="33%"><col> lets return to the first case but now but with more than 100%: <col width="40%"><col width="
80%"><tbody></tbody>foobar <col width="40%"><col><tbody></tbody>foobar <table border width="200px"> <col width="40%"><col width="
80%"> <tbody> <tr><td>foo</td><td>bar</td></tr> </tbody> </table> the algorithm tries to satisfy the requirements on a first come first serve base.
... original document information author(s): bernd mielke last updated date: september 27, 2003 copyright information: portions of this content are © 199
8–2007 by individual mozilla.org contributors; content available under a creative commons license | details.
Actionscript Performance Tests - Archive of obsolete content
for example if the mean is 100 and the 95% confidence interval is 2%, 95% of the expected values should fall between 9
8 and 102.
...sunspider) $ ./runtests.py sunspider/*.as sunspider/as3/*.as test avm metric sunspider/access-binary-trees.as 5
84 time sunspider/access-fannkuch.as 364 time ...
...# change the iterations $ ./runtests.py --iterations=10 sunspider/*.as test avm 95% conf metric sunspider/access-binary-trees.as 565 1.0% time [565, 5
86, 573, 577, 567, 567, 579, 576, 565, 5
85] sunspider/access-fannkuch.as 361 0.3% time [365, 366, 362, 363, 366, 361, 363, 363, 364, 364] ...
...unspider/*.as test avm avm2 min : max avg min : max avg %diff metric ----------------------- ----------------------- ----- sunspider/access-binary-trees.as [ 567.0 : 5
85] 575.9 [ 564.0 : 5
80] 572.0 0.5 time sunspider/access-fannkuch.as [ 363.0 : 3
86] 370.0 [ 362.0 : 399] 371.
8 0.3 time ...
Running Tamarin acceptance tests - Archive of obsolete content
$ cd tamarin-redux/test/acceptance $ export asc=/users/build/hg/tamarin-redux/utils/asc.jar $ export builtinabc=/users/build/hg/tamarin-redux/generated/builtin.abc $ export shellabc=/users/build/hg/tamarin-redux/generated/shell_toplevel.abc $ export avm=/users/build/hg/tamarin-redux/objdir-release/shell/avmshell $ python runtests.py tamarin tests started: 2010-09-2
8 10:37:06.410676 current configuration: x64-mac-tvm-release avm version: 5260:6d1
899261bac executing 2532 tests against vm: /users/build/hg/builds/5260-6d1
899261bac/mac/avmshell_64 2532 running abcasm/abs_helper.as skipping...
...reason: inconsistencies in different debug output, need to implement regex matching of diffs 2527 running abcasm/branchtocommon.abs 2530 running abcasm/arithmetic.abs 2529 running abcasm/bkpt.abs 252
8 running abcasm/bkptline.abs 2526 running abcasm/bug_476556.abs 2524 running abcasm/bug_491056.abs ...
...tests complete at 2010-09-2
8 10:39:26.751797 start date: 2010-09-2
8 10:3
8:07.221457 end date : 2010-09-2
8 10:39:26.751797 test time : 0:01:19.530340 passes : 59291 failures : 0 expected failures : 75 tests skipped : 76 the -f flag tells runtests.py to force recompilation of all the scripts.
...if you've correctly edited and run the android-vars.sh script mentioned on the tamarin build documentation page you should already be pathed to the adb executable in the public sdk/ndk, but if not it exists at /android-public/android-sdk-mac_
86/platform-tools.
Running Tamarin performance tests - Archive of obsolete content
$ cd tamarin-redux/test/performance $ python runtests.py executing tests at 200
8-07-22 13:56:54.
820920 avm: c:/dev/tamarin-tracing/bld/shell/avmshell.exe test avm sunspider/access-binary-trees.as
82.0 sunspider/access-fannkuch.as 152.0 sunspider/access-nbody.as 173.0 sunspider/access-nsieve.as 65.0 sunspider/bitops-3bit-bits-in-...
...byte.as 13.0 sunspider/bitops-bits-in-byte.as 36.0 $ export avm2=c:/dev/tamarin-tracing2/bld/shell/avmshell.exe $ python ./runtests.py executing tests at 200
8-07-22 14:03:51.9573
81 avm: c:/dev/tamarin-tracing/bld/shell/avmshell.exe avm2: c:/dev/tamarin-tracing2/bld/shell/avmshell.exe test avm avm2 %sp sunspider/access-binary-trees.as
82.0
80.0 2.5 sunspider/access-fannkuch.as 153.0 155.0 -1.3 sunspider/access-nbody.as 176.0 17
8.0 -1.1 sunspider/access-nsieve.as 65.0 6
8.0 -4.4 sunspider/bitops-3bit-bits-in-byte.as 12.0 13.0 -7.7 sunspider/bitops-bits-in-...
... really most useful with an index file (or v
8 tests), since running with raw time values will skew the results towards longer running tests csv output: "--csv filename" will save run results to a csv file that can be analyzed using excel pivottables.
...if you've correctly edited and run the android-vars.sh script mentioned on the tamarin build documentation page you should already be pathed to the adb executable in the public sdk/ndk, but if not it exists at /android-public/android-sdk-mac_
86/platform-tools.
The life of an HTML HTTP request - Archive of obsolete content
the parser typically gets data from the stream in
8kb blocks and parses these blocks, block by block.
...willinterrup is called by the parser between every
8kb block of data (unless the parser is temporarily blocked).
... (
8) each nsiframe knows how how to draw itself on the screen.
... original document information author(s): alexander larsson last updated date: october
8, 1999 copyright information: portions of this content are © 199
8–2007 by individual mozilla.org contributors; content available under a creative commons license | details.
Return Codes - Archive of obsolete content
no_matching_certificate -206 extracted file was not signed by the certificate used to sign the installation script cant_read_archive -207 xpi package cannot be read invalid_arguments -20
8 bad parameters to a function illegal_relative_path -209 illegal relative path user_cancelled -210 user clicked cancel on install dialog install_not_started -211 a problem occurred with the parameters to initinstall, or initinstall was not called first silent_mode_denied -212 the s...
... apple_single_err -21
8 an error occurred when unpacking a file in applesingle format.
... download_error -22
8 problem with download script_error -229 error in the script already_exists -230 file already exists locally is_file -231 expected target directoy and got file source_does_not_exist -232 source file/dir not found source_is_directory -233 expected source ...
...file and got directory source_is_file -234 expected source directory and got file insufficient_disk_space -235 not enough disk space for install filename_too_long -236 unable_to_locate_lib_function -237 unable_to_load_library -23
8 chrome_registry_error -239 malformed_install -240 key_access_denied -241 access to the registry key has been denied key_does_not_exist -242 registry key does not exist value_does_not_exist -243 registry value does not exist invalid_signature -260 the s...
XULRunner 2.0 Release Notes - Archive of obsolete content
xulrunner 2.0 is a universal binary containing i3
86 and x
86_64 architectures.
... xulrunner 1.9.2 and earlier versions had powerpc (ppc) and i3
86 architectures.
... linux (32-bit) unpack the tarball to a new directory using tar -xjf xulrunner-2.0.en-us.linux-i6
86.tar.bz2.
... linux (64-bit) unpack the tarball to a new directory using tar -xjf xulrunner-2.0.en-us.linux-x
86_64.tar.bz2.
mozilla.dev.platform FAQ - Archive of obsolete content
a: xulrunner trunk and 1.
8 (but not 1.
8.0) build storage by default, and anything can be built with storage if you put in you <tt>mozconfig --enable-storage</tt> q: program received signal exc_bad_instruction, illegal instruction/operand.
...in order to use xr successfully in <tt>--disable-libxul</tt> mode, you have to setup dyld_library_path to include <tt>/library/frameworks/xul.framework/versions/1.9a1</tt> - benjamin smedberg, fri, oct 20 2006 9:12 am q: when i try to build a completely standalone xul app on os x (10.4.
8).
...please make sure you're using 1.
8.0.4 or later (not 1.
8.0.1, which had a bug that prevented this from working properly).
... visual studio express 2005 q: when i try to run xulrunner-stub.exe i get the error "this application failed to start because msvcr
80.dll was not found." a: see bug 350616 ...
2006-10-20 - Archive of obsolete content
summary: mozilla.dev.builds - october 14th to october 20th 2006 linux reference platform 1.
8.1 october 1
8th: marcus is wondering about the linux platform that is currently used to compile both public releases of firefox and xulrunner.
... on october 1
8th marcus responded to his original post and expanded on the original content of his question.
...paul reed announced that: sparky, the linux performance test machine for the 1.
8 branchs, is being decommissioned.
...he can be contacted via: email: preed@mozilla.com irc: preed on irc.mozilla.org phone: 650.903.0
800 x256 uploading language packs to amo on october 17th benjamin smedberg brought the following to the attention of the localizers and the build team: that he is planning to upload the firefox 2 language packages currently located at http://releases.mozilla.org/pub/mozi...rc3/win32/xpi/ to addons.mozilla.org in the next few days.
2006-11-03 - Archive of obsolete content
summary: mozilla.dev.builds - october 2
8th to november 3rd 2006 no such file or directory (build problem on winxp) november 2nd: kenoa complained that when he is compiling using cygwin on win32 he gets the following error no such file or directory1: /cygdrive/c/mozilla/mail/config/mozconfig client.mk:339: /cygdrive/c/mozilla/.mozconfig.mk: no such file or directory he claims that the file ".mozconfig" exists in /cygdrive/c/mozilla/mail/config/mozconfig the disable-crypto cause problem originally posted on november 2nd: gxk is building minimo using the code base from sept.
...he has also created a bug entry on bugzilla with the bug id of opened bug #344
854.
... problem compiling with vs 2003 .net phil is trying to compile firefox for the first time and is getting an error when doing so: building deps for /cygdrive/c/mozilla/toolkit/airbag/airbag/src/common/windows/guid_string.cc make[1]: leaving directory `/cygdrive/c/mozilla/obj-i6
86-pc-cygwin' make: *** [build] error 2 he also noted that he is using make 3.
80-1.
... on november 2nd gery replied with the bug number 35
8706.
Extentsions FAQ - Archive of obsolete content
= document.getelementbyid("replaceme"); replaceme.parentnode.replacechild(newnode, replaceme); is it possible to place an image in the window that can be moved to anywhere in the window, and always remain on top of everything else?(similiar to using position:absolute and-index:100000 in html) you can almost do this with a stack: <window ...> <stack flex="1"> <image top="40" left="
80"/> <vbox> other content here </vbox> </stack> </window> the only restriction is that your image can't overlap the right or bottom of the window.
...<https://bugzilla.mozilla.org/show_bug.cgi?id=312
81
8> "thunderbird requires domain in addresses and doesn't always add default" there is an extension that allows what you want attached to one of the comments in this bug.
... you can aes-12
8 or aes-256 symmetric encryption via aes.js (http://tinyurl.com/pp79t).
... http://lxr.mozilla.org/mozilla1.
8/so...ents/nsbrowser...
2006-10-06 - Archive of obsolete content
re: plan to hold trunk closed for lack of talkback dbaron mentioned that maybe trunk should be closed because of lack of talkbacks received ( bug 354
835 is suspected).
... pal-moz offers a solution to bug 354
835.
... dbaron then follows up that bug 354
835 is solved so there is no need to close the tree waiting for it.
... firefox 1.5.0.
8 andrew schultz asks about the gecko 1.
8.0.
8 schedule.
NPAPI plugin reference - Archive of obsolete content
npn_utf
8fromidentifier returns the utf-
8 string corresponding to the given string identifier.
... npstring npstring is a struct that holds a pointer to a sequence of
8-bit units (nputf
8) making up a utf-
8 string, and the number of
8-bit units in the utf-
8 string.
... nputf
8 nputf
8 is a byte representing an
8-bit unit of a utf-
8 character.
... this is not the same thing as an entire utf-
8 character, which may be comprised of multiple nputf
8 bytes.
Encryption and Decryption - Archive of obsolete content
for example, 12
8-bit keys for use with the rc4 symmetric-key cipher supported by ssl provide significantly better cryptographic protection than 40-bit keys for use with the same cipher.
... roughly speaking, 12
8-bit rc4 encryption is 3 x 1026 times stronger than 40-bit rc4 encryption.
...on the other hand, symmetric-key ciphers can achieve approximately the same level of strength with an
80-bit key for most algorithms.
... link: red hat certificate system common criteria certification
8.1: deployment, planning, and installation ...
-ms-filter - Archive of obsolete content
examples the following example shows how to use the -ms-filter attribute in internet explorer
8.
... code example: http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/filter_
8.htm -ms-filter: 'progid:dximagetransform.microsoft.motionblur(strength=50), progid:dximagetransform.microsoft.basicimage(mirror=1)'; the following example shows how to use an inline style sheet to set the filter on an image.
... code example: http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/filter_h.htm <img style="filter:progid:dximagetransform.microsoft.motionblur(strength=50) progid:dximagetransform.microsoft.basicimage(mirror=1)" src="/workshop/samples/author/dhtml/graphics/cone.jpg" height="
80px" width="
80px" alt="cone"> the following example shows how to use scripting to set the filter on an image.
... dx filters and their standards-based alternatives: dx filter standards-based alternative alpha opacity alphaimageloader <img> or background-image and related properties gradient background-image: linear-gradient() dropshadow text-shadow or box-shadow matrix transform, transform-origin in windows internet explorer
8, the -ms-filter attribute is an extension to css, and can be used as a synonym for filter in ie
8 standards mode.
azimuth - Archive of obsolete content
90deg is to the right, 1
80deg is behind, and 270deg or -90deg is to the left.
... center behind: same as 1
80deg.
... behind: same as 1
80deg.
... examples h1 { azimuth: 30deg; } td.a { azimuth: far-right; } /* 60deg */ #12 { azimuth: behind far-right; } /* 120deg */ p.comment { azimuth: behind; } /* 1
80deg */ specifications specification status comment css level 2 (revision 1)the definition of 'azimuth' in that specification.
ECMAScript 2016 to ES.Next support in Mozilla - Archive of obsolete content
so far, es2016, es2017, and es201
8 have been released.
... ecmascript 2016 array.prototype.includes() (firefox 43) typedarray.prototype.includes() (firefox 43) exponentiation operator (firefox 52) ecmascript 2017 object.values() (firefox 47) object.entries() (firefox 47) string.prototype.padstart() (firefox 4
8) string.prototype.padend() (firefox 4
8) object.getownpropertydescriptors() (firefox 50) async functions async function (firefox 52) async function expression (firefox 52) asyncfunction (firefox 52) await (firefox 52) trailing commas in function parameter lists (firefox 52) ecmascript 201
8 spread in object literals and rest parameters (firefox 55) for await...of (fire...
...fox 57) global_objects/sharedarraybuffer (firefox 57, with flags) global_objects/promise/finally (firefox 5
8) global_objects/regexp/dotall (not yet implemented; in other browsers) regexp lookbehind assertions (not yet implemented; in other browsers) regexp unicode property escapes (not yet implemented; in other browsers) regexp named capture groups (not yet implemented; in other browsers) ecmascript 2019 array.flat() (firefox 62) array.flatmap() (firefox 62) object.fromentries() (firefox 63) string.trimstart() and string.trimend() (firefox 61) optional catch binding (firefox 5
8) function.tostring() revision (firefox 54) symbol.description (firefox 63) well-formed json.stringify() (firefox 64) ecmascript 2020 this is the current es.next version.
... see https://bugzilla.mozilla.org/show_bug.cgi?id=1336740 and https://bugzilla.mozilla.org/show_bug.cgi?id=57
8700.
Debug.msTraceAsyncCallbackStarting - Archive of obsolete content
example the following code provides an example of tracing an asynchronous call for a windows
8.x store app.
...also supported in store apps (windows
8.1 and windows phone
8.1).
... not supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, internet explorer 10 standards.
... not supported in windows
8.
Debug.msTraceAsyncCallbackCompleted - Archive of obsolete content
example the following code provides an example of tracing an asynchronous call for a windows
8.x store app.
...also supported in store apps (windows
8.1 and windows phone
8.1).
... not supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, internet explorer 10 standards.
... not supported in windows
8.
VBArray.toArray - Archive of obsolete content
for example, a vbarray with three dimensions and three elements in each dimension is converted into a javascript array as follows: suppose the vbarray contains: (1, 2, 3), (4, 5, 6), (7,
8, 9).
... after translation, the javascript array contains: 1, 2, 3, 4, 5, 6, 7,
8, 9.
...r a = new vbarray(vbarray); var b = a.toarray(); var i; for (i = 0; i < 9; i++) { document.writeln(b[i]); } } --> </script> </head> <body> <script type="text/javascript"> <!-- vbarraytest(createvbarray()); --> </script> </body> requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, and internet explorer 10 standards.
... not supported in windows
8.x store apps.
ECMAScript 2015 support in Mozilla - Archive of obsolete content
standard library additions to the array object array iteration with for...of (firefox 13) array.from() (firefox 32) array.of() (firefox 25) array.prototype.fill() (firefox 31) array.prototype.find(), array.prototype.findindex() (firefox 25) array.prototype.entries(), array.prototype.keys() (firefox 2
8), array.prototype.values() array.prototype.copywithin() (firefox 32) get array[@@species] (firefox 4
8) new map and set objects, and their weak counterparts map (firefox 13) map iteration with for...of (firefox 17) map.prototype.foreach() (firefox 25) map.prototype.entries() (firefox 20) map.prototype.keys() (firefox 20) map.prototype.values() constructor argument: n...
...ect.setprototypeof() (firefox 31) object.assign() (firefox 34) object.getownpropertysymbols() (firefox 33) additions to the date object date.prototype is an ordinary object (firefox 41) generic date.prototype.tostring (firefox 41) date.prototype[@@toprimitive] (firefox 44) new promise object promise (firefox 24, enabled by default in firefox 29) new proxy object proxy (firefox 1
8) preventextensions() trap (firefox 22) isextensible() trap (firefox 31) getprototypeof() and setprototypeof() traps (firefox 49) new reflect object reflect (firefox 42) additions to the regexp object regexp sticky (y) flag (firefox 3
8) regexp unicode (u) flag (firefox 46) generic regexp.prototype.tostring (firefox 39) regexp.prototype[@@match]() (firefox 49) regexp.prototype[@@re...
... arraybuffer get arraybuffer[@@species] (firefox 4
8) dataview int
8array uint
8array uint
8clampedarray int16array uint16array int32array uint32array float32array float64array get %typedarray%[@@species] (firefox 4
8) expressions and operators new.target (firefox 41) spread operator for arrays (firefox 16) use symbol.iterator property (firefox 36) spread operator for function calls (firefox 27) use symbol.iterator pr...
...operty (firefox 36) const (js 1.5, firefox 1.0) (es2015 compliance bug 950547 implemented in firefox 51) let (js 1.7, firefox 2) (es2015 compliance bug 950547 implemented in firefox 51) destructuring assignment (js 1.7, firefox 2) (es2015 compliance bug 10559
84) statements for...of (firefox 13) works in terms of .iterator() and .next() (firefox 17) use "@@iterator" property (firefox 27) use symbol.iterator property (firefox 36) functions rest parameters (firefox 15) default parameters (firefox 15) parameters without defaults after default parameters (firefox 26) destructured parameters with default value assignment (firefox 41) arrow functions (firefox 22) generator function (firefox 26) yield (firefox 26) yield* (firefox 27) ...
ECMAScript 5 support in Mozilla - Archive of obsolete content
supported features added in javascript 1.
8.5 (gecko 2, firefox 4 and later) firefox 4 has full ecmascript 5 support including the object.* methods and strict mode.
... see new in javascript 1.
8.5.
... added in javascript 1.
8.1 (gecko 1.9.1, firefox 3.5) native json support object.getprototypeof() method.
... added in javascript 1.6 (gecko 1.
8, firefox 1.5) new array methods offering several improved methods for manipulating arrays -- have been part of javascript since javascript 1.6.
Parsing microformats in JavaScript - Archive of obsolete content
after getting the text, it is normalized into an iso
8601 date.
...iso
8601fromdate converts a javascript date object into an iso
8601 formatted date.
... isodate = microformats.parser.iso
8601fromdate(date, punctuation) parameters date the javascript date object to convert.
... return value a string containing the iso
8601 formatted date.
Building up a basic demo with Babylon.js - Game development
html structure here's the html structure we will use: <!doctype html> <html> <head> <meta charset="utf-
8"> <title>mdn games: babylon.js demo</title> <style> html,body,canvas { margin: 0; padding: 0; width: 100%; height: 100%; font-size: 0; } </style> </head> <body> <script src="babylon.js"></script> <canvas id="render-canvas"></canvas> <script> var canvas = document.getelementbyid("render-canvas"); /* all our javascript code goes here */ </script> </body> </html> it con...
...let's create a scene by adding the following lines just below our previous code: var scene = new babylon.scene(engine); scene.clearcolor = new babylon.color3(0.
8, 0.
8, 0.
8); thus, the scene is created and the second line sets the background color to light gray.
...add these lines below the previous ones: var boxmaterial = new babylon.standardmaterial("material", scene); boxmaterial.emissivecolor = new babylon.color3(0, 0.5
8, 0.
86); box.material = boxmaterial; the standardmaterial takes two parameters: a name, and the scene you want to add it to.
...add the following code, again at the bottom of your script: var cylinder = babylon.mesh.createcylinder("cylinder", 2, 2, 2, 12, 1, scene); cylinder.position.x = 5; cylinder.rotation.x = -0.2; var cylindermaterial = new babylon.standardmaterial("material", scene); cylindermaterial.emissivecolor = new babylon.color3(1, 0.5
8, 0); cylinder.material = cylindermaterial; the cylinder parameters are: name, height, diameter at the top, diameter at the bottom, tessellation, height subdivisions and the scene to add it to.
Building up a basic demo with the PlayCanvas engine - Game development
<!doctype html> <html> <head> <meta charset="utf-
8"> <title>mdn games: playcanvas demo</title> <style> body { margin: 0; padding: 0; } canvas { width: 100%; height: 100%; } </style> </head> <body> <script src="playcanvas-latest.js"></script> <canvas id="application-canvas"></canvas> <script> var canvas = document.getelementbyid("application-canvas"); /* all our javascript code goes here */ </script> </body> </h...
... var camera = new pc.entity(); camera.addcomponent("camera", { clearcolor: new pc.color(0.
8, 0.
8, 0.
8) }); app.root.addchild(camera); camera.setposition(0, 0, 7); the code above will create a new entity.
... var boxmaterial = new pc.phongmaterial(); boxmaterial.diffuse.set(0, 0.5
8, 0.
86); boxmaterial.update(); box.model.model.meshinstances[0].material = boxmaterial; by diffusing the light on the object we can give it it's own color —we'll choose a nice familiar blue.
...add the following lines: var cylindermaterial = new pc.phongmaterial(); cylindermaterial.diffuse.set(1, 0.5
8, 0); cylindermaterial.update(); cylinder.model.model.meshinstances[0].material = cylindermaterial; cone creating a cone and its material is done in almost exacly the same way as we did for the cylinder.
Endianness - MDN Web Docs Glossary: Definitions of Web-related terms
every byte can store an
8-bit number (i.e.
...also, older mac computers using 6
8000-series and powerpc microprocessors formerly used big-endian.
... examples with the number 0x1234567
8 (i.e.
... 305 419
896 in decimal): little-endian: 0x7
8 0x56 0x34 0x12 big-endian: 0x12 0x34 0x56 0x7
8 mixed-endian (historic and very rare): 0x34 0x12 0x7
8 0x56 ...
Quality values - MDN Web Docs Glossary: Definitions of Web-related terms
examples the following syntax text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.
8 indicates the order of priority: value priority text/html and application/xhtml+xml 1.0 application/xml 0.9 */* 0.
8 if there is no priority defined for the first two values, the order in the list is irrelevant.
... nevertheless, with the same quality, more specific values have priority over less specific ones: text/html;q=0.
8,text/*;q=0.
8,*/*;q=0.
8 value priority text/html 0.
8 (but totally specified) text/* 0.
8 (partially specified) */* 0.
8 (not specified) some syntax, like the one of accept, allow additional specifiers like text/html;level=1.
... browser-specific information firefox starting with firefox 1
8, the quality factor values are clamped to 2 decimal places.
... they used to be clamped to only 1 decimal place in earlier versions (bug 67244
8).
XInclude - MDN Web Docs Glossary: Definitions of Web-related terms
tp://www.w3.org/2001/xinclude', 'include'); if (xincludes) { for (i=0; i < xincludes.length; i++) { var xinclude = xincludes[i]; var href = xinclude.getattribute('href'); var parse = xinclude.getattribute('parse'); var xpointer = xinclude.getattribute('xpointer'); var encoding = xinclude.getattribute('encoding'); // e.g., utf-
8 // "text/xml or application/xml or matches text/*+xml or application/*+xml" before encoding (then utf-
8) var accept = xinclude.getattribute('accept'); // header "accept: "+x var acceptlanguage = xinclude.getattribute('accept-language'); // "accept-language: "+x var xifallback = xinclude.getelementsbytagnamens('http://www.w3.org/2001/xinclude', 'fallback')[0]; /...
...nguage) { request.setrequestheader('accept-language', acceptlanguage); } switch (parse) { case 'text': // priority should be on media type: var contenttype = request.getresponseheader('content-type'); //text/xml; charset="utf-
8" // send to get headers first?
... // let the request be processed below } else { if (encoding === '' || encoding === null) { // encoding has no effect on xml encoding = 'utf-
8'; } request.overridemimetype('text/plain; charset='+encoding); //'x-user-defined' } responsetype = 'responsetext'; break; case null: case 'xml': responsetype = 'responsexml'; ...
... 'responsetext') { if (encname) { var encodingtype = response.match(pattern); if (encodingtype) { encodingtype = encodingtype[2]; } else { encodingtype = 'utf-
8'; } // need to make a whole new request apparently since cannot convert the encoding after receiving it (to know what the encoding was) var request2 = new xmlhttprequest(); request2.overridemimetype('text/plain; charset='+encodingtype); ...
What is accessibility? - Learn web development
in terms of statistics, the world health organization estimates that "2
85 million people are estimated to be visually impaired worldwide: 39 million are blind and 246 have low vision." (see visual impairment and blindness).
...centers for disease control and prevention disability and functioning (noninstitutionalized adults 1
8 years and over) reports the usa "percent of adults with any physical functioning difficulty: 16.1%".
... the united states centers for disease control estimate that, as of 201
8, 1 in 4 u.s.
... your country may also have specific legislation governing the need for websites serving their population to be accessible — for example en 301 549 in the eu, section 50
8 of the rehabilitation act in the us, federal ordinance on barrier-free information technology in germany, the accessibility regulations 201
8 in the uk, accessibilità in italy, the disability discrimination act in australia, etc.
Styling links - Learn web development
now let's add some more information to get this styled properly: body { width: 300px; margin: 0 auto; font-size: 1.2rem; font-family: sans-serif; } p { line-height: 1.4; } a { outline: none; text-decoration: none; padding: 2px 1px 0; } a:link { color: #265301; } a:visited { color: #437a16; } a:focus { border-bottom: 1px solid; background: #bae49
8; } a:hover { border-bottom: 1px solid; background: #cdfeaa; } a:active { background: #265301; color: #cdfeaa; } we'll also provide some sample html to apply the css to: <p>there are several browsers available, such as <a href="#">mozilla firefox</a>, <a href="#">google chrome</a>, and <a href="#">microsoft edge</a>.</p> putting the two together gives us this result: so what did we...
...tput(); }); solution.addeventlistener("click", function() { htmlinput.value = htmlcode; cssinput.value = 'p {\n font-size: 1.2rem;\n font-family: sans-serif;\n line-height: 1.4;\n}\n\na {\n outline: none;\n text-decoration: none;\n padding: 2px 1px 0;\n}\n\na:link {\n color: #265301;\n}\n\na:visited {\n color: #437a16;\n}\n\na:focus {\n border-bottom: 1px solid;\n background: #bae49
8;\n}\n\na:hover {\n border-bottom: 1px solid;\n background: #cdfeaa;\n}\n\na:active {\n background: #265301;\n color: #cdfeaa;\n}'; drawoutput(); }); htmlinput.addeventlistener("input", drawoutput); cssinput.addeventlistener("input", drawoutput); window.addeventlistener("load", drawoutput); including icons on links a common practice is to include icons on links to provide more of an i...
...let's look at a really simple example that adds an icon to external links (links that lead to other sites.) such an icon usually looks like a little arrow pointing out of a box — for this example, we'll use this great example from icons
8.com.
...> next, the css: body { width: 300px; margin: 0 auto; font-family: sans-serif; } p { line-height: 1.4; } a { outline: none; text-decoration: none; padding: 2px 1px 0; } a:link { color: blue; } a:visited { color: purple; } a:focus, a:hover { border-bottom: 1px solid; } a:active { color: red; } a[href*="http"] { background: url('https://mdn.mozillademos.org/files/129
82/external-link-52.png') no-repeat 100% 0; background-size: 16px 16px; padding-right: 19px; } so what's going on here?
How can we design for all types of users? - Learn web development
for instance, let's test the colors on this page and see how we fare in the colour contrast analyser: the luminosity contrast ratio between text and background is
8.30:1, which exceeds the minimum standard (4.5:1) and should enable many visually-impaired people to read this page.
...in this case, zooming did nothing, even as late as internet explorer
8, which we still have to cater to because it's still around.
... here is the html we're using: <!doctype html> <html lang="en"> <head> <meta charset="utf-
8"> <title>font size experiment</title> </head> <body> <h1>this is our main heading <span class="subheading">this is our subheading</span> </h1> </body> </html> a percent-based css will look like this: body { font-size:100%; } /* 100% of the browser's base font size, so in most cases this will render as 16 pixels */ h1 { font-size:200%; } /* twice the size of the body, thus ...
...let's consider this html: <!doctype html> <html lang="en"> <head> <meta charset="utf-
8"> <title>font size experiment</title> </head> <body> <div class="container"> <h1>this is our main heading <span class="subheading">this is our subheading</span> </h1> <p>[lengthly text that spans many lines]</p> </div> </body> </html> we have a div with class container.
Document and website structure - Learn web development
blind and visually impaired people represent roughly 4-5% of the world population (in 2012 there were 2
85 million such people in the world, while the total population was around 7 billion).
... <!doctype html> <html> <head> <meta charset="utf-
8"> <title>my page title</title> <link href="https://fonts.googleapis.com/css?family=open+sans+condensed:300|sonsie+one" rel="stylesheet" type="text/css"> <link rel="stylesheet" href="style.css"> <!-- the below three lines are a fix to get html5 semantic elements working in old versions of internet explorer--> <!--[if lt ie 9]> <script src="https://cdnjs.cloudflare.com/a...
...for example, imagine a shopping cart widget that you could choose to pull up at any point during your time on an e-commerce site: <div class="shopping-cart"> <h2>shopping cart</h2> <ul> <li> <p><a href=""><strong>silver earrings</strong></a>: $99.95.</p> <img src="../products/3333-09
85/thumb.png" alt="silver earrings"> </li> <li> ...
... </li> </ul> <p>total cost: $237.
89</p> </div> this isn't really an <aside>, as it doesn't necessarily relate to the main content of the page (you want it viewable from anywhere).
HTML table basics - Learn web development
tables are very commonly used in human society, and have been for a long time, as evidenced by this us census document from 1
800: it is therefore no wonder that the creators of html provided a means by which to structure and present tabular data on the web.
... name mass (1024kg) diameter (km) density (kg/m3) gravity (m/s2) length of day (hours) distance from sun (106km) mean temperature (°c) number of moons notes terrestial planets mercury 0.330 4,
879 5427 3.7 4222.6 57.9 167 0 closest to the sun venus 4.
87 12,104 5243
8.9 2
802.0 10
8.2 464 0 earth 5.97 12,756 5514 9.
8 24.0 149.6 15 1 our world mars 0.642 6,792 3933 3.7 24.7 227.9 -65 2 the red planet jovian planets gas giants jupiter 1
89
8 142,...
...9
84 1326 23.1 9.9 77
8.6 -110 67 the largest planet saturn 56
8 120,536 6
87 9.0 10.7 1433.5 -140 62 ice giants uranus
86.
8 51,11
8 1271
8.7 17.2 2
872.5 -195 27 neptune 102 49,52
8 163
8 11.0 16.1 4495.1 -200 14 dwarf planets pluto 0.0146 2,370 2095 0.7 153.3 5906.4 -225 5 declassified as a planet in 2006, but this remains controversial.
...the values for your style attribute are background-color:#dcc4
8e; border:4px solid #c1437a; the last two days are free days, so just set them to no background color but a set width; the value for the style attribute is width: 42px; see how you get on with the example.
Arrays - Learn web development
for example: let sequence = [1, 1, 2, 3, 5,
8, 13]; let random = ['tree', 795, [0, 1, 2]]; before proceeding, create a few example arrays.
...so for example: let sequence = [1, 1, 2, 3, 5,
8, 13]; for (let i = 0; i < sequence.length; i++) { console.log(sequence[i]); } you'll learn about loops properly later on (in our looping code article), but briefly, this code is saying: start looping at item number 0 in the array.
...te when the user code is being shown, // not the solution, so that solution is not saved over the user code if(solution.value === 'show solution') { userentry = textarea.value; } else { solutionentry = textarea.value; } updatecode(); }; html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 9
8%; } body { margin: 10px; background-color: #f5f9fa; } active learning: top 5 searches a good use for array methods like push() and pop() is when you are maintaining a record of currently active items in a web app.
...eady for the next term to be entered searchinput.value = ''; searchinput.focus(); } } </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 9
8%; } body { margin: 10px; background: #f5f9fa; } const textarea = document.getelementbyid('code'); const reset = document.getelementbyid('reset'); const solution = document.getelementbyid('solution'); let code = textarea.value; let userentry = textarea.value; function updatecode() { eval(textarea.value); } reset.addeventlistener('click', function() { textarea.value = code; userentry ...
Multimedia: Images - Learn web development
as of 201
8, 24% of the united kingdom still use pay-as-you-go.
... pngs can be saved with three different output combinations: 24 bit color +
8 bit transparency — offer full color acurracy and smooth transparencies at the expense of size.
...
8 bit color +
8 bit transparency — offer no more than 255 colors but maintain smooth transparencies.
...
8 bit color + 1 bit transparency — offer no more than 255 colors and just offer no or full transparency per pixel which makes the transparency borders appear hard and jagged.
Getting started with Svelte - Learn web development
label, and choosing inspect: when compiling the app, svelte changes our h1 styles definition to h1.svelte-1tky
8bj, and then modifies every <h1> element in our component to <h1 class="svelte-1tky
8bj">, so that it picks up the styles as required.
... 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 3...
...for example, here's the link for a repl running our complete app: https://svelte.dev/repl/37
8dd79e0dfe44
86a
8f10
823f3
813190?version=3.23.2.
... repl to code along with us using the repl, start at https://svelte.dev/repl/fc6
8b4f059d34b9c
84fa042d1cce5
86c?version=3.23.2 summary this brings us to the end of our initial look at svelte, including how to install it locally, create a starter app, and how the basics work.
Getting started with Vue - Learn web development
it is recommended that you specify a version number when including vue on your site so that any framework updates do not break your live site without you knowing.) <script src="/static/external/29/29296ccacaa9ed35ed16
8fc51e36f54fd6f
8db9c77
86bbf3
8cc59a27229ba5c2.svg"></script> however, this approach has some limitations.
...to use the npm package & the cli you will need: node.js
8.11+ installed.
...9
8% after emitting copyplugin done compiled successfully in 1
8121ms app running at: - local: <http://localhost:
80
80/> - network: <http://192.16
8.1.9:
80
80/> note that the development build is not optimized.
... if you navigate to the “local” address in a new browser tab (this should be something like http://localhost:
80
80 as stated above, but may vary based on your setup), you should see your app.
Handling common HTML and CSS problems - Learn web development
you can still refer to them by their names, and style them with css, for example — you just need to make sure they are behaving as you want them to, for example setting display: block; on all of the new semantic elements (such as <article>, <aside>, etc.), but only in old versions of ie that don't recognise them (so, ie
8 and lower).
...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.
... put the following code into the head of your html document, just before the opening <style> tag: <script type="text/javascript" src="mootools-core-1.6.0.js"></script> <!--[if (gte ie 6)&(lte ie
8)]> <script type="text/javascript" src="selectivizr-min.js"></script> <![endif]--> if you try running this in an old version of ie, it should work fine.
...media queries are not supported in ie
8 or less, so if you want to use a mobile first layout and have the desktop layout then apply to old ie versions, you'll have to apply a media query polyfill to your page, like css3-mediaqueries-js, or respond.js.
Links and Resources
guidelines & standards information and resources on section 50
8 - legal policy for us government purchases requiring software accessibility.
... cynthia says™ from hisoftware® company "cynthia says™" is a free online webpage accessibility validation service that identifies accessibility errors in webpage related to section 50
8 standards and/or the wcag guidelines.
... wave 3.0 (web accessibility versatile evaluator) from webaim and sponsored by temple university institute on disabilities wave 3.0 is another powerful, mature, free online webpage accessibility validation service that identifies accessibility errors and reports accessibility warnings about webpage related to section 50
8 standards and/or the wcag guidelines.
...it can also report accessibility errors and warnings according to selectable accessibility guidelines (section 50
8, wcag priorities 1, 2 or 3).
Creating a spell check dictionary add-on
> <em:version>version number</em:version> <em:type>64</em:type> <em:unpack>true</em:unpack> <em:name>name</em:name> <!-- other install.rdf metadata such as em:localized, em:description, em:creator, em:developer, em:translator, em:contributor or em:homepageurl --> <!-- firefox --> <em:targetapplication> <description> <em:id>{ec
8030f7-c20a-464f-9b0e-13a3a9e973
84}</em:id> <em:minversion>1
8.0a1</em:minversion> <em:maxversion>46.0</em:maxversion> </description> </em:targetapplication> <!-- thunderbird --> <em:targetapplication> <description> <em:id>{3550f703-e5
82-4d05-9a0
8-453d09bdfdc6}</em:id> <em:minversion>1
8.0a1</em:minversion> <em:maxversion>22.
...0</em:maxversion> </description> </em:targetapplication> <!-- seamonkey --> <em:targetapplication> <description> <em:id>{92650c4d-4b
8e-4d2a-b7eb-24ecf4f6b63a}</em:id> <em:minversion>2.15a1</em:minversion> <em:maxversion>2.49</em:maxversion> </description> </em:targetapplication> </description> </rdf> there are some rules about how you should adapt the install.rdf file: if you are creating a new dictionary add-on, we recommend that the em:id consists of your locale code followed by @dictionaries.addons.mozilla.org, but if there is more than one dictionary for your language (for example the german "old spelling" versus "new spelling" dictionaries), you may need to choose another id, that follows the rules of em:id.
... although the restartless format for dictionary add-ons were introduced in gecko 10, dictionary updates only works starting from gecko 1
8.
...if you set em:minversion to a lower value, gecko 10-17 will not be able to update your dictionary add-on once the restartless dictionary is installed (bug 7
8211
8), and gecko 10-16 may warn the user that your dictionary is not compatible, when users try to update to a newer version of firefox/thunderbird (bug 7
82115).
How Mozilla's build system works
finished reading 1096 moz.build files into 1276 descriptors in 2.40s backend executed in 2.39s 21
88 total backend files.
... 0 created; 1 updated; 21
87 unchanged total wall time: 5.03s; cpu time: 3.79s; efficiency: 75% what this is saying is that a total of 1,096 moz.build files were read.
...the 1,276 data structures were fed into the build backend, which then determined it had to manage 2,1
88 files derived from those data structures.
... original document information author: brian ryner copyright information: portions of this content are © 199
8–2006 by individual mozilla.org contributors; content available under a creative commons license ...
Index
rust code first shipped in august 2016 with the release of firefox 4
8.
...
8 experimental features in firefox experimental, firefox, preferences, features this page lists features that are in nightly versions of firefox along with information on how to activate them, if necessary.
... 141 index firefox, index, mozilla found 16
8 pages: 142 linux compatibility matrix the following table lists the available library versions for the mozilla.org-distributed firefox builds dependencies, and/or to build firefox.
... 16
8 performance best practices for firefox front-end engineers best practices, developing firefox, developing mozilla, firefox, front-end, mozilla, performance this guide will help firefox developers working on front-end code produce code which is as performant as possible—not just on its own, but in terms of its impact on other parts of firefox.
Limitations of chrome scripts
we're working on fixing this issue in bug 111
8880.
... there is an outstanding bug (bug 110
8827) to implement a shim here that will make notificationcallbacks a cpow for the objects in the content process.
...fy-request") { var httpchannel = subject.queryinterface(ci.nsihttpchannel); var loadcontext = httpchannel.notificationcallbacks.getinterface(ci.nsiloadcontext); // topframeelement is the <browser> element var topframeelement = loadcontext.topframeelement; var browsermm = topframeelement.messagemanager; console.log("browsermm: " + browsermm); } } however, before firefox 3
8, this technique will not work if multiprocess firefox is disabled: specifically, topframeelement will be null.
... this means that if you need to write code that works before firefox 3
8 and on both multiprocess and non-multiprocess variants, you need to implement both paths: test whether topframeelement is null if it is, you're running in single-process firefox, and should use the old way if it isn't, you're running in multiprocess firefox and should use the new way from firefox 3
8 onwards, the topframeelement approach always works.
Gecko Keypress Event
gecko 1.9 key handling changed significantly after beta 5 (bug 35963
8, bug 429510 and the bugs on which they depend).
... charcode of dom keypress event if a keypress event is fired without any modifier keys (ctrl/alt(option)/meta(win/command)), then the properties of the event are the same as they were in gecko1.
8.1.
... (bug 35963
8 partially addressed this issue by trying both characters on the key, but bug 303192 would provide a complete solution.) solution the following rules apply: key handlers should be provided with information about all the possible meanings of the event.
...see bug 3065
85).
How to implement a custom autocomplete search component
const ci = components.interfaces; const cu = components.utils; cu.import('resource://gre/modules/xpcomutils.jsm'); const class_id = components.id('x753d
830-ba1e-11e0-962b-0
800200c9a66'); // ← change this const class_name = "basic autocomplete"; const contract_id = '@mozilla.org/autocomplete/search;1?name=basic-autocomplete'; /** * @constructor * * @implements {nsiautocompleteresult} * * @param {string} searchstring * @param {number} searchresult * @param {number} defaultindex * @param {string} errordescription * @param {array.<string>}...
...to do so put the following declaration in your chrome.manifest file: component {x753d
830-ba1e-11e0-962b-0
800200c9a66} components/basic_autocomplete.js contract @mozilla.org/autocomplete/search;1?name=basic-autocomplete {x753d
830-ba1e-11e0-962b-0
800200c9a66} and finally use this newly available component in a xul file like this: <textbox id="text1" type="autocomplete" autocompletesearch="basic-autocomplete"/> that's it!
... const ci = components.interfaces; const class_id = components.id("6224daa1-71x2-4d1a-ad90-01ca1c0
8e323"); // ← change this const class_name = "simple autocomplete"; const contract_id = "@mozilla.org/autocomplete/search;1?name=simple-autocomplete"; // implements nsiautocompleteresult function simpleautocompleteresult(searchstring, searchresult, defaultindex, errordescription, results, comments) { this._searchstring = searc...
...unction: function nsgetfactory(cid) { if (cid.tostring().touppercase() != class_id.tostring().touppercase()) { throw components.results.ns_error_factory_not_registered; } return simpleautocompletesearchfactory; } you need to explicitly register the component by adding these lines into your chrome.manifest file: component {6224daa1-71x2-4d1a-ad90-01ca1c0
8e323} components/.js contract @mozilla.org/autocomplete/search;1?name=simple-autocomplete {6224daa1-71x2-4d1a-ad90-01ca1c0
8e323} you need to add the following method: getlabelat: function(index) { return this._results[index]; } to simpleautocompleteresult use this newly available component in a xul file like this: <textbox id="text1" type="autocomplete" auto...
OS.File.Info
| does not represent anything } else { // some other error } } ) example: determining the owner of a file let promise = os.file.stat() promise.then( function onsuccess(info) { if ("unixowner" in info) { // info.unixowner holds the owner of the file } else { // information is not available on this platform } } ); evolution of this example bug
802534 will introduce the ability to check whether field unixowner appears in os.file.info.prototype, which will make it possible to write faster code.
...(as of firefox 3
8 this is always true on all systems, this is a bug: bugzilla 1145
885) (on windows this returns false for hard links) size the number of bytes in the file.
... creationdate deprecated in bugzilla :: bug
807
875.
...(as of firefox 3
8 this attribute is not found, see screen shots below, bugzilla :: bug 1156060) screenshot of info object in variable viewer macosx 10.10.1 ubuntu 14.04.1 windows
8.1 see also os.file.directoryiterator.entry ...
Index
8 localization and plurals internationalization, localization you're likely here because you're localizing a .properties file and it had a link to this page.
... 1
8 localization technical reviews guide, localization, mozilla this guide provides details on what a localization technical review is, what criteria are used for the technical reviews, and the process for requesting one and following its progress.
... 2
8 mozilla l10n style guide localization cultural references, idioms, and slang require a full understanding of these references between the cultures of your source and target languages.
... 3
8 localization formats there are 4 main approaches to web l10n with regards to the choice of technology used for localization logic: 39 setting up the infrastructure apache, infrastructure, localization, php, svn, unix first, make your project's file type decision (see localization formats for details): 40 what every mozilla translator should know ...
Extras
rt> <mpadded width="30px" height="15px" depth="15px" voffset="-15px"> <mtext> <svg width="30px" height="30px"> <defs> <radialgradient id="radgrad1" cx="50%" cy="50%" r="50%" fx="50%" fy="50%"> <stop offset="0%" style="stop-color:rgb(255,255,255); stop-opacity:1;"/> <stop offset="100%" style="stop-color:rgb(255,0,0); stop-opacity:.
8;"/> </radialgradient> </defs> <g transform="translate(15,15)"> <g> <animatetransform attributename="transform" attributetype="xml" type="rotate" from="360" to="0" dur="15s" repeatcount="indefinite"/> <g transform="translate(-15, -15)"> <path fill="url(#radgrad1)" d="m 15 0 l 20 10...
...="0%" y1="0%" x2="0%" y2="100%"> <stop offset="0%" style="stop-color:rgb(255,0,0);stop-opacity:1"/> <stop offset="100%" style="stop-color:rgb(255,255,0);stop-opacity:1"/> </lineargradient> <radialgradient id="grad3" cx="50%" cy="50%" r="50%" fx="50%" fy="50%"> <stop offset="0%" style="stop-color:rgb(0,255,255);stop-opacity:1"/> <stop offset="100%" style="stop-color:rgb(255,255,255);stop-opacity:.
8"/> </radialgradient> </defs> <rect width="300" height="250" fill="url(#grad1)"/> <g transform="translate(150,125)"> <g> <animatetransform attributename="transform" attributetype="xml" type="rotate" from="0" to="360" dur="6s" repeatcount="indefinite"/> <g transform="translate(-50,-35)"> <rect width="100" height="70" fill="url(#grad2)"/> <switc...
...h> <foreignobject width="100" height="70" requiredextensions="http://www.w3.org/199
8/math/mathml"> <math display="block"> <mrow> <mo>(</mo> <mtable> <mtr> <mtd><mi>cos</mi><mi>θ</mi></mtd> <mtd><mo>−</mo><mi>sin</mi><mi>θ</mi></mtd> </mtr> <mtr> <mtd><mi>sin</mi><mi>θ</mi></mtd> <mtd><mi>cos</mi><mi>θ</mi></mtd> </mtr> </mtable> <mo>)</mo> </mrow> </math> </foreignobject> <text>rotation matrix</text> </switch> </g></g></g> <g> <animatemotion path="m 32,69 c 64,121 100,27 152,42 203,56 239,257 275,161 295,109 144,221
88,214 -2,202 11,35 32,69 z" begin="0s" dur="20s" repeatcount="indefinite"/> <animatetransform attributename="transform" attributetype="xml" type="scale" values="1;2;.5;1" keytimes="0;.25;.
...75;1" dur="20s" repeatcount="indefinite"/> <circle fill="url(#grad3)" r="30"/> <g transform="translate(-30,-30)"> <switch> <foreignobject width="60" height="60" requiredextensions="http://www.w3.org/199
8/math/mathml"> <math display="block"> <mrow> <munderover> <mo>∑</mo> <mrow> <mi>n</mi> <mo>=</mo> <mn>0</mn> </mrow> <mrow> <mo>+</mo> <mi>∞</mi> </mrow> </munderover> <mfrac> <msup> <mi>α</mi> <mi>n</mi> </msup> <mrow> <mi>n</mi> <mo>!</mo> </mrow> </mfrac> </mrow> </math> </foreignobject> <text>exp(α)</text> </switch> </g> </g> </svg> </div> inline javascript html content <math display="block"> <mfrac> <mtext id="num">mouse</mtext> <mtext id="denum">over</mtext> </mfrac> </math> javascript content function whoistherealert(evt) { alert("who is there?"); } f...
Activity Monitor, Battery Status Menu and top
after 5–10 seconds, the "average energy impact" column is populated with values and the title bar changes to "activity monitor (applications in last
8 hours)".
...tests indicate that it is almost certainly using the same "energy impact" formula to compute the "average energy impact", using measurements from the past
8 hours of wake time (i.e.
...it is clear, however, that the window used by the battery status menu is measured in seconds or minutes, which is much less than the
8 hour window used for “average energy impact” in activity monitor.
... pid command %cpu idlew power 50300 firefox 12.9 27
8 26.6 76256 plugin-container 3.4 159 11.3 151 coreaudiod 0.9 6
8 4.3 76505 top 1.5 1 1.6 76354 activity monitor 1.0 0 1.0 the pid, command and %cpu columns are self-explanatory.
Profiling with the Firefox Profiler
custom annotations in bug 133421
8 an annotation was added to presshell::paint to show the url of the document being painted.
...for example:in the results above we can see that we're spending ~2
87 milliseconds in startup::xre_initchildprocess, 194 ms of which are spent in pvsync::msg_notify and all child functions that it calls.
...if you want 90mb use 10000000, and 20000000 for 1
80mb, which are good values to debug long startups.
... access cleopatra from your web browser by loading the page localhost:
8000, and upload run.symb.cleo to render the profile with most of the symbol information.
4.3 Release Notes
release date: 01 april 2009 introduction network security services for java (jss) 4.3 is a minor release with the following new features: sqlite-based shareable certificate and key databases libpkix: an rfc 32
80 compliant certificate path validation library pkcs11 needslogin method support hmacsha256, hmacsha3
84, and hmacsha512 support for all nss 3.12 initialization options jss 4.3 is tri-licensed under mpl 1.1/gpl 2.0/lgpl 2.1.
... libpkix: an rfc 32
80 compliant certificate path validation library (see pkixverify) pk11token.needslogin method (see needslogin) support hmacsha256, hmacsha3
84, and hmacsha512 (see hmactest.java) support for all nss 3.12 initialization options (see initializationvalues) new ssl error codes (see http://mxr.mozilla.org/security/sour...util/sslerrs.h) ssl_error_unsupported_extension_alert ssl_error_certif...
...icate_unobtainable_alert ssl_error_unrecognized_name_alert ssl_error_bad_cert_status_response_alert ssl_error_bad_cert_hash_value_alert new tls cipher suites (see http://mxr.mozilla.org/security/sour...sslsocket.java): tls_rsa_with_camellia_12
8_cbc_sha tls_dhe_dss_with_camellia_12
8_cbc_sha tls_dhe_rsa_with_camellia_12
8_cbc_sha tls_rsa_with_camellia_256_cbc_sha tls_dhe_dss_with_camellia_256_cbc_sha tls_dhe_rsa_with_camellia_256_cbc_sha note: the following tls cipher suites are declared but are not yet implemented: tls_dh_dss_with_camellia_12
8_cbc_sha tls_dh_rsa_with_camellia_12
8_cbc_sha tls_dh_anon_with_camellia_12
8_cbc_sha tls_dh_dss_with_camellia_256_cbc_sha tls_dh_rsa_with_camellia_256_cbc_sha tls_dh_anon_with_cam...
...ellia_256_cbc_sha tls_ecdh_anon_with_null_sha tls_ecdh_anon_with_rc4_12
8_sha tls_ecdh_anon_with_3des_ede_cbc_sha tls_ecdh_anon_with_aes_12
8_cbc_sha tls_ecdh_anon_with_aes_256_cbc_sha distribution information jss is checked into mozilla/security/jss/.
NSS 3.14.1 release notes
bug
812399 - in nss 3.14, a regression caused bug 641052 / cve-2011-3640 to be re-introduced under certain situations.
... bug
802429 - in previous versions of nss, the "cipherorder" slot configuration flag was not respected, causing the most recently added slot that supported the requested pkcs#11 mechanism to be used instead.
... bug
802429 - the nss softoken is now the default token for sha-256 and sha-512.
... bug
8105
82 - tls false start is now only used with servers that negotiate a cipher suite that supports forward secrecy.
NSS 3.15 release notes
for more details of the issues with secitem_reallocitem, see bug 29
8649 and bug 29
893
8.
... bug
8532
85: fixed bugs in aes gcm.
... dropped (32-bit) sparc v
8 processor support on solaris.
... bugs fixed in nss 3.15 this bugzilla query returns all the bugs fixed in nss 3.15: https://bugzilla.mozilla.org/buglist.cgi?list_id=627
8317&resolution=fixed&classification=components&query_format=advanced&product=nss&target_milestone=3.15 ...
NSS 3.16 release notes
new macros in sslproto.h tls_rsa_with_rc4_12
8_sha, tls_rsa_with_3des_ede_cbc_sha, etc.
... bug 903
885: (cve-2014-1492) in a wildcard certificate, the wildcard character should not be embedded within the u-label of an internationalized domain name.
... bug 9
81170: aeskeywrap_decrypt should not return secsuccess for invalid keys.
... bug 9560
82: if the nss_sdb_use_cache environment variable is set, skip the runtime test sdb_measureaccess.
NSS 3.19.2 release notes
nss 3.19.2 requires nspr 4.10.
8 or newer.
... notable changes in nss 3.19.2 bug 117212
8 - in nss 3.19.1, the minimum key sizes that the freebl cryptographic implementation (part of the softoken cryptographic module used by default by nss) was willing to generate or use was increased - for rsa keys, to 512 bits, and for dh keys, 1023 bits.
... this was done as part of a security fix for bug 113
8554 / cve-2015-4000.
...the fix for bug 113
8554 has been moved to libssl, and will now only affect the minimum keystrengths used in ssl/tls.
NSS 3.19.3 release notes
nss 3.19.3 requires nspr 4.10.
8 or newer.
... notable changes in nss 3.19.3 the following ca certificates were removed cn = buypass class 3 ca 1 sha1 fingerprint: 61:57:3a:11:df:0e:d
8:7e:d5:92:65:22:ea:d0:56:d7:44:b3:23:71 cn = tÜrktrust elektronik sertifika hizmet sağlayıcısı sha1 fingerprint: 79:9
8:a3:0
8:e1:4d:65:
85:e6:c2:1e:15:3a:71:9f:ba:5a:d3:4a:d9 cn = sg trust services racine sha1 fingerprint: 0c:62:
8f:5c:55:70:b1:c9:57:fa:fd:3
8:3f:b0:3d:7b:7d:d7:b9:c6 cn = tc trustcenter universal ca i sha-1 fingerp...
...rint: 6b:2f:34:ad:
89:5
8:be:62:fd:b0:6b:5c:ce:bb:9d:d9:4f:4e:39:f3 cn = tc trustcenter class 2 ca ii sha-1 fingerprint: ae:50:
83:ed:7c:f4:5c:bc:
8f:61:c6:21:fe:6
8:5d:79:42:21:15:6e the following ca certificate had the websites trust bit turned off cn = comsign secured ca sha1 fingerprint: f9:cd:0e:2c:da:76:24:c1:
8f:bd:f0:f0:ab:b6:45:b
8:f7:fe:d5:7a the following ca certificates were added cn = tÜrktrust elektronik sertifika hizmet sağlayıcısı h5 sha1 fingerprint: c4:1
8:f6:4d:46:d1:df:00:3d:27:30:13:72:43:a9:12:11:c6:75:fb cn = tÜrktrust elektronik sertifika hizmet sağlayıcısı h6 sha1 fingerprint:
8a:5c:
8c:ee:a5:03:e6:05:56:ba:d
8:1b:d4:f6:c9:b0:ed:e5:2f:e0 cn = certi...
...nomis - root ca sha1 fingerprint: 9d:70:bb:01:a5:a4:a0:1
8:11:2e:f7:1c:01:b9:32:c5:34:e7:
88:a
8 the version number of the updated root ca list has been set to 2.5 bugs fixed in nss 3.19.3 this bugzilla query returns all the bugs fixed in nss 3.19.3: https://bugzilla.mozilla.org/buglist.cgi?resolution=fixed&classification=components&query_format=advanced&product=nss&target_milestone=3.19.3 compatibility nss 3.19.3 shared libraries are backward compatible with all older nss 3.19 shared libraries.
NSS 3.22 release notes
pseudorandom functions based on hashes other than sha-1 are now supported with pbkdf (bug 554
827).
... pk11_createpbev2algorithmid() now supports sec_oid_pkcs5_pbkdf2 with cipheralgtag and prfalgtag set to sec_oid_hmac_sha256, sec_oid_hmac_sha224, sec_oid_hmac_sha3
84, or sec_oid_hmac_sha512.
... in ssl.h ssl_peersignedcerttimestamps - get signed_certificate_timestamp tls extension data ssl_setsignedcerttimestamps - set signed_certificate_timestamp tls extension data new types in secoidt.h the following are added to secoidtag: sec_oid_aes_12
8_gcm sec_oid_aes_192_gcm sec_oid_aes_256_gcm sec_oid_idea_cbc sec_oid_rc2_40_cbc sec_oid_des_40_cbc sec_oid_rc4_40 sec_oid_rc4_56 sec_oid_null_cipher sec_oid_hmac_md5 sec_oid_tls_rsa sec_oid_tls_dhe_rsa sec_oid_tls_dhe_dss sec_oid_tls_dh_rsa sec_oid_tls_dh_dss sec_oid_tls_dh_anon sec_oid_tls_ecdhe_ecdsa sec_oid_tl...
...ion_min_policy nss_tls_version_max_policy nss_dtls_version_min_policy nss_dtls_version_max_policy in pkcs11t.h ckp_pkcs5_pbkd2_hmac_gostr3411 - prf based on hmac with gostr3411 for pbkdf (not supported) ckp_pkcs5_pbkd2_hmac_sha224 - prf based on hmac with sha-224 for pbkdf ckp_pkcs5_pbkd2_hmac_sha256 - prf based on hmac with sha-256 for pbkdf ckp_pkcs5_pbkd2_hmac_sha3
84 - prf based on hmac with sha-256 for pbkdf ckp_pkcs5_pbkd2_hmac_sha512 - prf based on hmac with sha-256 for pbkdf ckp_pkcs5_pbkd2_hmac_sha512_224 - prf based on hmac with sha-512 truncated to 224 bits for pbkdf (not supported) ckp_pkcs5_pbkd2_hmac_sha512_256 - prf based on hmac with sha-512 truncated to 256 bits for pbkdf (not supported) in secoidt.h nss_use_alg_in_ssl ns...
NSS 3.25 release notes
added support for tls 1.2 ciphersuites that use sha3
84 as the prf.
... the trusted ca certificate list has been updated to version 2.
8.
... the following ca certificate was removed cn = sonera class1 ca sha-256 fingerprint: cd:
80:
82:
84:cf:74:6f:f2:fd:6e:b5:
8a:a1:d5:9c:4a:d4:b3:ca:56:fd:c6:27:4a:
89:26:a7:
83:5f:32:31:3d the following ca certificates were added cn = hellenic academic and research institutions rootca 2015 sha-256 fingerprint: a0:40:92:9a:02:ce:53:b4:ac:f4:f2:ff:c6:9
8:1c:e4:49:6f:75:5e:6d:45:fe:0b:2a:69:2b:cd:52:52:3f:36 cn = hellenic academic and research institutions ecc rootca 2015 sha-256 fingerprint: 44:b5:45:aa:
8a:25:e6:5a:73:ca:15:dc:27:fc:36:d2:4c:1c:b9:95:3a:06:65:39:b1:15:
82:dc:4
8:7b:4
8:33 cn = certplus root ca g1 sha-256 fingerprint: 15:2a:40:2b:fc:df:2c:d5:4
8:05:4d:22:75:b3:9c:7f:ca:3e:c0:97:
80:7
8:b0:f0:ea:76:e5:...
...61:a6:c7:43:3e cn = certplus root ca g2 sha-256 fingerprint: 6c:c0:50:41:e6:44:5e:74:69:6c:4c:fb:c9:f
8:0f:54:3b:7e:ab:bb:44:b4:ce:6f:7
8:7c:6a:99:71:c4:2f:17 cn = opentrust root ca g1 sha-256 fingerprint: 56:c7:71:2
8:d9:
8c:1
8:d9:1b:4c:fd:ff:bc:25:ee:91:03:d4:75:
8e:a2:ab:ad:
82:6a:90:f3:45:7d:46:0e:b4 cn = opentrust root ca g2 sha-256 fingerprint: 27:99:5
8:29:fe:6a:75:15:c1:bf:e
8:4
8:f9:c4:76:1d:b1:6c:22:59:29:25:7b:f4:0d:0
8:94:f2:9e:a
8:ba:f2 cn = opentrust root ca g3 sha-256 fingerprint: b7:c3:62:31:70:6e:
81:07:
8c:36:7c:b
8:96:19:
8f:1e:32:0
8:dd:92:69:49:dd:
8f:57:09:a4:10:f7:5b:62:92 bugs fixed in nss 3.25 this bugzilla query returns all the bugs fixed in nss 3.25: https://bugzilla.mozilla.o...
NSS 3.39 release notes
notable changes in nss 3.39 the tls 1.3 implementation uses the final version number from rfc
8446.
... the following ca certificates were added: ou = globalsign root ca - r6 sha-256 fingerprint: 2cabeafe37d06ca22aba7391c0033d259
82952c453647349763a3ab5ad6ccf69 cn = oiste wisekey global root gc ca sha-256 fingerprint:
8560f91c3624daba9570b5fea0dbe36ff11a
8323be94
86
854fb3f34a557119
8d the following ca certificate was removed: cn = comsign sha-256 fingerprint: ae4457b40d9eda96677b0d3c92d57b5177abd7ac103795
8356d1e09451
8be5f2 the following ca certificates had the...
... websites trust bit disabled: cn = certplus root ca g1 sha-256 fingerprint: 152a402bfcdf2cd54
8054d2275b39c7fca3ec097
807
8b0f0ea76e561a6c7433e cn = certplus root ca g2 sha-256 fingerprint: 6cc05041e6445e74696c4cfbc9f
80f543b7eabbb44b4ce6f7
87c6a9971c42f17 cn = opentrust root ca g1 sha-256 fingerprint: 56c7712
8d9
8c1
8d91b4cfdffbc25ee9103d475
8ea2abad
826a90f3457d460eb4 cn = opentrust root ca g2 sha-256 fingerprint: 27995
829fe6a7515c1bfe
84
8f9c4761db16c225929257bf40d0
894f29ea
8baf2 cn = opentrust root ca g3 sha-256 fingerprint: b7c36231706e
8107
8c367cb
89619
8f1e320
8dd926949dd
8f5709a410f75b6292 bugs fixed in nss 3.39 bug 14
8312
8 - nss responded to an sslv2-compatible clienthello with...
... a serverhello that had an all-zero random (cve-201
8-123
84) this bugzilla query returns all the bugs fixed in nss 3.39: https://bugzilla.mozilla.org/buglist.cgi?resolution=fixed&classification=components&query_format=advanced&product=nss&target_milestone=3.39 compatibility nss 3.39 shared libraries are backward compatible with all older nss 3.x shared libraries.
NSS 3.50 release notes
added nist sp
800-10
8 kbkdf - pkcs#11 implementation.
... bugs fixed in nss 3.50 bug 1599514 - update dtls 1.3 implementation to draft-30 bug 160343
8 - fix native tools build failure due to lack of zlib include dir if external bug 1599603 - nist sp
800-10
8 kbkdf - pkcs#11 implementation bug 1606992 - cache the most recent pbkdf1 password hash, to speed up repeated sdr operations, important with the increased kdf iteration counts.
... nss 3.49.1 sped up pbkdf2 operations, though pbkdf1 operations are also relevant for older nss databases (also included in nss 3.49.2) bug 160
8895 - gyp builds on taskcluster broken by setuptools v45.0.0 (for lacking python3) bug 1574643 - upgrade hacl* verified implementations of chacha20, poly1305, and 64-bit curve25519 bug 160
8327 - two problems with neon-specific code in freebl bug 1575
843 - detect aarch64 cpu features on freebsd bug 1607099 - remove the buildbot configuration bug 15
85429 - add more hkdf test vectors bug 1573911 - add more rsa test vectors bug 1605314 - compare all
8 bytes of an mp_digit when clamping in windows assembly/mp_comba bug 1604596 - update wycheproof vectors and add support for cbc, p256-ecdh, and cmac tests bug 160
8493 - use aes-ni for non-gcm aes...
... bug 1547639 - update zlib in nss to 1.2.11 bug 16091
81 - detect arm (32-bit) cpu features on freebsd bug 16023
86 - fix build on freebsd/powerpc* bug 160
8151 - introduce nss_disable_altivec bug 1612623 - depend on nspr 4.25 bug 1609673 - fix a crash when nss is compiled without libnssdbm support, but the nssdbm shared object is available anyway.
NSS 3.51 release notes
see bug 160
8892 for details.
... bugs fixed in nss 3.51 bug 160
8892 - update dtls 1.3 implementation to draft-34.
... bug 1611209 - correct swapped pkcs11 values of ckm_aes_cmac and ckm_aes_cmac_general bug 1612259 - complete integration of wycheproof ecdh test cases bug 16141
83 - check if ppc __has_include(<sys/auxv.h>) bug 16147
86 - fix a compilation error for ‘getfipsenv’ "defined but not used" bug 161520
8 - send dtls version numbers in dtls 1.3 supported_versions extension to avoid an incompatibility.
... bug 153
89
80 - secu_readderfromfile calls strstr on a string that isn't guaranteed to be null-terminated bug 1561337 - correct a warning for comparison of integers of different signs: 'int' and 'unsigned long' in security/nss/lib/freebl/ecl/ecp_25519.c:
88 bug 1609751 - add test for mp_int clamping bug 15
82169 - don't attempt to read the fips_enabled flag on the machine unless nss was built with fips enabled bug 1431940 - fix a null pointer dereference in blake2b_update bug 16173
87 - fix compiler warning in secsign.c bug 161
8400 - fix a openbsd/arm64 compilation error: unused variable 'getauxval' bug 16106
87 - fix a crash on unaligned cmaccontext.aes.keyschedule when using aes-ni intrinsics this bugzilla query returns all the bugs fixed in nss 3.51: https://bugzilla.mozilla.org...
Release notes for recent versions of NSS
(nss 3.56 release notes) the current esr releases of nss are 3.44.4 (nss 3.44.4 release notes), intended for firefox esr 6
8, which was released on 19 may 2020, and 3.53.1 (nss 3.53.1 release notes), intended for firefox esr 7
8, which was released on 16 june 2020.
... past releases nss 3.56 release notes nss 3.55 release notes nss 3.54 release notes nss 3.53.1 release notes nss 3.53 release notes nss 3.52.1 release notes nss 3.44.4 release notes nss 3.52 release notes nss 3.51.1 release notes nss 3.51 release notes nss 3.50 release notes nss 3.49.2 release notes nss 3.49.1 release notes nss 3.49 release notes nss 3.4
8.1 release notes nss 3.4
8 release notes nss 3.47.1 release notes nss 3.47 release notes nss 3.46.1 release notes nss 3.46 release notes nss 3.45 release notes nss 3.44.3 release notes nss 3.44.2 release notes nss 3.44.1 release notes nss 3.44 release notes nss 3.43 release notes nss 3.42.1 release notes nss 3.42 release notes nss 3.36.
8 release notes nss 3.36.7 release notes nss 3.41 release notes nss 3.40...
....1 release notes nss 3.36.6 release notes nss 3.40 release notes nss 3.39 release notes nss 3.3
8 release notes nss 3.37.3 release notes nss 3.37.1 release notes nss 3.37 release notes nss 3.36.5 release notes nss 3.36.4 release notes nss 3.36.2 release notes nss 3.36.1 release notes nss 3.36 release notes nss 3.35 release notes nss 3.34.1 release notes nss 3.34 release notes nss 3.33 release notes nss 3.32 release notes nss 3.31.1 release notes nss 3.31 release notes nss 3.30.2 release notes nss 3.30.1 release notes nss 3.30 release notes nss 3.29.5 release notes nss 3.29.3 release notes nss 3.29.2 release notes nss 3.29.1 release notes nss 3.29 release notes nss 3.2
8.5 release notes nss 3.2
8.4 release notes nss 3.2
8.3 release notes nss 3.2
8.2 release notes n...
...ss 3.2
8.1 release notes nss 3.2
8 release notes nss 3.27.2 release notes nss 3.27.1 release notes nss 3.27 release notes nss 3.26.2 release notes nss 3.26 release notes nss 3.25.1 release notes nss 3.25 release notes nss 3.24 release notes nss 3.23 release notes nss 3.22.2 release notes nss 3.22.1 release notes nss 3.22 release notes nss 3.21.4 release notes nss 3.21.3 release notes nss 3.21.2 release notes nss 3.21.1 release notes nss 3.21 release notes nss 3.20.1 release notes nss 3.20 release notes nss 3.19.3 release notes nss 3.19.2 release notes nss 3.19.1 release notes nss 3.19 release notes nss 3.1
8.1 release notes nss 3.1
8 release notes nss 3.17.4 release notes nss 3.17.3 release notes nss 3.17.2 release notes nss 3.17.1 release notes nss 3.17 release n...
Enc Dec MAC Output Public Key as CSR
*/ /* nspr headers */ #include #include #include #include #include #include #include /* nss headers */ #include #include #include #include #include #include #include #include #include #include #include #include /* our samples utilities */ #include "util.h" #define buffersize
80 #define digestsize 16 #define ptext_mac_buffer_size 96 #define ciphersize 96 #define blocksize 32 #define default_key_bits 1024 #define cipher_header "-----begin cipher-----" #define cipher_trailer "-----end cipher-----" #define enckey_header "-----begin wrapped enckey-----" #define enckey_trailer "-----end wrapped enckey----...
...enckeyitem, ckm_aes_cbc, cka_encrypt, 0); if (enckey == null) { pr_fprintf(pr_stderr, "can't unwrap the encryption key\n"); rv = secfailure; goto cleanup; } /* ckm_md5_hmac or ckm_extract_key_from_key */ mackey = pk11_pubunwrapsymkey(privkey, &wrappedmackeyitem, ckm_md5_hmac, cka_sign, 160/
8); if (mackey == null) { pr_fprintf(pr_stderr, "can't unwrap the mac key\n"); rv = secfailure; goto cleanup; } /* open the input file.
...*/ enckey = generatesymkey(slot, ckm_aes_key_gen, 12
8/
8, &enckeyid, pwdata); if (enckey == null) { pr_fprintf(pr_stderr, "generatesymkey for aes returned null.\n"); rv = secfailure; goto cleanup; } /* generate a second key to use for macing, also a token object.
... */ mackey = generatesymkey(slot, ckm_generic_secret_key_gen, 160/
8, &mackeyid, pwdata); if (mackey == null) { pr_fprintf(pr_stderr, "generatesymkey for macing returned null.\n"); rv = secfailure; goto cleanup; } /* wrap encrypt key */ rv = wrapkey(enckey, pubkey, &wrappedenckey); if (rv != secsuccess) { pr_fprintf(pr_stderr, "error while wrapping encrypt key\n"); goto cleanup; } /* wrap mac key */ rv = wrapkey(mackey, pubkey, &wrappedmackey); if (rv != secsuccess) { pr_fprintf(pr_stderr, "error while wrapping mac key\n"); goto cleanup; } if (noisefilename) { rv = seedfromnoisefile(noisefilename); if (rv != secsuccess) { port_seterror(pr_end_of_file_error); ...
nss tech note6
nss .chk files for the fips 140 mode nss technical note: 6 in nss 3.
8, we added checksum files required for the nss softoken to operate in fips 140 mode.
... the following applies to nss 3.
8 through 3.10 : on 32-bit solaris sparc (i.e., not x
86, and not 64-bit sparc) and 32-bit hp-ux pa-risc (i.e., not itanium, and not 64-bit pa-risc), there are two more .chk files: libfreebl_pure32_3.chk and libfreebl_hybrid_3.chk.
...on 32-bit solaris x
86, 64-bit solaris x64 (amd64), 32-bit linux x
86, 64-bit linux x
86-64, 32-bit aix and 64-bit aix, this shared library is called libfreebl3.so, and the corresponding .chk file is called libfreebl3.chk .
... on the 32-bit solaris sparc architecture, there are 3 freebl libraries : libfreebl_32int64_3.so for ultrasparc t1 cpus, with a corresponding libfreebl_32int64_3.chk libfreebl_32fpu_3.so for other ultrasparc cpus, with a corresponding libfreebl_32fpu_3.chk libfreebl_32int_3.so for sparc v
8 cpus, with a corresponding libfreebl_32int_3.chk on the 64-bit solaris sparc architecture, there are 2 freebl libraries : libfreebl_64int_3.so for ultrasparc t1 cpus, with a corresponding libfreebl_64int_3.chk libfreebl_64fpu_3.so for other ultrasparc cpus, with a corresponding libfreebl_64fpu_3.chk on the 32-bit hp-ux pa-risc architecture, there are 2 freebl libraries : libfreebl_32fpu_3.sl for cpus that do multiply operations faster in floating point, with a corresponding libfreebl_32fpu_3.chk libf...
NSS PKCS11 Functions
tokendescription the label value for this token returned in the ck_token_info structure with an internationalize string (utf
8).
... this value will be truncated at 32 bytes (no null, partial utf
8 characters dropped).
...slotdescription the slotdescription value for this token returned in the ck_slot_info structure with an internationalize string (utf
8).
... this value will be truncated at 64 bytes (no null, partialutf
8 characters dropped).
JS::CompileOptions
owningcompileoptions &setelement(jsobject *e) owningcompileoptions &setelementattributename(jsstring *p) owningcompileoptions &setintroductionscript(jsscript *s) owningcompileoptions &setmutederrors(bool mute) owningcompileoptions &setversion(jsversion v) owningcompileoptions &setutf
8(bool u) owningcompileoptions &setcolumn(unsigned c) owningcompileoptions &setcompileandgo(bool cng) owningcompileoptions &setforeval(bool eval) owningcompileoptions &setnoscriptrval(bool nsr) owningcompileoptions &setselfhostingmode(bool shm) owningcompileoptions &setcanlazilyparse(bool clp) owningcompileoptions &setsourceislazy(bool ...
...ileandline(const char *f, unsigned l) compileoptions &setsourcemapurl(const char16_t *s) compileoptions &setelement(jsobject *e) compileoptions &setelementattributename(jsstring *p) compileoptions &setintroductionscript(jsscript *s) compileoptions &setmutederrors(bool mute) compileoptions &setversion(jsversion v) compileoptions &setutf
8(bool u) compileoptions &setcolumn(unsigned c) compileoptions &setcompileandgo(bool cng) compileoptions &setforeval(bool eval) compileoptions &setnoscriptrval(bool nsr) compileoptions &setselfhostingmode(bool shm) compileoptions &setcanlazilyparse(bool clp) compileoptions &setsourceislazy(bool l) compileoptions &setintroductio...
... utf
8 bool true if the character set of the source code is utf-
8.
... see also mxr id search for js::readonlycompileoptions mxr id search for js::owningcompileoptions mxr id search for js::compileoptions js::compile js::compileoffthread js::compilefunction js::evaluate bug
887077 bug 771705 ...
JSAutoByteString
char *encodeutf
8(jscontext *cx, js::handlestring str) call js_encodestringtoutf
8 and take ownership of the returned string, and return the string.
...*/ } use method to encode string { js::rootedstring str(cx, js::tostring(cx, strval)); if (!str) return false; jsautobytestring bytes; if (!bytes.encodeutf
8(cx, str)) /* calls js_encodestringtoutf
8 internally */ return false; /* ...do something with bytes...
... */ /* when leaving this scope, the string returned by js_encodestringtoutf
8 is freed.
...*/ } see also mxr id search for jsautobytestring js_encodestring js_encodestringtoutf
8 bug 61019
8 ...
JSPropertySpec
syntax struct jspropertyspec { struct selfhostedwrapper { void *unused; const char *funname; }; const char *name; int
8 tinyid; // obsolete since jsapi 31 uint
8_t flags; union { jsnativewrapper native; selfhostedwrapper selfhosted; } getter; union { jsnativewrapper native; selfhostedwrapper selfhosted; } setter; /* obsolete since jsapi 29 */ /* added in jsapi 2
8 */ const char *selfhostedgetter; const char *selfhostedsetter; }; name type description name const char * name to assign the pr...
... tinyid int
8 obsolete since jsapi 31 unique id number for the property to aid in resolving getproperty and setproperty method calls.
... flags uint
8_t the bitwise or of any number of property attributes.
...to define an array of jspropertyspec, use js_psg, js_psgs, js_self_hosted_get, js_self_hosted_getset, and js_ps_end see also mxr id search for jspropertyspec jsfunctionspec jsnativewrapper js_defineproperties js_psg js_psgs js_self_hosted_get js_self_hosted_getset js_ps_end bug 76644
8 - changed type of getter and setter to wrapper bug 93
872
8 - added selfhostedgetter and selfhostedsetter bug 95
8262 - changed type of getter and setter to union, and removed selfhostedgetter and selfhostedsetter.
JS_DumpHeap
obsolete since jsapi 3
8this feature is obsolete.
... this article covers features introduced in spidermonkey 1.
8 debug only.
... jstrace_base_shape = 0x0f, jstrace_jitcode = 0x1f, jstrace_lazy_script = 0x2f, jstrace_type_object = 0x3f, jstrace_last = jstrace_type_object }; description see bug 37
8261 for detail.
... see also bug 37
8261 bug 1122
842 ...
JS_EncodeStringToBuffer
this article covers features introduced in spidermonkey 1.
8.5 convert a javascript string to a c string.
... description js_encodestringtobuffer converts the specified javascript str to a c string (an array of
8-bit chars) and fills the specified buffer with up to length bytes of the string.
... to encode to utf
8, use js::getdeflatedutf
8stringlength and js::deflatestringtoutf
8buffer instead.
... see also mxr id search for js_encodestringtobuffer js_encodestring js_encodestringtoutf
8 js_getstringencodinglength js::deflatestringtoutf
8buffer js::getdeflatedutf
8stringlength bug 607292 ...
JS_ValueToString
obsolete since jsapi 2
8this feature is obsolete.
...it implements the tostring operator specified in ecma 262-3 §9.
8.
... if v is a number, conversion succeeds, and the result is a string representation of that number as specified in ecma 262-3 §9.
8.1.
... see also bug 933
834 js::tostring ...
SpiderMonkey 17
these release notes are an incomplete draft and were initially seeded from the (now-defunct) 1.
8.
8 release notes, which were themselves seeded from the 1.
8.5 release notes, so lots of the information here isn't actually new to spidermonkey 17.
...you can download full source code here: http://ftp.mozilla.org/pub/mozilla.org/js/mozjs17.0.0.tar.gz (md5 checksum: 20b6f
8f1140ef6e47daa3b16965c9202).
...it is supported on x
86, x
86_64, and arm architectures.
... obsolete typedef replacement type provided by uint
8, int
8, uint16, int16, uint32, int32, uint64, int64 uint
8_t, int
8_t, uint16_t, int16_t, uint32_t, int32_t, uint64_t, int64_t mozilla/stdint.h uintn, intn unsigned (also known as unsigned int), int n/a jsdouble double n/a jsuintn, jsintn unsigned (also known as unsigned int), int n/a jspackedbool n/a n/a jsrefco...
SpiderMonkey 24
you can download full source code here: https://ftp.mozilla.org/pub/mozilla.org/js/mozjs-24.2.0.tar.bz2 (sha1: ce7790
81cc11bd0c
871c6f303fc4a0091cf4fe66) spidermonkey 24 is the javascript engine that shipped in firefox 24.
... (this change was motivated by garbage collector improvements, which lean quite heavily on c++'s support for raii through constructors and destructors.) if you are compiling with microsoft's visual studio, note that the minimum supported version is msvc10/2010: msvc
8/9 support has been dropped.
...it is supported on x
86, x
86_64, and arm architectures.
... deleted apis js_get_class (use js_getclass instead) js_enumerateresolvedstandardclasses js_getglobalobject js_setcstringsareutf
8 ...list other deleted apis...
XPCOM changes in Gecko 2.0
chrome.manifest: # the {classid} here must match the classid in mycomponent.js component {e6b
866e3-41b2-4f05-a4d2-3d4bde0f7ef
8} components/mycomponent.js contract @foobar/mycomponent;1 {e6b
866e3-41b2-4f05-a4d2-3d4bde0f7ef
8} category profile-after-change mycomponent @foobar/mycomponent;1 the javascript code no longer exports a nsgetmodule() function.
... classid: components.id("{e6b
866e3-41b2-4f05-a4d2-3d4bde0f7ef
8}"), queryinterface: xpcomutils.generateqi([components.interfaces.nsimycomponent]), /* nsimycomponent implementation goes here */ ...
...platform-specific directories the component/chrome system used to look in platform-specific subdirectories of an extension, such as platform/winnt_x
86-msvc/chrome.manifest on windows.
...you can use the os and abi chrome registration directives to achieve the same effect: binary-component components/windows/mycomponent.dll abi=winnt_x
86-msvc binary-component components/mac/mycomponent.dylib abi=darwin_x
86-gcc3 binary-component components/mac/mycomponent64.dylib abi=darwin_x
86_64-gcc3 binary-component components/linux/mycomponent.so abi=linux_x
86-gcc3 this also means that platform-specific preferences are no longer possible.
How to build a binary XPCOM component using Visual Studio
for example, xulrunner 1.
8.0.4 which has a pre-built sdk at gecko-sdk-win32-msvc-1.
8.0.4.zip.
...the tutorial assumes the folder is called xulrunner-1.
8.0.4, but you can call yours whatever you want.
... let’s specify a simple interface: #include "nsisupports.idl" [scriptable, uuid(263ed1ba-5cc1-11db-9673-00e0
8161165f)] interface ispecialthing : nsisupports { attribute astring name; long add(in long a, in long b); }; remember to generate your own guid.
...they could look like this: h file: #ifndef __specialthing_impl_h__ #define __specialthing_impl_h__ #include "comp.h" #include "nsstringapi.h" #define specialthing_contractid "@starkravingfinkle.org/specialthing;1" #define specialthing_classname "specialthing" #define specialthing_cid { 0x245626, 0x5cc1, 0x11db, { 0x96, 0x73, 0x0, 0xe0, 0x
81, 0x61, 0x16, 0x5f } } class cspecialthing : public ispecialthing { public: ns_decl_isupports ns_decl_ispecialthing cspecialthing(); private: ~cspecialthing(); protected: /* additional members */ nsstring mname; }; #endif cpp file: #include "comp-impl.h" ns_impl_isupports1(cspecialthing, ispecialthing) cspecialthing::cspecialthing() { /* member initializers and constructor code */...
imgIEncoder
1.0 66 introduced gecko 1.
8 inherits from: nsiasyncinputstream last changed in gecko 1.9 (firefox 3) method overview void addimageframe( [array, size_is(length), const] in pruint
8 data, in unsigned long length, in pruint32 width, in pruint32 height, in pruint32 stride, in pruint32 frameformat, in astring frameoptions); void encodeclipboardimage(in nsiclipboardimage aclipboardimage, out nsifile aimagefile); obsolete since gecko 1.9 void endimageencode(); void initfromdata([array, size_is(length), const] in pruint
8 data, in unsigned long length, in pruint32 width, in pruint32 height, in pruint32 stride, in pruint32 inputformat, in astring outputoptions); ...
...post-multiplied alpha us used (for example 50% transparent red is 0xff0000
80) input_format_hostargb 2 input is host-endian argb: on big-endian machines each pixel is therefore argb, and for little-endian machiens (intel) each pixel is bgra (this is used by canvas to match it's internal representation) pre-multiplied alpha is used (that is, 50% transparent red is 0x
80
800000, not 0x
80ff0000) possible values for outputoptions.
... methods addimageframe() void addimageframe( [array, size_is(length), const] in pruint
8 data, in unsigned long length, in pruint32 width, in pruint32 height, in pruint32 stride, in pruint32 frameformat, in astring frameoptions ); parameters data list of bytes in the format specified by inputformat.
...initfromdata() void initfromdata( [array, size_is(length), const] in pruint
8 data, in unsigned long length, in pruint32 width, in pruint32 height, in pruint32 stride, in pruint32 inputformat, in astring outputoptions ); parameters data list of bytes in the format specified by inputformat.
mozIJSSubScriptLoader
66 introduced gecko 1.0 inherits from: nsisupports last changed in gecko 2
8 (firefox 2
8 / thunderbird 2
8 / seamonkey 2.25 / firefox os 1.3) implemented by: @mozilla.org/moz/jssubscript-loader;1.
...as of gecko
8.0, scripts are loaded from the startup cache where possible.
... jsval loadsubscript( in string url, in object targetobj optional, in string charset optional, ); example let context = {}; services.scriptloader.loadsubscript("chrome://my-package/content/foo-script.js", context, "utf-
8" /* the script's encoding */); parameters url the url pointing to the script to load.
... it must be a local chrome:, resource: or file: url (see bug 3076
86 and bug 41
8356).
mozIStorageValueArray
last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) inherits from: nsisupports method overview long gettypeofindex(in unsigned long aindex); long getint32(in unsigned long aindex); long long getint64(in unsigned long aindex); double getdouble(in unsigned long aindex); autf
8string getutf
8string(in unsigned long aindex); astring getstring(in unsigned long aindex); void getblob(in unsigned long aindex, out unsigned long ad...
... getutf
8string() obtains a utf
8string from the specified index.
... autf
8string getutf
8string( in unsigned long aindex ); parameters aindex the zero-based numerical index for the column to get the data from.
... return value the utf
8string for the specified entry.
nsIAccessibleText
so this method might return utf-16 strings, or it could return "string" values which are utf-
8.
...so this method might return utf-16 strings, or it could return "string" values which are utf-
8.
...so this method might return utf-16 strings, or it could return "string" values which are utf-
8.
...so this method might return utf-16 strings, or it could return "string" values which are utf-
8.
nsIBidiKeyboard
riter if they have keyboard layouts in both left-to-right and right-to-left directions (that is users who use arabic, iranian (persian), or israel (hebrew) keyboard layout, beside an us (english) layout.) inherits from: nsisupports last changed in gecko 9.0 (firefox 9.0 / thunderbird 9.0 / seamonkey 2.6) method overview boolean islangrtl(); void setlangfrombidilevel(in pruint
8 alevel); attributes attribute type description havebidikeyboards boolean indicates whether or not the system has at least one keyboard for each direction (left-to-right and right-to-left) installed.
...(supported on: win32) void setlangfrombidilevel( in pruint
8 alevel ); parameters alevel if odd set the keyboard to right-to-left, if even set left-to-right.
...in the gecko 1.
8 branch, just islangrtl() had been implemented, and uses gdk's api to check the direction of keyboard layout, which has a problem with hebrew language.
...more info: bug 34
8724, bug 34
8724, and gnome bug: 116626 mac only islangrtl is supported on this platform.
nsIConverterInputStream
1.0 66 introduced gecko 1.
8 inherits from: nsiunicharinputstream last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) implemented by: @mozilla.org/intl/converter-input-stream;1.
...a value of null or "utf-
8" equals utf-
8 encoding.
... latin 1 is specified as "iso-
8859-1".
...this is currently set to
8192 bytes.
nsIDOMWindow
in gecko
8.0 nsidomstoragewindow and nsidomwindowinternal have been merged into this interface.
...note: prior to gecko
8.0 this attribute was part of nsidomstoragewindow.
... note: prior to gecko
8.0 this attribute was part of nsidomstoragewindow.
...read only.note: prior to gecko
8.0 this attribute was part of nsidomstoragewindow.
nsIEditor
66 introduced gecko 1.0 inherits from: nsisupports last changed in gecko 1
8.0 (firefox 1
8.0 / thunderbird 1
8.0 / seamonkey 2.15) method overview [noscript] void init(in nsidomdocument doc, in nsicontent aroot, in nsiselectioncontroller aselcon, in unsigned long aflags); void setattributeorequivalent(in nsidomelement element, in astring sourceattrname, in astring sourceattrvalue, in boolean asuppresstransaction); void removeattributeorequivalent(in nsidomelement element, in domstring sourceattrname, in boolean asuppresstransaction); void postcreate(); void predestroy(in boolean adestroyingframe...
...oid marknodedirty(in nsidomnode node); direction controller void switchtextdirection(); output methods astring outputtostring(in astring formattype, in unsigned long flags); example: // flags are declared in base/public/nsidocumentencoder.idl // outputselectiononly = 1, outputformatted = 2, // outputraw = 4, outputbodyonly =
8, // outputpreformatted = 16, outputwrap = 32, // outputformatflowed = 64, outputabsolutelinks = 25
8, // outputencodew3centities = 256, outputcrlinebreak = 512, // outputlflinebreak = 1024, outputnoscriptcontent = 204
8, // outputnoframescontent = 4096, outputnoformattinginpre =
8192, // outputencodebasicentities=163
84, outputencodelatin1entities=3276
8, // outputencodeht...
...editorapi.outputtostring('text/html',
8); // xml: all in xml with _moz_dirty="" in new tags, html tags are in upper case // application/xhtml+xml format do the same editorapi.outputtostring('text/xml', 2); // the body is not recognized, everything is printed void outputtostream(in nsioutputstream astream, in astring formattype, in acstring charsetoverride, in unsigned long flags); listener methods void addeditorobserver(in nsieditorobserver observer);obsolete since gecko 1
8 void seteditorobserver(in editactionl...
...istener observer); void removeeditorobserver(in nsieditorobserver observer obsolete since gecko 1
8); void addeditactionlistener(in nsieditactionlistener listener); void removeeditactionlistener(in nsieditactionlistener listener); void adddocumentstatelistener(in nsidocumentstatelistener listener); void removedocumentstatelistener(in nsidocumentstatelistener listener); debug methods void dumpcontenttree(); void debugdumpcontent() ; void debugunittests(out long outnumtests, out long outnumtestsfailed); [notxpcom] boolean ismodifiablenode(in nsidomnode anode); constants load flags constant value description enone 0 enext 1 eprevious ...
nsIFile
delete_on_close 0x
80000000 optional parameter used by opennsprfiledesc methods append() this function is used for constructing a descendant of the current nsifile.
... note: this method does not work on all platforms due to bug 322
865.
...for specific handling before gecko 9 (firefox 9.0 / thunderbird 9.0 / seamonkey 2.6), please see bug 6
82571.
...as of gecko 1.7, it is utf-
8 on mac os x.
nsIMemoryReporter
1.0 66 introduced gecko 1.9 inherits from: nsisupports last changed in gecko
8.0 (firefox
8.0 / thunderbird
8.0 / seamonkey 2.5) any piece of code that wishes to allow its memory use to be monitored may create an nsimemoryreporter object and then register it by calling nsimemoryreportermanager.registerreporter().
... description autf
8string a human-readable description of this memory usage report.
... path autf
8string the path that this memory usage should be reported under.
... deprecated since gecko
8.0 kind_nonheap 0 allocated directly by os calls e.g.
nsIMimeConverter
method overview string encodemimepartiistr(in string header, in boolean structured, in string mailcharset, in long fieldnamelen, in long encodedwordsize); string encodemimepartiistr_utf
8(in autf
8string header, in boolean structured, in string mailcharset, in long fieldnamelen, in long encodedwordsize); string decodemimeheadertocharptr(in string header, in string default_charset, in boolean override_charset, in boolean eatcontinuations); astring decodemimeheader(in string header, in string default_charset, in boolean override_charset, in boolean eatcontinuations); m...
... mimeconverteroutputcallback output_fn, in void *closure); mimeencoderdata *qpencoderinit(in mimeconverteroutputcallback output_fn, in void *closure); void encoderdestroy(in mimeencoderdata *data, in boolean abort_p); long encoderwrite(in mimeencoderdata *data, in string buffer, in long size); methods encodemimepartiistr() an variant of encodemimepartiistr_utf
8() which treats the header as written in the given charset.
... encodemimepartiistr_utf
8() encodes a string into a mime-encoded form according to rfc 2047.
... string encodemimepartiistr_utf
8(in autf
8string header, in boolean structured, in string mailcharset, in long fieldnamelen, in long encodedwordsize); parameters header the string to encode into the mime-encoded form.
nsINavHistoryContainerResultNode
1.0 66 introduced gecko 1.9 inherits from: nsinavhistoryresultnode last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) method overview nsinavhistoryresultnode findnodebydetails(in autf
8string auristring, in prtime atime, in long long aitemid, in boolean arecursive); nsinavhistoryresultnode getchild(in unsigned long aindex); unsigned long getchildindex(in nsinavhistoryresultnode anode); attributes attribute type description childcount unsigned long the number of child nodes; accessing this throws an ns_error_not_available exception of containeropen is false.
... dynamiccontainertype autf
8string a string representing the dynamic container api service responsible for this container.
... remotecontainertype obsolete since gecko 1.9 autf
8string a string representing the remote container service api that is responsible for this container.
...nsinavhistoryresultnode findnodebydetails( in autf
8string auristring, in prtime atime, in long long aitemid, in boolean recursive ); parameters auristring the uri attribute value to match on.
nsINavHistoryQueryOptions
excludeitemifparenthasannotation obsolete since gecko 13.0 autf
8string this option excludes items from a bookmarks query if the parent of the item has this annotation.
... sortingannotation autf
8string the annotation to use in sort_by_annotation_* sorting modes.
... sort_by_visitcount_descending
8 sort by the descending visit count order.
... sort_by_tags_descending 1
8 sort by the descending tags order.
nsIPluginHost
void getplugincount(out unsigned long aplugincount); obsolete since gecko 1.
8 nsiplugin getpluginfactory(in string amimetype); native code only!
... void instantiateembededplugin(in string amimetype, in nsiuri aurl, in nsiplugininstanceowner aowner); obsolete since gecko 1.
8 void instantiatefullpageplugin(in string amimetype, in nsiuri auri, in nsiplugininstanceowner aowner, out nsistreamlistener astreamlistener); native code only!
... void findproxyforurl( in string aurl, out string aresult ); parameters aurl aresult native code only!getplugin nsiplugin getplugin( in string amimetype ); parameters amimetype return value getplugincount() obsolete since gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) void getplugincount( out unsigned long aplugincount ); parameters aplugincount native code only!getpluginfactory obsolete since gecko 1.9.2 (firefox 3.6 / thunderbird 3.1 / fennec 1.0)this feature is obsolete.
... void instantiatedummyjavaplugin( in nsiplugininstanceowner aowner ); parameters aowner native code only!instantiateembeddedplugin void instantiateembeddedplugin( in string amimetype, in nsiuri aurl, in nsiplugininstanceowner aowner ); parameters amimetype aurl aowner instantiateembededplugin() obsolete since gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) void instantiateembededplugin( in string amimetype, in nsiuri aurl, in nsiplugininstanceowner aowner ); parameters amimetype aurl aowner native code only!instantiatefullpageplugin void instantiatefullpageplugin( in string amimetype, in nsiuri auri, in nsiplugininstanceowner aowner, out nsistreamlistener ast...
nsIScriptableIO
the default character set is utf-
8; to read text in another character set, set the acharset argument to the desired character set.
...by default, streams are interpreted in utf-
8.
...the default character set is utf-
8; to write text in another character set, set the acharset argument to the desired character set.
...by default, streams are interpreted in utf-
8.
nsISocketTransport
host autf
8string get the host for the underlying socket connection.
... constant value description status_resolving 0x
804b0003 transport is resolving the host.
... status_resolved 0x
804b000b transport has resolved the host.
... status_connecting_to 0x
804b0007 status_connected_to 0x
804b0004 status_sending_to 0x
804b0005 status_waiting_for 0x
804b000a status_receiving_from 0x
804b0006 connection flags values for the connectionflags attribute constant value description bypass_cache 0 when making a new connection bypass_cache will force the necko dns cache entry to be refreshed with a new call to nspr if it is set before opening the new stream.
nsIWebProgress
last changed in gecko 1.
8.0 inherits from: nsisupports method overview void addprogresslistener(in nsiwebprogresslistener alistener, in unsigned long anotifymask); void removeprogresslistener(in nsiwebprogresslistener alistener); attributes attribute type description domwindow nsidomwindow the dom window associated with this nsiwebprogress instance.
... notify_state_window 0x0000000
8 only receive the nsiwebprogresslistener.onstatechange() event if the astateflags parameter includes nsiwebprogresslistener::state_is_window.
... notify_location 0x000000
80 receive nsiwebprogresslistener.onlocationchange() events.
... notify_all 0x000000ff <= gecko 1.
8.1 0x000001ff > gecko 1.
8.1 this flag enables all notifications.
nsIWebSocketChannel
1.0 66 introduced gecko
8.0 inherits from: nsisupports last changed in gecko
8.0 (firefox
8.0 / thunderbird
8.0 / seamonkey 2.5) implemented by: ?????????????????????????????????????.
... to create an instance, use: var websocketchannel = components.classes["@mozilla.org/????????????????????????????"] .createinstance(components.interfaces.nsiwebsocketchannel); method overview void asyncopen(in nsiuri auri, in acstring aorigin, in nsiwebsocketlistener alistener, in nsisupports acontext); void close(in unsigned short acode, in autf
8string areason); void sendbinarymsg(in acstring amsg); void sendmsg(in autf
8string amsg); attributes attribute type description extensions acstring sec-websocket-extensions response header value.
... close() void close( in unsigned short acode, in autf
8string areason ); parameters acode the status of the connection when closed; see status codes for possible values.
...void sendmsg( in autf
8string amsg ); parameters amsg the utf-
8 string to send.
nsIWebSocketListener
1.0 66 introduced gecko
8.0 inherits from: nsisupports last changed in gecko
8.0 (firefox
8.0 / thunderbird
8.0 / seamonkey 2.5) method overview void onacknowledge(in nsisupports acontext, in pruint32 asize); void onbinarymessageavailable(in nsisupports acontext, in acstring amsg); void onmessageavailable(in nsisupports acontext, in autf
8string amsg); void onserverclose(in nsisupports acontext, in unsigned short acode, in autf
8string areason); void onstart(in nsisupports acontext); void onstop(in nsisupports acontext, in nsre...
...void onmessageavailable( in nsisupports acontext, in autf
8string amsg ); parameters acontext user defined context.
... amsg the message data, as a utf-
8 string.
...void onserverclose( in nsisupports acontext, in unsigned short acode, in autf
8string areason ); parameters acontext user defined context.
nsIXmlRpcClient
last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) inherits from: nsisupports method overview void init(in string serverurl); void setauthentication(in string username, in string password); void clearauthentication(in string username, in string password); void setencoding(in string encoding); void setencoding(in unsigned long type, out nsiidref uuid, out nsqiresult result); void asynccall (in nsixmlrpcclientlistener listener, in nsisupports ctxt, in string methodname, in nsisupports arguments, in pruint32 count); attributes attribute type description serverurl readonly ...
...the default charset if this function is not called is "utf-
8" void setauthentication ( in string encoding ) ; parameters encoding encoding charset to be used asynccall() call remote method methodname asynchronously with given arguments.
... supported arguments are: nsisupportspruint
8, nsisupportspruint16, nsisupportsprint16, nsisupportsprint32: i4, nsisupportsprbool: boolean, nsisupportschar, nsisupportscstring: string, nsisupportsfloat, nsisupportsdouble: double, nsisupportsprtime: datetime.iso
8601, nsiinputstream: base64, nsisupportsarray: array, nsidictionary: struct note that both nsisupportsarray and nsidictionary can only hold any of the supported input types.
... return value will be converted as follows: i4 or int: nsisupportsprint32 boolean: nsisupportsprbool string: nsisupportscstring double: nsisupportsdouble datetime.iso
8601: nsisupportsprtime base64: nsisupportscstring array: nsisupportsarray struct: nsidictionary faults (server side errors) are indicated by returning ns_error_failure.
nsMsgSearchAttrib
*/ [scriptable, uuid(a
83ca7e
8-4591-4111-
8fb
8-fd76ac73c
866)] interface nsmsgsearchattrib { const nsmsgsearchattribvalue custom = -2; /* a custom term, see nsimsgsearchcustomterm */ const nsmsgsearchattribvalue default = -1; const nsmsgsearchattribvalue subject = 0; /* mail and news */ const nsmsgsearchattribvalue sender = 1; const nsmsgsearchattribvalue body = 2; const nsmsgsearchattribvalue date = 3; const nsmsgsearchattribvalue priority = 4; /* mail only */ ...
...const nsmsgsearchattribvalue msgstatus = 5; const nsmsgsearchattribvalue to = 6; const nsmsgsearchattribvalue cc = 7; const nsmsgsearchattribvalue toorcc =
8; const nsmsgsearchattribvalue alladdresses = 9; const nsmsgsearchattribvalue location = 10; /* result list only */ const nsmsgsearchattribvalue messagekey = 11; /* message result elems */ const nsmsgsearchattribvalue ageindays = 12; const nsmsgsearchattribvalue folderinfo = 13; /* for "view thread context" from result */ const nsmsgsearchattribvalue size = 14; const nsmsgsearchattribvalue anytext = 15; const nsmsgsearchattribvalue keywords = 16; // keywords are the internal representation of tags.
... const nsmsgsearchattribvalue name = 17; const nsmsgsearchattribvalue displayname = 1
8; const nsmsgsearchattribvalue nickname = 19; const nsmsgsearchattribvalue screenname = 20; const nsmsgsearchattribvalue email = 21; const nsmsgsearchattribvalue additionalemail = 22; const nsmsgsearchattribvalue phonenumber = 23; const nsmsgsearchattribvalue workphone = 24; const nsmsgsearchattribvalue homephone = 25; const nsmsgsearchattribvalue fax = 26; const nsmsgsearchattribvalue pager = 27; const nsmsgsearchattribvalue mobile = 2
8; const nsmsgsearchattribvalue city = 29; const nsmsgsearchattribvalue street = 30; const nsmsgsearchattribvalue title = 31; const nsmsgsearchattribvalue organization = 32; const nsmsgsea...
...rchattribvalue department = 33; // 34 - 43, reserved for ab / ldap; const nsmsgsearchattribvalue hasattachmentstatus = 44; const nsmsgsearchattribvalue junkstatus = 45; const nsmsgsearchattribvalue junkpercent = 46; const nsmsgsearchattribvalue junkscoreorigin = 47; const nsmsgsearchattribvalue label = 4
8; /* mail only...can search by label */ const nsmsgsearchattribvalue hdrproperty = 49; // uses nsimsgsearchterm::hdrproperty const nsmsgsearchattribvalue folderflag = 50; // uses nsimsgsearchterm::status const nsmsgsearchattribvalue uint32hdrproperty = 51; // uses nsimsgsearchterm::hdrproperty // 52 is for showing customize - in ui headers start from 53 onwards up until 99.
nsMsgMessageFlags
marked 0x00000004 indicates whether or not the message has been flagged/starred expunged 0x0000000
8 indicates whether or not the message is deleted (but not compacted) hasre 0x00000010 indicates whether or not 're: ' should be added to the head of the subject to get the proper subject.
... offline 0x000000
80 indicates whether or not we have this message in the offline cache.
... queued 0x00000
800 indicates whether or not the message is queued to be delivered.
... mdnreportsent 0x00
800000 indicates whether or not a delivery receipt was sent.
MailNews fakeserver
it utilizes utf-
8 as its transport mechanism and is capable of performing proper pipelining of commands.
...in addition, it uses utf-
8 as the transmission medium.
... specific fakeserver guidelines pop imap smtp nntp nntpd.js defines a few different classes of nntp servers: compliance for rfc 977, rfc 29
80, and rfc 3977, as well as a giganews and an inn server.
... (full 29
80 and 3977 compliance as well as inn is not yet written).
Mail composition back end
the mail composition back end is responsible for the assembly and creation of rfc
822 messages to be delivered either via smtp or nntp services.
... you also have the ability to save rfc
822 files to disk, should you need this data for some reason.
... sending messages the primary responsibility of the back end is for the creation and sending of rfc
822 messages.
... createandsendmessage the createandsendmessage method will create an rfc
822 message and send it all in one operation as well as providing the ability to save disk files for later use.
Theme Packaging
4
8x4
8) png (may contain alpha transparency) which will show up in the appearance section of the add-ons manager.
... sample install.rdf file <?xml version="1.0"?> <rdf xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:em="http://www.mozilla.org/2004/em-rdf#"> <description about="urn:mozilla:install-manifest"> <em:id>{1
8b64b56-d42f-42
8d-a
88c-baa413bc413f}</em:id> <em:version>1.0</em:version> <em:type>4</em:type> <!-- target application this extension can install into, with minimum and maximum supported versions.
... --> <em:targetapplication> <description> <em:id>{ec
8030f7-c20a-464f-9b0e-13a3a9e973
84}</em:id> <em:minversion>0.
8</em:minversion> <em:maxversion>0.9</em:maxversion> </description> </em:targetapplication> <!-- front end metadata --> <em:name>new theme 1</em:name> <em:description>a test theme for thunderbird</em:description> <em:creator>ben goodger</em:creator> <em:contributor>john doe</em:contributor> <em:homepageurl>http://www.bengoodger.com/</em:homepageurl> <!-- front end integration hooks (used by theme manager)--> <em:internalname>newtheme1</em:internalname> </description> </rdf> the following are some common target application guids that you can use in your targetapplication properties: thunderbird {35...
...50f703-e5
82-4d05-9a0
8-453d09bdfdc6} seamonkey {92650c4d-4b
8e-4d2a-b7eb-24ecf4f6b63a} pale moon {
8de7fcbb-c55c-4fbe-bfc5-fc555c
87dbc4} official references for toolkit api official references.
Constants - Plugins
nperr_incompatible_version_error
8 versions of plug-in and communicator do not match.
... version feature constants npvers constant: version feature information value description npvers_has_streamoutput
8 streaming data.
... npvers_6
8k_has_liveconnect 11 liveconnect (6
8k).
... npvers_has_npobject_enum 1
8 the npclass in question has an enumerate field, which lets you enumerate the properties of an npobject of that class.
UI Tour - Firefox Developer Tools
in the screenshot below there are three breakpoints: line
82 has a normal breakpoint and execution is paused here line
85 has a logpoint which logs the contents of tablerow to the console line 100 has a conditional breakpoint the third column shows more information about the breakpoints.
... for example, the logpoint at line
85 logs the value of the tablerow variable to the console and the conditional breakpoint at line 100 breaks if the contents of the todolist is undefined.
... toolbar at the top of the right-hand pane, there's a toolbar: the toolbar consists of: four buttons to control the debugger's movement through the script: play/pause (f
8): pauses or resumes execution of the script you're debugging.
...the setting is reset when the developer tools are closed (except in firefox 77, see bug 164031
8).
Network request list - Firefox Developer Tools
(starting in firefox
80) on the right edge of the file column, a turtle icon appears if the server waiting time exceeds a threshhold (default: 500 ms).
...starting with firefox 6
8, the transferred column lists either "cached (raced)" or "[size] (raced)" depending on the faster source.
... note: (starting in firefox
80) you can also block and unblock urls from the web console, using the :block and :unblock helper commands.
... remote-ip:63.245.215.53 remote-ip:[2400:cb00:204
8:1::6
810:2
802] cause shows resources matching a specific cause type.
Allocations - Firefox Developer Tools
so in the example above:
8904 samples were taken in signallater(), which is 2
8.57% of the total number of samples taken those samples allocated 1102
888 bytes, which is 30.01% of the total memory allocated in all samples next to each function name is a disclosure arrow.
...but if you start walking back up the call stack, you'll see the difference: here,
8904 samples were taken in signallater().
...however, removeinner() has
8901 in total count, while setselectioninner() has just 3 in total count.
... this is telling us that, of the
8904 allocations seen in signallater(), all but three came through the removeinner() branch.
about:debugging - Firefox Developer Tools
note: if the version of firefox on your remote device is more than one major version older than the version running on your computer, you may see a message like the following: in firefox 76 and above, the message can look like the following: see connection for firefox for android 6
8 for more information.
... starting in firefox 7
8, the url bar is editable, so that you can change the url used by the browser on the remote device, by typing in firefox for desktop.
... connection to firefox for android 6
8 releases of firefox for android that are based on version 6
8 cannot be debugged from desktop firefox versions 69 or later, because of the difference in release versions.
... until such time as firefox for android is updated to a newer major release, in synch with desktop firefox, you should use one of the following firefox for android versions: firefox preview, if your desktop firefox is the main release or developer edition firefox for android nightly if you prefer to test with the main release of firefox for android (i.e., based on release 6
8), you can do so with the desktop firefox extended support release (esr), which is also based on version 6
8.
AnalyserNode.getByteTimeDomainData() - Web APIs
the getbytetimedomaindata() method of the analysernode interface copies the current waveform, or time-domain, data into a uint
8array (unsigned byte array) passed into it.
... syntax const audioctx = new audiocontext(); const analyser = audioctx.createanalyser(); const dataarray = new uint
8array(analyser.fftsize); // uint
8array should be the same length as the fftsize analyser.getbytetimedomaindata(dataarray); // fill the uint
8array with data returned from getbytetimedomaindata() parameters array the uint
8array that the time domain data will be copied to.
...for more complete applied examples/information, check out our voice-change-o-matic demo (see app.js lines 12
8–205 for relevant code).
... analyser.fftsize = 204
8; const bufferlength = analyser.fftsize; const dataarray = new uint
8array(bufferlength); analyser.getbytetimedomaindata(dataarray); // draw an oscilloscope of the current audio source function draw() { drawvisual = requestanimationframe(draw); analyser.getbytetimedomaindata(dataarray); canvasctx.fillstyle = 'rgb(200, 200, 200)'; canvasctx.fillrect(0, 0, width, height); canvasctx.linewidth = 2; canvasctx.strokestyle = 'rgb(0, 0, 0)'; const slicewidth = width * 1.0 / bufferlength; let x = 0; canvasctx.beginpath(); for(var i = 0; i < bufferlength; i++) { const v = dataarray[i]/12
8.0; const y = v * height/2; ...
AnalyserNode.smoothingTimeConstant - Web APIs
the default value is 0.
8.
...for more complete applied examples/information, check out our voice-change-o-matic demo (see app.js lines 12
8–205 for relevant code).
... var audioctx = new (window.audiocontext || window.webkitaudiocontext)(); var analyser = audioctx.createanalyser(); analyser.mindecibels = -90; analyser.maxdecibels = -10; analyser.smoothingtimeconstant = 0.
85; ...
... analyser.fftsize = 256; var bufferlength = analyser.frequencybincount; console.log(bufferlength); var dataarray = new uint
8array(bufferlength); canvasctx.clearrect(0, 0, width, height); function draw() { drawvisual = requestanimationframe(draw); analyser.getbytefrequencydata(dataarray); canvasctx.fillstyle = 'rgb(0, 0, 0)'; canvasctx.fillrect(0, 0, width, height); var barwidth = (width / bufferlength) * 2.5; var barheight; var x = 0; for(var i = 0; i < bufferlength; i++) { barheight = dataarray[i]; canvasctx.fillstyle = 'rgb(' + (barheight+100) + ',50,50)'; canvasctx.fillrect(x,height-barheight/2,barwidth,barheight/2); x += barwidth + 1; } }; draw(); specifications specification status comment web audio apithe definition...
Using the CSS Painting API - Web APIs
<ul> <li>item 1</li> <li>item 2</li> <li>item 3</li> <li>item 4</li> <li>item 5</li> <li>item 6</li> <li>item 7</li> <li>item
8</li> <li>item 9</li> <li>item 10</li> <li>item 11</li> <li>item 12</li> <li>item 13</li> <li>item 14</li> <li>item 15</li> <li>item 16</li> <li>item 17</li> <li>item</li> </ul> css.paintworklet.addmodule('https://mdn.github.io/houdini-examples/csspaint/intro/worklets/boxbg.js'); li { background-image: paint(boxbg); --boxcolor: hsla(55, 90%, 60%, 1.
... registerpaint('headerhighlight', class { static get inputproperties() { return ['--highcolour']; } static get contextoptions() { return {alpha: true}; } paint(ctx, size, props) { /* set where to start the highlight & dimensions */ const x = 0; const y = size.height * 0.3; const blockwidth = size.width * 0.33; const highlightheight = size.height * 0.
85; const color = props.get('--highcolour'); ctx.fillstyle = color; ctx.beginpath(); ctx.moveto( x, y ); ctx.lineto( blockwidth, y ); ctx.lineto( blockwidth + highlightheight, highlightheight ); ctx.lineto( x, highlightheight ); ctx.lineto( x, y ); ctx.closepath(); ctx.fill(); /* create the dashes */ for (let i = 0; i < 4; i++) { let start = i * 2; ctx.begin...
... { // ctx -> drawing context // size -> size of the box being painted // props -> list of custom properties available to the element // args -> list of arguments set when calling the paint() function in the css // where to start the highlight & dimensions const x = 0; const y = size.height * 0.3; const blockwidth = size.width * 0.33; const blockheight = size.height * 0.
85; // the values passed in the paint() function in the css const colour = props.get( '--boxcolor' ); const stroketype = args[0].tostring(); const strokewidth = parseint(args[1]); // set the stroke width if ( strokewidth ) { ctx.linewidth = strokewidth; } else { ctx.linewidth = 1.0; } // set the fill type if ( stroketype === 'stroke' ) { ctx.fillstyle = 'transparent'...
...-type(3n) { --boxcolor: hsla(255, 90%, 60%, 0.5); background-image: paint(hollowhighlights, filled, 3px); } li:nth-of-type(3n+1) { --boxcolor: hsla(355, 90%, 60%, 0.5); background-image: paint(hollowhighlights, stroke, 1px); } <ul> <li>item 1</li> <li>item 2</li> <li>item 3</li> <li>item 4</li> <li>item 5</li> <li>item 6</li> <li>item 7</li> <li>item
8</li> <li>item 9</li> <li>item 10</li> <li>item 11</li> <li>item 12</li> <li>item 13</li> <li>item 14</li> <li>item 15</li> <li>item 16</li> <li>item 17</li> <li>item</li> </ul> in our <script> we register the worklet: css.paintworklet.addmodule('https://mdn.github.io/houdini-examples/csspaint/intro/worklets/hollow.js'); see also css painting api ...
CanvasRenderingContext2D.scale() - Web APIs
html <canvas id="canvas"></canvas> javascript the rectangle has a specified width of
8 and a height of 20.
... const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // scaled rectangle ctx.scale(9, 3); ctx.fillstyle = 'red'; ctx.fillrect(10, 10,
8, 20); // reset current transformation matrix to the identity matrix ctx.settransform(1, 0, 0, 1, 0, 0); // non-scaled rectangle ctx.fillstyle = 'gray'; ctx.fillrect(10, 10,
8, 20); result the scaled rectangle is red, and the non-scaled rectangle is gray.
...this is to adjust for the negative scaling factor: -2
80 * -1 becomes 2
80, and text is drawn leftwards from that point.
... html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.scale(-1, 1); ctx.font = '4
8px serif'; ctx.filltext('hello world!', -2
80, 90); ctx.settransform(1, 0, 0, 1, 0, 0); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.scale' in that specification.
Applying styles and colors - Web APIs
function draw() { var ctx = document.getelementbyid('canvas').getcontext('2d'); // create gradients var radgrad = ctx.createradialgradient(45, 45, 10, 52, 50, 30); radgrad.addcolorstop(0, '#a7d30c'); radgrad.addcolorstop(0.9, '#019f62'); radgrad.addcolorstop(1, 'rgba(1, 159, 9
8, 0)'); var radgrad2 = ctx.createradialgradient(105, 105, 20, 112, 120, 50); radgrad2.addcolorstop(0, '#ff5f9
8'); radgrad2.addcolorstop(0.75, '#ff01
88'); radgrad2.addcolorstop(1, 'rgba(255, 1, 136, 0)'); var radgrad3 = ctx.createradialgradient(95, 15, 15, 102, 20, 40); radgrad3.addcolorstop(0, '#00c9ff'); radgrad3.addcolorstop(0.
8, '#00b5e2'); radgrad3.addcolorstop(1, 'rgba(0, 20...
...1, 255, 0)'); var radgrad4 = ctx.createradialgradient(0, 150, 50, 0, 140, 90); radgrad4.addcolorstop(0, '#f4f201'); radgrad4.addcolorstop(0.
8, '#e4c700'); radgrad4.addcolorstop(1, 'rgba(22
8, 199, 0, 0)'); // draw shapes ctx.fillstyle = radgrad4; ctx.fillrect(0, 0, 150, 150); ctx.fillstyle = radgrad3; ctx.fillrect(0, 0, 150, 150); ctx.fillstyle = radgrad2; ctx.fillrect(0, 0, 150, 150); ctx.fillstyle = radgrad; ctx.fillrect(0, 0, 150, 150); } <canvas id="canvas" width="150" height="150"></canvas> draw(); in this case, we've offset the starting point slightly from the end point to achieve a spherical 3d effect.
...this isn't very obvious from the code because it uses two different css color methods as a demonstration, but in the first gradient #019f62 = rgba(1,159,9
8,1).
... function draw() { var ctx = document.getelementbyid('canvas').getcontext('2d'); ctx.shadowoffsetx = 2; ctx.shadowoffsety = 2; ctx.shadowblur = 2; ctx.shadowcolor = 'rgba(0, 0, 0, 0.5)'; ctx.font = '20px times new roman'; ctx.fillstyle = 'black'; ctx.filltext('sample string', 5, 30); } <canvas id="canvas" width="150" height="
80"></canvas> draw(); screenshotlive sample we will look at the font property and filltext method in the next chapter about drawing text.
Transformations - Web APIs
to convert, we are using: radians = (math.pi/1
80)*degrees.
... function draw() { var ctx = document.getelementbyid('canvas').getcontext('2d'); // left rectangles, rotate from canvas origin ctx.save(); // blue rect ctx.fillstyle = '#0095dd'; ctx.fillrect(30, 30, 100, 100); ctx.rotate((math.pi / 1
80) * 25); // grey rect ctx.fillstyle = '#4d4e53'; ctx.fillrect(30, 30, 100, 100); ctx.restore(); // right rectangles, rotate from rectangle center // draw blue rect ctx.fillstyle = '#0095dd'; ctx.fillrect(150, 30, 100, 100); ctx.translate(200,
80); // translate to rectangle center // x = x + 0.5 * width // y = y + 0.5 * height ctx.rotate((math.pi / 1
80) * 25); // rotate ctx.translate(-200, -
80); // translate back // draw grey rect ctx.fillstyle = '#4d4e53'; ctx.
... ctx.save(); ctx.scale(10, 3); ctx.fillrect(1, 10, 10, 10); ctx.restore(); // mirror horizontally ctx.scale(-1, 1); ctx.font = '4
8px serif'; ctx.filltext('mdn', -135, 120); } <canvas id="canvas" width="150" height="150"></canvas> draw(); screenshotlive sample transforms finally, the following transformation methods allow modifications directly to the transformation matrix.
...); var sin = math.sin(math.pi / 6); var cos = math.cos(math.pi / 6); ctx.translate(100, 100); var c = 0; for (var i = 0; i <= 12; i++) { c = math.floor(255 / 12 * i); ctx.fillstyle = 'rgb(' + c + ', ' + c + ', ' + c + ')'; ctx.fillrect(0, 0, 100, 10); ctx.transform(cos, sin, -sin, cos, 0, 0); } ctx.settransform(-1, 0, 0, 1, 100, 100); ctx.fillstyle = 'rgba(255, 12
8, 255, 0.5)'; ctx.fillrect(0, 50, 100, 100); } <canvas id="canvas" width="200" height="250"></canvas> draw(); screenshotlive sample « previousnext » ...
Examples of web and XML development using the DOM - Web APIs
+ ", width=" + arrimages[i].width + ", style.height=" + arrimages[i].style.height + ", style.width=" + arrimages[i].style.width + "<\/li>"; } strhtml += "<\/ul>"; objoutput.innerhtml = strhtml; } </script> </head> <body onload="init();"> <p>image 1: no height, width, or style <img id="image1" src="https://udn.realityripple.com/samples/d2/
8ba7141ed1.gif"> </p> <p>image 2: height="50", width="500", but no style <img id="image2" src="https://udn.realityripple.com/samples/d2/
8ba7141ed1.gif" height="50" width="500"> </p> <p>image 3: no height, width, but style="height: 50px; width: 500px;" <img id="image3" src="https://udn.realityripple.com/samples/d2/
8ba7141ed1.gif" style="height: 50px; width: 500px;">...
... <!doctype html> <html lang="en"> <head> <title>changing color and font-size example</title> <script> function changetext() { var p = document.getelementbyid("pid"); p.style.color = "blue" p.style.fontsize = "1
8pt" } </script> </head> <body> <p id="pid" onclick="window.location.href = 'http://www.cnn.com/';">linker</p> <form> <p><input value="rec" type="button" onclick="changetext();" /></p> </form> </body> </html> example 4: using stylesheets the stylesheets property on the document object returns a list of the stylesheets that have been loaded on that document.
... <!doctype html> <html lang="en"> <head> <meta charset="utf-
8"/> <title>show event properties</title> <style> table { border-collapse: collapse; } thead { font-weight: bold; } td { padding: 2px 10px 2px 10px; } .odd { background-color: #efdfef; } .even { background-color: #ffffff; } </style> <script> function showeventproperties(e) { function addcell(row, text) { var cell = row.insertcell(-1); cell.appendchild(document.createtextnode(text)); ...
...'odd':'even'; addcell(row, row.rowindex); addcell(row, p); addcell(row, e[p]); } document.body.appendchild(table); } window.onload = function(event){ showeventproperties(event); } </script> </head> <body> <h1>properties of the dom <span id="eventtype"></span> event object</h1> </body> </html> example
8: using the dom table interface the dom htmltableelement interface provides some convenience methods for creating and manipulating tables.
ExtendableEvent - Web APIs
note: the behaviour described in the above paragraph was fixed in firefox 43 (see bug 11
80274.) this interface inherits from the event interface.
... <div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom:
8.57142
857142
8571%; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/extendableevent" ta...
...rget="_top"><rect x="116" y="1" width="150" height="50" fill="#f4f7f
8" 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.
... var cache_version = 1; var current_caches = { prefetch: 'prefetch-cache-v' + cache_version }; self.addeventlistener('install', function(event) { var urlstoprefetch = [ './static/pre_fetched.txt', './static/pre_fetched.html', 'https://www.chromium.org/_/rsrc/13022
86216006/config/customlogo.gif' ]; console.log('handling install event.
FileSystemDirectoryReader - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetfilesystemdirectoryreader deprecatednon-standardchrome full support
8alternate name full support
8alternate name alternate name uses the non-standard name: directoryreaderedge full support ≤1
8alternate name full support ≤1
8alternate name alternate name uses the non-standard name: webkitdirectoryreaderfirefox fu...
... the vendor prefix: webkitsafari full support 11.1webview android full support ≤37alternate name full support ≤37alternate name alternate name uses the non-standard name: directoryreaderchrome android full support 1
8alternate name full support 1
8alternate name alternate name uses the non-standard name: directoryreaderfirefox android full support 50opera android no support nosafari ios full support 11.3samsung internet android ...
... full support yesprefixed full support yesprefixed prefixed implemented with the vendor prefix: webkitreadentries deprecatednon-standardchrome full support
8edge ?
... safari full support 11.1webview android full support ≤37chrome android full support 1
8firefox android full support yesopera android no support nosafari ios full support 11.3samsung internet android ?
HTMLFormElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlformelement" target="_top"><rect x="341" y="65" width="150" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="416" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlformelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent, htmlelement.
... f.action = "a-different-url.cgi"; f.name = "a-different-name"; } </script> submit a <form> into a new window: <!doctype html> <html> <head> <meta charset="utf-
8"> <title>example new-window form submission</title> </head> <body> <form action="test.php" target="_blank"> <p><label>first name: <input type="text" name="firstname"></label></p> <p><label>last name: <input type="text" name="lastname"></label></p> <p><label><input type="password" name="pwd"></label></p> <fieldset> <legend>pet preference</legend> <p><label><input type="radio" nam...
HTMLImageElement.sizes - Web APIs
award-winning stuff, i'm sure.</p> <img src="/files/16
870/new-york-skyline-wide.jpg" srcset="/files/16
870/new-york-skyline-wide.jpg 3724w, /files/16
869/new-york-skyline-4by3.jpg 1961w, /files/16
871/new-york-skyline-tall.jpg 1060w" sizes="((min-width: 50em) and (max-width: 60em)) 50em, ((min-width: 30em) and (max-width: 50em)) 30em, (max-width: 30em) 20em"> <p>then there's even m...
...i sure can't.</p> <button id="break40">last width: 40em</button> <button id="break50">last width: 50em</button> </article> css article { margin: 1em; max-width: 60em; min-width: 20em; height: 100vh; border: 4em solid #
880e4f; border-radius: 7em; padding: 1.5em; font: 16px "open sans", verdana, arial, helvetica, sans-serif; } article img { display: block; max-width: 100%; border: 1px solid #
888; box-shadow: 0 0.5em 0.3em #
888; margin-bottom: 1.25em; } javascript the javascript code handles the two buttons that let you toggle the third width option between 40em and 50em; this is done by handling the click event, using the javascript string object method replace() to replace the relevant portion of...
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetsizes experimentalchrome full support 45edge full support 13firefox full support 3
8 full support 3
8 no support 33 — 52disabled disabled from version 33 until version 52 (exclusive): this feature is behind the dom.image.picture.enabled preference (needs to be set to true).
...no support noopera full support yessafari no support nowebview android full support 45chrome android full support 45firefox android full support 3
8 full support 3
8 no support 33 — 52disabled disabled from version 33 until version 52 (exclusive): this feature is behind the dom.image.picture.enabled preference (needs to be set to true).
HTMLMediaElement.onencrypted - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom:
8.57142
857142
8571%; 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 xlink: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-ba...
...seline="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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font...
...-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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="#d4...
...dde4"/><line x1="509" y1="90" x2="492" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlmediaelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="411" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlmediaelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} syntax htmlmediaelement.onencrypted = function(encrypted) { ...
HTMLMediaElement.onwaitingforkey - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom:
8.57142
857142
8571%; 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 xlink: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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2p...
...x" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlmediaelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="411" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlmediaelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} syntax htmlmediaelement.onwaitingforkey = function(waitingforkey) { ...
HTMLTextAreaElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmltextareaelement" target="_top"><rect x="301" y="65" width="190" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmltextareaelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties accesskey string: returns / sets the element's accesskey attribute.
...*/ { keycode: 3
8 }).keycode, // put here the maximum number of characters per line: ncols = 30, // put here the maximum number of lines: nrows = 5, nsels = ofield.selectionstart, nsele = ofield.selectionend, sval = ofield.value, nlen = sval.length, nbackward = nsels >= ncols ?
InstallEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom:
8.57142
857142
8571%; 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 xlink: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="3
8.5" y="30" font-size="12px" font-family="consolas,mon...
...aco,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 xlink: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 xlink:href="/docs/web/api/installevent" target="_top"><rect x="306" y="1" width="120"...
... height="50" fill="#f4f7f
8" 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-baseline="middle">installevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor installevent.installevent() creates a new installevent object.
... var cache_version = 1; var current_caches = { prefetch: 'prefetch-cache-v' + cache_version }; self.addeventlistener('install', function(event) { var urlstoprefetch = [ './static/pre_fetched.txt', './static/pre_fetched.html', 'https://www.chromium.org/_/rsrc/13022
86216006/config/customlogo.gif' ]; console.log('handling install event.
Location - Web APIs
anatomy of location html <span id="href" title="href"><span id="protocol" title="protocol">http:</span>//<span id="host" title="host"><span id="hostname" title="hostname">example.org</span>:<span id="port" title="port">
8888</span></span><span id="pathname" title="pathname">/foo/bar</span><span id="search" title="search">?q=baz</span><span id="hash" title="hash">#bang</span></span> css html, body {height:100%;} html {display:table; width:100%;} body {display:table-cell; text-align:center; vertical-align:middle; font-family:georgia; font-size:230%; line-height:1em; white-space:nowrap;} [title] {position:relative...
... font-family:monospace; position:absolute; top:100%; width:100%; left:50%; margin-left:-50%; font-size:40%; line-height:1.5; background:black;} [title]:hover:before, :target:before {background:black; color:yellow;} [title] [title]:before {margin-top:1.5em;} [title] [title] [title]:before {margin-top:3em;} [title]:hover, :target {position:relative; z-index:1; outline:50em solid rgba(255,255,255,.
8);} javascript [].foreach.call(document.queryselectorall('[title][id]'), function (node) { node.addeventlistener("click", function(e) { e.preventdefault(); e.stoppropagation(); window.location.hash = '#' + $(this).attr('id'); }); }); [].foreach.call(document.queryselectorall('[title]'), function (node) { node.addeventlistener("click", function(e) { e.preventdefault(); e...
... examples // create anchor element and use href property for the purpose of this example // a more correct alternative is to browse to the url and use document.location or window.location var url = document.createelement('a'); url.href = 'https://developer.mozilla.org:
80
80/search?q=url#search-results-close-container'; console.log(url.href); // https://developer.mozilla.org:
80
80/search?q=url#search-results-close-container console.log(url.protocol); // https: console.log(url.host); // developer.mozilla.org:
80
80 console.log(url.hostname); // developer.mozilla.org console.log(url.port); //
80
80 console.log(url.pathname); // /search console.log(url.
...search); // ?q=url console.log(url.hash); // #search-results-close-container console.log(url.origin); // https://developer.mozilla.org:
80
80 specifications specification status comment html living standardthe definition of 'location' in that specification.
PerformancePaintTiming - Web APIs
: 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 xlink: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="none"/><line x1="171" y1="25" x2="201" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/performancepainttiming" target="_top"><rect x="201" y="1" width...
...="220" height="50" fill="#f4f7f
8" 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".
...ance.getentriesbytype('paint'); performanceentries.foreach( (performanceentry, i, entries) => { console.log("the time to " + performanceentry.name + " was " + performanceentry.starttime + " milliseconds."); }); } else { console.log('performance timing isn\'t supported.'); } } the code above produces console output something like the following: the time to first-paint was 27
85.915 milliseconds.
... the time to first-contentful-paint was 27
87.460 milliseconds.
SVGEllipseElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svggeometryelement" target="_top"><rect x="
81" y="65" width="1
80" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="171" y="94" font-siz...
...e="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggeometryelement</text></a><polyline points="
81,
89 71,
84 71,94
81,
89" stroke="#d4dde4" fill="none"/><line x1="71" y1="
89" x2="41" y2="
89" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgellipseelement" target="_top"><rect x="-129" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="-44" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgellipseelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent interface, svggeometryelemen...
SVGLength - Web APIs
unsigned short unittype float value float valueinspecifiedunits domstring valueasstring constants svg_lengthtype_unknown = 0 svg_lengthtype_number = 1 svg_lengthtype_percentage = 2 svg_lengthtype_ems = 3 svg_lengthtype_exs = 4 svg_lengthtype_px = 5 svg_lengthtype_cm = 6 svg_lengthtype_mm = 7 svg_lengthtype_in =
8 svg_lengthtype_pt = 9 svg_lengthtype_pc = 10 normative document svg 1.1 (2nd edition) example <svg height="200" onload="start();" version="1.1" width="200" xmlns="http://www.w3.org/2000/svg"> <script type="text/javascript"><![cdata[ function start() { var rect = document.getelementbyid("myrect"); var val = rect.x.baseval; // read x in pixel and cm ...
...l.value + ", valueinspecifiedunits " + val.unittype + ": " + val.valueinspecifiedunits + ", valueasstring: " + val.valueasstring); } ]]></script> <rect id="myrect" x="1cm" y="1cm" fill="green" stroke="black" stroke-width="1" width="1cm" height="1cm" /> </svg> results on a desktop monitor (pixel units will be dpi-dependent): value: 37.795276641
8457, valueinspecifiedunits: 6: 1, valueasstring: 1cm value: 26.666666030
88379, valueinspecifiedunits 9: 20, valueasstring: 20pt value: 26.666666030
88379, valueinspecifiedunits
8: 0.277777761220932, valueasstring: 0.27777
8in constants name value description svg_lengthtype_unknown 0 the unit type is not one of predefined unit types.
... svg_lengthtype_in
8 a value was specified using the in units defined in css2.
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetsvglengthchrome full support yesedge full support ≤1
8firefox full support yesie ?
SVGLineElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svggeometryelement" target="_top"><rect x="
81" y="65" width="1
80" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="171" y="94" font-siz...
...e="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggeometryelement</text></a><polyline points="
81,
89 71,
84 71,94
81,
89" stroke="#d4dde4" fill="none"/><line x1="71" y1="
89" x2="41" y2="
89" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svglineelement" target="_top"><rect x="-99" y="65" width="140" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="-29" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svglineelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent, svggeometryelement.
SVGPathElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svggeometryelement" target="_top"><rect x="
81" y="65" width="1
80" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="171" y="94" font-siz...
...e="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggeometryelement</text></a><polyline points="
81,
89 71,
84 71,94
81,
89" stroke="#d4dde4" fill="none"/><line x1="71" y1="
89" x2="41" y2="
89" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgpathelement" target="_top"><rect x="-99" y="65" width="140" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="-29" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgpathelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} note: in svg 2 the getpathsegatlength() and createsvgpathseg* methods were removed and the pathlength ...
SVGPathSeg - Web APIs
constants pathseg_unknown = 0 pathseg_closepath = 1 pathseg_moveto_abs = 2 pathseg_moveto_rel = 3 pathseg_lineto_abs = 4 pathseg_lineto_rel = 5 pathseg_curveto_cubic_abs = 6 pathseg_curveto_cubic_rel = 7 pathseg_curveto_quadratic_abs =
8 pathseg_curveto_quadratic_rel = 9 pathseg_arc_abs = 10 pathseg_arc_rel = 11 pathseg_lineto_horizontal_abs = 12 pathseg_lineto_horizontal_rel = 13 pathseg_lineto_vertical_abs = 14 pathseg_lineto_vertical_rel = 15 pathseg_curveto_cubic_smooth_abs = 16 pathseg_curveto_cubic_smooth_rel = 17 ...
... pathseg_curveto_quadratic_smooth_abs = 1
8 pathseg_curveto_quadratic_smooth_rel = 19 normative document svg 1.1 (2nd edition) constants name value description pathseg_unknown 0 the unit type is not one of predefined types.
... pathseg_curveto_quadratic_abs
8 corresponds to an "absolute quadratic bézier curveto" (q) path data command.
... pathseg_curveto_quadratic_smooth_abs 1
8 corresponds to an "absolute smooth quadratic curveto" (t) path data command.
SVGPolygonElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svggeometryelement" target="_top"><rect x="
81" y="65" width="1
80" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="171" y="94" font-siz...
...e="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggeometryelement</text></a><polyline points="
81,
89 71,
84 71,94
81,
89" stroke="#d4dde4" fill="none"/><line x1="71" y1="
89" x2="41" y2="
89" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgpolygonelement" target="_top"><rect x="-129" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="-44" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgpolygonelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface doesn't implement any specific properties, but inherits properties fr...
SVGPolylineElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svggeometryelement" target="_top"><rect x="
81" y="65" width="1
80" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="171" y="94" font-siz...
...e="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggeometryelement</text></a><polyline points="
81,
89 71,
84 71,94
81,
89" stroke="#d4dde4" fill="none"/><line x1="71" y1="
89" x2="41" y2="
89" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgpolylineelement" target="_top"><rect x="-139" y="65" width="1
80" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="-49" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgpolylineelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface doesn't implement any specific properties, but inherits properties ...
SVGRectElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svggeometryelement" target="_top"><rect x="
81" y="65" width="1
80" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="171" y="94" font-siz...
...e="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggeometryelement</text></a><polyline points="
81,
89 71,
84 71,94
81,
89" stroke="#d4dde4" fill="none"/><line x1="71" y1="
89" x2="41" y2="
89" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgrectelement" target="_top"><rect x="-99" y="65" width="140" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="-29" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgrectelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent, svggeometryelement.
SVGSVGElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svgsvgelement" target="_top"><rect x="131" y="65" width="130" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="196" y="94" font-size...
...when the browser actually knows the physical size of a "screen unit", this float attribute will express that information; otherwise, user agents will provide a suitable default value (such as .2
8mm).
SVGTextPathElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svgtextcontentelement" target="_top"><rect x="51" y="65" width="210" height="50" fill="#fff" 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><polyline points="51,
89 41,
84 41,94 51,
89" stroke="#d4dde4" fill="none"/><line x1="41" y1="
89" x2="11" y2="
89" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgtextpathelement" target="_top"><rect x="-169" y="65" width="1
80" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="-79" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgtextpathelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constants method types name value description textpath_methodt...
SVGTextPositioningElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svgtextcontentelement" target="_top"><rect x="51" y="65" width="210" height="50" fill="#fff" 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><polyline points="51,
89 41,
84 41,94 51,
89" stroke="#d4dde4" fill="none"/><line x1="41" y1="
89" x2="11" y2="
89" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgtextpositioningelement" target="_top"><rect x="-239" y="65" width="250" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="-114" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgtextpositioningelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent, svgt...
Selection API - Web APIs
selectstart event handlers are supported as of firefox 52.ie full support 9opera full support 9safari full support 1webview android full support 1chrome android full support 1
8firefox android full support 4notes full support 4notes notes the globaleventhandlers.onselectionchange and globaleventhandlers.onselectstart event handlers are supported as of firefox 52.opera android full support 10.1safari ios full support ...
...firefox android full support yesopera android full support yessafari ios full support yessamsung internet android full support yesremoverange experimentalchrome full support 5
8edge full support 12firefox full support yesie ?
... opera full support 45safari no support nowebview android full support 5
8chrome android full support 5
8firefox android full support yesopera android full support 43safari ios no support nosamsung internet android full support 7.0selectallchildren experimentalchrome full support yesedge full support 12firefox full suppor...
... 55opera android full support yessafari ios full support yessamsung internet android full support yestostring experimentalchrome full support 1edge full support ≤1
8firefox full support yesie ?
TextDecoder - Web APIs
the textdecoder interface represents a decoder for a specific text encoding, such as utf-
8, iso-
8859-2, koi
8-r, gbk, etc.
... examples representing text with typed arrays this example shows how to decode a chinese/japanese character , as represented by five different typed arrays: uint
8array, int
8array, uint16array, int16array, and int32array.
... let utf
8decoder = new textdecoder(); // default 'utf-
8' or 'utf
8' let u
8arr = new uint
8array([240, 160, 174, 1
83]); let i
8arr = new int
8array([-16, -96, -
82, -73]); let u16arr = new uint16array([41200, 47022]); let i16arr = new int16array([-24336, -1
8514]); let i32arr = new int32array([-1213292304]); console.log(utf
8decoder.decode(u
8arr)); console.log(utf
8decoder.decode(i
8arr)); console.log(utf
8decoder.decode(u16arr)); console.log(utf
8decoder.decode(i16arr)); console.log(utf
8decoder.decode(i32arr)); handling non-utf
8 text in this example, we decode the russian text "Привет, мир!", which means "hello, world." in our textdecoder() constructor, we specify the windows-1251 character encoding, which is appropriate for cyrillic script.
... let win1251decoder = new textdecoder('windows-1251'); let bytes = new uint
8array([207, 240, 232, 226, 229, 242, 44, 32, 236, 232, 240, 33]); console.log(win1251decoder.decode(bytes)); // Привет, мир!
TextEncoder() - Web APIs
the textencoder() constructor returns a newly created utf-
8 textencoder object.
... syntax encoder = new textencoder(); parameters textencoder() takes no parameters since firefox 4
8 and chrome 53 note: prior to firefox 4
8 and chrome 53, an encoding type label was accepted as a paramer to the textencoder object, since then both browers have removed support for any encoder type other than utf-
8, to match the spec.
... any type label passed into the textencoder constructor will now be ignored and a utf-
8 textencoder will be created.
... exceptions textencoder() throws no exceptions since firefox 4
8 and chrome 53 note: prior to firefox 4
8 and chrome 53 an exception would be thrown for an unknown encoding type.
TransformStream - Web APIs
methods none examples anything-to-uint
8array stream in the following example, a transform stream passes through all chunks it receives as uint
8array values.
... async transform(chunk, controller) { chunk = await chunk switch (typeof chunk) { case 'object': // just say the stream is done i guess if (chunk === null) controller.terminate() else if (arraybuffer.isview(chunk)) controller.enqueue(new uint
8array(chunk.buffer, chunk.byteoffset, chunk.bytelength)) else if (array.isarray(chunk) && chunk.every(value => typeof value === 'number')) controller.enqueue(new uint
8array(chunk)) else if ('function' === typeof chunk.valueof && chunk.valueof() !== chunk) this.transform(chunk.valueof(), controller) // hack else if ('tojson' in chunk) this.transform(json.stringify(chunk), controller) break cas...
...e 'symbol': controller.error("cannot send a symbol as a chunk part") break case 'undefined': controller.error("cannot send undefined as a chunk part") default: controller.enqueue(this.textencoder.encode(string(chunk))) break }, flush() { /* do any destructor work here */ } } class anytou
8stream extends transformstream { constructor() { super({...transformcontent, textencoder: new textencoder()}) } } polyfilling textencoderstream and textdecoderstream note that this is deprecated by the native constructors.
...et(this).encoder.encoding} } similarly, textdecoderstream can be written as such: const tes = { start(){ this.decoder = new textdecoder(this.encoding, this.options) }, transform(chunk, controller) { controller.enqueue(this.decoder.decode(chunk)) } } let _jstds_wm = new weakmap(); /* info holder */ class jstextdecoderstream extends transformstream { constructor(encoding = 'utf-
8', {...options} = {}) { let t = {...tds, encoding, options} super(t) _jstes_wm.set(this, t) } get encoding() {return _jstds_wm.get(this).decoder.encoding} get fatal() {return _jstds_wm.get(this).decoder.fatal} get ignorebom() {return _jstds_wm.get(this).decoder.ignorebom} } chaining multiple readablestreams together this is a useful one, where multiple streams can be conjoi...
URLUtilsReadOnly - Web APIs
support noedge no support nofirefox full support 57 full support 57 no support 3.5 — 57notes notes firefox has a bug whereby single quotes contained in urls are escaped when accessed via url apis (see bug 13
866
83).ie no support noopera no support nosafari no support nowebview android no support nochrome android no support nofirefox android full support ...
... 57 full support 57 no support 4 — 57notes notes firefox has a bug whereby single quotes contained in urls are escaped when accessed via url apis (see bug 13
866
83).opera android no support nosafari ios no support nosamsung internet android no support nohash experimentalchrome no support noedge no support nofirefox full support 3
8 full support 3
8 no support 3.5 — 3
8no...
...tes notes before firefox 3
8, firefox returned the hash percent encoded.
... no support noopera no support nosafari no support nowebview android no support nochrome android no support nofirefox android full support 3
8 full support 3
8 no support 4 — 3
8notes notes before firefox 3
8, firefox returned the hash percent encoded.
WebGL2RenderingContext.texImage3D() - Web APIs
gl.r
8 gl.r16f gl.r32f gl.r
8ui gl.rg
8 gl.rg16f gl.rg32f gl.rgui gl.rgb
8 gl.srgb
8 gl.rgb565 gl.r11f_g11f_b10f gl.rgb9_e5 gl.rgb16f gl.rgb32f gl.rgb
8ui gl.rgba
8 gl.srgb_aplha
8 gl.rgb5_a1 gl.rgba4444 gl.rgba16f gl.rgba32f gl.rgba
8ui width a glsizei specifying the width of the texture.
...possible values: gl.unsigned_byte:
8 bits per channel for gl.rgba gl.unsigned_short_5_6_5: 5 red bits, 6 green bits, 5 blue bits.
... gl.byte gl.unsigned_short gl.short gl.unsigned_int gl.int gl.half_float gl.float gl.unsigned_int_2_10_10_10_rev gl.unsigned_int_10f_11f_11f_rev gl.unsigned_int_5_9_9_9_rev gl.unsigned_int_24_
8 gl.float_32_unsigned_int_24_
8_rev (pixels must be null) source one of the following objects can be used as a pixel source for the texture: arraybufferview, imagebitmap, imagedata, htmlimageelement, htmlcanvaselement, htmlvideoelement.
... // width 1, // height 1, // depth 0, // border gl.rgba, // format gl.unsigned_byte, // type new uint
8array([0xff, 0x00, 0x00, 0x00])); // data specifications specification status comment webgl 2.0the definition of 'teximage3d' in that specification.
WebGLRenderingContext.getParameter() - Web APIs
ext.compressed_srgb_s3tc_dxt1_ext ext.compressed_srgb_alpha_s3tc_dxt1_ext ext.compressed_srgb_alpha_s3tc_dxt3_ext ext.compressed_srgb_alpha_s3tc_dxt5_ext when using the webgl_compressed_texture_etc extension: ext.compressed_r11_eac ext.compressed_signed_r11_eac ext.compressed_rg11_eac ext.compressed_signed_rg11_eac ext.compressed_rgb
8_etc2 ext.compressed_rgba
8_etc2_eac ext.compressed_srgb
8_etc2 ext.compressed_srgb
8_alpha
8_etc2_eac ext.compressed_rgb
8_punchthrough_alpha1_etc2 ext.compressed_srgb
8_punchthrough_alpha1_etc2 when using the webgl_compressed_texture_pvrtc extension: ext.compressed_rgb_pvrtc_4bppv1_img ext.compressed_rgba_pvrtc_4bppv1_img ext.compressed_rgb_pvrtc_...
...e_etc1 extension: ext.compressed_rgb_etc1_webgl when using the webgl_compressed_texture_atc extension: ext.compressed_rgb_atc_webgl ext.compressed_rgba_atc_explicit_alpha_webgl ext.compressed_rgba_atc_interpolated_alpha_webgl when using the webgl_compressed_texture_astc extension: ext.compressed_rgba_astc_4x4_khr ext.compressed_srgb
8_alpha
8_astc_4x4_khr ext.compressed_rgba_astc_5x4_khr ext.compressed_srgb
8_alpha
8_astc_5x4_khr ext.compressed_rgba_astc_5x5_khr ext.compressed_srgb
8_alpha
8_astc_5x5_khr ext.compressed_rgba_astc_6x5_khr ext.compressed_srgb
8_alpha
8_astc_6x5_khr ext.compressed_rgba_astc_6x6_khr ext.compressed_srgb
8_alpha
8_astc_6x6_khr ext.compressed_rgba_astc_
8x5_khr ...
...ext.compressed_srgb
8_alpha
8_astc_
8x5_khr ext.compressed_rgba_astc_
8x6_khr ext.compressed_srgb
8_alpha
8_astc_
8x6_khr ext.compressed_rgba_astc_
8x
8_khr ext.compressed_srgb
8_alpha
8_astc_
8x
8_khr ext.compressed_rgba_astc_10x5_khr ext.compressed_srgb
8_alpha
8_astc_10x5_khr ext.compressed_rgba_astc_10x6_khr ext.compressed_srgb
8_alpha
8_astc_10x6_khr ext.compressed_rgba_astc_10x6_khr ext.compressed_srgb
8_alpha
8_astc_10x6_khr ext.compressed_rgba_astc_10x10_khr ext.compressed_srgb
8_alpha
8_astc_10x10_khr ext.compressed_rgba_astc_12x10_khr ext.compressed_srgb
8_alpha
8_astc_12x10_khr ext.compressed_rgba_astc_12x12_khr ext.compressed_srgb
8_alpha
8_astc_12x12_khr gl.cull_face glboolean gl.cull_face_...
... ext.draw_buffer0_webgl ext.draw_buffer1_webgl ext.draw_buffer2_webgl ext.draw_buffer3_webgl ext.draw_buffer4_webgl ext.draw_buffer5_webgl ext.draw_buffer6_webgl ext.draw_buffer7_webgl ext.draw_buffer
8_webgl ext.draw_buffer9_webgl ext.draw_buffer10_webgl ext.draw_buffer11_webgl ext.draw_buffer12_webgl ext.draw_buffer13_webgl ext.draw_buffer14_webgl ext.draw_buffer15_webgl glenum webgl_draw_buffers drawing buffers.
WebGLRenderingContext.vertexAttribPointer() - Web APIs
possible values: gl.byte: signed
8-bit integer, with values in [-12
8, 127] gl.short: signed 16-bit integer, with values in [-3276
8, 32767] gl.unsigned_byte: unsigned
8-bit integer, with values in [0, 255] gl.unsigned_short: unsigned 16-bit integer, with values in [0, 65535] gl.float: 32-bit ieee floating point number when using a webgl 2 context, the following values are available additionally: gl.half_float: 16-...
... normal vector: we need to store the x, y and z components of the normal vector, but since precision is not that important, we use
8-bit signed integers.
... for example, the following vertex: { "position": [1.0, 2.0, 1.5], "normal": [1.0, 0.0, 0.0], "texcoord": [0.5, 0.25] } will be stored in the array buffer as follows: 00 00
80 3f 00 00 00 40 00 00 0c 3f 7f 00 00 00 7f ff 3f ff creating the array buffer first, we dynamically create the array buffer from json data using a dataview.
...ponse = await fetch('assets/geometry.json'); const vertices = await response.json(); //create array buffer const buffer = new arraybuffer(20 * vertices.length); //fill array buffer const dv = new dataview(buffer); for (let i = 0; i < vertices.length; i++) { dv.setfloat32(20 * i, vertices[i].position[0], true); dv.setfloat32(20 * i + 4, vertices[i].position[1], true); dv.setfloat32(20 * i +
8, vertices[i].position[2], true); dv.setint
8(20 * i + 12, vertices[i].normal[0] * 0x7f); dv.setint
8(20 * i + 13, vertices[i].normal[1] * 0x7f); dv.setint
8(20 * i + 14, vertices[i].normal[2] * 0x7f); dv.setint
8(20 * i + 15, 0); dv.setuint16(20 * i + 16, vertices[i].texcoord[0] * 0xffff, true); dv.setuint16(20 * i + 1
8, vertices[i].texcoord[1] * 0xffff, true); } for higher performance, ...
Viewpoints and viewers: Simulating cameras in WebXR - Web APIs
thus a matrix that looks like this: [a1a5a9a13a2a6a10a14a3a7a11a15a4a
8a12a16]\left [ \begin{matrix} a_{1} & a_{5} & a_{9} & a_{13} \\ a_{2} & a_{6} & a_{10} & a_{14} \\ a_{3} & a_{7} & a_{11} & a_{15} \\ a_{4} & a_{
8} & a_{12} & a_{16} \end{matrix} \right ] is represented in array form like this: let matrixarray = [a1, a2, a3, a4, a5, a6, a7, a
8, a9, a10, a11, a12, a13, a14, a15, a16]; in this array, the leftmost column contains the entries a1,...
...human eyes typically have a horizontal field of view of around 135° (about 2.356 radians) and a vertical fov of about 1
80° (π or around 3.142 radians).
... the following function returns a projection perspective matrix that integrates the specified field of view angle as well as the given near and far clipping plane distances: function createperspectivematrix(viewport, fovdegrees, nearclip, farclip) { const fovradians = fov * (math.pi / 1
80.0); const aspectratio = viewport.width / viewport.height; const transform = mat4.create(); mat4.perspective(transform, fovradians, aspectratio, nearclip, farclip); return transform; } after converting the fov angle, fovdegrees, from degrees to radians and computing the aspect ratio of the xrviewport specified by the viewport parameter, this function uses the glmatrix...
...dividing this into two parts—half for each eye—results in each eye's view being drawn at a resolution of 12
80x1440 pixels.
window.postMessage() - Web APIs
the dispatched event otherwindow can listen for dispatched messages by executing the following javascript: window.addeventlistener("message", receivemessage, false); function receivemessage(event) { if (event.origin !== "http://example.org:
80
80") return; // ...
...examples of typical origins are https://example.org (implying port 443), http://example.net (implying port
80), and http://example.com:
80
80.
... example /* * in window a's scripts, with a being on <http://example.com:
80
80>: */ var popup = window.open(/* popup details */); // when the popup has fully loaded, if not blocked by a popup blocker: // this does nothing, assuming the window hasn't changed its location.
... if (event.origin !== "http://example.com:
80
80") return; // event.source is window.opener // event.data is "hello there!" // assuming you've verified the origin of the received message (which // you must do in any case), a convenient idiom for replying to a // message is to call postmessage on event.source and provide // event.origin as the targetorigin.
XRWebGLLayer.getNativeFramebufferScaleFactor() static method - Web APIs
for example, consider a device which uses a 2560x1440 pixel frame buffer (which is used to render two views, for the left and right eyes, side by side each at a resolution of 12
80x1440 pixels).
... now the width and height of the frame buffer are 50% what they were before, resulting in a total frame buffer size of 12
80 by 720 pixels, with each eye's half of the buffer being 640x720 pixels.
...the result is a rendering context that looks like the diagram below: each time the xrviewerpose's views are iterated over for rendering, the rendering loop obtains an xrview for the left eye which has its top-left corner at (0, 0) with its width and height being 12
80x1440 pixels.
... the right eye it obtains has its top-left corner at 12
80, 0 with the same width and height: 12
80x1440.
ARIA: cell role - Accessibility
examples <div role="table" aria-label="semantic elements" aria-describedby="semantic_elements_table_desc" aria-rowcount="
81"> <div id="semantic_elements_table_desc">semantic elements to use instead of aria's roles</div> <div role="rowgroup"> <div role="row"> <span role="columnheader" aria-sort="none" aria-rowindex="1">aria role</span> <span role="columnheader" aria-sort="none" aria-rowindex="1">semantic element</span> </div> </div> <div role="rowgroup"> <div role="row"> <s...
...pan role="cell" aria-rowindex="11">header</span> <span role="cell" aria-rowindex="11">h1</span> </div> <div role="row"> <span role="cell" aria-rowindex="16">header</span> <span role="cell" aria-rowindex="16">h6</span> </div> <div role="row"> <span role="cell" aria-rowindex="1
8">rowgroup</span> <span role="cell" aria-rowindex="1
8">thead</span> </div> <div role="row"> <span role="cell" aria-rowindex="24">term</span> <span role="cell" aria-rowindex="24">dt</span> </div> </div> </div> the above is a non-semantic aria table with five of
81 rows present in the dom: one within a table header and four rows within the table body.
... <table role="table" aria-label="semantic elements" aria-describedby="semantic_elements_table_desc" aria-rowcount="
81"> <caption id="semantic_elements_table_desc">semantic elements to use instead of aria's roles</caption> <thead role="rowgroup"> <tr role="row"> <th role="columnheader" aria-sort="none" aria-rowindex="1">aria role</th> <th role="columnheader" aria-sort="none" aria-rowindex="1">semantic element</th> </tr> </thead> <tbody role="rowgroup"> ...
... <tr role="row"> <td role="cell" aria-rowindex="11">header</td> <td role="cell" aria-rowindex="11">h1</td> </tr> <tr role="row"> <td role="cell" aria-rowindex="16">header</td> <td role="cell" aria-rowindex="16">h6</td> </tr> <tr role="row"> <td role="cell" aria-rowindex="1
8">rowgroup</td> <td role="cell" aria-rowindex="1
8">thead</td> </tr> <tr role="row"> <td role="cell" aria-rowindex="24">term</td> <td role="cell" aria-rowindex="24">dt</td> </tr> </tbody> </table> above is the semantic way of writing a table.
ARIA: row role - Accessibility
examples <div role="table" aria-label="semantic elements" aria-describedby="semantic_elements_table_desc" aria-rowcount="
81"> <div id="semantic_elements_table_desc">semantic elements to use instead of aria's roles</div> <div role="rowgroup"> <div role="row"> <span role="columnheader" aria-sort="none">aria role</span> <span role="columnheader" aria-sort="none">semantic element</span> </div> </div> <div role="rowgroup"> <div role="row" aria-rowindex="11"> <span role="cell">h...
...eader</span> <span role="cell">h1</span> </div> <div role="row" aria-rowindex="16"> <span role="cell">header</span> <span role="cell">h6</span> </div> <div role="row" aria-rowindex="1
8"> <span role="cell">rowgroup</span> <span role="cell">thead</span> </div> <div role="row" aria-rowindex="24"> <span role="cell">term</span> <span role="cell">dt</span> </div> </div> </div> the above is a non-semantic aria table with five of
81 rows present in the dom: one within a table header and four rows within the table body.
... <table role="table" aria-label="semantic elements" aria-describedby="semantic_elements_table_desc" aria-rowcount="
81"> <caption id="semantic_elements_table_desc">semantic elements to use instead of aria's roles</caption> <thead role="rowgroup"> <tr role="row"> <th role="columnheader" aria-sort="none">aria role</th> <th role="columnheader" aria-sort="none">semantic element</th> </tr> </thead> <tbody role="rowgroup"> <tr role="row" aria-rowindex="1...
...1"> <td role="cell">header</td> <td role="cell">h1</td> </tr> <tr role="row" aria-rowindex="16"> <td role="cell">header</td> <td role="cell">h6</td> </tr> <tr role="row" aria-rowindex="1
8"> <td role="cell">rowgroup</td> <td role="cell">thead</td> </tr> <tr role="row" aria-rowindex="24"> <td role="cell">term</td> <td role="cell">dt</td> </tr> </tbody> </table> above is the semantic way of writing a table.
Web Accessibility: Understanding Colors and Luminance - Accessibility
that this color, which has low luminance, can be made legible if "care was taken to acheive adequate luminance contrast" (from the article, designing with blue) wcag 2.1 defines relative luminance as follows (as of july 2019): for the srgb colorspace, the relative luminance of a color is defined as l = 0.2126 * r + 0.7152 * g+ 0.0722 * b where r, g and b are defined as: if rsrgb <= 0.0392
8 then r = rsrgb/12.92 else r = ((rsrgb+0.055)/1.055) ^ 2.4 if gsrgb <= 0.0392
8 then g = gsrgb/12.92 else g = ((gsrgb+0.055)/1.055) ^ 2.4 if bsrgb <= 0.0392
8 then b = bsrgb/12.92 else b = ((bsrgb+0.055)/1.055) ^ 2.4 and rsrgb, gsrgb, and bsrgb are defined as: rsrgb = r
8bit/255 gsrgb = g
8bit/255 bsrgb = b
8bit/255 the "^" character is the exponentiation operator.
...for example, in addition to the color #990000 described above, the color #
8b0000 also has a saturation of 100%.
... the "math" for the calculations is spelled out in wcag 2.1 in the definition for relative luminance, and is as follows: for the srgb colorspace, the relative luminance of a color is defined as l = 0.2126 * r + 0.7152 * g+ 0.0722 * b where r, g and b are defined as: if rsrgb <= 0.0392
8 then r = rsrgb/12.92 else r = ((rsrgb+0.055)/1.055) ^ 2.4 if gsrgb <= 0.0392
8 then g = gsrgb/12.92 else g = ((gsrgb+0.055)/1.055) ^ 2.4 if bsrgb <= 0.0392
8 then b = bsrgb/12.92 else b = ((bsrgb+0.055)/1.055) ^ 2.4 and rsrgb, gsrgb, and bsrgb are defined as: rsrgb = r
8bit/255 gsrgb = g
8bit/255 bsrgb = b
8bit/255 there is active discussion and investigation underway concerning relative lu...
...macknik on november 1, 2014 scientific papers photic- and pattern-induced seizures: expert consensus of the epilepsy foundation of america working group w3c issues and discussions contrast ratio math and related visual issues #695 luminance / luma confusion #236 outdated threshold for srgb companding in the "relative luminance" definition #30
8 non-srgb color spaces, outdated srgb threshold, and other issues in the "relative luminance" definition #360 w3c resources css color module level 3 css color module level 4 ensuring that a contrast ratio of 3:1 is provided for icons understanding success criterion 1.4.3: contrast (minimum) wcag working group's wiki page on relative luminance contributers many, many thanks to wayne di...
@charset - CSS: Cascading Style Sheets
@charset "utf-
8"; this at-rule is useful when using non-ascii characters in some css properties, like content.
... assume that the document is utf-
8 syntax @charset "utf-
8"; @charset "iso-
8859-15"; where: charset is a <string> denoting the character encoding to be used.
... formal syntax @charset "<charset>"; examples valid and invalid charset declarations @charset "utf-
8"; /* set the encoding of the style sheet to unicode utf-
8 */ @charset 'iso-
8859-15'; /* invalid, wrong quoting style used */ @charset "utf-
8"; /* invalid, more than one space */ @charset "utf-
8"; /* invalid, there is a character (a space) before the at-rule */ @charset utf-
8; /* invalid, without ' or ", the charset is not a css <string> */ specifications spec...
...ive), internet explorer supported an invalid syntax where the character encoding is not between single or double quotes.opera full support 9safari full support 4webview android full support 2chrome android full support 1
8firefox android full support 4opera android full support 10.1safari ios full support 4samsung internet android full support 1.0legend full support full...
-ms-high-contrast - CSS: Cascading Style Sheets
no longer supported as of microsoft edge 1
8.
... remarks as of microsoft edge 1
8, -ms-high-contrast: none is no longer supported.
... microsoft edge versions 1
8 and higher will be using the forced-colors media feature instead, but the forced-colors media feature specification is still being actively worked on.
... the -ms-high-contrast media feature was introduced in windows
8.
size - CSS: Cascading Style Sheets
<page-size> a5 this matches the standard, iso dimensions: 14
8mm x 210mm.
... jis-b5 this correspond to the jis standard dimensions: 1
82mm x 257mm.
...
8.5in x 11in.
...
8.5in x 14in.
@supports - CSS: Cascading Style Sheets
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internet@supportschrome full support 2
8edge full support 12firefox full support 22 full support 22 no support 17 — 22disabled disabled from version 17 until version 22 (exclusive): this feature is behind the layout.css.supports-rule.enabled preference (needs to be set to true...
...o change preferences in firefox, visit about:config.ie no support noopera full support 12.1safari full support 9webview android full support ≤37chrome android full support 2
8firefox android full support 22 full support 22 no support 17 — 22disabled disabled from version 17 until version 22 (exclusive): this feature is behind the layout.css.supports-rule.enabled preference (needs to be set to true).
... to change preferences in firefox, visit about:config.opera android full support 12.1safari ios full support 9samsung internet android full support 1.5selector()chrome full support
83edge full support
83firefox full support 69 full support 69 full support 64disabled disabled from version 64: this feature is behind the layout.css.supports-selector.enabled preference (needs to be set to true).
...preferences in firefox, visit about:config.ie no support noopera full support 69safari no support nonotes no support nonotes notes see bug 199237webview android full support
83chrome android full support
83firefox android full support 64disabled full support 64disabled disabled from version 64: this feature is behind the layout.css.supports-selector.enabled preference (needs to be set to true).
Border-radius generator - CSS: Cascading Style Sheets
box" data-topic='bottom-left'></div> </div> <div id="unit-selection"> <div class="info"> select border units </div> </div> </div> </div> </div> css content /* grid of ten * ========================================================================== */ .span_12 { width: 100%; } .span_11 { width: 91.46%; } .span_10 { width:
83%; } .span_9 { width: 74.54%; } .span_
8 { width: 66.0
8%; } .span_7 { width: 57.62%; } .span_6 { width: 49.16%; } .span_5 { width: 40.7%; } .span_4 { width: 32.24%; } .span_3 { width: 23.7
8%; } .span_2 { width: 15.32%; } .span_1 { width: 6.
86%; } /* sections * ========================================================================== */ .section { clear: both; padding: 0...
...ext-align: center; font-size: 16px; font-family: "segoe ui", arial, helvetica, sans-serif; line-height: 1.5em; color: #fff; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .ui-checkbox > input { display: none; } .ui-checkbox > label { font-size: 12px; padding: 0.333em 1.666em 0.5em; height: 1em; line-height: 1em; background-color: #
888; background-image: url("https://mdn.mozillademos.org/files/56
83/disabled.png"); background-position: center center; background-repeat: no-repeat; color: #fff; border-radius: 3px; font-weight: bold; float: left; } .ui-checkbox .text { padding-left: 34px; background-position: center left 10px; } .ui-checkbox .left { padding-right: 34px; padding-left: 1.666em; background-position: c...
...enter right 10px; } .ui-checkbox > label:hover { cursor: pointer; } .ui-checkbox > input:checked + label { background-image: url("https://mdn.mozillademos.org/files/56
81/checked.png"); background-color: #379b4a; } body { max-width: 1000px; margin: 0 auto; font-family: "segoe ui", arial, helvetica, sans-serif; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; } #container { width: 100%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } /******************************************************************************/ /******************************************************************************/ /* * pre...
... position: absolute; overflow: hidden; } #unit-selection select { width: 50px; height: 20px; marign: 0; padding: 0 0 0 10px; background: #555; border: 1px solid #555; border: none; color: #fff; float: left; } #unit-selection select option { background: #fff; color: #333; } #unit-selection select:hover { cursor: pointer; } #unit-selection .dropdown:before { content: ""; width: 1
8px; height: 20px; display: block; background-color: #555; background-image: url("https://mdn.mozillademos.org/files/5675/dropdown.png"); background-position: center center; background-repeat: no-repeat; top: 0px; right: 0px; position: absolute; z-index: 1; pointer-events: none; } #unit-selection .unit-top-left { top: 0; left: 0; display: none; } #unit-selection .unit-top-left-w { ...
CSS Grid Layout and Progressive Enhancement - CSS: Cascading Style Sheets
grid-template-columns: 1fr 2fr; grid-template-areas: "img content"; margin-bottom: 1em; } .media::after { content: ""; display: block; clear: both; } .media .image { float: left; width: 150px; margin-right: 20px; } .media .text { padding: 10px; align-self: end; } <div class="media"> <div class="image"><img src="https://udn.realityripple.com/samples/
89/f993f273dd.png" alt="placeholder"></div> <div class="text">this is a media object example.
...to create gaps between the cards, i use a margin on the items, and then a negative margin on the container: * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; max-width: 600px; margin: 0 auto; } .wrapper li { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } .wrapper ul { overflow: hidden; margin: 0 -10px; padding: 0; list-style: none; } .wrapper li { float: left; width: calc(33.333333% - 20px); margin: 0 10px 20px 10px; } <div class="wrapper"> <ul> <li class="card"><h2>one</h2> <p>we can use css grid to overwrite older methods.</p> </li> ...
...the layout now works, even if there is more content in one of the cards, than the others: * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; max-width: 600px; margin: 0 auto; } .wrapper li { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } .wrapper ul { overflow: hidden; margin: 0 -10px; padding: 0; list-style: none; } .wrapper li { float: left; width: calc(33.333333% - 20px); margin: 0 10px 20px 10px; } @supports (display: grid) { .wrapper ul { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 20px; margin: 0...
...e-block display mode, but this property does not apply to grid items and, therefore, is ignored once the item becomes a grid item: * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; max-width: 600px; margin: 0 auto; } .wrapper li { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } .wrapper ul { margin: 0 -10px; padding: 0; list-style: none; } .wrapper li { display: inline-block; vertical-align: top; width: calc(33.333333% - 20px); margin: 0 10px 20px 10px; } @supports (display: grid) { .wrapper ul { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 20px; ...
animation - CSS: Cascading Style Sheets
</div> </div> </div> </div> html,body { height: 100%; box-sizing: border-box; } pre { margin-bottom: 0; } svg { width: 1.5em; height: 1.5em; } button { width: 27px; height: 27px; background-size: 16px; background-position: center; background-repeat: no-repeat; border-radius: 3px; cursor: pointer; } button.play { background-image: url('data:image/svg+xml;charset=utf-
8,%3csvg%20xmlns%3d%22http%3a%2f%2fwww.w3.org%2f2000%2fsvg%22%20viewbox%3d%220%200%2016%2016%22%3e%3cstyle%3epath%20%7bdisplay%3anone%7d%20path%3atarget%7bdisplay%3ablock%7d%3c%2fstyle%3e%3cpath%20id%3d%22play%22%20d%3d%22m3%2c3%20l3%2c13%20l13%2c
8%20z%22%20%2f%3e%3cpath%20id%3d%22pause%22%20d%3d%22m5%2c4%20l7%2c4%20l7%2c13%20l5%2c13%20z%20m9%2c4%20l11%2c4%20l11%2c13%20l9%2c13%20z%22%20%2f%3e%3cpat...
...h%20id%3d%22restart%22%20d%3d%22m13%2c9%20a5%2c5%2c1%2c1%2c1%2c
8%2c4%20l
8%2c2%20l12%2c5%20l
8%2c
8%20l
8%2c6%20a3%2c3%2c1%2c1%2c0%2c11%2c9%20a1%2c1%2c1%2c1%2c1%2c13%2c9%20z%22%20%2f%3e%3c%2fsvg%3e#play'); } button.pause { background-image: url('data:image/svg+xml;charset=utf-
8,%3csvg%20xmlns%3d%22http%3a%2f%2fwww.w3.org%2f2000%2fsvg%22%20viewbox%3d%220%200%2016%2016%22%3e%3cstyle%3epath%20%7bdisplay%3anone%7d%20path%3atarget%7bdisplay%3ablock%7d%3c%2fstyle%3e%3cpath%20id%3d%22play%22%20d%3d%22m3%2c3%20l3%2c13%20l13%2c
8%20z%22%20%2f%3e%3cpath%20id%3d%22pause%22%20d%3d%22m5%2c4%20l7%2c4%20l7%2c13%20l5%2c13%20z%20m9%2c4%20l11%2c4%20l11%2c13%20l9%2c13%20z%22%20%2f%3e%3cpath%20id%3d%22restart%22%20d%3d%22m13%2c9%20a5%2c5%2c1%2c1%2c1%2c
8%2c4%20l
8%2c2%20l12%2c5%20l
8%2c
8%20l
8%2c6%20a3%2c3%2c1%2c1%2...
...c0%2c11%2c9%20a1%2c1%2c1%2c1%2c1%2c13%2c9%20z%22%20%2f%3e%3c%2fsvg%3e#pause'); } button.restart { background-image: url('data:image/svg+xml;charset=utf-
8,%3csvg%20xmlns%3d%22http%3a%2f%2fwww.w3.org%2f2000%2fsvg%22%20viewbox%3d%220%200%2016%2016%22%3e%3cstyle%3epath%20%7bdisplay%3anone%7d%20path%3atarget%7bdisplay%3ablock%7d%3c%2fstyle%3e%3cpath%20id%3d%22play%22%20d%3d%22m3%2c3%20l3%2c13%20l13%2c
8%20z%22%20%2f%3e%3cpath%20id%3d%22pause%22%20d%3d%22m5%2c4%20l7%2c4%20l7%2c13%20l5%2c13%20z%20m9%2c4%20l11%2c4%20l11%2c13%20l9%2c13%20z%22%20%2f%3e%3cpath%20id%3d%22restart%22%20d%3d%22m13%2c9%20a5%2c5%2c1%2c1%2c1%2c
8%2c4%20l
8%2c2%20l12%2c5%20l
8%2c
8%20l
8%2c6%20a3%2c3%2c1%2c1%2c0%2c11%2c9%20a1%2c1%2c1%2c1%2c1%2c13%2c9%20z%22%20%2f%3e%3c%2fsvg%3e#restart'); } .grid { width: 100%; height: 100%...
...: flex; flex: 1 auto; flex-direction: row; flex-wrap: wrap; justify-content: space-between; } .col { display: flex; flex: 1 auto; flex-direction: column; } .cell { box-sizing: border-box; margin: .5em; padding: 0; background-color: #fff; overflow: hidden; text-align: left; } .flx { flex: 1 0; } .note { background: #fff3d4; padding: 1em; margin: .5em; font: .
8em sans-serif; text-align: left; flex: none; } .overlay { padding: .5em; } @keyframes slidein { from { transform: scalex(0); } to { transform: scalex(1); } } .a1 { animation: 3s ease-in 1s 2 reverse both paused slidein; } .a2 { animation: 3s linear 1s slidein; } .a3 { animation: 3s slidein; } .animation { background: #3f
87a6; width: 100%; height: calc(100% - 1.5em); transform-o...
calc() - CSS: Cascading Style Sheets
syntax /* property: calc(expression) */ width: calc(100% -
80px); the calc() function takes a single expression as its parameter, with the expression's result used as the value.
...for instance, calc(50% -
8px) will be parsed as a percentage followed by a negative length — an invalid expression — while calc(50% -
8px) is a percentage followed by a subtraction operator and a length.
... likewise, calc(
8px + -50%) is treated as a length followed by an addition operator and a negative percentage.
...in this example, the css creates a banner that stretches across the window, with a 40-pixel gap between both sides of the banner and the edges of the window: .banner { position: absolute; left: 40px; width: calc(100% -
80px); border: solid black 1px; box-shadow: 1px 2px; background-color: yellow; padding: 6px; text-align: center; box-sizing: border-box; } <div class="banner">this is a banner!</div> automatically sizing form fields to fit their container another use case for calc() is to help ensure that form fields fit in the available space, without extruding past the edge of their container, w...
<easing-function> - CSS: Cascading Style Sheets
this keyword represents the easing function cubic-bezier(0.42, 0.0, 0.5
8, 1.0).
...this keyword represents the easing function cubic-bezier(0.0, 0.0, 0.5
8, 1.0).
...ton">start animation</button> </li> <li> <label for="easing-select">choose an easing function:</label> <select id="easing-select"> <option selected>linear</option> <option>ease</option> <option>ease-in</option> <option>ease-in-out</option> <option>ease-out</option> <option>cubic-bezier(0.1, -0.6, 0.2, 0)</option> <option>cubic-bezier(0, 1.1, 0.
8, 4)</option> <option>steps(5, end)</option> <option>steps(3, start)</option> <option>steps(4)</option> </select> </li> </ul> css body > div { position: relative; height: 100px; } div > div { position: absolute; width: 50px; height: 50px; background-color: blue; background-image: radial-gradient(circle at 10px 10px, rgba(25,255,255,0.
8),rgba(25,255,255,0.4)...
...*/ cubic-bezier(0, 1.1, 0.
8, 4) these cubic bézier curves definitions are invalid: /* though the animated output type may be a color, bézier curves work w/ numerical ratios.*/ cubic-bezier(0.1, red, 1.0, green) /* abscissas must be in the [0, 1] range or the curve is not a function of time.
max-height - CSS: Cascading Style Sheets
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetmax-heightchrome full support 1
8edge full support 12firefox full support 1notes full support 1notes notes css 2.1 leaves the behavior of max-height with table undefined.
...opera supports applying max-height to table elements.safari full support 1.3webview android full support ≤37chrome android full support 1
8firefox android full support 4opera android full support 14safari ios full support 1samsung internet android full support 1.0fit-content experimentalchrome full support 46 ...
... full support 11 full support 11 full support 9prefixed prefixed implemented with the vendor prefix: -webkit-samsung internet android full support 5.0stretch experimentalchrome full support 2
8alternate name full support 2
8alternate name alternate name uses the non-standard name: -webkit-fill-availableedge full support 79alternate name full support 79alternate name alternate name uses the non-standard name: -webkit-fill-availablefirefox ...
...ame: -webkit-fill-availablesafari no support nowebview android full support 4.4alternate name full support 4.4alternate name alternate name uses the non-standard name: -webkit-fill-availablechrome android full support 2
8alternate name full support 2
8alternate name alternate name uses the non-standard name: -webkit-fill-availablefirefox android no support noopera android full support 15alternate name full support 15alternate name alter...
transition-delay - CSS: Cascading Style Sheets
-webkit-transition-duration:2s; -webkit-transition-delay:0.5s; -webkit-transition-timing-function: linear; transition-property: width height background-color font-size left top color; transition-duration:2s; transition-delay:0.5s; transition-timing-function: linear; } .box1{ width: 50px; height: 50px; background-color: blue; color: yellow; font-size: 1
8px; left: 150px; top:25px; position:absolute; -webkit-transition-property: width height background-color font-size left top color; -webkit-transition-duration:2s; -webkit-transition-delay:0.5s; -webkit-transition-timing-function: linear; transition-property: width height background-color font-size left top color; transition-duration:2s; transition-delay:0.5...
...; -webkit-transition-duration:2s; -webkit-transition-delay:1s; -webkit-transition-timing-function: linear; transition-property: width height background-color font-size left top color; transition-duration:2s; transition-delay:1s; transition-timing-function: linear; } .box1{ width: 50px; height: 50px; background-color: blue; color: yellow; font-size: 1
8px; left: 150px; top:25px; position:absolute; -webkit-transition-property: width height background-color font-size left top color; -webkit-transition-duration:2s; -webkit-transition-delay:1s; -webkit-transition-timing-function: linear; transition-property: width height background-color font-size left top color; transition-duration:2s; transition-delay:1s; ...
...; -webkit-transition-duration:2s; -webkit-transition-delay:2s; -webkit-transition-timing-function: linear; transition-property: width height background-color font-size left top color; transition-duration:2s; transition-delay:2s; transition-timing-function: linear; } .box1{ width: 50px; height: 50px; background-color: blue; color: yellow; font-size: 1
8px; left: 150px; top:25px; position:absolute; -webkit-transition-property: width height background-color font-size left top color; -webkit-transition-duration:2s; -webkit-transition-delay:2s; -webkit-transition-timing-function: linear; transition-property: width height background-color font-size left top color; transition-duration:2s; transition-delay:2s; ...
...kit-transition-duration:2s; -webkit-transition-delay:4s; -webkit-transition-timing-function: ease-in-out; transition-property: width height background-color font-size left top color; transition-duration:2s; transition-delay:4s; transition-timing-function: ease-in-out; } .box1{ width: 50px; height: 50px; background-color: blue; color: yellow; font-size: 1
8px; left: 150px; top:25px; position:absolute; -webkit-transition-property: width height background-color font-size left top color; -webkit-transition-duration:2s; -webkit-transition-delay:4s; -webkit-transition-timing-function: ease-in-out; transition-property: width height background-color font-size left top color; transition-duration:2s; transition-delay:4...
transition-duration - CSS: Cascading Style Sheets
ansition-timing-function: ease-in-out; transition-property: width height background-color font-size left top transform -webkit-transform color; transition-duration:0.5s; transition-timing-function: ease-in-out; } .box1{ transform: rotate(270deg); -webkit-transform: rotate(270deg); width: 50px; height: 50px; background-color: blue; color: yellow; font-size: 1
8px; left: 150px; top:25px; position:absolute; -webkit-transition-property: width height background-color font-size left top transform -webkit-transform color; -webkit-transition-duration:0.5s; -webkit-transition-timing-function: ease-in-out; transition-property: width height background-color font-size left top transform -webkit-transformv color; transition-duration:...
...n:1s; -webkit-transition-timing-function: ease-in-out; transition-property: width height background-color font-size left top transform color; transition-duration:1s; transition-timing-function: ease-in-out; } .box1{ transform: rotate(270deg); -webkit-transform: rotate(270deg); width: 50px; height: 50px; background-color: blue; color: yellow; font-size: 1
8px; left: 150px; top:25px; position:absolute; -webkit-transition-property: width height background-color font-size left top -webkit-transform transform color; -webkit-transition-duration:1s; -webkit-transition-timing-function: ease-in-out; transition-property: width height background-color font-size left top transform -webkit-transform color; transition-duration:1s;...
...transition-timing-function: ease-in-out; transition-property: width height background-color font-size left top transform -webkit-transform color; transition-duration:2s; transition-timing-function: ease-in-out; } .box1{ transform: rotate(270deg); -webkit-transform: rotate(270deg); width: 50px; height: 50px; background-color: blue; color: yellow; font-size: 1
8px; left: 150px; top:25px; position:absolute; -webkit-transition-property: width height background-color font-size left top transform -webkit-transform color; -webkit-transition-duration:2s; -webkit-transition-timing-function: ease-in-out; transition-property: width height background-color font-size left top transform -webkit-transform color; transition-duration:2s;...
...transition-timing-function: ease-in-out; transition-property: width height background-color font-size left top transform -webkit-transform color; transition-duration:4s; transition-timing-function: ease-in-out; } .box1{ transform: rotate(270deg); -webkit-transform: rotate(270deg); width: 50px; height: 50px; background-color: blue; color: yellow; font-size: 1
8px; left: 150px; top:25px; position:absolute; -webkit-transition-property: width height background-color font-size left top transform -webkit-transform color; -webkit-transition-duration:4s; -webkit-transition-timing-function: ease-in-out; transition-property: width height background-color font-size left top transform -webkit-transform color; transition-duration:4s;...
Introduction to HTML5 - Developer guides
gecko began supporting some html5 features in version 1.
8.1.
...now, it is very simple: <meta charset="utf-
8"> place this right after your <head>, as some browsers restart the parsing of an html document if the declared character set is different from what they had anticipated.
... also, if you are not currently using utf-
8, it's recommended that you switch to it in your web pages, as it simplifies character handling in documents using different scripts.
... note that html5 restricts character sets to those compatible with ascii and using at least
8 bits.
<img>: The Image Embed element - HTML: Hypertext Markup Language
<img src="https://udn.realityripple.com/samples/6c/9
84
85e5d
8a.png" alt="mdn logo"> image link this example builds upon the previous one, showing how to turn the image into a link.
... <a href="https://developer.mozilla.org"> <img src="https://udn.realityripple.com/samples/6c/9
84
85e5d
8a.png" alt="visit the mdn site"> </a> using the srcset attribute in this example we include a srcset attribute with a reference to a high-resolution version of the logo; this will be loaded instead of the src image on high-resolution devices.
... <img src="https://udn.realityripple.com/samples/61/
869e27c
81e.png" alt="mdn logo" srcset="/static/external/6c/6c9
84
85e5d
8acac9fecd7
824ce30c95
87f0d
854
8b946ee9fb1293d2eccdb6cf1.png 2x"> using the srcset and sizes attributes the src attribute is ignored in user agents that support srcset when w descriptors are included.
... <img src="/files/16
864/clock-demo-200px.png" alt="clock" srcset="/files/16
864/clock-demo-200px.png 200w, /files/16797/clock-demo-400px.png 400w" sizes="(max-width: 600px) 200px, 50vw"> to see the resizing in action, view the example on a separate page, so you can actually resize the content area.
<input type="file"> - HTML: Hypertext Markup Language
note: you can set as well as get the value of htmlinputelement.files in all modern browsers; this was most recently added to firefox, in version 57 (see bug 13
84030).
...part/form-data"> <div> <label for="image_uploads">choose images to upload (png, jpg)</label> <input type="file" id="image_uploads" name="image_uploads" accept=".jpg, .jpeg, .png" multiple> </div> <div class="preview"> <p>no files currently selected for upload</p> </div> <div> <button>submit</button> </div> </form> html { font-family: sans-serif; } form { width: 5
80px; background: #ccc; margin: 0 auto; padding: 20px; border: 1px solid black; } form ol { padding-left: 0; } form li, div > p { background: #eee; display: flex; justify-content: space-between; margin-bottom: 10px; list-style-type: none; border: 1px solid black; } form img { height: 64px; order: 1; } form p { line-height: 32px; padding-left: 10px; } form label, f...
...orm button { background-color: #7f9ccb; padding: 5px 10px; border-radius: 5px; border: 1px ridge black; font-size: 0.
8rem; height: auto; } form label:hover, form button:hover { background-color: #2d5ba3; color: white; } form label:active, form button:active { background-color: #0d3f
8f; color: white; } this is similar to what we've seen before — nothing special to comment on.
... function returnfilesize(number) { if(number < 1024) { return number + 'bytes'; } else if(number >= 1024 && number < 104
8576) { return (number/1024).tofixed(1) + 'kb'; } else if(number >= 104
8576) { return (number/104
8576).tofixed(1) + 'mb'; } } the example looks like this; have a play: specifications specification status comment html living standardthe definition of '<input type="file">' in that specification.
<input type="number"> - HTML: Hypertext Markup Language
there seems to be some disagreement about this among browsers; see bug 139
852
8.
... <input id="ticketnum" type="number" name="ticketnum" list="defaultnumbers"> <span class="validity"></span> <datalist id="defaultnumbers"> <option value="1004567
8"> <option value="103421"> <option value="11111111"> <option value="1234567
8"> <option value="12999922"> </datalist> use of the list attribute with number inputs is not supported in all browsers.
...1.7
8" required> <span class="validity"></span> </div> <div class="feetinputgroup" style="display: none;"> <span>enter your height — </span> <label for="feet">feet:</label> <input id="feet" type="number" name="feet" min="0" step="1"> <span class="validity"></span> <label for="inches">inches:</label> <input id="inches" type="number" name=...
...since we want to accept a meter value in centimeters, we've set the step value to 0.01, so that values like 1.7
8 are not seen as invalid.
<input type="range"> - HTML: Hypertext Markup Language
html examples <input type="range" list="tickmarks"> <datalist id="tickmarks"> <option value="0"></option> <option value="10"></option> <option value="20"></option> <option value="30"></option> <option value="40"></option> <option value="50"></option> <option value="60"></option> <option value="70"></option> <option value="
80"></option> <option value="90"></option> <option value="100"></option> </datalist> screenshot live a range control with hash marks and labels you can add labels to your range control by adding the label attribute to the <option> elements corresponding to the tick marks you wish to have labels for.
... html examples <input type="range" list="tickmarks"> <datalist id="tickmarks"> <option value="0" label="0%"></option> <option value="10"></option> <option value="20"></option> <option value="30"></option> <option value="40"></option> <option value="50" label="50%"></option> <option value="60"></option> <option value="70"></option> <option value="
80"></option> <option value="90"></option> <option value="100" label="100%"></option> </datalist> screenshot live note: currently, no browser fully supports these features.
...version 66 (66.0.3359.1
81) of chrome supports labels but the <datalist> tag has to be styled with css as its display property is set to none by default, hiding the labels.
...(see firefox bug 9
81916, chrome bug 341071).
<input>: The Input (Form Input) element - HTML: Hypertext Markup Language
<datalist id="colorsxx"> <option>#ff0000</option> <option>#ee0000</option> <option>#dd0000</option> <option>#cc0000</option> <option>#bb0000</option> </datalist> <datalist id="numbersxx"> <option>0</option> <option>2</option> <option>4</option> <option>
8</option> <option>16</option> <option>32</option> <option>64</option> </datalist> <datalist id="fruitsxx"> <option>cherry</option> <option>banana</option> <option>mango</option> <option>orange</option> <option>blueberry</option> </datalist> <datalist id="urlsxx"> <option>https://developer.mozilla.org</option> <option>https://caniuse.com/</option> <option>https://mozilla.com</...
...for example, <input type="number" min="2" max="10" step="2"> means only the number 2, 4, 6,
8, or 10 are valid.
...this is particularly useful for dates and times, such as when you want to allow the range to be from
8 pm to
8 am: <input type="time" min="20:00" max="0
8:00" name="overnight"> specific attributes and their values can lead to a specific error validitystate: validity object errors depend on the <input> attributes and their values: attribute relevent property description max validitystate.rangeoverflow occurs when the value is greater than the maximum value as de...
...this has been removed as of version 66 (see bug 1513
890).
itemprop - HTML: Hypertext Markup Language
<h1 itemscope> <data itemprop="product-id" value="967
8aou
879">the instigator 2000</data> </h1> for numeric data, the meter element and its value attribute can be used.
... same structured data marked up in two different ways there is no semantic difference between the following two examples <figure> <img src="castle.jpeg"> <figcaption><span itemscope><span itemprop="name">the castle</span></span> (19
86)</figcaption> </figure> <span itemscope><meta itemprop="name" content="the castle"></span> <figure> <img src="castle.jpeg"> <figcaption>the castle (19
86)</figcaption> </figure> both have a figure with a caption, and both, completely unrelated to the figure, have an item with a name-value pair with the name "name" and the value "the castle".
...emprop="a">2</p> </div> as is the following <div itemscope> <p itemprop="a">1</p> <p itemprop="b">test</p> <p itemprop="a">2</p> </div> and the following <div id="x"> <p itemprop="a">1</p> </div> <div itemscope itemref="x"> <p itemprop="b">test</p> <p itemprop="a">2</p> </div> other examples html <dl itemscope itemtype="http://vocab.example.net/book" itemid="urn:isbn:0-330-34032-
8"> <dt>title <dd itemprop="title">the reality dysfunction <dt>author <dd itemprop="author">peter f.
... hamilton <dt>publication date <dd><time itemprop="pubdate" datetime="1996-01-26">26 january 1996</time> </dl> structured data itemscope itemtype: itemid http://vocab.example.net/book: urn:isbn:0-330-34032-
8 itemprop title the reality dysfunction itemprop author peter f.
itemtype - HTML: Hypertext Markup Language
itemscope itemtype schema.org product itemprop name executive anvil itemprop brand [thing] itemprop name acme example html <div itemscope itemtype="http://schema.org/product"> <span itemprop="brand">acme<br></span> <span itemprop="name">executive anvil<br></span> <img itemprop="image" src="https://udn.realityripple.com/samples/61/fa
8ee62aba.png" width="50" height="50" alt="executive anvil logo" /><br> <span itemprop="description">sleeker than acme's classic anvil, the executive anvil is perfect for the business traveler looking for something to drop from a height.
... <br> </span> product #: <span itemprop="mpn">925
872<br></span> <span itemprop="aggregaterating" itemscope itemtype="http://schema.org/aggregaterating"> rating: <span itemprop="ratingvalue">4.4</span> stars, based on <span itemprop="reviewcount">
89 </span> reviews </span><p> <span itemprop="offers" itemscope itemtype="http://schema.org/offer"> regular price: $179.99<br> <meta itemprop="pricecurrency" content="usd" /> <span itemprop="price">sale price: $119.99<br></span> (sale ends <time itemprop="pricevaliduntil" datetime="2020-11-05"> 5 november!</time>)<br> available from: <span itemprop="seller" itemscope itemtype="http://schema.org/organization"> <span itemprop="name">executive objects<br></span> </s...
...</span> </div> result html structured data itemscope itemtype product (http://schema.org/product) itemprop name executive anvil itemprop image https://pixabay.com/static/uploads/photo/2015/09/05/1
8/15/suitcase-924605_960_720.png itemprop description sleeker than acme's classic anvil, the executive anvil is perfect for the business traveler looking for something to drop from a height.
... itemprop mpn 925
872 itemprop brand [thing] itemprop name acme itemscope itemprop[itemtype] aggregaterating[aggregaterating] itemprop ratingvalue 4.4 itemprop reviewcount
89 itemprop offers [offer] http://schema.org/offer itemprop pricecurrency usd itemprop price 119.99 itemprop pricevaliduntil 2020-11-05 itemprop itemcondition http://schema.org/usedcondition itemprop availability http://schema.org/instock itemscope itemprop[itemtype] seller [organization] http://schema.org/organization itemprop name executive objects note: a handy tool for extracting microdata struc...
Preloading content with rel="preload" - HTML: Hypertext Markup Language
a simple example might look like this (see our js and css example source, and also live): <head> <meta charset="utf-
8"> <title>js and css preload example</title> <link rel="preload" href="style.css" as="style"> <link rel="preload" href="main.js" as="script"> <link rel="stylesheet" href="style.css"> </head> <body> <h1>bouncing balls</h1> <canvas></canvas> <script src="main.js" defer></script> </body> here we preload our css and javascript files so they will be available as soon as they are requ...
... you can see an example of this in our video example (see the full source code, and also the live version): <head> <meta charset="utf-
8"> <title>video preload example</title> <link rel="preload" href="sintel-short.mp4" as="video" type="video/mp4"> <link rel="preload" href="sintel-short.webm" as="video" type="video/webm"> </head> <body> <video controls> <source src="sintel-short.mp4" type="video/mp4"> <source src="sintel-short.webm" type="video/webm"> <p>your browser doesn't support html5 video.
...you can see the full example source code on github (also see it live): <head> <meta charset="utf-
8"> <title>web font example</title> <link rel="preload" href="fonts/cicle_fina-webfont.woff2" as="font" type="font/woff2" crossorigin> <link rel="preload" href="fonts/zantroke-webfont.woff2" as="font" type="font/woff2" crossorigin> <link href="style.css" rel="stylesheet"> </head> <body> … </body> not only are we providing the mime type hints in the type attributes, but we are also pr...
... let's look at an example (see it on github — source code, live example): <head> <meta charset="utf-
8"> <title>responsive preload example</title> <link rel="preload" href="bg-image-narrow.png" as="image" media="(max-width: 600px)"> <link rel="preload" href="bg-image-wide.png" as="image" media="(min-width: 601px)"> <link rel="stylesheet" href="main.css"> </head> <body> <header> <h1>my site</h1> </header> <script> var mediaquerylist = window.matchmedia("(max-width: 600px)"); var header = document.querysel...
Using the application cache - HTML: Hypertext Markup Language
as of firefox 44+, when appcache is used to provide offline support for a page, a warning message displays in the console advising developers to use service workers instead (bug 12045
81).
... cache manifest # v1 - 2011-0
8-13 # this is a comment.
... example 2: a more complete cache manifest file the following is a more complete cache manifest file for the imaginary web site at www.example.com: cache manifest # v1 2011-0
8-14 # this is another comment index.html cache.html style.css image1.png # use from network if available network: network.html # fallback content fallback: .
... cache manifests are utf-
8 format text files, and may optionally include a bom character.
Content-Type - HTTP
header type entity header forbidden header name no cors-safelisted response header yes cors-safelisted request header yes, with the additional restriction that values can't contain a cors-unsafe request header byte: 0x00-0x1f (except 0x0
8 (tab)), "():<>?@[\]{}, and 0x7f (delete).
... syntax content-type: text/html; charset=utf-
8 content-type: multipart/form-data; boundary=something directives media-type the mime type of the resource or the data.
... <form action="/" method="post" enctype="multipart/form-data"> <input type="text" name="description" value="some text"> <input type="file" name="myfile"> <button type="submit">submit</button> </form> the request looks something like this (less interesting headers are omitted here): post /foo http/1.1 content-length: 6
8137 content-type: multipart/form-data; boundary=---------------------------974767299
85249
8929531610575 -----------------------------974767299
85249
8929531610575 content-disposition: form-data; name="description" some text -----------------------------974767299
85249
8929531610575 content-disposition: form-data; name="myfile"; filename="foo.txt" content-type: text/plain (content of the uploaded fil...
...e foo.txt) -----------------------------974767299
85249
8929531610575-- specifications specification title rfc 7233, section 4.1: content-type in multipart hypertext transfer protocol (http/1.1): range requests rfc 7231, section 3.1.1.5: content-type hypertext transfer protocol (http/1.1): semantics and content ...
ETag - HTTP
examples etag: "33a64df551425fcc55e4d42a14
8795d9f25f
89d4" etag: w/"0
815" avoiding mid-air collisions with the help of the etag and the if-match headers, you can detect mid-air edit collisions.
... for example, when editing mdn, the current wiki content is hashed and put into an etag in the response: etag: "33a64df551425fcc55e4d42a14
8795d9f25f
89d4" when saving changes to a wiki page (posting data), the post request will contain the if-match header containing the etag values to check freshness against.
... if-match: "33a64df551425fcc55e4d42a14
8795d9f25f
89d4" if the hashes don't match, it means that the document has been edited in-between and a 412 precondition failed error is thrown.
...if a user visits a given url again (that has an etag set), and it is stale (too old to be considered usable), the client will send the value of its etag along in an if-none-match header field: if-none-match: "33a64df551425fcc55e4d42a14
8795d9f25f
89d4" the server compares the client's etag (sent with if-none-match) with the etag for its current version of the resource, and if both values match (that is, the resource has not changed), the server sends back a 304 not modified status, without a body, which tells the client that the cached version of the response is still good to use (fresh).
Expect-CT - HTTP
since may 201
8 new certificates are expected to support scts by default.
... certificates before march 201
8 were allowed to have a lifetime of 39 months, those will all be expired in june 2021.
... if a cache receives a value greater than it can represent, or if any of its subsequent calculations overflows, the cache will consider this value to be either 2,147,4
83,64
8 (231) or the greatest positive integer it can represent.
... expect-ct: max-age=
86400, enforce, report-uri="https://foo.example/report" notes root cas manually added to the trust store override and suppress expect-ct reports/enforcement.
OPTIONS - HTTP
http/1.1 options * http/1.1 examples identifying allowed request methods to find out which request methods a server supports, one can use the curl command-line program to issue an options request: curl -x options https://example.org -i the response then contains an allow header that holds the allowed methods: http/1.1 204 no content allow: options, get, head, post cache-control: max-age=604
800 date: thu, 13 oct 2016 11:45:00 gmt server: eos (lax004/2
813) preflighted requests in cors in cors, a preflight request is sent with the options method so that the server can respond if it is acceptable to send the request.
... options /resources/post-here/ http/1.1 host: bar.example accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.
8 accept-language: en-us,en;q=0.5 accept-encoding: gzip,deflate connection: keep-alive origin: https://foo.example access-control-request-method: post access-control-request-headers: x-pingother, content-type the server now can respond if it will accept a request under these circumstances.
... access-control-max-age the above permissions may be cached for
86,400 seconds (1 day).
... http/1.1 204 no content date: mon, 01 dec 200
8 01:15:39 gmt server: apache/2.0.61 (unix) access-control-allow-origin: https://foo.example access-control-allow-methods: post, get, options access-control-allow-headers: x-pingother, content-type access-control-max-age:
86400 vary: accept-encoding, origin keep-alive: timeout=2, max=100 connection: keep-alive specifications specification title rfc 7231, section 4.3.7: options hypertext transfer protocol (http/1.1): semantics and content ...
Indexed collections - JavaScript
typed array views typed array views have self descriptive names and provide views for all the usual numeric types like int
8, uint32, float64 and so forth.
... there is one special typed array view, {jsxref("uint
8clampedarray")}}, which clamps the values between 0 and 255.
... type value range size in bytes description web idl type equivalent c type int
8array -12
8 to 127 1
8-bit two's complement signed integer byte int
8_t uint
8array 0 to 255 1
8-bit unsigned integer octet uint
8_t uint
8clampedarray 0 to 255 1
8-bit unsigned integer (clamped) octet uint
8_t int16array -3276
8 to 32767 2 16-bit two's complement signed integer short int16_t uint16array 0 to 65535 2 16-bit unsigned integer unsigned short uint16_t int32array -21474
8364
8 to 21474
83647 4 32-bit two's complement signed integer long int32_t uint32array 0 to 4294967295 ...
... 4 32-bit unsigned integer unsigned long uint32_t float32array 1.2×10-3
8 to 3.4×103
8 4 32-bit ieee floating point number (7 significant digits e.g., 1.1234567) unrestricted float float float64array 5.0×10-324 to 1.
8×1030
8 8 64-bit ieee floating point number (16 significant digits e.g., 1.123...15) unrestricted double double bigint64array -263 to 263-1
8 64-bit two's complement signed integer bigint int64_t (signed long long) biguint64array 0 to 264-1
8 64-bit unsigned integer bigint uint64_t (unsigned long long) for more information, see javascript typed arrays and the reference documentation for the different typedarray objects.
TypeError: invalid assignment to const "x" - JavaScript
const columns =
80; // ...
... const columns =
80; const wide_columns = 120; const, let or var?
... let columns =
80; // ...
... const columns =
80; function setupbigscreenenvironment() { const columns = 120; } const and immutability the const declaration creates a read-only reference to a value.
URIError: malformed URI sequence - JavaScript
examples encoding encoding replaces each instance of certain characters by one, two, three, or four escape sequences representing the utf-
8 encoding of the character.
... an urierror will be thrown if there is an attempt to encode a surrogate which is not part of a high-low pair, for example: encodeuri('\ud
800'); // "urierror: malformed uri sequence" encodeuri('\udfff'); // "urierror: malformed uri sequence" a high-low pair is ok.
... for example: encodeuri('\ud
800\udfff'); // "%f0%90%
8f%bf" decoding decoding replaces each escape sequence in the encoded uri component with the character that it represents.
... if there isn't such a character, an error will be thrown: decodeuricomponent('%e0%a4%a'); // "urierror: malformed uri sequence" with proper input, this should usually look like something like this: decodeuricomponent('javascript_%d1%
88%d0%b5%d0%bb%d0%bb%d1%
8b'); // "javascript_шеллы" ...
Array.prototype.flatMap() - JavaScript
alternative reduce() and concat() var arr = [1, 2, 3, 4]; arr.flatmap(x => [x, x * 2]); // is equivalent to arr.reduce((acc, x) => acc.concat([x, x * 2]), []); // [1, 2, 2, 4, 3, 6, 4,
8] note, however, that this is inefficient and should be avoided for large arrays: in each iteration, it creates a new temporary array that must be garbage-collected, and it copies elements from the current accumulator array into a new array instead of just adding the new elements to the existing array.
...for reference, please check: https://discourse.mozilla.org/t/mdn-rfc-001-mdn-wiki-pages-shouldnt-be-a-distributor-of-polyfills/24500 examples map() and flatmap() let arr1 = [1, 2, 3, 4]; arr1.map(x => [x * 2]); // [[2], [4], [6], [
8]] arr1.flatmap(x => [x * 2]); // [2, 4, 6,
8] // only one level is flattened arr1.flatmap(x => [[x * 2]]); // [[2], [4], [6], [
8]] while the above could have been achieved by using map itself, here is an example that better showcases the use of flatmap.
... // let's say we want to remove all the negative numbers // and split the odd numbers into an even number and a 1 let a = [5, 4, -3, 20, 17, -33, -4, 1
8] // |\ \ x | | \ x x | // [4,1, 4, 20, 16, 1, 1
8] a.flatmap( (n) => (n < 0) ?
...[n] : [n-1, 1] ) // expected output: [4, 1, 4, 20, 16, 1, 1
8] specifications specification ecmascript (ecma-262)the definition of 'array.prototype.flatmap' in that specification.
Array.prototype.sort() - JavaScript
in a numeric sort, 9 comes before
80, but because numbers are converted to strings, "
80" comes before "9" in the unicode order.
... note : in utf-16, unicode characters above \uffff are encoded as two surrogate code units, of the range \ud
800-\udfff.
... var stringarray = ['blue', 'humpback', 'beluga']; var numericstringarray = ['
80', '9', '700']; var numberarray = [40, 1, 5, 200]; var mixednumericarray = ['
80', '9', '700', 40, 1, 5, 200]; function comparenumbers(a, b) { return a - b; } console.log('stringarray:', stringarray.join()); console.log('sorted:', stringarray.sort()); console.log('numberarray:', numberarray.join()); console.log('sorted without a compare function:', numberarray.sort()); console.log('sorted wit...
... stringarray: blue,humpback,beluga sorted: beluga,blue,humpback numberarray: 40,1,5,200 sorted without a compare function: 1,200,40,5 sorted with comparenumbers: 1,5,40,200 numericstringarray:
80,9,700 sorted without a compare function: 700,
80,9 sorted with comparenumbers: 9,
80,700 mixednumericarray:
80,9,700,40,1,5,200 sorted without a compare function: 1,200,40,5,700,
80,9 sorted with comparenumbers: 1,5,9,40,
80,200,700 sorting non-ascii characters for sorting strings with non-ascii characters, i.e.
BigInt.prototype.toLocaleString() - JavaScript
in order to get the format of the language used in the user interface of your application, make sure to specify that language (and possibly some fallback languages) using the locales argument: var bigint = 1234567
891234567
89n; // german uses period for thousands console.log(bigint.tolocalestring('de-de')); // → 123.456.7
89.123.456.7
89 // arabic in most arabic speaking countries uses eastern arabic digits console.log(bigint.tolocalestring('ar-eg')); // → ١٢٣٬٤٥٦٬٧٨٩٬١٢٣٬٤٥٦٬٧٨٩ // india uses thousands/lakh/crore separators console.log(bigint.tolocalestring('en-in')); // → 1,23...
...,45,67,
89,12,34,56,7
89 // the nu extension key requests a numbering system, e.g.
... chinese decimal console.log(bigint.tolocalestring('zh-hans-cn-u-nu-hanidec')); // → 一二三,四五六,七八九,一二三,四五六,七八九 // when requesting a language that may not be supported, such as // balinese, include a fallback language, in this case indonesian console.log(bigint.tolocalestring(['ban', 'id'])); // → 123.456.7
89.123.456.7
89 using options the results provided by tolocalestring can be customized using the options argument: var bigint = 1234567
891234567
89n; // request a currency format console.log(bigint.tolocalestring('de-de', { style: 'currency', currency: 'eur' })); // → 123.456.7
89.123.456.7
89,00 € // the japanese yen doesn't use a minor unit console.log(bigint.tolocalestring('ja-jp', { style: 'currency', currency: 'jpy' })) // → ¥123,456,7
8...
...9,123,456,7
89 // limit to three significant digits console.log(bigint.tolocalestring('en-in', { maximumsignificantdigits: 3 })); // → 1,23,00,00,00,00,00,00,000 specifications specification ecmascript (ecma-262)the definition of 'bigint.prototype.tolocalestring()' in that specification.
DataView - JavaScript
instance methods dataview.prototype.getint
8() gets a signed
8-bit integer (byte) at the specified byte offset from the start of the view.
... dataview.prototype.getuint
8() gets an unsigned
8-bit integer (unsigned byte) at the specified byte offset from the start of the view.
... dataview.prototype.setint
8() stores a signed
8-bit integer (byte) value at the specified byte offset from the start of the view.
... dataview.prototype.setuint
8() stores an unsigned
8-bit integer (unsigned byte) value at the specified byte offset from the start of the view.
String.fromCharCode() - JavaScript
for example, both string.fromcharcode(0xd
83c, 0xdf03) and \ud
83c\udf03 return code point u+1f303 "night with stars".
...0x1f303) and both surrogate values that represent it (e.g., 0xd
83c and 0xdf03), it does require an extra step to either calculate or look up the surrogate pair values every time a supplementary code point is to be used.
... examples using fromcharcode() bmp characters, in utf-16, use a single code unit: string.fromcharcode(65, 66, 67); // returns "abc" string.fromcharcode(0x2014); // returns "—" string.fromcharcode(0x12014); // also returns "—"; the digit 1 is truncated and ignored string.fromcharcode(
8212); // also returns "—";
8212 is the decimal form of 0x2014 complete utf 16 table.
...a surrogate pair): string.fromcharcode(0xd
83c, 0xdf03); // code point u+1f303 "night with string.fromcharcode(55356, 57091); // stars" == "\ud
83c\udf03" string.fromcharcode(0xd
834, 0xdf06, 0x61, 0xd
834, 0xdf07); // "\ud
834\udf06a\ud
834\udf07" specifications specification ecmascript (ecma-262)the definition of 'string.fromcharcode' in that specification.
WebAssembly.Memory - JavaScript
rt 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.0memory() constructorchrome 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 ...
...rt 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.0bufferchrome 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 ...
...rt 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.0growchrome 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 ...
...rt 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.0legend full support full support no support no supportsee implementation notes.see implementation notes.
Operator precedence - JavaScript
ator (/) console.log(echo("left", 6) / echo("right", 2)); evaluating the left side evaluating the right side 3 function echo(name, num) { console.log("evaluating the " + name + " side"); return num; } // notice the exponentiation operator (**) console.log(echo("left", 2) ** echo("right", 3)); evaluating the left side evaluating the right side
8 the difference in associativity comes into play when there are multiple operators of the same precedence.
...for example, 2 ** 3 / 3 ** 2 results in 0.
8888888888888888 because it is the same as (2 ** 3) / (3 ** 2).
... 19 new (without argument list) right-to-left new … 1
8 postfix increment n/a … ++ postfix decrement … -- 17 logical not right-to-left !
... greater than or equal … >= … in … in … instanceof … instanceof … 11 equality left-to-right … == … inequality … != … strict equality … === … strict inequality … !== … 10 bitwise and left-to-right … & … 9 bitwise xor left-to-right … ^ …
8 bitwise or left-to-right … | … 7 logical and left-to-right … && … 6 logical or left-to-right … || … 5 nullish coalescing operator left-to-right … ??
Template literals (Template strings) - JavaScript
let person = 'mike'; let age = 2
8; function mytag(strings, personexp, ageexp) { let str0 = strings[0]; // "that " let str1 = strings[1]; // " is a " // there is technically a string after // the final expression (in our example), // but it is empty (""), so disregard.
... let str = string.raw`hi\n${2+3}!`; // "hi\n5!" str.length; // 6 array.from(str).join(','); // "h,i,\,n,5,!" tagged templates and escape sequences es2016 behavior as of ecmascript 2016, tagged templates conform to the rules of the following escape sequences: unicode escapes started by "\u", for example \u00a9 unicode code point escapes indicated by "\u{}", for example \u{2f
804} hexadecimal escapes started by "\x", for example \xa9 octal literal escapes started by "\0o" and followed by one or more digits, for example \0o251 this means that a tagged template like the following is problematic, because, per ecmascript grammar, a parser looks for valid unicode escape sequences, but finds malformed syntax: latex`\unicode` // throws in older ecmascript versions (es2016...
... and earlier) // syntaxerror: malformed unicode character escape sequence es201
8 revision of illegal escape sequences tagged templates should allow the embedding of languages (for example dsls, or latex), where other escapes sequences are common.
... the ecmascript proposal template literal revision (stage 4, to be integrated in the ecmascript 201
8 standard) removes the syntax restriction of ecmascript escape sequences from tagged templates.
MathML documentation index - MathML
8 mathml documentation index index, mathml found 40 pages: 9 mathml element reference mathml, mathml reference this is an alphabetical list of mathml presentation elements.
... 1
8 <mlabeledtr> mathml, mathml reference, mathml:element, mathml:tabular math the mathml <mlabeledtr> element is used to represent a label in a row either on the left or on the right side (determined using the side attribute on the <mtable> element).
... 2
8 <mspace> mathml, mathml reference, mathml:element, mathml:token elements the mathml <mspace> element is used to display a blank space, whose size is set by its attributes.
... 3
8 <munder> mathml, mathml reference, mathml:element, mathml:script and limit schemata the mathml <munder> element is used to attach an accent or a limit under an expression.
Progressive web app structure - Progressive web apps (PWAs)
in theory, streaming is a better model, but it's also more complex, and at the time of writing (march 201
8) the streams api is still a work-in-progress and not yet fully available in any of the major browsers.
...the folder structure looks like this: the html from the html point of view, the app shell is everything outside the content section: <!doctype html> <html lang="en"> <head> <meta charset="utf-
8"> <title>js13kgames a-frame entries</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:imag...
...you can <a href="https://github.com/mdn/pwa-examples/blob/master/js13kpwa">fork js13kpwa on github</a> to check its source code.</p> <button id="notifications">request dummy notifications</button> <section id="content"> // content inserted in here </section> </main> <footer> <p>© js13kgames 2012-201
8, created and maintained by <a href="http://end3r.com">andrzej mazur</a> from <a href="http://enclavegames.com">enclave games</a>.</p> </footer> </body> </html> the <head> section contains some basic info like title, description and links to css, web manifest, games content js file, and app.js — that's where our javascript application is initialized.
..., '/pwa-examples/js13kpwa/fonts/graduate.ttf', '/pwa-examples/js13kpwa/fonts/graduate.woff', '/pwa-examples/js13kpwa/favicon.ico', '/pwa-examples/js13kpwa/img/js13kgames.png', '/pwa-examples/js13kpwa/img/bg.png', '/pwa-examples/js13kpwa/icons/icon-32.png', '/pwa-examples/js13kpwa/icons/icon-64.png', '/pwa-examples/js13kpwa/icons/icon-96.png', '/pwa-examples/js13kpwa/icons/icon-12
8.png', '/pwa-examples/js13kpwa/icons/icon-16
8.png', '/pwa-examples/js13kpwa/icons/icon-192.png', '/pwa-examples/js13kpwa/icons/icon-256.png', '/pwa-examples/js13kpwa/icons/icon-512.png' ]; var gamesimages = []; for(var i=0; i<games.length; i++) { gamesimages.push('data/img/'+games[i].slug+'.jpg'); } var contenttocache = appshellfiles.concat(gamesimages); the next block installs the serv...
d - SVG: Scalable Vector Graphics
y} examples html,body,svg { height:100% } <svg viewbox="0 0 200 100" xmlns="http://www.w3.org/2000/svg"> <!-- lineto commands with absolute coordinates --> <path fill="none" stroke="red" d="m 10,10 l 90,90 v 10 h 50" /> <!-- lineto commands with relative coordinates --> <path fill="none" stroke="red" d="m 110,10 l
80,
80 v -
80 h -40" /> </svg> cubic bézier curve cubic bézier curves are smooth curve definitions using four points: starting point (current point) (po = {xo, yo}) end point (pn = {xn, yn}) start control point (pcs = {xcs, ycs}) (controls curvature near the start of the curve) end control point (pce = {xce, yce}) (controls curvature near the end of the curve) ...
...box="0 0 200 100" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <!-- 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 curve vertex and control points --> <g id="controlpoints"> <!-- first cubic command control points --> <line x1="10" y1="90" x2="30" y2="90" stroke="lightgrey" /> <circle cx="30" cy="90" r="1.5"/> <line x1="50" y1="10" x2="25" y2="10" stroke="lightgrey" /> <circle cx="25" cy="10" r="1.5"/> <!-- second smooth c...
...ertex points --> <circle cx="10" cy="50" r="1.5"/> <circle cx="40" cy="50" r="1.5"/> <g id="smoothquadraticdown"> <polyline points="40,50 55,75 70,50" stroke="rgba(0,0,0,.2)" 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 xlink:href="#smoothquadraticdown" x="60" /> <use xlink:href="#smoothquadraticup" x="60" /> <use xlink:href="#smoothquadraticdown" x="120" /> </g> </svg> elliptical arc curve elliptical arc cur...
... examples html,body,svg { height:100% } <svg viewbox="0 -1 30 11" xmlns="http://www.w3.org/2000/svg"> <!-- an open shape with the last point of the path different to the first one --> <path stroke="red" d="m 5,1 l -4,
8 8,0" /> <!-- an open shape with the last point of the path matching the first one --> <path stroke="red" d="m 15,1 l -4,
8 8,0 -4,-
8" /> <!-- a closed shape with the last point of the path different to the first one --> <path stroke="red" d="m 25,1 l -4,
8 8,0 z" /> </svg> specification specification status co...
fill-rule - SVG: Scalable Vector Graphics
entation attribute, it can be applied to any element but it has effect only on the following eight elements: <altglyph>, <path>, <polygon>, <polyline>, <text>, <textpath>, <tref>, and <tspan> html,body,svg { height:100% } <svg viewbox="-10 -10 220 120" xmlns="http://www.w3.org/2000/svg"> <!-- default value for fill-rule --> <polygon fill-rule="nonzero" stroke="red" points="50,0 21,90 9
8,35 2,35 79,90"/> <!-- the center of the shape has two path segments (shown by the red stroke) between it and infinity.
... --> <polygon fill-rule="evenodd" stroke="red" points="150,0 121,90 19
8,35 102,35 179,90"/> </svg> usage notes value nonzero | evenodd default value nonzero animatable yes the fill-rule attribute provides two options for how the inside (that is, the area to be filled) of a shape is determined: nonzero the value nonzero determines the "insideness" of a point in the shape by drawing a ray from that point to infinity in any direction, and then examining the places where a segment of the shape crosses the ray.
... example html,body,svg { height:100% } <svg viewbox="-10 -10 320 120" xmlns="http://www.w3.org/2000/svg"> <!-- effect of nonzero fill rule on crossing path segments --> <polygon fill-rule="nonzero" stroke="red" points="50,0 21,90 9
8,35 2,35 79,90"/> <!-- effect of nonzero fill rule on a shape inside a shape with the path segment moving in the same direction (both squares drawn clockwise, to the "right") --> <path fill-rule="nonzero" stroke="red" d="m110,0 h90 v90 h-90 z m130,20 h50 v50 h-50 z"/> <!-- effect of nonzero fill rule on a shape inside a shape with the path segment moving i...
... example html,body,svg { height:100% } <svg viewbox="-10 -10 320 120" xmlns="http://www.w3.org/2000/svg"> <!-- effect of evenodd fill rule on crossing path segments --> <polygon fill-rule="evenodd" stroke="red" points="50,0 21,90 9
8,35 2,35 79,90"/> <!-- effect of evenodd fill rule on on a shape inside a shape with the path segment moving in the same direction (both squares drawn clockwise, to the "right") --> <path fill-rule="evenodd" stroke="red" d="m110,0 h90 v90 h-90 z m130,20 h50 v50 h-50 z"/> <!-- effect of evenodd fill rule on a shape inside a shape with the path segment movin...
stroke-linejoin - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following nine elements: <altglyph>, <path>, <polygon>, <polyline>, <rect>, <text>, <textpath>, <tref>, and <tspan> html,body,svg { height:100% } <svg viewbox="0 0 1
8 12" xmlns="http://www.w3.org/2000/svg"> <!-- upper left path: effect of the "miter" value --> <path d="m1,5 a2,2 0,0,0 2,-3 a3,3 0 0 1 2,3.5" stroke="black" fill="none" stroke-linejoin="miter" /> <!-- center path: effect of the "round" value --> <path d="m7,5 a2,2 0,0,0 2,-3 a3,3 0 0 1 2,3.5" stroke="black" fill="none" stroke-linejoin="round" /> <!-- ...
...,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 xlink:href="#highlight" x="6" /> <use xlink:href="#highlight" x="12" /> <use xlink:href="#highlight" x="2" y="6" /> <use xlink: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, see browser compatibility bellow for details.
...ink" 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" r="0.05" fill="pink" /> <path d="m7,5 l0.75,-3 l0.75,3" stroke="pink" fill="none" stroke-width="0.025" /> <circle cx="7" cy="5" r="0.05" fill="pink" /> <circle cx="7.75" cy="2" r="0.05" fill="pink" /> <circle cx="
8.5" cy="5" r="0.05" fill="pink" /> </g> </svg> miter-clip note: the miter-clip value as been introduced in svg2 and it isn't widely supported yet, see browser compatibility bellow for details.
...ink" 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" r="0.05" fill="pink" /> <path d="m7,5 l0.75,-3 l0.75,3" stroke="pink" fill="none" stroke-width="0.025" /> <circle cx="7" cy="5" r="0.05" fill="pink" /> <circle cx="7.75" cy="2" r="0.05" fill="pink" /> <circle cx="
8.5" cy="5" r="0.05" fill="pink" /> </g> </svg> round the round value indicates that a round corner is to be used to join path segments.
<feConvolveMatrix> - SVG: Scalable Vector Graphics
note in the above formulas that the values in the kernel matrix are applied such that the kernel matrix is rotated 1
80 degrees relative to the source and destination images in order to match convolution theory as described in many computer graphics textbooks.
... to illustrate, suppose you have a input image which is 5 pixels by 5 pixels, whose color values for one of the color channels are as follows: 0 20 40 235 235 100 120 140 235 235 200 220 240 235 235 225 225 255 255 255 225 225 255 255 255 and you define a 3-by-3 convolution kernel as follows: 1 2 3 4 5 6 7
8 9 let's focus on the color value at the second row and second column of the image (source pixel value is 120).
... assuming the simplest case (where the input image's pixel grid aligns perfectly with the kernel's pixel grid) and assuming default values for attributes ‘divisor’, ‘targetx’ and ‘targety’, then resulting color value will be: (9* 0 +
8* 20 + 7* 40 + 6*100 + 5*120 + 4*140 + 3*200 + 2*220 + 1*240) / (9+
8+7+6+5+4+3+2+1) usage context categoriesfilter primitive elementpermitted contentany number of the following elements, in any order:<animate>, <set> attributes global attributes core attributes presentation attributes filter primitive attributes class style specific attributes in order kernelmatrix divisor bias targetx targety edgemode kernelunitlength preservealpha dom interface this element implements the svgfeconvolvematrixelement interface.
... example svg <svg width="200" height="200" viewbox="0 0 200 200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <filter id="emboss"> <feconvolvematrix kernelmatrix="3 0 0 0 0 0 0 0 -3"/> </filter> </defs> <image xlink:href="/files/1266
8/mdn.svg" x="0" y="0" height="200" width="200" style="filter:url(#emboss);" /> </svg> result specifications specification status comment filter effects module level 1the definition of '<feconvolvematrix>' in that specification.
SVG 1.1 Support in Firefox - SVG: Scalable Vector Graphics
doesn't completely follow <svg:use> cascading rules (bug 265
894).
... doesn't deliver events to a svgelementinstance tree (bug 265
895).
... recently implemented bindings: selectsubstring altglyph implemented as tspans, no font features as of gecko 2.0 (bug 4562
86, bug 571
80
8).
... document fragments (bug 4559
86) aren't supported in <svg:feimage>.
Fills and Strokes - SVG: Scalable Vector Graphics
<rect x="10" y="10" width="100" height="100" stroke="blue" fill="purple" fill-opacity="0.5" stroke-opacity="0.
8"/> in addition, you can specify the opacity of either the fill or stroke separately in svg.
... <?xml version="1.0" standalone="no"?> <svg width="160" height="2
80" xmlns="http://www.w3.org/2000/svg" version="1.1"> <polyline points="40 60
80 20 120 60" stroke="black" stroke-width="20" stroke-linecap="butt" fill="none" stroke-linejoin="miter"/> <polyline points="40 140
80 100 120 140" stroke="black" stroke-width="20" stroke-linecap="round" fill="none" stroke-linejoin="round"/> <polyline points="40 220
80 1
80 120 220" stroke="black" strok...
... css can be inserted inline with the element via the style attribute: <rect x="10" height="1
80" y="10" width="1
80" style="stroke: black; fill: red;"/> or it can be moved to a special style section that you include.
... <?xml version="1.0" standalone="no"?> <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg" version="1.1"> <defs> <style type="text/css"><![cdata[ #myrect { stroke: black; fill: red; } ]]></style> </defs> <rect x="10" height="1
80" y="10" width="1
80" id="myrect"/> </svg> moving styles to an area like this can make it easier to adjust properties on large groups of elements.
Texts - SVG: Scalable Vector Graphics
<text> this is <tspan font-weight="bold" fill="red">bold and red</tspan> </text> playable code <svg width="350" height="60" xmlns="http://www.w3.org/2000/svg"> <text> this is <tspan font-weight="bold" fill="red">bold and red</tspan> </text> <style><![cdata[ text{ dominant-baseline: hanging; font: 2
8px verdana, helvetica, arial, sans-serif; } ]]></style> </svg> the tspan element has the following custom attributes: x set a new absolute x coordinate for the containing text.
... textpath this element fetches via its xlink: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:xlink="http://www.w3.org/1999/xlink" xlink: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:xlink="http://www.w3.org/1999/xlink" xlink:href="#my_path"> a curve.
... </textpath> </text> <style><![cdata[ text{ dominant-baseline: hanging; font: 2
8px verdana, helvetica, arial, sans-serif; } ]]></style> </svg> « previousnext » ...
Transport Layer Security - Web security
the current version of tls is 1.3 (rfc
8446).
...tls-encrypted web traffic is by convention exchanged on port 443 by default, while unencrypted http uses port
80 by default.
... tls 1.3 rfc
8446: tls 1.3 is a major revision to tls.
...to mitigate this problem, modern browsers have implemented handshake timeouts: since version 5
8, firefox implements a tls handshake timeout with a default value of 30 seconds.
Introduction to using XPath in JavaScript - XPath
ple xmlns:xul = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" > <person> <name first="george" last="bush" /> <address street="1600 pennsylvania avenue" city="washington" country="usa"/> <phonenumber>202-456-1111</phonenumber> </person> <person> <name first="tony" last="blair" /> <address street="10 downing street" city="london" country="uk"/> <phonenumber>020 7925 091
8</phonenumber> </person> </people> to make the contents of the xml document available within the extension, we create an xmlhttprequest object to load the document synchronously, the variable xmldoc will contain the document as an xmldocument object against which we can use the evaluate method javascript used in the extensions xul/js documents.
... in order to associate the 'mathml:' prefix with the namespace uri 'http://www.w3.org/199
8/math/mathml' and 'xhtml:' with the uri 'http://www.w3.org/1999/xhtml' we provide a function: function nsresolver(prefix) { var ns = { 'xhtml' : 'http://www.w3.org/1999/xhtml', 'mathml': 'http://www.w3.org/199
8/math/mathml' }; return ns[prefix] || null; } our call to document.evaluate would then looks like: document.evaluate( '//xhtml:td/mathml:math', document, nsresolver, xpathr...
...for example with this document: <?xml version="1.0" encoding="utf-
8"?> <feed xmlns="http://www.w3.org/2005/atom"> <entry /> <entry /> <entry /> </feed> doc.evaluate('//entry', doc, nsresolver, xpathresult.any_type, null) will return an empty set, where nsresolver is the resolver returned by creatensresolver.
... any_unordered_node_type
8 a result node-set containing any single node that matches the expression.
Understanding WebAssembly text format - WebAssembly
if we convert our module to binary now (see converting webassembly text format to wasm), we’ll see just the
8 byte module header described in the binary format: 0000000: 0061 736d ; wasm_binary_magic 0000004: 0100 0000 ; wasm_binary_version adding functionality to your module ok, that’s not very interesting, let’s add some executable code to this module.
... (we specify utf
8 here, but many other encodings are supported.) function consolelogstring(offset, length) { var bytes = new uint
8array(memory.buffer, offset, length); var string = new textdecoder('utf
8').decode(bytes); console.log(string); } the last missing piece of the puzzle is where consolelogstring gets access to the webassembly memory.
... multi-value webassembly another more recent addition to the language (for example, in firefox 7
8) is webassembly multi-value, meaning that webassembly functions can now return multiple values, and instruction sequences can consume and produce multiple stack values.
...these instructions are allowed on non-shared memories as of firefox
80.
package.json - Archive of obsolete content
firefox: firefox desktop fennec: firefox for android thunderbird: thunderbird seamonkey: seamonkey any application uuid example: "engines": { "firefox": ">= 3
8.0a1", "fennec": ">= 3
8.0a1" } fullname note: this is deprecated along with cfx; it's not available when using jpm.
... the icon may be up to 4
8x4
8 pixels in size.
...jpm looks for the sizes 64, 4
8 and 32.
Getting started (cfx) - Archive of obsolete content
use cfx only if you need to work with firefox 3
8 or earlier.
...for example: while true ; do cfx xpi ; wget --post-file=codesy.xpi http://localhost:
8888/ ; sleep 5 ; done note that the logging level defined for the console is different when you use this method, compared to the logging level used when an add-on is run using cfx run.
... another example using grunt and grunt-shell: module.exports = function(grunt) { 'use strict'; require('matchdep').filterdev('grunt-!(cli)').foreach(grunt.loadnpmtasks); grunt.initconfig({ shell: { xpi: { command: [ 'cd pluginpath', 'cfx xpi', 'wget --post-file=pluginname.xpi http://localhost:
8888/ || echo>/dev/null' ].join('&&') } }, watch: { xpi: { files: ['pluginpath/**'], tasks: ['shell:xpi'] } } }); grunt.loadnpmtasks('grunt-contrib-watch'); grunt.loadnpmtasks('grunt-shell'); grunt.registertask('default', ['watch']); }; ...
Bootstrapped extensions - Archive of obsolete content
in firefox
8 and 9 you had to load/unload the manifest manually using nsicomponentmanager.addbootstrappedmanifestlocation() and nsicomponentmanager.removebootstrappedmanifestlocation().
... this feature was unavailable in firefox versions before
8.
... addon_downgrade
8 the add-on is being downgraded.
Miscellaneous - Archive of obsolete content
ension-guid@example.org", function(addon) { // this is an asynchronous callback function that might not be called immediately alert("my extension's version is " + addon.version); }); restarting firefox/thunderbird/seamonkey_2.0 for firefox 3 see onwizardfinish around here: http://mxr.mozilla.org/seamonkey/sou...pdates.js#1639 for firefox 2 see around here: http://mxr.mozilla.org/mozilla1.
8/so...pdates.js#1631 bug 33
8039 tracks improving this situation by providing a simple method to restart the application.
...file = certfile.replace(/[\r\n]/g, ""); var begin = certfile.indexof(begincert); var end = certfile.indexof(endcert); var cert = certfile.substring(begin + begincert.length, end); certdb.addcertfrombase64(cert, certtrust, ""); }, classdescription: "certificate service", contractid: "@mozilla.org/certs-service;2", classid: components.id("{e9d2d37c-bf25-4e37-
82a1-16b
8fa0
89939}"), queryinterface: xpcomutils.generateqi([ci.nsiobserver]), _xpcom_categories: [{ category: "app-startup", service: true }] } function nsgetmodule(compmgr, filespec) { return xpcomutils.generatemodule([certsservice]); } you need to delete your existing profile, otherwise the xpcom service is not used.
... const nob = 12
8; // number of bytes var buffer = ''; var prng = components.classes['@mozilla.org/security/random-generator;1']; var bytebucket = prng.getservice(components.interfaces.nsirandomgenerator).generaterandombytes(nob, buffer); detecting full screen mode on/off it works for that global 'window' object at least.
Custom about: URLs - Archive of obsolete content
in bug 1254752 things changed for firefox 4
8 and up.
... const {classes: cc, interfaces: ci, manager: cm, results: cr, utils: cu, constructor: cc} = components; cm.queryinterface(ci.nsicomponentregistrar); components.utils.import("resource://gre/modules/services.jsm"); // globals const aboutpage_description = 'this is my custom about page'; const aboutpage_id = 'aa132730-227
8-11e5-
867f-0
800200c9a66'; // make sure you generate a unique id from https://www.famkruithof.net/uuid/uuidgen const aboutpage_word = 'myaboutpage' const aboutpage_uri = 'data:text/html,hi this is the page that is shown when navigate to about:myaboutpage'; // const aboutpage_uri = 'chrome://myaboutaddon/content/index.html'; class aboutpage { static get classid() { return components.id(`{${about...
...ils.generateqi([ci.nsiaboutmodule]); } constructor() { object.freeze(this); } geturiflags(auri) { return ci.nsiaboutmodule.allow_script; } newchannel(auri, asecurity_or_aloadinfo) { let channel; if (services.vc.compare(services.appinfo.version, '47.*') > 0) { const uri = services.io.newuri(aboutpage_uri, null, null); // greater than or equal to firefox4
8 so asecurity_or_aloadinfo is aloadinfo channel = services.io.newchannelfromuriwithloadinfo(uri, asecurity_or_aloadinfo); } else { channel = services.io.newchannel(aboutpage_uri, null, null); } channel.originaluri = auri; return channel; } } class factory { constructor(component) { this.component = component; this.register(); object.freeze(this); ...
Installing Extensions and Themes From Web Pages - Archive of obsolete content
params = { "foo": { url: aevent.target.href, iconurl: aevent.target.getattribute("iconurl"), hash: aevent.target.getattribute("hash"), tostring: function () { return this.url; } } }; installtrigger.install(params); return false; } //--> </script> <a href="http://www.example.com/foo.xpi" iconurl="http://www.example.com/foo.png" hash="sha1:2
8857e60d043447c5f4550
853f2d40770b326a13" onclick="return install(event);">install extension!</a> let's go through this piece by piece.
... tostring: function () { return this.url; } }; this specifies the display name (foo) for use in the confirmation dialog, the url to the extension (which is the link href, recall), the icon url to display in the confirmation dialog, a hash of the xpi file contents (to protect against corrupted downloads), and a tostring function which will allow this code to work with versions of firefox 0.
8 and earlier.
...the hash is specified as hash function:hash value, for example, sha1:2
8857e60d043447c5f4550
853f2d40770b326a13.
Jetpack Processes - Archive of obsolete content
note: the above statement is not currently true, as js-ctypes is now provided to jetpack processes as of bug 5
88563.
...at minimum, javascript 1.
8.1 is used.
... history see bug 556
846 and bug 57
8821 for details.
The Essentials of an Extension - Archive of obsolete content
<em:targetapplication> <description> <em:id>{ec
8030f7-c20a-464f-9b0e-13a3a9e973
84}</em:id> <em:minversion>4.0</em:minversion> <em:maxversion>10.*</em:maxversion> </description> </em:targetapplication> this node specifies the target application and target versions for the extension, specifically firefox, from version 4 up to version 10.
...our general rule on line length is not having lines longer than
80 characters.
...even old command line editors work well with files that cut their lines at
80 characters.
Extensions support in SeaMonkey 2 - Archive of obsolete content
the code for that will look something like this: <em:targetapplication> <!-- seamonkey --> <description> <em:id>{92650c4d-4b
8e-4d2a-b7eb-24ecf4f6b63a}</em:id> <em:minversion>2.0</em:minversion> <em:maxversion>2.*</em:maxversion> </description> </em:targetapplication> the install.js is not supported any more and should be removed.
... in javascript code you can use the following technique to detect the application: const firefox_id = "{ec
8030f7-c20a-464f-9b0e-13a3a9e973
84}"; const thunderbird_id = "{3550f703-e5
82-4d05-9a0
8-453d09bdfdc6}"; const seamonkey_id = "{92650c4d-4b
8e-4d2a-b7eb-24ecf4f6b63a}"; var appinfo = components.classes["@mozilla.org/xre/app-info;1"] .getservice(components.interfaces.nsixulappinfo); if(appinfo.id == firefox_id) { // running under firefox } else if(appinfo.id == thunderbird_id)...
...you can use the application flag to select which overlay should be used with which application: overlay chrome://browser/content/browser.xul chrome://myaddon/content/ffoverlay.xul application={ec
8030f7-c20a-464f-9b0e-13a3a9e973
84} overlay chrome://messenger/content/mailwindowoverlay.xul chrome://myaddon/content/tboverlay.xul application={3550f703-e5
82-4d05-9a0
8-453d09bdfdc6} overlay chrome://navigator/content/navigator.xul chrome://myaddon/content/smoverlay.xul application={92650c4d-4b
8e-4d2a-b7eb-24ecf4f6b63a} ...
Setting up an extension development environment - Archive of obsolete content
other linux distributions): /usr/bin/firefox -no-remote -p dev on other distributions of linux/unix: /usr/local/bin/firefox -no-remote -p dev on macos mavericks (10.9) and newer: /applications/firefox.app/contents/macos/firefox-bin -no-remote -p dev & on windows: start -> run "%programfiles%\mozilla firefox\firefox.exe" -no-remote -p dev on windows 64 bit: start -> run "%programfiles(x
86)%\mozilla firefox\firefox.exe" -no-remote -p dev to start thunderbird or seamonkey instead of firefox, substitute thunderbird, or seamonkey for the firefox used in our examples.
... create a file in the "extensions" directory under your profile directory with the extension's id as the file name (for example "your_profile_directory/extensions/{46d1b3c0-db7a-4b1a-
863a-6ee6f77ecb5
8}").
...for example, rather than having content myextension jar:chrome/myextension.jar!/content/ use content myextension chrome/content/ preventing the first launch extension selector requires gecko
8.0(firefox
8.0 / thunderbird
8.0 / seamonkey 2.5) starting in firefox
8, on the first launch of a new version of firefox, it presents user interface letting users select which third party add-ons to keep.
Signing an XPI - Archive of obsolete content
the password should be at least
8 characters long, and should contain at least one non-alphabetic character.
...check that it exists on the file system and in the certificate database: c:\projects\codesigning\> dir x509* 14/12/2005 15:13 1,031 x509.cacert 14/12/2005 15:13 79
8 x509.raw c:\projects\codesigning\> certutil -d .
...it consists of two files named key3.db and cert
8.db.
XML data - Archive of obsolete content
copy and paste the content from here, making sure that you scroll to get all of it: <?xml version="1.0"?> <!-- xml demonstration --> <?xml-stylesheet type="text/css" href="style9.css"?> <!doctype planet> <planet> <ocean> <name>arctic</name> <area>13,000</area> <depth>1,200</depth> </ocean> <ocean> <name>atlantic</name> <area>
87,000</area> <depth>3,900</depth> </ocean> <ocean> <name>pacific</name> <area>1
80,000</area> <depth>4,000</depth> </ocean> <ocean> <name>indian</name> <area>75,000</area> <depth>3,900</depth> </ocean> <ocean> <name>southern</name> <area>20,000</area> <depth>4,500</depth> </ocean> </planet> make a new css file, style9.css.
... copy and paste the content from here, making sure that you scroll to get all of it: /*** xml demonstration ***/ planet:before { display: block; width:
8em; font-weight: bold; font-size: 200%; content: "oceans"; margin: -.75em 0px .25em -.25em; padding: .1em .25em; background-color: #cdf; } planet { display: block; margin: 2em 1em; border: 4px solid #cdf; padding: 0px 1em; background-color: white; } ocean { display: block; margin-bottom: 1em; } name { display: block; font-weight: bold; font-size: 150%; } area { display: block; } area:before { content: "area: "; } area:after { content: " million km\b2"; } depth { display: block; } depth:before { content: "mean depth: "; } depth:after { content: " m"; } open the...
... document in your browser: oceans arctic area: 13,000 million km² mean depth: 1,200 m atlantic area:
87,000 million km² mean depth: 3,900 m .
CSS3 - Archive of obsolete content
the w3 consortium periodically publishes such snapshots, like in 2007, 2010, 2015, 2017, and 201
8.
... css fonts module level 3 candidate recommendation since september 20th, 201
8 amends the css2.1 font matching algorithm to be closer to what is really implemented.
... css basic user interface module level 3 recommendation since june 21st, 201
8 adds: the ability to tweak the box model using the css box-sizing property.
Creating a dynamic status bar extension - Archive of obsolete content
write the xul file we need a slightly more complicated xul file this time, in order to add a reference to the javascript code that will do the real work: <?xml version="1.0" encoding="utf-
8"?> <!doctype overlay> <overlay id="stockwatcher-overlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <script type="application/javascript" src="chrome://stockwatcher/content/stockwatcher.js"/> <!-- firefox --> <statusbar id="status-bar"> <statusbarpanel id="stockwatcher" label="loading..." tooltiptext="current value" onclick="stockwatcher.refreshinf...
...\w*$/, ''); // build the tooltip string var fieldarray = output.split(','); // assert that fieldarray[0] == 'goog' samplepanel.label = 'goog: ' + fieldarray[1]; samplepanel.tooltiptext = 'chg: ' + fieldarray[4] + ' | ' + 'open: ' + fieldarray[5] + ' | ' + 'low: ' + fieldarray[6] + ' | ' + 'high: ' + fieldarray[7] + ' | ' + 'vol: ' + fieldarray[
8]; } } the first thing we do here is get the status bar panel into the variable samplepanel by calling the document.getelementbyid() dom function.
...the text we receive back from the server looks something like this: "goog",414.20,"5/1/2006","1:36pm",-3.74,417.
85,419.44,412.19,4760215 we then parse the text.
Creating a status bar extension - Archive of obsolete content
> <!-- front end metadata --> <em:name>status bar sample 1</em:name> <em:description>sample static status bar panel</em:description> <em:creator>my name</em:creator> <em:homepageurl>http://developer.mozilla.org/en/docs/creating_a_status_bar_extension</em:homepageurl> <!-- describe the firefox versions we support --> <em:targetapplication> <description> <em:id>{ec
8030f7-c20a-464f-9b0e-13a3a9e973
84}</em:id> <em:minversion>1.5</em:minversion> <em:maxversion>2.0.0.*</em:maxversion> </description> </em:targetapplication> </description> </rdf> let's take a look at some key parts of the manifest.
..."{ec
8030f7-c20a-464f-9b0e-13a3a9e973
84}" is a guid that uniquely identifies firefox as the target.
...our overlay file, status-bar-sample-1.xul, looks like this: <?xml version="1.0" encoding="utf-
8"?> <!doctype overlay > <overlay id="status-bar-sample-1-overlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <!-- firefox --> <statusbar id="status-bar"> <statusbarpanel id="status-bar-sample-1" label="hello world" tooltiptext="sample status bar item" /> </statusbar> </overlay> the first order of business in the status-bar-sample-1.xu...
List of Former Mozilla-Based Applications - Archive of obsolete content
applications that switched to another technology name description additional information angelsoft tools for startups, vcs, and angel investors switched from xulrunner-based client to a web application autodesk maya 3d modeling tool switched off of gecko for help browser in version
8.5 blam feed reader switched to webkit in version 1.
8.6 boxee media center software switched to webkit in version 1.0 epiphany browser switched from gecko to webkit flock social browsing flock switched from being firefox-based to chromium-based when it released a new beta on june 16, 2010 jolicloud web operating system as o...
...ilable about how borland embedded mozilla in kylix 2 mango im client last news item on site from january 2007 mobidvd dvd/vcd/cd ripping software site down mozilla suite internet application suite development shifted to firefox, thunderbird and seamonkey applications netscape navigator browser support for netscape ended on february 1, 200
8 nvu web authoring tool development stopped in 2005 and is being continued as an unofficial bugfix release by the kompozer project pogo browser from at&t site no longer accessible as of may 2009 pyro desktop desktop environment last news item on site from july 2007 script editor editor inactive skipstone gtk+ browser last n...
...ews item on site from february 200
8 xabyl visual xbl editor inactive xulplayer media player last project update on 3/14/09 zoomcreator photo collage tool on april 29, 2010 the site announced zoomara was shutting down.
Creating a hybrid CD - Archive of obsolete content
i used version 1.
8.1a03 although you'll probably want to get a newer one.
... # example filename mapping file used by mkhybrid for hfs # # extn xlate creator type comment .hqx ascii 'sitx' 'text' "binhex file" .zip raw 'sitx' 'zip ' "zip file" .gz raw 'sitx' 'zip ' "gzip file" .tgz raw 'sitx' 'zip ' "tar.gz gzip file" .tar raw 'sitx' 'tarf' "tar file" .tif raw '
8bim' 'tiff' "photoshop tiff image" .doc raw 'mswd' 'wdbn' "word file" .mov raw 'tvod' 'moov' "quicktime movie" .bin raw 'sitx' 'bina' "mac binary" .h ascii 'cwie' 'text' "c/c++ header file" .c ascii 'cwie' 'text' "c source file" .cp ascii 'cwie' 'text' "c++ source file" .cpp ascii 'cwie' 'text' "c++ source...
... original document information author(s): dawn endico last updated date: may 1, 2001 copyright information: portions of this content are © 199
8–2007 by individual mozilla.org contributors; content available under a creative commons license | details.
Makefile.mozextension.2 - Archive of obsolete content
note that the original makefile.mozextention merely repeats the steps in getting started with extension development - mozillazine knowledge base (200
8).
...me://browser/content/browser.xul chrome://$(project)/content/overlay.xul locale $(project) en-us locale/ skin $(project) classic/1.0 skin/ style chrome://global/content/customizetoolbar.xul chrome://$(project)/skin/overlay.css endef export chrome_manifest chrome.manifest: @echo generating $(project)/chrome.manifest @echo "$$chrome_manifest" > $(project)/chrome.manifest ###### #firefox {ec
8030f7-c20a-464f-9b0e-13a3a9e973
84} #thunderbird {3550f703-e5
82-4d05-9a0
8-453d09bdfdc6} #nvu {136c295a-4a5a-41cf-bf24-5cee526720d5} #mozilla suite {
86c1
8b42-e466-45a9-ae7a-9b95ba6f5640} #seamonkey {92650c4d-4b
8e-4d2a-b7eb-24ecf4f6b63a} #sunbird {71
8e30fb-e
89b-41dd-9da7-e25a4563
8b2
8} #netscape browser {3db10fab-e461-4c
80-
8b97-957ad5f
8ea47} ###### define install_rdf <rdf xmlns="http://www.w3.or...
... you who helped me</contributor> <homepageurl>http://$(project).mozdev.org/</homepageurl> <optionsurl>chrome://$(project)/content/settings.xul</optionsurl> <abouturl>chrome://$(project)/content/about.xul</abouturl> <iconurl>chrome://$(project)/skin/mainicon.png</iconurl> <updateurl>http://$(project).mozdev.org/update.rdf</updateurl> <type>2</type> <targetapplication> <description> <id>{ec
8030f7-c20a-464f-9b0e-13a3a9e973
84}</id> <minversion>2.0</minversion> <maxversion>9.0</maxversion> </description> </targetapplication> </description> </rdf> endef export install_rdf install.rdf: @echo generating $(project)/install.rdf @echo "$$install_rdf" > $(project)/install.rdf ###### define overlay_xul <overlay id="$(project)-overlay" xmlns="http://www.mozilla.org/keymaster/g...
Microsummary topics - Archive of obsolete content
for example, the following code snippet installs the microsummary generator from the creating a microsummary tutorial: var generatortext = ' \ <?xml version="1.0" encoding="utf-
8"?> \ <generator xmlns="http://www.mozilla.org/microsummaries/0.1" \ name="firefox download count" \ uri="urn:{
835daeb3-6760-47fa-
8f4f-
8e4fdea1fb16}"> \ <template> \ <transform xmlns="http://www.w3.org/1999/xsl/transform" version="1.0"> \ <output method="text"/> \ <template match="/"> \ <value-of select="id(\'download-count\')"/> \ ...
...the value of the attribute must be a valid uri, but you can specify an arbitrary identifier using a urn, for example: urn:{
835daeb3-6760-47fa-
8f4f-
8e4fdea1fb16} to guarantee uniqueness, use urns containing uuids generated by the nsuuidgenerator component.
...for example, you might include the following header in your response to prevent firefox from making another microsummary-related request for one hour: cache-control: max-age=3600 note: because of a technical limitation (bug 346
820), firefox uses the same cache for both microsummary-related requests and user-initiated requests, so the cache headers you return apply to both.
Remotely debugging Firefox for Metro - Archive of obsolete content
this article explains how to use remote debugging to inspect and code running in the new windows
8 ("metro-style") firefox app, using the developer tools in firefox on the desktop.
... prerequisites you will need: windows
8 (metro-style) firefox running in the touch-friendly "metro" mode on a windows
8 computer.
... if you are connecting to firefox for metro on a different computer or a different port, enter the appropriate hostname and port number and then press "connect." in the windows
8 (metro) browser next you'll see a dialog in firefox for metro asking you to confirm the connection.
Safely loading URIs - Archive of obsolete content
in general, the following guidelines apply for gecko 1.
8: if you plan pass a uri string to nsiwebnavigation.loaduri (which can happen indirectly, e.g.
...there's no way to do this completely securely in gecko versions prior to 1.
8.0.4.
...note that checkloaduriwithprincipal is not scriptable in gecko 1.
8, so extensions are not able to use it.
File object - Archive of obsolete content
here is the original proposal for this object, and a status update from december 199
8: http://www.mozilla.org/js/js-file-object.html created by the file constructor: new file(); new file(filename); parameters filename name of the file we want to work with.
...currently "ascii" (ascii), "binary" (utf-
8) or "unicode" (ucs-2).
...binary (utf-
8) files and pipelines (including file.intput) do not support random access.
Tamarin-central rev 703:2cee46be9ce0 - Archive of obsolete content
tamarin-central rev 703:2cee46be9ce0 was declared stable on 12/02/0
8.
... osdefault-jitinterpretedaggressive jit mac (os/x 10.4 intel, 2ghz dual core)tc-703 vs tc-700: 0.0%tc-703 vs flash10: 1.1% slowertc-703 vs tc-700: 17.4% fastertc-703 vs flash10: 165.3% fastertc-703 vs tc-700: 0.1% fastertc-703 vs flash10: 0.
8% slower windows (xp pro, 2.13ghz dual core)tc-703 vs tc-700: 0.6% fastertc-703 vs flash10: 0.
8% fastertc-703 vs tc-700: 16.4% fastertc-703 vs flash10: 14
8.7% fastertc-703 vs tc-700: 0.1% slowertc-703 vs flash10: 5.2% faster linux (ubuntu linux, 2.13 ghz dual core)tc-703 vs tc-700: 6.0% fastertc-703 vs flash10: 1.7% fastertc-703 vs tc-700:
89.5% fastertc-703 vs flash10: 1
82.0% fa...
... osdefault-jitinterpretedaggressive jit mac (os/x 10.4 intel, 2ghz dual core)tc-703 vs tc-700: 2.0% smallertc-703 vs tc-663: 7.
8% smallertc-703 vs tc-700: 7.1% largertc-703 vs tc-663: 14.6% largertc-703 vs tc-700: 16.4% largertc-703 vs tc-663: 2.1% larger windows (xp pro, 2.13ghz dual core)tc-703 vs tc-700: 3.2% largertc-703 vs tc-663: 7.6% largertc-703 vs tc-700: 3.9% largertc-703 vs tc-663: 12.4% largertc-703 vs tc-700: 3.3% largertc-703 vs tc-663: 21.4% larger linux (ubuntu linux, 2.13 ghz dual core)n/...
Windows Install - Archive of obsolete content
onvert the available disk space into kilobytes spaceavailable = parseint(spaceavailable / 1024); // do the verification if(spaceavailable < spacerequired) { logcomment("insufficient disk space: " + dirpath); logcomment(" required : " + spacerequired + " k"); logcomment(" available: " + spaceavailable + " k"); return(false); } return(true); } function updatewinreg4ren
8dot3() { var fprogram = getfolder("program"); var ftemp = getfolder("temporary"); //notes: // can't use a double backslash before subkey // - windows already puts it in.
... winreg.setrootkey(winreg.hkey_current_user) ;// current_user subkey = "software\\microsoft\\windows\\currentversion\\runonce" ; winreg.createkey(subkey,""); valname = "ren
8dot3"; value = fprogram + "ren
8dot3.exe " + ftemp + "ren
8dot3.ini"; err = winreg.setvaluestring(subkey, valname, value); } } function prepareren
8dot3(listlongfilepaths) { var ftemp = getfolder("temporary"); var fprogram = getfolder("program"); var fren
8dot3ini = getwinprofile(ftemp, "ren
8dot3.ini"); var binicreated = false; var flongfilepath; var sshortfilepa...
...th; if(fren
8dot3ini != null) { for(i = 0; i < listlongfilepaths.length; i++) { flongfilepath = getfolder(fprogram, listlongfilepaths[i]); sshortfilepath = file.windowsgetshortname(flongfilepath); if(sshortfilepath) { fren
8dot3ini.writestring("rename", sshortfilepath, flongfilepath); binicreated = true; } } if(binicreated) updatewinreg4ren
8dot3() ; } return(0); } // main var srdest; var err; var fprogram; srdest = 449; err = initinstall(prettyname, regname, "6.0.0.2000110
801"); logcomment("initinstall: " + err); fprogram = getfolder("program"); logcomment("fprogram: " + fprogram); if(verifydiskspace(fprogram, srdest)) { setpackagefolder(fprogram); err = adddirectory("", "6.0.0.2000110
801"...
confirm - Archive of obsolete content
tall object syntax int confirm( string atext ); int confirm( string atext, string adialogtitle, number abuttonflags, string abutton0title, string abutton1title, string abutton2title, string acheckmsg, object acheckstate ); parameters the second, extended confirm() method is supported starting with gecko 1.
8.
... it accepts any number of parameters up to
8.
...that is incorrect, confirm() always returned a plain integer (in pre-gecko-1.
8 versions either 0 or 1).
Creating a Skin - Archive of obsolete content
window > box { background-color: #00
88cc; } menubar,menupopup,toolbar,tabpanels { background-color: lightblue; border-top: 1px solid white; border-bottom: 1px solid #666666; border-left: 1px solid white; border-right: 1px solid #666666; } caption { background-color: lightblue; } the inner box of the window (which actually surrounds all of the window content) has been changed to have a medium blue color.
... css: .findfilesbox { background-color: #00
88cc; } xul: <vbox class="findfilesbox" orient="vertical" flex="100%"> <toolbox> rounding on the tabs next, let's modify the tabs.
... #opensearch { list-style-image: url("chrome://editor/skin/icons/btn1.gif"); -moz-image-region: rect(4
8px 16px 64px 0); -moz-box-orient: vertical; } #savesearch { list-style-image: url("chrome://editor/skin/icons/btn1.gif"); -moz-image-region: rect(
80px 16px 96px 0); -moz-box-orient: vertical; } mozilla provides a custom style property -moz-image-region which can be used to make an element use part of an image.
Keyboard Shortcuts - Archive of obsolete content
vk_back vk_tab vk_clear vk_return vk_enter vk_shift vk_control vk_alt vk_pause vk_caps_lock vk_escape vk_space vk_page_up vk_page_down vk_end vk_home vk_left vk_up vk_right vk_down vk_printscreen vk_insert vk_delete vk_0 vk_1 vk_2 vk_3 vk_4 vk_5 vk_6 vk_7 vk_
8 vk_9 vk_semicolon vk_equals vk_a vk_b vk_c vk_d vk_e vk_f vk_g vk_h vk_i vk_j vk_k vk_l vk_m vk_n vk_o vk_p vk_q vk_r vk_s vk_t vk_u vk_v vk_w vk_x vk_y vk_z vk_numpad0 vk_numpad1 vk_numpad2 vk_numpad3 vk_numpad4 vk_numpad5 vk_numpad6 ...
... vk_numpad7 vk_numpad
8 vk_numpad9 vk_multiply vk_add vk_separator vk_subtract vk_decimal vk_divide vk_f1 vk_f2 vk_f3 vk_f4 vk_f5 vk_f6 vk_f7 vk_f
8 vk_f9 vk_f10 vk_f11 vk_f12 vk_f13 vk_f14 vk_f15 vk_f16 vk_f17 vk_f1
8 vk_f19 vk_f20 vk_f21 vk_f22 vk_f23 vk_f24 vk_num_lock vk_scroll_lock vk_comma vk_period vk_slash vk_back_quote vk_open_bracket vk_back_slash vk_close_bracket vk_quote vk_help for example, to create a shortcut that is activated when the user presses alt and f5, do the following: <keyset> <key id="test-key" modifiers="alt" keycode="vk_f5"/> </keyset> the example ...
... <?xml version="1.0" encoding="utf-
8"?> <window xmlns="http://www.mozilla.org/keymaster/gat...re.is.only.xul"> <keyset> <key id="cut_cmd" modifiers="accel" key="x"/> <key id="copy_cmd" modifiers="accel" key="c"/> <key id="paste_cmd" modifiers="accel" key="v"/> <key id="close_cmd" keycode="vk_escape" oncommand="window.close();"/> </keyset> <vbox flex="1"> <toolbox> <menubar id="findfiles-menubar"> <menu id="f...
Tree Box Objects - Archive of obsolete content
<tree id="thetree" rows="4"> <treecols> <treecol id="row" label="row" primary="true" flex="1"/> </treecols> <treechildren> <treeitem label="row 0"/> <treeitem label="row 1"/> <treeitem label="row 2"/> <treeitem label="row 3"/> <treeitem label="row 4"/> <treeitem label="row 5"/> <treeitem label="row 6"/> <treeitem label="row 7"/> <treeitem label="row
8"/> <treeitem label="row 9"/> </treechildren> </tree> <hbox align="center"> <label value="scroll to row:"/> <textbox id="tbox"/> <button label="scroll" oncommand="doscroll();"/> </hbox> note that we use the rows attribute on the tree to specify that only four rows are displayed at a time.
...bel="count" flex="1"/> </treecols> <treechildren> <treeitem> <treerow> <treecell label="fork"/> <treecell label="5"/> </treerow> </treeitem> <treeitem> <treerow> <treecell label="knife"/> <treecell label="2"/> </treerow> </treeitem> <treeitem> <treerow> <treecell label="spoon"/> <treecell label="
8"/> </treerow> </treeitem> </treechildren> </tree> <label value="row:"/> <label id="row"/> <label value="column:"/> <label id="column"/> <label value="child type:"/> <label id="part"/> the getcellat() function takes five arguments, the coordinates to look up and three out parameters.
...the column is a column object in mozilla 1.
8 and later.
Window icons - Archive of obsolete content
see also bug 1531
836 for more details.
... starting with firefox 1.5, thunderbird 1.5, and xulrunner 1.
8, you can specify an icon for a xul window by putting files named mywindow.ico (for windows) and mywindow.xpm or mywindow16.xpm (linux), where mywindow is the id of the <window> you want to attach the icon to, in the chrome/icons/default subfolder of your bundle.
...you can specify up to 4 different sizes of png icons using the suffixes .png, 16.png, 32.png and 4
8.png.
prefwindow - Archive of obsolete content
the preference window will not run correctly if you do not set this preference in your application's defaults (see bug 4
85150 for more information).
... the default setting of browser.preferences.instantapply currently is true on linux and mac os and false on windows (which however might or might not change soon, see bug 73
8797 and bug 1037225).
...this is due to bug 29641
8.
Building XULRunner - Archive of obsolete content
ild a release configuration of xulrunner is: mk_add_options moz_co_project=xulrunner mk_add_options moz_objdir=@topsrcdir@/obj-xulrunner ac_add_options --enable-application=xulrunner #uncomment the following line if you don't want to build javaxpcom: #ac_add_options --disable-javaxpcom cvs tags and xulrunner versions older xulrunner releases where tagged in cvs with (for instance xulrunner_1_
8_0_5_release ) up to version 1.
8.0.5 the cvs repository does not have specific tags for xulrunner anymore.
... for instance xulrunner 1.
8.1.3, the corresponding tag is cvs is : firefox_2_0_0_3_release to find out how those firefox tags and xulrunner version maps, check out the file mozilla/config/milestone.txt .
...for instance, in firefox 2.0.0.9 you will get : mozilla/5.0 (windows; u; windows nt 5.1; en-us; rv:1.
8.1.9) gecko/20071025 firefox/2.0.0.9 therefore the xulrunner version for this firefox version is : 1.
8.1.9 fetching sources from mercurial as with all other mozilla products, one would fetch recent sources from mercurial.
Building XULRunner with Python - Archive of obsolete content
microsoft c++ compiler is required and whilst the current free version is visual studio
8 express (msvc
8) you will almost certainly want to use visual studio .net 2003 (msvc71) which is not longer officially available.
...the alternative is to build python with msvc
8 as well asmozilla, but that may be problematic.
... pause exit /b 1 ) start "xulrunner with python" "%moz_bin%\xulrunner.exe" -app application.ini %opts% exit /b 0 see xulrunner:deploying_xulrunner_1.
8 for general information.
Getting started with XULRunner - Archive of obsolete content
here is mine: [app] vendor=xultest name=myapp version=1.0 buildid=20100901 id=xulapp@xultest.org [gecko] minversion=1.
8 maxversion=200.* note: the minversion and maxversion fields indicate the range of gecko versions your application is compatible with; make sure that you set them so that the version of xulrunner you're using is in that range, or your application won't work.
... step
8: run the application the moment of truth.
... windows from a windows command prompt opened to the myapp folder, we should be able to execute this: c:\path\to\xulrunner.exe application.ini of course, if you opted to install xulrunner then you could simply do %programfiles%\xulrunner.exe application.ini or on 64 bit systems %programfiles(x
86)%\xulrunner.exe application.ini note: you can also install your application when you're finished debugging it.
XULRunner Hall of Fame - Archive of obsolete content
now available with xulrunner 30 with i1
8n support.
...they are all based on xulrunner 1.
8 or earlier.
...latest release: 1.2 november 200
8 - source cocoapsyc.app a psyc im/chat client for mac os x (also available as a firefox extension).
XUL Application Packaging - Archive of obsolete content
required example: buildid=20060201 id specifies the unique application id required the application id, like extension ids, can be formatted either like an email applicationname@vendor.tld or a uuid {1234567
8-1234-1234-1234-1234567
89abc}.
... required example: minversion=1.
8 maxversion specify the maximum xulrunner version needed by this application.
... optional - default value is any xulrunner less than xulrunner 2 example: maxversion=1.
8.0.* the [xre] section the xre section specifies various features of xulrunner startup that can be enabled enableextensionmanager specifies whether to enable extensions and extension management.
Archived Mozilla and build documentation - Archive of obsolete content
automated testing tips and tricks automatic mozilla configurator ankh
8 automatically handle failed asserts in debug builds as of 2004-12-
8, it is now possible to automatically handle failed asserts in debug builds of mozilla for windows.
... porting nspr to unix platforms last modified 16 july 199
8 priority content update: i've removed documents from this list that have been migrated into the wiki.
...note that it is not included in the gecko-based browsers such as k-meleon, galeon and netscape
8.x.
2006-12-01 - Archive of obsolete content
gecko 1.9a1 triage meetings vlad announced that the gecko devs will be taking over the ff2 triage meetings until gecko 1.9a1 ships (nov 2
8th).
... bon echo project status: remaining "to-do" items beltzner starts a discussion on when to offer 1.5.0.
8+ users the chance to upgrade to ff2.x (now or when ff2.0.0.1 is released).
... also discussed is the the mozilla_1_
8_branch's npotb (not part of the build) checkin policy.
NPString - Archive of obsolete content
« gecko plugin api reference « scripting plugins summary npstring is a struct that holds a pointer to a sequence of
8-bit units (nputf
8) making up a utf-
8 string, and the number of
8-bit units in the utf-
8 string.
...syntax typedef struct _npstring { const nputf
8 *utf
8characters; uint32_t utf
8length; } npstring; fields the data structure has the following fields: utf
8characters an array of the utf-
8 characters comprising the string.
... utf
8length the number of bytes in the utf-
8 string (not the number of characters).
NPVariant - Archive of obsolete content
boolean npvarianttype_bool number npvarianttype_int32 or npvarianttype_double string npvarianttype_string all other types npvarianttype_object functions npn_releasevariantvalue() npn_getstringidentifier() npn_getstringidentifiers() npn_getintidentifier() npn_identifierisstring() npn_utf
8fromidentifier() npn_intfromidentifier() macros plugin developers are not expected to directly manipulate or access the members of the npvariant instance, instead, the function npn_releasevariantvalue(), and the following macros are provided: npvariant_is_void() evaluates to true if v is of type npvarianttype_void.
... stringz_to_npvariant() initialize v to a variant of type npvarianttype_string with the value being an npstring holding the utf-
8 string value val.
... stringn_to_npvariant() initialize v to a variant of type npvarianttype_string with the value being an npstring holding the utf-
8 string value val with the length len.
Tamarin Tracing Build Documentation - Archive of obsolete content
for instructions on tamarin central, please see tamarin build documentation supported platforms operating system processor status windows xp x
86 supported, acceptance and performance tests automated in buildbot mac os x 10.4 x
86 supported, acceptance and performance tests automated in buildbot linux - ubuntu
8.0.4 x
86 supported, acceptance and performance tests automated in buildbot windows mobile (pocket pc 5.0) armv4t supported, acceptance and performance tests automated in buildbot raw image (no os) armv5 supported, acceptance and performance tests not done linux (nokia n
810) armv5 supported, acceptance and performance tests not done current build s...
...additionally, you need python 2.4 or later and gnu make 3.
81 or later.
... (gnu make 3.
80 does not work.
Making sure your theme works with RTL locales - Archive of obsolete content
example toolbar[iconsize="large"][mode="icons"] #back-button { -moz-image-region: rect(0px 396px 34px 360px); } toolbar[iconsize="large"][mode="icons"] #back-button:-moz-locale-dir(rtl) { -moz-image-region: rect(0px 516px 34px 4
80px); } this specifies the default, left-to-right version of the button, then offers an override if the user's interface is being rendered in right-to-left mode.
... toolbar[iconsize="large"][mode="icons"] #back-button { -moz-image-region: rect(0px 39
8px 34px 360px); } toolbar[iconsize="large"][mode="icons"] #back-button[chromedir="rtl"] { -moz-image-region: rect(0px 516px 34px 47
8px); } this way, if chromedir is "rtl", the second rule will override the first, and the theme will work in rtl.
...instead, you should use the following start/end rules instead to ensure rtl compatibility: -moz-padding-start -moz-padding-end -moz-margin-start -moz-margin-end -moz-border-start -moz-border-start-color -moz-border-start-style -moz-border-start-width -moz-border-end -moz-border-end-color -moz-border-end-style -moz-border-end-width #urlbar-search-splitter { min-width:
8px; -moz-margin-start: -4px; border: none; background: transparent; } testing your theme testing your theme for rtl compatibility is easy, and you do not even have to go through the hassle of downloading a rtl locale.
Theme changes in Firefox 3.5 - Archive of obsolete content
affected files details scrollbar.xml, xulscrollbars.css the <gripper> element was removed from the scrollbar thumb button by bug 44
8704.
... global/checkbox.css, global/radio.css since bug 394
892, radio buttons and checkboxes no longer have a minimum size on mac os x.
... browser.xul bug 4631
89 added a new attribute on the xul window element of browser.xul named browsingmode.
-ms-scroll-snap-points-x - Archive of obsolete content
(the -ms-scroll-snap-points-x property behaves identically to the -ms-scroll-snap-points-y property, but along the x-axis.) .container { overflow-x: auto; overflow-y: hidden; -ms-scroll-snap-type: mandatory; -ms-scroll-snap-points-x: snapinterval(0%, 100%); width: 4
80px; height: 270px; } .imagecontainer { -ms-scroll-chaining: chained; -ms-overflow-style: none; -ms-content-zooming: zoom; -ms-scroll-rails: none; -ms-scroll-limit-x-min: 100%; -ms-scroll-limit-x-max: 500%; -ms-scroll-snap-type: proximity; -ms-scroll-snap-points-x: snaplist(100%, 200%, 300%, 400%, 500%); -ms-overflow-style: none; width: 4
80px; height: 270px; overflow: au...
... remarks this property requires windows
8 or later.
... starting with windows
8.1, this property is also supported for mouse, keyboard, and touchpad interaction.
-ms-scroll-snap-points-y - Archive of obsolete content
(the -ms-scroll-snap-points-y property behaves identically to the -ms-scroll-snap-points-x property, but along the y-axis.) .container { overflow-x: auto; overflow-y: hidden; -ms-scroll-snap-type: mandatory; -ms-scroll-snap-points-y: snapinterval(0%, 100%); width: 4
80px; height: 270px; } .imagecontainer { -ms-scroll-chaining: chained; -ms-overflow-style: none; -ms-content-zooming: zoom; -ms-scroll-rails: none; -ms-scroll-limit-y-min: 100%; -ms-scroll-limit-y-max: 500%; -ms-scroll-snap-type: proximity; -ms-scroll-snap-points-y: snaplist(100%, 200%, 300%, 400%, 500%); -ms-overflow-style: none; width: 4
80px; height: 270px; overflow: au...
... remarks this property requires windows
8 or later.
... starting with windows
8.1, this property is also supported for mouse, keyboard, and touchpad interaction.
E4X for templating - Archive of obsolete content
it will be disabled by default for content in firefox 16, disabled by default for chrome in firefox 17, and removed in firefox 1
8.
...while it may be obvious after a study of the basics of e4x that it can be used for this purpose, if one adds a few common purpose functions (especially along with the convenience of javascript 1.
8 expression closures), the templates can function more dynamically, offering the power and readability of templating languages such as smarty for php (though admittedly without the currently wider cross-browser support of xslt or the strictly-xml approach of phptal or seethrough templating).
...m; } else if (typeof item === 'string') { ret += new xml(item); } else { var ser = (new xmlserializer()).serializetostring(item); ret += new xml(ser); } }); return ret; } example: var fruits = <fruits> <item>pear</item> <item>banana</item> <item>grapes</item> </fruits>; alert( // using a javascript 1.
8 expression closure <output> {sort(fruits.*, function (a, b) a.text() > b.text() /* text() call may not be necessary */ )} </output>.toxmlstring() ); /* <output> <item>banana</item> <item>grapes</item> <item>pear</item> </output> */ the above utility also works if the input is an htmlcollection, an array of strings, an array of dom objects, or an array of e4x objects (assuming the com...
Array comprehensions - Archive of obsolete content
the array comprehensions syntax is non-standard and removed starting with firefox 5
8.
...obsolete since gecko 5
8 (firefox 5
8 / thunderbird 5
8 / seamonkey 2.55)this feature is obsolete.
... var numbers = [1, 2, 3, 4]; var doubled = [for (i of numbers) i * 2]; console.log(doubled); // logs 2,4,6,
8 this is equivalent to the following map() operation: var doubled = numbers.map(i => i * 2); comprehensions can also be used to select items that match a particular expression.
ActiveXObject - Archive of obsolete content
warning: this object is a microsoft extension and is supported in internet explorer only, not in windows
8.x store apps.
...excelsheet.application.quit(); requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, internet explorer 10 standards, internet explorer 11 standards.
... not supported in windows
8.x store apps.
Debug.msUpdateAsyncCallbackRelation - Archive of obsolete content
also supported in store apps (windows
8.1 and windows phone
8.1).
... not supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, internet explorer 10 standards.
... not supported in windows
8.
Debug.write - Archive of obsolete content
internet explorer
8 includes the javascript debugger.
... var counter = 42; debug.write("the value of counter is " + counter); requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, internet explorer 10 standards, internet explorer 11 standards.
... also supported in store apps (windows
8 and windows phone
8.1).
Debug.writeln - Archive of obsolete content
internet explorer
8 includes the javascript debugger.
... var counter = 42; debug.writeln("the value of counter is " + counter); requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, internet explorer 10 standards, internet explorer 11 standards.
... also supported in store apps (windows
8 and windows phone
8.1).
Enumerator - Archive of obsolete content
it is supported in internet explorer only, not in windows
8.x store apps.
... requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, and internet explorer 10 standards.
... not supported in windows
8.x store apps.
Back to the Server: Server-Side JavaScript On The Rise - Archive of obsolete content
in recent developments we also see the advent of other performant engines for javascript such as v
8 from google and squirrelfish for webkit, these engines are raising the bar on performance and help to maintain a competitive environment that will hopefully direct competitive focus on the performance aspect of all the major javascript implementations.
...listing
8 shows the two functions used to handle the comment submission process.
... listing
8 - submitting comment data <script> function formhandler() { // get the form values var name = txt_name.getvalue(); var email = txt_email.getvalue(); var message = txt_message.getvalue(); // if the form passes validation client-side, submit results to the processor if( validatecomments( name, email, message ) ) { formprocessor( name, email, message ); // update the logger with the most recent entry document.getelementbyid( "out-logger" ).innerhtml += "name: " + name + "<br/>email: " + email + "<br/>message: " + message + "<br/><br/>"; } else { ext.msg.alert( "error", "please enter the required fields" ); } } </script> <!-- processes the form contents --> <script runat="server"> function formprocessor( name, email, message ) { // perfor...
forEach - Archive of obsolete content
--gandalf 07:1
8, 31 may 2005 (pdt) is there a way to make foreach make use of break?
... if (value>1){ return false;//we could have some way to break when we return false } }); //woulld print 1 2 --porfirio 11:17, 22-06-200
8 another option would be to throw stopiteration and catch it within foreach().
... --bencollver 11:1
8, 13-0
8-200
8 ...
RFE to the Custom Controls - Archive of obsolete content
output that shows the dom if output contains cdata section or text node and its data is any mozilla known language like xhtml/xul/svg then output should parse and display it (see bug 316
817).
... output should show data in current locale format the bug 3315
85 address the issue.
...the related bug is bug 34
8562.
Examples - Game development
204
8 a sliding number tiles puzzle game.
... star citadel a new take on star castle, cinematronics' classic 19
80 arcade game, built with canvas 2d.
... elliot quest
8-bit graphic retro adventure game.
GLSL Shaders - Game development
<!doctype html> <html> <head> <meta charset="utf-
8"> <title>mdn games: shaders demo</title> <style> body { margin: 0; padding: 0; font-size: 0; } canvas { width: 100%; height: 100%; } </style> <script src="three.min.js"></script> </head> <body> <script id="vertexshader" type="x-shader/x-vertex"> // vertex shader's code goes here </script> <script id="fragmentshader" type="x-shader/x-fragment"> // fragment shader's code goes here ...
... the texture shader code now we'll add the texture shader to the code — add the code below to the body's second <script> tag: void main() { gl_fragcolor = vec4(0.0, 0.5
8, 0.
86, 1.0); } this will set an rgba color to recreate the current light blue one — the first three float values (ranging from 0.0 to 1.0) represent the red, green, and blue channels while the fourth one is the alpha transparency (ranging from 0.0 — fully transparent — to 1.0 — fully opaque).
...ml <script src="https://end3r.github.io/mdn-games-3d/shaders/js/three.min.js"></script> <script id="vertexshader" type="x-shader/x-vertex"> void main() { gl_position = projectionmatrix * modelviewmatrix * vec4(position.x+10.0, position.y, position.z+5.0, 1.0); } </script> <script id="fragmentshader" type="x-shader/x-fragment"> void main() { gl_fragcolor = vec4(0.0, 0.5
8, 0.
86, 1.0); } </script> javascript var width = window.innerwidth; var height = window.innerheight; var renderer = new three.webglrenderer({antialias:true}); renderer.setsize(width, height); renderer.setclearcolor(0xdddddd, 1); document.body.appendchild(renderer.domelement); var scene = new three.scene(); var camera = new three.perspectivecamera(70, width...
Track the score and win - Game development
« previousnext » this is the
8th step out of 10 of the gamedev canvas tutorial.
... you can find the source code as it should look after completing this lesson at gamedev-canvas-workshop/lesson
8.html.
...add the following after the collisiondetection() function: function drawscore() { ctx.font = "16px arial"; ctx.fillstyle = "#0095dd"; ctx.filltext("score: "+score,
8, 20); } drawing text on a canvas is similar to drawing a shape.
Visual typescript game engine - Game development
*/ private aspectratio: number = 1.333; /** * domain is simple url address, * recommendent to use for local propose lan ip * like : 192.16
8.0.xxx if you wanna run ant test app with server.
...e.js | | ├── common/ | | ├── email/ | | | ├── templates/ | | | | ├── confirmation.html.js | | | ├── nocommit.js (no commited for now) | | └── data/ (ignored - db system folder) | ├── rtc/ | | ├── server.ts | | ├── connector.ts | | ├── self-cert/ server part installed database: mongodb@3.1.
8 -no typescript here, we need to keep state clear no.
... this.networkdeeplogs = false; this.rtcserverport = 12034; this.rtc3serverport = 12034; this.connectorport = 1234; this.domain = "192.16
8.0.14"; this.masterserverkey = "multi-platformer-sever1.maximum"; this.protocol = "http"; this.issecure = false; this.appuseaccountssystem = true; this.appusevideochat = true; this.databasename = "masterdatabase"; this.databaseroot = "mongodb://localhost:27017"; - the running server is easy : npm run rtc with this cmd: npm run rtc we run server.js and connector.ts ...
Grid Lines - MDN Web Docs Glossary: Definitions of Web-related terms
* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 100px); } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> </div> .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: 100px 100px; } lines can be addressed using their line number.
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 100px); } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } <div class="wrapper"> <div class="item">item</div> </div> .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: 100px 100px; } .item { grid-column-start: 1; grid-column-end: 3; grid-row-start: 1; grid-row-end: 3; } naming lines the lines created in the explicit grid can be named, by adding the na...
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 100px); } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd
8a
8; padding: 1em; color: #d94
80f; } <div class="wrapper"> <div class="item">item</div> </div> .wrapper { display: grid; grid-template-columns: [col1-start] 1fr [col2-start] 1fr [col3-start] 1fr [cols-end]; grid-template-rows: [row1-start] 100px [row2-start] 100px [rows-end]; } .item { grid-column-start: col1-start; grid-column-end: col3-start; grid-row-start: row1-start...
Percent-encoding - MDN Web Docs Glossary: Definitions of Web-related terms
percent-encoding is a mechanism to encode
8-bit characters that have specific meaning in the context of urls.
... ':' '/' '?' '#' '[' ']' '@' '!' '$' '&' "'" '(' ')' '*' '+' ',' ';' '=' '%' ' ' %3a %2f %3f %23 %5b %5d %40 %21 %24 %26 %27 %2
8 %29 %2a %2b %2c %3b %3d %25 %20 or + depending on the context, the character ' ' is translated to a '+' (like in the percent-encoding version used in an application/x-www-form-urlencoded message), or in '%20' like on urls.
... technical knowledge rfc 39
86, section 2.1, where this encoding is defined.
WAI-ARIA basics - Learn web development
browser support is generally quite good — at the time of writing, caniuse.com stated that global browser support for wai-aria was around
88%.
...in addition, some older browsers (most notably ie
8) don't recognise the semantics of the html5 elements.
... beyond this, the site is more likely to be accessible to users of older browsers such as ie
8; it is worth including aria roles for that purpose.
CSS values and units - Learn web development
<number> a <number> represents a decimal number — it may or may not have a decimal point with a fractional component, for example 0.255, 12
8, or -1.2.
...each <li> has a font-size of
80%, therefore the nested list items become progressively smaller as they inherit their sizing from their parent.
...each hex value consists of a hash/pound symbol (#) followed by six hexadecimal numbers, each of which can take one of 16 values between 0 and f (which represents 15) — so 01234567
89abcdef.
Responsive design - Learn web development
for example, the following media query tests to see if the current web page is being displayed as screen media (therefore not a printed document) and the viewport is at least
800 pixels wide.
... @media screen and (min-width:
800px) { .container { margin: 1em 2em; } } you can add multiple media queries within a stylesheet, tweaking your whole layout or parts of it to best suit the various screen sizes.
...if you've got a narrow screen layout that kicks in at 4
80px viewport width or less, and the viewport is set at 960px, you'll never see your narrow screen layout on mobile.
Supporting older browsers - Learn web development
* {box-sizing: border-box;} .wrapper { background-color: rgb(79,1
85,227); padding: 10px; max-width: 400px; display: grid; grid-template-columns: 1fr 1fr 1fr; } .item { float: left; border-radius: 5px; background-color: rgb(207,232,220); padding: 1em; } <div class="wrapper"> <div class="item">item one</div> <div class="item">item two</div> <div class="item">item three</div> </div> note: the clear property also has no effect once the...
... * {box-sizing: border-box;} .wrapper { background-color: rgb(79,1
85,227); padding: 10px; max-width: 400px; display: grid; grid-template-columns: 1fr 1fr 1fr; } .item { float: left; border-radius: 5px; background-color: rgb(207,232,220); padding: 1em; width: 33.333%; } <div class="wrapper"> <div class="item">item one</div> <div class="item">item two</div> <div class="item">item three</div> </div> to deal with this issue we need to ...
... * {box-sizing: border-box;} .wrapper { background-color: rgb(79,1
85,227); padding: 10px; max-width: 400px; display: grid; grid-template-columns: 1fr 1fr 1fr; } .item { float: left; border-radius: 5px; background-color: rgb(207,232,220); padding: 1em; width: 33.333%; } @supports (display: grid) { .item { width: auto; } } <div class="wrapper"> <div class="item">item one</div> <div class="item">item two</div> <div class="item">...
How does the Internet work? - Learn web development
it began in the 1960s as a us-army-funded research project, then evolved into a public infrastructure in the 19
80s with the support of many public universities and private companies.
...detailed well visualized
8 minute video.
...it's an address made of a series of four numbers separated by dots, for example: 192.16
8.2.10.
What is a URL? - Learn web development
let's see the most important parts using the following url: http://www.example.com:
80/path/to/myfile.html?key1=value1&key2=value2#somewhereinthedocument http is the protocol.
... :
80 is the port.
...it is usually omitted if the web server uses the standard ports of the http protocol (
80 for http and 443 for https) to grant access to its resources.
What is a Domain Name? - Learn web development
173.194.121.32) or an ipv6 address (e.g., 2027:0da
8:
8b73:0000:0000:
8a2e:0370:1337).
... alternatively, if you use a system with a built-in shell, type a whois command into it, as shown here for mozilla.org: $ whois mozilla.org domain name:mozilla.org domain id: d1409563-lror creation date: 199
8-01-24t05:00:00z updated date: 2013-12-0
8t01:16:57z registry expiry date: 2015-01-23t05:00:00z sponsoring registrar:markmonitor inc.
... (r37-lror) sponsoring registrar iana id: 292 whois server: referral url: domain status: clientdeleteprohibited domain status: clienttransferprohibited domain status: clientupdateprohibited registrant id:mmr-336
84 registrant name:dns admin registrant organization:mozilla foundation registrant street: 650 castro st ste 300 registrant city:mountain view registrant state/province:ca registrant postal code:94041 registrant country:us registrant phone:+1.6509030
800 as you can see, i can't register mozilla.org because the mozilla foundation has already registered it.
Styling web forms - Learn web development
al; } @font-face { font-family: 'typewriter'; src: url('fonts/veteran_typewriter-webfont.woff2') format('woff2'), url('fonts/veteran_typewriter-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } body { font : 1.3rem sans-serif; padding : 0.5em; margin : 0; background : #222; } form { position : relative; width : 740px; height : 49
8px; margin : 0 auto; padding: 1em; box-sizing: border-box; background : #fff url(background.jpg); /* we create our grid */ display : grid; grid-gap : 20px; grid-template-columns : repeat(2, 1fr); grid-template-rows : 10em 1em 1em 1em; } notice that we've used some css grid and flexbox to lay out the form.
...first, let's ensure that the <label>s are given the right font: label { font : .
8em "typewriter", sans-serif; } the text fields require some common rules.
... simply put, we remove their borders and backgrounds, and redefine their padding and margin: input, textarea { font : 1.4em/1.5em "handwriting", cursive, sans-serif; border : none; padding : 0 10px; margin : 0; width :
80%; background : none; } when one of these fields gains focus, we highlight them with a light grey, transparent, background (it is always important to have focus style, for usability and keyboard accessibility): input:focus, textarea:focus { background : rgba(0,0,0,.1); border-radius: 5px; } now that our text fields are complete, we need to adjust the display of the single and multiple line text fields to match, since they won't typically look the same using the defaults.
HTML Cheatsheet - Learn web development
embedded audio <audio controls="controls" src="https://udn.realityripple.com/samples/b7/193cb03
8d0.mp3">your browser does not support the html5 audio element.</audio> your browser does not support the html5 audio element.
... embedded audio with alternative sources <audio controls="controls"><source src="https://udn.realityripple.com/samples/b7/193cb03
8d0.mp3" type="audio/mpeg"><source src="https://udn.realityripple.com/samples/f7/14a4179ee6.ogg" type="audio/ogg"> your browser does not support audio.
... embedded video <video controls src="https://udn.realityripple.com/samples/1f/6cc6652
8b
8.mp4">the <code>video</code> element is unsupported.</video> the video element is unsupported.
Adding vector graphics to the Web - Learn web development
<img src="equilateral.svg" alt="triangle with all three sides equal" height="
87" width="100" /> pros quick, familiar image syntax with built-in text equivalent available in the alt attribute.
... troubleshooting and cross-browser support for browsers that don't support svg (ie
8 and below, android 2.3 and below), you could reference a png or jpg from your src attribute and use a srcset attribute (which only recent browsers recognize) to reference the svg.
... </text> </svg> </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution" disabled> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 9
8%; } body { margin: 10px; background: #f5f9fa; } const textarea = document.getelementbyid('code'); const reset = document.getelementbyid('reset'); const solution = document.getelementbyid('solution'); const output = document.queryselector('.output'); let code = textarea.value; let userentry = textarea.value; function updatecode() { output.innerhtml = textarea.value; } reset.addeventliste...
Images in HTML - Learn web development
therefore, you should give your image a descriptive filename; dinosaur.jpg is better than img
835.png.
...character).</p> <textarea id="code" class="input" style="min-height: 100px; width: 95%"> <img> </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 9
8%; } body { margin: 10px; background: #f5f9fa; } var textarea = document.getelementbyid('code'); var reset = document.getelementbyid('reset'); var solution = document.getelementbyid('solution'); var output = document.queryselector('.output'); var code = textarea.value; var userentry = textarea.value; function updatecode() { output.innerhtml = textarea.value; } reset.addeventlistener('cli...
...a tab character).</p> <textarea id="code" class="input" style="min-height: 100px; width: 95%"> </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 9
8%; } body { margin: 10px; background: #f5f9fa; } var textarea = document.getelementbyid('code'); var reset = document.getelementbyid('reset'); var solution = document.getelementbyid('solution'); var output = document.queryselector('.output'); var code = textarea.value; var userentry = textarea.value; function updatecode() { output.innerhtml = textarea.value; } reset.addeventlistener('cli...
From object to iframe — other embedding technologies - Learn web development
a tab character).</p> <textarea id="code" class="input" style="width: 95%;min-height: 100px;"> </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 9
8%; } body { margin: 10px; background: #f5f9fa; } const textarea = document.getelementbyid('code'); const reset = document.getelementbyid('reset'); const solution = document.getelementbyid('solution'); const output = document.queryselector('.output'); let code = textarea.value; let userentry = textarea.value; function updatecode() { output.innerhtml = textarea.value; } reset.addeventliste...
...ow solution') { textarea.value = solutionentry; solution.value = 'hide solution'; } else { textarea.value = userentry; solution.value = 'show solution'; } updatecode(); }); const htmlsolution = '<iframe width="420" height="315" src="https://www.youtube.com/embed/qh2-tgulwu4" frameborder="0" allowfullscreen>\n</iframe>\n\n<iframe src="https://www.google.com/maps/embed?pb=!1m1
8!1m12!1m3!1d37995.6574
8333395!2d-2.27356
81664127
84!3d53.473310471916975!2m3!1f0!2f0!3f0!3m2!1i1024!2i76
8!4f13.1!3m3!1m2!1s0x4
87bae6c05743d3d%3a0xf
82fddd1e49fc0a1!2sthe+lowry!5e0!3m2!1sen!2suk!4v151
81717
85211" width="600" height="450" frameborder="0" style="border:0" allowfullscreen>\n</iframe>'; let solutionentry = htmlsolution; textarea.addeventlistener('input', updatecode); window.addeventliste...
... now let's look at an <object> example that embeds a pdf into a page (see the live example and the source code): <object data="mypdf.pdf" type="application/pdf" width="
800" height="1200" typemustmatch> <p>you don't have a pdf plugin, but you can <a href="mypdf.pdf">download the pdf file.
HTML table advanced features and accessibility - Learn web development
your finished table should look something like the following: hidden example <!doctype html> <html> <head> <meta charset="utf-
8"> <title>my spending record</title> <style> html { font-family: sans-serif; } table { border-collapse: collapse; border: 4px solid rgb(200,200,200); letter-spacing: 1px; font-size: 0.
8rem; } td, th { border: 2px solid rgb(190,190,190); padding: 10px 20px; } t...
... </style> </head> <body> <table> <caption>how i chose to spend my money</caption> <thead> <tr> <th>purchase</th> <th>location</th> <th>date</th> <th>evaluation</th> <th>cost (€)</th> </tr> </thead> <tfoot> <tr> <td colspan="4">sum</td> <td>11
8</td> </tr> </tfoot> <tbody> <tr> <td>haircut</td> <td>hairdresser</td> <td>12/09</td> <td>great idea</td> <td>30</td> </tr> <tr> <td>lasagna</td> <td>restaurant</td> <td>12/09</td> <td>regrets</td> <td>1
8</td> </t...
... items sold august 2016 clothes accessories trousers skirts dresses bracelets rings belgium antwerp 56 22 43 72 23 gent 46 1
8 50 61 15 brussels 51 27 3
8 69 2
8 the netherlands amsterdam
89 34 69
85 3
8 utrecht
80 12 43 36 19 but what if you cannot make those visual associations?
Third-party APIs - Learn web development
for example: let map = l.mapquest.map('map', { center: [53.4
80759, -2.242631], layers: l.mapquest.tilelayer('map'), zoom: 12 }); here we are creating a variable to store the map information in, then creating a new map using the mapquest.map() method, which takes as its parameters the id of a <div> element you want to display the map in ('map'), and an options object containing the details of the particular map we want to display.
...add the following code to your example, again inside window.onload: l.marker([53.4
80759, -2.242631], { icon: l.mapquest.icons.marker({ primarycolor: '#22407f', secondarycolor: '#3b599
8', shadow: true, size: 'md', symbol: 'a' }) }) .bindpopup('this is manchester!') .addto(map); as you can see, this at its simplest takes two parameters, an array containing the coordinates at which to display the marker, and an options object containing an icon property tha...
... note: the example has rudimentary form data validation — the search term field has to be filled in before the form can be submitted (achieved using the required attribute), and the date fields have pattern attributes specified, which means they won't submit unless their values consist of
8 numbers (pattern="[0-9]{
8}").
A first splash into JavaScript - Learn web development
example — guess the number game in this article we'll show you how to build up the simple game you can see below: top hidden code <!doctype html> <html> <head> <meta charset="utf-
8"> <title>number guessing game</title> <style> html { font-family: sans-serif; } body { width: 50%; max-width:
800px; min-width: 4
80px; margin: 0 auto; } .lastresult { color: white; padding: 3px; } </style> </head> <body> <h1>number guessing game</h...
... the next block (lines
8–24 above) does a few checks: the first if(){ } checks whether the user's guess is equal to the randomnumber set at the top of our javascript.
... the last three lines in the function (lines 26–2
8 above) get us ready for the next guess to be submitted.
Object-oriented JavaScript for beginners - Learn web development
you can then add properties and methods to this object using dot or bracket notation as desired; try these examples in your console: person1.name = 'chris'; person1['age'] = 3
8; person1.greeting = function() { alert('hi!
...try this in your js console: let person1 = new object({ name: 'chris', age: 3
8, greeting: function() { alert('hi!
... one limitation of create() is that ie
8 does not support it.
Setting up your own test automation environment - Learn web development
you can use any url to point to your resource, including a file:// url to test a local document: driver.get('file:///users/chrismills/git/learning-area/tools-testing/cross-browser-testing/accessibility/fake-div-buttons.html'); or driver.get('http://localhost:
8888/fake-div-buttons.html'); but it is better to use a remote server location so the code is more flexible — when you start using a remote server to run your tests (see later on), your code will break if you try to use local paths.
... accesskey can be generated from automation dashboard or profile section const key = '{accesskey}'; // gridurl: gridurl can be found at automation dashboard const grid_host = 'hub.lambdatest.com/wd/hub'; function searchtextongoogle() { // setup input capabilities const capabilities = { platform: 'windows 10', browsername: 'chrome', version: '67.0', resolution: '12
80x
800', network: true, visual: true, console: true, video: true, name: 'test 1', // name of the test build: 'nodejs build' // name of the build }; // url: https://{username}:{accesstoken}@hub.lambdatest.com/wd/hub const gridurl = 'https://' + username + ':' + key + '@' + grid_host; // setup and build selenium driver object const driver = new w...
... give it the following contents: const webdriver = require('selenium-webdriver'), by = webdriver.by, until = webdriver.until; // input capabilities let capabilities = { 'browsername' : 'firefox', 'browser_version' : '56.0 beta', 'os' : 'os x', 'os_version' : 'sierra', 'resolution' : '12
80x1024', 'browserstack.user' : 'your-user-name', 'browserstack.key' : 'your-access-key', 'browserstack.debug' : 'true', 'build' : 'first build' }; let driver = new webdriver.builder().
Creating a Language Pack
$ cd ../../dist the xpi file can be found in the directory win32/xpi on windows, linux-i6
86/xpi or linux-x
86_64 on linux or mac/xpi on mac.
... $ make ident fx_revision 237dccbcb967 buildid 20091126033
851 you can now go back to your source hg clone.
... $ cd ../../dist/ $ ls -l total 100216 drwxr-xr-x 5 your_id your_status 170 27 lis 13:33 branding -rw-r--r--@ 1 your_id your_status 2524
8119 26 lis 14:34 firefox-3.6b5pre.en-us.mac.dmg -rw-r--r--@ 1 your_id your_status 26056973 27 lis 13:40 firefox-3.6b5pre.x-testing.mac.dmg drwxr-xr-x 3 your_id your_status 102 27 lis 13:3
8 install drwxr-xr-x 3 your_id your_status 102 27 lis 13:40 l10n-stage drwxr-xr-x 3 your_id your_status 102 27 lis 13:37 xpi-stage you can install your locale's binary just as you would...
Creating a Login Manager storage module
some work has already been done to integrate the login manager with the mac os x keychain (bug 106400) and gnome keyring manager (bug 309
807).
... const cc = components.classes; const ci = components.interfaces; components.utils.import("resource://gre/modules/xpcomutils.jsm"); function sampleloginmanagerstorage() {} sampleloginmanagerstorage.prototype = { classdescription: "sample nsiloginmanagerstorage implementation", contractid: "@example.com/login-manager/storage/sample;1", classid: components.id("{364a11
8c-747a-4f6d-ac63-2d299
8e5a5c1}"), queryinterface: xpcomutils.generateqi([ci.nsiloginmanagerstorage]), // this registers the category for overriding the built-in nsiloginmanagerstorage _xpcom_categories: [ { category: "login-manager-storage", entry: "nsiloginmanagerstorage" } ], // console logging service, used for debugging.
... { this.stub(arguments); }, findlogins: function slms_findlogins(count, hostname, formsubmiturl, httprealm) { this.stub(arguments); }, countlogins: function slms_countlogins(ahostname, aformsubmiturl, ahttprealm) { this.stub(arguments); } }; function nsgetmodule(compmgr, filespec) xpcomutils.generatemodule([sampleloginmanagerstorage]); sample c++ implementation bug 309
807 contains a complete example.
Creating reftest-based unit tests
if the bitmaps resulting from displaying the two files in an
800x1000 window are identical, the test passes.
...sorry about this, but the released builds and the nightly builds are built with the "--disable-tests" option and reftest will not work - see bug 369
809.
... references http://old.nabble.com/please-add-%22in-testsuite-%22-to-layout-bugs-when-resolving-them!-td77
87412.html further documentation: layout/tools/reftest/readme.txt ...
Debugging JavaScript
(note that before firefox 2
8, this was labeled "browser debugger" and only the debugger was available, not the whole toolbox.) note that you must accept the incoming connection : (you may disable the pop-up above with the devtools.debugger.prompt-connection set to false in about:config.
...(note that before firefox 2
8, only the script debugger was available.) the use of these tools are the same as the built-in tools.
...e.linenumber + ")"); } return lines.join("\n"); } see also debugging mozilla with gdb setting up an extension development environment (particularly development preferences and development extensions) original document information author(s): ben bucksch created date: september 12, 2005, last updated date: november 10, 2009 copyright information: portions of this content are © 199
8–2007 by individual mozilla.org contributors; content available under a creative commons license | details.
HTTP logging
you will see several files that look like: log.txt-main.1
806, log.txt-child.1954, log.txt-child.1970, etc.
...ter key after each one.: for 64-bit windows: set moz_log=timestamp,rotate:200,nshttp:5,cache2:5,nssockettransport:5,nshostresolver:5,cookie:5 set moz_log_file=%temp%\log.txt "c:\program files\mozilla firefox\firefox.exe" for 32-bit windows: set moz_log=timestamp,rotate:200,nshttp:5,cache2:5,nssockettransport:5,nshostresolver:5,cookie:5 set moz_log_file=%temp%\log.txt "c:\program files (x
86)\mozilla firefox\firefox.exe" (these instructions assume that you installed firefox to the default location, and that drive c: is your windows startup disk.
... copy and paste the following line into the "run" command window and then press enter: for 32-bit windows: "c:\program files (x
86)\mozilla firefox\firefox.exe" -moz_log=timestamp,rotate:200,nshttp:5,cache2:5,nssockettransport:5,nshostresolver:5,cookie:5 -moz_log_file=%temp%\log.txt for 64-bit windows: "c:\program files\mozilla firefox\firefox.exe" -moz_log=timestamp,rotate:200,nshttp:5,cache2:5,nssockettransport:5,nshostresolver:5,cookie:5 -moz_log_file=%temp%\log.txt (these instructions assume that you installed f...
Creating Custom Events That Can Pass Data
as of gecko 1.
8, if your event names do not start with "nsdom" and their interfaces do not start with "nsidom" then you can forget about passing data.
...mozilla/content/events/src/nseventdispatcher.cpp note: in the mozilla 1.
8.x branch this code is actually in mozilla/content/events/src/nseventlistenermanager.cpp this is quite an important file since this holds the createevent method which acts as a factory method dom events.
... #include "nsidomevent.idl" [scriptable, uuid(0
8bea243-
8a7b-4554-9ee9-70d77
85d741b)] interface nsidommyevent: nsidomevent { //put members here!
Gecko SDK
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 x
86_64 download n/a n/a n/a n/a mac i3
86 download download download download n/a mac ppc n/a download download download download linux x
86_64 download n/a n/a n/a n/a linux i6
86 download ...
... once that's done, you should perform the following command: ln -s /opt/local/lib/libintl.
8.dylib /opt/local/lib/libintl.3.dylib this should fix the problem.
... mac intel gecko 1.
8 sdk the official mac 1.
8 sdk is a ppc version.
Gecko versions and application versions
gecko version applications based on it gecko 55 firefox 55, seamonkey 2.52 gecko 52 firefox 52, seamonkey 2.49 gecko 49 firefox 49, seamonkey 2.46 gecko 43 firefox 43, seamonkey 2.40 gecko 42 firefox 42, seamonkey 2.39 gecko 41 firefox 41, seamonkey 2.3
8 gecko 3
8 firefox 3
8, seamonkey 2.35 gecko 36 firefox 36, seamonkey 2.33 gecko 35 firefox 35, seamonkey 2.32 gecko 34 firefox 34, seamonkey 2.31 gecko 33 firefox 33, seamonkey 2.30 gecko 32 firefox 32, seamonkey 2.29 gecko 29 firefox 29, seamonkey 2.26 gecko 2
8 firefox 2
8, seamonkey 2.25 gecko ...
...27 firefox 27, seamonkey 2.24 gecko 26 firefox 26, seamonkey 2.23 gecko 25 firefox 25, seamonkey 2.22 gecko 24 firefox 24, thunderbird 24, seamonkey 2.21 gecko 23 firefox 23, seamonkey 2.20 gecko 22 firefox 22, seamonkey 2.19 gecko 21 firefox 21, seamonkey 2.1
8 gecko 20 firefox 20, seamonkey 2.17 gecko 19 firefox 19, seamonkey 2.16 gecko 1
8 firefox 1
8, firefox os 1.0, seamonkey 2.15 gecko 17 firefox 17, thunderbird 17, seamonkey 2.14 gecko 16 firefox 16, thunderbird 16, seamonkey 2.13 gecko 15 firefox 15, thunderbird 15, seamonkey 2.12 gecko 14 firefox 14, thunderbird 14, seamonkey 2.11 gecko 13 firefox 13, thunderbird 13,...
... seamonkey 2.10 gecko 12 firefox 12, thunderbird 12, seamonkey 2.9 gecko 11 firefox 11, thunderbird 11, seamonkey 2.
8 gecko 10 firefox 10, thunderbird 10, seamonkey 2.7 gecko 9 firefox 9, thunderbird 9, seamonkey 2.6 gecko
8 firefox
8, thunderbird
8, seamonkey 2.5 gecko 7 firefox 7, thunderbird 7, seamonkey 2.4 gecko 6 firefox 6, thunderbird 6, seamonkey 2.3 gecko 5 firefox 5, thunderbird 5, seamonkey 2.2 gecko 2 firefox 4, thunderbird 3.3, seamonkey 2.1 gecko 1.9.2 firefox 3.6, thunderbird 3.1 gecko 1.9.1 firefox 3.5, thunderbird 3, seamonkey 2.0 gecko 1.9 firefox 3 gecko 1.
8.1 firefox 2, thunderbird 2, seamonkey 1.1 gecko 1.
8 ...
Integrated Authentication
this entails support for the the simple and protected gss-api negotiation mechanism (spnego) internet standard (rfc 247
8) to negotiate either kerberos, ntlm, or other authentication protocols supported by the operating system.
...this is to protect the user from the possibility of dns-spoofing being used to stage a man-in-the-middle exploit (see bug 1757
8 for more info).
... original document information author(s): darin fisher last updated date: december 27, 2005 copyright information: portions of this content are © 199
8–2007 by individual mozilla.org contributors; content available under a creative commons license | details.
FileUtils.jsm
eflags); void closeatomicfileoutputstream(nsifileoutputstream stream); void closesafefileoutputstream(nsifileoutputstream stream); constants constant value description mode_rdonly 0x01 corresponds to the pr_rdonly parameter to pr_open mode_wronly 0x02 corresponds to the pr_wronly parameter to pr_open mode_create 0x0
8 corresponds to the pr_create_file parameter to pr_open mode_append 0x10 corresponds to the pr_append parameter to pr_open mode_truncate 0x20 corresponds to the pr_truncate parameter to pr_open perms_file 0644 default permissions when creating files.
... starting in gecko 3
8.0, passing mode_append without mode_truncate will throw an exception.
... starting in gecko 3
8.0, passing mode_append without mode_truncate will throw an exception.
PerfMeasurement.jsm
note: at present, perfmeasurement.jsm is only functional on linux, but it is planned to add support for windows (bug 5
83322) and osx (bug 5
83323) as well, and we welcome patches for other operating systems.
... cache_misses 0x0000000
8 measure the number of cache misses.
... page_faults 0x000000
80 measure the number of page faults that occurred.
XPCOMUtils.jsm
details can be found here: bug 62
8669 itersimpleenumerator() wraps an nsisimpleenumerator instance into a javascript generator that can be easily iterated over.
... example const nsifile = components.interfaces.nsifile; for (var file in xpcomutils.itersimpleenumerator(dir.directoryentries, nsifile)) console.log(file.path); iterstringenumerator() wraps an nsistringenumerator or nsiutf
8stringenumerator instance into a javascript generator that can be easily iterated over.
... generator iterstringenumerator( enumerator ); parameters enumerator the nsistringenumerator or nsiutf
8stringenumerator instance to iterate over.
QA phase
to create and configure this file, follow these instructions: until the fix for bug 1063
880 lands on mozilla-aurora and mozilla-beta when building language packs against those two trees you should: remove ac_add_options --disable-compile-environment from .mozconfig in step 3 use ./mach build config after step 4 update the mozilla source code: $ cd mozilla-aurora $ hg pull -u enter the following command to create the .mozconfig file: $ nano -w .mozconfig enter...
... enter the following command: $ hg log -l 1 you should see an output similar to the one below: changeset: 0:7c543e
8f3a6a tag: tip user: your name <email@example.com> date: mon nov 23 1
8:0
8:25 2009 +0100 summary: added search bar strings now compare the local repository on your machine with the remote hg repository by entering this command: $ hg outgoing http://hg.mozilla.org/l10n-central/x-testing the hg outgoing command compares the two repositories and lists all changesets tha...
...you can expect to see output like this: comparing with http://hg.mozilla.org/l10n-central/x-testing searching for changes changeset: 0:7c543e
8f3a6a tag: tip user: your name <email@example.com> date: mon nov 23 1
8:0
8:25 2009 +0100 summary: added search bar strings let's now push this changeset.
Localization technical reviews
for more info, see bug 435
874.
...for more info about access keys in the technical review process, see bug 421
893.
...for more info about utf-7 in firefox, see bug 441
876.
Updates
may 2
8, 2010 stix fonts version 1.0 released.
... may
8, 2007 mozilla ceo speaks out on the future of firefox: the complete
8,000 word interview.
... september 1
8, 1999 status report - mozillazine annoucement september 3, 1999 xsl coming to mozilla?
Mozilla DOM Hacking Guide
this is a real-world case that was used to solve bug 33
871 (the patch is not checked in yet, as of writing this document).
... let's assume nsdomimplementation now implements the nsidomhtmldomimplementation interface (look in bug 33
871 if you want to know how to do that).
... original document information author(s): fabian guisset last updated date: september 27, 2007 copyright information: portions of this content are © 199
8–2007 by individual mozilla.org contributors; content available under a creative commons license | details.
Profiling with Xperf
this page applies to xperf version 4.
8.7701 or newer.
...once the sdk installs, execute either wpt_x
86.msi or wpt_x64.msi in the redist/windows performance toolkit folder of the sdk's install location (typically program files/microsoft sdks/windows/v7.1/redist/windows performance toolkit) to actually install the windows performance toolkit tools.
...to start a trace session, launching a new firefox instance: xperf -on base xperf -start heapsession -heap -pidnewprocess "./firefox.exe -p test -no-remote" -stackwalk heapalloc+heaprealloc -buffersize 512 -minbuffers 12
8 -maxbuffers 512 to stop a session and merge the resulting files: xperf -stop heapsession -d heap.etl xperf -d main.etl xperf -merge main.etl heap.etl result.etl "result.etl" will contain your merged data; you can delete main.etl and heap.etl.
TraceMalloc
this file can be post-processed by tools in mozilla/tools/trace-malloc as follows: histogram.pl, which produces a type histogram that can be diffed with histogram-diff.sh to produce output that looks like this: ---- base ---- ---- incr ---- ----- difference ---- type count bytes count bytes count bytes %total total 4
8942 4754774 76136 6566453 27194 1
811679 100.00 nstokenallocator 17 110007 60 3
88260 43 27
8253 15.36 nsimagegtk 476 219770
8 341 2366564 -135 16
8856 9.32 nsmemcacherecord
843 45767 232
8 124767 14
85 79000 4.36 nstextnode 209 11704 1614 903
84 1405 7
86
80 4.34 htmlattributesimpl ...
...4
82 142
88 2
824
88400 2342 74112 4.09 nsscanner 5
8 76
824 94 146300 36 69476 3.
83 nsscripterror 253 25070
842 9154
8 5
89 6647
8 3.67 nshtmldocument.mreferrer 177 21550 691
85460 514 63910 3.53 nshtmlvalue 139 7
846 1215 6
8734 1076 60
888 3.36 htmlcontentsink 6 4
816 12 577
82 6 52966 2.92 uncategorized.pl, which lists all the void* allocations (the ones that couldn't be categorized by type), sorted by size.
...leaks: 3
82739 bytes, 3465 allocations maximum heap size: 7751799 bytes 62095212 bytes were allocated in 391091 allocations.
tools/power/rapl
total w = _pkg_ (cores + _gpu_ + other) + _ram_ w #01 5.17 w = 1.7
8 ( 0.12 + 0.10 + 1.56) + 3.39 w #02 9.43 w = 5.44 ( 1.44 + 1.20 + 2.
80) + 3.9
8 w #03 14.26 w = 10.21 ( 5.47 + 0.19 + 4.55) + 4.04 w #04 10.02 w = 6.15 ( 2.62 + 0.43 + 3.10) + 3.
86 w #05 14.63 w = 10.43 ( 4.41 + 0.
81 + 5.22) + 4.19 w #06 11.16 w = 6.90 ( 1.91 + 1.6
8 + 3.31) + 4.26 w #07 5.40 w = 1.97 ( 0.20 + 0.10 + 1.67) + 3.44 w #0
8 5.17 w = 1.76 ( 0.07 + 0.0
8 + 1.6...
...0) + 3.41 w #09 5.17 w = 1.76 ( 0.09 + 0.0
8 + 1.5
8) + 3.42 w #10
8.13 w = 4.40 ( 1.55 + 0.11 + 2.74) + 3.73 w things to note include the following.
... once sampling is finished — either because the user interrupted it, or because the requested number of samples has been taken — the following summary data is shown: 10 samples taken over a period of 10.000 seconds distribution of 'total' values: mean =
8.
85 w std dev = 3.50 w 0th percentile = 5.17 w (min) 5th percentile = 5.17 w 25th percentile = 5.17 w 50th percentile =
8.13 w 75th percentile = 11.16 w 95th percentile = 14.63 w 100th percentile = 14.63 w (max) the distribution data is omitted if there was zero or one samples taken.
turbostat
be invoked as the super-user: sudo turbostat if you get an error saying "turbostat: no /dev/cpu/0/msr", you need to run the following command: sudo modprobe msr the output is as follows: core cpu avg_mhz %busy bzy_mhz tsc_mhz smi cpu%c1 cpu%c3 cpu%c6 cpu%c7 coretmp pkgtmp pkg%pc2 pkg%pc3 pkg%pc6 pkg%pc7 pkgwatt corwatt gfxwatt - - 799 21.63 3694 339
8 0 12.02 3.16 1.71 61.4
8 49 49 0.00 0.00 0.00 0.00 22.6
8 15.13 1.13 0 0
821 22.44 3657 339
8 0 9.92 2.43 2.25 62.96 39 49 0.00 0.00 0.00 0.00 22.6
8 15.13 1.13 0 4 70
8 19.14 369
8 339
8 0 13.22 1 1 743 20.26 3666 339
8 0 21...
....40 4.01 1.42 52.90 49 1 5 1206 31.9
8 3770 339
8 0 9.69 2 2 7
84 21.29 36
81 339
8 0 11.7
8 3.10 1.13 62.70 40 2 6 7
82 21.15 369
8 339
8 0 11.92 3 3 702 19.14 3670 339
8 0
8.39 3.09 2.03 67.36 39 3 7 64
8 17.67 3667 339
8 0 9.
85 the man page has good explanations of what each column measures.
... if you run with the -s option you get a smaller range of measurements that fit on a single line, like the following: avg_mhz %busy bzy_mhz tsc_mhz smi cpu%c1 cpu%c3 cpu%c6 cpu%c7 coretmp pkgtmp pkg%pc2 pkg%pc3 pkg%pc6 pkg%pc7 pkgwatt corwatt gfxwatt 3614 97.
83 3694 3399 0 2.17 0.00 0.00 0.00 77 77 0.00 0.00 0.00 0.00 67.50 57.77 0.46 ...
reader.parse-on-load.force-enabled
by default, the reader mode in firefox mobile is only enabled if the memory is greater than 3
84mb.
... type:boolean default value: false exists by default: yes application support:firefox mobile 23.0 status: active; last updated 2013-05-11 introduction: pushed to nightly on 2013-05-06 bugs: bug
867
875 values true reader mode is enabled independent of memory available.
... false (default) reader mode is only enabled if memory available exceeds a threshold (currenlty 3
84mb).
PR_NormalizeTime
for example, if you have a ] object that represents the date 3 march 199
8 and you want to say "forty days from 3 march 199
8", you can simply add 40 to the tm_mday field and then call pr_normalizetime().
...for example, suppose you want to compute the day of week for 3 march 199
8.
... you can set tm_mday to 3, tm_month to 2, and tm_year to 199
8, and all the other fields to 0, then call pr_normalizetime() with pr_gmtparameters.
NSS Code Coverage
nss - code coverage results link 2007-0
8-14 - solaris/sparc platform results explanation files results from every c file are on new line.
... numbers in not tested files example: not tested (0/?/
87
8).
...
87
8 - total lines in file (by wc -l command).
Encrypt Decrypt MAC Keys As Session Objects
*/ /* nspr headers */ #include #include #include #include #include #include #include /* nss headers */ #include #include /* our samples utilities */ #include "util.h" #define buffersize
80 #define digestsize 16 #define ptext_mac_buffer_size 96 #define ciphersize 96 #define blocksize 32 #define cipher_header "-----begin cipher-----" #define cipher_trailer "-----end cipher-----" #define enckey_header "-----begin aeskey ckaid-----" #define enckey_trailer "-----end aeskey ckaid-----" #define mackey_header "-----b...
...*/ enckey = generatesymkey(slot, ckm_aes_key_gen, 12
8/
8, &enckeyid, pwdata); if (enckey == null) { pr_fprintf(pr_stderr, "generatesymkey for aes returned null.\n"); rv = secfailure; goto cleanup; } /* generate a second key to use for macing, also a token object.
... */ mackey = generatesymkey(slot, ckm_generic_secret_key_gen, 160/
8, &mackeyid, pwdata); if (mackey == null) { pr_fprintf(pr_stderr, "generatesymkey for macing returned null.\n"); rv = secfailure; goto cleanup; } /* get the encrypt key cka_id */ rv = gathercka_id(enckey, &encckaid); if (rv != secsuccess) { pr_fprintf(pr_stderr, "error while wrapping encrypt key\n"); goto cleanup; } /* get the mac key cka_id */ rv = gathercka_id(mackey, &macckaid); if (rv != secsuccess) { pr_fprintf(pr_stderr, "can't get the mac key cka_id.\n"); goto cleanup; } if (noisefilename) { rv = seedfromnoisefile(noisefilename); if (rv != secsuccess) { port...
Encrypt and decrypt MAC using token
*/ /* nspr headers */ #include #include #include #include #include #include #include /* nss headers */ #include #include /* our samples utilities */ #include "util.h" #define buffersize
80 #define digestsize 16 #define ptext_mac_buffer_size 96 #define ciphersize 96 #define blocksize 32 #define cipher_header "-----begin cipher-----" #define cipher_trailer "-----end cipher-----" #define enckey_header "-----begin aeskey ckaid-----" #define enckey_trailer "-----end aeskey ckaid-----" #define mackey_header "-----b...
...*/ enckey = generatesymkey(slot, ckm_aes_key_gen, 12
8/
8, &enckeyid, pwdata); if (enckey == null) { pr_fprintf(pr_stderr, "generatesymkey for aes returned null.\n"); rv = secfailure; goto cleanup; } /* generate a second key to use for macing, also a token object.
... */ mackey = generatesymkey(slot, ckm_generic_secret_key_gen, 160/
8, &mackeyid, pwdata); if (mackey == null) { pr_fprintf(pr_stderr, "generatesymkey for macing returned null.\n"); rv = secfailure; goto cleanup; } /* get the encrypt key cka_id */ rv = gathercka_id(enckey, &encckaid); if (rv != secsuccess) { pr_fprintf(pr_stderr, "error while wrapping encrypt key\n"); goto cleanup; } /* get the mac key cka_id */ rv = gathercka_id(mackey, &macckaid); if (rv != secsuccess) { pr_fprintf(pr_stderr, "can't get the mac key cka_id.\n"); goto cleanup; } if (noisefilename) { rv = seedfromnoisefile(noisefilename); if (rv != secsuccess) { port...
HTTP delegation
to find an example implementation, you may look at bug 1113
84, which tracks the implementation in mozilla client applications.
...http://ocsp.provider.com:
80/cgi-bin/ocsp-responder if nss needs to access a http server, it will request that an "http server session object" be created (sec_httpserver_createsessionfcn).
... the http server session object is logically associated with host and port destination information, in our example this is "host ocsp.provider.com port
80".
HTTP delegation
to find an example implementation, you may look at bug 1113
84, which tracks the implementation in mozilla client applications.
...http://ocsp.provider.com:
80/cgi-bin/ocsp-responder if nss needs to access a http server, it will request that an "http server session object" be created (sec_httpserver_createsessionfcn).
... the http server session object is logically associated with host and port destination information, in our example this is "host ocsp.provider.com port
80".
JSS Provider Notes
dsapublickeyspec dsapublickey x509encodedkeyspec rsapublickey dsapublickey rsaprivatecrtkeyspec rsaprivatekey dsaprivatekeyspec dsaprivatekey pkcs
8encodedkeyspec rsaprivatekey dsaprivatekey getkeyspec() is not supported.
...only x509encodedkeyspec is supported for public keys, and only pkcs
8encodedkeyspec is supported for private keys.
... secretkeyfactory supported algorithms notes aes des desede (des3 ) pbahmacsha1 pbewithmd5anddes pbewithsha1anddes pbewithsha1anddesede (pbewithsha1anddes3 ) pbewithsha1and12
8rc4 rc4 generatesecret supports the following transformations: keyspec class key algorithm pbekeyspec org.mozilla.jss.crypto.pbekeygenparams using the appropriate pbe algorithm: des desede rc4...
Mozilla-JSS JCA Provider notes
ransformations are supported for generatepublic() and generateprivate(): from to rsapublickeyspec rsapublickey dsapublickeyspec dsapublickey x509encodedkeyspec rsapublickey dsapublickey rsaprivatecrtkeyspec rsaprivatekey dsaprivatekeyspec dsaprivatekey pkcs
8encodedkeyspec rsaprivatekey dsaprivatekey getkeyspec() is not supported.
...only x509encodedkeyspec is supported for public keys, and only pkcs
8encodedkeyspec is supported for private keys.
... secretkeyfactory supported algorithms notes aes des desede (des3) pbahmacsha1 pbewithmd5anddes pbewithsha1anddes pbewithsha1anddesede (pbewithsha1anddes3) pbewithsha1and12
8rc4 rc4 generatesecret supports the following transformations: keyspec class key algorithm pbekeyspec org.mozilla.jss.crypto.pbekeygenparams using the appropriate pbe algorithm: des desede rc4 desedekeyspec desede deskeyspec des secretkeyspec aes des desede ...
NSS 3.14.3 release notes
bug
840714 - "certutil -a" was not correctly producing ascii output as requested.
... bug
837799 - nss 3.14.2 broke compilation with older versions of sqlite that lacked the sqlite_fcntl_tempfilename file control.
...bugs fixed in nss 3.14.3 https://bugzilla.mozilla.org/buglist.cgi?list_id=56
89256;resolution=fixed;classification=components;query_format=advanced;target_milestone=3.14.3;product=nss compatibility nss 3.14.3 shared libraries are backward compatible with all older nss 3.x shared libraries.
NSS 3.14 release notes
on for certvalparamintype (in certt.h) a new error code: sec_error_application_callback_error (in secerr.h) new for pkcs #11 pkcs #11 mechanisms: ckm_aes_cts ckm_aes_ctr ckm_aes_gcm (see warnings against using c_encryptupdate/c_decryptupdate above) ckm_sha224_key_derivation ckm_sha256_key_derivation ckm_sha3
84_key_derivation ckm_sha512_key_derivation changes in nss 3.14 bug 333601 - performance enhancements for intel macs when building for intel macs, nss will now take advantage of optimized assembly code for common operations.
... bug 7926
81 - new default cipher suites the default cipher suites in nss 3.14 have been changed to better reflect the current security landscape.
... bug 7
8344
8 - when performing an ssl renegotiation, the client_version that is sent in the renegotiation clienthello will be set to match the client_version that was sent in the initial clienthello.
NSS 3.16.4 release notes
cn = gte cybertrust global root sha1 fingerprint: 97:
81:79:50:d
8:1c:96:70:cc:34:d
8:09:cf:79:44:31:36:7e:f4:74 in nss 3.16.3, the 1024-bit "entrust.net secure server certification authority" root ca certificate (sha1 fingerprint: 99:a6:9b:e6:1a:fe:
88:6b:4d:2b:
82:00:7c:b
8:54:fc:31:7e:15:39) was removed.
... in nss 3.16.4, a 204
8-bit intermediate ca certificate has been included, without explicit trust.
...the inclusion of the intermediate certificate is a temporary measure to allow those sites to function, by allowing them to find a trust path to another 204
8-bit root ca certificate.
NSS 3.17.3 release notes
the following ca certificates were removed cn = gte cybertrust global root sha1 fingerprint: 97:
81:79:50:d
8:1c:96:70:cc:34:d
8:09:cf:79:44:31:36:7e:f4:74 cn = thawte server ca sha1 fingerprint: 23:e5:94:94:51:95:f2:41:4
8:03:b4:d5:64:d2:a3:a3:f5:d
8:
8b:
8c cn = thawte premium server ca sha1 fingerprint: 62:7f:
8d:7
8:27:65:63:99:d2:7d:7f:90:44:c9:fe:b3:f3:3e:fa:9a cn = america online root certification authority 1 sha-1 fingerprint: ...
...39:21:c1:15:c1:5d:0e:ca:5c:cb:5b:c4:f0:7d:21:d
8:05:0b:56:6a cn = america online root certification authority 2 sha-1 fingerprint:
85:b5:ff:67:9b:0c:79:96:1f:c
8:6e:44:22:00:46:13:db:17:92:
84 the following ca certificates had the websites and code signing trust bits turned off ou = class 3 public primary certification authority - g2 sha1 fingerprint:
85:37:1c:a6:e5:50:14:3d:ce:2
8:03:47:1b:de:3a:09:e
8:f
8:77:0f cn = equifax secure ebusiness ca-1 sha1 fingerprint: da:40:1
8:
8b:91:
89:a3:ed:ee:ae:da:97:fe:2f:9d:f5:b7:d1:
8a:41 the following ca certificates were added cn = comodo rsa certification authority sha1 fingerprint: af:e5:d2:44:a
8:d1:19:42:30:ff:47:9f:e2:f
8:97:bb:cd:7a:
8c:b4 ...
... cn = usertrust rsa certification authority sha1 fingerprint: 2b:
8f:1b:57:33:0d:bb:a2:d0:7a:6c:51:f7:0e:e9:0d:da:b9:ad:
8e cn = usertrust ecc certification authority sha1 fingerprint: d1:cb:ca:5d:b2:d5:2a:7f:69:3b:67:4d:e5:f0:5a:1d:0c:95:7d:f0 cn = globalsign ecc root ca - r4 sha1 fingerprint: 69:69:56:2e:40:
80:f4:24:a1:e7:19:9f:14:ba:f3:ee:5
8:ab:6a:bb cn = globalsign ecc root ca - r5 sha1 fingerprint: 1f:24:c6:30:cd:a4:1
8:ef:20:69:ff:ad:4f:dd:5f:46:3a:1b:69:aa the version number of the updated root ca list has been set to 2.2 bugs fixed in nss 3.17.3 this bugzilla query returns all the bugs fixed in nss 3.17.3: https://bugzilla.mozilla.org/buglist.cgi?resolution=fixed&classification=components&qu...
NSS 3.19.1 release notes
nss 3.19.1 requires nspr 4.10.
8 or newer.
... nss 3.19.1 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_19_1_rtm/src/ security fixes in nss 3.19.1 bug 113
8554 / cve-2015-4000 - the minimum strength of keys that libssl will accept for finite field algorithms (rsa, diffie-hellman, and dsa) have been increased to 1023 bits.
... 1023 bits bugs fixed in nss 3.19.1 this bugzilla query returns all the bugs fixed in nss 3.19.1: https://bugzilla.mozilla.org/buglist.cgi?resolution=fixed&classification=components&query_format=advanced&product=nss&target_milestone=3.19.1 acknowledgements the nss development team would like to thank matthew green and karthikeyan bhargavan for responsibly disclosing the issue in bug 113
8554.
NSS 3.19 release notes
nss 3.19 requires nspr 4.10.
8 or newer.
... nss 3.19 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_19_rtm/src/ security fixes in nss 3.19 bug 10
86145 / cve-2015-2721 - fixed a bug related to the ordering of tls handshake messages.
... bugs fixed in nss 3.19 this bugzilla query returns all the bugs fixed in nss 3.19: https://bugzilla.mozilla.org/buglist.cgi?resolution=fixed&classification=components&query_format=advanced&product=nss&target_milestone=3.19 acknowledgements the nss development team would like to thank karthikeyan bhargavan from inria for responsibly disclosing the issue in bug 10
86145.
NSS 3.27 release notes
the following ca certificates were removed cn = igc/a, o = pm/sgdn, ou = dcssi sha256 fingerprint: b9:be:a7:
86:0a:96:2e:a3:61:1d:ab:97:ab:6d:a3:e2:1c:10:6
8:b9:7d:55:57:5e:d0:e1:12:79:c1:1c:
89:32 cn = juur-sk, o = as sertifitseerimiskeskus sha256 fingerprint: ec:c3:e9:c3:40:75:03:be:e0:91:aa:95:2f:41:34:
8f:f
8:
8b:aa:
86:3b:22:64:be:fa:c
8:07:90:15:74:e9:39 cn = ebg elektronik sertifika hizmet sağlayıcısı sha-256 fingerprint: 35:ae:5b:dd:d
8:f7:ae:63:5c:ff:ba:56:...
...
82:a
8:f0:0b:95:f4:
84:62:c7:10:
8e:e9:a0:e5:29:2b:07:4a:af:b2 cn = s-trust authentication and encryption root ca 2005:pn sha-256 fingerprint: 37:d
8:dc:
8a:f7:
86:7
8:45:da:33:44:a6:b1:ba:de:44:
8d:
8a:
80:e4:7b:55:79:f9:6b:f6:31:76:
8f:9f:30:f6 o = verisign, inc., ou = class 1 public primary certification authority sha-256 fingerprint: 51:
84:7c:
8c:bd:2e:9a:72:c9:1e:29:2d:2a:e2:47:d7:de:1e:3f:d2:70:54:7a:20:ef:7d:61:0f:3
8:b
8:
84:2c o = verisign, inc., ou = class 2 public primary certification authority - g2 sha-256 fingerprint: 3a:43:e2:20:fe:7f:3e:a9:65:3d:1e:21:74:2e:ac:2b:75:c2:0f:d
8:9
8:03:05:bc:50:2c:af:
8c:2d:9b:41:a1 o = verisign, inc., ou = class 3 public primary certification authority sha-256 fingerprint: e...
...7:6
8:56:34:ef:ac:f6:9a:ce:93:9a:6b:25:5b:7b:4f:ab:ef:42:93:5b:50:a2:65:ac:b5:cb:60:27:e4:4e:70 o = equifax, ou = equifax secure certificate authority sha-256 fingerprint: 0
8:29:7a:40:47:db:a2:36:
80:c7:31:db:6e:31:76:53:ca:7
8:4
8:e1:be:bd:3a:0b:01:79:a7:07:f9:2c:f1:7
8 cn = equifax secure ebusiness ca-1 sha-256 fingerprint: cf:56:ff:46:a4:a1:
86:10:9d:d9:65:
84:b5:ee:b5:
8a:51:0c:42:75:b0:e5:f9:4f:40:bb:ae:
86:5e:19:f6:73 cn = equifax secure global ebusiness ca-1 sha-256 fingerprint: 5f:0b:62:ea:b5:e3:53:ea:65:21:65:16:5
8:fb:b6:53:59:f4:43:2
8:0a:4a:fb:d1:04:d7:7d:10:f9:f0:4c:07 bugs fixed in nss 3.27 this bugzilla query returns all the bugs fixed in nss 3.27: https://bugzilla.mozilla.org/buglist.cgi?resolution=fixe...
NSS 3.30.2 release notes
notable changes in nss 3.30.2 the following ca certificates were removed: o = japanese government, ou = applicationca sha-256 fingerprint: 2d:47:43:7d:e1:79:51:21:5a:12:f3:c5:
8e:51:c7:29:a5:
80:26:ef:1f:cc:0a:5f:b3:d9:dc:01:2f:60:0d:19 cn = wellssecure public root certificate authority sha-256 fingerprint: a7:12:72:ae:aa:a3:cf:e
8:72:7f:7f:b3:9f:0f:b3:d1:e5:42:6e:90:60:b0:6e:e6:f1:3e:9a:3c:5
8:33:cd:43 cn=tÜrktrust elektronik sertifika hizmet sağlayıcısı h6 sha-256 fingerprint:
8d:e7:
86:55:e1:be:7f:7
8:47:
80:0b:93:f6:94:d2:1d...
...:36:
8c:c0:6e:03:3e:7f:ab:04:bb:5e:b9:9d:a6:b7:00 cn=microsec e-szigno root sha-256 fingerprint: 32:7a:3d:76:1a:ba:de:a0:34:eb:99:
84:06:27:5c:b1:a4:77:6e:fd:ae:2f:df:6d:01:6
8:ea:1c:4f:55:67:d0 the following ca certificates were added: cn = d-trust root ca 3 2013 sha-256 fingerprint: a1:a
8:6d:04:12:1e:b
8:7f:02:7c:66:f5:33:03:c2:
8e:57:39:f9:43:fc:
84:b3:
8a:d6:af:00:90:35:dd:94:57 trust flags: email cn = tubitak kamu sm ssl kok sertifikasi - surum 1 sha-256 fingerprint: 46:ed:c3:6
8:90:46:d5:3a:45:3f:b3:10:4a:b
8:0d:ca:ec:65:
8b:26:60:ea:16:29:dd:7e:
86:79:90:64:
87:16 trust flags: websites technically constrained to: gov.tr, k12.tr, pol.tr, mil.tr, tsk.tr, kep.tr, bel.tr, edu.tr, org.tr the versi...
...on number of the updated root ca list has been set to 2.14 (the version numbers 2.12 and 2.13 for the root ca list have been skipped.) bugs fixed in nss 3.30.2 bug 1350
859 - march 2017 batch of root ca changes bug 1349705 - implemented domain name constraints for ca: tubitak kamu sm ssl kok sertifikasi - surum 1 compatibility nss 3.30.2 shared libraries are backward compatible with all older nss 3.x shared libraries.
NSS 3.37 release notes
nss 3.37 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_37_rtm/src/ notable changes in nss 3.37 the tls 1.3 implementation was updated to draft 2
8.
... the following ca certificates were removed: cn = s-trust universal root ca sha-256 fingerprint: d
8:0f:ef:91:0a:e3:f1:04:72:3b:04:5c:ec:2d:01:9f:44:1c:e6:21:3a:df:15:67:91:e7:0c:17:90:11:0a:31 cn = tc trustcenter class 3 ca ii sha-256 fingerprint:
8d:a0:
84:fc:f9:9c:e0:77:22:f
8:9b:32:05:93:9
8:06:fa:5c:b
8:11:e1:c
8:13:f6:a1:0
8:c7:d3:36:b3:40:
8e cn = tÜrktrust elektronik sertifika hizmet sağlayıcısı h5 sha-256 fingerprint: 49:35:1b:90:34:44:c1:
85:cc:...
...dc:5c:69:3d:24:d
8:55:5c:b2:0
8:d6:a
8:14:13:07:69:9f:4a:f0:63:19:9d:7
8 bugs fixed in nss 3.37 this bugzilla query returns all the bugs fixed in nss 3.37: https://bugzilla.mozilla.org/buglist.cgi?resolution=fixed&classification=components&query_format=advanced&product=nss&target_milestone=3.37 compatibility nss 3.37 shared libraries are backward compatible with all older nss 3.x shared libraries.
NSS 3.49 release notes
bugs fixed in nss 3.49 bug 15135
86 - set downgrade sentinel for client tls versions lower than 1.2.
... bug 1606025 - remove -wmaybe-uninitialized warning in sslsnce.c bug 1606119 - fix ppc hw crypto build failure bug 1605545 - memory leak in pk11install_platform_generate bug 16022
88 - fix build failure due to missing posix signal.h bug 15
88714 - implement checkarmsupport for win64/aarch64 bug 15
851
89 - nss database uses 3des instead of aes to encrypt db entries bug 1603257 - fix ubsan issue in softoken ckm_nss_chacha20_ctr initialization bug 1590001 - additional hrr tests (cve-2019-17023) bug 1600144 - treat clienthello with message_seq of 1 as a second clienthello bug 1603027 - test that esni is regenerated after helloretryrequest bug 1593167 - intermittent mis-reporting potential security risk sec_error_unknown_issuer bug 15357
87 - fix automation/release/nss-release-helper.py ...
...on macos bug 1594933 - disable building dbm by default bug 156254
8 - improve gcm perfomance on aarch32 this bugzilla query returns all the bugs fixed in nss 3.49: https://bugzilla.mozilla.org/buglist.cgi?resolution=fixed&classification=components&query_format=advanced&product=nss&target_milestone=3.49 compatibility nss 3.49 shared libraries are backward compatible with all older nss 3.x shared libraries.
NSS API Guidelines
the preferred format is: "@(#) $rcsfile: nss-guidelines.html, v $ $revision: 4
8936 $ $date: 2009-0
8-11 07:45:57 -0700 (tue, 11 aug 2009) $ $name$" you can put the string in a comment or in a static char array.
... here is an example from lib/base/baset.h: #ifdef debug static const char baset_cvs_id[] = "@(#) $rcsfile: nss-guidelines.html, v $ $revision: 4
8936 $ $date: 2009-0
8-11 07:45:57 -0700 (tue, 11 aug 2009) $ $name$"; #endif /* debug */ the difference, between this and id, is that id has some useless information (every file is "experimental"), and doesn't have name.
... we would like to keep names to
8.3, even if we no longer support win16.
NSS Config Options
nss config options format the specified ciphers will be allowed by policy, but an application may allow more by policy explicitly: config="allow=curve1:curve2:hash1:hash2:rsa-1024..." only the specified hashes and curves will be allowed: config="disallow=all allow=sha1:sha256:secp256r1:secp3
84r1" only the specified hashes and curves will be allowed, and rsa keys of 204
8 or more will be accepted, and dh key exchange with 1024-bit primes or more: config="disallow=all allow=sha1:sha256:secp256r1:secp3
84r1:min-rsa=204
8:min-dh=1024" a policy that enables the aes ciphersuites and the secp256/3
84 curves: config="allow=aes12
8-cbc:aes12
8-gcm::hmac-sha1:sha1:sha256:sha3
84:rsa:ecdhe-rsa:secp256r1:secp3
84r1" turn off md5 config="disallow=md5" turn off md5 and sha1 only for ssl c...
... ecc curves prime192v1 prime192v2 prime192v3 prime239v1 prime239v2 prime239v3 prime256v1 secp112r1 secp112r2 secp12
8r1 secp12
8r2 secp160k1 secp160r1 secp160r2 secp192k1 secp192r1 secp224k1 secp256k1 secp256r1 secp3
84r1 secp521r1 c2pnb163v1 c2pnb163v2 c2pnb163v3 c2pnb176v1 c2tnb191v1 c2tnb191v2 c2tnb191v3 c2onb191v4 c2onb191v5 c2pnb20
8w1 c2tnb239v1 c2tnb239v2 c2tnb239v3 c2onb239v4 c2onb239v5 c2pnb272w1 c2pnb304w1 c2tnb359v1 c2pnb36
8w1 c2tnb431r1 sect113r1 sect131r1 sect131r1 se...
...ct131r2 sect163k1 sect163r1 sect163r2 sect193r1 sect193r2 sect233k1 sect233r1 sect239k1 sect2
83k1 sect2
83r1 sect409k1 sect409r1 sect571k1 sect571r1 hashes md2 md4 md5 sha1 sha224 sha256 sha3
84 sha512 macs hmac-sha1 hmac-sha224 hmac-sha256 hmac-sha3
84 hmac-sha512 hmac-md5 ciphers aes12
8-cbc aes192-cbc aes256-cbc aes12
8-gcm aes192-gcm aes256-gcm camellia12
8-cbc camellia192-cbc camellia256-cbc seed-cbc des-ede3-cbc des-40-cbc des-cbc null-cipher rc2 rc4 idea ssl key exchanges rsa rsa-export dhe-rsa dhe-dss dh-rsa dh-dss ecdhe-ecdsa ecdhe-rsa ecdh-ecdsa ecdh-rsa restrictions for asymmetric keys (integers) rsa-min dh-min dsa-min constraints on ssl protocols versions (integers) tls-version-min tls-version-max constraints on dtls...
Encrypt Decrypt_MAC_Using Token
*/ /* nspr headers */ #include #include #include #include #include #include #include /* nss headers */ #include #include /* our samples utilities */ #include "util.h" #define buffersize
80 #define digestsize 16 #define ptext_mac_buffer_size 96 #define ciphersize 96 #define blocksize 32 #define cipher_header "-----begin cipher-----" #define cipher_trailer "-----end cipher-----" #define enckey_header "-----begin aeskey ckaid-----" #define enckey_trailer "-----end aeskey ckaid-----" #define mackey_header "-----b...
...*/ enckey = generatesymkey(slot, ckm_aes_key_gen, 12
8/
8, &enckeyid, pwdata); if (enckey == null) { pr_fprintf(pr_stderr, "generatesymkey for aes returned null.\n"); rv = secfailure; goto cleanup; } /* generate a second key to use for macing, also a token object.
... */ mackey = generatesymkey(slot, ckm_generic_secret_key_gen, 160/
8, &mackeyid, pwdata); if (mackey == null) { pr_fprintf(pr_stderr, "generatesymkey for macing returned null.\n"); rv = secfailure; goto cleanup; } /* get the encrypt key cka_id */ rv = gathercka_id(enckey, &encckaid); if (rv != secsuccess) { pr_fprintf(pr_stderr, "error while wrapping encrypt key\n"); goto cleanup; } /* get the mac key cka_id */ rv = gathercka_id(mackey, &macckaid); if (rv != secsuccess) { pr_fprintf(pr_stderr, "can't get the mac key cka_id.\n"); goto cleanup; } if (noisefilename) { rv = seedfromnoisefile(noisefilename); if (rv != secsuccess) { port...
NSS Sample Code Sample_3_Basic Encryption and MACing
sample code 3 /* nspr headers */ #include <prthread.h> #include <plgetopt.h> #include <prerror.h> #include <prinit.h> #include <prlog.h> #include <prtypes.h> #include <plstr.h> /* nss headers */ #include <keyhi.h> #include <pk11priv.h> /* our samples utilities */ #include "util.h" #define buffersize
80 #define digestsize 16 #define ptext_mac_buffer_size 96 #define ciphersize 96 #define blocksize 32 #define cipher_header "-----begin cipher-----" #define cipher_trailer "-----end cipher-----" #define enckey_header "-----begin aeskey ckaid-----" #define enckey_trailer "-----end aeskey ckaid-----" #define mackey_header "-----b...
...*/ enckey = generatesymkey(slot, ckm_aes_key_gen, 12
8/
8, &enckeyid, pwdata); if (enckey == null) { pr_fprintf(pr_stderr, "generatesymkey for aes returned null.\n"); rv = secfailure; goto cleanup; } /* generate a second key to use for macing, also a token object.
... */ mackey = generatesymkey(slot, ckm_generic_secret_key_gen, 160/
8, &mackeyid, pwdata); if (mackey == null) { pr_fprintf(pr_stderr, "generatesymkey for macing returned null.\n"); rv = secfailure; goto cleanup; } /* get the encrypt key cka_id */ rv = gathercka_id(enckey, &encckaid); if (rv != secsuccess) { pr_fprintf(pr_stderr, "error while wrapping encrypt key\n"); goto cleanup; } /* get the mac key cka_id */ rv = gathercka_id(mackey, &macckaid); if (rv != secsuccess) { pr_fprintf(pr_stderr, "can't get the mac key cka_id.\n"); goto cleanup; } if (noisefilename) { rv = seedfromnoisefile(noisefilename); if (rv != secsuccess) { port...
NSS Sample Code Utilities_1
tio.c_lflag &= ~echo; tcsetattr(fd, tcsaflush, &tio); } } /* * echoon */ static void echoon(int fd) { if (isatty(fd)) { struct termios tio; tcgetattr(fd, &tio); tio.c_lflag |= echo; tcsetattr(fd, tcsaflush, &tio); } } /* * checkpassword */ prbool checkpassword(char *cp) { int len; char *end; len = port_strlen(cp); if (len <
8) { return pr_false; } end = cp + len; while (cp < end) { unsigned char ch = *cp++; if (!((ch >= 'a') && (ch <= 'z')) && !((ch >= 'a') && (ch <= 'z'))) { return pr_true; } } return pr_false; } /* * getpassword */ char* getpassword(file *input, file *output, char *prompt, prbool (*ok)(char *)) { char ...
... echooff(infd); } fgets(phrase, sizeof(phrase), input); if (istty) { fprintf(output, "\n"); echoon(infd); } /* stomp on newline */ phrase[port_strlen(phrase)-1] = 0; /* validate password */ if (!(*ok)(phrase)) { if (!istty) return 0; fprintf(output, "password must be at least
8 characters long with one or more\n"); fprintf(output, "non-alphabetic characters\n"); continue; } return (char*) port_strdup(phrase); } } /* * filepasswd extracts the password from a text file * * storing passwords is often used with server environments * where prompting the user for a password or requiring it * to be entered in the command line i...
...) != '\n' && c != eof) ; if (c == eof) rv = secfailure; fprintf(stderr, "\n"); /* set back termio the way it was */ tio.c_lflag = orig_lflag; tio.c_cc[vmin] = orig_cc_min; tio.c_cc[vtime] = orig_cc_time; tcsetattr(fd, tcsaflush, &tio); return rv; } /* * seedfromnoisefile */ secstatus seedfromnoisefile(const char *noisefilename) { char buf[204
8]; prfiledesc *fd; print32 count; fd = pr_open(noisefilename, pr_rdonly, 0); if (!fd) { fprintf(stderr, "failed to open noise file."); return secfailure; } do { count = pr_read(fd,buf,sizeof(buf)); if (count > 0) { pk11_randomupdate(buf,count); } } while (count > 0); pr_close(fd); return secsuccess; } /* *...
EncDecMAC using token object - sample 3
*/ /* nspr headers */ #include #include #include #include #include #include #include /* nss headers */ #include #include /* our samples utilities */ #include "util.h" #define buffersize
80 #define digestsize 16 #define ptext_mac_buffer_size 96 #define ciphersize 96 #define blocksize 32 #define cipher_header "-----begin cipher-----" #define cipher_trailer "-----end cipher-----" #define enckey_header "-----begin aeskey ckaid-----" #define enckey_trailer "-----end aeskey ckaid-----" #define mackey_header "-----begin mackey ckaid-----" #define mackey_trailer "-----end mackey ckaid----...
...*/ enckey = generatesymkey(slot, ckm_aes_key_gen, 12
8/
8, &enckeyid, pwdata); if (enckey == null) { pr_fprintf(pr_stderr, "generatesymkey for aes returned null.\n"); rv = secfailure; goto cleanup; } /* generate a second key to use for macing, also a token object.
... */ mackey = generatesymkey(slot, ckm_generic_secret_key_gen, 160/
8, &mackeyid, pwdata); if (mackey == null) { pr_fprintf(pr_stderr, "generatesymkey for macing returned null.\n"); rv = secfailure; goto cleanup; } /* get the encrypt key cka_id */ rv = gathercka_id(enckey, &encckaid); if (rv != secsuccess) { pr_fprintf(pr_stderr, "error while wrapping encrypt key\n"); goto cleanup; } /* get the mac key cka_id */ rv = gathercka_id(mackey, &macckaid); if (rv != secsuccess) { pr_fprintf(pr_stderr, "can't get the mac key cka_id.\n"); goto cleanup; } if (noisefilename) { rv = seedfromnoisefile(noisefilename); if (rv != secsuccess) { port_seterror(pr_end_of_file_error); return secfailure; } rv = pk11_generaterandom(iv, blocksize); if (rv != secsuccess) { goto cleanup; } } else { /* generate a rando...
Utilities for nss samples
tio.c_lflag &= ~echo; tcsetattr(fd, tcsaflush, &tio); } } /* * echoon */ static void echoon(int fd) { if (isatty(fd)) { struct termios tio; tcgetattr(fd, &tio); tio.c_lflag |= echo; tcsetattr(fd, tcsaflush, &tio); } } /* * checkpassword */ prbool checkpassword(char *cp) { int len; char *end; len = port_strlen(cp); if (len <
8) { return pr_false; } end = cp + len; while (cp < end) { unsigned char ch = *cp++; if (!((ch >= 'a') && (ch <= 'z')) && !((ch >= 'a') && (ch <= 'z'))) { return pr_true; } } return pr_false; } /* * getpassword */ char* getpassword(file *input, file *output, char *prompt, prbool (*ok)(char *)) { char ...
... echooff(infd); } fgets(phrase, sizeof(phrase), input); if (istty) { fprintf(output, "\n"); echoon(infd); } /* stomp on newline */ phrase[port_strlen(phrase)-1] = 0; /* validate password */ if (!(*ok)(phrase)) { if (!istty) return 0; fprintf(output, "password must be at least
8 characters long with one or more\n"); fprintf(output, "non-alphabetic characters\n"); continue; } return (char*) port_strdup(phrase); } } /* * filepasswd extracts the password from a text file * * storing passwords is often used with server environments * where prompting the user for a password or requiring it * to be entered in the commnd line is...
...) != '\n' && c != eof) ; if (c == eof) rv = secfailure; fprintf(stderr, "\n"); /* set back termio the way it was */ tio.c_lflag = orig_lflag; tio.c_cc[vmin] = orig_cc_min; tio.c_cc[vtime] = orig_cc_time; tcsetattr(fd, tcsaflush, &tio); return rv; } /* * seedfromnoisefile */ secstatus seedfromnoisefile(const char *noisefilename) { char buf[204
8]; prfiledesc *fd; print32 count; fd = pr_open(noisefilename, pr_rdonly, 0); if (!fd) { fprintf(stderr, "failed to open noise file."); return secfailure; } do { count = pr_read(fd,buf,sizeof(buf)); if (count > 0) { pk11_randomupdate(buf,count); } } while (count > 0); pr_close(fd); return secsuccess; } /* *...
nss tech note7
at present 1024 bit and 204
8 bit rsa keys are the most common and recommended.
... to prevent denial-of-service attacks with huge public keys, nss disallows modulus size greater than
8192 bits.
...pkcs #1 v1.5 block formatting question: in pkcs #1 v1.5 (section
8.1 encryption-block formatting) and v2.1 (section 7.2.1 encryption operation), pkcs1 v1.5 padding is described like this: 00 || 02 || ps || 00 || m but in pkcs #1 v2.0 (section 9.1.2.1 encoding operation, step 3) and on the w3c web site (http://www.w3.org/tr/xmlenc-core/#rsa-1_5), pkcs1 v1.5 padding is described like this: 02 || ps || 00 || m 00 at the beginning is missing.
NSS environment variables
3.11.
8 nss_enable_audit boolean (1 to enable) enable auditing of activities of the nss cryptographic module in fips mode.
... before 3.0 moz_debug_symbols boolean (1 to enable) needed on windows to build with versions of msvc (such as vc
8 and vc9) that do not understand /pdb:none 3.11 moz_debug_flags string when moz_debug_symbols is set, you may use moz_debug_flags to specify alternative compiler flags to produce symbolic debugging information in a particular format.
... 3.12.
8 nsdistmode string on operating systems other than windows, this controls whether copies, absolute symlinks, or relative symlinks of the output files should be published to mozilla/dist.
Utility functions
hash_begin mxr 3.4 and later hash_clone mxr 3.10 and later hash_create mxr 3.4 and later hash_destroy mxr 3.4 and later hash_end mxr 3.4 and later hash_gethashobject mxr 3.2 and later hash_gethashobjectbyoidtag mxr 3.
8 and later hash_gethashtypebyoidtag mxr 3.
8 and later hash_gettype mxr 3.12 and later hash_hashbuf mxr 3.10 and later hash_resultlen mxr 3.4 and later hash_resultlenbyoidtag mxr 3.10 and later hash_resultlencontext mxr 3.10 and late...
... port_freearena mxr 3.2 and later port_geterror mxr 3.2 and later port_newarena mxr 3.2 and later port_realloc mxr 3.2 and later port_seterror mxr 3.2 and later port_setucs2_asciiconversionfunction mxr 3.2 and later port_setucs2_utf
8conversionfunction mxr 3.2 and later port_setucs4_utf
8conversionfunction mxr 3.2 and later port_strdup mxr 3.5 and later port_ucs2_asciiconversion mxr 3.2 and later port_ucs2_utf
8conversion mxr 3.2 and later port_zalloc mxr 3.2 and later ...
...xr 3.2 and later secitem_arenadupitem mxr 3.9 and later secitem_compareitem mxr 3.2 and later secitem_copyitem mxr 3.2 and later secitem_dupitem mxr 3.2 and later secitem_freeitem mxr 3.2 and later secitem_itemsareequal mxr 3.
8 and later secitem_zfreeitem mxr 3.2 and later seckey_copyencryptedprivatekeyinfo mxr 3.2 and later seckey_copyprivatekeyinfo mxr 3.2 and later seckey_creatersaprivatekey mxr 3.2 and later seckey_destroyencryptedprivatekeyinfo mxr 3.2 and later ...
Installing Pork
index: src/set_mcpp.sh =================================================================== --- src/set_mcpp.sh (revision 7
8) +++ src/set_mcpp.sh (working copy) @@ -35,14 +35,14 @@ echo " cd ${inc_dir}/mcpp-gcc" cd ${inc_dir}/mcpp-gcc if test !
...std.h - ${cxx} -e -xc++ -dm /dev/null | sort | grep -e ' *#define *[a-za-z]+' \ + ${cxx} ${cppflags} -e -xc++ -dm /dev/null | sort | grep -e ' *#define *[a-za-z]+' \ > gxx${gcc_maj_ver}${gcc_min_ver}_predef_old.h fi if test ${host_system} = sys_cygwin; then if you don't do this, mcpp will get the wrong set of automatic definitions and you'll end up with an unpleasant hybrid x
86-64/i6
86 build system.
... $ export path=/builds/gcc-3.4.6-installed/bin:$path $ export cppflags=-m32 $ cc=gcc34 cxx=g++34 cppflags=-m32 ldflags=-m32 ../src/configure --enable-replace-cpp --prefix=/builds/gcc-3.4.6-installed --target=i6
86-pc-linux $ make $ make install program_transform_name= ...
Tutorial: Embedding Rhino
here's an example use of runscript from a shell command line: $ java runscript "math.cos(math.pi)" -1 $ java runscript "function f(x){return x+1} f(7)"
8 note that you'll have to have both the rhino classes and the runscript example class file in the classpath.
...(note that because the java -jar option preempts the rest of the classpath, we can't use that and access the counter class.) $ java -cp "js.jar;examples" org.mozilla.javascript.tools.shell.main js> defineclass("counter") js> c = new counter(7) [object counter] js> c.count 7 js> c.count
8 js> c.count 9 js> c.resetcount() js> c.count 0 counter's constructors the zero-argument constructor is used by rhino runtime to create instances.
... the counter object from within our java code, constructing it with the value 7, and assigning it to the top-level variable mycounter: object[] arg = { new integer(7) }; scriptable mycounter = cx.newobject(scope, "counter", arg); scope.put("mycounter", scope, mycounter); now we can reference the mycounter object from our script: $ java runscript3 'runscript4 'mycounter.count; mycounter.count'
8 ...
Small Footprint
on a recent build, the length of js.jar was 603,127 bytes corresponding to 1,171,70
8 bytes of all uncompressed rhino classes with debug information included.
... with various changes js.jar size can be reduced to 204,6
89 bytes corresponding to 424,774 bytes of uncompressed classes.
...this change saves 47,9
84 bytes of class files.
Scripting Java
this works just as in java, with the use of the new operator: js> new java.util.date() thu jan 24 16:1
8:17 est 2002 if we store the new object in a javascript variable, we can then call methods on it: js> f = new java.io.file("test.txt") test.txt js> f.exists() true js> f.getname() test.txt static methods and fields can be accessed from the class object itself: js> java.lang.math.pi 3.1415926535
89793 js> java.lang.math.cos(0) 1 in javascript, unlike java, the method by itself is an object a...
...for example, to create an array of bytes, we must use the special field java.lang.byte.type: js> a = java.lang.reflect.array.newinstance(java.lang.character.type, 2); [c@7a
84e4 the resulting value can then be used anywhere a java array of that type is allowed.
... see bugzilla 245
882 for details.
Property cache
the property cache was introduced in bug 365
851.
...see bug 45
8271 and bug 507231 for example.
...see bug 440
834.
INT_FITS_IN_JSVAL
obsolete since javascript 1.
8.5this feature is obsolete.
... starting in spidermonkey 1.
8.5, jsval can store a full 32-bit integer, so this check isn't needed any longer for 32-bit integers.
...*/ } else { js_reporterror(cx, "integer out of range: %d", item); } see also int_to_jsval changeset - 52750:05bd
86e3559a ...
INT_TO_JSVAL
before spidermonkey 1.
8.5, not all integers can be stored in a jsval; use int_fits_in_jsval to test.
... starting in spidermonkey 1.
8.5, jsval can store a full 32-bit integer, so this check isn't needed any longer for 32-bit integers.") }} if i does not fit into a jsval (see int_fits_in_jsval), the behavior is undefined.
... see also mxr id search for int_to_jsval js::toint32 js::int32value bug 1177
892 -- removed ...
JS::SetLargeAllocationFailureCallback
added in spidermonkey 3
8 callback syntax typedef void (* js::largeallocationfailurecallback)(void *data); name type description data void * data parameter passed to js::setlargeallocationfailurecallback.
... added in spidermonkey 3
8 description if a large allocation fails when calling pod_{calloc,realloc}cangc, the js engine may call the large-allocation- failure callback, if set, to allow the embedding to flush caches, possibly perform shrinking gcs, etc.
... see also mxr id search for js::setlargeallocationfailurecallback mxr id search for js::largeallocationfailurecallback bug 936236 bug 9
87995 - added data parameter ...
JS::SetOutOfMemoryCallback
added in spidermonkey 3
8 callback syntax typedef void (* outofmemorycallback)(jscontext *cx, void *data); name type description data void * data parameter passed to js::setoutofmemorycallback.
... added in spidermonkey 3
8 description unlike the error reporter, which is only called if the exception for an oom bubbles up and is not caught, the js::outofmemorycallback is called immediately at the oom site to allow the embedding to capture the current state of heap allocation before anything is freed.
... see also mxr id search for js::setoutofmemorycallback mxr id search for js::outofmemorycallback bug 969415 bug 9
87995 - added data parameter ...
JSClass.flags
if the global object does not have this flag, then scripts may cause nonstandard behavior by replacing standard constructors or prototypes (such as function.prototype.) objects that can end up with the wrong prototype object, if this flag is not present, include: arguments objects (ecma 262-3 §10.1.
8 specifies "the original object prototype"), function objects (ecma 262-3 §13.2 specifies "the original function prototype"), and objects created by many standard constructors (ecma 262-3 §15.4.2.1 and others).
... jsclass_share_all_properties obsolete since javascript 1.
8.5 instructs spidermonkey to automatically give all properties of objects of this class the jsprop_shared attribute.
... see also bug 527
805 - removed jsclass_share_all_properties bug 5717
89 - removed jsclass_is_extended bug 63
8291 - removed jsclass_mark_is_trace bug 641025 - added jsclass_implements_barriers bug 702507 - removed jsclass_construct_prototype bug 75
8913 - removed jsclass_new_resolve_gets_start bug 766447 - added jsclass_is_domjsclass bug 79210
8 - added jsclass_emulates_undefined bug 993026 - removed jsclass_ne...
JSClass
obsolete since jsapi 44 use null or js_convertstub (spidermonkey 31 or older) for default behavior, which is equivalent to that defined by ecmascript in §
8.12.
8.
...the code for such a class is simple: /* spidermonkey 3
8 */ static jsclass robot_class = { "robot", /* name */ 0 /* flags */ }; /* spidermonkey 31 or older */ static jsclass robot_class = { "robot", /* name */ 0, /* flags */ js_propertystub, js_propertystub, js_propertystub, js_propertystub, js_enumeratestub, js_resolvestub, js_convertstub, null, jsclass_no_optional_members }; to expose this class to scri...
...val().setobject(*obj); /* spidermonkey 31 or older * js_set_rval(cx, vp, object_to_jsval(obj)); */ return true; } { js_initclass(cx, global, js::null(), &printer_class, printer_construct, 1, null, null, null, null); } see also mxr id search for jsclass jsclass.flags js_getclass js_initclass js_newobject js_newobjectforconstructor js_instanceof bug 63
8291 - added trace bug 702507 - removed jsclass_construct_prototype bug 726944 - removed xdrobject, reserved0 and reserved1 bug
886
829 - made finalize optional bug 9576
88 - removed checkaccess bug 110336
8 - made most of members optional bug 1097267 - removed jsclass_new_enumerate bug 1054756 - removed convert bug 1261723 - class ops are moved to a sub-structure jsclassops ...
JSConstDoubleSpec
syntax template<typename t> struct jsconstscalarspec { const char *name; t val; /* uint
8_t flags; // obsolete from jsapi 35 uint
8_t spare[3]; // obsolete from jsapi 35 */ }; typedef jsconstscalarspec<double> jsconstdoublespec; typedef jsconstscalarspec<int32_t> jsconstintegerspec; // added in spidermonkey 3
8 name type description val double or int32_t value for the double or integer.
... flags uint
8_t property attributes for the double.
... spare uint
8_t [3] reserved for future use.
JSFastNative
obsolete since javascript 1.
8.5this feature is obsolete.
... this article covers features introduced in spidermonkey 1.
8 jsfastnative is the type of fast native functions in the jsapi.
... added in spidermonkey 1.
8.1 jsfastnative has been renamed to jsnative.
JSMarkOp
in spidermonkey 1.
8, jsmarkop will be deprecated.
... all new code using spidermonkey 1.
8 or later should use a jstraceop instead to ensure that the tracing apis work properly.
... see also jsclass bug 63
8291 ...
JSObjectOps.dropProperty
obsolete since javascript 1.
8.5this feature is obsolete.
...see bug 40
8416 for details.
...in spidermonkey 1.
8 and earlier, the main built-in jsobjectops implementation serialized all accesses to a given object's properties.
JSObjectOps.getProperty
obsolete since javascript 1.
8.5this feature is obsolete.
...see bug 40
8416 for details.
...this reflects the quirky behavior of delete as specified in ecma 262-3 §11.4.1 and ecma 262-3 §
8.6.2.5.
JS_AddFinalizeCallback
syntax bool js_addfinalizecallback(jsruntime *rt, jsfinalizecallback cb, void *data); // added in spidermonkey 3
8 (jsapi 32) void js_removefinalizecallback(jsruntime *rt, jsfinalizecallback cb); // added in spidermonkey 3
8 (jsapi 32) void js_setfinalizecallback(jsruntime *rt, jsfinalizecallback cb); // obsolete since jsapi 32 name type description rt jsruntime * the jsruntime for which to set the finalization callback.
...added in spidermonkey 3
8 name description jsfinalize_group_start called when preparing to sweep a group of compartments, before anything has been swept.
... see also mxr id search for js_addfinalizecallback mxr id search for js_removefinalizecallback mxr id search for jsfinalizestatus mxr id search for jsfinalize_group_start mxr id search for jsfinalize_group_end mxr id search for jsfinalize_collection_end mxr id search for jsfinalizecallback jsfreeop js_setgccallback bug 7232
86 - separated from js_setgccallback as js_setfinalizecallback bug 9967
85 - replaced with js_addfinalizecallback ...
JS_BufferIsCompilableUnit
syntax bool js_bufferiscompilableunit(jscontext *cx, js::handle<jsobject*> obj, const char *utf
8, size_t length); name type description cx jscontext * pointer to a js context from which to derive runtime information.
... utf
8 const char * string containing the script to compile.
... length size_t the length of utf
8 in characters.
JS_CompileScriptForPrincipals
obsolete since jsapi 2
8this feature is obsolete.
... warning: this api is subject to bug 43
8633, which can cause crashes in almost any program that uses js_destroyscript().
... see also mxr id search for js_compilescriptforprincipals mxr id search for js_compileucscriptforprincipals js::compile js_decompilescript js::evaluate js_executescript bug 93
8907 bug
8050
80 ...
JS_ConvertArguments
obsolete since jsapi 3
8this feature is obsolete.
...format can contain one or more instances of the following characters, as appropriate: character c type description b bool boolean c uint16_t ecma uint16_t, unicode character i int32_t ecma int32_t j int32_t ecma int32_t (used to be different, behaves like i now) obsolete since jsapi 2
8 u uint32_t ecma uint32_t d double ieee double i double integral ieee double s char * (c string) bug 607292 s jsstring * unicode string, accessed by a jsstring pointer w char16_t * unicode character vector, 0-terminated (w for wide) o jsobject * object reference f jsfunction * ...
... see also mxr id search for js_convertarguments js_convertargumentsva bug 607292 - obsolete s format bug 933946 - obsolete j format bug 96979
8 - added args bug 11257
84 ...
JS_DefinePropertyWithTinyId
syntax jsbool js_definepropertywithtinyid( jscontext *cx, jsobject *obj, const char *name, int
8 tinyid, jsval value, jspropertyop getter, jspropertyop setter, unsigned int attrs); jsbool js_defineucpropertywithtinyid( jscontext *cx, jsobject *obj, const jschar *name, size_t namelen, int
8 tinyid, jsval value, jspropertyop getter, jspropertyop setter, unsigned int attrs); name type description cx jscontext * the context in which to define the property.
... tinyid int
8 8-bit id to aid in sharing getter and setter callbacks among properties.
... tinyid is a signed
8-bit integer that affects the id value passed to certain callbacks.
JS_EnterCrossCompartmentCall
obsolete since jsapi 1
8this feature is obsolete.
... this article covers features introduced in spidermonkey 1.
8.1 js_entercrosscompartmentcall has been removed in bug 7
8606
8.
...see also js_leavecrosscompartmentcall js_entercompartment js_leavecompartment bug 7
8606
8 bug 563099 ...
JS_GET_CLASS
this macro was removed in spidermonkey 1.
8.
8 when the signature of js_getclass() was changed to take only an object pointer.
... note: in spidermonkey versions prior to spidermonkey 1.
8.
8, js_getclass took both a jscontext* and a jsobject* as arguments in thread-safe builds, and in non-thread-safe builds it took only a jsobject*.
... as of spidermonkey 1.
8.
8 it no longer exists, because js_getclass's signature is the same in all build environments.
JS_GetSecurityCallbacks
this article covers features introduced in spidermonkey 1.
8.1 configure spidermonkey security hooks.
... callback structure struct jssecuritycallbacks { jscspevalchecker contentsecuritypolicyallows; // added in spidermonkey 1.
8.5 jssubsumesop subsumes; // added in spidermonkey 31 jscheckaccessop checkobjectaccess; // obsolete since jsapi 29 jsprincipalstranscoder principalstranscoder; // obsolete since jsapi 13 jsobjectprincipalsfinder findobjectprincipals; // obsolete since jsapi 13 }; name type description contentsecuritypolicyallows jscs...
...if the callbacks are default value, it returns null see also mxr id search for js_getsecuritycallbacks mxr id search for js_setsecuritycallbacks jsprincipals jscspevalchecker jssubsumesop bug 9576
88 - removed checkobjectaccess bug 924905 - added subsumes bug 72
8250 - added -js_getsecuritycallbacks and js_setsecuritycallbacks, removed js_setcontextsecuritycallbacks, js_getruntimesecuritycallbacks, and js_setruntimesecuritycallbacks ...
JS_GetStringChars
syntax jschar * js_getstringchars(jsstring *str); // obsolete since jsapi 1.
8.5 const jschar * js_getstringcharsz(jscontext *cx, jsstring *str); // added in spidermonkey 1.
8.2, obsolete since jsapi 33 name type description cx jscontext * (in js_getstringcharsz only) a context.
... description js_getstringchars obsolete since javascript 1.
8.5 returns a pointer to the first element of an array of jschars.
...see also bug 609440 - removed js_getstringchars bug 1037
869 - removed js_getstringcharsz ...
JS_GetStringEncodingLength
this article covers features introduced in spidermonkey 1.
8.5 get the length of a javascript string in bytes.
... to encode to utf
8, use js::getdeflatedutf
8stringlength and js::deflatestringtoutf
8buffer instead.
... see also mxr id search for js_getstringencodinglength js_encodestringtobuffer js::deflatestringtoutf
8buffer js::getdeflatedutf
8stringlength bug 607292 ...
JS_InstanceOf
syntax bool js_instanceof(jscontext *cx, js::handle<jsobject*> obj, const jsclass *clasp, js::callargs *args); // added in spidermonkey 3
8 bool js_instanceof(jscontext *cx, js::handle<jsobject*> obj, const jsclass *clasp, jsval *argv); // obsolete since jsapi 32 name type description cx jscontext * pointer to a js context from which to derive runtime information.
...added in spidermonkey 3
8 argv jsval * optional argument vector.
... see also mxr id search for js_instanceof js_hasinstance js_getclass bug 9597
87 ...
JS_LeaveCrossCompartmentCall
obsolete since jsapi 1
8this feature is obsolete.
... this article covers features introduced in spidermonkey 1.
8.1 js_leavecrosscompartmentcall has been removed in bug 7
8606
8.
...see also js_entercrosscompartmentcall js_entercompartment js_leavecompartment bug 7
8606
8 bug 563099 ...
JS_New
this article covers features introduced in spidermonkey 1.
8 create an object as though by using the new keyword and a javascript function.
...added in spidermonkey 3
8 argc unsigned the number of arguments to pass to the constructor.
... see also mxr id search for js_new bug 4
80
850 - added bug 9597
87 - added args parameter ...
JS_NewUCString
note: js_newstring() was removed in spidermonkey 1.
8.5.
...syntax jsstring * js_newucstring(jscontext *cx, char16_t *chars, size_t length); jsstring * js_newstring(jscontext *cx, char *buf, size_t length); // obsolete since jsapi 1.
8.5 name type description cx jscontext * the context in which to create the new string.
...see also js_convertvalue js_getemptystringvalue js_getstringbytes js_getstringchars js_getstringlength js_internstring js_internucstring js_internucstringn js_newstringcopyn js_newstringcopyz js_newucstringcopyn js_newucstringcopyz js_valuetostring bug 61
8262 - removed js_newstring ...
JS_SealObject
obsolete since javascript 1.
8.5this feature is obsolete.
... as of spidermonkey 1.
8.5, js_sealobject has been removed from the jsapi, because ecmascript 5 includes a "seal" concept (namely, that of object.seal) which is quite different from that of js_sealobject.
...see also bug 492
849 ...
JS_YieldRequest
obsolete since jsapi 1
8this feature is obsolete.
...this bug (bug 402
89
8) will be fixed in spidermonkey 1.
8.
...in spidermonkey 1.
8 and later, this function will be present, but will do nothing, in non-js_threadsafe builds.
jsint
int
8; typedef ...
... uint
8; typedef ...
...see also bug 71472
8 - removes jsword/jsuword bug 730511 - removes intn/uintn bug 732306 - removes jsint bug 733260 - removes jsuint bug 70
8735 - deprecates {u,}int{
8,16,32,64} ...
Redis Tips
here's a stupid node script to show how this works: #!/usr/bin/env node var r = require('redis').createclient(); r.multi() .set("foo", 42) .set("bar", "ice cream") .set("baz", 6.2
8) .get("foo") .get("bar") .get("baz") .exec(function(err, resultlist) { console.log(json.stringify(resultlist, null, 2)); r.end(); // terminate the redis connection; node can quit }); when run, this prints: [ "ok", "ok", "ok", "42", "ice cream", "6.2
8" ] the result list includes one value per each command executed.
... ok, now in a different shell, and another redis-cli, do this: redis2> rpush myqueue 42 now if you look back at the first redis-cli, you'll see that it immediately popped the value off the list and said something like: redis1> 1) "myqueue" 2) "42" (26.
87s) that rules!
... > r.zrevrange('last-login', 0, -1, 'withscores', print); ["lloyd", "1339627441.115", "zcarter", "1339627437.7579999", "jparsons", "1339627432.92
8"] awesome.
Signing Mozilla apps for Mac OS X
for projects that don't use mozilla's release automation and would like to be signed for secure launching on os 10.
8 mountain lion and later, this guide should provide some insight into how to make sure applications are signed correctly using apple's codesign tool.
... codesign -s mac-testing -fv \ --keychain /users/user/library/keychains/mykeychain.keychain \ --resource-rules ./application.app/contents/_codesignature/coderesources \ --requirements '=designated => identifier "org.you.yourapp" and ( (anchor apple generic and certificate leaf[field.1.2.
840.113635.100.6.1.9] ) or (anchor apple generic and certificate 1[field.1.2.
840.113635.100.6.2.6] and certificate leaf[field.1.2.
840.113635.100.6.1.13] and certificate leaf[subject.ou] = "43aq936h96"))' \ application.app or if you're using v2 signing, the command might look like this: codesign -s mac-testing -fv --deep \ --keychain /users/user/library/keychains/mykeychain.keyc...
...hain \ --requirements '=designated => ( (anchor apple generic and certificate leaf[field.1.2.
840.113635.100.6.1.9] ) or (anchor apple generic and certificate 1[field.1.2.
840.113635.100.6.2.6] and certificate leaf[field.1.2.
840.113635.100.6.1.13] and certificate leaf[subject.ou] = "43aq936h96"))' \ application.app depending on your keychain preferences, the codesign command may display a popup asking for the password for the specified keychain.
Places Developer Guide
epage(oururi); // remove all visits for multiple urls from history var uristodelete = [oururi]; // will call nsinavhistoryobserver.onbeginupdatebatch/onendupdatebatch var donotify = false; browserhistory.removepages(uristodelete, uristodelete.length, donotify); // remove all visits within a given time period var enddate = date.now() * 1000; // now, in microseconds var startdate = enddate - (7 *
86400 * 1000 * 1000); // one week ago, in microseconds browserhistory.removepagesbytimeframe(startdate, enddate); // remove all pages for a given host var entiredomain = true; // will delete from all hosts from the given domain browserhistory.removepagesfromhost("mozilla.com", true); // remove all history visits browserhistory.removeallpages(); querying history the code sample below queries the br...
...the problem is that it is not yet implemented -- see bug 320
831.
...// formulate a uri to query for the 10 most visited uris in the browser history var mostvisited = "place:querytype=0&sort=
8&maxresults=10"; // create an nsiuri for the url to be bookmarked.
Creating a Python XPCOM component
defining the interface make a file named "nsipysimple.idl" to define the interface: #include "nsisupports.idl" [scriptable, uuid(2b324e9d-a322-44a7-bd6e-0d
8c
83d94
883)] interface nsipysimple : nsisupports { attribute string yourname; void write( ); void change(in string avalue); }; this is the same as the nsisimple interface used here.
...for example: xpidl.exe -m typelib -w -v -i c:\source\mozilla\obj-i6
86-pc-mingw32\dist\idl foo.idl xpidl will then create nsipysimple.xpt, which should be placed correctly (e.g., in the 'components' directory).
...make a file named "py_simple.py" for the actual code (again, in the 'components' directory): from xpcom import components, verbose class pysimple: #pythontestcomponent _com_interfaces_ = components.interfaces.nsipysimple _reg_clsid_ = "{c456ceb5-f142-40a
8-becc-764911bc
8ca5}" _reg_contractid_ = "@mozilla.org/pysimple;1" def __init__(self): self.yourname = "a default name" # or mname ?
Creating the Component Code
identifiers in xpcom the series of nsiid variables initialized here are actually classes created for handing the 12
8-bit identifiers that xpcom uses to support contractual relationships between the client and component interfaces.
...all of the 12
8-bit numbers used in xpcom - the class and the interface ids - are examples of uuids, or universal unique identifiers, which were discussed in object interface discovery.
...uuidgen is a command-line tool that returns a unique 12
8-bit number when you call it with no arguments: $ uuidgen ce32e3ff-36f
8-425f-94be-d
85b26e634ee on windows, a program called guidgen.exe does the same thing and also provides a graphical user interface if you'd rather point and click.
XPCOM Stream Guide
primitive input streams type native class contract id interface how to bind to a data source generic nsstorageinputstream n/a nsiinputstream, nsiseekablestream storagestream.newinputstream(); string (
8-bit characters) nsstringstream @mozilla.org/io/string-input-stream;1 nsistringinputstream stream.setdata(data, length); file nsfileinputstream @mozilla.org/network/file-input-stream;1 nsifileinputstream stream.init(file, ioflags, perm, behaviorflags); zip nsjarinputstream n/a nsiinputstream zipreader.getinputstream(zipentry); s...
... a note about unicode strings versus nsiinputstream nsiinputstream and nsioutputstream work with
8-bit characters.
... var converter = components.classes["@mozilla.org/intl/scriptableunicodeconverter"] .createinstance(components.interfaces.nsiscriptableunicodeconverter); converter.charset = "utf-
8"; var stream = converter.converttoinputstream(string); javascript modules are your friends there are several useful javascript modules at your disposal.
nsIRegistry
try { st.first(); do { var data = st.currentitem(); if( data instanceof ci.nsiregistrynode ) print("nsiregistrynode: " + data.nameutf
8 + " (" + data.key + ")"); st.next(); } while( components.lastresult == 0 ); } catch(e) {} now, the output is something like: profiles (344) profiles/default (530) profiles/foo (1046) profiles/bar (151
8) the number inside the parenthesis is the "key." you can use this key with the rest of the nsiregistry api (see mxr).
...js> rs.getstringutf
8(530, "directory") // 530: key corresponding with profiles/default the output is something like: /home/lion/.mozilla/default/awp
83kud.slt boo-yah!
...js> rs.setstringutf
8(530, "directory", "/home/lion/somewhere/else") js> rs.getstringutf
8(530, "directory") /home/lion/somewhere/else yes!
HOWTO
"component returned failure code: 0x
80040111 (ns_error_not_available) [nsixpccomponents_utils.import]" nsresult: "0x
80040111 (ns_error_not_available)" location: "js frame :: file.js :: <top_level> :: line 12" data: no] solution 1 var loader = components.classes["@mozilla.org/moz/jssubscript-loader;1"] .getservice(components.interfaces.mozijssubscriptloader); loader.loadsubscript("chrome://myall/content/file.jsm"); see: http:...
...//mxr.mozilla.org/comm-central/...figutils.js#54 solution 2 append the following at the top of your js file which you want to run in xpcshell { // <https://developer.mozilla.org/en/xpconnect/xpcshell/howto> // <https://bugzilla.mozilla.org/show_bug.cgi?id=54662
8> let cc = components.classes; let ci = components.interfaces; // register resource://app/ uri let ios = cc["@mozilla.org/network/io-service;1"] .getservice(ci.nsiioservice); let reshandler = ios.getprotocolhandler("resource") .queryinterface(ci.nsiresprotocolhandler); let mozdir = cc["@mozilla.org/file/directory_service;1"] .getservice(ci.nsiproperties) .get("curprocd", ci.nsilocalfile); let mozdiruri = ios.newfileuri(mozdir); reshandler.setsubstitution("app", mozdiruri); // register chr...
...ome://* uris let cr = cc["@mozilla.org/chrome/chrome-registry;1"] .getservice(ci.nsichromeregistry); cr.checkfornewchrome(); } bug 54662
8 would make this unnecessary.
nsACString
this class is typically used to represent ascii or utf-
8 character arrays.
... nsacstring corresponds to the acstring and autf
8string xpidl data types.
...that is, it may be used to store utf-
8 characters, ascii characters, or any random binary data.
jsdIStackFrame
method overview boolean eval(in astring bytes, in autf
8string filename, in unsigned long line, out jsdivalue result); attributes attribute type description callee jsdivalue function object running in this stack frame.
... functionname autf
8string function name executing in this stack frame.
...boolean eval( in astring bytes, in autf
8string filename, in unsigned long line, out jsdivalue result ); parameters bytes script to be evaluated.
mozIAsyncFavicons
1.0 66 introduced gecko 6.0 inherits from: nsisupports last changed in gecko 11.0 (firefox 11.0 / thunderbird 11.0 / seamonkey 2.
8) nsifaviconservice handles this interface, so you do not need to directly create a new service.
...nsiuri apageuri, in nsifavicondatacallback acallback); void setandfetchfaviconforpage(in nsiuri apageuri, in nsiuri afaviconuri, in boolean aforcereload, in unsigned long afaviconloadtype, [optional] in nsifavicondatacallback acallback); void replacefavicondata(in nsiuri afaviconuri, [const,array,size_is(adatalen)] in octet adata, in unsigned long adatalen, in autf
8string amimetype, [optional] in prtime aexpiration); void replacefavicondatafromdataurl(in nsiuri afaviconuri, in astring adataurl, [optional] in prtime aexpiration); methods getfaviconurlforpage() retrieve the url of the favicon for the given page.
...void replacefavicondata( in nsiuri afaviconuri, [const,array,size_is(adatalen)] in octet adata, in unsigned long adatalen, in autf
8string amimetype, [optional] in prtime aexpiration); parameters afaviconuri uri of the favicon whose data is being set.
mozIStorageError
last changed in gecko 1.9.1 (firefox 3.5 / thunderbird 3.0 / seamonkey 2.0) inherits from: nsisupports attributes attribute type description message autf
8string a human readable error string with details; this may be null if no details are available.
... toobig 1
8 a string or blob exceeds the size limit.
... readonly
8 attempted to write to a read-only database.
mozIVisitInfoCallback
66 introduced gecko 2.0 inherits from: nsisupports last changed in gecko 9.0 (firefox 9.0 / thunderbird 9.0 / seamonkey 2.6) method overview void handleerror(in nsresult aresultcode, in moziplaceinfo aplaceinfo); void handleresult(in moziplaceinfo aplaceinfo); void oncomplete(in nsresult aresultcode, in moziplaceinfo aplaceinfo);obsolete since gecko
8.0 methods handleerror() called when a moziplaceinfo couldn't be processed.
... oncomplete() obsolete since gecko
8.0 (firefox
8.0 / thunderbird
8.0 / seamonkey 2.5) called for each visit added, title change, or guid change when passed to moziasynchistory.updateplaces().
... notes this method was replaced by the separate handleresult() and handleerror() methods in gecko
8.0 (firefox
8.0 / thunderbird
8.0 / seamonkey 2.5).
nsIAccessibleProvider
xul controls constants constant value description xulalert 0x00001001 xulbutton 0x00001002 xulcheckbox 0x00001003 xulcolorpicker 0x00001004 xulcolorpickertile 0x00001005 xulcombobox 0x00001006 xuldropmarker 0x00001007 xulgroupbox 0x0000100
8 xulimage 0x00001009 xullink 0x0000100a xullistbox 0x0000100b xullistcell 0x00001026 xullisthead 0x00001024 xullistheader 0x00001025 xullistitem 0x0000100c xulmenubar 0x0000100d xulmenuitem 0x0000100e xulmenupopup 0x0000100f xulmenuseparator 0x00001010 xulpane 0x00001011 xulprogressmeter 0x00001012 xulscale 0x00001013 xulstatusbar 0x00001...
... xultabbox 0x0000101
8 a combination of a tabs object and a tabpanels object.
... xformssliderrange 0x0000200
8 used for range element represented by slider.
nsIBrowserHistory
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); void removepagesbytimeframe(in long long abegintime, in long long aendtime); void removepagesfromhost(in autf
8string 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 markpageasfollowedlink and markpageastyped methods were moved to nsinavhistoryservice in gecko 22.0 so that all markpageas* methods can be found in one interface.
... lastpagevisited obsolete since gecko 10.0 autf
8string the last page that was visited in a top-level window.
... void removepagesfromhost( in autf
8string ahost, in boolean aentiredomain ); parameters ahost the name of the host to be removed.
nsICacheService
method overview nsicachesession createsession(in string clientid, in nscachestoragepolicy storagepolicy, in boolean streambased); acstring createtemporaryclientid(in nscachestoragepolicy storagepolicy); obsolete since gecko 1.9.2 void evictentries(in nscachestoragepolicy storagepolicy); void init(); obsolete since gecko 1.
8 void shutdown(); obsolete since gecko 1.
8 void visitentries(in nsicachevisitor visitor); attributes attribute type description cacheiotarget nsieventtarget the event target for cache i/o operation notifications.
... init() obsolete since gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) initialize the cache service.
... exceptions thrown missing exception missing description shutdown() obsolete since gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) shutdown() the cache service.
nsIComponentManager
66 introduced gecko 0.7 inherits from: nsisupports last changed in gecko
8.0 (firefox
8.0 / thunderbird
8.0 / seamonkey 2.5) method overview void addbootstrappedmanifestlocation(in nsilocalfile alocation); void createinstance(in nscidref aclass, in nsisupports adelegate, in nsiidref aiid, [iid_is(aiid),retval] out nsqiresult result); void createinstancebycontractid(in string acontractid, in nsisupports adelegate, in nsiidref aiid, [iid_is(aiid),retval] out nsqiresult result); void getclassobject(in nscidref aclass, in nsiidref aiid, [iid_is(aiid),retval] out nsqiresult result...
... this method was introduced in gecko
8 to let bootstrapped add-ons provide content at chrome:// uris.
... void removebootstrappedmanifestlocation( in interface nsilocalfile alocation ); parameters examples using addbootstrappedmanifestlocation in a bootstrapped extension for firefox
8 and 9: alocation the directory or xpi to stop reading the chrome.manifest from.
nsIDOMEvent
for example, mouse events are retargeted to their parent node when they happen over text nodes (bug 1
85
889), and in that case .target will show the parent and .explicitoriginaltarget will show the text node.
... mousedown 0x00000001 mouseup 0x00000002 mouseover 0x00000004 mouseout 0x0000000
8 mousemove 0x00000010 mousedrag 0x00000020 click 0x00000040 dblclick 0x000000
80 keydown 0x00000100 keyup 0x00000200 keypress 0x00000400 dragdrop 0x00000
800 focus 0x00001000 blur 0x00002000 select 0x00004000 chan...
...ge 0x0000
8000 reset 0x00010000 submit 0x00020000 scroll 0x00040000 load 0x000
80000 unload 0x00100000 xfer_done 0x00200000 abort 0x00400000 error 0x00
800000 locate 0x01000000 move 0x02000000 resize 0x04000000 forward 0x0
8000000 help 0x10000000 back 0x20000000 text 0x40000000 alt_mask 0x00000001 control_mask 0x00000002 shift_mask 0x00000004 meta_mask 0x0000000
8 methods violates the xpcom interface guidelines deserialize() boolean deserialize( in constipcmessageptr amsg...
nsIEffectiveTLDService
method overview acstring getbasedomain(in nsiuri auri, [optional] in pruint32 aadditionalparts); acstring getbasedomainfromhost(in autf
8string ahost, [optional] in pruint32 aadditionalparts); acstring getpublicsuffix(in nsiuri auri); acstring getpublicsuffixfromhost(in autf
8string ahost); methods getbasedomain() returns the base domain of a uri; that is, the public suffix with a given number of additional domain name parts.
... acstring getbasedomainfromhost( in autf
8string ahost, in pruint32 aadditionalparts optional ); parameters ahost the host string to be analyzed.
... acstring getpublicsuffixfromhost( in autf
8string ahost ); parameters ahost the host string to be analyzed.
nsIHttpChannel
note: this returns the raw (possibly
8-bit) text from the server.
...starting from gecko 4
8 (firefox 4
8.0 / thunderbird 4
8.0 / seamonkey 2.45) they will return a ns_error_failure.
... warning: calling setresponseheader() while visiting response headers has undefined behavior until gecko 4
8 (firefox 4
8.0 / thunderbird 4
8.0 / seamonkey 2.45).
nsIINIParserWriter
method overview void setstring(in autf
8string asection, in autf
8string akey, in autf
8string avalue); void writefile([optional] in nsifile ainifile, [optional] in unsigned long aflags); constants file writing constants these constants are specified when calling writefile(), in order to change its behavior.
...on windows only, this flag to writefile() can be used to change the encoding from its default utf-
8.
... void setstring( in autf
8string asection, in autf
8string akey, in autf
8string avalue ); parameters asection the name of the section into which to place the property.
nsIJetpack
the code will be evaluated using at least javascript 1.
8.1.
...warning: bug 5
8930
8 prevents this message from being sent in some situations.
... history see bug 556
846 for details.
nsINavHistoryResultNode
icon autf
8string this uri can be used as an image source uri and will give you the favicon for the page.
... title autf
8string title of the web page or of the node's grouping (day, host, folder, and so on.).
... uri autf
8string the uri of the resource represented by the node.
nsIProfile
this interface was superseded by the nsitoolkitprofileservice interface in gecko 1.
8.1.
... 66 introduced gecko 0.9 deprecated gecko 1.
8.1 obsolete gecko 20.0 inherits from: nsisupports last changed in gecko 1.6 implemented by: @mozilla.org/profile/manager;1.
... to get access to the profile manager service: var profile = components.classes["@mozilla.org/profile/manager;1"] .getservice(components.interfaces.nsiprofile); note: this interface was used by seamonkey up through seamonkey 1.1 versions, which were based off gecko 1.
8.1.
nsIPropertyBag2
inherits from: nsipropertybag last changed in gecko 1.0 method overview nsivariant get(in astring prop); acstring getpropertyasacstring(in astring prop); astring getpropertyasastring(in astring prop); autf
8string getpropertyasautf
8string(in astring prop); boolean getpropertyasbool(in astring prop); double getpropertyasdouble(in astring prop); print32 getpropertyasint32(in astring prop); print64 getpropertyasint64(in astring prop); void getpropertyasinterface(in astring prop, in nsiidref iid, [iid_is(iid), retval] out nsqiresult result); pruint32 get...
...getpropertyasautf
8string() autf
8string getpropertyasautf
8string( in astring prop ); parameters prop property to return the value of.
... return value the property value as an autf
8string.
nsIProtocolProxyService
to access the service use: var pps = components.classes["@mozilla.org/network/protocol-proxy-service;1"] .getservice(components.interfaces.nsiprotocolproxyservice); method overview deprecated since gecko 1
8 nsiproxyinfo resolve(in nsiuri auri, in unsigned long aflags); nsicancelable asyncresolve(in nsiuri auri, in unsigned long aflags,in nsiprotocolproxycallback acallback); nsiproxyinfo newproxyinfo(in acstring atype, in autf
8string ahost,in long aport, in unsigned long aflags, in unsigned long afailovertimeout, in nsiproxyinfo afailoverproxy); nsiproxyinfo getfailoverforp...
... methods resolve() deprecated since gecko 1
8 this method has been removed in firefox 1
8.
... nsiproxyinfo newproxyinfo( in acstring atype, in autf
8string ahost, in long aport, in unsigned long aflags, in unsigned long afailovertimeout, in nsiproxyinfo afailoverproxy ); parameters atype the proxy type is a string value that identifies the proxy type.
nsIScriptError
d init(in wstring message, in wstring sourcename, in wstring sourceline, in pruint32 linenumber, in pruint32 columnnumber, in pruint32 flags, in string category); void initwithwindowid(in wstring message, in wstring sourcename, in wstring sourceline, in pruint32 linenumber, in pruint32 columnnumber, in pruint32 flags, in string category, in unsigned long long innerwindowid); autf
8string tostring(); attributes attribute type description category string a string indicating the category of error that occurred see categories for a list.
... infoflag 0x
8 just a log message methods init() initializes the object with information describing the error which occurred.
... autf
8string tostring(); parameters none.
nsIStandardURL
to create an instance, use: var standardurl = components.classes["@mozilla.org/network/standard-url;1"] .createinstance(components.interfaces.nsistandardurl); method overview void init(in unsigned long aurltype, in long adefaultport, in autf
8string aspec, in string aorigincharset, in nsiuri abaseuri); attributes attribute type description mutable boolean control whether or not this url can be modified.
...void init( in unsigned long aurltype, in long adefaultport, in autf
8string aspec, in string aorigincharset, in nsiuri abaseuri ); parameters aurltype one of the constants listed above.
...if null, then provide abaseuri implements this interface, the origin charset of abaseuri will be assumed, otherwise defaulting to utf-
8 (that is, no charset transformation from aspec).
nsIStringBundleOverride
method overview nsisimpleenumerator enumeratekeysinbundle(in autf
8string url); astring getstringfromname(in autf
8string url, in acstring key); methods enumeratekeysinbundle() get all override keys for a given string bundle.
... nsisimpleenumerator enumeratekeysinbundle( in autf
8string url ); parameters url the url of the original string bundle whose keys are to be overridden.
...astring getstringfromname( in autf
8string url, in acstring key ); parameters url the url of the original string bundle whose keys are to be overridden.
nsISupportsPrimitive
type_pruint
8 5 corresponding to nsisupportspruint
8.
... type_pruint64
8 corresponding to nsisupportspruint64.
...see also nsisupportscstring nsisupportschar nsisupportsdouble nsisupportsfloat nsisupportsid nsisupportsinterfacepointer nsisupportsprbool nsisupportsprint16 nsisupportsprint32 nsisupportsprint64 nsisupportsprtime nsisupportspruint16 nsisupportspruint32 nsisupportspruint64 nsisupportspruint
8 nsisupportsstring nsisupportsvoid ...
nsIWindowsRegKey
1.0 66 introduced gecko 1.
8 inherits from: nsisupports last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) the interface represents a single key in the registry.
... constant value description root_key_classes_root 0x
80000000 root_key_current_user 0x
80000001 root_key_local_machine 0x
80000002 access constants values for the mode parameter passed to the open() and create() methods.
... constant value description access_basic 0x00020000 access_query_value 0x00000001 access_set_value 0x00000002 access_create_sub_key 0x00000004 access_enumerate_sub_keys 0x0000000
8 access_notify 0x00000010 access_read access_basic | access_query_value | access_enumerate_sub_keys | access_notify access_write access_basic | access_set_value | access_create_sub_key access_all access_read | access_write wow64_32 0x00000200 wow64_64 0x00000100 type constants values fo...
nsIXULAppInfo
1.0 66 introduced gecko 1.
8 inherits from: nsisupports last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) in xulrunner applications nsixulappinfo obtains app-specific information from application.ini.
... platformversion acstring the version of gecko or xulrunner platform, for example "1.
8.1.19" or "1.9.3pre".
... version acstring the xul application's version, for example "0.
8.0+" or "3.7a1pre".
nsMsgSearchOpValue
nsmsgsearchopvalue defined in comm-central/ mailnews/ base/ search/ public/ nsmsgsearchcore.idl 146 typedef long nsmsgsearchopvalue; 147 14
8 [scriptable, uuid(9160b196-6fcb-4eba-aaaf-6c
806c4ee420)] 149 interface nsmsgsearchop { 150 const nsmsgsearchopvalue contains = 0; /* for text attributes */ 151 const nsmsgsearchopvalue doesntcontain = 1; 152 const nsmsgsearchopvalue is = 2; /* is and isn't also apply to some non-text attrs */ 153 const nsmsgsearchopvalue isnt = 3; 154 const nsmsgsearchopvalue isempty = 4; 155 156 const nsmsgsearchopvalue isbefore = 5; /* for date attributes */ 157 const nsmsgsearchopvalue isafter = 6; 15
8 159 const nsmsgsearchopvalue ishigherthan = 7; /* for priority.
... is also applies */ 160 const nsmsgsearchopvalue islowerthan =
8; 161 162 const nsmsgsearchopvalue beginswith = 9; 163 const nsmsgsearchopvalue endswith = 10; 164 165 const nsmsgsearchopvalue soundslike = 11; /* for ldap phoenetic matching */ 166 const nsmsgsearchopvalue ldapdwim = 12; /* do what i mean for simple search */ 167 16
8 const nsmsgsearchopvalue isgreaterthan = 13; 169 const nsmsgsearchopvalue islessthan = 14; 170 171 const nsmsgsearchopvalue namecompletion = 15; /* name completion operator...as the name implies =) */ 172 const nsmsgsearchopvalue isinab = 16; 173 const nsmsgsearchopvalue isntinab = 17; 174 const nsmsgsearchopvalue isntempty = 1
8; /* primarily for tags */ 175 const nsmsgsearchopvalue matches = 19; /* generic te...
...rm for use by custom terms */ 176 const nsmsgsearchopvalue doesntmatch = 20; /* generic term for use by custom terms */ 177 const nsmsgsearchopvalue knummsgsearchoperators = 21; /* must be last operator */ 17
8 }; ...
nsMsgViewCommandType
deletenotrash
8 delete the selected message.
... selectthread 1
8 select the entire thread.
... unjunk 2
8 mark the selected messages as not junk.
Troubleshooting XPCOM components registration
note that even your version of msvc may matter; your test machine may not have the c runtime libraries (msvcr70.dll / msvcp70.dll for msvc 7.0, and similarly named files for 7.1 and
8.0) available.
... if you compiled the component with msvc
8.0 (2005) and are attempting to use it on a windows xp machine or later, it will need a manifest embedded to find the runtime.
... the dllmain code that msvc
8 (and probably earlier versions too) generates for you doesn't need to be there, you can remove it.
XPCOM tasks
see bug 25
886.
... p2 classes that parallel standard library classes should have compatible apis, i.e., nsdeque bug 1
8505 nsstring nsavltree nshashtable our various array classes in some cases, this might initially be provided by additional interfaces.
... original document information author(s): unknown last updated date: may
8, 2003 copyright information: portions of this content are © 199
8–2007 by individual mozilla.org contributors; content available under a creative commons license | details.
Xptcall Porting Guide
here are examples of this implementation for win32 and linux x
86, netbsd x
86, and freebsd.
...here are examples of this implementation for win32 and linux x
86, netbsd x
86, and freebsd.
...i opted to use inline assembler for the gcc linux x
86 port.
Mail client architecture overview
messages - messages are always stored and streamed in rfc
822 format.
... there are also a number of protocol independant subsystems that have a symbiotic relationship with base: libmime - for dealing with rfc
822 messages and their mime parts.
...this includes the mail compose window, creation of rfc
822 messages from the data a user has entered, and sending the messages via smtp.
Thunderbird Binaries
you should see a string that looks something like this: comm-central-1.9.2 branch: mozilla/5.0 (windows; u; windows nt 5.1; en-us; rv:1.9.2.2pre) gecko/2010030
8 lanikai/3.1b1pre comm-central-trunk: mozilla/5.0 (windows; u; windows nt 5.1; en-us; rv:1.9.3a1pre) gecko/20090
826 shredder/3.1a1pre the part that you want to note is the gecko revision number (rv) and the thunderbird version string.
... rv:1.
8.0.x and thunderbird 1.5.0.x = gecko 1.
8.0 (thunderbird 1.5) branch.
... rv:1.
8.1.x and thunderbird 2.0.0.x = gecko 1.
8.1 (thunderbird 2) branch.
libmime content type handlers
the primary use of libmime is to parse and render rfc
822 messages for use by the messenger component of seamonkey.
...h:text/vcard * * libmime will then use nscomponentmanager::contractidtoclsid() to * locate the appropriate content type handler */ #ifndef nsimimecontenttypehandler_h_ #define nsimimecontenttypehandler_h_ typedef struct { prbool force_inline_display; } contenttypehandlerinitstruct; #include "prtypes.h" #include "nsisupports.h" #include "mimecth.h" // {20dabd99-f
8b5-11d2-
8ee0-00a024a7d144} #define ns_imime_content_type_handler_iid \ { 0x20dabd99, 0xf
8b5, 0x11d2, \ { 0x
8e, 0xe0, 0x0, 0xa0, 0x24, 0xa7, 0xd1, 0x44 } } class nsimimecontenttypehandler : public nsisupports { public: static const nsiid& getiid() { static nsiid iid = ns_imime_content_type_handler_iid; return iid; } ns_imethod getcontenttype(char **contenttype) = 0; n...
...the uuid for this component is: // {20dabda1-f
8b5-11d2-
8ee0-00a024a7d144} #define ns_vcard_content_type_handler_cid \ { 0x20dabda1, 0xf
8b5, 0x11d2, \ { 0x
8e, 0xe0, 0x0, 0xa0, 0x24, 0xa7, 0xd1, 0x44 } } ...
Accessibility Inspector - Firefox Developer Tools
note that this works correctly as of firefox 62 (bug 14673
81).
... for example: the color contrast in the image above is 2.
86, so potentially not enough contrast to make it easy to read.
...for example: in this example, the contrast ranges from 4.72 to 5.9
8.
Deprecated tools - Firefox Developer Tools
scratchpad scratchpad is deprecated as of firefox 70 (bug 15653
80), and will be removed as of firefox 72 (bug 1519103).
... alternatives remote debugging is available in about:debugging as of firefox 6
8.
... canvas debugger bugzilla issue: bug 140393
8 removed as of firefox 67 description canvas debugger allowed users to inspect the canvas element and see how frequently a given function is called.
AnalyserNode.frequencyBinCount - Web APIs
therefore, it will be one of 16, 32, 64, 12
8, 256, 512, 1024, 204
8, 4096,
8192, and 163
84.
...for more complete applied examples/information, check out our voice-change-o-matic demo (see app.js lines 12
8–205 for relevant code).
... analyser.fftsize = 256; var bufferlength = analyser.frequencybincount; console.log(bufferlength); var dataarray = new uint
8array(bufferlength); canvasctx.clearrect(0, 0, width, height); function draw() { drawvisual = requestanimationframe(draw); analyser.getbytefrequencydata(dataarray); canvasctx.fillstyle = 'rgb(0, 0, 0)'; canvasctx.fillrect(0, 0, width, height); var barwidth = (width / bufferlength) * 2.5 - 1; var barheight; var x = 0; for(var i = 0; i < bufferlength; i++) { barheight = dataarray[i]; canvasctx.fillstyle = 'rgb(' + (barheight+100) + ',50,50)'; canvasctx.fillrec...
Attr - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/attr" target="_top"><rect x="266" y="1" width="75" height="50" fill="#f4f...
...7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">attr</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} warning: starting in gecko 7.0 (firefox 7.0 / thunderbird 7.0 / seamonkey 2.4), a number of deprecated properties and methods output warning messages to the console.
... this change is implemented in chrome since version 46.0 and firefox since version 4
8.0.
AudioParamDescriptor - Web APIs
defaults to -3.402
8235e3
8.
...defaults to 3.402
8235e3
8.
...parameters['customgain'][i] : parameters['customgain'][0]) // note: a parameter contains an array of 12
8 values (one value for each of 12
8 samples), // however it may contain a single value which is to be used for all 12
8 samples // if no automation is scheduled for the moment.
AudioWorkletProcessor.parameterDescriptors (static getter) - Web APIs
defaults to -3.402
8235e3
8.
...defaults to 3.402
8235e3
8.
...parameters['customgain'][i] : parameters['customgain'][0]) // note: a parameter contains an array of 12
8 values (one value for each of 12
8 samples), // however it may contain a single value which is to be used for all 12
8 samples // if no automation is scheduled for the moment.
BaseAudioContext.createAnalyser() - Web APIs
for more complete applied examples/information, check out our voice-change-o-matic demo (see app.js lines 12
8–205 for relevant code).
... analyser.fftsize = 204
8; var bufferlength = analyser.frequencybincount; var dataarray = new uint
8array(bufferlength); analyser.getbytetimedomaindata(dataarray); // draw an oscilloscope of the current audio source function draw() { drawvisual = requestanimationframe(draw); analyser.getbytetimedomaindata(dataarray); canvasctx.fillstyle = 'rgb(200, 200, 200)'; canvasctx.fillrect(0, 0, width, height); canvasctx.linewidth = 2; canvasctx.strokestyle = 'rgb(0, 0, 0)'; canvasctx.beginpath(); var slicewidth = width * 1.0 / bufferlength; var x = 0; for(var i = 0; i < bufferlength; i++) { var v = dataa...
...rray[i] / 12
8.0; var y = v * height/2; if(i === 0) { canvasctx.moveto(x, y); } else { canvasctx.lineto(x, y); } x += slicewidth; } canvasctx.lineto(canvas.width, canvas.height/2); canvasctx.stroke(); }; draw(); specifications specification status comment web audio apithe definition of 'createanalyser()' in that specification.
Blob.text() - Web APIs
the text() method in the blob interface returns a promise that resolves with a string containing the contents of the blob, interpreted as utf-
8.
...the data is always presumed to be in utf-
8 format.
... blob.text() always uses utf-
8 as encoding, while filereader.readastext() can use a different encoding depending on the blob's type and a specified encoding name.
Bluetooth.requestDevice() - Web APIs
both 16-bit service ids 0x1
802 and 0x1
803.
...a proprietary 12
8-bit uuid service c4
8e6067-5295-4
8d3-
8d5c-0395f61792b1.
...let options = { filters: [ {services: ['heart_rate']}, {services: [0x1
802, 0x1
803]}, {services: ['c4
8e6067-5295-4
8d3-
8d5c-0395f61792b1']}, {name: 'examplename'}, {nameprefix: 'prefix'} ], optionalservices: ['battery_service'] } navigator.bluetooth.requestdevice(options).then(function(device) { console.log('name: ' + device.name); // do something with the device.
BudgetState - Web APIs
samsung internet android full support
8.0budgetat experimentaldeprecatednon-standardchrome full support 60edge full support ≤79firefox ?
... samsung internet android full support
8.0time experimentaldeprecatednon-standardchrome full support 60edge full support ≤79firefox ?
... samsung internet android full support
8.0legend full support full support no support no support compatibility unknown compatibility unknownexperimental.
CanvasRenderingContext2D.bezierCurveTo() - Web APIs
html <canvas id="canvas"></canvas> javascript // define canvas and context const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // define the points as {x, y} let start = { x: 50, y: 20 }; let cp1 = { x: 230, y: 30 }; let cp2 = { x: 150, y:
80 }; let end = { x: 250, y: 100 }; // cubic bézier curve ctx.beginpath(); ctx.moveto(start.x, start.y); ctx.beziercurveto(cp1.x, cp1.y, cp2.x, cp2.y, end.x, end.y); ctx.stroke(); // start and end points ctx.fillstyle = 'blue'; ctx.beginpath(); ctx.arc(start.x, start.y, 5, 0, 2 * math.pi); // start point ctx.arc(end.x, end.y, 5, 0, 2 * math.pi); // end point ctx.fill(); // control po...
...the first control point is placed at (120, 160), and the second at (1
80, 10).
... const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.beginpath(); ctx.moveto(30, 30); ctx.beziercurveto(120,160, 1
80,10, 220,140); ctx.stroke(); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.beziercurveto' in that specification.
CanvasRenderingContext2D.setTransform() - Web APIs
examples skewing a shape this example skews a rectangle both vertically (.2) and horizontally (.
8).
... html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.settransform(1, .2, .
8, 1, 0, 0); ctx.fillrect(0, 0, 100, 100); result retrieving and passing a dommatrix object in the following example, we have two <canvas> elements.
... html <canvas width="240"></canvas> <canvas width="240"></canvas> css canvas { border: 1px solid black; } javascript const canvases = document.queryselectorall('canvas'); const ctx1 = canvases[0].getcontext('2d'); const ctx2 = canvases[1].getcontext('2d'); ctx1.settransform(1, .2, .
8, 1, 0, 0); ctx1.fillrect(25, 25, 50, 50); let storedtransform = ctx1.gettransform(); console.log(storedtransform); ctx2.settransform(storedtransform); ctx2.beginpath(); ctx2.arc(50, 50, 50, 0, 2 * math.pi); ctx2.fill(); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.settransform' in that specificati...
CanvasRenderingContext2D.shadowColor - Web APIs
html <canvas id="canvas"></canvas> javascript the resulting alpha value of the fill shadow is .
8 * .2, or .16.
... the alpha of the stroke shadow is .
8 * .6, or .4
8.
... const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // shadow ctx.shadowcolor = 'rgba(255, 0, 0, .
8)'; ctx.shadowblur =
8; ctx.shadowoffsetx = 30; ctx.shadowoffsety = 20; // filled rectangle ctx.fillstyle = 'rgba(0, 255, 0, .2)'; ctx.fillrect(10, 10, 150, 100); // stroked rectangle ctx.linewidth = 10; ctx.strokestyle = 'rgba(0, 0, 255, .6)'; ctx.strokerect(10, 10, 150, 100); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.shadowcolor' in that specification.
Drawing text - Web APIs
function draw() { var ctx = document.getelementbyid('canvas').getcontext('2d'); ctx.font = '4
8px serif'; ctx.filltext('hello world', 10, 50); } <canvas id="canvas" width="300" height="100"></canvas> draw(); a stroketext example the text is filled using the current strokestyle.
... function draw() { var ctx = document.getelementbyid('canvas').getcontext('2d'); ctx.font = '4
8px serif'; ctx.stroketext('hello world', 10, 50); } <canvas id="canvas" width="300" height="100"></canvas> draw(); styling text in the examples above we are already making use of the font property to make the text a bit larger than the default size.
... a textbaseline example edit the code below and see your changes update live in the canvas: ctx.font = '4
8px serif'; ctx.textbaseline = 'hanging'; ctx.stroketext('hello world', 0, 100); playable code <canvas id="canvas" width="400" height="200" class="playable-canvas"></canvas> <div class="playable-buttons"> <input id="edit" type="button" value="edit" /> <input id="reset" type="button" value="reset" /> </div> <textarea id="code" class="playable-code"> ctx.font = "4
8px serif"; ctx.textbaseline ...
DOMHighResTimeStamp - Web APIs
// reduced time precision (2ms) in firefox 60 event.timestamp // 1519211
809934 // 1519211
810362 // 1519211
811670 // ...
... // reduced time precision with `privacy.resistfingerprinting` enabled event.timestamp; // 1519129
853500 // 1519129
85
8900 // 1519129
864400 // ...
...timestampchrome full support 6edge full support 12firefox full support 7ie full support 9opera full support 15safari full support
8webview android full support yeschrome android full support 1
8firefox android full support 15opera android full support 14safari ios full support 9samsung internet android ...
Detecting device orientation - Web APIs
the deviceorientationevent.beta value represents the motion of the device around the x axis, represented in degrees with values ranging from -1
80 to 1
80.
...} now, if we move our device, the ball will move accordingly: var ball = document.queryselector('.ball'); var garden = document.queryselector('.garden'); var output = document.queryselector('.output'); var maxx = garden.clientwidth - ball.clientwidth; var maxy = garden.clientheight - ball.clientheight; function handleorientation(event) { var x = event.beta; // in degree in the range [-1
80,1
80] var y = event.gamma; // in degree in the range [-90,90] output.innerhtml = "beta : " + x + "\n"; output.innerhtml += "gamma: " + y + "\n"; // because we don't want to have the device upside down // we constrain the x value to the range [-90,90] if (x > 90) { x = 90}; if (x < -90) { x = -90}; // to make computation easier we shift the range of // x and y to [0,1
80] ...
...x += 90; y += 90; // 10 is half the size of the ball // it center the positioning point to the center of the ball ball.style.top = (maxy*y/1
80 - 10) + "px"; ball.style.left = (maxx*x/1
80 - 10) + "px"; } window.addeventlistener('deviceorientation', handleorientation); click here to open this example in a new window; because deviceorientation doesn't work in a cross-origin <iframe> in all browsers.
Document.createNodeIterator() - Web APIs
nodefilter.show_cdata_section
8 shows cdatasection nodes.
... nodefilter.show_comment 12
8 shows comment nodes.
... nodefilter.show_notation 204
8 shows notation nodes.
Document.createTreeWalker() - Web APIs
nodefilter.show_cdata_section
8 shows cdatasection nodes.
... nodefilter.show_comment 12
8 shows comment nodes.
... nodefilter.show_notation 204
8 shows notation nodes.
EffectTiming.easing - Web APIs
accepts several pre-defined domstring values, a steps() timing function like steps(5, end), or a custom cubic-bezier value like cubic-bezier(0.42, 0, 0.5
8, 1).
...equivalent to cubic-bezier(0, 0, 0.5
8, 1).
...equivalent to cubic-bezier(0.42, 0, 0.5
8, 1).
Element - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent interface, node, and by extension that interface's parent, eventtarget.
... this change is implemented in chrome since version 46.0 and firefox since version 4
8.0.
File.lastModified - Web APIs
const filewithdate = new file([], 'file.bin', { lastmodified: new date(2017, 1, 1), }); console.log(filewithdate.lastmodified); //returns 14
85903600000 const filewithoutdate = new file([], 'file.bin'); console.log(filewithoutdate.lastmodified); //returns current time reduced time precision to offer protection against timing attacks and fingerprinting, the precision of somefile.lastmodified might get rounded depending on browser settings.
... // reduced time precision (2ms) in firefox 60 somefile.lastmodified; // 1519211
809934 // 1519211
810362 // 1519211
811670 // ...
... // reduced time precision with `privacy.resistfingerprinting` enabled somefile.lastmodified; // 1519129
853500 // 1519129
85
8900 // 1519129
864400 // ...
FileReaderSync.readAsText() - Web APIs
encoding the optional parameter specifies encoding to be used (e.g., iso-
8859-1 or utf-
8).
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetreadastextchrome full support yesedge full support 12firefox full support
8ie full support yesopera full support yessafari full support yeswebview android full support yeschrome android full support yesfirefox android full support ...
...
8opera android full support yessafari ios full support yessamsung internet android full support yeslegend full support full support ...
FileSystemEntry.getMetadata() - Web APIs
workingdirectory.getfile("tmp/log.txt", {}, function(fileentry) { fileentry.getmetadata(function(metadata) { if (metadata.size > 104
8576) { workingdirectory.getdirectory("log", {}, function(direntry) { fileentry.moveto(direntry); }, handleerror); } }); }, handleerror); browser compatibility the compatibility table on this page is generated from structured data.
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetgetmetadata experimentaldeprecatednon-standardchrome full support
8edge full support 79firefox no support noie no support noopera no support nosafari no support nowebview android full support ≤37ch...
...rome android full support 1
8firefox android no support noopera android no support nosafari ios no support nosamsung internet android full support yeslegend full support full support no support no supportexperimental.
FileSystemEntry.moveTo() - Web APIs
workingdirectory.getfile("tmp/log.txt", {}, function(fileentry) { fileentry.getmetadata(function(metadata) { if (metadata.size > 104
8576) { workingdirectory.getdirectory("log", {}, function(direntry) { fileentry.moveto(direntry); }, handleerror); } }); }, handleerror); browser compatibility the compatibility table on this page is generated from structured data.
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetmoveto experimentaldeprecatednon-standardchrome full support
8edge full support 79firefox no support noie no support noopera no support nosafari no support nowebview android full support ≤37chrome ...
...android full support 1
8firefox android no support noopera android no support nosafari ios no support nosamsung internet android full support yeslegend full support full support no support no supportexperimental.
FileSystemSync - Web APIs
full support 6prefixed prefixed implemented with the vendor prefix: webkitwebview android full support ≤37prefixed full support ≤37prefixed prefixed implemented with the vendor prefix: webkitchrome android full support 1
8prefixed full support 1
8prefixed prefixed implemented with the vendor prefix: webkitfirefox android no support noopera android full support 14prefixed full support 14prefixed prefixed implemented with the vendor prefix...
... no support noie no support noopera full support 15safari full support 6webview android full support ≤37chrome android full support 1
8firefox android no support noopera android full support 14safari ios full support 6samsung internet android full support 1.0root non-standardchrome full support 13edge ...
... no support noie no support noopera full support 15safari full support 6webview android full support ≤37chrome android full support 1
8firefox android no support noopera android full support 14safari ios full support 6samsung internet android full support 1.0legend full support full support ...
GamepadEvent - Web APIs
iewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetgamepadeventchrome full support 35 full support 35 no support 21 — 34prefixed prefixed implemented with the vendor prefix: webkitedge full support ≤1
8firefox full support 29 full support 29 no support 24 — 2
8disabled disabled from version 24 until version 2
8 (exclusive): this feature is behind the dom.gamepad.enabled preference (needs to be set to true).
...droid full support yesgamepadevent() constructorchrome full support 35edge full support 12firefox full support 29 full support 29 no support 24 — 2
8disabled disabled from version 24 until version 2
8 (exclusive): this feature is behind the dom.gamepad.enabled preference (needs to be set to true).
... full support 35 no support 21 — 34prefixed prefixed implemented with the vendor prefix: webkitedge full support 12firefox full support 29 full support 29 no support 24 — 2
8disabled disabled from version 24 until version 2
8 (exclusive): this feature is behind the dom.gamepad.enabled preference (needs to be set to true).
HTMLAnchorElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlanchorelement" target="_top"><rect x="321" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlanchorelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement, and implements those from htmlhyperlinkelementutils.
HTMLAreaElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlareaelement" target="_top"><rect x="341" y="65" width="150" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="416" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlareaelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement, and implements those from htmlhyperlinkelementutils.
HTMLAudioElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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...
..."90" x2="492" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlmediaelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#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 xlink:href="/docs/web/api/htmlaudioelement" target="_top"><rect x="131" y="65" width="160" height="50" fill="#f4f7f
8" 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"...
HTMLBRElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlbrelement" target="_top"><rect x="361" y="65" width="130" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="426" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlbrelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLBaseElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlbaseelement" target="_top"><rect x="341" y="65" width="150" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="416" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlbaseelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLBodyElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlbodyelement" target="_top"><rect x="341" y="65" width="150" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="416" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlbodyelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement and from windoweventhandlers.
HTMLButtonElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlbuttonelement" target="_top"><rect x="321" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlbuttonelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLCanvasElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlcanvaselement" target="_top"><rect x="321" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlcanvaselement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLDListElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmldlistelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f
8" 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">htmldlistelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLDataElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmldataelement" target="_top"><rect x="341" y="65" width="150" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="416" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmldataelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLDataListElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmldatalistelement" target="_top"><rect x="301" y="65" width="190" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmldatalistelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement htmldatalistelement.options read only is a htmlcollection representing a collection of the contained option elements.
HTMLDivElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmldivelement" target="_top"><rect x="351" y="65" width="140" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="421" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmldivelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLEmbedElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlembedelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f
8" 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">htmlembedelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLFieldSetElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlfieldsetelement" target="_top"><rect x="301" y="65" width="190" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlfieldsetelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLHRElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlhrelement" target="_top"><rect x="361" y="65" width="130" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="426" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlhrelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLHeadElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlheadelement" target="_top"><rect x="341" y="65" width="150" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="416" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlheadelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLHeadingElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlheadingelement" target="_top"><rect x="311" y="65" width="1
80" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="401" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlheadingelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLHtmlElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlhtmlelement" target="_top"><rect x="341" y="65" width="150" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="416" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlhtmlelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLIFrameElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmliframeelement" target="_top"><rect x="321" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmliframeelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLImageElement.alt - Web APIs
<div class="container"> <div class="left-margin"> <img src="/files/16
861/margin-flourish.svg" alt=""> </div> <div class="contents"> <p>lorem ipsum dolor sit amet, consectetur adipiscing elit.
... <div class="container"> <img src="https://udn.realityripple.com/samples/
87/eace6b7d6a.svg" alt="new page!" class="pageinfo-badge"> <p class="contents"> lorem ipsum dolor sit amet, consectetur adipiscing elit.
... .container { max-width: 500px; } .pageinfo-badge { width: 9em; padding-right: 1em; float: left; clip-path: polygon(100% 0, 100% 50%, 90% 70%,
80%
80%, 70% 90%, 50% 100%, 0 100%, 0 0); shape-outside: polygon(100% 0, 100% 50%, 90% 70%,
80%
80%, 70% 90%, 50% 100%, 0 100%, 0 0); } .contents { margin-top: 1em; font: 16px arial,helvetica,verdana,sans-serif; } result other images images simply showing objects or scenes should have alt text describing what's seen in the image.
HTMLImageElement.currentSrc - Web APIs
html <img src="/files/16797/clock-demo-400px.png" alt="clock" srcset="/files/16
864/clock-demo-200px.png 200w, /files/16797/clock-demo-400px.png 400w" sizes="(max-width: 400px) 50%, 90%"> javascript var clockimage = document.queryselector("img"); let p = document.createelement("p"); if (!clockimage.currentsrc.endswith("200px.png")) { p.innertext = "using the 200px image."; } else { p.innertext = "using the 400px image!"; } document.body.appendchild(p); result ...
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetcurrentsrc experimentalchrome full support 45edge full support 13firefox full support 3
8 full support 3
8 no support 32 — 52disabled disabled from version 32 until version 52 (exclusive): this feature is behind the dom.image.srcset.enabled preference (needs to be set to true).
...upport noopera full support yessafari full support 10.1webview android full support 45chrome android full support 45firefox android full support 3
8 full support 3
8 no support 32 — 52disabled disabled from version 32 until version 52 (exclusive): this feature is behind the dom.image.srcset.enabled preference (needs to be set to true).
HTMLImageElement.lowSrc - Web APIs
there are a number of ways to achieve this; primary among them: higher compression levels (for example, a primary image saved as a jpeg using
85% quality might have a lowsrc version saved at 15%.
... reduced color depth; a primary image in 32-bit color might have an alternate image in
8-bit color.
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetlowsrcchrome full support 1edge full support ≤1
8firefox full support yesie ?
HTMLImageElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlimageelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f
8" 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">htmlimageelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor image() the image() constructor creates and returns a new htmlimageelement object representing an html <img> element which is not attached to any dom tree.
HTMLInputElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlinputelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f
8" 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">htmlinputelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties properties related to the parent form form read only htmlformelement object: returns a reference to the parent <form> element.
HTMLLIElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmllielement" target="_top"><rect x="361" y="65" width="130" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="426" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmllielement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLLabelElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmllabelelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f
8" 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">htmllabelelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLLegendElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmllegendelement" target="_top"><rect x="321" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmllegendelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLLinkElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmllinkelement" target="_top"><rect x="341" y="65" width="150" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="416" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmllinkelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement, and linkstyle.
HTMLMapElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlmapelement" target="_top"><rect x="351" y="65" width="140" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="421" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlmapelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLMenuElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlmenuelement" target="_top"><rect x="341" y="65" width="150" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="416" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlmenuelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} propertiesthis interface has no properties, but inherits properties from: htmlelementmethodsthis interface has no methods, but inherits methods from: htmlelement specifications specification status comment html living sta...
HTMLMenuItemElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlmenuitemelement" target="_top"><rect x="301" y="65" width="190" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlmenuitemelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} propertiesthis interface has no properties, but inherits properties from: htmlelementmethodsthis interface has no methods, but inherits methods from: htmlelement specifications specification status comment html 5.
HTMLMetaElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlmetaelement" target="_top"><rect x="341" y="65" width="150" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="416" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlmetaelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLMeterElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlmeterelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f
8" 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">htmlmeterelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties also inherits properties from its parent, htmlelement.
HTMLModElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlmodelement" target="_top"><rect x="351" y="65" width="140" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="421" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlmodelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLOListElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlolistelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f
8" 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">htmlolistelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLObjectElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlobjectelement" target="_top"><rect x="321" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlobjectelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLOptGroupElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmloptgroupelement" target="_top"><rect x="301" y="65" width="190" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmloptgroupelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLOptionElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmloptionelement" target="_top"><rect x="321" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmloptionelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLOutputElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmloutputelement" target="_top"><rect x="321" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmloutputelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent, htmlelement.
HTMLParagraphElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlparagraphelement" target="_top"><rect x="291" y="65" width="200" height="50" fill="#f4f7f
8" 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">htmlparagraphelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLParamElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlparamelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f
8" 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">htmlparamelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLPictureElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlpictureelement" target="_top"><rect x="311" y="65" width="1
80" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="401" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlpictureelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties no specific property, but inherits properties from its parent, htmlelement.
HTMLPreElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlpreelement" target="_top"><rect x="351" y="65" width="140" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="421" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlpreelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLProgressElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlprogresselement" target="_top"><rect x="301" y="65" width="190" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlprogresselement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLQuoteElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlquoteelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f
8" 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">htmlquoteelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLScriptElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlscriptelement" target="_top"><rect x="321" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlscriptelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLSelectElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlselectelement" target="_top"><rect x="321" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlselectelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface inherits the properties of htmlelement, and of element and node.
HTMLShadowElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlshadowelement" target="_top"><rect x="321" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlshadowelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface inherits the properties of htmlelement.
HTMLSourceElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlsourceelement" target="_top"><rect x="321" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlsourceelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLSpanElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlspanelement" target="_top"><rect x="341" y="65" width="150" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="416" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlspanelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface has no properties, but inherits properties from: htmlelement.
HTMLStyleElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlstyleelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f
8" 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">htmlstyleelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement, and implements linkstyle.
HTMLTableCaptionElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmltablecaptionelement" target="_top"><rect x="261" y="65" width="230" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="376" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmltablecaptionelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLTableCellElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmltablecellelement" target="_top"><rect x="291" y="65" width="200" height="50" fill="#f4f7f
8" 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">htmltablecellelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLTableColElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmltablecolelement" target="_top"><rect x="301" y="65" width="190" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmltablecolelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLTableElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmltableelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f
8" 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">htmltableelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLTableRowElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmltablerowelement" target="_top"><rect x="301" y="65" width="190" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmltablerowelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLTableSectionElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmltablesectionelement" target="_top"><rect x="261" y="65" width="230" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="376" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmltablesectionelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLTemplateElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmltemplateelement" target="_top"><rect x="301" y="65" width="190" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmltemplateelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface inherits the properties of htmlelement.
HTMLTimeElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmltimeelement" target="_top"><rect x="341" y="65" width="150" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="416" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmltimeelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLTitleElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmltitleelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f
8" 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">htmltitleelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLTrackElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmltrackelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f
8" 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">htmltrackelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLUListElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlulistelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#f4f7f
8" 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">htmlulistelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
HTMLUnknownElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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 xlink:href="/docs/web/api/htmlunknownelement" target="_top"><rect x="311" y="65" width="1
80" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="401" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlunknownelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties no specific property; inherits properties from its parent, htmlelement.
HTMLVideoElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlelement" target="_top"><rect x="3
81" 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...
..."90" x2="492" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlmediaelement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#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 xlink:href="/docs/web/api/htmlvideoelement" target="_top"><rect x="131" y="65" width="160" height="50" fill="#f4f7f
8" 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"...
IDBCursorWithValue - Web APIs
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="101" y1="25" x2="131" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/idbcursorwithvalue" target="_top"><rect x="131" y="1" width="1
80" height="50" fill="#f4f7f
8" 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.
... 25 full support 25 no support 25 — 57prefixed prefixed implemented with the vendor prefix: webkitfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support 1.5 full support 1.5 no support 1.5 — 7.0prefixed prefixed implemented with the vendor prefix: webkitvaluechrome full support 24 full support 24 ...
... 7webview android full support yeschrome android full support yesfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support yesavailable in workerschrome full support yesedge full support ≤1
8firefox full support 42ie ?
IDBRequest.error - Web APIs
in chrome 4
8+/firefox 5
8+ this property returns a domexception because domerror has been removed from the dom standard.
... 25 full support 25 no support 25 — 57prefixed prefixed implemented with the vendor prefix: webkitfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support 1.5 full support 1.5 no support 1.5 — 7.0prefixed prefixed implemented with the vendor prefix: webkitdomexception value instead of domerrorchrome full support 4
8edge full support ...
... ≤1
8firefox full support 5
8ie no support noopera full support yessafari no support nowebview android full support 4
8chrome android full support 4
8firefox android full support 5
8opera android full support yessafari ios no support nosamsung internet android full support 5.0legend full support...
IDBTransaction.error - Web APIs
in chrome 4
8+/firefox 5
8+ this property returns a domexception because domerror has been removed from the dom standard.
... 25 full support 25 no support 25 — 57prefixed prefixed implemented with the vendor prefix: webkitfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support 1.5 full support 1.5 no support 1.5 — 7.0prefixed prefixed implemented with the vendor prefix: webkitdomexception value instead of domerrorchrome full support 4
8edge full support ...
... ≤1
8firefox full support 5
8ie no support noopera full support yessafari no support nowebview android full support 4
8chrome android full support 4
8firefox android full support 5
8opera android full support yessafari ios no support nosamsung internet android full support 5.0legend full support...
ImageData() - Web APIs
syntax new imagedata(array, width [, height]); new imagedata(width, height); parameters array optional a uint
8clampedarray containing the underlying pixel representation of the image.
... let imagedata = new imagedata(200, 100); // imagedata { width: 200, height: 100, data: uint
8clampedarray[
80000] } initializing imagedata with an array this example instantiates an imagedata object with pixel colors defined by an array.
... const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); const arr = new uint
8clampedarray(40000); // iterate through every pixel for (let i = 0; i < arr.length; i += 4) { arr[i + 0] = 0; // r value arr[i + 1] = 190; // g value arr[i + 2] = 0; // b value arr[i + 3] = 255; // a value } // initialize a new imagedata object let imagedata = new imagedata(arr, 200); // draw image data to the canvas ctx.putimagedata(imagedata, 20, 20); result specification ...
Basic concepts - Web APIs
indexeddb used to have a competing spec, websql database, but the w3c deprecated it on november 1
8, 2010.
...for example, while an app or a page in http://www.example.com/app/ can retrieve data from http://www.example.com/dir/, because they have the same origin, it cannot retrieve data from http://www.example.com:
80
80/dir/ (different port) or https://www.example.com/dir/ (different protocol), because they have different origins.
...<iframe> content) can access the indexeddb store for the origin it is embedded into, unless the browser is set to never accept third party cookies (see bug 1147
821.) definitions this section defines and explains terms used in the indexeddb api.
Timing element visibility with the Intersection Observer API - Web APIs
articles each article is contained in an <article> element, styled like this: article { background-color: white; padding: 6px; } article:not(:last-child) { margin-bottom:
8px; } article h2 { margin-top: 0; } this creates article boxes with a white background which float atop the blue background, with a small margin around the article.
... every article which isn't the last item in the container has an
8px bottom margin to space things apart.
... .ad { height: 96px; padding: 6px; border-color: #555; border-style: solid; border-width: 1px; } .ad:not(:last-child) { margin-bottom:
8px; } .ad h2 { margin-top: 0; } .ad div { position: relative; float: right; padding: 0 4px; height: 20px; width: 120px; font-size: 14px; bottom: 30px; border: 1px solid black; background-color: rgba(255, 255, 255, 0.5); } there's nothing magic in here.
Intersection Observer API - Web APIs
140); border: 2px solid rgb(201, 126, 17); padding: 4px; margin-bottom: 6px; } #box1 { height: 200px; } #box2 { height: 75px; } #box3 { height: 150px; } #box4 { height: 100px; } .label { font: 14px "open sans", "arial", sans-serif; position: absolute; margin: 0; background-color: rgba(255, 255, 255, 0.7); border: 1px solid rgba(0, 0, 0, 0.7); width: 3em; height: 1
8px; padding: 2px; text-align: center; } .topleft { left: 2px; top: 2px; } .topright { right: 2px; top: 2px; } .bottomleft { bottom: 2px; left: 2px; } .bottomright { bottom: 2px; right: 2px; } let observers = []; startup = () => { let wrapper = document.queryselector(".wrapper"); // options for the observers let observeroptions = { root: null, rootmargin: ...
... let thresholdsets = [ [], [0.5], [0.0, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.
8, 0.9, 1.0], [0, 0.25, 0.5, 0.75, 1.0] ]; for (let i=0; i<=1.0; i+= 0.01) { thresholdsets[0].push(i); } // add each box, creating a new observer for each for (let i=0; i<4; i++) { let template = document.queryselector("#boxtemplate").content.clonenode(true); let boxid = "box" + (i+1); template.queryselector(".samplebox").id = boxid; wrapper.appendchild(document.importnode(template, true)); // set up the observer for this box observeroptions...
...the result, given the default value of numsteps (20), is the following list of thresholds: # ratio # ratio 1 0.05 11 0.55 2 0.1 12 0.6 3 0.15 13 0.65 4 0.2 14 0.7 5 0.25 15 0.75 6 0.3 16 0.
8 7 0.35 17 0.
85
8 0.4 1
8 0.9 9 0.45 19 0.95 10 0.5 20 1.0 we could, of course, hard-code the array of thresholds into our code, and often that's what you'll end up doing.
KeyboardEvent - Web APIs
k; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/uievent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#fff" ...
...t-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 xlink:href="/docs/web/api/keyboardevent" target="_top"><rect x="231" y="1" width="130" height="50" fill="#f4f7f
8" 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">keyboardevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor keyboardevent() creates a new keyboardevent object.
...in certain older versions of firefox, this key generated a keypress event; this inconsistent behavior was bug 602
812.
MediaStreamTrack.applyConstraints() - Web APIs
it specifies that the page or web app needs a width between 640 and 12
80 and a height between 4
80 and 720, with the later number in each pair being preferred.
... the advanced property further specifies that an image size of 1920 by 12
80 is the preferred or an aspect ratio of 1.333 if that is not available.
... const constraints = { width: {min: 640, ideal: 12
80}, height: {min: 4
80, ideal: 720}, advanced: [ {width: 1920, height: 12
80}, {aspectratio: 1.333} ] }; navigator.mediadevices.getusermedia({ video: true }) .then(mediastream => { const track = mediastream.getvideotracks()[0]; track.applyconstraints(constraints) .then(() => { // do something with the track such as using the image capture api.
Recording a media element - Web APIs
lines 1
8-22 these lines create a new promise which is fulfilled when both of the two promises (stopped and recorded) have resolved.
...then, in line
8, we arrange for preview.capturestream() to call preview.mozcapturestream() so that our code will work on firefox, on which the mediarecorder.capturestream() method is prefixed.
... lines 17-1
8 the size and type of the recorded media are output to the log area below the two videos and the download button.
MediaTrackSettings.sampleSize - Web APIs
other common sample sizes are
8 (for reduced bandwidth requirements) and 24 (for high-resolution professional audio).
...that means that a given sample actually uses (samplesize/
8)*channelcount bytes of data.
... for example, 16-bit stereo audio requires (16/
8)*2 or 4 bytes per sample.
Using the Media Capabilities API - Web APIs
const videoconfiguration = { type: "file", video: { contenttype: "video/webm;codecs=vp
8", width:
800, height: 600, bitrate: 10000, framerate: 15 } }; had we been querying the decodability of an audio file, we would create an audio configuration including the number of channels and sample rate, leaving out the properties that apply only to video—namely, the dimensions and the frame rate: const audioconfiguration = { type: "file", audio: { co...
...d') ).catch(error => console.log('it failed: ' + error) ); media capabilities live example css li { margin : 1em; } html <form> <p>select your video configuration and find out if this browser supports the codec, and whether decoding will be smooth and power efficient:</p> <ul> <li> <label for="codec">select a codec</label> <select id="codec"> <option>video/webm; codecs=vp
8</option> <option>video/webm; codecs=vp9</option> <option>video/mp4; codecs=avc1</option> <option>video/mp4; codecs=avc1.420034</option> <option>video/ogg; codecs=theora</option> <option>invalid</option> </select> </li> <li> <label for="size">select a size</label> <select id="size"> <option>76
80x4320</option> <option>3
840x2160</option> ...
... <option>2560x1440</option> <option>1920x10
80</option> <option>12
80x720</option> <option selected>
800x600</option> <option>640x4
80</option> <option>320x240</option> <option value=" x ">none</option> </select> </li> <li> <label for="framerate">select a framerate</label> <select id="framerate"> <option>60</option> <option>50</option> <option>30</option> <option>24</option> <option selected>15</option> </select> </li> <li> <label for="bitrate">select a bitrate</label> <select id="bitrate"> <option>4000</option> <option>2500</option> <option>
800</option> </select> </li> </ul> <p><input type="button" value="test this video configuration" id="tryit"></p> </form> <ul id...
NodeIterator.whatToShow - Web APIs
nodefilter.show_cdata_section
8 shows cdatasection nodes.
... nodefilter.show_comment 12
8 shows comment nodes.
... nodefilter.show_notation 204
8 shows notation nodes.
NodeIterator - Web APIs
nodefilter.show_cdata_section
8 shows cdatasection nodes.
... nodefilter.show_comment 12
8 shows comment nodes.
... nodefilter.show_notation 204
8 shows notation nodes.
RTCIceCandidate.candidate - Web APIs
for an a-line (attribute line) that looks like this: a=candidate:4234997325 1 udp 204327
8322 192.16
8.0.56 44323 typ host the corresponding candidate string's value will be "candidate:4234997325 1 udp 204327
8322 192.16
8.0.56 44323 typ host".
...in the example above, the priority is 204327
8322.
...the complete list of attributes for this example candidate is: foundation = 4234997325 component = "rtp" (the number 1 is encoded to this string; 2 becomes "rtcp") protocol = "udp" priority = 204327
8322 ip = "192.16
8.0.56" port = 44323 type = "host" example in this example, we see a function which receives as input an sdp string containing an ice candidate received from the remote peer during the signaling process.
RTCIceCandidateInit.candidate - Web APIs
for an a-line (attribute line) that looks like this: a=candidate:4234997325 1 udp 204327
8322 192.16
8.0.56 44323 typ host the corresponding candidate string's value will be "candidate:4234997325 1 udp 204327
8322 192.16
8.0.56 44323 typ host".
...in the example above, the priority is 204327
8322.
...the complete list of attributes for this example candidate is: foundation = 4234997325 component = "rtp" (the number 1 is encoded to this string; 2 becomes "rtcp") protocol = "udp" priority = 204327
8322 ip = "192.16
8.0.56" port = 44323 type = "host" example when a new ice candidate is received by your signaling code from the remote peer, you need to construct the rtcicecandidate object that encapsulates it.
RsaHashedKeyGenParams - Web APIs
this should be at least 204
8: see for example see nist sp
800-131a rev.
... publicexponent a uint
8array.
...you can pass any of sha-256, sha-3
84, or sha-512 here.
SVGAnimateElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink: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="3
86" 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 2
81,
84 2
81,94 291,
89" stroke="#d4dde4" fill="none"/><line x1="2
81" y1="
89" x2="251" y2="
89" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svganimateelement" target="_top"><rect x="
81" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="166" y="94" font...
SVGAnimateMotionElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink: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="3
86" 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 2
81,
84 2
81,94 291,
89" stroke="#d4dde4" fill="none"/><line x1="2
81" y1="
89" x2="251" y2="
89" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svganimatemotionelement" target="_top"><rect x="21" y="65" width="230" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="136" y="94...
SVGAnimateTransformElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink: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="3
86" 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 2
81,
84 2
81,94 291,
89" stroke="#d4dde4" fill="none"/><line x1="2
81" y1="
89" x2="251" y2="
89" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svganimatetransformelement" target="_top"><rect x="-9" y="65" width="260" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="121" y=...
SVGAnimationElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svganimationelement" target="_top"><rect x="291" y="65" width="190" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="3
86" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svganimationelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent, svgelement.
SVGClipPathElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgclippathelement" target="_top"><rect x="301" y="65" width="1
80" height="50" fill="#f4f7f
8" 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">svgclippathelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent, svgelement.
SVGComponentTransferFunctionElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgcomponenttransferfunctionelement" target="_top"><rect x="131" y="65" width="350" height="50" fill="#f4f7f
8" 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></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constants name value description svg_fecomponenttransfer_type_unknown 0 the type is not one of predefined types.
SVGCursorElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgcursorelement" target="_top"><rect x="321" y="65" width="160" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="401" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgcursorelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent, svgelement, and implements properties from svgurireference.
SVGDefsElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svgdefselement" target="_top"><rect x="121" y="65" width="140" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="191" y="94" font-siz...
SVGDescElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgdescelement" target="_top"><rect x="341" y="65" width="140" height="50" fill="#f4f7f
8" 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">svgdescelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent, svggeometryelement.
SVGFEBlendElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfeblendelement" target="_top"><rect x="311" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfeblendelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constants name value description svg_feblend_mode_unknown 0 the type is not one of predefined types.
SVGFEColorMatrixElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfecolormatrixelement" target="_top"><rect x="251" y="65" width="230" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="366" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfecolormatrixelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constants name value description svg_fecolormatrix_type_unknown 0 the type is not one of predefined types.
SVGFEComponentTransferElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfecomponenttransferelement" target="_top"><rect x="191" y="65" width="290" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="336" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfecomponenttransferelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent interface, svgelement, and implements properties of svgfilterprimitivestandardattributes.
SVGFECompositeElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfecompositeelement" target="_top"><rect x="271" y="65" width="210" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="376" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfecompositeelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constants name value description svg_fecomposite_operator_unknown 0 the type is not one of predefined types.
SVGFEConvolveMatrixElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfeconvolvematrixelement" target="_top"><rect x="221" y="65" width="260" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="351" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfeconvolvematrixelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constants name value description svg_edgemode_unknown 0 the type is not one of predefined types.
SVGFEDiffuseLightingElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfediffuselightingelement" target="_top"><rect x="211" y="65" width="270" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="346" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfediffuselightingelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent interface, svgelement, and also implements properties of svgfilterprimitivestandardattributes.
SVGFEDisplacementMapElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfedisplacementmapelement" target="_top"><rect x="211" y="65" width="270" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="346" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfedisplacementmapelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constants name value description svg_channel_unknown 0 the type is not one of predefined types.
SVGFEDistantLightElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfedistantlightelement" target="_top"><rect x="241" y="65" width="240" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="361" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfedistantlightelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent interface, svgelement.
SVGFEDropShadowElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfedropshadowelement" target="_top"><rect x="261" y="65" width="220" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="371" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfedropshadowelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent interface, svgelement, and also implements properties of svgfilterprimitivestandardattributes.
SVGFEFloodElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfefloodelement" target="_top"><rect x="311" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfefloodelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface doesn't implement any specific properties, but inherits properties from its parent interface, svgelement, and implements properties from svgfilterprimitivestandardattributes.
SVGFEFuncAElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgcomponenttransferfunctionelement" target="_top"><rect x="131" y="65" width="350" height="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 xlink:href="/docs/web/api/svgfefuncaelement" target="_top"><rect x="-79" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2...
SVGFEFuncBElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgcomponenttransferfunctionelement" target="_top"><rect x="131" y="65" width="350" height="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 xlink:href="/docs/web/api/svgfefuncbelement" target="_top"><rect x="-79" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2...
SVGFEFuncGElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgcomponenttransferfunctionelement" target="_top"><rect x="131" y="65" width="350" height="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 xlink:href="/docs/web/api/svgfefuncgelement" target="_top"><rect x="-79" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2...
SVGFEFuncRElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgcomponenttransferfunctionelement" target="_top"><rect x="131" y="65" width="350" height="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 xlink:href="/docs/web/api/svgfefuncrelement" target="_top"><rect x="-79" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2...
SVGFEGaussianBlurElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfegaussianblurelement" target="_top"><rect x="241" y="65" width="240" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="361" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfegaussianblurelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constants name value description svg_edgemode_unknown 0 the type is not one of predefined types.
SVGFEImageElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfeimageelement" target="_top"><rect x="311" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfeimageelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent interface, svgelement, and implements properties of svgfilterprimitivestandardattributes and svgurireference.
SVGFEMergeElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfemergeelement" target="_top"><rect x="311" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfemergeelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface not provide any specific properties, but inherits properties from its parent interface, svgelement, and also implements properties of svgfilterprimitivestandardattributes.
SVGFEMergeNodeElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfemergenodeelement" target="_top"><rect x="271" y="65" width="210" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="376" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfemergenodeelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent interface, svgelement.
SVGFEMorphologyElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfemorphologyelement" target="_top"><rect x="261" y="65" width="220" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="371" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfemorphologyelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constants name value description svg_morphology_operator_unknown 0 the type is not one of predefined types.
SVGFEOffsetElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfeoffsetelement" target="_top"><rect x="301" y="65" width="1
80" height="50" fill="#f4f7f
8" 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">svgfeoffsetelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent interface, svgelement, and also implements properties of svgfilterprimitivestandardattributes.
SVGFEPointLightElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfepointlightelement" target="_top"><rect x="261" y="65" width="220" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="371" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfepointlightelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent interface, svgelement.
SVGFESpecularLightingElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfespecularlightingelement" target="_top"><rect x="201" y="65" width="2
80" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="341" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfespecularlightingelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent interface, svgelement, and also implements properties of svgfilterprimitivestandardattributes.
SVGFESpotLightElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfespotlightelement" target="_top"><rect x="271" y="65" width="210" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="376" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfespotlightelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent interface, svgelement.
SVGFETileElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfetileelement" target="_top"><rect x="321" y="65" width="160" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="401" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfetileelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent interface, svgelement, and also implements properties of svgfilterprimitivestandardattributes.
SVGFETurbulenceElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfeturbulenceelement" target="_top"><rect x="261" y="65" width="220" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="371" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfeturbulenceelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constants turbulence types name value description svg_turbulence_type_unknown 0 the type is not one of predefined types.
SVGFilterElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfilterelement" target="_top"><rect x="321" y="65" width="160" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="401" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfilterelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties svgfilterelement.filterunits read only an svganimatedenumeration that corresponds to the filterunits attribute of the given <filter> element.
SVGForeignObjectElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svgforeignobjectelement" target="_top"><rect x="31" y="65" width="230" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="146" y="94" ...
SVGGElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svggelement" target="_top"><rect x="151" y="65" width="110" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="206" y="94" font-size="...
SVGGeometryElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svggeometryelement" target="_top"><rect x="
81" y="65" width="1
80" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="171" y="94" font-...
SVGGradientElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggradientelement" target="_top"><rect x="301" y="65" width="1
80" height="50" fill="#f4f7f
8" 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></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constants name value description svg_spreadmethod_unknown 0 the type is not one of predefined types.
SVGGraphicsElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" height="50" fill="#f4f7f
8" 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></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} note: this interface was introduced in svg 2 and replaces the svglocatable and svgtransformable interfaces from svg 1.1.
SVGImageElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svgimageelement" target="_top"><rect x="111" y="65" width="150" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="1
86" y="94" font-si...
SVGLinearGradientElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggradientelement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svglineargradientelement" target="_top"><rect x="21" y="65" width="240" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="141" y="94"...
SVGMPathElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgmpathelement" target="_top"><rect x="331" y="65" width="150" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgmpathelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface doesn't implement any specific properties, but inherits properties from its parent interface, svgelement.
SVGMaskElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgmaskelement" target="_top"><rect x="341" y="65" width="140" height="50" fill="#f4f7f
8" 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">svgmaskelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent, svgelement.
SVGMetadataElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgmetadataelement" target="_top"><rect x="301" y="65" width="1
80" height="50" fill="#f4f7f
8" 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">svgmetadataelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface doesn't implement any specific properties, but inherits properties from its parent interface, svgelement.
SVGPatternElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgpatternelement" target="_top"><rect x="311" y="65" width="170" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgpatternelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent, svgelement and implements the ones from svgfittoviewbox and svgurireference.
SVGPreserveAspectRatio - Web APIs
constants svg_preserveaspectratio_unknown = 0 svg_preserveaspectratio_none = 1 svg_preserveaspectratio_xminymin = 2 svg_preserveaspectratio_xmidymin = 3 svg_preserveaspectratio_xmaxymin = 4 svg_preserveaspectratio_xminymid = 5 svg_preserveaspectratio_xmidymid = 6 svg_preserveaspectratio_xmaxymid = 7 svg_preserveaspectratio_xminymax =
8 svg_preserveaspectratio_xmidymax = 9 svg_preserveaspectratio_xmaxymax = 10 svg_meetorslice_unknown = 0 svg_meetorslice_meet = 1 svg_meetorslice_slice = 2 normative document svg 1.1 (2nd edition) constants name value description svg_preserveaspectratio_unknown 0 the enumeration was set to a value that is...
... svg_preserveaspectratio_xminymax
8 corresponds to value xminymax for attribute preserveaspectratio.
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetsvgpreserveaspectratiochrome full support yesedge full support ≤1
8firefox full support yesie ?
SVGRadialGradientElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggradientelement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svgradialgradientelement" target="_top"><rect x="21" y="65" width="240" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="141" y="94"...
SVGScriptElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgscriptelement" target="_top"><rect x="321" y="65" width="160" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="401" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgscriptelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties svgscriptelement.type read only a domstring corresponding to the type attribute of the given <script> element.
SVGSetElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink: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="3
86" 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 2
81,
84 2
81,94 291,
89" stroke="#d4dde4" fill="none"/><line x1="2
81" y1="
89" x2="251" y2="
89" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgsetelement" target="_top"><rect x="121" y="65" width="130" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="1
86" y="94" font-si...
SVGStopElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgstopelement" target="_top"><rect x="341" y="65" width="140" height="50" fill="#f4f7f
8" 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">svgstopelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent interface, svgelement.
SVGStyleElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgstyleelement" target="_top"><rect x="331" y="65" width="150" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgstyleelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface also inherits properties from its parent interface, svgelement and implements properties from linkstyle.
SVGSwitchElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svgswitchelement" target="_top"><rect x="101" y="65" width="160" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="1
81" y="94" font-s...
SVGSymbolElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgsymbolelement" target="_top"><rect x="321" y="65" width="160" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="401" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgsymbolelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface doesn't implement any specific properties, but inherits properties from its parent interface, svggraphicselement, and implements properties from svgfittoviewbox.
SVGTextContentElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svgtextcontentelement" target="_top"><rect x="51" y="65" width="210" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="156" y="94" fo...
SVGTitleElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgtitleelement" target="_top"><rect x="331" y="65" width="150" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgtitleelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface doesn't implement any specific properties, but inherits properties from its parent interface, svgelement.
SVGTransformList - Web APIs
<svg id="my-svg" viewbox="0 0 300 2
80" xmlns="http://www.w3.org/2000/svg" version="1.1"> <desc>example showing how to transform svg elements that using svgtransform objects</desc> <script type="application/ecmascript"> <![cdata[ function transformme(evt) { // svg root element to access the createsvgtransform() function var svgroot = evt.target.parentnode; // svgtransformlist of the element that has be...
...en clicked on var tfmlist = evt.target.transform.baseval; // create a seperate transform object for each transform var translate = svgroot.createsvgtransform(); translate.settranslate(50,5); var rotate = svgroot.createsvgtransform(); rotate.setrotate(10,0,0); var scale = svgroot.createsvgtransform(); scale.setscale(0.
8,0.
8); // apply the transformations by appending the svgtranform objects to the svgtransformlist associated with the element tfmlist.appenditem(translate); tfmlist.appenditem(rotate); tfmlist.appenditem(scale); } ]]> </script> <polygon fill="orange" stroke="black" stroke-width="5" points="100,225 100,115 130,115 70,15 70,15 10,115 40,115 40,225" onclick="transformme(evt)"...
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetsvgtransformlistchrome full support yesedge full support ≤1
8firefox full support yesie ?
SVGUseElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" 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="4
81,25 491,20 491,30 4
81,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="4
82" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svggraphicselement" target="_top"><rect x="301" y="65" width="1
80" 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 xlink:href="/docs/web/api/svguseelement" target="_top"><rect x="131" y="65" width="130" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="196" y="94" font-size...
Screen.lockOrientation() - Web APIs
a screen is considered in its secondary portrait mode if the device is held 1
80° from its normal position and that position is in portrait, or if the normal position of the device is in landscape and the device held is turned by 90° anticlockwise.
...a screen is considered in its secondary landscape mode if the device held is 1
80° from its normal position and that position is in landscape, or if the normal position of the device is in portrait and the device held is turned by 90° anticlockwise.
...for example, if the panel resolution is 12
80*
800, default will make it landscape, if the resolution is
800*12
80, default will make it to portrait.
Using the Screen Capture API - Web APIs
the video is given a border, and its width is set to occupy nearly the entire available horizontal space (width: 9
8%).
... max-width is set to
860px to set an absolute upper limit on the video's size, the error, warn, and info classes are used to style the corresponding console output types.
... #video { border: 1px solid #999; width: 9
8%; max-width:
860px; } .error { color: red; } .warn { color: orange; } .info { color: darkgreen; } result the final product looks like this.
SubtleCrypto.deriveBits() - Web APIs
async function derivesharedsecret(privatekey, publickey) { const sharedsecret = await window.crypto.subtle.derivebits( { name: "ecdh", namedcurve: "p-3
84", public: publickey }, privatekey, 12
8 ); const buffer = new uint
8array(sharedsecret, 0, 5); const sharedsecretvalue = document.queryselector(".ecdh .derived-bits-value"); sharedsecretvalue.classlist.add("fade-in"); sharedsecretvalue.addeventlistener("animationend", () => { sharedsecretvalue.classlist.remove("fade-in"); }); sharedsecretvalue.textcontent = `${...
...buffer}...[${sharedsecret.bytelength} bytes total]`; } // generate 2 ecdh key pairs: one for alice and one for bob // in more normal usage, they would generate their key pairs // separately and exchange public keys securely const generatealiceskeypair = window.crypto.subtle.generatekey( { name: "ecdh", namedcurve: "p-3
84" }, false, ["derivebits"] ); const generatebobskeypair = window.crypto.subtle.generatekey( { name: "ecdh", namedcurve: "p-3
84" }, false, ["derivebits"] ); promise.all([generatealiceskeypair, generatebobskeypair]).then(values => { const aliceskeypair = values[0]; const bobskeypair = values[1]; const derivebitsbutton = document.queryselector(".ecdh .derive-bits-button"); derivebitsbutton.addeventlistener("click", () => { // alic...
...*/ async function getderivedbits() { const keymaterial = await getkeymaterial(); salt = window.crypto.getrandomvalues(new uint
8array(16)); const derivedbits = await window.crypto.subtle.derivebits( { "name": "pbkdf2", salt: salt, "iterations": 100000, "hash": "sha-256" }, keymaterial, 256 ); const buffer = new uint
8array(derivedbits, 0, 5); const derivedbitsvalue = document.queryselector(".pbkdf2 .derived-bits-value"); derivedbitsvalue.classlist.add("fade-in"); derivedb...
SubtleCrypto.deriveKey() - Web APIs
hkdf is specified in rfc 5
869.
... pbkdf2 is specified in rfc 2
89
8.
...m", length: 256 }, false, ["encrypt", "decrypt"] ); } async function agreesharedsecretkey() { // generate 2 ecdh key pairs: one for alice and one for bob // in more normal usage, they would generate their key pairs // separately and exchange public keys securely let aliceskeypair = await window.crypto.subtle.generatekey( { name: "ecdh", namedcurve: "p-3
84" }, false, ["derivekey"] ); let bobskeypair = await window.crypto.subtle.generatekey( { name: "ecdh", namedcurve: "p-3
84" }, false, ["derivekey"] ); // alice then generates a secret key using her private key and bob's public key.
SubtleCrypto.sign() - Web APIs
ecdsa ecdsa (elliptic curve digital signature algorithm) is a variant of the digital signature algorithm, specified in fips-1
86, that uses elliptic curve cryptography (rfc 6090).
... hmac the hmac algorithm calculates and verifies hash-based message authentication codes according to the fips 19
8-1 standard.
...*/ function getmessageencoding() { const messagebox = document.queryselector(".ecdsa #message"); let message = messagebox.value; let enc = new textencoder(); return enc.encode(message); } let encoded = getmessageencoding(); let signature = await window.crypto.subtle.sign( { name: "ecdsa", hash: {name: "sha-3
84"}, }, privatekey, encoded ); hmac this code fetches the contents of a text box, encodes it for signing, and signs it with a secret key.
TextDecoder.prototype.encoding - Web APIs
it can be one of the following values: the recommended encoding for the web: 'utf-
8'.
... the legacy single-byte encodings: 'ibm
866', 'iso-
8859-2', 'iso-
8859-3', 'iso-
8859-4', 'iso-
8859-5', 'iso-
8859-6', 'iso-
8859-7', 'iso-
8859-
8'', 'iso-
8859-
8i', 'iso-
8859-10', 'iso-
8859-13', 'iso-
8859-14', 'iso-
8859-15', 'iso-
8859-16', 'koi
8-r', 'koi
8-u', 'macintosh', 'windows-
874', 'windows-1250', 'windows-1251', 'windows-1252', 'windows-1253', 'windows-1254', 'windows-1255', 'windows-1256', 'windows-1257', 'windows-125
8', or 'x-mac-cyrillic'.
... the legacy multi-byte chinese (simplified) encodings: 'gbk', 'gb1
8030', and 'hz-gb-2312'.
TreeWalker.whatToShow - Web APIs
nodefilter.show_cdata_section
8 shows cdatasection nodes.
... nodefilter.show_comment 12
8 shows comment nodes.
... nodefilter.show_notation 204
8 shows notation nodes.
TreeWalker - Web APIs
nodefilter.show_cdata_section
8 shows cdatasection nodes.
... nodefilter.show_comment 12
8 shows comment nodes.
... nodefilter.show_notation 204
8 shows notation nodes.
WEBGL_depth_texture - Web APIs
the constant in webgl2 is gl.unsigned_int_24_
8.
... constants this extension adds a new constant: ext.unsigned_int_24_
8_webgl unsigned integer type for 24-bit depth texture data.
... the type parameter now accepts gl.unsigned_short, gl.unsigned_int, and ext.unsigned_int_24_
8_webgl.
WebGL2RenderingContext.texStorage2D() - Web APIs
possible values: gl.r
8 gl.r16f gl.r32f gl.r
8ui gl.rg
8 gl.rg16f gl.rg32f gl.rg
8ui gl.rgb
8 gl.srgb
8 gl.rgb565 gl.r11f_g11f_b10f gl.rgb9_e5 gl.rgb16f gl.rgb32f gl.rgb
8ui gl.rgba
8 gl.srgb
8_aplha
8 gl.rgb5_a1 gl.rgba4 gl.rgba16f gl.rgba32f gl.rgba
8ui unlike opengl 3.0, webgl 2 doesn't support the following etc2 and eac compressed texture formats (see section 5.37 in the webgl 2...
... gl.compressed_r11_eac gl.compressed_signed_r11_eac gl.compressed_rg11_eac gl.compressed_signed_rg11_eac gl.compressed_rgb
8_etc2 gl.compressed_rgba
8_etc2_eac gl.compressed_srgb
8_etc2 gl.compressed_srgb
8_alpha
8_etc2_eac gl.compressed_rgb
8_punchthrough_alpha1_etc2 gl.compressed_srgb
8_punchthrough_alpha1_etc2 width a glsizei specifying the width of the texture.
... examples gl.texstorage2d(gl.texture_2d, 1, gl.rgb
8, 256, 256); specifications specification status comment webgl 2.0the definition of 'texstorage2d' in that specification.
WebGL2RenderingContext.texStorage3D() - Web APIs
possible values: gl.r
8 gl.r16f gl.r32f gl.r
8ui gl.rg
8 gl.rg16f gl.rg32f gl.rgui gl.rgb
8 gl.srgb
8 gl.rgb565 gl.r11f_g11f_b10f gl.rgb9_e5 gl.rgb16f gl.rgb32f gl.rgb
8ui gl.rgba
8 gl.srgb_aplha
8 gl.rgb5_a1 gl.rgba4444 gl.rgba16f gl.rgba32f gl.rgba
8ui gl.compressed_r11_eac gl.compressed_signed_r11_eac gl.compressed_rg11_eac gl.compressed_signed_rg11_eac gl.compressed_rgb
8...
..._etc2 gl.compressed_rgba
8_etc2_eac gl.compressed_srgb
8_etc2 gl.compressed_srgb
8_alpha
8_etc2_eac gl.compressed_rgb
8_punchthrough_alpha1_etc2 gl.compressed_srgb
8_punchthrough_alpha1_etc2 width a glsizei specifying the width of the texture.
... examples gl.texstorage3d(gl.texture_3d, 1, gl.rgb
8, 256, 256, 256); specifications specification status comment webgl 2.0the definition of 'texstorage3d' in that specification.
WebGL2RenderingContext.texSubImage3D() - Web APIs
gl.r
8 gl.r16f gl.r32f gl.r
8ui gl.rg
8 gl.rg16f gl.rg32f gl.rgui gl.rgb
8 gl.srgb
8 gl.rgb565 gl.r11f_g11f_b10f gl.rgb9_e5 gl.rgb16f gl.rgb32f gl.rgb
8ui gl.rgba
8 gl.srgb_aplha
8 gl.rgb5_a1 gl.rgba4444 gl.rgba16f gl.rgba32f gl.rgba
8ui type a glenum specifying the data type of the texel data.
... possible values: gl.unsigned_byte:
8 bits per channel for gl.rgba gl.unsigned_short_5_6_5: 5 red bits, 6 green bits, 5 blue bits.
... gl.byte gl.unsigned_short gl.short gl.unsigned_int gl.int gl.half_float gl.float gl.unsigned_int_2_10_10_10_rev gl.unsigned_int_10f_11f_11f_rev gl.unsigned_int_5_9_9_9_rev gl.unsigned_int_24_
8 gl.float_32_unsigned_int_24_
8_rev (pixels must be null) pixels one of the following objects can be used as a pixel source for the texture: arraybufferview, a uint
8array must be used if type is gl.unsigned_byte.
WebGLRenderingContext.compressedTexImage[23]D() - Web APIs
extension: ext.compressed_srgb_s3tc_dxt1_ext ext.compressed_srgb_alpha_s3tc_dxt1_ext ext.compressed_srgb_alpha_s3tc_dxt3_ext ext.compressed_srgb_alpha_s3tc_dxt5_ext when using the webgl_compressed_texture_etc extension: ext.compressed_r11_eac ext.compressed_signed_r11_eac ext.compressed_rg11_eac ext.compressed_signed_rg11_eac ext.compressed_rgb
8_etc2 ext.compressed_rgba
8_etc2_eac ext.compressed_srgb
8_etc2 ext.compressed_srgb
8_alpha
8_etc2_eac ext.compressed_rgb
8_punchthrough_alpha1_etc2 ext.compressed_srgb
8_punchthrough_alpha1_etc2 when using the webgl_compressed_texture_pvrtc extension: ext.compressed_rgb_pvrtc_4bppv1_img ext.compressed_rgba_pvrtc_4bppv1_img ext.compressed_rgb_pvrtc_2bppv1_img...
...ssed_texture_etc1 extension: ext.compressed_rgb_etc1_webgl when using the webgl_compressed_texture_atc extension: ext.compressed_rgb_atc_webgl ext.compressed_rgba_atc_explicit_alpha_webgl ext.compressed_rgba_atc_interpolated_alpha_webgl when using the webgl_compressed_texture_astc extension: ext.compressed_rgba_astc_4x4_khr ext.compressed_srgb
8_alpha
8_astc_4x4_khr ext.compressed_rgba_astc_5x4_khr ext.compressed_srgb
8_alpha
8_astc_5x4_khr ext.compressed_rgba_astc_5x5_khr ext.compressed_srgb
8_alpha
8_astc_5x5_khr ext.compressed_rgba_astc_6x5_khr ext.compressed_srgb
8_alpha
8_astc_6x5_khr ext.compressed_rgba_astc_6x6_khr ext.compressed_srgb
8_alpha
8_astc_6x6_khr ext.compressed_rgba_astc_
8x5_khr ext.c...
...ompressed_srgb
8_alpha
8_astc_
8x5_khr ext.compressed_rgba_astc_
8x6_khr ext.compressed_srgb
8_alpha
8_astc_
8x6_khr ext.compressed_rgba_astc_
8x
8_khr ext.compressed_srgb
8_alpha
8_astc_
8x
8_khr ext.compressed_rgba_astc_10x5_khr ext.compressed_srgb
8_alpha
8_astc_10x5_khr ext.compressed_rgba_astc_10x6_khr ext.compressed_srgb
8_alpha
8_astc_10x6_khr ext.compressed_rgba_astc_10x10_khr ext.compressed_srgb
8_alpha
8_astc_10x10_khr ext.compressed_rgba_astc_12x10_khr ext.compressed_srgb
8_alpha
8_astc_12x10_khr ext.compressed_rgba_astc_12x12_khr ext.compressed_srgb
8_alpha
8_astc_12x12_khr when using the ext_texture_compression_bptc extension: ext.compressed_rgba_bptc_unorm_ext ext.compressed_srgb_alpha_bptc_unorm_ext ext.compress...
WebGLRenderingContext.compressedTexSubImage2D() - Web APIs
extension: ext.compressed_srgb_s3tc_dxt1_ext ext.compressed_srgb_alpha_s3tc_dxt1_ext ext.compressed_srgb_alpha_s3tc_dxt3_ext ext.compressed_srgb_alpha_s3tc_dxt5_ext when using the webgl_compressed_texture_etc extension: ext.compressed_r11_eac ext.compressed_signed_r11_eac ext.compressed_rg11_eac ext.compressed_signed_rg11_eac ext.compressed_rgb
8_etc2 ext.compressed_rgba
8_etc2_eac ext.compressed_srgb
8_etc2 ext.compressed_srgb
8_alpha
8_etc2_eac ext.compressed_rgb
8_punchthrough_alpha1_etc2 ext.compressed_srgb
8_punchthrough_alpha1_etc2 when using the webgl_compressed_texture_pvrtc extension: ext.compressed_rgb_pvrtc_4bppv1_img ext.compressed_rgba_pvrtc_4bppv1_img ext.compressed_rgb_pvrtc_2bppv1_img...
... ext.compressed_rgba_pvrtc_2bppv1_img when using the webgl_compressed_texture_atc extension: ext.compressed_rgb_atc_webgl ext.compressed_rgba_atc_explicit_alpha_webgl ext.compressed_rgba_atc_interpolated_alpha_webgl when using the webgl_compressed_texture_astc extension: ext.compressed_rgba_astc_4x4_khr ext.compressed_srgb
8_alpha
8_astc_4x4_khr ext.compressed_rgba_astc_5x4_khr ext.compressed_srgb
8_alpha
8_astc_5x4_khr ext.compressed_rgba_astc_5x5_khr ext.compressed_srgb
8_alpha
8_astc_5x5_khr ext.compressed_rgba_astc_6x5_khr ext.compressed_srgb
8_alpha
8_astc_6x5_khr ext.compressed_rgba_astc_6x6_khr ext.compressed_srgb
8_alpha
8_astc_6x6_khr ext.compressed_rgba_astc_
8x5_khr ext.compressed_srgb
8_alpha
8_as...
...tc_
8x5_khr ext.compressed_rgba_astc_
8x6_khr ext.compressed_srgb
8_alpha
8_astc_
8x6_khr ext.compressed_rgba_astc_
8x
8_khr ext.compressed_srgb
8_alpha
8_astc_
8x
8_khr ext.compressed_rgba_astc_10x5_khr ext.compressed_srgb
8_alpha
8_astc_10x5_khr ext.compressed_rgba_astc_10x6_khr ext.compressed_srgb
8_alpha
8_astc_10x6_khr ext.compressed_rgba_astc_10x6_khr ext.compressed_srgb
8_alpha
8_astc_10x6_khr ext.compressed_rgba_astc_10x10_khr ext.compressed_srgb
8_alpha
8_astc_10x10_khr ext.compressed_rgba_astc_12x10_khr ext.compressed_srgb
8_alpha
8_astc_12x10_khr ext.compressed_rgba_astc_12x12_khr ext.compressed_srgb
8_alpha
8_astc_12x12_khr when using the ext_texture_compression_bptc extension: ext.compressed_rgba_bptc_unorm_ext ...
WebGLRenderingContext.renderbufferStorage() - Web APIs
gl.stencil_index
8:
8 stencil bits.
... gl.depth_stencil when using a webgl 2 context, the following values are available additionally: gl.r
8 gl.r
8ui gl.r
8i gl.r16ui gl.r16i gl.r32ui gl.r32i gl.rg
8 gl.rg
8ui gl.rg
8i gl.rg16ui gl.rg16i gl.rg32ui gl.rg32i gl.rgb
8 gl.rgba
8 gl.srgb
8_alpha
8 (also available as an extension for webgl 1, see below) gl.rgb10_a2 gl.rgba
8ui gl.rgba
8i gl.rgb10_a2ui gl.rgba16ui gl.rgba16i gl.rgba32i gl.rgba32ui gl.depth_component24 gl.depth_component32f gl.depth24_stencil
8 gl.depth32f_stencil
8 when using the webgl_color_buffer_float extension: ext.rgba32f_ext: rgba 32-bit floating-point type.
... when using the ext_srgb extension: ext.srgb
8_alpha
8_ext:
8-bit srgb and alpha.
Using textures in WebGL - Web APIs
const level = 0; const internalformat = gl.rgba; const width = 1; const height = 1; const border = 0; const srcformat = gl.rgba; const srctype = gl.unsigned_byte; const pixel = new uint
8array([0, 0, 255, 255]); // opaque blue gl.teximage2d(gl.texture_2d, level, internalformat, width, height, border, srcformat, srctype, pixel); const image = new image(); image.onload = function() { gl.bindtexture(gl.texture_2d, texture); gl.teximage2d(gl.texture_2d, level, internalformat, srcformat, srctype, image); // webgl1 h...
...); } then add code to specify the texture to map onto the faces, just before draw: // tell webgl we want to affect texture unit 0 gl.activetexture(gl.texture0); // bind the texture to texture unit 0 gl.bindtexture(gl.texture_2d, texture); // tell the shader we bound the texture to texture unit 0 gl.uniform1i(programinfo.uniformlocations.usampler, 0); webgl provides a minimum of
8 texture units; the first of these is gl.texture0.
... note: cors support for webgl textures and the crossorigin attribute for image elements is implemented in gecko
8.0.
Movement, orientation, and motion: A WebXR example - Web APIs
const viewerstartposition = vec3.fromvalues(0, 0, -10); const viewerstartorientation = vec3.fromvalues(0, 0, 1.0); const cubeorientation = vec3.create(); const cubematrix = mat4.create(); const mousematrix = mat4.create(); const inverseorientation = quat.create(); const radians_per_degree = math.pi / 1
80.0; the first two—viewerstartposition and viewerstartorientation—indicate where the viewer will be placed relative to the center of the space, and the direction in which they'll initially be looking.
... projectionmatrix: gl.getuniformlocation(shaderprogram, 'uprojectionmatrix'), modelviewmatrix: gl.getuniformlocation(shaderprogram, 'umodelviewmatrix'), normalmatrix: gl.getuniformlocation(shaderprogram, 'unormalmatrix'), usampler: gl.getuniformlocation(shaderprogram, 'usampler') }, }; buffers = initbuffers(gl); texture = loadtexture(gl, 'https://cdn.glitch.com/a93
81af1-1
8a9-495e-ad01-afddfd15d000%2ffirefox-logo-solid.png?v=1575659351244'); xrsession.updaterenderstate({ baselayer: new xrwebgllayer(xrsession, gl) }); if (session_type == "immersive-vr") { refspacetype = "local"; } else { refspacetype = "viewer"; } mat4.fromtranslation(cubematrix, viewerstartposition); vec3.copy(cubeorientation, viewerstartorientation); xrsessio...
... function displaymatrix(mat, rowlength, target) { let outhtml = ""; if (mat && rowlength && rowlength <= mat.length) { let numrows = mat.length / rowlength; outhtml = "<math xmlns='http://www.w3.org/199
8/math/mathml' display='block'>\n<mrow>\n<mo>[</mo>\n<mtable>\n"; for (let y=0; y<numrows; y++) { outhtml += "<mtr>\n"; for (let x=0; x<rowlength; x++) { outhtml += `<mtd><mn>${mat[(x*rowlength) + y].tofixed(2)}</mn></mtd>\n`; } outhtml += "</mtr>\n"; } outhtml += "</mtable>\n<mo>]</mo>\n</mrow>\n</math>"; } target.innerhtml = outhtml; } this repl...
Using the Web Animations API - Web APIs
browser support the basic web animations api features discussed in this article are available by default in firefox 4
8+ and chrome 36+.
... pausing and playing animations we’ll talk more about alice’s animation later, but for now, let’s look closer at the cupcake’s animation: var nommingcake = document.getelementbyid('eat-me_sprite').animate( [ { transform: 'translatey(0)' }, { transform: 'translatey(-
80%)' } ], { fill: 'forwards', easing: 'steps(4, end)', duration: alicechange.effect.timing.duration / 2 }); the element.animate() method will immediately run after it is called.
...ight have noticed something odd about the cake’s duration: duration: alicechange.effect.getcomputedtiming().duration / 2 to understand what’s happening here, let’s take a look at alice’s animation: var alicechange = document.getelementbyid('alice').animate( [ { transform: 'translate(-50%, -50%) scale(.5)' }, { transform: 'translate(-50%, -50%) scale(2)' } ], { duration:
8000, easing: 'ease-in-out', fill: 'both' }); alice’s animation has her going from half her size to twice her size over
8 seconds.
Advanced techniques: Creating and sequencing audio - Web APIs
initial oscillator we'll set up our first oscillatornode the same way as our sweep sound, except we won't use a wavetable to set a bespoke wave — we'll just use the default sine wave: let osc = audioctx.createoscillator(); osc.type = 'sine'; osc.frequency.value =
880; now we're going to create a gainnode, as it's the gain value that we will oscillate with our second, low frequency oscillator: let amp = audioctx.creategain(); amp.gain.setvalueattime(1, audioctx.currenttime); creating the second, low frequency, oscillator we'll now create a second — square — wave (or pulse) oscillator, to alter the amplification of our first sine wave: let lfo = audi...
...one will change the tone and the other will change how the pulse modulates the first wave: <label for="hz">hz</label> <input name="hz" id="hz" type="range" min="660" max="1320" value="
880" step="1" /> <label for="lfo">lfo</label> <input name="lfo" id="lfo" type="range" min="20" max="40" value="30" step="1" /> as before, we'll vary the parameters when the range input values are changed by the user.
... let pulsehz =
880; const hzcontrol = document.queryselector('#hz'); hzcontrol.addeventlistener('input', function() { pulsehz = number(this.value); }, false); let lfohz = 30; const lfocontrol = document.queryselector('#lfo'); lfocontrol.addeventlistener('input', function() { lfohz = number(this.value); }, false); the final playpulse() function here's the entire playpulse() function: let pulsetime = 1; function playpulse() { let osc = audioctx.createoscillator(); osc.type = 'sine'; osc.frequency.setvalueattime(pulsehz, audioctx.currenttime); let amp = audioctx.creategain(); amp.gain.setvalueattime(1, audioctx.currenttime); let lfo = audioctx.createoscillator(); lfo.type = 'square'; lfo.frequency.setvalueattime(lfohz, audioctx.currenttime); ...
Basic concepts behind Web Audio API - Web APIs
the stereo buffer will have
88200 samples, but still 44100 frames.
... analysernode.getbytefrequencydata() copies the current frequency data into a uint
8array (unsigned byte array) passed into it.
... analysernode.getbytetimedomaindata() copies the current waveform, or time-domain, data into a uint
8array (unsigned byte array) passed into it.
Background audio processing using AudioWorklet - Web APIs
by specification, each block of audio your process() function receives contains 12
8 frames (that is, 12
8 samples for each channel), but it is planned that this value will change in the future, and may in fact vary depending on circumstances, so you should always check the array's length rather than assuming a particular size.
...the second parameter is named frequency and defaults to 440.0, with a range from 275 to 41
86.009, inclusively.
... static get parameterdescriptors() { return [ { name: "gain", defaultvalue: 0.5, minvalue: 0, maxvalue: 1 }, { name: "frequency", defaultvalue: 440.0; minvalue: 27.5, maxvalue: 41
86.009 } ]; } accessing your processor node's parameters is as simple as looking them up in the parameters object passed into your implementation of process().
Web audio spatialization basics - Web APIs
make it project to the back when the boombox is rotated 1
80 degrees and facing away from us.
...finally, we'll set some bounds so our boombox doesn't move too far in any direction: const movecontrols = document.queryselector('#move-controls').queryselectorall('button'); const boombox = document.queryselector('.boombox-body'); // the values for our css transforms let transform = { xaxis: 0, yaxis: 0, zaxis: 0.
8, rotatex: 0, rotatey: 0 } // set our bounds const topbound = -posy; const bottombound = posy; const rightbound = posx; const leftbound = -posx; const innerbound = 0.1; const outerbound = 1.5; let's create a function that takes the direction we want to move as a parameter, and both modifies the css transform and updates the position and orientation values of our panner node properties t...
...ur boombox: // set up rotation constants const rotationrate = 60; // bigger number equals slower sound rotation const q = math.pi/rotationrate; //rotation increment in radians we can also use this to work out degrees rotated, which will help with the css transforms we will have to create (note we need both an x and y-axis for the css transforms): // get degrees for css const degreesx = (q * 1
80)/math.pi; const degreesy = (q * 1
80)/math.pi; let's take a look at our left rotation as an example.
Web Authentication API - Web APIs
- service): rp: { name: "acme" }, // user: user: { id: new uint
8array(16), name: "john.p.smith@example.com", displayname: "john p.
... smith" }, pubkeycredparams: [{ type: "public-key", alg: -7 }], attestation: "direct", timeout: 60000, challenge: new uint
8array([ // must be a cryptographically random number sent from a server 0x
8c, 0x0a, 0x26, 0xff, 0x22, 0x91, 0xc1, 0xe9, 0xb9, 0x4e, 0x2e, 0x17, 0x1a, 0x9
8, 0x6a, 0x73, 0x71, 0x9d, 0x43, 0x4
8, 0xd5, 0xa7, 0x6a, 0x15, 0x7e, 0x3
8, 0x94, 0x52, 0x77, 0x97, 0x0f, 0xef ]).buffer } }; // sample arguments for login var getcredentialdefaultargs = { publickey: { timeout: 60000, // allowcredentials: [newcredential] // see below challenge: new uint
8array([ // must be a cryptographically random number sent from a server 0x79, 0x50, 0...
...x6
8, 0x71, 0xda, 0xee, 0xee, 0xb9, 0x94, 0xc3, 0xc2, 0x15, 0x67, 0x65, 0x26, 0x22, 0xe3, 0xf3, 0xab, 0x3b, 0x7
8, 0x2e, 0xd5, 0x6f, 0x
81, 0x26, 0xe2, 0xa6, 0x01, 0x7d, 0x74, 0x50 ]).buffer }, }; // register / create a new credential navigator.credentials.create(createcredentialdefaultargs) .then((cred) => { console.log("new credential", cred); // normally the credential ids available for an account would come from a server // but we can just copy them from above...
WheelEvent - Web APIs
k; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/uievent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#fff" ...
...ale 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 xlink: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="2
81" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">mouseevent</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 xlink:href="/docs/web/api/wheelevent" target="_top"><rect x="371" y="1" width="100" height="50"...
... fill="#f4f7f
8" 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.devicePixelRatio - Web APIs
ctx.scale(scale, scale); ctx.fillstyle = "#bada55"; ctx.fillrect(10, 10, 300, 300); ctx.fillstyle = "#ffffff"; ctx.font = '1
8px arial'; ctx.textalign = 'center'; ctx.textbaseline = 'middle'; var x = size / 2; var y = size / 2; var textstring = "i love mdn"; ctx.filltext(textstring, x, y); monitoring screen resolution or zoom level changes in this example, we'll set up a media query and watch it to see when the device resolution changes, so that we can check the value of devicepixelratio to handle any updates we ne...
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetdevicepixelratiochrome full support 1edge full support 12firefox full support 1
8ie full support 11opera full support 11.1safari full support 3webview android full support 1chrome android full support 1
8firefox android full support ...
... 1
8opera android full support 11.1safari ios full support 1samsung internet android full support 1.0legend full support full support ...
Window.navigator - Web APIs
if (susrag.indexof("firefox") > -1) { sbrowser = "mozilla firefox"; // "mozilla/5.0 (x11; ubuntu; linux x
86_64; rv:61.0) gecko/20100101 firefox/61.0" } else if (susrag.indexof("samsungbrowser") > -1) { sbrowser = "samsung internet"; // "mozilla/5.0 (linux; android 9; samsung sm-g955f build/ppr1.1
80610.011) applewebkit/537.36 (khtml, like gecko) samsungbrowser/9.4 chrome/67.0.3396.
87 mobile safari/537.36 } else if (susrag.indexof("opera") > -1 || susrag.indexof("opr") > -1) { sbrowser = "opera"; ...
... // "mozilla/5.0 (macintosh; intel mac os x 10_14_0) applewebkit/537.36 (khtml, like gecko) chrome/70.0.353
8.102 safari/537.36 opr/57.0.309
8.106" } else if (susrag.indexof("trident") > -1) { sbrowser = "microsoft internet explorer"; // "mozilla/5.0 (windows nt 10.0; wow64; trident/7.0; .net4.0c; .net4.0e; zoom 3.6.0; wbx 1.0.0; rv:11.0) like gecko" } else if (susrag.indexof("edge") > -1) { sbrowser = "microsoft edge"; // "mozilla/5.0 (windows nt 10.0; win64; x64) applewebkit/537.36 (khtml, like gecko) chrome/5
8.0.3029.110 safari/537.36 edge/16.16299" } else if (susrag.indexof("chrome") > -1) { sbrowser = "google chrome or chromium"; // "mozilla/5.0 (x11; linux x
86_64) applewebkit/537.36 (khtml, like gecko) ubuntu chromium/66.0.3359.1
81 chrome/66.0.3359.1
81 safari/537.36" } else...
... if (susrag.indexof("safari") > -1) { sbrowser = "apple safari"; // "mozilla/5.0 (iphone; cpu iphone os 11_4 like mac os x) applewebkit/605.1.15 (khtml, like gecko) version/11.0 mobile/15e14
8 safari/604.1 9
80x1306" } else { sbrowser = "unknown"; } alert("you are using: " + sbrowser); specifications specification status comment html living standardthe definition of 'window: navigator' in that specification.
Window.openDialog() - Web APIs
example var win = opendialog("http://example.tld/zzz.xul", "dlg", "", "pizza", 6.9
8); notes new features all - initially activates (or deactivates ("all=no")) all chrome (except the behavior flags chrome, dialog and modal).
... passing extra parameters to the dialog to pass extra parameters into the dialog, you can simply supply them after the windowfeatures parameter: opendialog("http://example.tld/zzz.xul", "dlg", "", "pizza", 6.9
8); the extra parameters will then get packed into a property named arguments of type array, and this property gets added to the newly opened dialog window.
... var retvals = { address: null, delivery: null }; opendialog("http://example.tld/zzz.xul", "dlg", "modal", "pizza", 6.9
8, retvals); if you set the properties of the retvals object in the dialog code as described below, you can now access them via the retvals array after the opendialog() call returns.
Window.prompt() - Web APIs
note that in internet explorer 7 and
8, if you do not provide this parameter, the string "undefined" is the default value.
...ttribute has the value allow-modals.edge full support 12firefox full support 1ie full support 4notes full support 4notes notes this function has no effect in the modern ui/metro version of internet explorer for windows
8.
... full support 1webview android full support 1notes full support 1notes notes starting with webview 46, this method is blocked inside an <iframe> unless its sandbox attribute has the value allow-modals.chrome android full support 1
8notes full support 1
8notes notes starting with chrome 46, this method is blocked inside an <iframe> unless its sandbox attribute has the value allow-modals.firefox android full support 4opera android full support 10.1notes full support ...
WindowOrWorkerGlobalScope.setTimeout() - Web APIs
settimeout.call(myarray, myarray.mymethod, 2.0*1000); // prints "zero,one,two" after 2 seconds settimeout.call(myarray, myarray.mymethod, 2.5*1000, 2); // prints "two" after 2.5 seconds note: javascript 1.
8.5 introduced the function.prototype.bind() method to set the value of this for all calls to a given function.
...chrome implements this behavior since version 11 (crbug.com/6607
8).
...this causes an integer overflow when using delays larger than 2,147,4
83,647 ms (about 24.
8 days), resulting in the timeout being executed immediately.
Worker.prototype.postMessage() - Web APIs
('incoming message from worker, msg:', msg); switch (msg.data.atopic) { case 'do_sendmainarrbuff': sendmainarrbuff(msg.data.abuf) break; default: throw 'no atopic on incoming message to chromeworker'; } } myworker.addeventlistener('message', handlemessagefromworker); // ok lets create the buffer and send it var arrbuf = new arraybuffer(
8); console.info('arrbuf.bytelength pre transfer:', arrbuf.bytelength); myworker.postmessage( { atopic: 'do_sendworkerarrbuff', abuf: arrbuf // the array buffer that we passed to the transferrable section 3 lines below }, [ arrbuf // the array buffer we created 9 lines above ] ); console.info('arrbuf.bytelength post transfer:', arrbuf.bytelength); worker ...
... throw 'no atopic on incoming message to chromeworker'; } } function sendworkerarrbuff(abuf) { console.info('from worker, pre send back abuf.bytelength:', abuf.bytelength); self.postmessage({atopic:'do_sendmainarrbuff', abuf:abuf}, [abuf]); console.info('from worker, post send back abuf.bytelength:', abuf.bytelength); } output logged arrbuf.bytelength pre transfer:
8 bootstrap.js:40 arrbuf.bytelength post transfer: 0 bootstrap.js:42 from worker, pre send back abuf.bytelength:
8 myworker.js:5:2 incoming message from worker, msg: message { ...
... } bootstrap.js:20 got back buf in main thread, abuf.bytelength:
8 bootstrap.js:12 from worker, post send back abuf.bytelength: 0 myworker.js:7:2 bytelength goes to 0 as it is transferred.
WorkerGlobalScope.location - Web APIs
example if you called the following in a document served at localhost:
8000 console.log(location); inside a worker (which would basically be the equivalent of self.console.log(self.location);, as these are being called on the worker scope, which can be referenced with workerglobalscope.self), you will get a workerlocation object written to the console — something like the following: workerlocation {hash: "", search: "", pathname: "/worker.js", port: "
8000", hostname: "localhost"…...
...} hash: "" host: "localhost:
8000" hostname: "localhost" href: "http://localhost:
8000/worker.js" origin: "http://localhost:
8000" pathname: "/worker.js" port: "
8000" protocol: "http:" search: "" __proto__: workerlocation you could use this location object to return more information about the document's location, as you might do with a normal location object.
... note: firefox has a bug with using console.log inside shared/service workers (see bug 105
8644), which may return strange results, but this should be fixed soon.
ARIA: rowgroup role - Accessibility
examples <div role="table" aria-label="semantic elements" aria-describedby="semantic_elements_table_desc" aria-rowcount="
81"> <div id="semantic_elements_table_desc">semantic elements to use instead of aria's roles</div> <div role="rowgroup"> <div role="row"> <span role="columnheader" aria-sort="none">aria role</span> <span role="columnheader" aria-sort="none">semantic element</span> </div> </div> <div role="rowgroup"> <div role="row" aria-rowindex="11"> <span role="cell">h...
...eader</span> <span role="cell">h1</span> </div> <div role="row" aria-rowindex="16"> <span role="cell">header</span> <span role="cell">h6</span> </div> <div role="row" aria-rowindex="1
8"> <span role="cell">rowgroup</span> <span role="cell">thead</span> </div> <div role="row" aria-rowindex="24"> <span role="cell">term</span> <span role="cell">dt</span> </div> </div> </div> the above is a non-semantic aria table with a table header and table body, with five of
81 rows present in the dom: one within a table header and four rows within the table body.
... <table role="table" aria-label="semantic elements" aria-describedby="semantic_elements_table_desc" aria-rowcount="
81"> <caption id="semantic_elements_table_desc">semantic elements to use instead of aria's roles</caption> <thead role="rowgroup"> <tr role="row"> <th role="columnheader" aria-sort="none">aria role</th> <th role="columnheader" aria-sort="none">semantic element</th> </tr> </thead> <tbody role="rowgroup"> <tr role="row" aria-rowindex="1...
Web accessibility for seizures and physical reactions - Accessibility
section 50
8 prohibits flickering effects with a frequency greater than 3 hz (flickers per second) and lower than 55 hz.
...macknik on november 1, 2014 discussions problems with wcag 2.0 flash definition #553 wcag 2.1 understanding 2.3.1 - missing/vague dimension definitions #5
85 epilepsy and seizures shedding light on photosensitivity, one of epilepsy's most complex conditions epilepsy foundation certain individuals are born with special sensitivity to flashing lights or contrasting visual patterns, such as stripes, grids and checkerboards.
... because of this condition, their brain will produce seizure-like discharges when exposed to this type of visual stimulation gamma oscillations and photosensitive epilepsy current biology volume 27, issue 9,
8 may 2017, pages r336-r33
8 certain visual images, even in the absence of motion or flicker, can trigger seizures in patients with photosensitive epilepsy.
:nth-child() - CSS: Cascading Style Sheets
:nth-child(n+7) represents the seventh and all following elements: 7 [=0+7],
8 [=1+7], 9 [=2+7], etc.
... p:nth-child(n+
8):nth-child(-n+15) represents the eighth through the fifteenth <p> elements of a group of siblings.
... selected because it isn't a <code><span></code>.</p> <div class="second"> <span>span!</span> <span>span</span> <em>this is an `em`.</em> <span>span</span> <span>span!</span> <span>span</span> <span>span!</span> <span>span</span> </div> <br> <h3><code>span:nth-of-type(2n+1)</code>, with an <code><em></code> among the child elements.</h3> <p>children 1, 4, 6, and
8 are selected.<br> 3 isn't used in the counting or selected because it is an <code><em></code>, not a <code><span></code>, and <code>nth-of-type</code> only selects children of that type.
:visited - CSS: Cascading Style Sheets
full support 1ie full support 4opera full support 3.5safari full support 1webview android full support 4.4chrome android full support 1
8firefox android full support 4opera android full support 10.1safari ios full support 1samsung internet android full support 1.0:visited no longer matches <link> elementschrome full support ...
...elements with link pseudo-classes.safari full support 12webview android full support 4.4notes full support 4.4notes notes chromium has never matched <link> elements with link pseudo-classes.chrome android full support 1
8notes full support 1
8notes notes chromium has never matched <link> elements with link pseudo-classes.firefox android no support noopera android full support 14notes full support 14notes notes chromium has never matched...
...chromium has never matched <link> elements with link pseudo-classes.restrict css properties allowed in a statement using :visited for privacychrome full support 6edge full support 12firefox full support 4ie full support
8opera full support 15safari full support 5webview android full support 37chrome android full support 1
8firefox android full support 4opera android full support...
font-stretch - CSS: Cascading Style Sheets
keyword to numeric mapping the table below shows the mapping between keyword values and numeric percentages: keyword percentage ultra-condensed 50% extra-condensed 62.5% condensed 75% semi-condensed
87.5% normal 100% semi-expanded 112.5% expanded 125% extra-expanded 150% ultra-expanded 200% variable fonts most fonts have a particular width which corresponds to one of the keyterm values.
... mdn understanding wcag, guideline 1.4 explanations understanding success criterion 1.4.
8 | w3c understanding wcag 2.0 formal definition related at-rule@font-faceinitial valuenormalcomputed valueas specified formal syntax <font-stretch-absolute>{1,2}where <font-stretch-absolute> = normal | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded | <percentage> examples setting a percentage range for font-stretch...
... @font-face { font-family: "open sans"; src: local("open sans") format("woff2"), url("/fonts/opensans-regular-webfont.woff") format("woff"); font-stretch:
87.5% 112.5%; } specifications specification status comment css fonts module level 4the definition of 'font-stretch' in that specification.
font-weight - CSS: Cascading Style Sheets
in earlier versions of the font-weight specification, the property accepts only keyword values and the numeric values 100, 200, 300, 400, 500, 600, 700,
800, and 900; non-variable fonts can only really make use of these set values, although fine-grained values (e.g.
... common weight name mapping the numerical values 100 to 900 roughly correspond to the following common weight names: value common weight name 100 thin (hairline) 200 extra light (ultra light) 300 light 400 normal 500 medium 600 semi bold (demi bold) 700 bold
800 extra bold (ultra bold) 900 black (heavy) variable fonts most fonts have a particular weight which corresponds to one of the numbers in common weight name mapping.
... mdn understanding wcag, guideline 1.4 explanations understanding success criterion 1.4.
8 | w3c understanding wcag 2.0 formal definition related at-rule@font-faceinitial valuenormalcomputed valueas specified formal syntax <font-weight-absolute>{1,2}where <font-weight-absolute> = normal | bold | <number <a href="/docs/css/value_definition_syntax#brackets" title="brackets: enclose several entities, combinators, and multipliers to transform them as a single component">[1,1000]> exa...
Variable fonts guide - CSS: Cascading Style Sheets
for example: font-variation-settings: 'wght' 375, 'grad'
88; wght (weight) is a registered axis, and grad (grade) is a custom one.
...conversely, when a much larger size was being used (like 4
8 or 60px), there might be much greater variation in thick and thin stroke weights, showing the typeface design more in line with the original intent.
... font-variation-settings: 'grad'
88; the following live example's css can be edited to allow you to play with font grade values.
Browser compatibility and Scroll Snap - CSS: Cascading Style Sheets
in firefox 6
8 the new version of the specification will be shipped and these old properties removed.
...if you do not do this your scroll snapping will no longer work in firefox 6
8 and up.
...we also added the scroll-snap-type property twice, once with the y axis value needed for browsers that support the new spec, and once for firefox pre-6
8, which supports the property but without the y value.
Using media queries - CSS: Cascading Style Sheets
for instance, the following rule will apply its styles if the user's device has either a minimum height of 6
80px or is a screen device in portrait mode: @media (min-height: 6
80px), screen and (orientation: portrait) { ...
... } taking the above example, if the user had a printer with a page height of
800px, the media statement would return true because the first query would apply.
... likewise, if the user were on a smartphone in portrait mode with a viewport height of 4
80px, the second query would apply and the media statement would still return true.
background-position-x - CSS: Cascading Style Sheets
syntax /* keyword values */ background-position-x: left; background-position-x: center; background-position-x: right; /* <percentage> values */ background-position-x: 25%; /* <length> values */ background-position-x: 0px; background-position-x: 1cm; background-position-x:
8em; /* side-relative values */ background-position-x: right 3px; background-position-x: left 25%; /* multiple values */ background-position-x: 0px, center; /* global values */ background-position-x: inherit; background-position-x: initial; background-position-x: unset; the background-position-x property is specified as one or more values, separated by commas.
... html <div></div> css div { width: 300px; height: 300px; background-color: skyblue; background-image: url(https://media.prod.mdn.mozit.cloud/attachments/2020/07/29/17350/3b4
892b7e
820122ac6dd767
8891d4507/firefox.png); background-repeat: no-repeat; background-position-x: center; background-position-y: bottom 10px; } result specifications specification status comment css backgrounds and borders module level 4the definition of 'background-position-x' in that specification.
... full support 49ie full support 6opera full support 15safari full support 1webview android full support ≤37chrome android full support 1
8firefox android full support 49opera android full support 1
8safari ios full support 1samsung internet android full support 1.0two-value syntax (support for offsets from any edge)chrome no support ...
background-position-y - CSS: Cascading Style Sheets
syntax /* keyword values */ background-position-y: top; background-position-y: center; background-position-y: bottom; /* <percentage> values */ background-position-y: 25%; /* <length> values */ background-position-y: 0px; background-position-y: 1cm; background-position-y:
8em; /* side-relative values */ background-position-y: bottom 3px; background-position-y: bottom 10%; /* multiple values */ background-position-y: 0px, center; /* global values */ background-position-y: inherit; background-position-y: initial; background-position-y: unset; the background-position-y property is specified as one or more values, separated by commas.
... html <div></div> css div { width: 300px; height: 300px; background-color: skyblue; background-image: url(https://media.prod.mdn.mozit.cloud/attachments/2020/07/29/17350/3b4
892b7e
820122ac6dd767
8891d4507/firefox.png); background-repeat: no-repeat; background-position-x: center; background-position-y: bottom 10px; } result specifications specification status comment css backgrounds and borders module level 4the definition of 'background-position-y' in that specification.
... full support 49ie full support 6opera full support 15safari full support 1webview android full support ≤37chrome android full support 1
8firefox android full support 49opera android full support 14safari ios full support 1samsung internet android full support 1.0two-value syntax (support for offsets from any edge)chrome no support ...
background - CSS: Cascading Style Sheets
background-color background-image background-origin background-position background-repeat background-size syntax /* using a <background-color> */ background: green; /* using a <bg-image> and <repeat-style> */ background: url("test.jpg") repeat-y; /* using a <box> and <background-color> */ background: border-box red; /* a single image, centered and scaled */ background: no-repeat center/
80% url("../img/image.png"); the background property is specified as one or more background layers, separated by commas.
... the syntax of each layer is as follows: each layer may include zero or one occurrences of any of the following values: <attachment> <bg-image> <position> <bg-size> <repeat-style> the <bg-size> value may only be included immediately after <position>, separated with the '/' character, like this: "center/
80%".
...tage>{1,2}<color-stop-angle> = <angle-percentage>{1,2}<angle-percentage> = <angle> | <percentage> examples setting backgrounds with color keywords and images html <p class="topbanner"> starry sky<br/> twinkle twinkle<br/> starry sky </p> <p class="warning">here is a paragraph<p> css .warning { background: pink; } .topbanner { background: url("https://mdn.mozillademos.org/files/119
83/starsolid.gif") #99f repeat-y fixed; } result specifications specification status comment css backgrounds and borders module level 3the definition of 'background' in that specification.
border-left-style - CSS: Cascading Style Sheets
yntax <line-style>where <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset examples html <table> <tr> <td class="b1">none</td> <td class="b2">hidden</td> <td class="b3">dotted</td> <td class="b4">dashed</td> </tr> <tr> <td class="b5">solid</td> <td class="b6">double</td> <td class="b7">groove</td> <td class="b
8">ridge</td> </tr> <tr> <td class="b9">inset</td> <td class="b10">outset</td> </tr> </table> css /* define look of the table */ table { border-width: 2px; background-color: #52e3
85; } tr, td { padding: 3px; } /* border-left-style example classes */ .b1 {border-left-style: none;} .b2 {border-left-style: hidden;} .b3 {border-left-style: dotted;} .b4 {border-left-style: dashed;...
...} .b5 {border-left-style: solid;} .b6 {border-left-style: double;} .b7 {border-left-style: groove;} .b
8 {border-left-style: ridge;} .b9 {border-left-style: inset;} .b10 {border-left-style: outset;} result specifications specification status comment css backgrounds and borders module level 3the definition of 'border-left-style' in that specification.
...this has been fixed in firefox 50.ie full support 5.5opera full support 9.2safari full support 1webview android full support 2.3chrome android full support 1
8firefox android full support 14notes full support 14notes notes prior to firefox 50, border styles of rounded corners (with border-radius) were always rendered as if border-bottom-style was solid.
border-right-style - CSS: Cascading Style Sheets
yle>where <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset examples border styles html <table> <tr> <td class="b1">none</td> <td class="b2">hidden</td> <td class="b3">dotted</td> <td class="b4">dashed</td> </tr> <tr> <td class="b5">solid</td> <td class="b6">double</td> <td class="b7">groove</td> <td class="b
8">ridge</td> </tr> <tr> <td class="b9">inset</td> <td class="b10">outset</td> </tr> </table> css /* define look of the table */ table { border-width: 2px; background-color: #52e3
85; } tr, td { padding: 3px; } /* border-right-style example classes */ .b1 {border-right-style: none;} .b2 {border-right-style: hidden;} .b3 {border-right-style: dotted;} .b4 {border-right-style: da...
...shed;} .b5 {border-right-style: solid;} .b6 {border-right-style: double;} .b7 {border-right-style: groove;} .b
8 {border-right-style: ridge;} .b9 {border-right-style: inset;} .b10 {border-right-style: outset;} result specifications specification status comment css backgrounds and borders module level 3the definition of 'border-right-style' in that specification.
...this has been fixed in firefox 50.ie full support 5.5opera full support 9.2safari full support 1webview android full support ≤37chrome android full support 1
8firefox android full support 14notes full support 14notes notes prior to firefox 50, border styles of rounded corners (with border-radius) were always rendered as if border-bottom-style was solid.
box-direction - CSS: Cascading Style Sheets
endor prefix: -webkit-firefox full support 1prefixed full support 1prefixed prefixed implemented with the vendor prefix: -moz- full support 49prefixed prefixed implemented with the vendor prefix: -webkit- full support 4
8prefixed disabled prefixed implemented with the vendor prefix: -webkit-disabled from version 4
8: this feature is behind the layout.css.prefixes.webkit preference (needs to be set to true).
...kit- no support 1.1 — 3prefixed prefixed implemented with the vendor prefix: -khtml-webview android full support ≤37prefixed full support ≤37prefixed prefixed implemented with the vendor prefix: -webkit-chrome android full support 1
8prefixed full support 1
8prefixed prefixed implemented with the vendor prefix: -webkit-firefox android full support 4prefixed full support 4prefixed prefixed implemented with the vendor prefix: -moz- full support 49pref...
...ixed prefixed implemented with the vendor prefix: -webkit- full support 4
8prefixed disabled prefixed implemented with the vendor prefix: -webkit-disabled from version 4
8: this feature is behind the layout.css.prefixes.webkit preference (needs to be set to true).
break-inside - CSS: Cascading Style Sheets
fusce iaculis urna id neque dapibus, eu lacinia lectus dictum.</p> <figure> <img src="https://udn.realityripple.com/samples/fe/450
8d
88f7
8.png"> <figcaption>the firefox logo — fox wrapped around the world</figcaption> </figure> <p>praesent condimentum dui dui, sit amet rutrum diam tincidunt eu.
...duis suscipit faucibus dui sed ultricies.</p> </article> css html { font-family: helvetica, arial, sans-serif; } body { width:
80%; margin: 0 auto; } h1 { font-size: 3rem; letter-spacing: 2px; column-span: all; } h1 + p { margin-top: 0; } p { line-height: 1.5; break-after: column; } figure { break-inside: avoid; } img { max-width: 70%; display: block; margin: 0 auto; } figcaption { font-style: italic; font-size: 0.
8rem; width: 70%; } article { column-width: 200px; gap: 20px; } result...
...l support 5.0paged_context: page and avoid-pagechrome full support 51edge full support 12firefox no support noie no support noopera full support 3
8 full support 3
8 no support 11.1 — 12.1safari no support nowebview android full support 51chrome android full support 51firefox android no support ...
clip-path - CSS: Cascading Style Sheets
44" height="144" /> <text x="96" y="91">i love</text> <text x="96" y="109" class="em">clipping</text> </g> </svg> </div> </div> </div> <div class="note">clip-path: padding-box circle(25% at 25% 25%)</div> <div class="row"> <div class="cell"> <span>html</span> <div class="container"> <p class="shape
8"> i love<br><em>clipping</em> </p> </div> </div> <div class="cell"> <span>svg</span> <div class="container viewbox"> <svg viewbox="0 0 192 192"> <g class="shape
8"> <rect x="24" y="24" width="144" height="144" /> <text x="96" y="91">i love</text> <text x="96" y="109" class="em">clippin...
...; } .grid { width: 100%; height: 100%; display: flex; font: 1em monospace; } .row { display: flex; flex: 1 auto; flex-direction: row; flex-wrap: wrap; } .col { flex: 1 auto; } .cell { margin: .5em; padding: .5em; background-color: #fff; overflow: hidden; text-align: center; flex: 1; } .note { background: #fff3d4; padding: 1em; margin: .5em .5em 0; font: .
8em sans-serif; text-align: left; white-space: nowrap; } .note + .row .cell { margin-top: 0; } .container { display: inline-block; border: 1px dotted grey; position:relative; } .container:before { content: 'margin'; position: absolute; top: 2px; left: 2px; font: italic .6em sans-serif; } .viewbox { box-shadow: 1rem 1rem 0 #efefef inset, -1rem -1rem 0 #efefef inset; } .c...
...,90,15,45 z');} .shape1 { clip-path: circle(25%); } .shape2 { clip-path: circle(25% at 25% 25%); } .shape3 { clip-path: fill-box circle(25% at 25% 25%); } .shape4 { clip-path: stroke-box circle(25% at 25% 25%); } .shape5 { clip-path: view-box circle(25% at 25% 25%); } .shape6 { clip-path: margin-box circle(25% at 25% 25%); } .shape7 { clip-path: border-box circle(25% at 25% 25%); } .shape
8 { clip-path: padding-box circle(25% at 25% 25%); } .shape9 { clip-path: content-box circle(25% at 25% 25%); } .defs { width: 0; height: 0; margin: 0; } pre { margin-bottom: 0; } svg { margin: 1em; font-family: sans-serif; width: 192px; height: 192px; } svg rect { stroke: pink; stroke-width: 16px; } svg text { fill: pink; text-anchor: middle; } svg text.em { font-styl...
color - CSS: Cascading Style Sheets
large text is defined as 1
8.66px and bold or larger, or 24px or larger.
...)where <alpha-value> = <number> | <percentage><hue> = <number> | <angle> examples making text red the following are all ways to make a paragraph's text red: p { color: red; } p { color: #f00; } p { color: #ff0000; } p { color: rgb(255,0,0); } p { color: rgb(100%, 0%, 0%); } p { color: hsl(0, 100%, 50%); } /* 50% translucent */ p { color: #ff0000
80; } p { color: rgba(255, 0, 0, 0.5); } p { color: hsla(0, 100%, 50%, 0.5); } specifications specification status comment css color module level 4the definition of 'color' in that specification.
... adds 4- and
8-digit hex color values, where the last digit(s) represents the alpha value.
font - CSS: Cascading Style Sheets
set the font family to sans-serif */ p { font: 12px/14px sans-serif } /* set the font size to
80% of the parent element or default value (if no parent element present).
... set the font family to sans-serif */ p { font:
80% sans-serif } /* set the font weight to bold, the font-style to italic, the font size to large, and the font family to serif.
...</div> <br/><br/><br/><br/><br/><br/> css body, input { font: 14px arial; overflow: hidden; } .propinputcont { float: left; text-align: center; margin-right: 5px; width:
80px; } .setpropcont { float: left; margin-right: 5px; width: 120px; } .propinputs, .setpropcont { margin-bottom: 1em; } .curcss { border: none; border-bottom: 1px solid black; text-align: center; width:
80px; } .mandatory { border-bottom-color: red; } .cf:before, .cf:after { content: " "; display: table; } .cf:after { clear: both; } .tar { width: 40px; text-align...
<gradient> - CSS: Cascading Style Sheets
<div class="linear-gradient">linear gradient</div> div { width: 240px; height:
80px; } .linear-gradient { background: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet); } radial gradient example a simple radial gradient.
... <div class="radial-gradient">radial gradient</div> div { width: 240px; height:
80px; } .radial-gradient { background: radial-gradient(red, yellow, rgb(30, 144, 255)); } repeating gradient examples simple repeating linear and radial gradient examples.
... <div class="linear-repeat">repeating linear gradient</div> <br> <div class="radial-repeat">repeating radial gradient</div> div { width: 240px; height:
80px; } .linear-repeat { background: repeating-linear-gradient(to top left, lightpink, lightpink 5px, white 5px, white 10px); } .radial-repeat { background: repeating-radial-gradient(powderblue, powderblue
8px, white
8px, white 16px); } conic gradient example a simple conic gradient example.
letter-spacing - CSS: Cascading Style Sheets
mdn understanding wcag, guideline 1.4 explanations understanding success criterion 1.4.
8 | w3c understanding wcag 2.0 formal definition initial valuenormalapplies toall elements.
... full support 1ie full support 4opera full support 3.5safari full support 1webview android full support ≤37chrome android full support 1
8firefox android full support 4opera android full support 10.1safari ios full support 1samsung internet android full support 1.0svg supportchrome full support 1edge ...
... full support 72ie full support 9opera full support 7safari full support 5.1webview android full support ≤37chrome android full support 1
8firefox android no support noopera android full support 10.1safari ios full support 5.1samsung internet android full support 1.0legend full support ful...
linear-gradient() - CSS: Cascading Style Sheets
the values to top, to bottom, to left, and to right are equivalent to the angles 0deg, 1
80deg, 270deg, and 90deg, respectively.
... note also that the first example above does not exactly render as depicted in mozilla firefox (particularly version
80.0b3).
... body { width: 100vw; height: 100vh; } body { background: linear-gradient(to right, red 20%, orange 20% 40%, yellow 40% 60%, green 60%
80%, blue
80%); } more linear-gradient examples please see using css gradients for more examples.
object-fit - CSS: Cascading Style Sheets
formal definition initial valuefillapplies toreplaced elementsinheritednocomputed valueas specifiedanimation typediscrete formal syntax fill | contain | cover | none | scale-down examples setting object-fit for an image html <section> <h2>object-fit: fill</h2> <img class="fill" src="https://udn.realityripple.com/samples/ae/24
8a993
8d9.png" alt="mdn logo"> <img class="fill narrow" src="https://udn.realityripple.com/samples/ae/24
8a993
8d9.png" alt="mdn logo"> <h2>object-fit: contain</h2> <img class="contain" src="https://udn.realityripple.com/samples/ae/24
8a993
8d9.png" alt="mdn logo"> <img class="contain narrow" src="https://udn.realityripple.com/samples/ae/24
8a993
8d9.png" alt="mdn logo"> <h2>object-fit: cove...
...r</h2> <img class="cover" src="https://udn.realityripple.com/samples/ae/24
8a993
8d9.png" alt="mdn logo"> <img class="cover narrow" src="https://udn.realityripple.com/samples/ae/24
8a993
8d9.png" alt="mdn logo"> <h2>object-fit: none</h2> <img class="none" src="https://udn.realityripple.com/samples/ae/24
8a993
8d9.png" alt="mdn logo"> <img class="none narrow" src="https://udn.realityripple.com/samples/ae/24
8a993
8d9.png" alt="mdn logo"> <h2>object-fit: scale-down</h2> <img class="scale-down" src="https://udn.realityripple.com/samples/ae/24
8a993
8d9.png" alt="mdn logo"> <img class="scale-down narrow" src="https://udn.realityripple.com/samples/ae/24
8a993
8d9.png" alt="mdn logo"> </section> css h2 { font-family: courier new, monospace; font-size: 1em; margin: 1em 0 0.3em; } ...
...see edge issue 13603
873 for details.firefox full support 36ie no support noopera full support 19 full support 19 full support 11.6prefixed prefixed implemented with the vendor prefix: -o-safari ...
offset-path - CSS: Cascading Style Sheets
syntax /* default */ offset-path: none; /* function values */ offset-path: ray(45deg closest-side contain); /* url */ offset-path: url(#path); /* shapes */ offset-path: circle(50% at 25% 25%); offset-path: inset(50% 50% 50% 50%); offset-path: polygon(30% 0%, 70% 0%, 100% 50%, 30% 100%, 0% 70%, 0% 30%); offset-path: path('m 0,200 q 200,200 260,
80 q 290,20 400,0 q 300,100 400,200'); /* geometry boxes */ offset-path: margin-box; offset-path: stroke-box; /* global values */ offset-path: inherit; offset-path: initial; offset-path: unset; values ray() taking up to three values, defines a path that is a line segment starting from the position of the box and proceeds in the direction defined by the specified angle similar to the css gra...
... <svg xmlns="http://www.w3.org/2000/svg" width="700" height="450" viewbox="350 0 1400 900"> <title>house and scissors</title> <rect x="595" y="423" width="610" height="377" fill="blue" /> <polygon points="506,423 900,190 1294,423" fill="yellow" /> <polygon points="993,245 993,190 10
86,190 10
86,300" fill="red" /> <path id="house" d="m900,190 l993,245 v201 a11,11 0 0,1 1004,190 h1075 a11,11 0 0,1 10
86,201 v300 l1294,423 h1216 a11,11 0 0,0 1205,434 v7
89 a11,11 0 0,1 1194,
800 h606 a11,11 0 0,1 595,7
89 v434 a11,11 0 0,0 5
84,423 h506 l900,190" fill="none" stroke="black" stroke-width="13" stroke-linejoin="round" stroke-linecap="ro...
...20 a10,10 0 0,0 30,0 m-40,-20 a10,10 1 0,0 -40,0 a10,10 1 0,0 -40,-20 m0,0" transform="translate(0,0)" fill="forestgreen" stroke="black" stroke-width="5" stroke-linejoin="round" stroke-linecap="round" fill-rule="evenodd" /> </svg> css .scissorhalf { offset-path: path('m900,190 l993,245 v201 a11,11 0 0,1 1004,190 h1075 a11,11 0 0,1 10
86,201 v300 l1294,423 h1216 a11,11 0 0,0 1205,434 v7
89 a11,11 0 0,1 1194,
800 h606 a11,11 0 0,1 595,7
89 v434 a11,11 0 0,0 5
84,423 h506 l900,190'); animation: followpath 4s linear infinite; } @keyframes followpath { to { motion-offset: 100%; offset-distance: 100%; } } result specifications <body> specification status comment motion path m...
outline-color - CSS: Cascading Style Sheets
large text is defined as 1
8.66px and bold or larger, or 24px or larger.
...upport 1edge full support 12firefox full support 1.5 full support 1.5 no support 1 — 3.6prefixed prefixed implemented with the vendor prefix: -moz-ie full support
8opera full support 7safari full support 1.2webview android full support 37chrome android full support 1
8firefox android full support 4opera android full suppor...
... 14safari ios full support 1samsung internet android full support 1.0invertchrome no support noedge no support 12 — 79firefox no support 1 — 3ie full support
8opera no support 7 — 15safari no support nowebview android no support nochrome android no support nofirefox android no support noopera android no support ...
place-items - CSS: Cascading Style Sheets
examples placing items in a flex container div > div { box-sizing: border-box; border: 2px solid #
8c
8c
8c; width: 50px; display: flex; align-items: center; justify-content: center; } #item1 { background-color: #
8cffa0; min-height: 30px; } #item2 { background-color: #a0c
8ff; min-height: 50px; } #item3 { background-color: #ffa0
8c; min-height: 40px; } #item4 { background-color: #ffff
8c; min-height: 60px; } #item5 { background-color: #ff
8cff; min-height: 70px; } #it...
...em6 { background-color: #
8cffff; min-height: 50px; font-size: 30px; } select { font-size: 16px; } .row { margin-top: 10px; } html <div id="container" class="flex"> <div id="item1">1</div> <div id="item2">2</div> <div id="item3">3</div> <div id="item4">4</div> <div id="item5">5</div> <div id="item6">6</div> </div> <div class="row"> <label for="display">display: </label> <select id="display"> <option value="flex">flex</option> <option value="grid">grid</option> </select> </div> <div class="row"> <label for="values">place-items: </label> <select id="values"> <option value="start">start</option> <option value="center">center</option> <option value="end">end</option> <option value="left">left</option> <option value="right">right</...
...telementbyid('container'); values.addeventlistener('change', function (evt) { container.style.placeitems = evt.target.value; }); display.addeventlistener('change', function (evt) { container.classname = evt.target.value; }); css #container { height:200px; width: 240px; place-items: center; /* you can change this value by selecting another option in the list */ background-color: #
8c
8c
8c; } .flex { display: flex; flex-wrap: wrap; } .grid { display: grid; grid-template-columns: repeat(auto-fill, 50px); } result specifications specification status comment css box alignment module level 3the definition of 'place-items' in that specification.
repeating-conic-gradient() - CSS: Cascading Style Sheets
repeating-conic-gradient(from 0deg, red 0deg 30deg, yellow 30deg 60deg, blue 60deg 90deg); repeating-radial-gradient(red 0
8%, yellow
8% 16%, blue 16% 24%); conic-gradient(red 120deg, yellow 120deg 240deg, blue 240deg); radial-gradient(red 33%, yellow 33% 66%, blue 66%); for a repeating gradient to repeat we define the first and last color stops.
... mdn understanding wcag, guideline 1.1 explanations understanding success criterion 1.1.1 | w3c understanding wcag 2.0 examples black and white starburst div { width: 200px; height: 200px; } <div></div> div { background-image: repeating-conic-gradient(#fff 0 9deg, #000 9deg 1
8deg); } off-centered gradient this gradient repeats 1
8 times, but since we only see the right half, we only see 9 repeats.
... div { width: 200px; height: 200px; } <div></div> div { background: repeating-conic-gradient( from 3deg at 25% 25%, green, blue 2deg 5deg, green, yellow 15deg 1
8deg, green 20deg); } more repeating-conic-gradient examples please see using css gradients for more examples.
rotate() - CSS: Cascading Style Sheets
a rotation by 1
80° is called point reflection.
... on ℝℙ2 cartesian coordinates on ℝ3 homogeneous coordinates on ℝℙ3 cos(a)-sin(a) sin(a)cos(a) cos(a)-sin(a)0sin(a)cos(a)0001 cos(a)-sin(a)0sin(a)cos(a)0001 cos(a)-sin(a)00sin(a)cos(a)0000100001 [cos(a) sin(a) -sin(a) cos(a) 0 0] examples basic example html <div>normal</div> <div class="rotated">rotated</div> css div { width:
80px; height:
80px; background-color: skyblue; } .rotated { transform: rotate(45deg); /* equal to rotatez(45deg) */ background-color: pink; } result combining rotation with another transformation if you want apply multiple transformations to an element, be careful about the order in which you specify your transformations.
...ate">rotated + translated</div> <div class="translate-rotate">translated + rotated</div> css div { position: absolute; left: 40px; top: 40px; width: 100px; height: 100px; background-color: lightgray; } .rotate { background-color: transparent; outline: 2px dashed; transform: rotate(45deg); } .rotate-translate { background-color: pink; transform: rotate(45deg) translatex(1
80px); } .translate-rotate { background-color: gold; transform: translatex(1
80px) rotate(45deg); } result specifications specification status comment css transforms level 1the definition of 'rotate()' in that specification.
Cross-browser audio basics - Developer guides
an audio player with feedback consider this snippet of html: <audio id="my-audio"> <source src="https://udn.realityripple.com/samples/6c/d3
85042de2.mp3" type="audio/mpeg"> <source src="https://udn.realityripple.com/samples/2
8/191a7bd2a5.ogg" type="audio/ogg"> <!-- place fallback here as <audio> supporting browsers will ignore it --> <a href="audiofile.mp3">audiofile.mp3</a> </audio> <div id="controls"> <span id="loading">loading</span> <button id="play" style="display:none">play</button> <button id="pause" style="display:...
...none" >pause</button> </div> <div id="progress"> <div id="bar"></div> </div> styled like so: #controls { width:
80px; float: left; } #progress { margin-left:
80px; border: 1px solid black; } #bar { height: 20px; background-color: green; width: 0; } now let's wire this thing up with javascript: window.onload = function(){ var myaudio = document.getelementbyid('my-audio'); var play = document.getelementbyid('play'); var pause = document.getelementbyid('pause'); var loading = document.getelementbyid('loading'); var bar = document.getelementbyid('bar'); function displaycontrols() { loading.style.display = "none"; play.style.display = "block"; } // check that the media is ready before displaying the controls if (myaudio.pause...
... first of all, we apply a quick update to the progress bar css to display the hand pointer on hover: #progress { margin-left:
80px; border: 1px solid black; cursor: pointer; } then we add the code that detects the click and moves the 'playhead' to the correct position: var progress = document.getelementbyid('progress'); progress.addeventlistener('click', function(e) { // calculate the normalized position clicked var clickposition = (e.pagex - this.offsetleft) / this.offsetwidth; var clicktime = clickposit...
Creating a cross-browser video player - Developer guides
-of-steel-battle-clip-medium.mp4" /> <param name="allowfullscreen" 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="42
8" 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 con...
...ie
8 and ie9).
...the custom controls will only appear on this browser in fullscreen mode with some webkit specific css: the default browser controls have to be hidden with video::-webkit-media-controls { display:none !important; } the custom controls container needs to have a special z-index value: .controls { z-index:21474
83647; } dealing with webkit-specific code in this way will affect all webkit browsers, but everything works as expected in more advanced webkit browsers such as chrome and the latest opera.
Audio and video manipulation - Developer guides
html we can set up our video player and <canvas> element like this: <video id="my-video" controls="true" width="4
80" height="270" crossorigin="anonymous"> <source src="https://udn.realityripple.com/samples/5b/
8cd6da9c65.webm" type="video/webm"> <source src="https://udn.realityripple.com/samples/6f/0
8625b424a.m4v" type="video/mp4"> </video> <canvas id="my-canvas" width="4
80" height="270"></canvas> javascript this code handles altering the frames.
... html <video id="my-video" controls src="https://udn.realityripple.com/samples/6f/0
8625b424a.m4v"> </video> javascript var myvideo = document.getelementbyid('my-video'); myvideo.playbackrate = 2; playable code <video id="my-video" controls="true" width="4
80" height="270"> <source src="https://udn.realityripple.com/samples/5b/
8cd6da9c65.webm" type="video/webm"> <source src="https://udn.realityripple.com/samples/6f/0
8625b424a.m4v" type="video/mp4"> </video> <div class="pla...
...pt var context = new audiocontext(), audiosource = context.createmediaelementsource(document.getelementbyid("my-video")), filter = context.createbiquadfilter(); audiosource.connect(filter); filter.connect(context.destination); // configure filter filter.type = "lowshelf"; filter.frequency.value = 1000; filter.gain.value = 25; playable code <video id="my-video" controls="true" width="4
80" height="270" crossorigin="anonymous"> <source src="https://udn.realityripple.com/samples/5b/
8cd6da9c65.webm" type="video/webm"> <source src="https://udn.realityripple.com/samples/6f/0
8625b424a.m4v" type="video/mp4"> </video> <div class="playable-buttons"> <input id="edit" type="button" value="edit" /> <input id="reset" type="button" value="reset" /> </div> <textarea id="code" class="pla...
The HTML autocomplete attribute - HTML: Hypertext Markup Language
for the phone number "1-
855-555-6502", this field's value would be "
855-555-6502".
...a complete address would look like so: 103 frogmarch street upper-wapping winchelsea tn99
8zz the address levels are: address-level1: the post town — "winchelsea" in this case.
...for example: 〒3
81-0000 長野県長野市某町123 "〒" and following seven digits shows the postal code.
HTML attribute: min - HTML: Hypertext Markup Language
syntax for min values for other elements input type syntax example <meter> <number> <meter id="fuel" min="0" max="100" low="33" high="66" optimum="
80" value="40"> at 40/100</meter> impact on step the value of min and step define what are valid values, even if the step attribute is not included, as step defaults to 0.
... <input id="mynumber" name="mynumber" type="number" min="7.2" value="
8"> because step defaults to 1, valid values include 7.2,
8.2, 9.2, and so on.
... the value
8 is not valid.
HTML attribute: pattern - HTML: Hypertext Markup Language
examples given the following: <p> <label>enter your phone number in the format (123)456-7
890 (<input name="tel1" type="tel" pattern="[0-9]{3}" placeholder="###" aria-label="3-digit area code" size="2"/>)- <input name="tel2" type="tel" pattern="[0-9]{3}" placeholder="###" aria-label="3-digit prefix" size="2"/> - <input name="tel3" type="tel" pattern="[0-9]{4}" placeholder="####" aria-label="4-digit number" size="3"/> </label> </p> here we have 3 sections for a north american p...
... the example below restricts the value to 4-
8 characters and requires that it contain only lower-case letters.
... <form> <div> <label for="uname">choose a username: </label> <input type="text" id="uname" name="name" required size="45" pattern="[a-z]{4,
8}" title="4 to
8 lowercase letters"> <span class="validity"></span> <p>usernames must be lowercase and 4-
8 characters in length.</p> </div> <div> <button>submit</button> </div> </form> div { margin-bottom: 10px; position: relative; } p { font-size:
80%; color: #999; } input + span { padding-right: 30px; } input:invalid+span:after { position: absolute; content: '✖'; padding-left: 5px; } input:valid+span:after { position: absolute; content: '✓'; padding-left: 5px; } this renders like so: accessibility concerns when a control has a pattern attribute, the title attribute, if used,...
<bdi>: The Bidirectional Isolate element - HTML: Hypertext Markup Language
when the names only contain ltr text the results look fine: <ul> <li><span class="name">henrietta boffin</span> - 1st place</li> <li><span class="name">jerry cruncher</span> - 2nd place</li> </ul> body { border: 1px solid #3f
87a6; max-width: calc(100% - 40px - 6px); padding: 20px; width: calc(100% - 40px - 6px); border-width: 1px 1px 1px 5px; } no <bdi> with rtl text this example lists the winners of a competition using <span> elements only, and one of the winners has a name consisting of rtl text.
... in this case the "- 1", which consists of characters with neutral or weak directionality, will adopt the directionality of the rtl text, and the result will be garbled: <ul> <li><span class="name">اَلأَعْشَى</span> - 1st place</li> <li><span class="name">jerry cruncher</span> - 2nd place</li> </ul> body { border: 1px solid #3f
87a6; max-width: calc(100% - 40px - 6px); padding: 20px; width: calc(100% - 40px - 6px); border-width: 1px 1px 1px 5px; } using <bdi> with ltr and rtl text this example lists the winners of a competition using <bdi> elements.
... these elements instruct the browser to treat the name in isolation from its embedding context, so the example output is properly ordered: <ul> <li><bdi class="name">اَلأَعْشَى</bdi> - 1st place</li> <li><bdi class="name">jerry cruncher</bdi> - 2nd place</li> </ul> body { border: 1px solid #3f
87a6; max-width: calc(100% - 40px - 6px); padding: 20px; width: calc(100% - 40px - 6px); border-width: 1px 1px 1px 5px; } specifications specification status comment html living standardthe definition of '<bdi>' in that specification.
<button>: The Button element - HTML: Hypertext Markup Language
example <button name="favorite"> <svg aria-hidden="true" viewbox="0 0 10 10"><path d="m7 9l5
8 3 9v6l1 4h3l1-3 1 3h3l7 6z"/></svg> add to favorites </button> if you want to visually hide the button's text, an accessible way to do so is to use a combination of css properties to remove it visually from the screen, but keep it parseable by assistive technology.
...(large text is defined as 1
8.66px and bold or larger, or 24px or larger.) webaim: color contrast checker mdn understanding wcag, guideline 1.4 explanations understanding success criterion 1.4.3 | w3c understanding wcag 2.0 clicking and focus whether clicking on a <button> causes it to (by default) become focused varies by browser and os.
... desktop browsers windows
8.1 os x 10.x firefox yes - firefox 30.0 no (even with a tabindex) firefox 63 chrome yes - chrome 35 yes - chrome 65 safari n/a no (even with a tabindex) safari 12 (bug 22261) internet explorer yes - internet explorer 11 n/a presto yes - opera 12 yes - opera 12 does tapping on a <button> give it focus?
<input type="button"> - HTML: Hypertext Markup Language
background: #ccc; width: 150px; height: 75px; padding: 5px; } input[type="color"], input[type="button"] { width: 90%; margin: 0 auto; display: block; } input[type="range"] { width: 70%; } span { position: relative; bottom: 5px; } var canvas = document.queryselector('.mycanvas'); var width = canvas.width = window.innerwidth; var height = canvas.height = window.innerheight-
85; var ctx = canvas.getcontext('2d'); ctx.fillstyle = 'rgb(0,0,0)'; ctx.fillrect(0,0,width,height); var colorpicker = document.queryselector('input[type="color"]'); var sizepicker = document.queryselector('input[type="range"]'); var output = document.queryselector('.output'); var clearbtn = document.queryselector('input[type="button"]'); // covert degrees to radians function degtorad(degrees) {...
... return degrees * math.pi / 1
80; }; // update sizepicker output value sizepicker.oninput = function() { output.textcontent = sizepicker.value; } // store mouse pointer coordinates, and whether the button is pressed var curx; var cury; var pressed = false; // update mouse pointer coordinates document.onmousemove = function(e) { curx = (window.event) ?
...document.documentelement.scrolltop : document.body.scrolltop); } canvas.onmousedown = function() { pressed = true; }; canvas.onmouseup = function() { pressed = false; } clearbtn.onclick = function() { ctx.fillstyle = 'rgb(0,0,0)'; ctx.fillrect(0,0,width,height); } function draw() { if(pressed) { ctx.fillstyle = colorpicker.value; ctx.beginpath(); ctx.arc(curx, cury-
85, sizepicker.value, degtorad(0), degtorad(360), false); ctx.fill(); } requestanimationframe(draw); } draw(); specifications specification status comments html living standardthe definition of '<input type="button">' in that specification.
<input type="image"> - HTML: Hypertext Markup Language
essential image input features let's look at a basic example that includes all the essential features you'd need to use (these work exactly the same as they do on the <img> element.): <input id="image" type="image" width="100" height="30" alt="login" src="/static/external/62/62ac2ecddbec0e0b54009
8c2
8451e57203e5cab46dfed7ab0115d5a659fcfb7b.png"> the src attribute is used to specify the path to the image you want to display in the button.
... html <form> <p>login to your account</p> <div> <label for="userid">user id</label> <input type="text" id="userid" name="userid"> </div> <div> <label for="pwd">password</label> <input type="password" id="pwd" name="pwd"> </div> <div> <input id="image" type="image" src="/static/external/62/62ac2ecddbec0e0b54009
8c2
8451e57203e5cab46dfed7ab0115d5a659fcfb7b.png" alt="login" width="100"> </div> </form> css and now some simple css to make the basic elements sit more neatly: div { margin-bottom: 10px; } label { display: inline-block; width: 70px; text-align: right; padding-right: 10px; } adjusting the image position and scaling in this example, we adapt the previous example to set aside more s...
... html <form> <p>login to your account</p> <div> <label for="userid">user id</label> <input type="text" id="userid" name="userid"> </div> <div> <label for="pwd">password</label> <input type="password" id="pwd" name="pwd"> </div> <div> <input id="image" type="image" src="/static/external/62/62ac2ecddbec0e0b54009
8c2
8451e57203e5cab46dfed7ab0115d5a659fcfb7b.png" alt="login" width="200" height="100"> </div> </form> css div { margin-bottom: 10px; } label { display: inline-block; width: 70px; text-align: right; padding-right: 10px; } #image { object-position: right top; object-fit: contain; background-color: #ddd; } here, object-position is configured to draw the image at the top-r...
<input type="month"> - HTML: Hypertext Markup Language
when the above value is submitted to the server, for example, it will look like bday-month=197
8-06.
... you can also get and set the date value in javascript using the htmlinputelement.value property, for example: <label for="bday-month">what month were you born in?</label> <input id="bday-month" type="month" name="bday-month" value="2017-06"> var monthcontrol = document.queryselector('input[type="month"]'); monthcontrol.value = '197
8-06'; additional attributes in addition to the attributes common to <input> elements, month inputs offer the following attributes: attribute description list the id of the <datalist> element that contains the optional pre-defined autocomplete options max the latest year and month to accept as a valid input min the earliest year and month to accept as a valid input readonly a boolean whic...
...for example: mmyyyy (07201
8) mm/yyyy (07/201
8) mm-yyyy (07-201
8) yyyy-mm (201
8-07) month yyyy (july 201
8) ...
<input type="password"> - HTML: Hypertext Markup Language
<label for="pin">pin:</label> <input id="pin" type="password" inputmode="numeric" minlength="4" maxlength="
8" size="
8"> selecting text as with other textual entry controls, you can use the select() method to select all the text in the password field.
... <label for="hexid">hex id: </label> <input id="hexid" type="password" pattern="[0-9a-fa-f]{4,
8}" title="enter an id consisting of 4-
8 hexadecimal digits" autocomplete="new-password"> disabled this boolean attribute indicates that the password field is not available for interaction.
...these numbers, used for tax and identification purposes in the us, are in the form "123-45-67
89".
<input type="search"> - HTML: Hypertext Markup Language
the example below requires that the entered value be 4–
8 characters in length.
... <form> <div> <label for="mysearch">search for user</label> <input type="search" id="mysearch" name="q" placeholder="user ids are 4–
8 characters in length" required size="30" minlength="4" maxlength="
8"> <button>search</button> <span class="validity"></span> </div> </form> input { margin-right: 10px; } input:invalid ~ span:after { content: '✖'; padding-left: 5px; position: absolute; } input:valid ~ span:after { content: '✓'; padding-left: 5px; position: absolute; } this renders like so: if you try to submit the form with less than 4 characters, you'll be given an appropriate error message (which differs between browsers).
... if you try to go beyond
8 characters in length, the browser won't let you.
<keygen> - HTML: Hypertext Markup Language
currently, the user is given a choice between "high" strength (204
8 bits) and "medium" strength (1024 bits).
...(note that only a subset of the curves named there may actually be supported in any particular browser.) if the keyparams parameter string is not a recognized curve name string, then a curve is chosen according to the user's chosen key strength (low, medium, high), using the curve named "secp3
84r1" for high, and the curve named "secp256r1" for medium keys.
... here is an example form submission as it would be delivered to a cgi program by the http server: commonname=john+doe&email=doe@foo.com&org=foobar+computing+corp.& orgunit=bureau+of+bureaucracy&locality=anytown&state=california&country=us& key=mihfmhewxdanbgkqhkig9w0baqefaanladbiakeanx0tiljromuue%2bptwbre6xfv%0awtkqbsshxk5zhcuwcwyvcniq9b
82qhjdoacdd34rqfcaind46fxkqunb0mvkzqid%0aaqabfhfnb3ppbgxhsxnneuzyawvuzdanbgkqhkig9w0baqqfaanbaakv2eex2n%2fs%0ar%2f7ijnrowlszsmttiqteb%2badwhgj9u1xruroilq%2fo2cuqxifzcnzkyakwp4dubqw%0ai0%2f%2frgbvmco%3d specifications specification status comment html5the definition of 'the <keygen> element' in that specification.
<meta>: The Document-level Metadata element - HTML: Hypertext Markup Language
if the attribute is present, its value must be an ascii case-insensitive match for the string "utf-
8".
... content-type if specified, the content attribute must have the value "text/html; charset=utf-
8".
... examples <meta charset="utf-
8"> <!-- redirect page after 3 seconds --> <meta http-equiv="refresh" content="3;url=https://www.mozilla.org"> specifications specification status comment html living standardthe definition of '<meta>' in that specification.
<video>: The Video Embed element - HTML: Hypertext Markup Language
<!-- using multiple sources as fallbacks for a video tag --> <!-- 'elephants dream' by orange open movie project studio, licensed under cc-3.0, hosted by archive.org --> <!-- poster hosted by wikimedia --> <video width="620" controls poster="https://upload.wikimedia.org/wikipedia/commons/e/e
8/elephants_dream_s5_both.jpg" > <source src="https://archive.org/download/elephantsdream/ed_1024_512kb.mp4" type="video/mp4"> <source src="https://archive.org/download/elephantsdream/ed_hd.ogv" type="video/ogg"> <source src="https://archive.org/download/elephantsdream/ed_hd.avi" type="video/avi"> your browser doesn't support html5 video tag.
...a relatively simple example is video/webm; codecs="vp
8, vorbis", which says that the file is a webm video using vp
8 for its video and vorbis for audio.
...this includes emotion and tone: 14 00:03:14 --> 00:03:1
8 [dramatic rock music] 15 00:03:19 --> 00:03:21 [whispering] what's that off in the distance?
itemscope - HTML: Hypertext Markup Language
<span itemprop="ratingvalue">4.0</span> stars based on <span itemprop="reviewcount">35</span> reviews </span> <br> prep time: <time datetime="pt30m" itemprop="preptime">30 min</time><br> cook time: <time datetime="pt1h" itemprop="cooktime">1 hou</time>r<br> total time: <time datetime="pt1h30m" itemprop="totaltime">1 hour 30 min</time><br> yield: <span itemprop="recipeyield">1 9" pie (
8 servings)</span><br> <span itemprop="nutrition" itemscope itemtype="http://schema.org/nutritioninformation"> serving size: <span itemprop="servingsize">1 medium slice</span><br> calories per serving: <span itemprop="calories">250 cal</span><br> fat per serving: <span itemprop="fatcontent">12 g</span><br> </span> <p> ingredients:<br> <span itemprop="recipeingredient">thin...
... structured data itemscope itemtype recipe itemprop name grandma's holiday apple pie itemprop image https://c1.staticflickr.com/1/30/42759561_
8631e2f905_n.jpg itemprop datepublished 2009-11-05 itemprop description this is my grandmother's apple pie recipe.
... itemprop preptime pt30m itemprop cooktime pt1h itemprop totaltime pt1h30m itemprop recipeyield 1 9" pie (
8 servings) itemprop recipeingredient thinly-sliced apples: 6 cups itemprop recipeingredient white sugar: 3/4 cup itemprop recipeinstructions 1.
HTTP authentication - HTTP
character encoding of http authentication browsers use utf-
8 encoding for usernames and passwords.
... firefox once used iso-
8859-1, but changed to utf-
8 for parity with other browsers and to avoid potential problems as described in bug 141965
8.
... bearer see rfc 6750, bearer tokens to access oauth 2.0-protected resources digest see rfc 7616, only md5 hashing is supported in firefox, see bug 472
823 for sha encryption support hoba see rfc 74
86, section 3, http origin-bound authentication, digital-signature-based mutual see rfc
8120 aws4-hmac-sha256 see aws docs basic authentication scheme the "basic" http authentication scheme is defined in rfc 7617, which transmits credentials as user id/password pairs, encoded using base64.
Content negotiation - HTTP
traditionally, it was set to a different value for each locale for the browser, like iso-
8859-1,utf-
8;q=0.7,*;q=0.7 for a western european locale.
... with utf-
8 now being well-supported, being the preferred way of encoding characters, and to guarantee better privacy through less configuration-based entropy, browsers omit the accept-charset header: internet explorer
8, safari 5, opera 11, firefox 10 and chrome 27 have abandoned this header.
...the value is a q-factor list (e.g.: br, gzip;q=0.
8) that indicates the priority of the encoding values.
Cache-Control - HTTP
cache-control: immutable cache-control: stale-while-revalidate=<seconds> cache-control: stale-if-error=<seconds> directives cacheability a response is normally cached by the browser if: it has a status code of 301, 302, 307, 30
8, or 410 and cache-control does not have no-store, or if proxy, does not have private and authorization is unset either has a status code of 301, 302, 307, 30
8, or 410 or has public, max-age or s-maxage in cache-control or has expires set public the response may be stored by any cache, even if the response is normally non-cacheable.
... cache-control: public, max-age=604
800, immutable requiring revalidation specifying no-cache or max-age=0 indicates that clients can cache a resource and must revalidate each time before using it.
... cache-control: no-cache cache-control: no-cache, max-age=0 specifications specification status comment rfc
8246: http immutable responses ietf rfc rfc 7234: hypertext transfer protocol (http/1.1): caching ietf rfc rfc 5
861: http cache-control extensions for stale content ietf rfc initial definition ...
Content-Disposition - HTTP
filename* the parameters filename and filename* differ only in that filename* uses the encoding defined in rfc 59
87.
... examples a response triggering the "save as" dialog: 200 ok content-type: text/html; charset=utf-
8 content-disposition: attachment; filename="cool.html" content-length: 21 <html>save me!</html> this simple html file will be saved as a regular download rather than displayed in the browser.
...t/form-data format that makes use of the content-disposition header: post /test.html http/1.1 host: example.org content-type: multipart/form-data;boundary="boundary" --boundary content-disposition: form-data; name="field1" value1 --boundary content-disposition: form-data; name="field2"; filename="example.txt" value2 --boundary-- specifications specification title rfc 757
8 returning values from forms: multipart/form-data rfc 6266 use of the content-disposition header field in the hypertext transfer protocol (http) rfc 21
83 communicating presentation information in internet messages: the content-disposition header field ...
CSP: script-src - HTTP
'<hash-algorithm>-<base64-value>' a sha256, sha3
84 or sha512 hash of scripts or styles.
...csp supports sha256, sha3
84 and sha512.
... content-security-policy: script-src 'sha256-b2yphkaxnvfwtrchibabymubfzdvfkkxhbwtwiddvf
8=' when generating the hash, don't include the <script> tags and note that capitalization and whitespace matter, including leading or trailing whitespace.
CSP: style-src - HTTP
'<hash-algorithm>-<base64-value>' a sha256, sha3
84 or sha512 hash of scripts or styles.
...csp supports sha256, sha3
84 and sha512.
... content-security-policy: style-src 'sha256-a33069
8cbe9dc4ef1fb12e2ee9fc06d5d14300262fa4dc5
87
8103ab7347e15
8f' when generating the hash, don't include the <style> tags and note that capitalization and whitespace matter, including leading or trailing whitespace.
Public-Key-Pins - HTTP
public-key-pins: pin-sha256="cupctazwkaasuywhhnedttwpy3obake3h2+sozs7sws="; pin-sha256="m
8hztczm3eluxkcjr2s5p4hhybnf6lhkmjahkhpgpwe="; max-age=51
84000; includesubdomains; report-uri="https://www.example.org/hpkp-report" in this example, pin-sha256="cupctazwkaasuywhhnedttwpy3obake3h2+sozs7sws=" pins the server's public key used in production.
... the second pin declaration pin-sha256="m
8hztczm3eluxkcjr2s5p4hhybnf6lhkmjahkhpgpwe=" also pins the backup key.
... max-age=51
84000 tells the client to store this information for two months, which is a reasonable time limit according to the ietf rfc.
Set-Cookie - HTTP
set-cookie: sessionid=3
8afes7a
8 permanent cookie instead of expiring when the client is closed, permanent cookies expire at a specific date (expires) or after a specific length of time (max-age).
... set-cookie: id=a3fwa; expires=wed, 21 oct 2015 07:2
8:00 gmt set-cookie: id=a3fwa; max-age=2592000 invalid domains a cookie for a domain that does not include the server that set it should be rejected by the user agent.
... the following cookie will be rejected if set by a server hosted on example.com: set-cookie: sessionid=e
8bb43229de9; domain=foo.example.com cookie prefixes cookies names prefixed with __secure- or __host- can be used only if they are set with the secure attribute from a secure (https) origin.
User-Agent - HTTP
examples mozilla/5.0 (x11; linux x
86_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 blink engine, which is why it almost looks the same, but adds "opr/<version>".
... examples mozilla/5.0 (x11; linux x
86_64) applewebkit/537.36 (khtml, like gecko) chrome/51.0.2704.106 safari/537.36 opr/3
8.0.2220.41 older, presto-based opera releases used: opera/9.
80 (macintosh; intel mac os x; u; en) presto/2.2.15 version/10.00 opera/9.60 (windows nt 6.0; u; en) presto/2.1.1 safari ua string in this example, the user agent string is mobile safari’s version.
... examples mozilla/5.0 (iphone; cpu iphone os 13_5_1 like mac os x) applewebkit/605.1.15 (khtml, like gecko) version/13.1.1 mobile/15e14
8 safari/604.1 internet explorer ua string examples mozilla/5.0 (compatible; msie 9.0; windows phone os 7.5; trident/5.0; iemobile/9.0) crawler and bot ua strings examples googlebot/2.1 (+http://www.google.com/bot.html) specifications specification title rfc 7231, section 5.5.3: user-agent hypertext transfer protocol (http/1.1): semantics and content rfc 2616, section 14.43: user-agent hypertext transfer protocol -- http/1.1 ...
WWW-Authenticate - HTTP
header type response header forbidden header name no syntax www-authenticate: <type> realm=<realm>[, charset="utf-
8"] directives <type> authentication type.
...the only allowed value is the case insensitive string "utf-
8".
... examples typically, a server response contains a www-authenticate header that looks like these: www-authenticate: basic www-authenticate: basic realm="access to the staging site", charset="utf-
8" see also http authentication for examples on how to configure apache or nginx servers to password protect your site with http basic authentication.
Redirections in HTTP - HTTP
30
8 permanent redirect method and body not changed.
...30
8 was created to remove the ambiguity of the behavior when using non-get methods.
... nginx in nginx, you create a specific server block for the content you want to redirect: server { listen
80; server_name example.com; return 301 $scheme://www.example.com$request_uri; } to apply a redirect to a directory or only certain pages, use the rewrite directive: rewrite ^/images/(.*)$ https://images.example.com/$1 redirect; rewrite ^/images/(.*)$ https://images.example.com/$1 permanent; iis in iis, you use the <httpredirect> element to configure redirections.
206 Partial Content - HTTP
status 206 partial content examples a response containing one single range: http/1.1 206 partial content date: wed, 15 nov 2015 06:25:24 gmt last-modified: wed, 15 nov 2015 04:5
8:0
8 gmt content-range: bytes 21010-47021/47022 content-length: 26012 content-type: image/gif ...
... a response containing several ranges: http/1.1 206 partial content date: wed, 15 nov 2015 06:25:24 gmt last-modified: wed, 15 nov 2015 04:5
8:0
8 gmt content-length: 1741 content-type: multipart/byteranges; boundary=string_separator --string_separator content-type: application/pdf content-range: bytes 234-639/
8000 ...the first range...
... --string_separator content-type: application/pdf content-range: bytes 4590-7999/
8000 ...the second range --string_separator-- specifications specification title rfc 7233, section 4.1: 206 partial content hypertext transfer protocol (http/1.1): range requests ...
412 Precondition Failed - HTTP
status 412 precondition failed examples etag: "33a64df551425fcc55e4d42a14
8795d9f25f
89d4" etag: w/"0
815" avoiding mid-air collisions with the help of the etag and the if-match headers, you can detect mid-air edit collisions.
... for example, when editing mdn, the current wiki content is hashed and put into an etag in the response: etag: "33a64df551425fcc55e4d42a14
8795d9f25f
89d4" when saving changes to a wiki page (posting data), the post request will contain the if-match header containing the etag values to check freshness against.
... if-match: "33a64df551425fcc55e4d42a14
8795d9f25f
89d4" if the hashes don't match, it means that the document has been edited in-between and a 412 precondition failed error is thrown.
A re-introduction to JavaScript (JS tutorial) - JavaScript
this takes the base for the conversion as an optional second argument, which you should always provide: parseint('123', 10); // 123 parseint('010', 10); // 10 in older browsers, strings beginning with a "0" are assumed to be in octal (radix
8), but this hasn't been the case since 2013 or so.
... unless you're certain of your string format, you can get surprising results on those older browsers: parseint('010'); //
8 parseint('0x10'); // 16 here, we see the parseint() function treat the first string as octal due to the leading 0, and the second string as hexadecimal due to the leading "0x".
...this is useful for checking for null objects before accessing their attributes: var name = o && o.getname(); or for caching values (when falsy values are invalid): var name = cachedname || (cachedname = getname()); javascript has a ternary operator for conditional expressions: var allowed = (age > 1
8) ?
Text formatting - JavaScript
caution: if you edit this page, do not include any characters above u+ffff, until mdn bug
85743
8 is fixed ( https://bugzilla.mozilla.org/show_bug.cgi?id=
85743
8 ).
... '\u{2f
804}' // the same with simple unicode escapes '\ud
87e\udc04' string objects the string object is a wrapper around the string primitive data type.
...(examples should be added to this page after mdn bug
85743
8 is fixed.) see also string.fromcodepoint() or string.prototype.codepointat().
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 201
8 ecmascript 201
8 language specification ecma-402 5th edition working draft, repository 201
8 ecmascript 201
8 internationalization api specification obsolete/historical editions ecma-262 pdf june 1997 ecmascript: a general purpose, cross-platform programming language.
... ecma-262 2nd edition pdf august 199
8 ecmascript language specification.
...ion pdf, html june 2015 ecmascript 2015 language specification ecma-402 2nd edition pdf june 2015 ecmascript 2015 internationalization api specification ecma-262 7th edition html june 2016 ecmascript 2016 language specification ecma-402 3rd edition html june 2016 ecmascript 2016 internationalization api specification ecma-262
8th edition html june 2017 ecmascript 2017 language specification ecma-402 4th edition html june 2017 ecmascript 2017 internationalization api specification es.next is a dynamic name that refers to whatever the next version is at the time of writing.
Deprecated and obsolete features - JavaScript
js1.7/js1.
8 array comprehension and js1.7/js1.
8 generator comprehension are deprecated.
... the following traps are obsolete: hasown (bug 9
80565, firefox 33).
... getenumerablepropertykeys (bug 7
83
829, firefox 37) getownpropertynames (bug 1007334, firefox 33) keys (bug 1007334, firefox 33) escape sequences octal escape sequences (\ followed by one, two, or three octal digits) are deprecated in string and regular expression literals.
Array.prototype.reduce() - JavaScript
if (k >= len) { throw new typeerror( 'reduce of empty array ' + 'with no initial value' ); } value = o[k++]; } //
8.
...ned in an array of objects using the spread operator and initialvalue // friends - an array of objects // where object field "books" is a list of favorite books let friends = [{ name: 'anna', books: ['bible', 'harry potter'], age: 21 }, { name: 'bob', books: ['war and peace', 'romeo and juliet'], age: 26 }, { name: 'alice', books: ['the lord of the rings', 'the shining'], age: 1
8 }] // allbooks - list which will contain all friends' books + // additional list contained in initialvalue let allbooks = friends.reduce(function(accumulator, currentvalue) { return [...accumulator, ...currentvalue.books] }, ['alphabet']) // allbooks = [ // 'alphabet', 'bible', 'harry potter', 'war and peace', // 'romeo and juliet', 'the lord of the rings', // 'the shining' // ] remove...
...pipe functionality const pipe = (...functions) => input => functions.reduce( (acc, fn) => fn(acc), input ) // composed functions for multiplication of specific values const multiply6 = pipe(double, triple) const multiply9 = pipe(triple, triple) const multiply16 = pipe(quadruple, quadruple) const multiply24 = pipe(double, triple, quadruple) // usage multiply6(6) // 36 multiply9(9) //
81 multiply16(16) // 256 multiply24(10) // 240 write map using reduce if (!array.prototype.mapusingreduce) { array.prototype.mapusingreduce = function(callback, thisarg) { return this.reduce(function(mappedarray, currentvalue, index, array) { mappedarray[index] = callback.call(thisarg, currentvalue, index, array) return mappedarray }, []) } } [1, 2, , 3].mapusingreduce(...
Array - JavaScript
let years = [1950, 1960, 1970, 19
80, 1990, 2000, 2010] console.log(years.0) // a syntax error console.log(years[0]) // works properly renderer.3d.settexture(model, 'character.png') // a syntax error renderer['3d'].settexture(model, 'character.png') // works properly in the 3d example, '3d' had to be quoted (because it begins with a digit).
... fruits.length = 10 console.log(fruits) // ['banana', 'apple', 'peach', empty x 2, 'mango', empty x 4] console.log(object.keys(fruits)) // ['0', '1', '2', '5'] console.log(fruits.length) // 10 console.log(fruits[
8]) // undefined decreasing the length property does, however, delete elements.
..., , , , , , , , , , , , , p,p,p,p,p,p,p,p r,n,b,q,k,b,n,r r,n,b,q,k,b,n,r p,p,p,p,p,p,p,p , , , , , , , , , , , , , , , , , ,p, , , , , , , , , , p,p,p,p, ,p,p,p r,n,b,q,k,b,n,r using an array to tabulate a set of values values = [] for (let x = 0; x < 10; x++){ values.push([ 2 ** x, 2 * x ** 2 ]) } console.table(values) results in // the first column is the index 0 1 0 1 2 2 2 4
8 3
8 1
8 4 16 32 5 32 50 6 64 72 7 12
8 9
8 8 256 12
8 9 512 162 specifications specification initial publication ecmascript (ecma-262)the definition of 'array' in that specification.
DataView.prototype.setBigInt64() - JavaScript
the highest possible value that fits in a signed 64-bit integer is 2n ** (64n -1n) - 1n (9223372036
854775
807n).
... upon overflow, it will be negative (-9223372036
854775
80
8n).
... examples using the setbigint64 method var buffer = new arraybuffer(
8); var dataview = new dataview(buffer); dataview.setbigint64(0, 3n); dataview.getbigint64(0); // 3n specifications specification ecmascript (ecma-262)the definition of 'dataview.prototype.setbigint64()' in that specification.
Date() constructor - JavaScript
(these formats are ietf-compliant rfc 2
822 timestamps, and also strings in a version of iso
8601.) note: parsing of date strings with the date constructor (and date.parse(), which works the same way) is strongly discouraged due to browser differences and inconsistencies.
... support for rfc 2
822 format strings is by convention only.
... support for iso
8601 formats differs in that date-only strings (e.g.
Date.prototype.getYear() - JavaScript
for example, if the year is 1
800, getyear() returns -100.
...for example, if the year is 1
856, the value returned is 1
856.
... var xmas = new date('december 25, 1
800 23:15:00'); var year = xmas.getyear(); // returns -100 setting and getting a year between 1900 and 1999 the third statement assigns the value 95 to the variable year, representing the year 1995.
Date.prototype.toISOString() - JavaScript
the toisostring() method returns a string in simplified extended iso format (iso
8601), which is always 24 or 27 characters long (yyyy-mm-ddthh:mm:ss.sssz or ±yyyyyy-mm-ddthh:mm:ss.sssz, respectively).
... syntax dateobj.toisostring() return value a string representing the given date in the iso
8601 format according to universal time.
...ullyear() + '-' + pad(this.getutcmonth() + 1) + '-' + pad(this.getutcdate()) + 't' + pad(this.getutchours()) + ':' + pad(this.getutcminutes()) + ':' + pad(this.getutcseconds()) + '.' + (this.getutcmilliseconds() / 1000).tofixed(3).slice(2, 5) + 'z'; }; })(); } examples using toisostring() let today = new date('05 october 2011 14:4
8 utc') console.log(today.toisostring()) // returns 2011-10-05t14:4
8:00.000z the above example uses parsing of a non–standard string value that may not be correctly parsed in non–mozilla browsers.
Date.prototype.toString() - JavaScript
"201
8" space hour: 2 digit hour of day, e.g.
..."sat sep 01 201
8 14:53:26 gmt+1400 (lint)" until ecmascript 201
8 (edition 9), the format of the string returned by date.prototype.tostring was implementation dependent.
... examples using tostring() the following assigns the tostring() value of a date object to myvar: var x = new date(); var myvar = x.tostring(); // assigns a string value to myvar in the same format as: // mon sep 0
8 199
8 14:36:22 gmt-0700 (pdt) specifications specification ecmascript (ecma-262)the definition of 'date.prototype.tostring' in that specification.
Intl.DateTimeFormat() constructor - JavaScript
possible values include: "buddhist", "chinese", "coptic", "ethiopia", "ethiopic", "gregory", "hebrew", "indian", "islamic", "iso
8601", "japanese", "persian", "roc".
...possible values include: "buddhist", "chinese", " coptic", "ethiopia", "ethiopic", "gregory", " hebrew", "indian", "islamic", "iso
8601", " japanese", "persian", "roc".
... var date = new date(date.utc(2012, 11, 20, 3, 0, 0)); // tolocalestring without arguments depends on the implementation, // the default locale, and the default time zone console.log(new intl.datetimeformat().format(date)); // → "12/19/2012" if run with en-us locale (language) and time zone america/los_angeles (utc-0
800) using timestyle and datestyle let o = new intl.datetimeformat("en" , { timestyle: "short" }); console.log(o.format(date.now())); // "13:31 am" let o = new intl.datetimeformat("en" , { datestyle: "short" }); console.log(o.format(date.now())); // "07/07/20" let o = new intl.datetimeformat("en" , { timestyle: "medium", datestyle: "short" }); console.log(o.format(date.now())); // "07/0...
Intl.NumberFormat - JavaScript
in order to get the format of the language used in the user interface of your application, make sure to specify that language (and possibly some fallback languages) using the locales argument: var number = 123456.7
89; // german uses comma as decimal separator and period for thousands console.log(new intl.numberformat('de-de').format(number)); // → 123.456,7
89 // arabic in most arabic speaking countries uses real arabic digits console.log(new intl.numberformat('ar-eg').format(number)); // → ١٢٣٤٥٦٫٧٨٩ // india uses thousands/lakh/crore separators console.log(new intl.numberformat('en-in').for...
...mat(number)); // → 1,23,456.7
89 // the nu extension key requests a numbering system, e.g.
... chinese decimal console.log(new intl.numberformat('zh-hans-cn-u-nu-hanidec').format(number)); // → 一二三,四五六.七八九 // when requesting a language that may not be supported, such as // balinese, include a fallback language, in this case indonesian console.log(new intl.numberformat(['ban', 'id']).format(number)); // → 123.456,7
89 using options the results can be customized using the options argument: var number = 123456.7
89; // request a currency format console.log(new intl.numberformat('de-de', { style: 'currency', currency: 'eur' }).format(number)); // → 123.456,79 € // the japanese yen doesn't use a minor unit console.log(new intl.numberformat('ja-jp', { style: 'currency', currency: 'jpy' }).format(number)); // → ¥123,457 // limit to three significant digi...
Math.E - JavaScript
the math.e property represents the base of natural logarithms, e, approximately 2.71
8.
... math.e=e≈2.71
8\mathtt{\mi{math.e}} = e \approx 2.71
8 the source for this interactive example is stored in a github repository.
... examples using math.e the following function returns e: function getnapier() { return math.e; } getnapier(); // 2.71
82
81
82
8459045 specifications specification ecmascript (ecma-262)the definition of 'math.e' in that specification.
Math.clz32() - JavaScript
fill in all the higher bits after the first one integer |= integer << 16; integer |= integer <<
8; integer |= integer << 4; integer |= integer << 2; integer |= integer << 1; // 2.
...erase all the higher bits after the first zero integer &= (integer << 16) | 0xffff; integer &= (integer <<
8 ) | 0x00ff; integer &= (integer << 4 ) | 0x000f; integer &= (integer << 2 ) | 0x0003; integer &= (integer << 1 ) | 0x0001; // 2.
...fill in all the higher bits after the first one // asmjs for some reason does not allow ^=,&=, or |= integer = integer | (integer << 16); integer = integer | (integer <<
8); integer = integer | (integer << 4); integer = integer | (integer << 2); integer = integer | (integer << 1); // 2.
Math - JavaScript
static properties math.e euler's constant and the base of natural logarithms; approximately 2.71
8.
... math.exp(x) returns ex, where x is the argument, and e is euler's constant (2.71
8…, the base of the natural logarithm).
... since humans tend to think in degrees, and some functions (such as css transforms) can accept degrees, it is a good idea to keep functions handy that convert between the two: function degtorad(degrees) { return degrees * (math.pi / 1
80); }; function radtodeg(rad) { return rad / (math.pi / 1
80); }; calculating the height of an equalateral triangle if we want to calculate the height of an equalateral triangle, and we know its side length is 100, we can use the formulae length of the adjacent multiplied by the tangent of the angle is equal to the opposite.
Object.prototype.toString() - JavaScript
the following code illustrates this: const o = new object(); o.tostring(); // returns [object object] note: starting in javascript 1.
8.5, tostring() called on null returns [object null], and undefined returns [object undefined], as defined in the 5th edition of ecmascript and subsequent errata.
... 10 numbers (like 1,2,3,4,5,.........) to another base numbers, in example below we are converting base 10 number to a base 2 (binary) number let basetenint = 10; console.log(basetenint.tostring(2)); // expected output is "1010" and same for big integers let bignum = bigint(20); console.log(bignum.tostring(2)); // expected output is "10100" some common radix are 2 for binary numbers,
8 for octal numbers, 10 for decimal numbers, 16 for hexadecimal numbers.
... const tostring = object.prototype.tostring; tostring.call(new date); // [object date] tostring.call(new string); // [object string] tostring.call(math); // [object math] // since javascript 1.
8.5 tostring.call(undefined); // [object undefined] tostring.call(null); // [object null] using tostring() in this way is unreliable; objects can change the behavior of object.prototype.tostring() by defining a symbol.tostringtag property, leading to unexpected results.
String.prototype.codePointAt() - JavaScript
https://mths.be/codepointat v0.2.0 by @mathias */ if (!string.prototype.codepointat) { (function() { 'use strict'; // needed to support `apply`/`call` with `undefined`/`null` var defineproperty = (function() { // ie
8 only supports `object.defineproperty` on dom elements try { var object = {}; var $defineproperty = object.defineproperty; var result = $defineproperty(object, object, object) && $defineproperty; } catch(error) {} return result; }()); var codepointat = function(position) { if (this == null) { throw typeerror(); } var strin...
...number(position) : 0; if (index != index) { // better `isnan` index = 0; } // account for out-of-bounds indices: if (index < 0 || index >= size) { return undefined; } // get the first code unit var first = string.charcodeat(index); var second; if ( // check if it’s the start of a surrogate pair first >= 0xd
800 && first <= 0xdbff && // high surrogate size > index + 1 // there is a next code unit ) { second = string.charcodeat(index + 1); if (second >= 0xdc00 && second <= 0xdfff) { // low surrogate // https://mathiasbynens.be/notes/javascript-encoding#surrogate-formulae return (first - 0xd
800) * 0x400 + second - 0xdc00 + 0x10000; } } ...
... return first; }; if (defineproperty) { defineproperty(string.prototype, 'codepointat', { 'value': codepointat, 'configurable': true, 'writable': true }); } else { string.prototype.codepointat = codepointat; } }()); } examples using codepointat() 'abc'.codepointat(1) // 66 '\ud
800\udc00'.codepointat(0) // 65536 'xyz'.codepointat(42) // undefined looping with codepointat() for (let codepoint of '\ud
83d\udc0e\ud
83d\udc71\u2764') { console.log(codepoint.codepointat(0).tostring(16)) } // '1f40e', '1f471', '2764' specifications specification ecmascript (ecma-262)the definition of 'string.prototype.codepointat' in that specification.
String.fromCodePoint() - JavaScript
rangeerror("invalid code point: " + codepoint); if (codepoint <= 0xffff) { // bmp code point codelen = codeunits.push(codepoint); } else { // astral code point; split in surrogate halves // https://mathiasbynens.be/notes/javascript-encoding#surrogate-formulae codepoint -= 0x10000; codelen = codeunits.push( (codepoint >> 10) + 0xd
800, // highsurrogate (codepoint % 0x400) + 0xdc00 // lowsurrogate ); } if (codelen >= 0x3fff) { result += stringfromcharcode.apply(null, codeunits); codeunits.length = 0; } } return result + stringfromcharcode.apply(null, codeunits); }; try { // ie
8 only supports `object.defineproperty` on dom elements ob...
...g, "fromcodepoint", { "value": fromcodepoint, "configurable": true, "writable": true }); } catch(e) { string.fromcodepoint = fromcodepoint; } }(string.fromcharcode)); examples using fromcodepoint() valid input: string.fromcodepoint(42); // "*" string.fromcodepoint(65, 90); // "az" string.fromcodepoint(0x404); // "\u0404" == "Є" string.fromcodepoint(0x2f
804); // "\ud
87e\udc04" string.fromcodepoint(194564); // "\ud
87e\udc04" string.fromcodepoint(0x1d306, 0x61, 0x1d307); // "\ud
834\udf06a\ud
834\udf07" invalid input: string.fromcodepoint('_'); // rangeerror string.fromcodepoint(infinity); // rangeerror string.fromcodepoint(-1); // rangeerror string.fromcodepoint(3.14); // rangeerror string.fromcodepoint(3e-2); // rangeerror s...
...instead, it requires the utf-16 surrogate pair in order to return a supplementary character: string.fromcharcode(0xd
83c, 0xdf03); // code point u+1f303 "night with string.fromcharcode(55356, 57091); // stars" == "\ud
83c\udf03" string.fromcodepoint(), on the other hand, can return 4-byte supplementary characters, as well as the more common 2-byte bmp characters, by specifying their code point (which is equivalent to the utf-32 code unit): string.fromcodepoint(0x1f303); // or 127747 in decimal specifications specification ecmascript (ecma-262)the definitio...
String - JavaScript
if you wish to compare without regard to upper or lower case characters, use a function similar to this: function isequal(str1, str2) { return str1.touppercase() === str2.touppercase() } // isequal upper case is used instead of lower case in this function, due to problems with certain utf-
8 character conversions.
... console.log(eval(s2.valueof())) // returns the number 4 escape notation special characters can be encoded using escape notation: code output \xxx (where xxx is 1–3 octal digits; range of 0–377) iso-
8859-1 character / unicode code point between u+0000 and u+00ff \' single quote \" double quote \\ backslash \n new line \r carriage return \v vertical tab \t tab \b backspace \f form feed \uxxxx (where xxxx is 4 hex digits; range of 0x0000–0xffff) utf-16 code unit / unicode cod...
...\u{xxxxxx} (where x…xxxxxx is 1–6 hex digits; range of 0x0–0x10ffff) utf-32 code unit / unicode code point between u+0000 and u+10ffff \xxx (where xx is 2 hex digits; range of 0x00–0xff) iso-
8859-1 character / unicode code point between u+0000 and u+00ff long literal strings sometimes, your code will include strings which are very long.
TypedArray.from() - JavaScript
syntax typedarray.from(source[, mapfn[, thisarg]]) where typedarray is one of: int
8array uint
8array uint
8clampedarray int16array uint16array int32array uint32array float32array float64array bigint64array biguint64array parameters source an array-like or iterable object to convert to a typed array.
... if (!int
8array.__proto__.from) { (function () { int
8array.__proto__.from = function (obj, func, thisobj) { var typedarrayclass = int
8array.__proto__; if(typeof this !== 'function') { throw new typeerror('# is not a constructor'); } if (this.__proto__ !== typedarrayclass) { throw new typeerror('this is not a typed a...
...opy_data.push(obj[i]); } copy_data = copy_data.map(func, thisobj); var typed_array = new this(copy_data.length); for(var i = 0; i < typed_array.length; i++) { typed_array[i] = copy_data[i]; } return typed_array; } })(); } examples from an iterable object (set) const s = new set([1, 2, 3]); uint
8array.from(s); // uint
8array [ 1, 2, 3 ] from a string int16array.from('123'); // int16array [ 1, 2, 3 ] use with arrow function and map using an arrow function as the map function to manipulate the elements float32array.from([1, 2, 3], x => x + x); // float32array [ 2, 4, 6 ] generate a sequence of numbers uint
8array.from({length: 5}, (v, k) => k); // uint
8array [ 0, 1, 2, 3, 4 ] spec...
TypedArray.prototype.some() - JavaScript
// https://tc39.github.io/ecma262/#sec-%typedarray%.prototype.some if (!uint
8array.prototype.some) { object.defineproperty(uint
8array.prototype, 'some', { value: array.prototype.some }); } if you need to support truly obsolete javascript engines that don't support object.defineproperty, it's best not to polyfill array.prototype methods at all, as you can't make them non-enumerable.
... function isbiggerthan10(element, index, array) { return element > 10; } new uint
8array([2, 5,
8, 1, 4]).some(isbiggerthan10); // false new uint
8array([12, 5,
8, 1, 4]).some(isbiggerthan10); // true testing typed array elements using arrow functions arrow functions provide a shorter syntax for the same test.
... new uint
8array([2, 5,
8, 1, 4]).some(elem => elem > 10); // false new uint
8array([12, 5,
8, 1, 4]).some(elem => elem > 10); // true specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.some' in that specification.
WebAssembly.Instance - JavaScript
rt 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.0instance() constructorchrome 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 ...
...rt 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.0exportschrome 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 ...
...rt 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.0legend full support full support no support no supportsee implementation notes.see implementation notes.
encodeURI() - JavaScript
the encodeuri() function encodes a uri by replacing each instance of certain characters by one, two, three, or four escape sequences representing the utf-
8 encoding of the character (will only be four escape sequences for characters composed of two "surrogate" characters).
...note how certain characters are used to signify special meaning: http://username:password@www.example.com:
80/path/to/file.php?foo=316&bar=this+has+spaces#anchor hence encodeuri() does not encode characters that are necessary to formulate a complete uri.
... encoding a lone high surrogate throws an urierror will be thrown if one attempts to encode a surrogate which is not part of a high-low pair, e.g., // high-low pair ok console.log(encodeuri('\ud
800\udfff')); // lone high surrogate throws "urierror: malformed uri sequence" console.log(encodeuri('\ud
800')); // lone low surrogate throws "urierror: malformed uri sequence" console.log(encodeuri('\udfff')); encoding for ipv6 if one wishes to follow the more recent rfc39
86 for urls, which makes square brackets reserved (for ipv6) and thus not encoded when forming something which could be par...
in operator - JavaScript
/ returns false 'bay' in trees // returns false (you must specify the index number, not the value at that index) 'length' in trees // returns true (length is an array property) symbol.iterator in trees // returns true (arrays are iterable, works only in es2015+) // predefined objects 'pi' in math // returns true // custom objects let mycar = {make: 'honda', model: 'accord', year: 199
8} 'make' in mycar // returns true 'model' in mycar // returns true you must specify an object on the right side of the in operator.
... let mycar = {make: 'honda', model: 'accord', year: 199
8} delete mycar.make 'make' in mycar // returns false let trees = new array('redwood', 'bay', 'cedar', 'oak', 'maple') delete trees[3] 3 in trees // returns false if you set a property to undefined but do not delete it, the in operator returns true for that property.
... let mycar = {make: 'honda', model: 'accord', year: 199
8} mycar.make = undefined 'make' in mycar // returns true let trees = new array('redwood', 'bay', 'cedar', 'oak', 'maple') trees[3] = undefined 3 in trees // returns true the in operator will return false for empty array slots.
Web app manifests
ng_idiconslangnameorientationprefer_related_applicationsrelated_applicationsscopescreenshotsserviceworkershort_nameshortcutsstart_urltheme_color example manifest { "name": "hackerweb", "short_name": "hackerweb", "start_url": ".", "display": "standalone", "background_color": "#fff", "description": "a simply readable hacker news app.", "icons": [{ "src": "images/touch/homescreen4
8.png", "sizes": "4
8x4
8", "type": "image/png" }, { "src": "images/touch/homescreen72.png", "sizes": "72x72", "type": "image/png" }, { "src": "images/touch/homescreen96.png", "sizes": "96x96", "type": "image/png" }, { "src": "images/touch/homescreen144.png", "sizes": "144x144", "type": "image/png" }, { "src": "images/touch/homescreen16
8.png", ...
... "sizes": "16
8x16
8", "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).
...this splashscreen is auto-generated from properties in the web app manifest, specifically: name background_color the icon in the icons array that is closest to 12
8dpi for the device.
Add to Home screen - Progressive web apps (PWAs)
firefox has had mobile support since v5
8 and is working on desktop support.
...(note: in android
8 and higher, a system-level "add to home screen" permission dialog will be shown first.) if you have mobile chrome available, the experience is slightly different; upon loading our site, you'll see an install banner pop up asking whether you want to add this app to your home screen.
...> { if (choiceresult.outcome === 'accepted') { console.log('user accepted the a2hs prompt'); } else { console.log('user dismissed the a2hs prompt'); } deferredprompt = null; }); }); }); so here we: call event.preventdefault() to stop chrome 67 and earlier from calling the install prompt automatically (this behavior changed in chrome 6
8).
Structural overview of progressive web apps - Progressive web apps (PWAs)
<!doctype html> <html lang="en"> <head> <meta charset="utf-
8"> <title>js13kgames a-frame entries</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:imag...
...you can <a href="https://github.com/mdn/pwa-examples/blob/master/js13kpwa"> fork js13kpwa on github</a> to check its source code.</p> <button id="notifications">request dummy notifications</button> <section id="content"> // content inserted in here </section> </main> <footer> <p>© js13kgames 2012-201
8, created and maintained by <a href="http://end3r.com"> andrzej mazur</a> from <a href="http://enclavegames.com">enclave games</a>.</p> </footer> </body> </html> the <head> section contains basic information about the app, including its title, description, and the needed references to its css file, web manifest, the main application javascript file (app.js, in which the app is initialized...
..., '/pwa-examples/js13kpwa/fonts/graduate.ttf', '/pwa-examples/js13kpwa/fonts/graduate.woff', '/pwa-examples/js13kpwa/favicon.ico', '/pwa-examples/js13kpwa/img/js13kgames.png', '/pwa-examples/js13kpwa/img/bg.png', '/pwa-examples/js13kpwa/icons/icon-32.png', '/pwa-examples/js13kpwa/icons/icon-64.png', '/pwa-examples/js13kpwa/icons/icon-96.png', '/pwa-examples/js13kpwa/icons/icon-12
8.png', '/pwa-examples/js13kpwa/icons/icon-16
8.png', '/pwa-examples/js13kpwa/icons/icon-192.png', '/pwa-examples/js13kpwa/icons/icon-256.png', '/pwa-examples/js13kpwa/icons/icon-512.png' ]; var gamesimages = []; for(var i=0; i<games.length; i++) { gamesimages.push('data/img/'+games[i].slug+'.jpg'); } var contenttocache = appshellfiles.concat(gamesimages); with the file list prepared, it...
clip-path - SVG: Scalable Vector Graphics
<line>, <marker>, <mask>, <path>, <pattern>, <polygon>, <polyline>, <rect>, <svg>, <symbol>, <text>, <use> html,body,svg { height:100% } <svg viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> <clippath id="myclip" clippathunits="objectboundingbox"> <circle cx=".5" cy=".5" r=".5" /> </clippath> <!-- top-left: apply a custom defined clipping path --> <rect x="1" y="1" width="
8" height="
8" stroke="green" clip-path="url(#myclip)" /> <!-- top-right: apply a css basic shape on a fill-box geometry.
... this is the same as having a custom clipping path with a clippathunits set to objectboundingbox --> <rect x="11" y="1" width="
8" height="
8" stroke="green" clip-path="circle() fill-box" /> <!-- bottom-left --> <rect x="1" y="11" width="
8" height="
8" stroke="green" clip-path="circle() stroke-box" /> <!-- bottom-right: apply a css basic shape on a view-box geometry.
... this is the same as having a custom clipping path with a clippathunits set to userspaceonuse --> <rect x="11" y="11" width="
8" height="
8" stroke="green" clip-path="circle() view-box" /> </svg> usage notes value <url> | [ <basic-shape> || <geometry-box> ] | none default value none animatable yes <geometry-box> an extra information to tell how a <basic-shape> is applied to an element: fill-box indicates to use the object bounding box; stroke-box indicates to use the object bounding box extended with the stroke; view-box indicates to use the nearest svg viewport as the reference box.
glyph-orientation-horizontal - SVG: Scalable Vector Graphics
when the reference orientation direction is horizontal and the glyph-orientation-horizontal results in an orientation angle that is a multiple of 1
80 degrees, then the current text position is incremented according to the horizontal metrics of the glyph.
... otherwise, if the value of this attribute is not a multiple of 1
80 degrees, then the current text position is incremented according to the vertical metrics of the glyph.
... as a presentation attribute, it can be applied to any element but it has effect only on the following five elements: <altglyph>, <textpath>, <text>, <tref>, and <tspan> context notes value <angle> default value 0deg animatable no <angle> the value of the angle is restricted to 0, 90, 1
80, and 270 degrees.
glyph-orientation-vertical - SVG: Scalable Vector Graphics
when the inline-progression-direction is vertical and the glyph-orientation-vertical results in an orientation angle that is a multiple of 1
80 degrees, then the current text position is incremented according to the vertical metrics of the glyph.
... otherwise, if the angle is not a multiple of 1
80 degrees, then the current text position is incremented according to the horizontal metrics of the glyph.
... <angle> the value of the angle is restricted to 0, 90, 1
80, and 270 degrees.
points - SVG: Scalable Vector Graphics
two elements are using this attribute: <polyline>, and <polygon> html,body,svg { height:100% } <svg viewbox="-10 -10 220 120" xmlns="http://www.w3.org/2000/svg"> <!-- polyline is an open shape --> <polyline stroke="black" fill="none" points="50,0 21,90 9
8,35 2,35 79,90"/> <!-- polygon is a closed shape --> <polygon stroke="black" fill="none" transform="translate(100,0)" points="50,0 21,90 9
8,35 2,35 79,90"/> <!-- it is usualy considered best practices to separate a x and y coordinate with a comma and a group of coordinates by a space.
... value [ <number>+ ]# default value none animatable yes example html,body,svg { height:100% } <svg viewbox="-10 -10 120 120" xmlns="http://www.w3.org/2000/svg"> <!-- polyline is an open shape --> <polyline stroke="black" fill="none" points="50,0 21,90 9
8,35 2,35 79,90"/> </svg> polygon for <polygon>, points defines a list of points, each representing a vertex of the shape to be drawn.
... value [ <number>+ ]# default value none animatable yes example html,body,svg { height:100% } <svg viewbox="-10 -10 120 120" xmlns="http://www.w3.org/2000/svg"> <!-- polygon is an closed shape --> <polygon stroke="black" fill="none" points="50,0 21,90 9
8,35 2,35 79,90" /> </svg> specifications specification status comment scalable vector graphics (svg) 2the definition of 'points' in that specification.
preserveAspectRatio - SVG: Scalable Vector Graphics
example <svg viewbox="-1 -1 162 92" xmlns="http://www.w3.org/2000/svg"> <defs> <path id="smiley" d="m50,10 a40,40,1,1,1,50,90 a40,40,1,1,1,50,10 m30,40 q36,35,42,40 m5
8,40 q64,35,70,40 m30,60 q50,75,70,60 q50,75,30,60" /> </defs> <!-- (width>height) meet --> <svg preserveaspectratio="xmidymid meet" x="0" y="0" viewbox="0 0 100 100" width="20" height="10"><use href="#smiley" /></svg> <svg preserveaspectratio="xminymid meet" x="25" y="0" viewbox="0 0 100 100" width="20" height="10"><use href="#smiley" /></svg> <svg preserveaspectratio="xmaxymid...
...><use href="#smiley" /></svg> <!-- none --> <svg preserveaspectratio="none" x="0" y="30" viewbox="0 0 100 100" width="160" height="60"><use href="#smiley" /></svg> </svg> topexample html,body,svg { height:100% } <svg viewbox="-1 -1 162 92" xmlns="http://www.w3.org/2000/svg"> <defs> <path id="smiley" d="m50,10 a40,40,1,1,1,50,90 a40,40,1,1,1,50,10 m30,40 q36,35,42,40 m5
8,40 q64,35,70,40 m30,60 q50,75,70,60 q50,75,30,60" /> </defs> <!-- (width>height) meet --> <rect x="0" y="0" width="20" height="10"> <title>xmidymid meet</title> </rect> <svg viewbox="0 0 100 100" width="20" height="10" preserveaspectratio="xmidymid meet" x="0" y="0"> <use href="#smiley" /> </svg> <rect x="25" y="0" width="20" height="10"> <title>xminymid meet</t...
...t="25" preserveaspectratio="xmaxymid slice" x="150" y="0"> <use href="#smiley" /> </svg> <!-- none --> <rect x="0" y="30" width="160" height="60"> <title>none</title> </rect> <svg viewbox="0 0 100 100" width="160" height="60" preserveaspectratio="none" x="0" y="30"> <use href="#smiley" /> </svg> </svg> path { fill: yellow; stroke: black; stroke-width:
8px; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; } rect:hover, rect:active { outline: 1px solid red; } syntax preserveaspectratio="<align> [<meetorslice>]" its value is made of one or two keywords: a required alignment value and an optional "meet or slice" reference as described below: alignment value the alignment value indicates whether to force uniform...
Content type - SVG: Scalable Vector Graphics
the normative definition of these keywords is found in user preferences for colors (css2, section 1
8.2).
... | "rgb("integer, integer, integer")" | "rgb("integer "%", integer "%", integer "%)" | color-keyword hexdigit ::= [0-9a-fa-f] where color-keyword matches (case insensitively) one of the color keywords listed in css color module level 3, or one of the system color keywords listed in user preferences for colors (css2, section 1
8.2).
... unless stated otherwise for a particular attribute or property, the range for an <integer> encompasses (at a minimum) -21474
8364
8 to 21474
83647.
<feComponentTransfer> - SVG: Scalable Vector Graphics
xmlns="http://www.w3.org/2000/svg" viewbox="0 0 600 300"> <defs> <lineargradient id="rainbow" gradientunits="userspaceonuse" x1="0" y1="0" x2="100%" y2="0"> <stop offset="0" stop-color="#ff0000"></stop> <stop offset="0.2" stop-color="#ffff00"></stop> <stop offset="0.4" stop-color="#00ff00"></stop> <stop offset="0.6" stop-color="#00ffff"></stop> <stop offset="0.
8" stop-color="#0000ff"></stop> <stop offset="1" stop-color="#
8000
80"></stop> </lineargradient> <filter id="identity" x="0" y="0" width="100%" height="100%"> <fecomponenttransfer> <fefuncr type="identity"></fefuncr> <fefuncg type="identity"></fefuncg> <fefuncb type="identity"></fefuncb> <fefunca type="identity"></fefunca> </fecomponenttransf...
...></fefuncr> <fefuncg type="gamma" amplitude="4" exponent="4" offset="0"></fefuncg> <fefuncb type="gamma" amplitude="4" exponent="1" offset="0"></fefuncb> </fecomponenttransfer> </filter> </defs> <g font-weight="bold"> <text x="0" y="20">default</text> <rect x="0" y="30" width="100%" height="20"></rect> <text x="0" y="70">identity</text> <rect x="0" y="
80" width="100%" height="20" style="filter:url(#identity)"></rect> <text x="0" y="120">table lookup</text> <rect x="0" y="130" width="100%" height="20" style="filter:url(#table)"></rect> <text x="0" y="170">discrete table lookup</text> <rect x="0" y="1
80" width="100%" height="20" style="filter:url(#discrete)"></rect> <text x="0" y="220">linear function</text> <rect x="0" y="...
...230" width="100%" height="20" style="filter:url(#linear)"></rect> <text x="0" y="270">gamma function</text> <rect x="0" y="2
80" width="100%" height="20" style="filter:url(#gamma)"></rect> </g> </svg> css rect { fill: url(#rainbow); } result specifications specification status comment filter effects module level 1the definition of '<fecomponenttransfer>' in that specification.
<feDiffuseLighting> - SVG: Scalable Vector Graphics
<svg width="440" height="140" xmlns="http://www.w3.org/2000/svg"> <!-- no light is applied --> <text text-anchor="middle" x="60" y="22">no light</text> <circle cx="60" cy="
80" r="50" fill="green" /> <!-- the light source is a fepointlight element --> <text text-anchor="middle" x="170" y="22">fepointlight</text> <filter id="lightme1"> <fediffuselighting in="sourcegraphic" result="light" lighting-color="white"> <fepointlight x="150" y="60" z="20" /> </fediffuselighting> <fecomposite in="sourcegraphic" in2="light" opera...
...tor="arithmetic" k1="1" k2="0" k3="0" k4="0"/> </filter> <circle cx="170" cy="
80" r="50" fill="green" filter="url(#lightme1)" /> <!-- the light source is a fedistantlight element --> <text text-anchor="middle" x="2
80" y="22">fedistantlight</text> <filter id="lightme2"> <fediffuselighting in="sourcegraphic" result="light" lighting-color="white"> <fedistantlight azimuth="240" elevation="20"/> </fediffuselighting> <fecomposite in="sourcegraphic" in2="light" operator="arithmetic" k1="1" k2="0" k3="0" k4="0"/> </filter> <circle cx="2
80" cy="
80" r="50" fill="green" filter="url(#lightme2)" /> <!-- the light source is a fespotlight source --> <text text-anchor="middle" x="390" y="22">fespotlight</text> <filter id="light...
...me3"> <fediffuselighting in="sourcegraphic" result="light" lighting-color="white"> <fespotlight x="360" y="5" z="30" limitingconeangle="20" pointsatx="390" pointsaty="
80" pointsatz="0"/> </fediffuselighting> <fecomposite in="sourcegraphic" in2="light" operator="arithmetic" k1="1" k2="0" k3="0" k4="0"/> </filter> <circle cx="390" cy="
80" r="50" fill="green" filter="url(#lightme3)" /> </svg> expected rendering: live rendering: specifications specification status comment filter effects module level 1the definition of '<fediffuselighting>' in that specification.
Basic shapes - SVG: Scalable Vector Graphics
10" rx="10" ry="10" width="30" height="30" stroke="black" fill="transparent" stroke-width="5"/> <circle cx="25" cy="75" r="20" stroke="red" fill="transparent" stroke-width="5"/> <ellipse cx="75" cy="75" rx="20" ry="5" stroke="red" fill="transparent" stroke-width="5"/> <line x1="10" x2="50" y1="110" y2="150" stroke="orange" stroke-width="5"/> <polyline points="60 110 65 120 70 115 75 130
80 125
85 140 90 135 95 150 100 145" stroke="orange" fill="transparent" stroke-width="5"/> <polygon points="50 160 55 1
80 70 1
80 60 190 65 205 50 195 35 205 40 190 30 1
80 45 1
80" stroke="green" fill="transparent" stroke-width="5"/> <path d="m20,230 q40,205 50,230 t90,230" fill="none" stroke="blue" stroke-width="5"/> </svg> note: the stroke, stroke-width, and fill attributes are e...
...since the list of points can get quite long, all the points are included in one attribute: <polyline points="60, 110 65, 120 70, 115 75, 130
80, 125
85, 140 90, 135 95, 150 100, 145"/> points a list of points.
... <polygon points="50, 160 55, 1
80 70, 1
80 60, 190 65, 205 50, 195 35, 205 40, 190 30, 1
80 45, 1
80"/> points a list of points, each number separated by a space, comma, eol, or a line feed character.
Same-origin policy - Web security
comparisons with the url http://store.company.com/dir/page.html: url outcome reason http://store.company.com/dir2/other.html same origin only the path differs http://store.company.com/dir/inner/another.html same origin only the path differs https://store.company.com/page.html failure different protocol http://store.company.com:
81/dir/page.html failure different port (http:// is port
80 by default) http://news.company.com/dir/page.html failure different host inherited origins scripts executed from pages with an about:blank or javascript: url inherit the origin of the document containing that url, since these types of urls do not contain information about an origin server.
...therefore, https://company.com:
81/index.html and https://company.com/index.html are considered the same origin and no restrictions are applied.
...therefore, one cannot make company.com:
80
80 talk to company.com by only setting document.domain = "company.com" in the first.
Features restricted to secure contexts - Web security
api chrome edge safari firefox application cache restricted to secure contexts planned in chrome 70 deprecation planning started in february 201
8 public interest on deprecation webkit bug 1
82442 restricted to secure contexts in firefox 62 geolocation restricted to secure contexts in 50 restricted to secure contexts in 10 restricted to secure contexts in 55 device orientaion / device motion deprecation warning deprecation warnings since 60.
... encrypted media extensions restricted to secure contexts in 5
8 planned.
... restricted to secure contexts in firefox 6
8.
XML introduction - XML: Extensible Markup Language
<?xml version="1.0" encoding="utf-
8"?> attributes: version : used version xml in this document.
... example <?xml version="1.0" encoding="utf-
8"?> <message> <warning> hello world <!--missing </warning> --> </message> now let's look at a corrected version of that same document: <?xml version="1.0" encoding="utf-
8"?> <message> <warning> hello world </warning> </message> a document that contains an undefined tag is invalid.
...for example, to create a new &warning; entity, you can do this: <?xml version="1.0" encoding="utf-
8"?> <!doctype body [ <!entity warning "warning: something bad happened...
For Further Reading - XSLT: Extensible Stylesheet Language Transformations
kay length: 992 pages publisher: wrox; 2 edition (may 3, 2001) isbn: 0764543
814 michael kay is a member of the w3c xsl working group and the developer of his own open-source xslt processor, saxon.
... http://www.amazon.com/xslt-programme.../dp/0764543
814 xslt author: doug tidwell length: 473 pages publisher: o'reilly media; 1 edition (august 15, 2001) isbn: 0596000537 doug tidwell is a senior developer at ibm and a prominent evangelist for xml technologies generally.
...ken holman location: http://www.xml.com/pub/a/2000/0
8/holman/index.html tutorials/examples zvon xsl programmers: http://www.zvon.org/o_html/group_xsl.html jeni's xslt pages index: http://www.jenitennison.com/xslt/ xmlpitstop.com stylesheet center: http://www.xmlpitstop.com/default.asp?datatype=ssc xsl tutorial index: http://www.nwalsh.com/docs/tutorials/xsl/ other cover pages extensi...
SDK API Lifecycle - Archive of obsolete content
migration the deprecation period defaults to 1
8 weeks (that is, three releases) although in some cases, generally those out of our control, it might be shorter than this.
... removal the target removal date is 1
8 weeks after deprecation.
simple-prefs - Archive of obsolete content
"preferences": [{ "name": "somepreference", "title": "some preference title", "description": "some short description for the preference", "type": "string", "value": "this is the default string value" }, { "description": "how many of them we have.", "name": "myinteger", "type": "integer", "value":
8, "title": "how many?" }] } each preference is defined by a group of attributes.
... { "description": "how many eyes?", "type": "integer", "name": "eyecount", "value":
8, "title": "eye count" } string displayed as a textbox and stores a string.
simple-storage - Archive of obsolete content
to store a value, just assign it to a property on storage: var ss = require("sdk/simple-storage"); ss.storage.myarray = [1, 1, 2, 3, 5,
8, 13]; ss.storage.myboolean = true; ss.storage.mynull = null; ss.storage.mynumber = 3.1337; ss.storage.myobject = { a: "foo", b: { c: true }, d: null }; ss.storage.mystring = "o frabjous day!"; you can store array, boolean, number, object, null, and string values.
...currently this limit is about five megabytes (5,242,
880 bytes).
/loader - Archive of obsolete content
optionally more options may be specified: options.encoding: source encoding, defaults to 'utf-
8'.
... options.version: version of js used, defaults to '1.
8'.
dev/panel - Archive of obsolete content
// with the 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(...
ui/button/action - Archive of obsolete content
on a device with a "normal" screen resolution, the toolbar has space for 1
8 x 1
8 pixels and the menu panel has space for 32 x 32 pixels.
...however, the icons in the toolbar will not quite fill the space available, so you can instead supply four icons: icon: { "1
8": "./addon1
8.png", // toolbar icon non hidpi "32": "./addon32.png", // menu panel icon non hidpi "36": "./addon36.png", // toolbar icon hidpi "64": "./addon64.png" // menu panel icon hidpi } optional options: name type disabled boolean determines whether the button is disabled.
ui/button/toggle - Archive of obsolete content
on a device with a "normal" screen resolution, the toolbar has space for 1
8 x 1
8 pixels and the menu panel has space for 32 x 32 pixels.
...however, the icons in the toolbar will not quite fill the space available, so you can instead supply four icons: icon: { "1
8": "./addon1
8.png", // toolbar icon non hidpi "32": "./addon32.png", // menu panel icon non hidpi "36": "./addon36.png", // toolbar icon hidpi "64": "./addon64.png" // menu panel icon hidpi } optional options: name type disabled boolean determines whether the button is disabled.
ui/frame - Archive of obsolete content
it occupies the whole width of the browser window and is 1
8 pixels high on a normal-resolution display or 36 pixels high on a high-resolution (hidpi) display.
...this issue is being tracked as bug 9
823
85.
util/uuid - Archive of obsolete content
generate uuid to generate a new uuid, call uuid() with no arguments: let uuid = require('sdk/util/uuid').uuid(); parsing uuid to convert a string representation of a uuid to an nsid, pass the string representation to uuid(): let { uuid } = require('sdk/util/uuid'); let firefoxuuid = uuid('{ec
8030f7-c20a-464f-9b0e-13a3a9e973
84}'); globals functions uuid(stringid) generate a new uuid, or convert a string representation of a uuid to an nsid.
... parameters stringid : string string representation of a uuid, such as: "
8cbc9bf4-4a16-11e2-aef7-c1a561
88709b" optional.
Creating annotations - Archive of obsolete content
deprecated in firefox 29 and removed in firefox 3
8.
...tion editor html the html is very simple: <!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" xml:lang="en"> <head> <title>annotation</title> <style type="text/css" media="all"> body { font: 100% arial, helvetica, sans-serif; background-color: #f5f5f5; } textarea { width: 1
80px; height: 1
80px; margin: 10px; padding: 0px; } </style> </head> <body> <textarea rows='10' cols='20' id='annotation-box'> </textarea> </body> </html> save this inside data/editor as annotation-editor.html.
Displaying annotations - Archive of obsolete content
deprecated in firefox 29 and removed in firefox 3
8.
... updating main.js finally, update main.js with the code to construct the annotation panel: var annotation = panels.panel({ width: 200, height: 1
80, contenturl: data.url('annotation/annotation.html'), contentscriptfile: [data.url('jquery-1.4.2.min.js'), data.url('annotation/annotation.js')], onshow: function() { this.postmessage(this.content); } }); execute cfx run one last time.
Storing annotations - Archive of obsolete content
deprecated in firefox 29 and removed in firefox 3
8.
... 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-...
Developing for Firefox Mobile - Archive of obsolete content
then type: adb devices you should see some output like: list of devices attached 51
800f220f01564 device (the long hex string will be different.) if you do, then adb has found your device and you can get started.
...info: starting info: starting zerdatime 132925
852
89
88 - browser chrome startup finished.
Unit Testing - Archive of obsolete content
if we run the add-on and click the button, we should see the following logging output: info: agvsbg
8= info: hello testing the base64 module navigate to the add-on's test directory and delete the test-index.js file.
... in its place create a file called test-base64.js with the following contents: var base64 = require("../base64"); exports["test atob"] = function(assert) { assert.ok(base64.atob("agvsbg
8=") == "hello", "atob works"); } exports["test btoa"] = function(assert) { assert.ok(base64.btoa("hello") == "agvsbg
8=", "btoa works"); } exports["test empty string"] = function(assert) { assert.throws(function() { base64.atob(); }, "empty string check works"); } require("sdk/test").run(exports); note that with jpm we must give the exact relative path to the base64.js module.
Localization - Archive of obsolete content
the files: use the .properties format are named "xx-yy.properties", where "xx-yy" is the name of the locale in question contain one entry for each string you want to localize, consisting of an identifier for the string and its translation in that locale, in the format identifier=translation need to use utf-
8 without bom encoding lines starting with "#" (after optional whitespace) are comments suppose your add-on contains a single localizable string, represented in english as "hello!", and you want to supply us english and french french localizations.
...see bug 7
87351.
HTML in XUL for rich tooltips - Archive of obsolete content
this example is what the final xul overlay could look like, assuming a javascript overlay titled overlay.js: <?xml version="1.0" encoding="utf-
8"?> <overlay id="htmltip-overlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:html="http://www.w3.org/1999/xhtml"> <script type="application/x-javascript" src="overlay.js"/> <popup id="contentareacontextmenu"> <menuitem id="htmltip1" label="foo1" onmouseover="htmltip.onmousetooltip(event)" tooltip="myhtmltip" /> <menuitem id="htmlt...
... <?xml version="1.0" encoding="utf-
8"?> <overlay id="htmltip-overlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:html="http://www.w3.org/1999/xhtml"> <script type="application/x-javascript" src="overlay.js"/> <popup id="contentareacontextmenu"> <menuitem id="htmltip3" label="foo3" tooltip="mytip3html" /> </popup> <popupset id="mainpopupset"> <tooltip id="...
Preferences - Archive of obsolete content
s into the default location: var prefservice = components.classes["@mozilla.org/preferences-service;1"] .getservice(components.interfaces.nsiprefservice); prefservice.savepreffile(null); checking for existence of a key if you try to get the value of a nonexistent preference, an error will be thrown: error: ns_error_unexpected: component returned failure code: 0x
8000ffff (ns_error_unexpected) [nsiprefbranch.getcharpref] to avoid such errors, you should check whether the key exists or not using nsiprefservice.getpreftype(), as shown below: var prefservicebranch = components.classes["@mozilla.org/preferences-service;1"] .getservice(components.interfaces.nsiprefservice).getbranch(""); if(prefservicebranch.getpreftype('exten...
... resources other documentation on preferences preferences api a brief guide to mozilla preferences — describes preferences system from user's/administrator's pov mozilla xpcom interfaces of the preferences system most used interfaces (these are frozen and will not change): nsiprefbranch and nsiprefservice nsiprefbranch2 interface (before gecko 1.
8 it was called nsiprefbranchinternal) preferences system - an easy way to create a xul options window for your extension or application syncing preferences across clients using sync lxr pages for libpref, the source code module that implements the preferences system a javascript wrapper for preferences api adding preferences to an extension — a simple tutorial with a working extension ...
XPath - Archive of obsolete content
ent.evaluate) obj.evaluate(xpathexpression,contextnode,namespaceresolver,resulttype,result); //obj and contextnode should be the same object, if context is a ajax xml object (example: returnedxml) this should be used as : returnedxml.evaluate(xpathexpression,returnedxml,namespaceresolver,returntype,result); //contextnode should be used in the one in which it was created //add by mooring 200
8-11-15 16:00 china var xhr = new ajax('post','demo.xml',parsexml,'xml'); //ajax is a class written by javascript which return responsexml object to parsexml function function parsexml(obj)//obj is the returnxml object now { if(!obj.documentelement) { alert("your browser does't support this script!"); return; } var fields = [];//store the results if(window.activexobject) { v...
... tmp = tobj.iteratenext(); } } alert(fields); } //here is the demo xml file for xpath <?xml version="1.0"?> <root> <field> <item>art_id</item> <item>psection</item> <item>qkind</item> <item>qtitle</item> <item>question</item> <item>pic</item> <item>answer1</item> <item>answer2</item> <item>answer3</item> <item>answer4</item> </field> </root> //add by mooring 200
8-11-15 16:16 china ...
Enhanced Extension Installation - Archive of obsolete content
the types at the time of writing include: 2 - extension 4 - theme
8 - locale for backward compatibility the extension system will continue to assume an item is an extension by default, and a theme if the item has a <em:internalname> property, but extension and theme authors should be good citizens and upgrade their install manifests to include the type.
... original document information author(s): ben goodger last updated date: april 1
8, 2005 copyright information: copyright (c) ben goodger ...
Chapter 6: Firefox extensions and XUL applications - Archive of obsolete content
matsuzawa-san is a co-author of firefox 3 hacks (o'reilly japan, 200
8.) this chapter discusses tools to assist in developing extensions.
... the next command will import the source code: gonzui-import.exe mozilla once the import process is complete, type the following command to launch the gonzui server: gonzui-server.exe now you can access gonzui from your web browser by typing the following into your location bar : http://localhost:469
84 this lets you browse all packages, click on links to traverse them, and take traversed-link locations as search starting points (figure a).
Using the Stylesheet Service - Archive of obsolete content
the stylesheets registered with this api apply to all documents; firefox 1
8 extended nsidomwindowutils with loadadditionalstylesheet() and removeadditionalstylesheet() to manage stylesheets for a specific document (bug 737003).
... backwards compatibility you can check for the availability and the functionality of the stylesheet service: if("@mozilla.org/content/style-sheet-service;1" in components.classes) { if(components.id('{41d979dc-ea03-4235-
86ff-1e3c090c5630}') .equals(components.interfaces.nsistylesheetservice)) { // stylesheet service is available, but changes won't apply until reload // (firefox 1.5 and 2 behaviour) } else { // stylesheet service is available and changes will apply immediately // (firefox 3 behaviour) } } else { // stylesheet service is not available (pre-firefox 1.5 behav...
Adding preferences to an extension - Archive of obsolete content
w*$/, ""); // build the tooltip string var fieldarray = output.split(","); samplepanel.label = symbol + ": " + fieldarray[1]; samplepanel.tooltiptext = "chg: " + fieldarray[4] + " | " + "open: " + fieldarray[5] + " | " + "low: " + fieldarray[6] + " | " + "high: " + fieldarray[7] + " | " + "vol: " + fieldarray[
8]; } } var httprequest = new xmlhttprequest(); httprequest.open("get", fullurl, true); httprequest.onload = inforeceived; httprequest.send(null); } } note that we use stockwatcher.tickersymbol here instead of this.tickersymbol to get the stock symbol to watch.
... « previousnext » override chrome://myaddon/content/options.xul chrome://myaddon/content/oldoptions.xul application={ec
8030f7-c20a-464f-9b0e-13a3a9e973
84} appversion<=6.* examples github - gist :: _ff-addon-template-bootstrapprefsskeleton - this gist here is a fully working example of a fully funcitonal preferences skeleton, it uses the observer example from above.
MozOrientation - Archive of obsolete content
the value is -1 when the device is undergoing standard earth gravity (9.
8m/sec2) but not moving.
... to normalize between the two you can do something like this: function orientationhandler(evt){ // for ff3.6+ if (!evt.gamma && !evt.beta) { evt.gamma = -(evt.x * (1
80 / math.pi)); evt.beta = -(evt.y * (1
80 / math.pi)); } // use evt.gamma, evt.beta, and evt.alpha // according to dev.w3.org/geo/api/spec-source-orientation } window.addeventlistener('deviceorientation', orientationhandler, false); window.addeventlistener('mozorientation', orientationhandler, false); example window.addeventlistener("mozorientation", dofunc, true)...
cert_override.txt - Archive of obsolete content
some.website.com:443 oid.2.16.
840.1.101.3.4.2.1 00:11:22:33:44:55:66:77:
88:99:aa:bb:cc:dd:ee:ff:ff:ee:dd:cc:bb:aa:99:
88:77:66:55:44:33:22:11:00 u aaaaaaaaaaaaaaabaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaa== fields fields are separated by a tab character.
... domainname:port : port 443 for https (ssl) hash algorithm oid sha1-256: oid.2.16.
840.1.101.3.4.2.1 (most used) sha-3
84: oid.2.16.
840.1.101.3.4.2.2 sha-512: oid.2.16.
840.1.101.3.4.2.3 certificate fingerprint using previous hash algorithm one or more characters for override type: m : allow mismatches in the hostname u : allow untrusted certs (whether it's self signed cert or a missing or invalid issuer cert) t : allow errors in the validity time, for example, for expired or not yet valid certs certificate's serial number and the issuer name as a base64 encoded string ...
Images, Tables, and Mysterious Gaps - Archive of obsolete content
lorem ipsum, dolor sit amet...</p></td></tr></table> as we see in figure
8, that works well in some cases but not so well in others.
...in any of these cases, though, making images block-level could have unintended side effects if your table cells have more than just a single image in them, as in figure
8.
Using XML Data Islands in Mozilla - Archive of obsolete content
for example, a simple xml purchase order can be embedded like this: <script id="purchase-order" type="application/xml"> <purchaseorder xmlns="http://example.mozilla.org/purchaseorderml"> <lineitem> <name>line item 1</name> <price>1.25</price> </lineitem> <lineitem> <name>line item 2</name> <price>2.4
8</price> </lineitem> </purchaseorder> </script> the xml source text can then be retrieved like this: var ordersource = document.getelementbyid("purchase-order").textcontent; the xml source text can be parsed into a dom tree using the domparser api: var parser = new domparser(); var doc = parser.parsefromstring(ordersource, "application/xml"); the html5 data block-based way shown here works in ...
...here is a complete demo (also available as an attachment): <!doctype html> <html> <head> <title>xml data block demo</title> <script id="purchase-order" type="application/xml"> <purchaseorder xmlns="http://example.mozilla.org/purchaseorderml"> <lineitem> <name>line item 1</name> <price>1.25</price> </lineitem> <lineitem> <name>line item 2</name> <price>2.4
8</price> </lineitem> </purchaseorder> </script> <script> function rundemo() { var ordersource = document.getelementbyid("purchase-order").textcontent; var parser = new domparser(); var doc = parser.parsefromstring(ordersource, "application/xml"); var lineitems = doc.getelementsbytagnamens("http://example.mozilla.org/purchaseorderml", "lineitem"); var firstprice = lineitems[0].getelemen...
ActiveX Control for Hosting Netscape Plug-ins in IE - Archive of obsolete content
a note to developers if you intend to modify this control in any way then you must also change the clsid from {dbb2de32-61f1-4f7f-beb
8-a37f5bc24ee2} to something else and any other guids this control relies upon (iid, libids etc).
... usage insert some html like this into your content: <object classid="clsid:dbb2de32-61f1-4f7f-beb
8-a37f5bc24ee2" width="500" height="300"> <param name="type" value="video/quicktime"/> <param name="src" value="http://www.foobar.com/some_movie.mov"/> <!-- custom arguments --> <param name="loop" value="true"/> </object> the classid attribute tells ie to create an instance of the plug-in hosting control, the width and height specify the dimensions in pixels.
Bonsai - Archive of obsolete content
checkins to any branch of xfe by ramiro between 26-feb-199
8 and 12-may-199
8 differences between revisions 3.1 and 3.3 of the file mozilla/cmd/xfe/forms.c that's a small sample, but it should be enough to get you started.
... original document information author(s): jamie zawinski last updated date: september
8, 2004 copyright information: portions of this content are © 199
8–2007 by individual mozilla.org contributors; content available under a creative commons license | details.
Bookmark Keywords - Archive of obsolete content
replace the bug's number (
82
839) with the string %s.
...in this case, we'll give it a keyword and title of google and replace the term "geitost" with the %s, as shown (with extra highlighting) in figure
8.
Creating a Firefox sidebar extension - Archive of obsolete content
install.rdf <?xml version="1.0" encoding="utf-
8"?> <rdf xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:em="http://www.mozilla.org/2004/em-rdf#"> <description about="urn:mozilla:install-manifest"> <em:id>emptysidebar@yourdomain.com</em:id> <em:name>emptysidebar extension</em:name> <em:version>1.0</em:version> <em:creator>your name</em:creator> <em:description>example extension for creation and registration of ...
...a sidebar.</em:description> <em:targetapplication> <description> <em:id>{ec
8030f7-c20a-464f-9b0e-13a3a9e973
84}</em:id> <!-- firefox --> <em:minversion>1.5</em:minversion> <em:maxversion>2.0.0.*</em:maxversion> </description> </em:targetapplication> </description> </rdf> the other manifest file is chrome.manifest, the chrome manifest file.
Embedding Mozilla in a Java Application using JavaXPCOM - Archive of obsolete content
prerequisites java 1.4.2 or newer xulrunner 1.
8.0.1 or newer embedding in order to embed mozilla in your java application, you will need to add the library mozillainterfaces.jar (located in xulrunner/sdk/lib folder) to your classpath.
...first, the java application must find a suitable xulrunner installation: mozilla mozilla = mozilla.getinstance(); greversionrange[] range = new greversionrange[1]; range[0] = new greversionrange("1.
8.0", true, "1.9", false); // work with trunk nightly version 1.9a1 ^^ try { file grepath = mozilla.getgrepathwithproperties(range, null); locationprovider locprovider = new locationprovider(grepath); mozilla.initembedding(grepath, grepath, locprovider); } catch (filenotfoundexception e) { // this exception is thrown if gregrepathwithproperties cannot find a gre } catch (xpcomexception e) { // this ...
JavaScript crypto - Archive of obsolete content
if you choose to implement these flags, your module must supply the following additional functions for each flag: pkcs11_mech_flag: must support ckm_rsa_pkcs and ckm_rsa_x_509 and the following functions: c_wrapkey, c_encrypt, c_sign, c_decrypt, c_unwrapkey, c_verifyrecover, c_verify, c_generatekeypair (204
8, 1024, 512) size pkcs11_mech_dsa_flag: must support ckm_dsa and the following functions: c_sign, c_verify, c_generatekeypair pkcs11_mech_rc2_flag: must support ckm_rc2_cbc and ckm_rc2_ecb and the following functions: c_generatekey, c_encrypt, c_decrypt, c_wrapkey, c_unwrapkey pkcs11_mech_rc4_flag: must support ckm_rc4_cbc and ckm_rc4_ecb and the following functions: c_generatekey, c_encrypt, c...
...0x1<<0; pkcs11_mech_dsa_flag = 0x1<<1; pkcs11_mech_rc2_flag = 0x1<<2; pkcs11_mech_rc4_flag = 0x1<<3; pkcs11_mech_des_flag = 0x1<<4; pkcs11_mech_dh_flag = 0x1<<5; //diffie-hellman pkcs11_mech_skipjack_flag = 0x1<<6; //skipjack algorithm as in fortezza cards pkcs11_mech_rc5_flag = 0x1<<7; pkcs11_mech_sha1_flag = 0x1<<
8; pkcs11_mech_md5_flag = 0x1<<9; pkcs11_mech_md2_flag = 0x1<<10; pkcs11_mech_random_flag = 0x1<<27; //random number generator pkcs11_pub_readable_cert_flag = 0x1<<2
8; //stored certs can be read off the token w/o logging in pkcs11_disable_flag = 0x1<<30; //tell mozilla to disable this slot by default cipher flags reserved important for cryptomechanis...
Clipboard Test - Archive of obsolete content
param:not(:last-child):after{content: ","; padding-right: .5em; } .method>.name>.param:not(:last-child):after{content: ","; padding-right: .5em; } .method>.name>.param>.name:after{content: " as "; font-weight: normal; } .method>.params{display: block; color:#555;} .method>.params>.param{display: block; margin-bottom:5px;} .method>.params>.param>.name{font-weight:bold; margin-right:.5em; min-width:
80px; display:inline-block;} .method>.params>.param>.description{display:inline-block; width:300px; vertical-align:top;margin-right:30px} .method>.params>.param>.type{display:inline-block; width:100px; vertical-align:top;font-weight:bold;} .method>.params>.param>.type:before{content: "type "; color: #
888; font-weight:normal;} .method>.params>.param>.default{display:inline-block; width:100px; vertic...
...al-align:top;font-weight:bold;} .method>.params>.param>.default:before{content: "default "; color: #
888;font-weight:normal;} ]]></style> clipboard jetpack's clipboard support api provides a standardized way for features to access the clipboard.
Menu - Archive of obsolete content
note that some environments, notably gnome 2.2
8, do not support menuitem icons either by default or at all.
... see bug 5263
82 for more information.
Metro browser chrome tests - Archive of obsolete content
the metro browser chrome test suite is an automated testing framework designed to allow testing of the immersive version of firefox for windows
8 and above using javascript.
...for information on setting your local build as the default, visit the windows
8 integration wiki page.
Mozilla Application Framework - Archive of obsolete content
mozilla has been ported to more than a dozen platforms including windows (95, 9
8, nt, 2000, xp, ce), mac os x, linux, solaris, beos, openvms, os/2, aix, and hp-ux.
... original document information author(s): myk melez last updated date: march 3, 2003 copyright information: portions of this content are © 199
8–2007 by individual mozilla.org contributors; content available under a creative commons license | details.
Plug-n-Hack Phase1 - Archive of obsolete content
for example: var manifest = {"detail":{"url":"http://localhost:
80
80/manifest"}}; var evt = new customevent('configuresectool', manifest); it is suggested that browsers wishing to support pnh restrict handling of customevents such that they’re ignored where the event happens outside of user initiated actions.
... an example manifest (for owasp zap) is: { "toolname":"owasp zap", "protocolversion":"0.2", "features":{ "proxy":{ "pac":"http://localhost:
80
80/proxy.pac", "cacert":"http://localhost:
80
80/other/core/other/rootcert/" }, "commands":{ "prefix":"zap", "manifest":"http://localhost:
80
80/other/mitm/other/service/" } } } the top level manifest includes optional links to a proxy pac and a root ca certificate.
Porting NSPR to Unix Platforms - Archive of obsolete content
last modified 16 july 199
8 <<< under construction >>> unix platforms are probably the easiest platforms to port netscape portable runtime (nspr) to.
...t>./join -d</tt> <tt>perf</tt> <tt>./switch -d</tt> <tt>intrupt -d</tt> for i/o: <tt>cltsrv -d</tt>, <tt>cltsrv -gd</tt> <tt>socket</tt> <tt>testfile -d</tt> <tt>tmocon -d</tt> '<tt>tmoacc -d</tt>' in conjunction with '<tt>writev -d</tt>' miscellaneous: <tt>dlltest -d</tt> <tt>forktest</tt> original document information author: larryh@netscape.com last updated date: 16 july 199
8 ...
RDF Datasource How-To - Archive of obsolete content
an "imap datasource" would use the imap protocol to translate your mail server's inbox as a collection of statements like "message number 126's subject is 'make money fast on the internet'" and "message number 126 was sent by 'spammer12
8@hotmail.com'".
... an "address book" datasource could translate a database file into statements like "spammer12
8@hotmail.com's real name is 'billy dumple'" and "spammer12
8@hotmail.com is considered an 'important friend'." statements from one datasource can be combined with statements from another datasource using a composite datasource.
Remote debugging - Archive of obsolete content
examples: 367650, 374356, 393325, 41
8139 debugging over irc find the developer on irc and explain that you've caught the bug in a debugger.
...examples: 391
851 share your computer with remote desktop offer to let a developer control your computer using remote desktop software such as vnc or fog creek copilot.
Static Analysis for Windows Code under Linux - Archive of obsolete content
you can obtain mozilla 2 code by: hg clone http://hg.mozilla.org/mozilla-central/ and compose a .mozconfig file for cross-compiling mozilla with static analysis hooked: #specify the cross compile cross_compile=1 ac_add_options --enable-application=browser ac_add_options --host=i6
86-linux ac_add_options --target=i6
86-mingw32 ac_add_options --enable-default-toolkit=cairo-windows mk_add_options moz_objdir=@topsrcdir@/../mozilla-mingw # mozilla trunk uses many vista only features on windows, so we should disable some components to make it buildable with mingw32.
...host_libidl_config=/usr/bin/libidl-config #config your moztools position glib_prefix=$home/moztools libidl_prefix=$home/moztools #disable xpcom stdcall calling convention because of gcc 4.3.0 bug cppflags="-dmoz_disable_xpcom_stdcall" #specify the cxx and static analysis #point cxx to the cross compile g++ with plugin support cxx=$home/mingw-install/bin/i6
86-mingw32-g++ ac_add_options --with-static-checking=$home/dehydra/dehydra-gcc/gcc_dehydra.so then, you can start building your mozilla.
String Quick Reference - Archive of obsolete content
and nscstring& void mymethod(const nsstring& input, nsstring& output); new way: use nsastring& and nsacstring& void mymethod(const nsastring& input, nsastring& output); substrings what: get direct references to string fragments why: avoid making multiple copies of the string old way: use a bunch of nsautostrings, and use left(), right() and mid() to grab a segment of a string: // get an
8-character string starting at the 4th position nsautostring leftside; str.left(leftside, 12); nsautostring middle; leftside.right(middle,
8); new way: use substring() to grab a direct reference to those characters: // get an
8-character string starting at the 4th position const nsastring& middle = substring(str, 4,
8); unicode literals what: use macro tricks to make wide-character literal s...
...g // call getstringvalue(nsastring& out); nsautostring value; // 64-character buffer on stack getstringvalue(value); // call getstringvalue(char** out); nsxpidlcstring result; getstringvalue(getter_copies(result)); // result will free automatically original document information author: alec flett last updated date: april 30, 2003 copyright information: portions of this content are © 199
8–2007 by individual mozilla.org contributors; content available under a creative commons license | details.
Actionscript Acceptance Tests - Archive of obsolete content
(see bug 5
87093 for details.) specifying multiple .abcs: if you desire to run a test with multiple .abc files (e.g: avmshell a.abc b.abc testname.abc) there is a special avm_args directive called multiabc that is specified surrounded by two pipe (|) symbols: |multiabc| $dir/testname_support/a.abc $dir/testname_support/b.abc the extra abc files will usually be placed in a _support dir (see additional files be...
... in this example the .as test runs out of memory and so the expected exitcode is: 12
8 testname.out file that specifies expected output.
URIs and URLs - Archive of obsolete content
instead ?y = http://a/b/c/d;p?y was implemented as suggested by the older rfc 1
80
8.
... original document information author(s): andreas otte last updated date: january 2, 2002 copyright information: portions of this content are © 199
8–2007 by individual mozilla.org contributors; content available under a creative commons license | details.
Venkman Introduction - Archive of obsolete content
e enumerable property r read only property p permanent (cannot be deleted) a alias to another property a argument to a function v declared with var figure
8.
...flags are shown enumerated in figure
8.
Using Breakpoints in Venkman - Archive of obsolete content
if you execute this code again after having set this breakpoint, venkman will stop at line
81.
...when you set a breakpoint at line
81, you can start animation on the web page in the browser window and see venkman stop execution as it enters the onflipx function.
Example Sticky Notes - Archive of obsolete content
view this example <!doctype html public "-//w3c//dtd html 4.01//en" "http://www.w3.org/tr/html401/strict.dtd"> <html> <head> <title>xbl demo : sticky notes</title> <meta http-equiv="content-type" content="text/html; charset=iso-
8859-1"> <style type="text/css"> body { background-color: #ffffff; color: #000000; font: 1em verdana, sans-serif; } h1 { font-size: 1.5em; } /* binding: */ .sticker { -moz-binding: url(notes.xml#default); } </style> </head> <body> <h1><a href="http://developer.mozilla.org/en/docs/xbl:xbl_1.0_reference">xbl</a> demo : sticky notes</h1> <div class="sticker"><p>acme, inc.
... fax - respond today.</p></div> <div class="sticker"><p>don't forget the eggs!</p></div> <div class="sticker"><p>the new project - who's on charge?</p></div> <div class="sticker"><p>learn more about xbl.</p></div> <p style="clear: left"><a href="http://validator.w3.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:xlink="http://www.w3.org/1999/xlink"> <!-- in above only xbl namespace declaration is mandatory.
right - Archive of obsolete content
for example, using right="-
80" causes the stack to be enlarged
80 pixels to the right and the element's right edge to be at the same location as the right edge of the stack.
... in other words, the right edge of the element is placed
80 pixels to the right of where the right edge of the stack was prior to the element being added.
Building accessible custom components in XUL - Archive of obsolete content
(we could have laid out the grid by rows instead of columns, but that just shifts the complexity to a different navigation command.) here is the keyboard navigation code: <code> const key_up = 3
8; const key_down = 40; const key_left = 37; const key_right = 39; function cell_keypress(e) { var current = e.target; switch (e.keycode) { case key_up: spreadsheet_up(current); break; case key_down: spreadsheet_down(current); break; case key_left: spreadsheet_left(current); break; case key_right: spreadsheet_right(cur...
...(we don't need any special code to track the focus change; we just need an onblur handler to accept the edited value before the focus changes.) first, the code to trigger edit mode: <code> const key_up = 3
8; const key_down = 40; const key_left = 37; const key_right = 39; const key_enter = 13; const key_escape = 27; function cell_keypress(e) { var current = e.target; switch (e.keycode) { case key_enter: if (current.tagname == 'label') { start_edit(current); } break; case key_up: spreadsheet_up(current); break; case key_down: spr...
XUL Events - Archive of obsolete content
for example, if a box has a maximum size of 100 pixels, and only enough space for
80 pixels is available, the overflow event will be sent to the box.
...note: this event may fire several times or while resizing the window (for example, see bug 715
867), so always check if the window state changed by inspecting window.windowstate in the event.
accessibleType - Archive of obsolete content
tant value xulalert 1001 xulbutton 1002 xulcheckbox 1003 xulcolorpicker 1004 xulcolorpickertile 1005 xulcombobox 1006 xuldropmarker 1007 xulgroupbox 100
8 xulimage 1009 xullink 100a xullistbox 100b xullistcell 1026 xullisthead 1024 xullistheader 1025 xullistitem 100c xulmenubar 100d xulmenui...
...ulmenuseparator 1010 xulpane 1011 xulprogressmeter 1012 xulscale 1013 xulstatusbar 1014 xulradiobutton 1015 xulradiogroup 1016 xultab 1017 xultabbox 101
8 xultabs 1019 xultext 101a xultextbox 101b xulthumb 101c xultree 101d xultreecolumns 101e xultreecolumnitem 101f xultoolbar 1020 xultoolba...
Providing Command-Line Options - Archive of obsolete content
using the example to use this sample code, save the commandline.js file into the components directory and add the following lines to your chrome.manifest file: component {2991c315-b
871-42cd-b33f-bfee4fcbf6
82} components/commandline.js contract @mozilla.org/commandlinehandler/general-startup;1?type=myapp {2991c315-b
871-42cd-b33f-bfee4fcbf6
82} category command-line-handler m-myapp @mozilla.org/commandlinehandler/general-startup;1?type=myapp the javascript code const cc = components.classes; const ci = components.interfaces; components.utils.import("resource://gre/modules/xp...
... openwindow(achromeurispec, aargument) { services.ww.openwindow(null, achromeurispec, "_blank", "chrome,menubar,toolbar,status,resizable,dialog=no", aargument); } // command line handler function commandlinehandler() { }; commandlinehandler.prototype = { classdescription: "myapphandler", // changeme: generate a unique id classid: components.id('{2991c315-b
871-42cd-b33f-bfee4fcbf6
82}'), // changeme: change the type in the contractid to be unique to your application contractid: "@mozilla.org/commandlinehandler/general-startup;1?type=myapp", _xpcom_categories: [{ category: "command-line-handler", // changeme: // category names are sorted alphabetically.
Manifest Files - Archive of obsolete content
doesn't work with utf-
8 with bom.) add the following line to it: content tests file:///c:/testfiles/ the file path in that line should point to the directory created above.
...older applications if you are creating applications for older versions of mozilla software, that is, before firefox 1.5 or mozilla 1.
8, the process is a bit more involved.
Property Files - Archive of obsolete content
non-ascii characters, utf-
8 and escaping gecko 1.
8.x (or later) supports property files encoded in utf-
8.
... you can and should write non-ascii characters directly without escape sequences, and save the file as utf-
8 without bom.
XUL controls - Archive of obsolete content
<colorpicker type="button" color="#cc00
80"/> colorpicker reference <datepicker> a set of textboxes which may be used to allow the entry of a date.
... <datepicker type="popup" value="200
8/0
8/24"/> datepicker reference <description> the description element is used for descriptive text.
Application Update - Archive of obsolete content
application settings you will need to configure the following settings in your application: branding the update process uses branding information, setup branding for your application as described here: xulrunner tips icons the updater process for linux systems requires updater.png to be in your <application folder>/icons/, see https://bugzilla.mozilla.org/show_bug.cgi?id=706
846 preferences // whether or not app updates are enabled pref("app.update.enabled", true); // this preference turns on app.update.mode and allows automatic download and // install to take place.
...//pref("app.update.url.override", ""); // interval: time between checks for a new version (in seconds) // default=1 day pref("app.update.interval",
86400); // interval: time before prompting the user to download a new version that // is available (in seconds) default=1 day pref("app.update.nagtimer.download",
86400); // interval: time before prompting the user to restart to install the latest // download (in seconds) default=30 minutes pref("app.update.nagtimer.restart", 1
800); // interval: when all registered timers sho...
Debugging a XULRunner Application - Archive of obsolete content
happy debugging :) venkman follow these instructions to install venkman into your xulrunner application (xulrunner 1.9 and later): get venkman from addons.mozilla.org (v0.9.
87 at the time of writing).
... inspired by http://article.gmane.org/gmane.comp.mozilla.devel.jsdebugger/
859 i extracted venkman.jar, opened venkman\content\venkman\venkman-scripts.xul and changed: @@ -54,11 +54,11 @@ <script src="chrome://global/content/nstransferable.js" /> <script src="chrome://global/content/nsclipboard.js" /> <script src="chrome://global/content/nsdraganddrop.js" /> - <script src="chrome://communicator/content/contentareautils.js" /> - <script sr...
XULRunner/Old Releases - Archive of obsolete content
community contributed builds of xulrunner 1.
8.1.3 these builds are contributed by the eclipse atf community and are intended for embedding.
... xulrunner 1.
8.0.4 this is the last official stable developer preview release from the 1.
8.0 branch.
Format - Archive of obsolete content
summary: mozilla.dev.planning - july 17-23, 2006 announcements firefox 2/gecko 1.
8.1 bug approvals starting on friday july 21 at 10:00a pdt the release triage team will no longer be accepting bugs unless they meet one of the posted criteria.
... dropping bugs from blocking1.
8.1+ david baron suggested a list of bugs that could be dropped from the blocking list.
JS-Engine FAQ - Archive of obsolete content
newly created threads in js from mozilla_1_
8_branch causes to hang in windows patch from bug 351602 should fix the problem.
... to write wrappers in pure javascript to interface with any c library on the system there are mechanisms such as xpcshell, wxjs, jsdb, jsni coding spidermonkey in c check out this tutorial how to compile tamarin on linux/x
86 there is a patch that allows you to compile it.
NPN_SetException - Archive of obsolete content
syntax #include <npruntime.h> void npn_setexception(npobject *npobj, const nputf
8 *message); parameters the function has the following parameters: <tt>npobj</tt> the object on which the exception occurred.
... <tt>message</tt> a utf-
8 string describing the error that occurred.
Shipping a plugin as a Toolkit bundle - Archive of obsolete content
in the xpi you can use the following structure: platform/ linux_x
86-gcc3/ plugins/ libplugin.so darwin_ppc-gcc3/ plugins/ libplugin.dylib more specific information can be found in the platform-specific subdirectories documentation.
...for a plugin the manifest only needs to be very simple: <rdf xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:em="http://www.mozilla.org/2004/em-rdf#"> <description about="urn:mozilla:install-manifest"> <em:id>mypluginid@myplugin.com</em:id> <em:name>my plugin</em:name> <em:version>1.0</em:version> <em:targetapplication> <description> <em:id>{ec
8030f7-c20a-464f-9b0e-13a3a9e973
84}</em:id> <em:minversion>1.5</em:minversion> <em:maxversion>4.0.*</em:maxversion> </description> </em:targetapplication> <em:unpack>true</em:unpack> </description> </rdf> this contains 5 required pieces of information.
Why RSS Content Module is Popular - Including HTML Contents - Archive of obsolete content
an example using the most popular element of the rss content module is shown below: <?xml version="1.0"?> <rss version="2.0" xmlns:content="http://purl.org/rss/1.0/modules/content/" > <channel> <title>example</title> <description>an rss example with slash</description> <lastbuilddate>sun, 15 may 2005 13:02:0
8 -0500</lastbuilddate> <link>http://www.example.com</link> <item> <title>a link in here</title> <guid>d77d2e
80-04
87-4e
8c-a35d-a93f12a0ff7d:2005/05/15/114</guid> <pubdate>sun, 15 may 2005 13:02:0
8 -0500</pubdate> <link>http://www.example.com/blog/2005/05/15/114</link> <content:encoded><![cdata[this is ...
...a <a href="http://example.com/">link</a>.]]></content:encoded> </item> <item> <title>some italics html</title> <guid>d77d2e
80-04
87-4e
8c-a35d-a93f12a0ff7d:2005/05/15/113</guid> <pubdate>sun, 15 may 2005 10:55:12 -0500</pubdate> <link>d77d2e
80-04
87-4e
8c-a35d-a93f12a0ff7d:2005/05/15/113</link> <content:encoded><![cdata[this is <i>italics</i>.]]></content:encoded> </item> <item> <title>some bold html</title> <guid>d77d2e
80-04
87-4e
8c-a35d-a93f12a0ff7d:2005/05/15/112</guid> <pubdate>sun, 15 may 2005 0
8:14:11 -0500</pubdate> <link>http://www.example.com/blog/2005/05/15/112</link> <content:encoded><![cdata...
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:0
8 -0500</lastbuilddate> <link>http://www.example.com</link> <item> <title>review of sin city</title> <guid>d77d2e
80-04
87-4e
8c-a35d-a93f12a0ff7d:2005/05/15/114</guid> <pubdate>sun, 15 may 2005 13:02:0
8 -0500</lastbuilddate></pubdate> <link>http://www.example.com/blog/2005/05/15/114</link> <slash:comment...
...s>43</slash:comments> </item> <item> <title>what is the 3571st prime number</title> <guid>d77d2e
80-04
87-4e
8c-a35d-a93f12a0ff7d:2005/05/15/113</guid> <pubdate>sun, 15 may 2005 10:55:12 -0500</lastbuilddate></pubdate> <link>d77d2e
80-04
87-4e
8c-a35d-a93f12a0ff7d:2005/05/15/113</link> <slash:comments>72</slash:comments> </item> <item> <title>first article!</title> <guid>d77d2e
80-04
87-4e
8c-a35d-a93f12a0ff7d:2005/05/15/112</guid> <pubdate>sun, 15 may 2005 0
8:14:11 -0500</lastbuilddate></pubdate> <link>http://www.example.com/blog/2005/05/15/112</link> <slash:comments>11
8</slash:comments> </item>...
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:0
8 -0500</lastbuilddate> <link>http://www.example.com</link> <item> <title>i like root beer</title> <guid>d77d2e
80-04
87-4e
8c-a35d-a93f12a0ff7d:article:54321</guid> <pubdate>sun, 15 may 2005 13:02:0
8 -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>d77d2e
80-04
87-4e
8c-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>d77d2e
80-04
87-4e
8c-a35d-a93f12a0ff7d:article:54319</guid> <pubdate>sun, 15 may 2005 0
8: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.
TCP/IP Security - Archive of obsolete content
another good source of information is nist sp
800-52, guidelines on the selection and use of transport layer security, available from https://csrc.nist.gov/publications/nistpubs/.) the use of tls typically requires each application to support tls; however, unlike application layer controls, which typically involve extensive customization of the application, transport layer controls such as tls are much less intrusive because they do not need t...
... original document information author(s): sheila frankel, paul hoffman, angela orebaugh, and richard park title: national institute of standards and technology (nist) special publication
800-113, guide to ssl vpns last updated date: july 200
8 copyright information: this document is not subject to copyright.
Threats - Archive of obsolete content
link: red hat certificate system common criteria certification
8.1: deployment, planning, and installation original document information author(s): joint task force transformation initiative title: national institute of standards and technology (nist) special publication
800-30 revision 1, guide for conducting risk assessments last updated date: september 2012 copyright information: this document is not subject to copyright.
... original document information author(s): karen scarfone, wayne jansen, and miles tracy title: national institute of standards and technology (nist) special publication
800-123, guide to general server security last updated date: july 200
8 copyright information: this document is not subject to copyright.
Solaris 10 Build Prerequisites - Archive of obsolete content
--- env.sh.orig tue jul 1 02:3
8:35 200
8 +++ env.sh tue jun 24 01:0
8:01 200
8 @@ -95,7 +95,
8 @@ echo setting ld=$ld export ld -path="$cbe_prefix/bin:/usr/ccs/bin:/usr/gnu/bin:/usr/bin:/usr/sbin:/bin:/usr /sfw/bin:$ccdir" +path="/opt/sfw/bin:$cbe_prefix/bin:/usr/ccs/bin:/usr/gnu/bin:/usr/bin:/usr/s bin:/bin:/usr/sfw/bin:$ccdir" test "x$jds_cbe_env_quiet" != x1 && \ echo setting path=$path export path +exp...
...
8.
Sunbird Theme Tutorial - Archive of obsolete content
#"> <description about="urn:mozilla:install-manifest" em:id="just-testing@example.com" em:name="just testing" em:creator="rod whiteley" em:description="a test theme for sunbird" em:homepageurl="http://developer.mozilla.org/" em:version="0.1" em:internalname="testing" em:type="4" > <em:targetapplication><!-- sunbird --> <description em:id="{71
8e30fb-e
89b-41dd-9da7-e25a4563
8b2
8}" em:minversion="0.2.9" em:maxversion="0.4" /> </em:targetapplication> </description> </rdf> in the line that starts <tt>em:id</tt>, paste your identifier between the double-quote characters, replacing the identifier that is there now.
... fixing bug 320
823 if you are using the sunbird 0.3a1 release, or a test build before 2005-12-21, then you must apply a fix for bug 320
823 to allow sunbird to use themes.
Table Reflow Internals - Archive of obsolete content
table reflow example <table width=300> <tr> <td>foo</td> <td>bar zap</td> </tr> </table> key: r = reflow reason, 0 (initial), 2 (resize) a = avail w, h c = computed w, h d = desired w, h me = max elem w debugging frame reflow gives instructions for turning this on: tblo 030176cc r=0 a=
8940,uc c=0,0 cnt=429 tbl 03017
8c4 r=0 a=
8940,uc c=4470,uc cnt=430 rowg 03017a7c r=0 a=uc,uc c=uc,uc cnt=431 row 03017c0
8 r=0 a=uc,uc c=uc,uc cnt=432 cell 03017da
8 r=0 a=uc,uc c=uc,uc cnt=433 block 03017e0
8 r=0 a=uc,uc c=uc,uc cnt=434 block 03017e0
8 d=
870,300 me=4
80 cell 03017da
8 d=930,360 me=540 cell 0301a
8cc r=0 a=uc,uc c=uc,uc cnt=436 block 0301...
...a92c r=0 a=uc,uc c=uc,uc cnt=437 block 0301a92c d=1335,300 me=465 cell 0301a
8cc d=1395,360 me=525 row 03017c0
8 d=uc,360 rowg 03017a7c d=uc,360 rowg 03017a7c r=2 a=4470,uc c=4470,uc cnt=442 row 03017c0
8 r=2 a=4470,uc c=4470,uc cnt=443 cell 03017da
8 r=2 a=1755,uc c=1695,uc cnt=444 block 03017e0
8 r=2 a=1695,uc c=1695,uc cnt=445 block 03017e0
8 d=1695,300 cell 03017da
8 d=1755,360 cell 0301a
8cc r=2 a=2625,uc c=2565,uc cnt=446 block 0301a92c r=2 a=2565,uc c=2565,uc cnt=447 block 0301a92c d=2565,300 cell 0301a
8cc d=2625,360 row 03017c0
8 d=4470,360 rowg 03017a7c d=4470,360 tbl 03017
8c4 d=4500,450 tblo 030176cc d=4500,450 table reflow optimizations if the table is already balanced, pass 1 constrains the...
Building a Theme - Archive of obsolete content
--> <em:targetapplication> <description> <em:id>{ec
8030f7-c20a-464f-9b0e-13a3a9e973
84}</em:id> <em:minversion>29.0</em:minversion> <em:maxversion>39.*</em:maxversion> </description> </em:targetapplication> <!-- front end metadata --> <em:name>my theme</em:name> <em:internalname>sample</em:internalname> <em:description>a test extension</em:description> <em:creator>your name here</em:creator> <em:hom...
... {ec
8030f7-c20a-464f-9b0e-13a3a9e973
84} - firefox's application id.
Developing cross-browser and cross-platform pages - Archive of obsolete content
// bad sample if (navigator.appversion.charat(0) == "
8") { if (navigator.appname == "netscape") { isns
8 = true; alert("netscape
8"); }; } else if (navigator.appversion.indexof("msie") != -1) { isie = true; alert("internet explorer"); }; while this kind of checking in the above code can work in a crude sense, sharp readers may wonder what happens when internet explorer
8 is released or when an opera
8.x user visits the page or even wh...
...en an user with any non-netscape browser starting with a "
8" character in the appversion string visits that page.
Enumerator.atEnd - Archive of obsolete content
ytespergb; s += freegb.tofixed(3) + " gb free of "; s += totalgb.tofixed(3) + " gb"; } else { s += "not ready"; } s += "<br />"; e.movenext(); } return(s); } requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, and internet explorer 10 standards.
... not supported in windows
8.x store apps.
Enumerator.item - Archive of obsolete content
ytespergb; s += freegb.tofixed(3) + " gb free of "; s += totalgb.tofixed(3) + " gb"; } else { s += "not ready"; } s += "<br />"; e.movenext(); } return(s); } requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, and internet explorer 10 standards.
... not supported in windows
8.x store apps.
Enumerator.moveFirst - Archive of obsolete content
ytespergb; s += freegb.tofixed(3) + " gb free of "; s += totalgb.tofixed(3) + " gb"; } else { s += "not ready"; } s += "<br />"; e.movenext(); } return(s); } requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, and internet explorer 10 standards.
... not supported in windows
8.x store apps.
Enumerator.moveNext - Archive of obsolete content
ytespergb; s += freegb.tofixed(3) + " gb free of "; s += totalgb.tofixed(3) + " gb"; } else { s += "not ready"; } s += "<br />"; e.movenext(); } return(s); } requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, and internet explorer 10 standards.
... not supported in windows
8.x store apps.
Error.description - Archive of obsolete content
ment.write (" "); // prints 5009: document.write((e.number & 0xffff)) document.write (" "); // prints "'y' is undefined": document.write(e.description); document.write (" "); // prints "'y' is undefined": document.write(e.message) } requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, internet explorer 10 standards, internet explorer 11 standards.
... also supported in store apps (windows
8 and windows phone
8.1).
Error.number - Archive of obsolete content
error code: 5009 facility code: 10 error message: 'y' is undefined requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, internet explorer 10 standards, internet explorer 11 standards.
... also supported in store apps (windows
8 and windows phone
8.1).
ScriptEngine() - Archive of obsolete content
example the following example illustrates the use of the scriptengine function: if (window.scriptengine) { console.log(window.scriptengine()); } // output: jscript requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, internet explorer 10 standards, internet explorer 11 standards.
... also supported in store apps (windows
8 and windows phone
8.1).
ScriptEngineBuildVersion - Archive of obsolete content
example the following example illustrates the use of the scriptenginebuildversion function: if(window.scriptenginebuildversion) { console.log(window.scriptenginebuildversion()); } // output: <current build version> requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, internet explorer 10 standards, internet explorer 11 standards.
... also supported in store apps (windows
8 and windows phone
8.1).
ScriptEngineMajorVersion - Archive of obsolete content
example the following example illustrates the use of the scriptenginemajorversion function: if (window.scriptenginemajorversion) { console.log(window.scriptengine()); } output: <current major version> requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, internet explorer 10 standards, internet explorer 11 standards.
... also supported in store apps (windows
8 and windows phone
8.1).
ScriptEngineMinorVersion - Archive of obsolete content
if (window.scriptengineminorversion) { console.log(window.scriptengineminorversion()); } //output: <current minor version> requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, internet explorer 10 standards, internet explorer 11 standards.
... also supported in store apps (windows
8 and windows phone
8.1).
VBArray.dimensions - Archive of obsolete content
= "the upper bound of dimension "; s += i + " is "; s += a.ubound(i); s += ".<br />"; } return(s); } --> </script> </head> <body> <script type="text/javascript"> document.write(vbarraytest(createvbarray())); </script> </body> requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, and internet explorer 10 standards.
... not supported in windows
8.x store apps.
VBArray.getItem - Archive of obsolete content
for (i = 0; i <= 2; i++) { for (j =0; j <= 2; j++) { document.writeln(a.getitem(i, j)); } } } --> </script> </head> <body> <script type="text/javascript"> <!-- getitemtest(createvbarray()); --> </script> </body> requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, and internet explorer 10 standards.
... not supported in windows
8.x store apps.
VBArray.lbound - Archive of obsolete content
"the lower bound of dimension "; s += i + " is "; s += a.lbound(i); s += ".<br />"; } return (s); } --> </script> </head> <body> <script type="text/javascript"> document.write(vbarraytest(createvbarray())); </script> </body> requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, and internet explorer 10 standards.
... not supported in windows
8.x store apps.
VBArray.ubound - Archive of obsolete content
"the upper bound of dimension "; s += i + " is "; s += a.ubound(i); s += ".<br />"; } return (s); } --> </script> </head> <body> <script type="text/javascript"> document.write(vbarraytest(createvbarray())); </script> </body> requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, and internet explorer 10 standards.
... not supported in windows
8.x store apps.
VBArray - Archive of obsolete content
requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer
8 standards, internet explorer 9 standards, and internet explorer 10 standards.
... not supported in windows
8.x store apps.
Desktop mouse and keyboard controls - Game development
there are no helpers so you have to remember what the given codes are (or look them up); 37 is the left arrow: function keydownhandler(event) { if(event.keycode == 39) { rightpressed = true; } else if(event.keycode == 37) { leftpressed = true; } if(event.keycode == 40) { downpressed = true; } else if(event.keycode == 3
8) { uppressed = true; } } the keyuphandler looks almost exactly the same as the keydownhandler above, but instead of setting the pressed variables to true, we would set them to false.
... we could write our own keycode object containing the key codes, for example: var keyboardhelper = { left: 37, up: 3
8, right: 39, down: 40 }; that way instead of using the codes to compare the input in the handler functions we could do something like this, which is arguably easier to remember: if(event.keycode == keyboardhelper.left) { leftpressed = true; } note: you can also find a list if the different keycodes and what keys they relate to in the keycode reference page.
Mobile touch controls - Game development
the initialization of virtual joystick looks like this: this.pad = this.game.plugins.add(phaser.virtualjoystick); this.stick = this.pad.addstick(30, 30,
80, 'generic'); in the create() function of the game state we're creating a virtual pad and a generic stick that has four directional virtual buttons by default.
... this is placed 30 pixels from the top and left edges of the screen and is
80 pixels wide.
Unconventional controls - Game development
all that is needed is checking for key presses: window.addeventlistener("keydown", function(event) { switch(event.keycode) { case
8: { // pause the game break; } case 5
88: { // detonate bomb break; } // ...
...we next add these lines after all the event listeners for keyboard and mouse, but before the draw method: var todegrees = 1 / (math.pi / 1
80); var horizontaldegree = 0; var verticaldegree = 0; var degreethreshold = 30; var grabstrength = 0; right after that we use the leap's loop method to get the information held in the hand variable on every frame: leap.loop({ hand: function(hand) { horizontaldegree = math.round(hand.roll() * todegrees); verticaldegree = math.round(hand.pitch() * todegrees); grabstreng...
Crisp pixel art look with image-rendering - Game development
if the canvas was created with a 12
8 pixel width, for example, we would set the css width to 512px if we wanted a 4x scale.
...the original image we want to upscale looks like this: here's some html to create a simple canvas: <canvas id="game" width="12
8" height="12
8"></canvas> css to size the canvas and render a crisp image: canvas { width: 512px; height: 512px; image-rendering: -moz-crisp-edges; image-rendering: -webkit-crisp-edges; image-rendering: pixelated; image-rendering: crisp-edges; } and some javascript to set up the canvas and load the image: // get canvas context var ctx = document.getelementbyid('game').getcontext('2...
Square tilemaps implementation: Static maps - Game development
we need to supply the atlas image, the coordinates and dimensions of the tile inside the atlas, and the target coordinates and size (a different tile size in here would scale the tile.) so, for instance, to draw the tree tile, which is the third in the atlas, at the screen coordinates (12
8, 320), we would call drawimage() with these values: context.drawimage(atlasimage, 192, 0, 64, 64, 12
8, 320, 64, 64); in order to support atlases with multiple rows and columns, you would need to know how many rows and columns there are to be able to compute the source x and y.
...this features an
8 x
8 map with tiles 64 x 64 pixels in size: var map = { cols:
8, rows:
8, tsize: 64, tiles: [ 1, 3, 3, 3, 1, 1, 3, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 2, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 2, 1, 1, 1, 1, 1, 1, 1, 1, 2, 1, 1, 1, 1, 1, 1, 1, 2, 1, 1, 1, 1, 1, 1, 0, 0, 1, 1, 1 ], gettile: function(col, row) { return this.tiles[row * map.cols ...
Create the Canvas and draw on it - Game development
using your favourite text editor, create a new html document, save it as index.html, in a sensible location, and add the following code to it: <!doctype html> <html> <head> <meta charset="utf-
8" /> <title>gamedev canvas workshop</title> <style> * { padding: 0; margin: 0; } canvas { background: #eee; display: block; margin: 0 auto; } </style> </head> <body> <canvas id="mycanvas" width="4
80" height="320"></canvas> <script> // javascript code goes here </script> </body> </html> we have a charset defined, <title> and some basic css in the header.
...the <canvas> element has an id of mycanvas to allow us to easily grab a reference to it, and it is 4
80 pixels wide and 320 pixels high.
Extra lives - Game development
add the following lines below the existing scoretext definition inside your create() function: livestext = game.add.text(game.world.width-5, 5, 'lives: '+lives, { font: '1
8px arial', fill: '#0095dd' }); livestext.anchor.set(1,0); lifelosttext = game.add.text(game.world.width*0.5, game.world.height*0.5, 'life lost, click to continue', { font: '1
8px arial', fill: '#0095dd' }); lifelosttext.anchor.set(0.5); lifelosttext.visible = false; the livestext and lifelosttext objects look very similar to the scoretext one — they define a position on the screen, the actual t...
...to make it easier for us to maintain in the future we can create a separate variable that will hold our styling, let's call it textstyle and place it before the text definitions: textstyle = { font: '1
8px arial', fill: '#0095dd' }; we can now use this variable when stlying our text labels — update your code so that the multiple instances of the text styling are replaced with the variable: scoretext = game.add.text(5, 5, 'points: 0', textstyle); livestext = game.add.text(game.world.width-5, 5, 'lives: '+lives, textstyle); livestext.anchor.set(1,0); lifelosttext = game.add.text(game.world.wid...
Game over - Game development
« previousnext » this is the
8th step out of 16 of the gamedev phaser tutorial.
... you can find the source code as it should look after completing this lesson at gamedev-phaser-content-kit/demos/lesson0
8.html.
The score - Game development
var scoretext; var score = 0; adding score text to the game display now add this line at the end of the create() function: scoretext = game.add.text(5, 5, 'points: 0', { font: '1
8px arial', fill: '#0095dd' }); the text() method can take four parameters: the x and y coordinates to draw the text at.
...in our case the score text will be blue, sized at 1
8 pixels, and use the arial font.
Visual-js game engine - Game development
full name : visual-js gui for windows multiplatform 2d game engine creator : nikola lukic 2017 201
8 open source visual-js project parts : -2d part : this is javascript game engine (server part node.js / client part js) js framework with windows gui editor and game instance creator.
... online demo examples at : https://jsfiddle.net/user/zlatnaspirala/fiddles/ demo slot mashine basic demo at : https://jsfiddle.net/zlatnaspirala/7d0d
8v6d/ help about new 2d part - implementation of matter.js based typescript .
Gecko FAQ - Gecko Redirect 1
gecko runs today on win32 (windows xp service pack 2, windows vista, windows 7, windows
8, windows
8.1, windows 10), mac os x 10.5 and later, and linux.
...widget sets for win32, x, and mac user preferences library mozilla plug-in api (npapi) to support the navigator plug-in interface open java interface (oji), with sun java 1.2 jvm rdf back end font library security library (nss) original document information author(s): angus other contributors: ekrock, vidur, hidday, drunclear copyright information: portions of this content are © 199
8–2006 by individual mozilla.org contributors; content available under a creative commons license ...
RGB - MDN Web Docs Glossary: Definitions of Web-related terms
in css they can be represented as a single 24-bit integer in hexadecimal notation (for example, #add
8e6 is light blue), or in functional notation as three separate
8-bit integers (for example, rgb(46, 139,
87) is sea green).
... in opengl, webgl, and glsl the red-green-blue components are fractions (floating-point numbers between 0.0 and 1.0), although in the actual color buffer they are typically stored as
8-bit integers.
Request header - MDN Web Docs Glossary: Definitions of Web-related terms
a few request headers after a get request: get /home.html http/1.1 host: developer.mozilla.org user-agent: mozilla/5.0 (macintosh; intel mac os x 10.9; rv:50.0) gecko/20100101 firefox/50.0 accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.
8 accept-language: en-us,en;q=0.5 accept-encoding: gzip, deflate, br referer: https://developer.mozilla.org/testpage.html connection: keep-alive upgrade-insecure-requests: 1 if-modified-since: mon, 1
8 jul 2016 02:36:04 gmt if-none-match: "c561c6
8d0ba92bbeb
8b0fff2a9199f722e3a621a" cache-control: max-age=0 strictly speaking, the content-length header in this example is not a request header like the ...
...others, but an entity header: post /myform.html http/1.1 host: developer.mozilla.org user-agent: mozilla/5.0 (macintosh; intel mac os x 10.9; rv:50.0) gecko/20100101 firefox/50.0 content-length: 12
8 learn more technical knowledge list of all http headers ...
Response header - MDN Web Docs Glossary: Definitions of Web-related terms
note that strictly speaking, the content-encoding and content-type headers are entity header: 200 ok access-control-allow-origin: * connection: keep-alive content-encoding: gzip content-type: text/html; charset=utf-
8 date: mon, 1
8 jul 2016 16:06:00 gmt etag: "c561c6
8d0ba92bbeb
8b0f612a9199f722e3a621a" keep-alive: timeout=5, max=997 last-modified: mon, 1
8 jul 2016 02:36:04 gmt server: apache set-cookie: mykey=myvalue; expires=mon, 17-jul-2017 16:06:00 gmt; max-age=31449600; path=/; secure transfer-encoding: chunked vary: cookie, accept-encoding x-backend-server: developer2.webapp.scl3.mozilla.com x-cache-info: ...
...not cacheable; meta data too large x-kuma-revision: 10
85259 x-frame-options: deny ...
Round Trip Time (RTT) - MDN Web Docs Glossary: Definitions of Web-related terms
$ ping example.com ping example.com (216.5
8.194.174): 56 data bytes 64 bytes from 216.5
8.194.174: icmp_seq=0 ttl=55 time=25.050 ms 64 bytes from 216.5
8.194.174: icmp_seq=1 ttl=55 time=23.7
81 ms 64 bytes from 216.5
8.194.174: icmp_seq=2 ttl=55 time=24.2
87 ms 64 bytes from 216.5
8.194.174: icmp_seq=3 ttl=55 time=34.904 ms 64 bytes from 216.5
8.194.174: icmp_seq=4 ttl=55 time=26.119 ms --- google.com ping statistics --- 5 packets transmitted, 5 packets received, 0.0% packet loss round-trip min/avg/max/stddev = 23.7
81/2...
...6.
82
8/34.904/4.114 ms in the above example, the average round trip time is shown on the final line as 26.
8ms.
Character encoding - MDN Web Docs Glossary: Definitions of Web-related terms
by specifying a particular encoding (such as utf-
8), we specify how the sequence of bytes is to be interpreted.
... for example, in html we normally declare a character encoding of utf-
8, using the following line: <meta charset="utf-
8"> this ensures that you can use characters from just about any human language in your html document, and they will display reliably.
MDN Web Docs Glossary: Definitions of Web-related terms
gzip compression h hash head high-level programming language hmac hoisting host hotlink houdini hpkp hsts html html5 http http header http/2 http/3 https hyperlink hypertext i i1
8n iana icann ice ide idempotent identifier idl ietf iife imap immutable index indexeddb information architecture inheritance input method editor instance internationalization internet intrinsic size ip address ...
... control protocol (tcp) transport layer security (tls) tree shaking trident truthy ttl turn type type coercion type conversion u udp (user datagram protocol) ui undefined unicode uri url urn usenet user agent utf-
8 ux v validator value variable vendor prefix viewport visual viewport voip w w3c wai wcag web performance web server web standards webassembly webdav webextensions webgl webidl webkit ...
HTML: A good basis for accessibility - Learn web development
"100"> <button width="100">go!</button> </td> </tr> <!-- spacer row --> <tr id="spacer" height="10"> <td> </td> </tr> <!-- main content and aside row --> <tr id="main"> <td id="content" colspan="4" bgcolor="#ffffff"> <!-- main content goes here --> </td> <td id="aside" colspan="2" bgcolor="#ff
80ff" valign="top"> <h2>related</h2> <!-- aside content goes here --> </td> </tr> <!-- spacer row --> <tr id="spacer" height="10"> <td> </td> </tr> <!-- footer row --> <tr id="footer" bgcolor="#ffffff"> <td colspan="6"> <p>©copyright 2050 by nobody.
...xt labels, and how to investigate text label issues using the firefox accessibility inspector, in the following video: accessible data tables a basic data table can be written with very simple markup, for example: <table> <tr> <td>name</td> <td>age</td> <td>gender</td> </tr> <tr> <td>gabriel</td> <td>13</td> <td>male</td> </tr> <tr> <td>elva</td> <td>
8</td> <td>female</td> </tr> <tr> <td>freida</td> <td>5</td> <td>female</td> </tr> </table> but this has problems — there is no way for a screen reader user to associate rows or columns together as groupings of data.
HTML: A good basis for accessibility - Learn web development
"100"> <button width="100">go!</button> </td> </tr> <!-- spacer row --> <tr id="spacer" height="10"> <td> </td> </tr> <!-- main content and aside row --> <tr id="main"> <td id="content" colspan="4" bgcolor="#ffffff"> <!-- main content goes here --> </td> <td id="aside" colspan="2" bgcolor="#ff
80ff" valign="top"> <h2>related</h2> <!-- aside content goes here --> </td> </tr> <!-- spacer row --> <tr id="spacer" height="10"> <td> </td> </tr> <!-- footer row --> <tr id="footer" bgcolor="#ffffff"> <td colspan="6"> <p>©copyright 2050 by nobody.
...xt labels, and how to investigate text label issues using the firefox accessibility inspector, in the following video: accessible data tables a basic data table can be written with very simple markup, for example: <table> <tr> <td>name</td> <td>age</td> <td>gender</td> </tr> <tr> <td>gabriel</td> <td>13</td> <td>male</td> </tr> <tr> <td>elva</td> <td>
8</td> <td>female</td> </tr> <tr> <td>freida</td> <td>5</td> <td>female</td> </tr> </table> but this has problems — there is no way for a screen reader user to associate rows or columns together as groupings of data.
Advanced styling effects - Learn web development
ton> button { width: 150px; font-size: 1.1rem; line-height: 2; border-radius: 10px; border: none; background-image: linear-gradient(to bottom right, #777, #ddd); box-shadow: 1px 1px 1px black, inset 2px 3px 5px rgba(0,0,0,0.3), inset -2px -3px 5px rgba(255,255,255,0.5); } button:focus, button:hover { background-image: linear-gradient(to bottom right, #
888, #eee); } button:active { box-shadow: inset 2px 2px 1px black, inset 2px 3px 5px rgba(0,0,0,0.3), inset -2px -3px 5px rgba(255,255,255,0.5); } this gives us the following result: here we've set up some button styling along with focus/hover/active states.
...here we'll present the same two <div>s, but each one is now sat on top of a simple <div> with a purple background, to show how the elements will blend together: <article> no mix blend mode <div> </div> <div> </div> </article> <article> multiply mix <div class="multiply-mix"> </div> <div> </div> </article> here's the css we'll style this with: article { width: 2
80px; height: 1
80px; margin: 10px; position: relative; display: inline-block; } div { width: 250px; height: 130px; padding: 10px; margin: 10px; } article div:first-child { position: absolute; top: 10px; left: 0; background: url(https://mdn.mozillademos.org/files/13090/colorful-heart.png) no-repeat center 20px; background-color: green; } article div:last-child { backgr...
Beginner's guide to media queries - Learn web development
previous overview: css layout next the css media query gives you a way to apply css only when the browser and device environment matches a rule that you specify, for example "viewport is wider than 4
80 pixels".
... * { 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, 1
85, 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 { background-color: rgba(79, 1
85, 227, 0.3); border: 1px solid rgb(79, 1
85, 227); padding: 10px; } .sidebar { background-color: rgba(207, 232, 220, 0.5); padding: 10px; } article { m...
Fundamental text and font styling - Learn web development
this makes doing the maths to work out your font sizes much easier, although if you want to support really old browsers, you might struggle — rem is not supported in internet explorer
8 and below.
...--> </article> you would need to set its em value to 20/24, or 0.
83333333 em.
The HTML5 input types - Learn web development
the below screenshots show a non-empty search field in firefox 71, safari 13, and chrome 79 on macos, and edge 1
8 and chrome 79 on windows 10.
... <label for="mydate">when are you available this summer?</label> <input type="date" name="mydate" min="2013-06-01" max="2013-0
8-31" step="7" id="mydate"> browser support for date/time inputs you should be warned that the date and time widgets don't have the best browser support.
Other form controls - Learn web development
<textarea cols="30" rows="
8"></textarea> this renders like so: the main difference between a <textarea> and a regular single line text field is that users are allowed to include hard line breaks (i.e.
... the following screenshots show default, focused, and disabled <textarea> elements in firefox 71 and safari 13 on macos, and edge 1
8, yandex 14, firefox 71 and chrome 79 on windows 10.
UI pseudo-classes - Learn web development
t + span { position: relative; } input + span::after { font-size: 0.7rem; position: absolute; padding: 5px 10px; top: -26px; } input:required + span::after { color: white; background-color: black; content: "required"; left: -70px; } input:out-of-range + span::after { color: white; background-color: red; width: 155px; content: "outside allowable value range"; left: -1
82px; } this is a similar story to what we had before in the :required example, except that here we've split out the declarations that apply to any ::after content into a separate rule, and given the separate ::after content for :required and :out-of-range states their own content and styling.
...ols using the :read-only and :read-write pseudo-classes, like so: input:-moz-read-only, textarea:-moz-read-only, input:read-only, textarea:read-only { border: 0; box-shadow: none; background-color: white; } textarea:-moz-read-write, textarea:read-write { box-shadow: inset 1px 1px 3px #ccc; border-radius: 5px; } firefox only supported these pseudo-classes with a prefix up to version 7
8; at which point it started to support the unprefixed version.
HTML basics - Learn web development
let's revisit the code we put into our index.html example (which we first met in the dealing with files article): <!doctype html> <html> <head> <meta charset="utf-
8"> <title>my test page</title> </head> <body> <img src="images/firefox-icon.png" alt="my test image"> </body> </html> here, we have the following: <!doctype html> — the doctype.
... <meta charset="utf-
8"> — this element sets the character set your document should use to utf-
8 which includes most characters from the vast majority of written languages.
The web and web standards - Learn web development
in 19
80, tim berners-lee (often referred to as timbl) wrote a notebook program called enquire, which featured the concept of links between different nodes.
... fast forward to 19
89, and timbl wrote information management: a proposal and hypertext at cern; these two publications together provided the background for how the web would work.
Introduction to events - Learn web development
the other two are relatively interchangeable, at least for simple uses: event handler properties have less power and options, but better cross-browser compatibility (being supported as far back as internet explorer
8).
... note: if you are called on to support browsers older than internet explorer
8, you may run into difficulties, as such ancient browsers use different event models from newer browsers.
Fetching data from the server - Learn web development
now load the index file in your browser (via localhost:
8000) and look in your browser developer console.
...the object url will be visible inside the address bar, and should be something like this: blob:http://localhost:7
800/9b75250e-5279-e249-
884f-d03eb1fd
84f4 challenge: an xhr version of the can store we'd like you to try converting the fetch version of the app to use xhr as a useful bit of practice.
Test your skills: Math - Learn web development
you will have to create four numeric values, then add the first two together, then subtract the fourth from the third, then multiply the two secondary results together to get a result of 4
8.
...the product should be 4
8.
Inheritance in JavaScript - Learn web development
uctor(first, last, age, gender, interests, subject, grade) { super(first, last, age, gender, interests); // subject and grade are specific to teacher this.subject = subject; this.grade = grade; } } now when we instantiate teacher object instances, we can call methods and properties defined on both teacherand person as we'd expect: let snape = new teacher('severus', 'snape', 5
8, 'male', ['potions'], 'dark arts', 5); snape.greeting(); // hi!
...snape.age // 5
8 snape.subject; // dark arts like we did with teachers, we could create other subclasses of person to make them more specialized without modifying the base class.
Multimedia: video - Learn web development
while a 12
8 kb video may seem like it could provide a better user experience than a 10 mb download, a grainy gif-like video may reflect poorly on the brand or project.
... <video autoplay="" loop="" muted="true" playsinline="" id="hero-video"> <source src="banner_video.webm" type='video/webm; codecs="vp
8, vorbis"'> <source src="web_banner.mp4" type="video/mp4"> </video> this hero-video code (above) is common to conference websites and corporate home pages.
Componentizing our Svelte app - Learn web development
repl to code along with us using the repl, start at https://svelte.dev/repl/99b9eb22
8b404a2f
8c
8959b22c0a40d3?version=3.23.2 breaking the app into components in svelte, an application is composed from one or more components.
... repl to see the current state of the code in a repl, visit: https://svelte.dev/repl/76cc90c43a37452e
8c7f70521f
88b69
8?version=3.23.2 summary now we have all of our app's required functionality in place.
Advanced Svelte: Reactivity, lifecycle, accessibility - Learn web development
repl to code along with us using the repl, start at https://svelte.dev/repl/76cc90c43a37452e
8c7f70521f
88b69
8?version=3.23.2 working on the moreactions component now we'll tackle the check all and remove completed buttons.
... repl to see the current state of the code in a repl, visit: https://svelte.dev/repl/d1fa
84a5a4494366b179c
87395940039?version=3.23.2 summary in this article we have finished adding all the required functionality to our app, plus we've taken care of a number of accessibility and usability issues.
Dynamic behavior in Svelte: working with variables and props - Learn web development
repl to code along with us using the repl, start at https://svelte.dev/repl/c
862d964d4
8d473ca63ab91709a0a5a0?version=3.23.2 working with todos our todos.svelte component is currently just displaying static markup; let's start making it a bit more dynamic.
... repl to see the current state of the code in a repl, visit: https://svelte.dev/repl/99b9eb22
8b404a2f
8c
8959b22c0a40d3?version=3.23.2 summary that will do for now!
Gecko info for Windows accessibility vendors
firefox (please use version 1.1 alpha builds or later) thunderbird (please use version 1.1 alpha builds or later) mozilla seamonkey (please use 1.
8 alpha builds or later) how to find the content window and load the document screen readers need to find the content window so that they know where to start grabbing the msaa tree, in order to load the current document into a buffer in their own process.
... to get to the isimpledomnode interface for an object, you start with an iaccessible*, and then you queryservice to the isimpledomnode*: iserviceprovider *pservprov = null; paccessible->queryinterface(iid_iserviceprovider, (void**)&pservprov); isimpledomnode *psimpledomnode; if (pservprov) { const guid refguid = {0x0c539790, 0x12e4, 0x11cf, 0xb6, 0x61, 0x00, 0xaa, 0x00, 0x4c, 0xd6, 0xd
8}; hresult result = pservprov->queryservice(refguid, iid_isimpledomnode, (void**)&psimpledomnode); if (succeeded(hresult) && psimpledomnode != null) { /* this is a mozilla node!
Information for Governments and Other Organizations Evaluating Mozilla
mozilla's section 50
8 compliance section 50
8 is a set of accessibility requirements that help us federal agencies decide what software applications they can use.
...these guidelines go much further than section 50
8 does and mozilla is further from doing a good job at satisfying them.
ZoomText
here's how you can test: download a copy of mozilla 1.
8a6 (this is not firefox).
... you will also need to install zoomtext
8.11.3.
Benchmarking
async stacks async stacks no longer impact performance since firefox 7
8, as bug 1601179 limits async stack capturing to when devtools is opened.
...see bug 12
80
819.
Building SpiderMonkey with UBSan
root="$home/llvm" sanflag="-fsanitize=undefined -fno-sanitize=alignment,float-cast-overflow,float-divide-by-zero,vptr -dxmalloc=myxmalloc" \ cc="$llvm_root/build/release+asserts/bin/clang" \ cxx="$llvm_root/build/release+asserts/bin/clang++" \ cflags="$sanflag" \ cxxflags="$sanflag" \ moz_llvm_hacks=1 \ ../configure --enable-debug --disable-optimize make -j
8 fi 3.
...this enables all the cheap undefined behavior checks other than: alignment, which hits known bugs in spidermonkey, and is more implementation-defined (slow on x
86 / crash on arm) than undefined behavior float-cast-overflow, which hits known bugs in spidermonkey, and isn't exploited by today's compilers float-divide-by-zero, which jesse doesn't think is actually undefined behavior (aside from the question of whether cpu overflow flags are set) vptr, a check that requires rtti, which is disabled by default in spidermonkey 4.
Creating Sandboxed HTTP Connections
introduction starting with gecko 1.
8.1 (firefox 2), it is possible to create sandboxed http connections which don't affect the user's cookies.
...as of mozilla 1.
8.1 (firefox 2), it is now possible to intercept those two cases.
Debugging Chrome
i copied the d3d9.dll into both c:\users\jrmuizel\appdata\local\google\chrome sxs\application\22.0.11
86.0 and c:\users\jrmuizel\appdata\local\google\chrome sxs\application\.
...i did trace_file=foo.txt and it created the trace file in "c:\users\jrmuizel\appdata\local\google\chrome sxs\application\22.0.11
83.0\foo.txt".
Simple Instantbird build
build prerequisites hardware requirements: while you can build instantbird on older hardware it can take quite a bit of time to compile on slower machines, and having
8gb of ram is recommended (though you can probably still get away with 4gb).
...for example, a mac user may get an object directory name of obj-x
86_64-apple-darwin10.7.3/.
Simple SeaMonkey build
minimum and recommended hardware requirements for mozilla development are: recommended:
8gb of ram (having only 4gb ram and 4gb swap may give memory errors during compile) 35 gb free disk space.
... if you decided on the windows
8 sdk, you also need the outlook 2010 mapi header files from microsoft.
Simple Sunbird build
install visual c++ 2005 or 200
8.
...after that all should be well.) open a shell window by running: c:\mozilla-build\start-msvcx.bat (where x is
8 for vs 2005, and 9 for vs 200
8).
Eclipse CDT Manual Setup
if you want a column marker to mark the
80th column to help with formatting code to mozilla's
80 character line limit, tick "show print margin" and set the value to
80.
... in cdt
8.3 (unreleased as of august 2013), there will be a more user-friendly way to specify this (see http://wiki.eclipse.org/cdt/user/newin
83#toolchains).
SVG Guidelines
th> unreferenced/unused clip paths, masks or defs (example) styling basics privilege short lowercase hex for colors don't use excessive precision for numeric values (usually comes from illustrator) use descriptive ids avoid inline styles and use class names or svg attributes examples here are some examples for excessive number precision: 5.000000e-02 → 0.05 (as seen here) -3.72
892
8e-10 → 0 (as seen here) translate(0.000000, -1.000000) → translate(0, -1) (as seen here) as for descriptive ids: for gradients: svg_id1 → gradient1 (as seen here) use of class names avoid using a class if that class is only used once in the file if that class only sets a fill or a stroke, it's better to set the fill/stroke directly on the actual shape, instead of introducing a...
...you can avoid this by doing basic algebra, for example: <g transform="translate(-62, -310)"><shape transform="translate(60, 30
8)"/></g> can be cut down to: <shape transform="translate(-2,-2)"/> because: -62+60 = -310+30
8 = -2 performance tips these rules are optional, but they help speeding up the svg.
Message manager overview
from firefox 3
8 onwards, they also enable code running in the parent process to load process scripts into the child process.
... from firefox 3
8 onwards, you can also use a parent process message manager to load a script into a child process.
Message manager overview
from firefox 3
8 onwards, they also enable code running in the parent process to load process scripts into the child process.
... from firefox 3
8 onwards, you can also use a parent process message manager to load a script into a child process.
CSS <display-xul> component
obsolete since gecko 62 xul grid group -moz-grid-line obsolete since gecko 62 xul grid line -moz-stack obsolete since gecko 62 xul stack -moz-inline-stack obsolete since gecko 62 xul inline stack -moz-deck obsolete since gecko 62 xul deck -moz-popup obsolete since gecko 62 xul popup all xul display values, with the exception of -moz-box and -moz-inline-box, have been removed in bug 12
88572.
... the -moz-box and -moz-inline-box values will be removed later in bug
879275.
Geckoview-Junit Tests
@test fun contentcrashignored() { // cannot test x
86 debug builds due to gecko's "ah_crap_handler" // that waits for debugger to attach during a sigsegv.
... assumethat(sessionrule.env.isdebugbuild && sessionrule.env.cpuarch == "x
86", equalto(false)) running tests on try to run these tests on try, use something like: mach try fuzzy -q geckoview-junit --artifact or mach try -b do -p android-x
86_64 -u geckoview-junit --artifact currently, geckoview-junit is only run on android-x
86_64.
Hacking with Bonsai
the process everyone who checks into the tree, joins a group called "the hook" at
8:00 am pst every weekday morning, the source tree is closed.
... the build team will then pull the
8:00 am tree, and build it on a subset of the platforms, linux, win32 & macppc.
How Mozilla determines MIME Types
however, starting in mozilla 1.7alpha, mozilla does do content sniffing, like this: when the content-type sent by the server is one of (case-sensitively) text/plain text/plain; charset=iso-
8859-1 text/plain; charset=iso-
8859-1 and the server did not send a content-encoding header, mozilla will sniff the first block of data it gets and check for non-text bytes.
... unknown decoder located at netwerk/streamconv/converters/nsunknowndecoder.cpp, the interesting part starts at line 2
87, the ssnifferentries array together with the determinecontenttype function.
Extending a Protocol
this will matter later, as we will need to convert it to utf-
8 (using nscstring) to send it to the parent process.
... // we convert the string to utf
8 echochild->sendecho(ns_convertutf16toutf
8(astring)) ->then( getmainthreadserialeventtarget(), __func__, // resolve lambda [echopromise](const nscstring& returnedstring) { puts("[navigator.cpp] yay, we got a message back!"); // send the string back out a utf16 echopromise->mayberesolve(ns_convertutf
8toutf16(returnedstring));...
AddonManager
scope_system
8 this add-on is installed somewhere global to the system (installed for all users of the computer).
...starting in firefox
8, you can also set the value of the preference extensions.autodisabledscopes to prevent firefox from automatically installing add-ons from the specified scopes.
Downloads.jsm
it will be enabled when the bug
851471 will be closed.
... components.manager.queryinterface(components.interfaces.nsicomponentregistrar) .registerfactory(components.id("{1b4c
85df-cbdd-4bb6-b04e-613caece0
83c}"), "", "@mozilla.org/transfer;1", null); ...
NetUtil.jsm
defaults to utf-
8 if not provided.
...defaults to utf-
8 if not provided.
Examples
romise was succesful and reason was = "' + asuccessreason + '"'); }, function(arejectreason) { alert('mypromise failed for reason = "' + uneval(arejectreason) + '"'); } ); function myuserdefinedpromise() { return 'i didnt do a promise.resolve so this will not understand that mypromise is a promise'; } // creates this error: /* exception: mypromise.then is not a function @scratchpad/5:
8:1 wca_evalwithdebugger@resource://gre/modules/commonjs/toolkit/loader.js -> resource://gre/modules/devtools/server/actors/webconsole.js:1069:7 wca_onevaluatejs@resource://gre/modules/commonjs/toolkit/loader.js -> resource://gre/modules/devtools/server/actors/webconsole.js:734:9 dsc_onpacket@resource://gre/modules/commonjs/toolkit/loader.js -> resource://gre/modules/devtools/server/main.js:109
8:9 ...
...ldt_send/<@resource://gre/modules/devtools/dbg-client.jsm -> resource://gre/modules/devtools/server/transport.js:279:11 makeinfallible/<@resource://gre/modules/commonjs/toolkit/loader.js -> resource://gre/modules/devtools/devtoolsutils.js:
84:7 */ intermediate of user defined promise function 1 components.utils.import("resource://gre/modules/promise.jsm"); // this function creates and returns a new promise.
Using workers in JavaScript code modules
it works exactly like a standard worker, except that it has access to js-ctypes via a global ctypes object available in the global scope of the worker obsolete since gecko
8.0 (firefox
8.0 / thunderbird
8.0 / seamonkey 2.5)this feature is obsolete.
... note: as of gecko
8.0, the nsiworkerfactory interface has been removed starting in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1), you can use workers in javascript code modules (jsms).
source-editor.jsm
this component has been removed from the platform in firefox 2
8.
... sourceeditor.modes.text "text" utf-
8 text document.
Localization content best practices
u+201
8 and u+2019 (\u201
8 and \u2019 in javascript) are the left and right single quotation marks, respectively.
...see bug 65
8191 for more details.
Localizing with Koala
the easy way involves opening the console and issuing the following commands: c:\users\stas> cd c:\mozilla\l10n\application\firefox c:\mozilla\l10n\application\firefox> rmdir 3.6 c:\mozilla\l10n\application\firefox> hg clone http://hg.mozilla.org/releases/mozilla-1.9.2 3.6 requesting all changes adding changesets adding manifests adding file changes added 33099 changesets with 15
8636 changes to 50664 files (+9 heads) updating working directory 40357 files updated, 0 files merged, 0 files removed, 0 files unresolved configure the locale locale id: x-testing (put your locale's code) version: 3.6 location: choose the folder where you want to keep the localized files or leave empty for now check "mercurial" if you wish to use mercurial to keep the revision history of your...
...if you run "hg log" however, you will see you first commit in the repository's revision history: c:\mozilla\l10n\locale\x-testing\3.6> hg log changeset: 0:7c543e
8f3a6a tag: tip user: stas malolepszy <stas@mozilla.com> date: mon nov 23 1
8:0
8:25 2009 +0100 summary: added search bar strings congratulations!
Localization prerequisites
perl 5.6 or higher older perl versions may work if you upgrade file::spec to version 0.
8 gnu make 3.79.1 or higher.
... $ make –version gnu make 3.
81.90 … make works, too.
Release phase
here's how that's done: run this command to see recent commits in your local clone: $ hg log -l 3 you should a list of the most recent commits, similar to this one: changeset: 0:7c543e
8f3a6a tag: tip user: your name <email@example.com> date: mon nov 23 1
8:0
8:25 2009 +0100 summary: added search bar strings now run the hg outgoing command to compare the local repository on your machine with the remote repository on hg.mozilla.org.
...the output will look something like this: comparing with ssh://hg.mozilla.org/releases/l10n-central/x-testing searching for changes changeset: 0:7c543e
8f3a6a tag: tip user: your name <email@example.com> date: mon nov 23 1
8:0
8:25 2009 +0100 summary: added search bar strings make sure this output is accurate before continuing.
Uplifting a localization from Central to Aurora
this looks something like searching for changes adding changesets adding manifests adding file changes added 22 changesets with 23 changes to 46 files (+1 heads) (run 'hg heads' to see heads, 'hg merge' to merge) ok, let's make sure we're not talking relbranches: hg heads --template '{node} {branches}\n' this is printing something like 5131e147fa50c2
8ec
85
8c7d9fd1ba201ea2a433b 4da525ed77699794c560
81791bd46cc
859
83f6f
8 9bc7e6c5
8fc091c
8cd0e
8d9e1dbc7e6f592772a7 gecko20b12_201102221
8_relbranch 230e99fada602
842d9630e673077ef9f1ab34247 gecko20b12pre_20110216_relbranch 41a4357
884d7bcc50e69c71014124d3af24
82afe comm20b11_20110203_relbranch 2ec6ad14e716
8ebeb999b1e
8ae10632ae4c9df23 gecko20b11_2011020209_relbranch d6
8e647ac3c0fee709c13abb0f03fac...
...24a1a5d29 gecko20b11pre_20110126_relbranch 7ff37dc6
837669363a51ad3fd2
874ac
845d312d5 gecko20b10_2011012115_relbranch 6c31fe9bc065a
86aea2223ba4
869
8f1
8ae7563ad gecko20b9_201101101
8_relbranch here you can see that there are two changesets without a branch.
gettext
# #, fuzzy msgid "" msgstr "" "project-id-version: package version\n" "report-msgid-bugs-to: \n" "pot-creation-date: 2009-09-2
8 16:1
8+0200\n" "po-revision-date: year-mo-da ho:mi+zone\n" "last-translator: full name <email@address>\n" "language-team: language <ll@li.org>\n" "mime-version: 1.0\n" "content-type: text/plain; charset=charset\n" "content-transfer-encoding:
8bit\n" "plural-forms: nplurals=integer; plural=expression;\n" #.
...#: file.php:1
8 #, php-format msgid "%d user likes this." msgid_plural "%d users like this." msgstr[0] "" msgstr[1] "" #: file.php:22 #, php-format msgctxt "another unique context string" msgid "%d user likes this." msgid_plural "%d users like this." msgstr[0] "" msgstr[1] "" ...
Fonts for Mozilla's MathML engine
if you have a developer account, these are problems 16
841023 and 17021145.
...velopment) latin modern math libertinus math lucida bright math minion math stix math tex gyre bonum math tex gyre pagella math tex gyre schola math tex gyre termes math xits math fira math (sans-serif typeface, under development) gfs neohellenic math (sans-serif typeface) using mathematical fonts on web pages starting with gecko 31.0 (firefox 31.0 / thunderbird 31.0 / seamonkey 2.2
8), it is now easy to set up the css style (and optional woff fonts) to use on your web site.
Various MathML Tests
click the expression below to see several definitions of pi: π = 3.1415926535
8...
...v - ω ) d 3 v maxwell's equations { ∇ × b → - 1 c ∂ e → ∂ t = 4 π c j → ∇ ċ e → = 4 π ρ ∇ × e → + 1 c ∂ b → ∂ t = 0 → ∇ ċ b → = 0 einstein's field equations r μ ν - 1 2 g μ ν r =
8 π g c 4 t μ ν ...
Profiling with the Gecko Profiler and Local Symbols on Windows
profiling local builds as of march 201
8, profiling local builds on windows should work out of the box, with full symbol information.
...you need to add the lines ac_add_options --target=x
86_64-pc-mingw32 and ac_add_options --host=x
86_64-pc-mingw32 to your mozconfig in order to build a 64 bit build of firefox.
Patches and pushes
<searchplugin xmlns="http://www.mozilla.org/2006/browser/search/"> <shortname>yahoo</shortname> <description>yahoo search</description> <inputencoding>utf-
8</inputencoding> <image width="16" height="16">data:image/x-icon;base64,r0lgodlheaaqajecap
8aaaaaap///waaach5baeaaaialaaaaaaqabaaaaipli+py+0nogquybdened2khkffwuamezmpzsfmaihphrrguum/ft+uwaaow==</image> ***this tag is optional***<url type="application/x-suggestions+json" method="get" template="http://ff.search.yahoo.com/gossip?output=fxjson&command={searchterms}" />*** <url type="text/html"...
... method="get" template="http://search.yahoo.com/search"> <param name="p" value="{searchterms}"/> <param name="ei" value="utf-
8"/> <mozparam name="fr" condition="pref" pref="yahoo-fr" /> </url> <searchform>http://search.yahoo.com/</searchform> </searchplugin> create xml files for each search plugin preference following the above example.
Installing JSHydra
cd $home/jshydra hg clone http://hg.mozilla.org/users/pidgeot1
8_gmail.com/jshydra/ cd jshydra ./configure make # run jshydra tests make check processing input files jshydra requires the files it processes to be correct js files.
...there is not yet a repository for this information, but bug 50612
8 contains more information.
Leak And Bloat Tests
0
8/04/200
8: prefs.js created via tb with the above settings, the first section is for preferences included in tinderbox, the second section is ones which don't currently get set.
...ectory", "/home/moztest/.thunderbird/t7i1txfw.minimum/mail/tinderbox"); user_pref("mail.attachment.store.version", 1); user_pref("mail.folder.views.version", 1); user_pref("mail.spam.version", 1); user_pref("mailnews.quotingprefs.version", 1); user_pref("mailnews.ui.threadpane.version", 6); changes to leak and bloat tests date and time (pst) description approx effect on numbers pre dec 200
8 initial version - 200
8/12/07 11:20 bug 463594 disabled os x and outlook address books via the preference settings mac lk -56.2kb.
PRNetAddr
syntax #include <prio.h> union prnetaddr { struct { pruint16 family; char data[14]; } raw; struct { pruint16 family; pruint16 port; pruint32 ip; char pad[
8]; } inet; #if defined(_pr_inet6) struct { pruint16 family; pruint16 port; pruint32 flowinfo; pripv6addr ip; } ipv6; #endif /* defined(_pr_inet6) */ }; typedef union prnetaddr prnetaddr; fields the structure has the following fields: family address family: pr_af_inet|pr_af_inet6 for raw.family, pr_af_inet for inet.family, pr_af_inet6 for ipv6.family.
... ip the actual 32 (for inet.ip) or 12
8 (for ipv6.ip) bits of ip address.
PRTimeParameters
in pst, the local time is
8 hours behind gmt, so tp_gmt_offset is -2
8800 seconds.
...this is broken down as -
8 + 1 hours, so tp_gmt_offset is -2
8800 seconds, and tp_dst_offset is 3600 seconds.
PR_Open
pr_create_file 0x0
8 if the file does not exist, the file is created.
... pr_excl 0x
80 with pr_create_file, if the file does not exist, the file is created.
Certificate functions
mxr 3.2 and later cert_getusepkixforvalidation mxr 3.12 and later cert_getvaliddnspatternsfromcert mxr 3.12 and later cert_gentime2formattedascii mxr 3.2 and later cert_hexify mxr 3.2 and later cert_importcachain mxr 3.2 and later cert_importcerts mxr 3.2 and later cert_isrootdercert mxr 3.
8 and later cert_isusercert mxr 3.6 and later cert_keyfromdercrl mxr 3.4 and later cert_makecanickname mxr 3.4 and later cert_mergeextensions mxr 3.10 and later cert_nametoascii mxr 3.2 and later cert_newcertlist mxr 3.2 and later cert_newtempcertificate mxr 3.12 and later cert_nickname...
...stringsfromcertlist mxr 3.4 and later cert_opencertdbfilename mxr 3.2 and later cert_ocspcachesettings mxr 3.11.7 and later cert_pkixverifycert mxr 3.12 and later cert_removecertlistnode mxr 3.6 and later cert_rfc14
85_escapeandquote mxr 3.2 and later cert_savesmimeprofile mxr 3.2 and later cert_setsloptime mxr 3.2 and later cert_setocspfailuremode mxr 3.11.7 and later cert_setocsptimeout mxr 3.12 and later cert_setusepkixforvalidation mxr 3.12 and later cert_startcertextensions mxr 3.5 and later cert_startcertificaterequestattributes mxr 3.10 and later cert_startcrlentryextensions mxr 3.10 and...
JSS FAQ
if you are using jdk 1.3.x, you will need to use at least version 1.3.1--see bug 113
80
8.
...nrequest.java org/mozilla/jss/pkcs12/pfx.java org/mozilla/jss/pkix/cert/certificate.java org/mozilla/jss/pkix/cmmf/certrepcontent.java org/mozilla/jss/pkix/crmf/certreqmsg.java org/mozilla/jss/pkix/crmf/certtemplate.java org/mozilla/jss/pkix/primitive/name.java org/mozilla/jss/provider/javax/crypto/jsssecretkeyfactoryspi.java org/mozilla/jss/util/utf
8converter.java org/mozilla/jss/util/base64inputstream.java jss/samples/pqggen.java jss/samples/pkcs12.java if i don't call setcipherpolicy, is the domestic policy used by default?
JSS 4.4.0 Release Notes
jss 4.4.0 this bugzilla query returns all the bugs fixed in nss 4.4.0: https://bugzilla.mozilla.org/buglist.cgi?product=jss&target_milestone=4.4&target_milestone=4.4&bug_status=resolved&resolution=fixed documentation build instructions for jss at https://hg.mozilla.org/projects/jss/file/tip/readme platform information you can check out the source from mercurial via hg clone -r 055aa3ce
8a61 https://hg.mozilla.org/projects/jss jss 4.4.0 works with openjdk versions 1.7 or higher we suggest the latest - openjdk 1.
8.
... jss 4.4.0 requires nss 3.12.5 or higher though nss 3.2
8.3 is recommended.
NSS 3.14.4 release notes
bug
894370 - (cve-2013-1739) avoid uninitialized data read in the event of a decryption failure.
... bugs fixed in nss 3.14.4 https://bugzilla.mozilla.org/buglist.cgi?bug_id=
894370%2c
832942%2c
863947&bug_id_type=anyexact&list_id=
833
80
81&resolution=fixed&classification=components&query_format=advanced&product=nss compatibility nss 3.14.4 shared libraries are backward compatible with all older nss 3.x shared libraries.
NSS 3.15.3 release notes
bug 925100 - (cve-2013-1741) ensure a size is <= half of the maximum pruint32 value bug 934016 - (cve-2013-5605) handle invalid handshake packets bug 91043
8 - (cve-2013-5606) return the correct result in cert_verifycert on failure, if a verifylog isn't used new in nss 3.15.3 new functionality no new major functionality is introduced in this release.
...bugs fixed in nss 3.15.3 bug
85047
8 - list rc4_12
8 cipher suites after aes_12
8 cipher suites bug 919677 - don't advertise tls 1.2-only ciphersuites in a tls 1.1 clienthello a complete list of all bugs resolved in this release can be obtained at https://bugzilla.mozilla.org/buglist.cgi?resolution=fixed&classification=components&query_format=advanced&target_milestone=3.15.3&product=nss compatibility nss 3.15.3 shared libraries are backward compatible with all older nss 3.x shared libraries.
NSS 3.16.2.1 release notes
bug 1064636 - (cve-2014-156
8) rsa signature forgery in nss.
... bugs fixed in nss 3.16.2.1 bug 1064636 - (cve-2014-156
8) rsa signature forgery in nss acknowledgements the nss development team would like to thank antoine delignat-lavaud, security researcher at inria paris in team prosecco, and the advanced threat research team at intel security, who both independently discovered and reported this issue, for responsibly disclosing the issue by providing advance copies of their research.
NSS 3.16.5 release notes
bug 1064636 - (cve-2014-156
8) rsa signature forgery in nss.
... bugs fixed in nss 3.16.5 bug 1064636 - (cve-2014-156
8) rsa signature forgery in nss acknowledgements the nss development team would like to thank antoine delignat-lavaud, security researcher at inria paris in team prosecco, and the advanced threat research team at intel security, who both independently discovered and reported this issue, for responsibly disclosing the issue by providing advance copies of their research.
NSS 3.17.4 release notes
notable changes in nss 3.17.4 bug 10
849
86: if an ssl/tls connection fails, because client and server don't have any common protocol version enabled, nss has been changed to report error code ssl_error_unsupported_version (instead of reporting ssl_error_no_cypher_overlap).
... bug 11199
83: fixed interoperability of nss server code with a libressl client.
NSS 3.19.2.1 release notes
bug 119202
8 (cve-2015-71
81) and bug 1202
86
8 (cve-2015-71
82): several issues existed within the asn.1 decoder used by nss for handling streaming ber data.
... bug 1205157 (nspr, cve-2015-71
83): a logic bug in the handling of large allocations would allow exceptionally large allocations to be reported as successful, without actually allocating the requested memory.
NSS 3.19.2.2 release notes
nss 3.19.2.2 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_19_2_2_rtm/src/ security fixes in nss 3.19.2.2 bug 115
84
89 / cve-2015-7575 - prevent md5 downgrade in tls 1.2 signatures.
... acknowledgements the nss development team would like to thank karthikeyan bhargavan from inria for responsibly disclosing the issue in bug 115
84
89.
NSS 3.19.2.3 release notes
security fixes in nss 3.19.2.3 bug 124552
8 / cve-2016-1950 - fixed a heap-based buffer overflow related to the parsing of certain asn.1 structures.
... acknowledgements the nss development team would like to thank security researcher francis gabriel for responsibly disclosing the issue in bug 124552
8.
NSS 3.19.4 release notes
bug 119202
8 (cve-2015-71
81) and bug 1202
86
8 (cve-2015-71
82): several issues existed within the asn.1 decoder used by nss for handling streaming ber data.
... bug 1205157 (nspr, cve-2015-71
83): a logic bug in the handling of large allocations would allow exceptionally large allocations to be reported as successful, without actually allocating the requested memory.
NSS 3.20.1 release notes
bug 119202
8 (cve-2015-71
81) and bug 1202
86
8 (cve-2015-71
82): several issues existed within the asn.1 decoder used by nss for handling streaming ber data.
... bug 1205157 (nspr, cve-2015-71
83): a logic bug in the handling of large allocations would allow exceptionally large allocations to be reported as successful, without actually allocating the requested memory.
NSS 3.20.2 release notes
nss 3.20.2 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_20_2_rtm/src/ security fixes in nss 3.20.2 bug 115
84
89 / cve-2015-7575 - prevent md5 downgrade in tls 1.2 signatures.
... acknowledgements the nss development team would like to thank karthikeyan bhargavan from inria for responsibly disclosing the issue in bug 115
84
89.
NSS 3.21.1 release notes
security fixes in nss 3.21.1 bug 124552
8 / cve-2016-1950 - fixed a heap-based buffer overflow related to the parsing of certain asn.1 structures.
... acknowledgements the nss development team would like to thank security researcher francis gabriel for responsibly disclosing the issue in bug 124552
8.
NSS 3.21.3 release notes
security fixes in nss 3.21.3 bug 1306103 / cve-2016-52
85 - fixed a possible dos on nss servers due to a missing null check.
... bug 12062
83 - fixed an out-of-bound read when parsing invalid utf-16.
NSS 3.22.2 release notes
security fixes in nss 3.22.2 bug 124552
8 / cve-2016-1950 - fixed a heap-based buffer overflow related to the parsing of certain asn.1 structures.
... acknowledgements the nss development team would like to thank security researcher francis gabriel for responsibly disclosing the issue in bug 124552
8.
NSS 3.30 release notes
new macros in ciferfam.h pkcs12_aes_cbc_12
8, pkcs12_aes_cbc_192, pkcs12_aes_cbc_256 - cipher family identifiers corresponding to the pkcs#5 v2.1 aes based encryption schemes used in the pkcs#12 support in nss in pkcs11n.h cka_nss_mozilla_ca_policy - identifier for a boolean pkcs#11 attribute, that should be set to true, if a ca is present because of it's acceptance according to the mozilla ca policy notable changes in ns...
... rsa-pss signatures produced by key pairs with a modulus bit length that is not a multiple of
8 are now supported.
NSS 3.34.1 release notes
(bug 141
867
8) cn = certum ca, o=unizeto sp.
... sha-256 fingerprint: d
8:e0:fe:bc:1d:b2:e3:
8d:00:94:0f:37:d2:7d:41:34:4d:99:3e:73:4b:99:d5:65:6d:97:7
8:d4:d
8:14:36:24 removed entries from certdata.txt for actively distrusted certificates that have expired (bug 1409
872).
NSS 3.43 release notes
note that while the mechanism is present, post-handshake authentication is currently not tls 1.3 compliant due to bug 1532312 notable changes in nss 3.43 the following ca certificates were added: cn = emsign root ca - g1 sha-256 fingerprint: 40f6af0346a99aa1cd1d555a4e9cce62c7f9634603ee406615
833dc
8c
8d00367 cn = emsign ecc root ca - g3 sha-256 fingerprint:
86a1ecba0
89c4a
8d3bbe2734c612ba341d
813e043cf9e
8a
862cd5c57a36bbe6b cn = emsign root ca - c1 sha-256 fingerprint: 125609aa301da0a249b97a
8239cb6a34216f44dcac9f3954b14292f2e
8c
860
8f cn = emsign ecc root ca - c3 sha-256 fingerprint: bc4d
809b151
89d7
8db3e1d
8cf4f9726a795da1643ca5f135
8e1ddb0edc0d7eb3 ...
... cn = hongkong post root ca 3 sha-256 fingerprint: 5a2fc03f0c
83b090bbfa40604b09
88446c76361
83df9
846e17101a447fb
8efd6 the following ca certificates were removed: none bugs fixed in nss 3.43 bug 152
8669 and bug 152930
8 - improve gyp build system handling bug 1529950 and bug 1521174 - improve nss s/mime tests for thunderbird bug 1530134 - if docker isn't installed, try running a local clang-format as a fallback bug 1531267 - enable fips mode automatically if the system fips mode flag is set bug 152
8262 - add a -j option to the strsclnt command to specify sigschemes bug 1513909 - add manual for nss-policy-check bug 1531074 - fix a deref after a null check in seckey_setpublicvalue bug 1517714 - properly handle esni with hrr bug 1529
813 - expose hkdf-expan...
NSS 3.44 release notes
karmsupport for android 1531244 - use __builtin_bswap64 in crypto_primitives.h 1533216 - cert_decodecertpackage() crash with netscape certificate sequences 1533616 - sdb_getattributevaluenolock should make at most one sql query, rather than one for each attribute 1531236 - provide accessor for certcertificate.dercert 1536734 - lib/freebl/crypto_primitives.c assumes a big endian machine 15323
84 - in nss test certificates, use @example.com (not @bogus.com) 153
8479 - post-handshake messages after async server authentication break when using record layer separation 152157
8 - x25519 support in pk11pars.c 1540205 - freebl build fails with -dnss_disable_chachapoly 1532312 - post-handshake auth doesn't interoperate with openssl 1542741 - certutil -f crashes with segmentation fault 15469...
...25 - allow preceding text in try comment 153446
8 - expose chacha20 primitive 141
8944 - quote cc/cxx variables passed to nspr 1543545 - allow to build nss as a static library 14
87597 - early data that arrives before the handshake completes can be read afterwards 154
839
8 - freebl_gtest not building on linux/mac 154
8722 - fix some coverity warnings 1540652 - softoken/sdb.c: logically dead code 1549413 - android log lib is not included in build 1537927 - ipsec usage is too restrictive for existing deployments 154960
8 - signature fails with dbm disabled 1549
84
8 - allow building nss for ios using gyp 1549
847 - nss's sqlite compilation warnings make the build fail on ios 1550041 - freebl not building on ios simulator 1542950 - macos cipher test timeouts this bugzilla query returns ...
Enc Dec MAC Using Key Wrap CertReq PKCS10 CSR
*/ /* nspr headers */ #include <prthread.h> #include <plgetopt.h> #include <prerror.h> #include <prinit.h> #include <prlog.h> #include <prtypes.h> #include <plstr.h> /* nss headers */ #include <keyhi.h> #include <pk11priv.h> /* our samples utilities */ #include "util.h" /* constants */ #define blocksize 32 #define modblocksize 12
8 #define default_key_bits 1024 /* header file constants */ #define enckey_header "-----begin wrapped enckey-----" #define enckey_trailer "-----end wrapped enckey-----" #define mackey_header "-----begin wrapped mackey-----" #define mackey_trailer "-----end wrapped mackey-----" #define iv_header "-----begin iv-----" #define iv_trailer ...
...fine ns_cert_trailer "-----end certificate-----" /* sample 6 commands */ typedef enum { generate_csr, add_cert_to_db, save_cert_to_header, encrypt, decrypt, sign, verify, unknown } commandtype; typedef enum { symkey = 0, mackey = 1, iv = 2, mac = 3, pad = 4, pubkey = 5, lab = 6, certenc= 7, certvfy=
8, sig = 9 } headertype; /* * print usage message and exit */ static void usage(const char *progname) { fprintf(stderr, "\nusage: %s %s %s %s %s %s %s %s %s %s\n\n", progname, " -<g|a|h|e|ds|v> -d <dbdirpath> ", "[-p <dbpwd> | -f <dbpwdfile>] [-z <noisefilename>] [-a <\"\">]", "-s <subject> -r <csr> | ", "-n <n...
NSS Sample Code Sample1
:generatekeys() { int rv = 0; seckeypublickey *pubkey = 0; pk11slotinfo *slot = 0; // choose a slot to use slot = pk11_getinternalkeyslot(); if (!slot) { rv = 1; goto done; } // get our own public key to use for wrapping rv = getpublickey(&pubkey); if (rv) goto done; // do the encryption (aes) key if (!mwrappedenckey) { pk11symkey *key = 0; // the key size is 12
8 bits (16 bytes) key = pk11_keygen(slot, ckm_aes_key_gen, 0, 12
8/
8, 0); if (!key) { rv = 1; goto aes_done; } rv = wrapkey(key, pubkey, &mwrappedenckey); aes_done: if (key) pk11_freesymkey(key); if (rv) goto done; } // do the mac key if (!mwrappedmackey) { pk11symkey *key = 0; // the key size is 160 bits (20 bytes) key = pk11_keygen(slot, ckm_generic_s...
...ecret_key_gen, 0, 160/
8, 0); if (!key) { rv = 1; goto mac_done; } rv = wrapkey(key, pubkey, &mwrappedmackey); mac_done: if (key) pk11_freesymkey(key); } done: if (slot) pk11_freeslot(slot); return rv; } int server::exportpublickey(secitem **pubkeydata) { int rv = 0; seckeypublickey *pubkey = 0; rv = getpublickey(&pubkey); if (rv) goto done; *pubkeydata = seckey_encodedersubjectpublickeyinfo(pubkey); if (!*pubkeydata) { rv = 1; goto done; } done: if (pubkey) seckey_destroypublickey(pubkey); return rv; } int server::exportkeys(secitem *pubkeydata, secitem **wrappedenckey, secitem **wrappedmackey) { int rv; certsubjectpublickeyinfo *keyinfo = 0; seckeypublickey *pubkey = 0; secitem *data = 0; // make sure the keys are ...
NSS Sample Code sample2
*/ #include "nss.h" #include "pk11pub.h" /* example key & iv */ unsigned char gkey[] = {0xe
8, 0xa7, 0x7c, 0xe2, 0x05, 0x63, 0x6a, 0x31}; unsigned char giv[] = {0xe4, 0xbb, 0x3b, 0xd3, 0xc3, 0x71, 0x2e, 0x5
8}; int main(int argc, char **argv) { ck_mechanism_type ciphermech; pk11slotinfo* slot = null; pk11symkey* symkey = null; secitem* secparam = null; pk11context* enccontext = null; secitem keyitem, ivitem; secstatus rv, rv1,...
...buf1 len must be atleast (data len +
8) */ tmp1_outlen = tmp2_outlen = 0; /* create cipher context */ enccontext = pk11_createcontextbysymkey(ciphermech, cka_encrypt, symkey, secparam); rv1 = pk11_cipherop(enccontext, buf1, &tmp1_outlen, sizeof(buf1), data, strlen(data)+1); rv2 = pk11_digestfinal(enccontext, buf1+tmp1_outlen, &tmp2_outlen, ...
NSS Sample Code sample3
> #include "pk11pub.h" #include "nss.h" static void printdigest(unsigned char *digest, unsigned int len) { int i; cout << "length: " << len << endl; for(i = 0;i < len;i++) printf("%02x ", digest[i]); cout << endl; } /* * main */ int main(int argc, const char *argv[]) { int status = 0; pk11slotinfo *slot = 0; pk11symkey *key = 0; pk11context *context = 0; unsigned char data[
80]; unsigned char digest[20]; /*is there a way to tell how large the output is?*/ unsigned int len; secstatus s; /* initialize nss * if your application code has already initialized nss, you can skip it * here.
...iled" << endl; goto done; } /* print digest */ printdigest(digest, len); pk11_destroycontext(context, pr_true); context = 0; /* * part 2 - hashing with included secret key */ cout << "part 2 -- hashing with included secret key" << endl; /* initialize data */ memset(data, 0xbc, sizeof data); /* create a key */ key = pk11_keygen(slot, ckm_generic_secret_key_gen, 0, 12
8, 0); if (!key) { cout << "create key failed" << endl; goto done; } cout << (void *)key << endl; /* create parameters for crypto context */ /* note: params must be provided, but may be empty */ secitem noparams; noparams.type = sibuffer; noparams.data = 0; noparams.len = 0; /* create context using the same slot as the key */ // context = pk11_createdigestcontext(sec_oid_md5);...
NSS Sample Code sample5
*/ #include "nss.h" #include "pk11pub.h" #define base64_encoded_subjectpublickeyinfo "mfwwdqyjkozihvcnaqebbqadswawsajbal3f6tic3jeysugo+a2fpu3w+epv/feix21dc
86wynpftw4srftz2onuzyluzdhzdb+k//
8dct3iaozuui3r2emcaweaaq==" #define base64_encoded_privatekeyinfo "miibvqibadanbgkqhkig9w0baqefaascat
8wgge7ageaakeavcxpmhzckriy6cj5rz
89tdb4sm/
8v4hfbumlzpziekw1biysw3pag1tpittmmdl1v6t//x1xpcga7nrsldhz4widaqabakeajh
8+4qncwcmgivnm6ytbpqt+k/jeoexg2bqhjojvnxn3fazgcefxvpuibcjvfaijs9ybcmozzrato0+k2hwnoqihaoc4nvbo
8fqhzs4yxm1m
86kml47fa9ui//oufbhladw1aiea2dbmixnsbokb+ohver69...
...p0gnewlvcjc9bjdvfdlvslcciqcptv3vgyjv2vdwxqzqahc+yb4gigaqoqbcbmjd3lyflqiga+vtydunoqwtzwve4grf7izk2v5ccnhg3gr5rgwxn5
8cigccaforruksm66isg0iti04g9v/w+wmx91wjeeb+qbz" int main(int argc, char **argv) { secstatus rv; certcertificate *cert = null; seckeypublickey *pubkey = null; certsubjectpublickeyinfo *spki = null; seckeyprivatekey *pvtkey = null; int modulus_len, i, outlen; char *buf1 = null; char *buf2 = null; char *pubkstr = base64_encoded_subjectpublickeyinfo; char *pvtkstr = base64_encoded_privatekeyinfo; secitem der; secitem nickname; pk11slotinfo *slot = null; /* initialize nss * you need to explicitly authenticate to the internal token if you use ...
sample2
<prlog.h> #include <prtypes.h> #include <plstr.h> /* nss headers */ #include <cryptohi.h> #include <keyhi.h> #include <pk11priv.h> #include <cert.h> #include <base64.h> #include <secerr.h> #include <secport.h> #include <secoid.h> #include <secmodt.h> #include <secoidt.h> #include <sechash.h> /* our samples utilities */ #include "util.h" /* constants */ #define blocksize 32 #define modblocksize 12
8 #define default_key_bits 1024 /* header file constants */ #define enckey_header "-----begin wrapped enckey-----" #define enckey_trailer "-----end wrapped enckey-----" #define mackey_header "-----begin wrapped mackey-----" #define mackey_trailer "-----end wrapped mackey-----" #define iv_header "-----begin iv-----" #define iv_trailer "-----end iv-----" #define mac_header "-----begin mac-----" #defi...
...*/ #ifndef port_errortostring #define port_errortostring(err) pr_errortostring((err), pr_language_i_default) #endif /* sample 6 commands */ typedef enum { generate_csr, add_cert_to_db, save_cert_to_header, encrypt, decrypt, sign, verify, unknown } commandtype; typedef enum { symkey = 0, mackey = 1, iv = 2, mac = 3, pad = 4, pubkey = 5, lab = 6, certenc= 7, certvfy=
8, sig = 9 } headertype; /* * print usage message and exit */ static void usage(const char *progname) { fprintf(stderr, "\nusage: %s %s %s %s %s %s %s %s %s %s\n\n", progname, " -<g|a|h|e|ds|v> -d <dbdirpath> ", "[-p <dbpwd> | -f <dbpwdfile>] [-z <noisefilename>] [-a <\"\">]", "-s <subject> -r <csr> | ", "-n <nickname> -t <trust> -c <cert> [ -r <csr> -u <issuernickname> [-x <\"\">] -m <serialnumber...
nss tech note1
the
8-bit asn.1 tags that we support are made of three parts : the asn.1 component class type.
...the following macros are provided for tag numbers within the universal class : sec_asn1_boolean, sec_asn1_integer, sec_asn1_bit_string, sec_asn1_octet_string, sec_asn1_null, sec_asn1_object_id, sec_asn1_object_descriptor,† sec_asn1_real, sec_asn1_enumerated, sec_asn1_embedded_pdv, sec_asn1_utf
8_string, sec_asn1_sequence, sec_asn1_set, sec_asn1_numeric_string, sec_asn1_printable_string, sec_asn1_t61_string, sec_asn1_teletex_string, sec_asn1_t61_string, sec_asn1_videotex_string, sec_asn1_ia5_string, sec_asn1_utc_time, sec_asn1_generalized_time, sec_asn1_graphic_string, sec_asn1_visible_string, sec_asn1_general_string, sec_asn1_universal_string, sec_asn1_bmp_string note that for sec_asn1...
nss tech note4
} extensions++; } } an example custom cert extension struct _mycertextdata { secitem version; secitem streetaddress; secitem phonenum; secitem rfc
822name; secitem id; secitem maxusers; }; typedef struct _mycertextdata mycertextdata; /* template used for decoding the extension */ const sec_asn1template mycertexttemplate[] = { { sec_asn1_sequence, 0, null, sizeof( mycertextdata ) }, { sec_asn1_integer, offsetof(mycertextdata, version) }, ...
... { sec_asn1_octet_string, offsetof( mycertextdata, streetaddress ) }, { sec_asn1_octet_string, offsetof( mycertextdata, phonenum ) }, { sec_asn1_octet_string, offsetof( mycertextdata, rfc
822name ) }, { sec_asn1_octet_string, offsetof( mycertextdata, id ) }, { sec_asn1_integer, offsetof(mycertextdata, maxusers ) }, { 0 } }; /* oid for my cert extension - replace 0xff with appropriate values*/ static const unsigned char myoid[] = { 0xff, 0xff, 0xff, 0xff, ....
nss tech note5
some of the digest algorithm identifiers are (without the sec_oid_ prefix) : md2, md5, sha1, sha256, sha3
84, sha512.
...note that a 204
8-bit wrapped rsa private key takes up around 1200 bytes.
NSS Tools sslstrength
step-up step up is a mode where the connection starts out with 40-bit encryption, but due to a 'change-cipher-spec' handshake, changes to 12
8-bit encryption.
...you can tell if you stepped-up, because the output will says 'using export policy', and you'll find the secret key size was 12
8-bits.
Build instructions
required to build with msvc
8 (2005 express).
...(the free edition works, and other versions like visual studio 200
8 and visual studio 2012 may also work.) use start-shell-msvc2010.bat from mozillabuild to get a bash shell with the path already configured, and execute these instructions from within that bash shell.
FC_GetTokenInfo
ckf_rng (0x00000001): this device has a random number generator ckf_write_protected (0x00000002): this device is read-only ckf_login_required (0x00000004): this device requires the user to log in to use some of its services ckf_user_pin_initialized (0x0000000
8): the user's password has been initialized ckf_dual_crypto_operations (0x00000200): a single session with the token can perform dual cryptographic operations ckf_token_initialized (0x00000400): the token has been initialized.
... ulsessioncount: number of sessions that this application currently has open with the token ulrwsessioncount: number of read/write sessions that this application currently has open with the token hardwareversion: hardware version number, for example,
8.3 (major=0x0
8, minor=0x03), which are the version numbers of the certificate and key databases, respectively.
S/MIME functions
ntent mxr 3.2 and later nss_cmsmessage_getcontentinfo mxr 3.2 and later nss_cmsmessage_isencrypted mxr 3.4.1 and later nss_cmsmessage_issigned mxr 3.4 and later nss_cmsrecipientinfo_create mxr 3.2 and later nss_cmsrecipientinfo_createfromder mxr 3.
8 and later nss_cmsrecipientinfo_createnew mxr 3.
8 and later nss_cmsrecipientinfo_createwithsubjkeyid mxr 3.7 and later nss_cmsrecipientinfo_createwithsubjkeyidfromcert mxr 3.7 and later nss_cmsrecipientinfo_destroy mxr 3.2 and later nss_cmsrecipientinfo_encode mxr ...
... 3.
8 and later nss_cmsrecipientinfo_getcertandkey mxr 3.
8 and later nss_cmsrecipientinfo_unwrapbulkkey mxr 3.7.2 and later nss_cmsrecipientinfo_wrapbulkkey mxr 3.7.2 and later nss_cmssigneddata_addcertchain mxr 3.2 and later nss_cmssigneddata_addcertlist mxr 3.2 and later nss_cmssigneddata_addcertificate mxr 3.2 and later nss_cmssigneddata_adddigest mxr 3.2 and later nss_cmssigneddata_addsignerinfo mxr 3.2 and later nss_cmssigneddata_create mxr 3.2 and later nss_cmssigneddata_createcertsonly mxr 3.2 and later ...
NSS Tools sslstrength
step-up step up is a mode where the connection starts out with 40-bit encryption, but due to a 'change-cipher-spec' handshake, changes to 12
8-bit encryption.
...you can tell if you stepped-up, because the output will says 'using export policy', and you'll find the secret key size was 12
8-bits.
NSS tools : signtool
expires: tue may 19, 199
8 test object signing cert issued by: test object signing cert (signtool 1.0 testing certificate (9601
87691)) expires: sun may 17, 199
8 --------------------------------------- for a list including cas, use the -l option.
...you can use a zip utility instead of the -z option to package a signed archive into a jar file after you have signed it: cd signdir zip -r ../myjar.jar * adding: meta-inf/ (stored 0%) adding: meta-inf/manifest.mf (deflated 15%) adding: meta-inf/signtool.sf (deflated 2
8%) adding: meta-inf/signtool.rsa (stored 0%) adding: text.txt (stored 0%) generating the keys and certificate the signtool option -g generates a new public-private key pair and certificate.
NSS tools : signver
signver supports two types of databases: the legacy security databases (cert
8.db, key3.db, and secmod.db) and new sqlite databases (cert9.db, key4.db, and pkcs11.txt).
... the last versions of these legacy databases are: o cert
8.db for certificates o key3.db for keys o secmod.db for pkcs #11 module information berkeleydb has performance limitations, though, which prevent it from being easily used by multiple applications simultaneously.
Rhino history
so in fall of 199
8, rhino added an interpretive mode.
... rhino was released to mozilla.org in april 199
8.
Rhino license
license for portions of the rhino debugger additionally, some files (currently the contents of toolsrc/org/mozilla/javascript/tools/debugger/treetable/) are available under the following license: * copyright 1997, 199
8 sun microsystems, inc.
... norrisboyd 06:16, 14 april 200
8 (pdt) ...
Rhino shell
js> runcommand("bad_command", "--bad-arg", opt) js: "<stdin>", line 1
8: uncaught javascript exception: java.io.ioexception: bad_command: not found js> // passing explicit environment to the system shell js> runcommand("sh", "-c", "echo $env1 $env2", { env: {env1: 100, env2: 200}}) 100 200 0 js> // use args option to provide additional command arguments js> var arg_array = [1, 2, 3, 4]; js> runcommand("echo", { args: arg_array}) 1 2 3 4 0 examples for windows are s...
...imilar: js> // invoke shell command js> runcommand("cmd", "/c", "date /t") 27.0
8.2005 0 js> // run sort collectiong the output js> var opt={input: "c\na\nb", output: 'sort output:\n'} js> runcommand("sort", opt) 0 js> print(opt.output) sort output: a b c js> // invoke notepad and wait until it exits js> runcommand("notepad") 0 ...
64-bit Compatibility
this sort of bug happens surprisingly often - see bug 501324, bug 512
866 for example.
... amd64 pointers if mucking with pointers on amd64 (or em64-t/intel64), it is important to keep in mind an invariant that bits 63-4
8 must be sign-extended from bit 47.
Introduction to XPCOM for the DOM
the use of xpcom and nscomptr's described in this document covers about
80% of what you need to know to read the dom code, and even write some.
... the use of xpcom and nscomptr's described until now covers about
80% of what you need to know to read the code, and even write some.
Components.isSuccessCode
components.issuccesscode() is functionally equivalent to the following javascript: function issuccesscode(returncode) { return (returncode & 0x
80000000) === 0; } since failure error codes are turned into exceptions when encountered in javascript, this function usually is not necessary.
... }, queryinterface: function(aiid) { if (aiid.equals(ci.nsirequestobserver) || aiid.equals(ci.nsisupports)) return this; throw cr.ns_error_no_interface; } }; var copier = cc["@mozilla.org/network/async-stream-copier;1"] .createinstance(ci.nsiasyncstreamcopier); copier.init(instream, outstream, null, true, false,
8192, true, true); copier.asynccopy(copyobserver, null); } ...
Components.utils.importGlobalProperties
obsolete since gecko 60 rtcidentityprovider textdecoder textencoder url urlsearchparams xmlhttprequest nsixmlhttprequest obsolete since gecko 60 for string/object in table without a minimum firefox version, it is not exactly known since when it was available, however it is guranteed available from firefox 2
8 and up.
... example components.utils.import("resource://gre/modules/devtools/console.jsm"); components.utils.importglobalproperties(["atob", "btoa"]); var encoded = btoa("hello"); console.log(encoded); // "sgvsbg
8=" console.log(atob(encoded)); // "hello" alternative methods if importglobalproperties does not support the targeted firefox version, here are some alternative methods to import these objects.
Profiling XPCShell
a profile will look like this: file:///users/michiel/mozilla/tree1/...js/calutils.js [2,25420] createdatetime() {60-62} 579 {min 0, max 3, avg 0, sum 427, self 427} [2,56
810] cp_qi() {
860-
866}
835 {min 0, max 1, avg 0, sum 950, self 950} the first line tells which file was profiled.
... notes you need a trunk build from after 2007-05-2
8.
XPCShell Reference
for instance, specifying -v 1
80 will set the interpreter to use javascript version 1.
8.
... original document information author: david bradley <dbradley@netscape.com> last updated date: 17 march 2003 copyright information: portions of this content are © 199
8–200
8 by individual mozilla.org contributors; content available under a creative commons license.
NS_OVERRIDE
it was introduced in bug 500
870.
...a compiler with static-checking enabled will issue the following error: test.cpp:
8: error: ns_override function b::getfoo(nsifoo**) does not override a base class method with the same name and signature.
nsACString (External)
class declaration <map id="classes" name="classes"><area alt="" coords="1005,6,1096,54" href="http://developer.mozilla.org/en/nsacstring_(external)" shape="rect" title="nsacstring_(external)"> <area alt="" coords="9
80,102,1121,150" href="http://developer.mozilla.org/en/nscstringcontainer_(external)" shape="rect" title="nscstringcontainer_(external)"> <area alt="" coords="571,19
8,707,246" href="http://developer.mozilla.org/en/nscstring_external" shape="rect" title="nscstring_external"> <area alt="" coords="731,19
8,955,246" href="http://developer.mozilla.org/en/nsdependentcsubstring_external" shape="rect" title="nsdependentcsubstring_external"> <area alt="" coords="979,19
8,1123,246" href="http://developer.mozilla.org/en/promiseflatcstring_(external)" shape="rect" title="promiseflatcst...
...ring_(external)"> <area alt="" coords="1147,19
8,1259,246" href="http://developer.mozilla.org/en/nscautostring_(external)" shape="rect" title="nscautostring_(external)"> <area alt="" coords="5,294,20
8,342" href="http://developer.mozilla.org/en/nsdependentcstring_external" shape="rect" title="nsdependentcstring_external"> <area alt="" coords="232,294,475,342" href="http://developer.mozilla.org/en/ns_convertutf16toutf
8_external" shape="rect" title="ns_convertutf16toutf
8_external"> <area alt="" coords="499,294,779,342" href="http://developer.mozilla.org/en/ns_lossyconvertutf16toascii_external" shape="rect" title="ns_lossyconvertutf16toascii_external"> <area alt="" coords="
803,294,925,342" href="http://developer.mozilla.org/en/nsliteralcstring_(external)" shape="rect" title="nsliteralcstring_(ex...
nsACString_internal
<map id="classes" name="classes"> <area alt="" coords="456,5,605,53" href="http://developer.mozilla.org/en/nsacstring_internal" shape="rect" title="nsacstring_internal"> <area alt="" coords="415,101,497,149" href="http://developer.mozilla.org/en/nscstring" shape="rect" title="nscstring"> <area alt="" coords="521,101,6
89,149" href="http://developer.mozilla.org/en/nsdependentcsubstring" shape="rect" title="nsdependentcsubstring"> <area alt="" coords="172,197,2
89,245" href="http://developer.mozilla.org/en/nsfixedcstring" shape="rect" title="nsfixedcstring"> <area alt="" coords="315,197,437,245" href="http://developer.mozilla.org/en/nsxpidlcstring" shape="rect" title="nsxpidlcstring"> <area alt="" coords="461,197,6...
...11,245" href="http://developer.mozilla.org/en/nsdependentcstring" shape="rect" title="nsdependentcstring"> <area alt="" coords="635,197,7
87,245" href="http://developer.mozilla.org/en/nspromiseflatcstring" shape="rect" title="nspromiseflatcstring"> <area alt="" coords="173,293,2
85,341" href="http://developer.mozilla.org/en/nscautostring" shape="rect" title="nscautostring"> <area alt="" coords="5,3
89,227,437" href="http://developer.mozilla.org/en/ns_lossyconvertutf16toascii" shape="rect" title="ns_lossyconvertutf16toascii"> <area alt="" coords="251,3
89,435,437" href="http://developer.mozilla.org/en/ns_convertutf16toutf
8" shape="rect" title="ns_convertutf16toutf
8"> <area alt="" coords="309,293,445,341" href="http://developer.mozilla.org/en/nsadoptingcstring" shape="rect" title="nsadoptingcstri...
nsAString (External)
<map id="classes" name="classes"> <area alt="" coords="963,6,1045,54" href="http://developer.mozilla.org/en/nsastring_(external)" shape="rect" title="nsastring_(external)"> <area alt="" coords="939,102,1069,150" href="http://developer.mozilla.org/en/nsstringcontainer_(external)" shape="rect" title="nsstringcontainer_(external)"> <area alt="" coords="54
8,19
8,676,246" href="http://developer.mozilla.org/en/nsstring_external" shape="rect" title="nsstring_external"> <area alt="" coords="700,19
8,913,246" href="http://developer.mozilla.org/en/nsdependentsubstring_external" shape="rect" title="nsdependentsubstring_external"> <area alt="" coords="937,19
8,1071,246" href="http://developer.mozilla.org/en/promiseflatstring_(external)" shape="rect" title="pro...
...miseflatstring_(external)"> <area alt="" coords="1095,19
8,1196,246" href="http://developer.mozilla.org/en/nsautostring_(external)" shape="rect" title="nsautostring_(external)"> <area alt="" coords="5,294,197,342" href="http://developer.mozilla.org/en/nsdependentstring_external" shape="rect" title="nsdependentstring_external"> <area alt="" coords="221,294,467,342" href="http://developer.mozilla.org/en/ns_convertasciitoutf16_external" shape="rect" title="ns_convertasciitoutf16_external"> <area alt="" coords="491,294,733,342" href="http://developer.mozilla.org/en/ns_convertutf
8toutf16_external" shape="rect" title="ns_convertutf
8toutf16_external"> <area alt="" coords="757,294,
869,342" href="http://developer.mozilla.org/en/nsliteralstring_(external)" shape="rect" title="nsliteralstring_(external...
nsAString_internal
lt="" coords="379,101,451,149" href="http://developer.mozilla.org/en/nsstring" shape="rect" title="nsstring"> <area alt="" coords="475,101,635,149" href="http://developer.mozilla.org/en/nsdependentsubstring" shape="rect" title="nsdependentsubstring"> <area alt="" coords="151,197,257,245" href="http://developer.mozilla.org/en/nsfixedstring" shape="rect" title="nsfixedstring"> <area alt="" coords="2
84,197,396,245" href="http://developer.mozilla.org/en/nsxpidlstring" shape="rect" title="nsxpidlstring"> <area alt="" coords="420,197,559,245" href="http://developer.mozilla.org/en/nsdependentstring" shape="rect" title="nsdependentstring"> <area alt="" coords="5
83,197,727,245" href="http://developer.mozilla.org/en/nspromiseflatstring" shape="rect" title="nspromiseflatstring"> <area alt="" coords="1...
...52,293,253,341" href="http://developer.mozilla.org/en/nsautostring" shape="rect" title="nsautostring"> <area alt="" coords="5,3
89,192,437" href="http://developer.mozilla.org/en/ns_convertasciitoutf16" shape="rect" title="ns_convertasciitoutf16"> <area alt="" coords="216,3
89,400,437" href="http://developer.mozilla.org/en/ns_convertutf
8toutf16" shape="rect" title="ns_convertutf
8toutf16"> <area alt="" coords="277,293,405,341" href="http://developer.mozilla.org/en/nsadoptingstring" shape="rect" title="nsadoptingstring"> </map> method overview constructors beginreading endreading beginwriting endwriting data length isempty isvoid isterminated charat operator[] first last countchar findchar equals equalsascii equalslitera...
XPCOM glue classes
ns convertasciitoutf16 externalclass declarationns convertutf16toutf
8 externalclass declarationns convertutf
8toutf16 externalclass declarationns lossyconvertutf16toascii externalclass declarationns_convertasciitoutf16class declarationns_convertutf16toutf
8class declarationns_convertutf
8toutf16class declarationns_lossyconvertutf16toasciiclass declarationns_overridens_override is a macro which allows c++ code in mozilla to specify that a method is intended to override a base class method.
...this class is typically used to represent ascii or utf-
8 character arrays.nsacstring (external)class declarationnsacstring_internalclass declarationnsadoptingcstringclass declarationnsadoptingstringclass declarationnsastringthe nsastring abstract class represents a character string composed of double-byte storage units.
amIWebInstallListener
1.0 66 introduced gecko 2.0 inherits from: nsisupports last changed in gecko
8.0 (firefox
8.0 / thunderbird
8.0 / seamonkey 2.5) method overview boolean onwebinstallblocked(in nsidomwindow awindow, in nsiuri auri, [array, size_is(acount)] in nsivariant ainstalls, [optional] in pruint32 acount); void onwebinstalldisabled(in nsidomwindow awindow, in nsiuri auri, [array, size_is(acount)] in nsivariant ainstalls, [optional] in pruint32 acount); boole...
...an onwebinstallrequested(in nsidomwindow awindow, in nsiuri auri, [array, size_is(acount)] in nsivariant ainstalls, [optional] in pruint32 acount); note: prior to gecko
8.0, all references to nsidomwindow used in this interface were nsidomwindowinternal.
amIWebInstaller
1.0 66 introduced gecko 2.0 inherits from: nsisupports last changed in gecko
8.0 (firefox
8.0 / thunderbird
8.0 / seamonkey 2.5) method overview boolean installaddonsfromwebpage(in astring amimetype, in nsidomwindow awindow, in nsiuri areferer, [array, size_is(ainstallcount)] in wstring auris, [array, size_is(ainstallcount)] in wstring ahashes, [array, size_is(ainstallcount)] in wstring anames, [array, size_is(ainstallcount)] in wstring aicons, [optional] in amiinstallcallback acallback, [optional] in pruint32 ainstallcount); boolean isinstallenabled(in astring amimetype, in nsiuri areferer); note: p...
...rior to gecko
8.0, all references to nsidomwindow used in this interface were nsidomwindow.
imgIRequest
inherits from: nsirequest last changed in gecko
8.0 (firefox
8.0 / thunderbird
8.0 / seamonkey 2.5) method overview void cancelandforgetobserver(in nsresult astatus); imgirequest clone(in imgidecoderobserver aobserver); void decrementanimationconsumers(); imgirequest getstaticrequest(); void incrementanimationconsumers(); void lockimage(); void requestdecode(); void unlockimage(); attributes attribute type description corsmode long the cors mode that this image was loaded with.
... status_error 0x
8 an error occurred loading the image.
mozIColorAnalyzer
if imageuri points to an image that has more than 12
8^2 pixels, this method will fail for performance reasons before analyzing it.
... remarks below are some images with the result of findrepresentativecolor: image representative color 0xb2
8d3a 0x502e1e 0x53ba3f 0x00a400 see also mozirepresentativecolorcallback bug 634139 ...
mozIRegistry
i1
8n xul/xptoolkit app shell clsid binding protocols this is a placeholder for potential encapsulations of particular idioms for storing clsid information in the registry and using that information, along with nsrepository, to implement some instance creation protocol on top of the core xpcom services.
... original document information author: bill law last updated date: january 21, 1999 copyright information: portions of this content are © 199
8–2007 by individual mozilla.org contributors; content available under a creative commons license | details.
mozIStorageRow
last changed in gecko 1.9.1 (firefox 3.5 / thunderbird 3.0 / seamonkey 2.0) inherits from: mozistoragevaluearray method overview nsivariant getresultbyindex(in unsigned long aindex); nsivariant getresultbyname(in autf
8string aname); methods getresultbyindex() returns the value from a specific column in the row, using a zero-based index to identify the column.
...nsivariant getresultbyname( in autf
8string aname ); parameters aname the name of the column whose value is to be returned.
nsIAlertsService
note: prior firefox 22, the alerts service was only supported on windows in gecko 1.7, had no effect on mac os x in gecko 1.
8, but was fully supported in mac os x in gecko 1.9.
... see also alerts and notifications bug 7
82211 - implement notification api spec ui.alertnotificationorigin [en-us] bug 1270
819 - nsialertsservice showalertnotification sliding alert unnecessarily big / high ...
nsIAuthInformation
attributes attribute type description authenticationscheme autf
8string the authentication scheme used for this request, if applicable.
... only_password
8 this dialog only asks for password information.
nsIBadCertListener2
method overview boolean notifycertproblem(in nsiinterfacerequestor socketinfo, in nsisslstatus status, in autf
8string targetsite); methods notifycertproblem() called in case of a broken ssl status.
... boolean notifycertproblem( in nsiinterfacerequestor socketinfo, in nsisslstatus status, in autf
8string targetsite ); parameters socketinfo a network communication context that can be used to obtain more information about the active connection.
nsIClipboard
inherits from: nsisupports last changed in gecko 30.0 (firefox 30.0 / thunderbird 30.0 / seamonkey 2.27) method overview void emptyclipboard(in long awhichclipboard); void forcedatatoclipboard(in long awhichclipboard); obsolete since gecko 1.
8 void getdata(in nsitransferable atransferable, in long awhichclipboard); boolean hasdatamatchingflavors([array, size_is(alength)] in string aflavorlist, in unsigned long alength, in long awhichclipboard); void setdata(in nsitransferable atransferable, in nsiclipboardowner anowner, in long awhichclipboard); boolean supportsselectionclipboard(); boolean ...
... forcedatatoclipboard() obsolete since gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) some platforms support deferred notification for putting data on the clipboard this method forces the data onto the clipboard in its various formats this may be used if the application going away.
nsICommandLineHandler
1.0 66 introduced gecko 1.
8 inherits from: nsisupports last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) each command line handler is registered in the category "command-line-handler".
... @mozilla.org/composer/clh;1 command-line-handler m-irc @mozilla.org/chatzilla/clh;1 command-line-handler y-final @mozilla.org/browser/clh-final;1 method overview void handle(in nsicommandline acommandline); attributes attribute type description helpinfo autf
8string when the application is launched with the -help argument, this attribute is retrieved and displayed to the user (on stdout).
nsICommandLineRunner
last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) inherits from: nsicommandline method overview void init(in long argc, in nscharptrarray argv, in nsifile workingdir, in unsigned long state); void run(); void setwindowcontext(in nsidomwindow awindow); attributes attribute type description helptext autf
8string process and combine the help text provided by each command-line handler.
...on windows the character set is utf-
8, not the native codepage.
nsIComponentRegistrar
xpcom <= 1.
8: if aspec is null, then the application component's directory as defined by ns_xpcom_component_dir will be registered.
...see bug 115
853 for details.
nsIContentViewer
[noscript,notxpcom,nostdcall] void setnavigationtiming(in nsdomnavigationtimingptr atiming); void setpagemode(in boolean apagemode, in nsiprintsettings aprintsettings); void show(); void stop(); void unload(); obsolete since gecko 1.
8 attributes attribute type description container nsisupports domdocument nsidomdocument enablerendering boolean obsolete since gecko 2.0 historyentry nsishentry get the history entry that this viewer will save itself into when destroyed.
... unload() obsolete since gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) void unload(); parameters none.
nsIConverterOutputStream
1.0 66 introduced gecko 1.
8 inherits from: nsiunicharoutputstream last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) implemented by: @mozilla.org/intl/converter-output-stream;1.
...a null charset will be interpreted as utf-
8.
nsICookie
host autf
8string the host (possibly fully qualified) of the cookie.
... path autf
8string the path pertaining to the cookie.
nsICookieManager
it is implemented by the @mozilla.org/cookiemanager;1 component, but should generally be accessed via services.cookies method overview void remove(in autf
8string ahost, in acstring aname, in autf
8string apath, in boolean ablocked, in jsval aoriginattributes); void removeall(); attributes attribute type description enumerator nsisimpleenumerator called to enumerate through each cookie in the cookie list.
... void remove( in autf
8string ahost, in acstring aname, in autf
8string apath, in boolean ablocked, in jsval aoriginattributes ); parameters ahost the host or domain for which the cookie was set.
nsIDOMSerializer
to create an instance, use: var domserializer = components.classes["@mozilla.org/xmlextras/xmlserializer;1"] .createinstance(components.interfaces.nsidomserializer); method overview void serializetostream(in nsidomnode root, in nsioutputstream stream, in autf
8string charset); astring serializetostring(in nsidomnode root); methods serializetostream() the subtree rooted by the specified element is serialized to a byte stream using the character set specified.
... void serializetostream( in nsidomnode root, in nsioutputstream stream, in autf
8string charset ); parameters root the root of the subtree to be serialized.
nsIDictionary
66 introduced gecko 1.0 obsolete gecko 1.9.1 inherits from: nsisummary last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) note: this interface was removed in firefox 3.5; use dict.jsm instead.
... see bug 66
8424 for further information.
nsIExternalHelperAppService
to access this service, use: var externalhelperappservice = components.classes["@mozilla.org/uriloader/external-helper-app-service;1"] .getservice(components.interfaces.nsiexternalhelperappservice); method overview boolean applydecodingforextension(in autf
8string aextension, in acstring aencodingtype); nsistreamlistener docontent(in acstring amimecontenttype, in nsirequest arequest, in nsiinterfacerequestor awindowcontext, in boolean aforcesave); methods applydecodingforextension() determines whether or not data whose filename has the specified extension should be decoded from the specified encoding type before being saved or delivere...
...boolean applydecodingforextension( in autf
8string aextension, in acstring aencodingtype ); parameters aextension the filename extension to check.
nsIExternalProtocolService
method overview boolean externalprotocolhandlerexists(in string aprotocolscheme); astring getapplicationdescription(in autf
8string ascheme); nsihandlerinfo getprotocolhandlerinfo(in acstring aprotocolscheme); nsihandlerinfo getprotocolhandlerinfofromos(in acstring aprotocolscheme, out boolean afound); boolean isexposedprotocol(in string aprotocolscheme); void loaduri(in nsiuri auri, [optional] in nsiinterfacerequestor awindowcontext); void loadurl(in nsiuri aurl); void setprotocolhandlerdefaults(in nsih...
...astring getapplicationdescription( in autf
8string ascheme ); parameters ascheme the scheme to look up.
nsIFaviconDataCallback
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 void oncomplete(in nsiuri auri, in unsigned long adatalen, [const,array,size_is(adatalen)] in octet adata, in autf
8string amimetype); methods oncomplete() called when the required favicon's information is available.
...void oncomplete( in nsiuri auri, in unsigned long adatalen, [const,array,size_is(adatalen)] in octet adata, in autf
8string amimetype ); parameters auri receives the "favicon uri" (not the "favicon link uri") associated to the requested page.
nsIFeedContainer
toolkit/components/feeds/public/nsifeedcontainer.idlscriptable this interface provides standard fields used by both feeds (nsifeed) and feed entries (nsifeedentry) 1.0 66 introduced gecko 1.
8 inherits from: nsifeedelementbase last changed in gecko 1.
8.1 (firefox 2 / thunderbird 2 / seamonkey 1.1) method overview void normalize(); attributes attribute type description authors nsiarray an array of nsifeedperson objects describing the authors of the feed or entry.
... updated astring a string containing the date the feed or entry was last updated, in rfc
822 form.
nsIFeedEntry
1.0 66 introduced gecko 1.
8 inherits from: nsifeedcontainer last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) attributes attribute type description content nsifeedtextconstruct the full text of the entry's content.
... published astring a string indicating the date on which the entry was published, in rfc
822 format.
nsIFilePicker
filterimages 0x00
8 corresponds to the *.jpe, *.jpg, *.jpeg, *.gif, *.png, *.bmp, *.ico, *.svg, *.svgz, *.tif, *.tiff, *.ai, *.drw, *.pct, *.psp, *.xcf, *.psd and *.raw filters for file extensions.
... filterallowurls 0x
80 allow urls.
nsIGSettingsCollection
1.0 66 introduced gecko 6.0 inherits from: nsisupports last changed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) method overview boolean getboolean(in autf
8string key); long getint(in autf
8string key); autf
8string getstring(in autf
8string key); void setboolean(in autf
8string key, in boolean value); void setint(in autf
8string key, in long value); void setstring(in autf
8string key, in autf
8string value); methods getboolean() boolean getboolean( in autf
8string key ); parameters key return value getint() long getint( in autf
8string key ); parameters key return value getstring() autf
8string getstring( in autf
8string key ); paramet...
...ers key return value setboolean() void setboolean( in autf
8string key, in boolean value ); parameters key value setint() void setint( in autf
8string key, in long value ); parameters key value setstring() void setstring( in autf
8string key, in autf
8string value ); parameters key value ...
nsILocalFileMac
bundleidentifier autf
8string returns the identifier of the bundle.
... constants constant value description current_process_creator 0x
8000000 use with setfiletype() to specify the signature of current process.
nsIMemoryMultiReporterCallback
1.0 66 introduced gecko 7.0 inherits from: nsisupports last changed in gecko 7.0 (firefox 7.0 / thunderbird 7.0 / seamonkey 2.4) method overview void callback(in acstring process, in autf
8string path, in print32 kind, in print32 units, in print64 amount, in autf
8string description, in nsisupports closure); methods callback() called to provide information from a multi-reporter.
...void callback( in acstring process, in autf
8string path, in print32 kind, in print32 units, in print64 amount, in autf
8string description, in nsisupports closure ); parameters process the value of the process attribute for the memory reporter.
nsIMicrosummaryGenerator
1.0 66 introduced gecko 1.
8 obsolete gecko 6.0 inherits from: nsisupports last changed in gecko 1.9 (firefox 3) warning: microsummary support was removed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) method overview long calculateupdateinterval(in nsidomnode apagecontent); boolean equals(in nsimicrosummarygenerator aother); astring generatemicrosummary(in nsidomnode apagecontent); attributes attribute type description loaded boolean has the generator itself (which may be a remote resource) been loaded.
... name autf
8string an arbitrary descriptive name for this microsummary generator.
Building an Account Manager Extension
devmoaccountmanagerextension.prototype.classid = components.id("{659ce960-9dfb-11dd-ad
8b-0
800200c9a55}"); // ...
... <?xml version="1.0" encoding="utf-
8"?> <?xml-stylesheet href="chrome://messenger/skin/accountmanage.css" type="text/css"?> <page xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" onload="parent.onpanelloaded('am-devmo-account.xul');"> <script type="application/javascript" src="chrome://messenger/content/accountmanager.js"/> <script type="application/javascript" src="chrome://example@mozilla.org/cont...
nsIMsgCompFields
(bug 6
87
84) messageid char * needtocheckcharset prbool indicates whether we need to check if the current documentcharset can represent all the characters in the message body.
...(bug 249530) newsgroups astring newshost char * newsposturl char * organization astring otherrandomheaders astring no longer exists - see https://groups.google.com/forum/#!topic/mozilla.dev.apps.thunderbird/s4ofmm
8_b2
8 priority char * receiptheadertype print32 references char * replyto astring securityinfo nsisupports subject astring templatename astring temporaryfiles char * obsolete temporaryfiles obsolete, do not use anymore to astring usemultipartalternativ...
nsIMsgFilterCustomAction
* @param actionfolder folder in the filter list * @param filtertype filter type (manual, offlinemail, etc.) * * @return errormessage a localized message to display if invalid * set to null if the actionvalue is valid */ autf
8string validateactionvalue(in autf
8string actionvalue, in nsimsgfolder actionfolder, in nsmsgfiltertypetype filtertype); /* allow duplicate actions in the same filter list?
...an array of messages * * @param msghdrs array of nsimsgdbhdr objects of messages * @param actionvalue user-set value to use in the action * @param copylistener calling method (filtertype manual only) * @param filtertype type of filter being applied * @param msgwindow message window */ void apply(in nsiarray msghdrs /* nsimsgdbhdr array */, in autf
8string actionvalue, in nsimsgcopyservicelistener copylistener, in nsmsgfiltertypetype filtertype, in nsimsgwindow msgwindow); /* does this action start an async action?
nsIMsgFolder
applyretentionsettings(); boolean fetchmsgpreviewtext([array, size_is (anumkeys)] in nsmsgkey akeystofetch, in unsigned long anumkeys, in boolean alocalonly, in nsiurllistener aurllistener); void addkeywordstomessages(in nsisupportsarray amessages, in acstring akeywords); void removekeywordsfrommessages(in nsisupportsarray amessages, in acstring akeywords); autf
8string getmsgtextfromstream(in nsimsgdbhdr amsghdr, in nsiinputstream astream, in long abytestoread, in long amaxoutputlen, in boolean acompressquotes); attributes attribute type description supportsoffline boolean readonly offlinestoreoutputstream nsioutputstream readonly offlinestoreinputstream nsiinputstream readonly r...
... autf
8string getmsgtextfromstream(in nsimsgdbhdr amsghdr, in nsiinputstream astream, in long abytestoread, in long amaxoutputlen, in boolean acompressquotes); ...
nsIMsgIncomingServer
inherits from: nsisupports last changed in gecko 1.9.1 (firefox 3.5 / thunderbird 3.0 / seamonkey 2.0) method overview void clearallvalues(); void cleartemporaryreturnreceiptsfilter(); void closecachedconnections(); void configuretemporaryfilters(in nsimsgfilterlist filterlist); void configuretemporaryreturnreceiptsfilter(in nsimsgfilterlist filterlist); obsolete since gecko 1.
8 void displayofflinemsg(in nsimsgwindow awindow); boolean equals(in nsimsgincomingserver server); void forgetpassword(); void forgetsessionpassword(); astring generateprettynameformigration(); boolean getboolattribute(in string name); boolean getboolvalue(in string attr); acstring getcharattribute(in string name); acstring getcharvalue(in string attr); nsilocalfile getfilevalue...
...void configuretemporaryfilters( in nsimsgfilterlist filterlist ); parameters filterlist missing description exceptions thrown missing exception missing description configuretemporaryreturnreceiptsfilter() obsolete since gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) if we have set up to filter return receipts into our sent folder, this utility method creates a filter to do that, and adds it to our filterlist if it doesn't exist.
nsIMsgRuleAction
defined in comm-central/ mailnews/ base/ search/ public/ nsimsgfilter.idl [scriptable, uuid(190a2a1
8-d245-473a-a402-9f0
81459
8c7f)] interface nsimsgruleaction : nsisupports { attribute nsmsgruleactiontype type; // target priority..
...throws an exception if the action is not label attribute nsmsglabelvalue label; // junkscore throws an exception if the action type is not junkscore attribute long junkscore; attribute autf
8string strvalue; // action id if type is custom attribute acstring customid; // custom action associated with customid // (which must be set prior to reading this attribute) readonly attribute nsimsgfiltercustomaction customaction; }; ...
nsIMsgSearchTerm
mozilla/ mailnews/ base/ search/ public/ nsimsgsearchterm.idl attributes attrib attribute nsmsgsearchattribvalue attrib; op attribute nsmsgsearchopvalue op; value attribute nsimsgsearchvalue value; booleanand attribute boolean booleanand; arbitraryheader attribute acstring arbitraryheader; hdrproperty /** * not to be confused with arbitraryheader, which is a header in the * rfc
822 message.
...attribute acstring customid; beginsgrouping attribute boolean beginsgrouping; endsgrouping attribute boolean endsgrouping; methods matchrfc
822string boolean matchrfc
822string(in string astring, in string charset, in boolean charsetoverride); matchrfc2047string boolean matchrfc2047string(in string astring, in string charset, in boolean charsetoverride); matchdate boolean matchdate(in prtime atime); matchstatus boolean matchstatus(in unsigned long astatus); matchpriority boolean matchpriority(in nsmsgpriorityvalue priority);...
nsINavHistoryObserver
1.0 66 introduced gecko 1.
8 inherits from: nsisupports last changed in gecko 21.0 (firefox 21.0 / thunderbird 21.0 / seamonkey 2.1
8) warning: if you are in the middle of a batch transaction, there may be a database transaction active.
... methods onbeforedeleteuri() obsolete since gecko 21.0 (firefox 21.0 / thunderbird 21.0 / seamonkey 2.1
8) note: this method was removed in gecko 21.0 as part of bug
826409.
nsINavHistoryQuery
annotation autf
8string the annotation name.
... domain autf
8string this is the host or domain name (controlled by domainishost).
nsINavHistoryResult
1.0 66 introduced gecko 1.
8 inherits from: nsisupports last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) places results use a model-view-controller (mvc) design pattern.
... sortingannotation autf
8string the annotation to use in sort_by_annotation_* sorting modes; you must set this value before setting the sortingmode attribute.
nsIPrivateBrowsingService
method overview void removedatafromdomain(in autf
8string adomain); attributes attribute type description autostarted boolean indicates whether or not private browsing was started automatically at application launch time.
...void removedatafromdomain( in autf
8string adomain ); parameters adomain the domain for which data should be removed.
nsIPushMessage
method overview domstring text(); jsval json(); void binary([optional] out uint32_t datalen, [array, retval, size_is(datalen)] out uint
8_t data); methods text() extracts the message data as a utf-
8 text string.
... void binary( [optional] out uint32_t datalen, [array, retval, size_is(datalen)] out uint
8_t data ); parameters datalen the data size.
nsIPushSubscription
method overview void getkey(in domstring name, [optional] out uint32_t keylen, [array, size_is(keylen), retval] out uint
8_t key); bool quotaapplies(); bool isexpired(); attributes attribute type description endpoint domstring the subscription url.
... void getkey( in domstring name, [optional] out uint32_t keylen, [array, size_is(keylen), retval] out uint
8_t key ); parameters name the encryption key name.
nsIRequest
name autf
8string the name of the request.
... inhibit_persistent_caching 1 <<
8 this flag prevents caching on disk (or other persistent media), which may be needed to preserve privacy.
nsIResumableChannel
inherits from: nsisupports last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) method overview void asyncopenat(in nsistreamlistener listener, in nsisupports ctxt, in unsigned long startpos, in nsiresumableentityid entityid); obsolete since gecko 1.
8 void resumeat(in unsigned long long startpos, in acstring entityid); attributes attribute type description entityid acstring the entity id for this uri.
... methods asyncopenat() obsolete since gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) open this channel, and read starting at the specified offset.
nsISSLErrorListener
method overview boolean notifysslerror(in nsiinterfacerequestor socketinfo, in print32 error, in autf
8string targetsite); methods notifysslerror() called in case of an ssl error.
... boolean notifysslerror( in nsiinterfacerequestor socketinfo, in print32 error, in autf
8string targetsite ); parameters socketinfo a network communication context that can be used to obtain more information about the active connection.
nsIScreen
gecko 1.9.2 note starting in gecko 1.9.2, gecko running on microsoft windows reports 24 bits per pixel instead of 32 bits per pixel on
8-bits per color component displays, since this is typically what the caller is actually looking for.
... rotation_1
80_deg 2 1
80° of rotation.
nsISessionStartup
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/browser/sessionstartup;1.
...note: prior to gecko
8.0 (firefox
8.0 / thunderbird
8.0 / seamonkey 2.5), this was a string.
nsITextInputProcessor
dom/interfaces/base/nsitextinputprocessor.idlscriptable this interface is a text input events synthesizer and manages its composition and modifier state 1.0 66 introduced gecko 3
8 inherits from: nsisupports last changed in gecko 3
8.0 (firefox 3
8.0 / thunderbird 3
8.0 / seamonkey 2.35) the motivation of this interface is to provide better api than nsidomwindowutils to dispatch key events and create, modify, and commit composition in higher level.
... key_keep_key_location_standard 0x0000000
8 one of akeyflags.
nsIToolkitProfile
inherits from: nsisupports last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) you should not create these objects yourself; to obtain them, use the nsitoolkitprofileservice interface to create and obtain them.
... name autf
8string the profile's name.
nsITransport
inherits from: nsisupports last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) this interface provides methods to open blocking or non-blocking, buffered or unbuffered streams to the resource.
... constant value description status_reading 0x
804b000
8 status_writing 0x
804b0009 methods close() close the transport and any open streams.
nsITreeContentView
last changed in gecko 1.
8.0 inherits from: nsisupports method overview long getindexofitem(in nsidomelement item); nsidomelement getitematindex(in long index); attributes attribute type description root nsidomelement the element in the dom which this view uses as root content.
...obsolete since gecko 1.
8 methods getindexofitem() retrieve the index associated with the specified content item.
nsIUpdate
1.0 66 introduced gecko 1.
8 inherits from: nsisupports last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) method overview nsiupdatepatch getpatchat(in unsigned long index); nsidomelement serialize(in nsidomdocument updates); attributes attribute type description appversion astring the application version of this update.
...unexpected_error (
8) an unanticipate type of error occurred.
nsIUpdateItem
1.0 66 introduced gecko 1.
8 obsolete gecko 2.0 inherits from: nsisupports last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) this interface is obsolete; instead of using the extension manager, you should use the addon manager.
... constant gecko version description 1.
8 1.
8.1 1.9 1.9.1 1.9.2 type_app 0x01 type_extension 0x02 type_theme 0x04 type_locale 0x0
8 type_multi_xpi 0x20 type_addon type_extension + type_theme + type_locale + type_plugin type_extension + type_theme + type_locale type_any type_app + type_addon 0xff ...
nsIWebProgressListener
state_negotiating 0x0000000
8 this flag is not used.
... state_is_window 0x000
80000 this flag indicates that the state transition corresponds to the start or stop of activity in the indicated nsiwebprogress instance.
nsIWindowMediator
inherits from: nsisupports last changed in gecko
8.0 (firefox
8.0 / thunderbird
8.0 / seamonkey 2.5) the two most common uses of nsiwindowmediator are, enumerating all windows of a given type and getting the most recent / any window of a given type.
... note: starting in gecko
8.0, the returned value is an nsidomwindow; previously, it was an nsidomwindowinternal.
nsIWritablePropertyBag2
1.0 66 introduced gecko 1.
8 inherits from: nsipropertybag2 last changed in gecko 1.
8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) method overview void setpropertyasacstring(in astring prop, in acstring value); void setpropertyasastring(in astring prop, in astring value); void setpropertyasautf
8string(in astring prop, in autf
8string value); void setpropertyasbool(in astring prop, in boolean value); void setpropertyasdouble(in astring prop, in double value); void setpropertyasint32(in astring prop, in print32 value); void setpropertyasint64(in astring prop, in print64 value...
... setpropertyasautf
8string() void setpropertyasautf
8string( in astring prop, in autf
8string value ); parameters prop property to set the value of.
nsIXMLHttpRequest
example code this is a simple example code for opening a simple http request from a xul application (like a mozilla extension) without using observers: var req = components.classes["@mozilla.org/xmlextras/xmlhttprequest;1"].createinstance(); req.open('post', "http://www.foo.bar:
80
80/nietzsche.do", true); req.send('your=data&and=more&stuff=here'); example 2 var {cu: utils, cc: classes, ci: instances} = components; cu.import('resource://gre/modules/services.jsm'); function xhr(url, cb) { let xhr = cc["@mozilla.org/xmlextras/xmlhttprequest;1"].createinstance(ci.nsixmlhttprequest); let handler = ev => { evf(m => xhr.removeeventlistener(m, handler, !1)); ...
...you only want this if your url is to a zip file or some file you want to download and make a nsiarraybufferinputstream out of it or something xhr.send(null); } xhr('https://www.gravatar.com/avatar/eb9
895ade1bd6627e054429d1e1
8b576?s=24&d=identicon&r=pg&f=1', data => { services.prompt.alert(null, 'xhr success', data); var file = os.path.join(os.constants.path.desktopdir, "test.png"); var promised = os.file.writeatomic(file, new uint
8array(data)); promised.then( function() { alert('succesfully saved image to desktop') }, function(ex) { ...
nsIXPCScriptable
constants constant value description want_precreate 1 << 0 want_create 1 << 1 want_postcreate 1 << 2 want_addproperty 1 << 3 want_delproperty 1 << 4 want_getproperty 1 << 5 want_setproperty 1 << 6 want_enumerate 1 << 7 want_newenumerate 1 <<
8 indicates that the object wants to have its newenumerate method called.
... want_convert 1 << 10 want_finalize 1 << 11 want_checkaccess 1 << 12 want_call 1 << 13 want_construct 1 << 14 want_hasinstance 1 << 15 want_trace 1 << 16 use_jsstub_for_addproperty 1 << 17 use_jsstub_for_delproperty 1 << 1
8 use_jsstub_for_setproperty 1 << 19 dont_enum_static_props 1 << 20 dont_enum_query_interface 1 << 21 dont_ask_instance_for_scriptable 1 << 22 classinfo_interfaces_only 1 << 23 allow_prop_mods_during_resolve 1 << 24 allow_prop_mods_to_prototype 1 << 25 dont_share_prototype 1 << 26 dont_reflect_interface_names 1 << 27 want_equality 1 << 2
8 want_outer_object 1 << 29 want_inner_object 1 << 30 rese...
nsIZipReaderCache
to create an instance, use: var zipreadercache = components.classes["@mozilla.org/libjar/zip-reader-cache;1"] .createinstance(components.interfaces.nsizipreadercache); method overview nsizipreader getinnerzip(in nsifile zipfile, in autf
8string zipentry); nsizipreader getinnerzip(in nsifile zipfile, in string zipentry); obsolete since gecko 10 nsizipreader getzip(in nsifile zipfile); void init(in unsigned long cachesize); methods getinnerzip() returns a (possibly shared) cached nsizipreader for a zip inside another zip.
... nsizipreader getinnerzip( in nsifile zipfile, in autf
8string zipentry ); parameters zipfile the zip file.
nsMsgRuleActionType
defined in comm-central/ mailnews/ base/ search/ public/ nsmsgfiltercore.idl typedef long nsmsgruleactiontype; [scriptable, uuid(59af7696-1e2
8-4642-a400-fa327ae0b
8d
8)] interface nsmsgfilteraction { /* if you change these, you need to update filter.properties, look for filteractionx */ /* these longs are all actually of type nsmsgfilteractiontype */ const long custom=-1; /* see nsmsgfilteraction */ const long none=0; /* uninitialized state */ const long movetofolder=1; const long changepriority=2; const long delete=3; const long markread=4; const long killthread=5; const long watchthread=6; const long markflagged=7; const long label=
8; const long reply=9; const long forward=10; const long stopexecution=...
...11; const long deletefrompop3server=12; const long leaveonpop3server=13; const long junkscore=14; const long fetchbodyfrompop3server=15; const long copytofolder=16; const long addtag=17; const long killsubthread=1
8; const long markunread=19; }; ...
nsMsgSearchOp
defined in comm-central/ mailnews/ base/ search/ public/ nsmsgsearchcore.idl typedef long nsmsgsearchopvalue; [scriptable, uuid(9160b196-6fcb-4eba-aaaf-6c
806c4ee420)] interface nsmsgsearchop { const nsmsgsearchopvalue contains = 0; /* for text attributes */ const nsmsgsearchopvalue doesntcontain = 1; const nsmsgsearchopvalue is = 2; /* is and isn't also apply to some non-text attrs */ const nsmsgsearchopvalue isnt = 3; const nsmsgsearchopvalue isempty = 4; const nsmsgsearchopvalue isbefore = 5; /* for date attributes */ const nsmsgsearchopvalue isafter = 6; const nsmsgsearchopvalue ishigherthan = 7; /* for priority.
... is also applies */ const nsmsgsearchopvalue islowerthan =
8; const nsmsgsearchopvalue beginswith = 9; const nsmsgsearchopvalue endswith = 10; const nsmsgsearchopvalue soundslike = 11; /* for ldap phoenetic matching */ const nsmsgsearchopvalue ldapdwim = 12; /* do what i mean for simple search */ const nsmsgsearchopvalue isgreaterthan = 13; const nsmsgsearchopvalue islessthan = 14; const nsmsgsearchopvalue namecompletion = 15; /* name completion operator...as the name implies =) */ const nsmsgsearchopvalue isinab = 16; const nsmsgsearchopvalue isntinab = 17; const nsmsgsearchopvalue isntempty = 1
8; /* primarily for tags */ const nsmsgsearchopvalue matches = 19; /* generic term for use by custom terms */ const nsm...
XPCOM Interface Reference
nsistreamlistenernsistringbundlensistringbundleoverridensistringbundleservicensistringenumeratornsistructuredclonecontainernsistylesheetservicensisupportsnsisupports proxiesnsisupportsarraynsisupportscstringnsisupportscharnsisupportsdoublensisupportsfloatnsisupportsidnsisupportsinterfacepointernsisupportsprboolnsisupportsprint16nsisupportsprint32nsisupportsprint64nsisupportsprtimensisupportspruint
8nsisupportspruint16nsisupportspruint32nsisupportspruint64nsisupportsprimitivensisupportsprioritynsisupportsstringnsisupportsvoidnsisupportsweakreferencensisyncjpakensisyncmessagesendernsitxttohtmlconvnsitaggingservicensitaskbarpreviewnsitaskbarpreviewbuttonnsitaskbarpreviewcontrollernsitaskbarprogressnsitaskbartabpreviewnsitaskbarwindowpreviewnsitelemetrynsitextinputprocessornsitextinputprocessorc...
...nsitimernsitimercallbacknsitoolkitnsitoolkitprofilensitoolkitprofileservicensitraceablechannelnsitransactionnsitransactionlistnsitransactionlistenernsitransactionmanagernsitransferablensitransportnsitransporteventsinknsitransportsecurityinfonsitreeboxobjectnsitreecolumnnsitreecolumnsnsitreecontentviewnsitreeselectionnsitreeviewnsiurinsiurifixupnsiurifixupinfonsiurlnsiurlformatternsiurlparsernsiutf
8converterservicensiutf
8stringenumeratornsiuuidgeneratornsiupdatensiupdatechecklistenernsiupdatecheckernsiupdateitemnsiupdatemanagernsiupdatepatchnsiupdatepromptnsiupdatetimermanagernsiuploadchannelnsiuploadchannel2nsiurllistmanagercallbacknsiusercertpickernsiuserinfonsivariantnsiversioncomparatornsiweakreferencensiwebbrowsernsiwebbrowserchromensiwebbrowserchrome2nsiwebbrowserchrome3nsiwebbrowserch...
NS_CStringGetMutableData
example // convert any uppercase ascii letters to lowercase void tolowercase(nscstring &str) { char *iter; pruint32 len = ns_cstringgetmutabledata(str, pr_uint32_max, &iter); char *end = iter + len; while (iter != end) { char c = *iter; if (c >= 'a' && c <= 'z') *iter = c + ('a' - 'a'); ++iter; } } history this function was finalized for mozilla 1.
8.
... see bug 2
887
86 for details.
nsMsgNavigationType
previousunreadmessage
8 go to the previous unread message in the view.
... nextunreadthread 10 nextunreadfolder 11 nextfolder 12 readmore 13 back 15 go back to the previous visited message forward 16 go forward to the previous visited message firstflagged 17 nextflagged 1
8 previousflagged 19 firstnew 20 editundo 21 editredo 22 togglesubthreadkilled 23 ...
Storage
executing a statement you may execute statements either synchronously (which is supported in firefox gecko 1.
8 and 1.9) or asynchronously (starting in gecko 1.9.1).
... if your code needs to work with applications based on gecko 1.
8 or 1.9, you should the technique covered in the section synchronously below.
Working with Multiple Versions of Interfaces
unfortunately we compiled this in the latest sdk, and so this magic number happens to be: "244e4c67-a1d3-44f2-9cab-cdaa31b6
8046" whereas, inside firefox 2, the iid it happens to know about is: "663ca4a
8-d219-4000-925d-d
8f66406b626".
...we first dredge out the old interface identifiers from our yea olde firefox 1.5 sdk: static const nsiid iar_iid_old = { 0x663ca4a
8, 0xd219, 0x4000, { 0x92, 0x5d, 0xd
8, 0xf6, 0x64, 0x06, 0xb6, 0x26 }}; static const nsiid iad_iid_old = {0x
87
81fc
88, 0x355f, 0x4439, { 0x
88, 0x1f, 0x65, 0x04, 0xa0, 0xa1, 0xce, 0xb6 }}; then follow the recipe.
XPCOM ABI
abi naming each abi is named with a string [target_xpcom_abi] of the following format: {cpu_arch}-{target_compiler_abi} {cpu_arch} [platforms] represents the cpu architecture and may be either: x
86 - i3
86 and higher series (including x
86-64 cpus in 32-bit mode) ppc - powerpc series alpha - alpha series x
86_64 - amd64/emt64 series in 64-bit mode (32-bit mode is still considered x
86) sparc - sparc series ia64 - itanium series {target_compiler_abi}[platforms] represents the compiler abi and may be either: msvc - microsoft visual c++ n32 - irix 6 c++ compiler gcc2 - gnu c++ compile...
...r 2.x gcc3 - gnu c++ compiler 3.x or 4.x sunc - sun c++ compiler ibmc - ibm c++ compiler for example: firefox built with the gnu c++ compiler 4.0.0 for the intel pentium processor would have xpcom abi of x
86-gcc3 the xpcom abi string can be retrieved programmatically by using the nsixulruntime interface.
XPCOM ownership guidelines
original document information author: scott collins last updated date: may
8, 2003 copyright information: copyright© 1999 by netscape; use is subject to the npl.
... portions of this content are © 199
8–2007 by individual mozilla.org contributors; content available under a creative commons license | details.
XUL Overlays
loading overlays at runtime firefox 1.5 and other gecko 1.
8-based applications also support loading overlays on-the-fly via the document.loadoverlay() function.
...attaching a script to an overlay to execute a script when an overlay is applied, use a <script> element: <script src="overlay.js"/> if you need to set the version of javascript, you can set the type attribute: <script type="application/x-javascript;version=1.
8" src="overlay.js"/> ui reuse with overlays one of the biggest benefits of using overlays is that it allows you to reuse groups of elements that appear frequently in the ui.
Address book sync client design
this interface is defined in mozilla/mailnews/addrbook/public/nsiabsyncdriver.idl #include "nsrootidl.idl" #include "nsiabsynclistener.idl" [scriptable, uuid(91fdfee1-efbc-11d3-
8f97-000073757374)] interface nsiabsyncdriver : nsiabsynclistener { void kickit(); }; as you can see, this is a very simple interface which allows for the starting of the address book sync operation.
...this interface is as follows: #include "nsisupports.idl" #include "nsrootidl.idl" #include "nsifilespec.idl" [scriptable, uuid(e0ed29e0-09
8a-11d4-
8fd6-00a024a7d144)] interface nsiabsynclistener : nsisupports { /** * notify the observer that the ab sync authorization operation has begun.
Thunderbird Configuration Files
on windows vista/xp/2000, the path is usually %appdata%\thunderbird\profiles\xxxxxxxx.default\, where xxxxxxxx is a random string of
8 characters.
... on windows 95/9
8/me, the path is usually c:\windows\application data\thunderbird\profiles\xxxxxxxx.default\ on linux, the path is usually ~/.thunderbird/xxxxxxxx.default/ on mac os x, the path is usually ~/library/thunderbird/profiles/xxxxxxxx.default/ %appdata% is a shorthand for the application data path on windows 2000/xp/vista.
Building a Thunderbird extension 3: install manifest
on="1.0"?> <rdf xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:em="http://www.mozilla.org/2004/em-rdf#"> <description about="urn:mozilla:install-manifest"> <em:id>myfirstext@jen.zed</em:id> <em:name>my first extension</em:name> <em:version>1.0</em:version> <em:creator>jenzed</em:creator> <em:targetapplication> <description> <em:id>{3550f703-e5
82-4d05-9a0
8-453d09bdfdc6}</em:id> <em:minversion>1.5</em:minversion> <em:maxversion>5.0.*</em:maxversion> </description> </em:targetapplication> </description> </rdf> the following items (shown in bold) should be customized for your application: <em:id>myfirstext@jen.zed</em:id>: this is the id of the extension.
... <em:id>{3550f703-e5
82-4d05-9a0
8-453d09bdfdc6}</em:id>: this element contains the version id of the application that this add on is developed for.
customDBHeaders Preference
me.manifest \ chrome/content/ \ chrome/content/superfluous.js \ chrome/content/superfluous_overlay.xul \ install.rdf superfluous.xpi: ${deps} zip $@ ${deps} chrome.manifest: content superfluous chrome/content/ overlay chrome://messenger/content/messenger.xul chrome://superfluous/content/superfluous_overlay.xul install.rdf: <?xml version='1.0' encoding='utf-
8'?> <rdf xmlns='http://www.w3.org/1999/02/22-rdf-syntax-ns#' xmlns:em='http://www.mozilla.org/2004/em-rdf#'> <description about='urn:mozilla:install-manifest'> <em:id>superfluous@yoursite.com</em:id> <em:version>0.1.1</em:version> <em:type>2</em:type> <!-- 2 is type 'extension' --> <em:targetapplication> <description> <!-- this next line identifies t...
...bird as target --> <em:id>{3550f703-e5
82-4d05-9a0
8-453d09bdfdc6}</em:id> <em:minversion>2*</em:minversion> <em:maxversion>3.0.0.*</em:maxversion> </description> </em:targetapplication> <em:name>superfluous</em:name> <em:description>test superfluous extension</em:description> <em:creator>garrett comeaux</em:creator> </description> </rdf> build process: [gcomeaux@kyle tbird-ext]$ cd superfluous/ [gcomeaux@kyle superfluous]$ make zip superfluous.xpi chrome/ chrome.manifest chrome/content/ chrome/content/superfluous.js chrome/content/superfluous_overlay.xul install.rdf adding: chrome/ (stored 0%) adding: chrome.manifest (deflated 44%) adding: chrome/content/ (stored 0%) adding: chrome/content/superfluous.js (deflated 57%) a...
Add to iPhoto
"file system representation" strings on mac os x are in utf-
8 format.
... in c, the fsref is declared thusly: struct fsref { uint
8 hidden[
80]; /* private to file manager; •• need symbolic constant */ }; typedef struct fsref fsref; we declare it using js-ctypes like this: this.struct_fsref = new ctypes.structtype("fsref", [ {"hidden": ctypes.char.array(
80)}]); the carbon library init() and shutdown() routines are otherwise similar to how we do things fo...
ctypes.open
see: http://stackoverflow.com/questions/193
82201/how-to-load-dll-from-sdk-addon-data-folder it is important to note that custom native files cannot be loaded through chrome:// or resource:// uris.
...//youraddon/content/mysubfolder/mycfunctionsforunix.so then it is converted to a file uri like this: components.utils.import("resource://gre/modules/services.jsm"); var cr = components.classes['@mozilla.org/chrome/chrome-registry;1'].getservice(components.interfaces.nsichromeregistry); var chromeuri_mylib = services.io.newuri('chrome://youraddon/content/mysubfolder/mycfunctionsforunix.so', 'utf-
8', null); var localfile_mylib = cr.convertchromeurl(chromeuri_mylib); var jarpath_mylib = localfile_mylib.spec; // "jar:file:///c:/users/vayeate/appdata/roaming/mozilla/firefox/profiles/aecgxse.unnamed%20profile%201/extensions/youraddon@jetpack.xpi!/mysubfolder/mycfunctionsforunix.so" var filepath_mylib = localfilemylib.path; // "file:///c:/users/vayeate/appdata/roaming/mozilla/firefox/profiles/ae...
ABI
general details this article describes the calling conventions with respect to js-ctypes while programming x
86 and x
86-64/x64/amd64 architectures.
... http://en.wikipedia.org/wiki/x
86_calling_conventions abi abi stands for "application binary interface".
URLs - Plugins
for more information, see rfc 39
86, "uniform resource identifier (uri): generic syntax", and the iana uri scheme registry.
...see bug 63
8367 for details.
Plugin Roadmap for Firefox - Plugins
firefox extended support release 52 will continue to support non-flash plugins until early 201
8.
... september 2017 starting with firefox 56 in september 2017, firefox for android will remove all support for plugins (bug 13
81916).
Debugger.Source - Firefox Developer Tools
binary if the instance refers to webassembly code and the debugger has the allowwasmbinarysource property set, a uint
8array that contains the webassembly bytecode.
... source metadata generated from file: js/src/doc/debugger/debugger.source.md watermark: sha256:5ca245
813db9662
8aab1c7
8b
803355eb2aa
8c575
839c67eb7d7bde177
89
8df
88 changeset: e91b2c
85aacd ...
Tutorial: Set a breakpoint - Firefox Developer Tools
this tutorial was tested against firefox 5
8 beta and nightly.
... source metadata generated from file: js/src/doc/debugger/tutorial-breakpoint.md watermark: sha256:c
8dd4bb69972b5
8e59fcbe6
870499206463a5e330fda25f1214
893595a1c01d0 changeset: ffa775dd5bd4 ...
All keyboard shortcuts - Firefox Developer Tools
+ e toggle responsive design mode ctrl + shift + m cmd + opt + m ctrl + shift + m open browser console ctrl + shift + j cmd + shift + j ctrl + shift + j open browser toolbox ctrl + alt + shift + i cmd + opt + shift + i ctrl + alt + shift + i open scratchpad shift + f4 shift + f4 * shift + f4 open webide shift + f
8 shift + f
8 * shift + f
8 storage inspector shift + f9 shift + f9 * shift + f9 open debugger 3 ctrl + shift + z cmd + opt + z ctrl + shift + z 1.
...md + w ctrl + w search for a string in the current file ctrl + f cmd + f ctrl + f search for a string in all files ctrl + shift + f cmd + shift + f ctrl + shift + f find next in the current file ctrl + g cmd + g ctrl + g search for scripts by name ctrl + p cmd + p ctrl + p resume execution when at a breakpoint f
8 f
8 1 f
8 step over f10 f10 1 f10 step into f11 f11 1 f11 step out shift + f11 shift + f11 1 shift + f11 toggle breakpoint on the currently selected line ctrl + b cmd + b ctrl + b toggle conditional breakpoint on the currently selected line ctrl + shift + b cmd + shift + b ctrl + shift + b 1.
Responsive Design Mode - Firefox Developer Tools
initially, it's set to 320 x 4
80 pixels.
... dpr (pixel ratio) - beginning with firefox 6
8, the dpr is no longer editable; create a custom device in order to change the dpr throttling - a drop-down list where you can select the connection throttling to apply, for example 2g, 3g, or lte enable/disable touch simulation - toggles whether or not responsive design mode simulates touch events.
Web Console Helpers - Firefox Developer Tools
:block (starting in firefox
80) followed by an unquoted string, blocks requests where the url contains that string.
... :unblock (starting in firefox
80) followed by an unquoted string, removes blocking for urls containing that string.
The JavaScript input interpreter - Firefox Developer Tools
ou can pass a css selector that matches the iframe: cd("#frame1"); you can pass the iframe's global window object: var frame = document.getelementbyid("frame1"); cd(frame.contentwindow); to switch the context back to the top-level window, call cd() with no arguments: cd(); for example, suppose we have a document that embeds an iframe: <!doctype html> <html> <head> <meta charset="utf-
8"> </head> <body> <iframe id="frame1" src="static/frame/my-frame1.html"></iframe> </body> </html> the iframe defines a new function: <!doctype html> <html> <head> <meta charset="utf-
8"> <script> function whoareyou() { return "i'm frame1"; } </script> </head> <body> </body> </html> you can switch context to the iframe like this: cd("#frame1"); n...
... copy() new in firefox 3
8.
AesCtrParams - Web APIs
note: see appendix b of the nist sp
800-3
8a standard for more information.
...the nist sp
800-3
8a standard, which defines ctr, suggests that the counter should occupy half of the counter block (see appendix b.2), so for aes it would be 64.
AnalyserNode.getFloatFrequencyData() - Web APIs
for example, for 4
8000 sample rate, the last item of the array will represent the decibel value for 24000 hz.
... if you need higher performance and don't care about precision, you can use analysernode.getbytefrequencydata() instead, which works on a uint
8array.
AnalyserNode.maxDecibels - Web APIs
for more complete applied examples/information, check out our voice-change-o-matic demo (see app.js lines 12
8–205 for relevant code).
... analyser.fftsize = 256; var bufferlength = analyser.frequencybincount; console.log(bufferlength); var dataarray = new uint
8array(bufferlength); canvasctx.clearrect(0, 0, width, height); function draw() { drawvisual = requestanimationframe(draw); analyser.getbytefrequencydata(dataarray); canvasctx.fillstyle = 'rgb(0, 0, 0)'; canvasctx.fillrect(0, 0, width, height); var barwidth = (width / bufferlength) * 2.5; var barheight; var x = 0; for(var i = 0; i < bufferlength; i++) { barheight = dataarray[i]; canvasctx.fillstyle = 'rgb(' + (barheight+100) + ',50,50)'; canvasctx.fillrect(x,...
AnalyserNode.minDecibels - Web APIs
for more complete applied examples/information, check out our voice-change-o-matic demo (see app.js lines 12
8–205 for relevant code).
... analyser.fftsize = 256; var bufferlength = analyser.frequencybincount; console.log(bufferlength); var dataarray = new uint
8array(bufferlength); canvasctx.clearrect(0, 0, width, height); function draw() { drawvisual = requestanimationframe(draw); analyser.getbytefrequencydata(dataarray); canvasctx.fillstyle = 'rgb(0, 0, 0)'; canvasctx.fillrect(0, 0, width, height); var barwidth = (width / bufferlength) * 2.5; var barheight; var x = 0; for(var i = 0; i < bufferlength; i++) { barheight = dataarray[i]; canvasctx.fillstyle = 'rgb(' + (barheight+100) + ',50,50)'; canvasctx.fillrect(x,...
AnimationEvent - Web APIs
k; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/animationevent" target="_top"><rect x="116" y="1" width="140" height="50" fill...
...="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="1
86" 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.
AudioBufferSourceNode - Web APIs
udionode" 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="2
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/audioscheduledsourcenode" target="_top"><rect x="2
81" 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 xlink:href="/docs/web/api/audiobuffersourcenode" target="_top"><rect x="561" y="1" width="210" height="50" fill="#f4f7f
8" 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.baseLatency - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetbaselatency experimentalchrome full support 5
8edge full support ≤79firefox full support 70ie no support noopera full support 45safari no support nowebview android full support ...
... 5
8chrome android full support 5
8firefox android no support noopera android full support 43safari ios no support nosamsung internet android full support 7.0legend full support full support no support no supportexperimental.
AudioContextOptions - Web APIs
example this example instantiates an audio context for music playback (optimized for power consumption over latency), with the sample rate 4
8,000 hz.
... let musiccontext = new audiocontext({ latencyhint: "playback", samplerate: 4
8000 }); specifications specification status comment web audio apithe definition of 'audiocontextoptions' in that specification.
AudioNode - Web APIs
nt-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 xlink:href="/docs/web/api/audionode" target="_top"><rect x="151" y="1" width="90" height="50" fill="#f4f7f
8" 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.
... // constructor const analysernode = new analysernode(audioctx, { fftsize: 204
8, maxdecibels: -25, mindecibels: -60, smoothingtimeconstant: 0.5, }); // factory method const analysernode = audioctx.createanalyser(); analysernode.fftsize = 204
8; analysernode.maxdecibels = -25; analysernode.mindecibels = -60; analysernode.smoothingtimeconstant = 0.5; you are free to use either constructors or factory methods, or mix both, however there are advantages to using the constr...
AudioParam.maxValue - Web APIs
the default value of maxvalue is the maximum positive single-precision floating-point value (+340,2
82,346,63
8,52
8,
859,
811,704,1
83,4
84,516,925,440).
... example const audioctx = new audiocontext(); const gainnode = audioctx.creategain(); console.log(gainnode.gain.maxvalue); // 3.402
8234663
852
886e3
8 specifications specification status comment web audio apithe definition of 'maxvalue' in that specification.
AudioParam.minValue - Web APIs
the default value of minvalue is the minimum negative single-precision floating-point value (-340,2
82,346,63
8,52
8,
859,
811,704,1
83,4
84,516,925,440).
... example const audioctx = new audiocontext(); const gainnode = audioctx.creategain(); console.log(gainnode.gain.minvalue); // -3.402
8234663
852
886e3
8 specifications specification status comment web audio apithe definition of 'minvalue' in that specification.
AuthenticatorResponse - Web APIs
examples getting an authenticatorassertionresponse var options = { challenge: new uint
8array([/* bytes sent from the server */]) }; navigator.credentials.get({ "publickey": options }) .then(function (credentialinfoassertion) { var assertionresponse = credentialinfoassertion.response; // send assertion response back to the server // to proceed with the control of the credential }).catch(function (err) { console.error(err); }); getting an authenticatorattestat...
...ionresponse var publickey = { challenge: /* from the server */, rp: { name: "example corp", id : "login.example.com" }, user: { id: new uint
8array(16), name: "jdoe@example.com", displayname: "john doe" }, pubkeycredparams: [ { type: "public-key", alg: -7 } ] }; navigator.credentials.create({ publickey }) .then(function (newcredentialinfo) { var attestationresponse = newcredentialinfo.response; }).catch(function (err) { console.error(err); }); specifications specification status comment web authentication: an api for accessing public key credentials level 1the definition of 'authenticatorresponse interface' in that specification.
BeforeInstallPromptEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom:
8.57142
857142
8571%; 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 xlink: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="3
8.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignme...
...nt-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 xlink:href="/docs/web/api/beforeinstallpromptevent" target="_top"><rect x="116" y="1" width="240" height="50" fill="#f4f7f
8" 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
ay: 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 xlink: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="3
8.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 xlink:href="/docs/web/api/beforeunloadevent" target="_top"><rect x="116" y="1" width="170" height="50" f...
...ill="#f4f7f
8" 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-derived browsers don't follow the spec for the dialog box.
Blob - Web APIs
blob.prototype.text() returns a promise that resolves with a usvstring containing the entire contents of the blob interpreted as utf-
8 text.
... function typedarraytourl(typedarray, mimetype) { return url.createobjecturl(new blob([typedarray.buffer], {type: mimetype})) } const bytes = new uint
8array(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
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/characterdata" target="_top"><rect x="266" y="1" width="130" height="50" ...
...aseline="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 xlink:href="/docs/web/api/cdatasection" target="_top"><rect x="391" y="65" width="120" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="451" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">cdatasection</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interface has no specific properties and implements those of its parent text.
CSSCounterStyleRule - Web APIs
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 xlink: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="3
8.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" y1="25" x2="116" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/csscounterstylerule" target="_top"><rect x="116" y="1" width="190" height="5...
...0" fill="#f4f7f
8" 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 xlink: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" y1="25" x2="121" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/...
...cssprimitivevalue" target="_top"><rect x="121" y="1" width="170" height="50" fill="#f4f7f
8" 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 xlink: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" y1="25" x2="121" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/...
...cssvaluelist" target="_top"><rect x="121" y="1" width="120" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="1
81" 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.
CSS Painting API - Web APIs
sterpaint() function: registerpaint('hollowhighlights', class { static get inputproperties() { return ['--boxcolor']; } static get inputarguments() { return ['*','<length>']; } static get contextoptions() { return {alpha: true}; } paint(ctx, size, props, args) { const x = 0; const y = size.height * 0.3; const blockwidth = size.width * 0.33; const blockheight = size.height * 0.
85; const thecolor = props.get( '--boxcolor' ); const stroketype = args[0].tostring(); const strokewidth = parseint(args[1]); console.log(thecolor); if ( strokewidth ) { ctx.linewidth = strokewidth; } else { ctx.linewidth = 1.0; } if ( stroketype === 'stroke' ) { ctx.fillstyle = 'transparent'; ctx.strokestyle = thecolor; } else if ( stroketype === 'filled' ) { ...
... blockheight); ctx.lineto( blockwidth + (start * 10) + 10 + blockheight, blockheight); ctx.lineto( blockwidth + (start * 10) + 10, y); ctx.closepath(); ctx.fill(); ctx.stroke(); } } }); we then include the paintworklet: <ul> <li>item 1</li> <li>item 2</li> <li>item 3</li> <li>item 4</li> <li>item 5</li> <li>item 6</li> <li>item 7</li> <li>item
8</li> <li>item 9</li> <li>item 10</li> <li>item 11</li> <li>item 12</li> <li>item 13</li> <li>item 14</li> <li>item 15</li> <li>item 16</li> <li>item 17</li> <li>item 1
8</li> <li>item 19</li> <li>item 20</li> </ul> css.paintworklet.addmodule('https://mdn.github.io/houdini-examples/csspaint/intro/worklets/hilite.js'); then we can use the <image> ...
CanvasRenderingContext2D.addHitRegion() - Web APIs
html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); canvas.addeventlistener('mousemove', function(event) { if(event.region) { alert('ouch, my eye :('); } }); ctx.beginpath(); ctx.arc(100, 100, 75, 0, 2 * math.pi); ctx.linewidth = 5; ctx.stroke(); // eyes ctx.beginpath(); ctx.arc(70,
80, 10, 0, 2 * math.pi); ctx.arc(130,
80, 10, 0, 2 * math.pi); ctx.fill(); ctx.addhitregion({id: "eyes"}); // mouth ctx.beginpath(); ctx.arc(100, 110, 50, 0, math.pi); ctx.stroke(); edit the code below to see your changes update live in the canvas.
...vas" width="400" height="200" class="playable-canvas"></canvas> <div class="playable-buttons"> <input id="edit" type="button" value="edit" /> <input id="reset" type="button" value="reset" /> </div> <textarea id="code" class="playable-code" style="height:250px"> ctx.beginpath(); ctx.arc(100, 100, 75, 0, 2 * math.pi, false); ctx.linewidth = 5; ctx.stroke(); // eyes ctx.beginpath(); ctx.arc(70,
80, 10, 0, 2 * math.pi, false); ctx.arc(130,
80, 10, 0, 2 * math.pi, false); ctx.fill(); ctx.addhitregion({id: "eyes"}); // mouth ctx.beginpath(); ctx.arc(100, 110, 50, 0, math.pi, false); ctx.stroke();</textarea> var canvas = document.getelementbyid("canvas"); var ctx = canvas.getcontext("2d"); var textarea = document.getelementbyid("code"); var reset = document.getelementbyid("reset"); var edi...
CanvasRenderingContext2D.drawImage() - Web APIs
it is drawn to the canvas at (21, 20), where it is given a width of
87 and a height of 104.
... const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); const image = document.getelementbyid('source'); image.addeventlistener('load', e => { ctx.drawimage(image, 33, 71, 104, 124, 21, 20,
87, 104); }); result understanding source element size the drawimage() method uses the source element's intrinsic size in css pixels when drawing.
CanvasRenderingContext2D.filter - Web APIs
html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.filter = 'blur(4px)'; ctx.font = '4
8px serif'; ctx.filltext('hello world', 50, 100); result applying multiple filters you can combine as many filters as you like.
... id="canvas"></canvas> <div style="display:none;"> <img id="source" src="https://udn.realityripple.com/samples/90/a34a525ace.jpg"> </div> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); const image = document.getelementbyid('source'); image.addeventlistener('load', e => { ctx.filter = 'contrast(1.4) sepia(1) drop-shadow(9px 9px 2px #e
81)'; ctx.drawimage(image, 10, 10, 1
80, 120); }); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.filter' in that specification.
CanvasRenderingContext2D.moveTo() - Web APIs
the second line begins at (50, 90) and ends at (2
80, 120).
... var canvas = document.getelementbyid('canvas'); var ctx = canvas.getcontext('2d'); ctx.beginpath(); ctx.moveto(50, 50); // begin first sub-path ctx.lineto(200, 50); ctx.moveto(50, 90); // begin second sub-path ctx.lineto(2
80, 120); ctx.stroke(); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.moveto' in that specification.
CanvasRenderingContext2D.transform() - Web APIs
examples skewing a shape this example skews a rectangle both vertically (.2) and horizontally (.
8).
... html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.transform(1, .2, .
8, 1, 0, 0); ctx.fillrect(0, 0, 100, 100); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.transform' in that specification.
Basic usage of canvas - Web APIs
<!doctype html> <html> <head> <meta charset="utf-
8"/> <title>canvas tutorial</title> <script type="text/javascript"> function draw() { var canvas = document.getelementbyid('tutorial'); if (canvas.getcontext) { var ctx = canvas.getcontext('2d'); } } </script> <style type="text/css"> canvas { border: 1px solid black; } </style> </head> <body onload="draw();"> <canvas id...
... <!doctype html> <html> <head> <meta charset="utf-
8"/> <script type="application/javascript"> function draw() { var canvas = document.getelementbyid('canvas'); if (canvas.getcontext) { var ctx = canvas.getcontext('2d'); ctx.fillstyle = 'rgb(200, 0, 0)'; ctx.fillrect(10, 10, 50, 50); ctx.fillstyle = 'rgba(0, 0, 200, 0.5)'; ctx.fillrect(30, 30, 50, 50); } } </script> </head> <...
Compositing and clipping - Web APIs
ction draw() { var ctx = document.getelementbyid('canvas').getcontext('2d'); ctx.fillrect(0, 0, 150, 150); ctx.translate(75, 75); // create a circular clipping path ctx.beginpath(); ctx.arc(0, 0, 60, 0, math.pi * 2, true); ctx.clip(); // draw background var lingrad = ctx.createlineargradient(0, -75, 0, 75); lingrad.addcolorstop(0, '#232256'); lingrad.addcolorstop(1, '#14377
8'); ctx.fillstyle = lingrad; ctx.fillrect(-75, -75, 150, 150); // draw stars for (var j = 1; j < 50; j++) { ctx.save(); ctx.fillstyle = '#fff'; ctx.translate(75 - math.floor(math.random() * 150), 75 - math.floor(math.random() * 150)); drawstar(ctx, math.floor(math.random() * 4) + 2); ctx.restore(); } } function drawstar(ctx, r) { ctx.save(); ...
...ctx.beginpath(); ctx.moveto(r, 0); for (var i = 0; i < 9; i++) { ctx.rotate(math.pi / 5); if (i % 2 === 0) { ctx.lineto((r / 0.525731) * 0.200
811, 0); } else { ctx.lineto(r, 0); } } ctx.closepath(); ctx.fill(); ctx.restore(); } <canvas id="canvas" width="150" height="150"></canvas> draw(); in the first few lines of code, we draw a black rectangle the size of the canvas as a backdrop, then translate the origin to the center.
CharacterData - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/characterdata" target="_top"><rect x="266" y="1" width="130" height="50" ...
...fill="#f4f7f
8" 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></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, node, and implements the childnode and nondocumenttypechildnode interface.
CloseEvent - Web APIs
1007 invalid frame payload data the endpoint is terminating the connection because a message was received that contained inconsistent data (e.g., non-utf-
8 data within a text message).
... 100
8 policy violation the endpoint is terminating the connection because it received a message that violates its policy.
Comment - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/characterdata" target="_top"><rect x="266" y="1" width="130" height="50" ...
...nt-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 xlink:href="/docs/web/api/comment" target="_top"><rect x="436" y="1" width="75" height="50" fill="#f4f7f
8" 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 indi...
CompositionEvent - Web APIs
k; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/uievent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#fff" ...
...ize="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 xlink:href="/docs/web/api/compositionevent" target="_top"><rect x="231" y="1" width="160" height="50" fill="#f4f7f
8" 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">compositionevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor compositionevent() creates a new compositionevent object instance.
ContentIndex.add() - Web APIs
// our content const item = { id: 'post-1', url: '/posts/amet.html', title: 'amet consectetur adipisicing', description: 'repellat et quia iste possimus ducimus aliquid a aut eaque nostrum.', icons: [{ src: '/media/dark.png', sizes: '12
8x12
8', type: 'image/png', }], category: 'article' }; // our asynchronous function to add indexed content async function registercontent(data) { const registration = await navigator.serviceworker.ready; // feature detect content index if (!registration.index) { return; } // register content try { await registration.index.add(data); } catch (e) { console.log('failed to...
... // our content const item = { id: 'post-1', url: '/posts/amet.html', title: 'amet consectetur adipisicing', description: 'repellat et quia iste possimus ducimus aliquid a aut eaque nostrum.', icons: [{ src: '/media/dark.png', sizes: '12
8x12
8', type: 'image/png', }], category: 'article' }; self.registration.index.add(item); specifications specification status comment unknownthe definition of 'add' in that specification.
DOMException - Web APIs
(legacy code value:
8 and legacy constant name: not_found_err) notsupportederror the operation is not supported.
...(legacy code value: 1
8 and legacy constant name: security_err) networkerror a network error occurred.
Document.characterSet - Web APIs
users can override the developer-specified encoding inside the content-type header or inline like <meta charset="utf-
8">, such as with firefox's view → text encoding menu.
... syntax var string = document.characterset; examples <button onclick="console.log(document.characterset);"> log character encoding </button> <!-- displays document's character encoding in the dev console, such as "iso-
8859-1" or "utf-
8" --> specifications specification status comment domthe definition of 'characterset' in that specification.
Document.evaluate() - Web APIs
any_unordered_node_type
8 a result set containing any single node that matches the expression.
... full support 1.5ie no support noopera full support 9safari full support 5webview android full support 1chrome android full support 1
8firefox android full support 4opera android full support 10.1safari ios full support 4.2samsung internet android full support 1.0legend full support fu...
Document.getElementsByTagName() - Web APIs
see bug 14
869 for details.
... <!doctype html> <html lang="en"> <head> <meta charset="utf-
8" /> <title>getelementsbytagname example</title> <script> function getallparaelems() { var allparas = document.getelementsbytagname('p'); var num = allparas.length; alert('there are ' + num + ' paragraph in this document'); } function div1paraelems() { var div1 = document.getelementbyid('div1'); var div1paras = div1.getelementsbytagname('p'); va...
Document - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/document" target="_top"><rect x="266" y="1" width="
80" height="50" fill="...
...#f4f7f
8" 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">document</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} the document interface describes the common properties and methods for any kind of document.
DocumentFragment - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/documentfragment" target="_top"><rect x="266" y="1" width="160" height="5...
...0" fill="#f4f7f
8" 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-baseline="middle">documentfragment</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor documentfragment() creates and returns a new documentfragment object.
DocumentType - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/documenttype" target="_top"><rect x="266" y="1" width="120" height="50" f...
...ill="#f4f7f
8" 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">documenttype</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, node, and implements the childnode interface.
EXT_sRGB - Web APIs
the constants in webgl2 are: gl.srgb, gl.srgb
8, gl.srgb
8_alpha
8 and gl.framebuffer_attachment_color_encoding.
... ext.srgb
8_alpha
8_ext sized (
8-bit) srgb and alpha formats.
EffectTiming.fill - Web APIs
that css looks like this: #box { width: 200px; height: 200px; left: 50px; top: 50px; border: 1px solid #77
88ff; margin: 0; position: relative; background-color: #2233ff; display: flex; justify-content: center; } all this does is specify the size, border, and color information, as well as indicate that the box should be centered both vertically and horizontally inside its container.
... elem.addeventlistener('click', async evt => { const animation = elem.animate( { transform: `translate(${evt.clientx}px, ${evt.clienty}px)` }, { duration:
800, fill: 'forwards' } ); await animation.finished; // commitstyles will record the style up to and including `animation` and // update elem’s specified style with the result.
Element: click event - Web APIs
internet explorer internet explorer
8 & 9 suffer from a bug where elements with a computed background-color of transparent that are overlaid on top of other element(s) won't receive click events.
... known workarounds for this bug: for ie9 only: set background-color: rgba(0,0,0,0) set opacity: 0 and an explicit background-color other than transparent for ie
8 and ie9: set filter: alpha(opacity=0); and an explicit background-color other than transparent safari mobile safari mobile 7.0+ (and likely earlier versions too) suffers from a bug where click events aren't fired on elements that aren't typically interactive (e.g.
Element.closest() - Web APIs
ototype.msmatchesselector || element.prototype.webkitmatchesselector; } if (!element.prototype.closest) { element.prototype.closest = function(s) { var el = this; do { if (element.prototype.matches.call(el, s)) return el; el = el.parentelement || el.parentnode; } while (el !== null && el.nodetype === 1); return null; }; } however, if you really do require ie
8 support, then the following polyfill will do the job very slowly, but eventually.
... however, it will only support css 2.1 selectors in ie
8, and it can cause severe lag spikes in production websites.
ErrorEvent - Web APIs
ay: 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 xlink: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="3
8.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 xlink:href="/docs/web/api/errorevent" target="_top"><rect x="116" y="1" width="100" height="50" fill="#f...
...4f7f
8" 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.
Comparison of Event Targets - Web APIs
for example, mouse events are retargeted to their parent node when they happen over text nodes (bug 1
85
889), and in that case .target will show the parent and .explicitoriginaltarget will show the text node.
... examples <!doctype html> <html> <head> <meta charset="utf-
8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <title>comparison of event targets</title> <style> table { border-collapse: collapse; height: 150px; width: 100%; } td { border: 1px solid #ccc; font-weight: bold; padding: 5px; min-height: 30px; } .standard...
Event.timeStamp - Web APIs
// reduced time precision (2ms) in firefox 60 event.timestamp; // 1519211
809934 // 1519211
810362 // 1519211
811670 // ...
... // reduced time precision with `privacy.resistfingerprinting` enabled event.timestamp; // 1519129
853500 // 1519129
85
8900 // 1519129
864400 // ...
Using files from web applications - Web APIs
example: showing file(s) size the following example shows a possible use of the size property: <!doctype html> <html> <head> <meta charset="utf-
8"> <title>file(s) size</title> </head> <body> <form name="uploadform"> <div> <input id="uploadinput" type="file" name="myfiles" multiple> selected files: <span id="filenum">0</span>; total size: <span id="filesize">0</span> </div> <div><input type="submit" value="send file"></div> </form> <script> function updatesize() { let nbytes = 0, ofiles ...
...$_files['myfile']['name']); exit; } ?><!doctype html> <html> <head> <title>dnd binary upload</title> <meta http-equiv="content-type" content="text/html; charset=utf-
8"> <script type="application/javascript"> function sendfile(file) { const uri = "/index.php"; const xhr = new xmlhttprequest(); const fd = new formdata(); xhr.open("post", uri, true); xhr.onreadystatechange = function() { if (xhr.readystate == 4 && xhr.status == 200) { alert(xhr.responsetex...
File.getAsText() - Web APIs
if this string is empty, utf-
8 is assumed.
...s var accept = { binary : ["image/png", "image/jpeg"], text : ["text/plain", "text/css", "application/xml", "text/html"] }; var file; for (var i = 0; i < files.length; i++) { file = files[i]; // if file type could be detected if (file !== null) { if (accept.text.indexof(file.mediatype) > -1) { // file is of type text, which we accept // make sure it's encoded as utf-
8 var data = file.getastext("utf-
8"); // modify data with string methods } else if (accept.binary.indexof(file.mediatype) > -1) { // binary } } } specification not part of any specification.
File.lastModifiedDate - Web APIs
// reduced time precision (2ms) in firefox 60 somefile.lastmodifieddate.gettime(); // 1519211
809934 // 1519211
810362 // 1519211
811670 // ...
... // reduced time precision with `privacy.resistfingerprinting` enabled somefile.lastmodifieddate.gettime(); // 1519129
853500 // 1519129
85
8900 // 1519129
864400 // ...
FileReaderSync.readAsArrayBuffer() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetreadasarraybufferchrome full support yesedge full support 12firefox full support
8ie full support yesopera full support yessafari full support yeswebview android full support yeschrome android full support yesfirefox android full support ...
...
8opera android full support yessafari ios full support yessamsung internet android full support yeslegend full support full support ...
FileReaderSync.readAsBinaryString() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetreadasbinarystringchrome full support yesedge full support 12firefox full support
8ie full support yesopera full support yessafari full support yeswebview android full support yeschrome android full support yesfirefox android full support ...
...
8opera android full support yessafari ios full support yessamsung internet android full support yeslegend full support full support ...
FileReaderSync.readAsDataURL() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetreadasdataurlchrome full support yesedge full support 12firefox full support
8ie full support yesopera full support yessafari full support yeswebview android full support yeschrome android full support yesfirefox android full support ...
...
8opera android full support yessafari ios full support yessamsung internet android full support yeslegend full support full support ...
FileSystem.name - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetnamechrome full support 7edge full support ≤1
8firefox full support 50ie no support noopera full support 15safari full support 11.1webview android full support ≤37chrome android full support ...
... 1
8firefox android full support 50opera android full support 14safari ios full support 11.3samsung internet android full support 1.0legend full support full support no support no support ...
FileSystem.root - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetrootchrome full support 7edge full support ≤1
8firefox full support 50ie no support noopera full support 15safari full support 11.1webview android full support ≤37chrome android full support ...
... 1
8firefox android full support 50opera android full support 14safari ios full support 11.3samsung internet android full support 1.0legend full support full support no support no support ...
FileSystemDirectoryEntry.getDirectory() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetgetdirectory experimentalchrome full support
8edge full support 79firefox full support 50notes full support 50notes notes in firefox, the errorcallback's input parameter is a domexception rather than a fileerror object.ie no support noopera no suppo...
...rt nosafari full support 11.1webview android full support ≤37chrome android full support 1
8firefox android full support 50notes full support 50notes notes in firefox, the errorcallback's input parameter is a domexception rather than a fileerror object.opera android no support nosafari ios full support 11.3samsung internet android full support yeslegend full support ...
FileSystemDirectoryEntry.getFile() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetgetfile experimentalchrome full support
8edge full support 79firefox full support 50notes full support 50notes notes in firefox, the errorcallback's input parameter is a domexception rather than a fileerror object.ie no support noopera no suppo...
...rt nosafari full support 11.1webview android full support ≤37chrome android full support 1
8firefox android full support 50notes full support 50notes notes in firefox, the errorcallback's input parameter is a domexception rather than a fileerror object.opera android no support nosafari ios full support 11.3samsung internet android full support yeslegend full support ...
FileSystemDirectoryEntry.removeRecursively() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetremoverecursively deprecatednon-standardchrome full support
8edge full support 79firefox no support 50 — 52notes no support 50 — 52notes notes while the removerecursively() method existed, it immediately called the error callback with ns_error_dom_security_err.ie no support noopera no support ...
... nosafari no support nowebview android full support ≤37chrome android full support 1
8firefox android no support 50 — 52notes no support 50 — 52notes notes while the removerecursively() method existed, it immediately called the error callback with ns_error_dom_security_err.opera android no support nosafari ios no support nosamsung internet android full support yeslegend full support ...
FileSystemDirectoryReader.readEntries() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetreadentries deprecatednon-standardchrome full support
8edge ?
... safari full support 11.1webview android full support ≤37chrome android full support 1
8firefox android full support yesopera android no support nosafari ios full support 11.3samsung internet android ?
FileSystemEntry.copyTo() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetcopyto experimentaldeprecatednon-standardchrome full support
8edge full support 79firefox no support noie no support noopera no support nosafari no support nowebview android full support ≤37...
...chrome android full support 1
8firefox android no support noopera android no support nosafari ios no support nosamsung internet android full support yeslegend full support full support no support no supportexperimental.
FileSystemEntry.filesystem - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetfilesystem experimentalchrome full support
8edge full support 79firefox full support 50ie no support noopera no support nosafari full support 11.1webview android full support ...
... ≤37chrome android full support 1
8firefox android full support 50opera android no support nosafari ios full support 11.3samsung internet android full support yeslegend full support full support no support no supportexperimental.
FileSystemEntry.fullPath - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetfullpath experimentalchrome full support
8edge full support 79firefox full support 50ie no support noopera no support nosafari full support 11.1webview android full support ...
... ≤37chrome android full support 1
8firefox android full support 50opera android no support nosafari ios full support 11.3samsung internet android full support yeslegend full support full support no support no supportexperimental.
FileSystemEntry.getParent() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetgetparent experimentalchrome full support
8edge full support 79firefox no support noie no support noopera no support nosafari full support 11.1webview android full support �...
...��37chrome android full support 1
8firefox android no support noopera android no support nosafari ios full support 11.3samsung internet android full support yeslegend full support full support no support no supportexperimental.
FileSystemEntry.isDirectory - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetisdirectory experimentalchrome full support
8edge full support 79firefox full support 50ie no support noopera no support nosafari full support 11.1webview android full support ...
... ≤37chrome android full support 1
8firefox android full support 50opera android no support nosafari ios full support 11.3samsung internet android full support yeslegend full support full support no support no supportexperimental.
FileSystemEntry.isFile - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetisfile experimentalchrome full support
8edge full support 79firefox full support 50ie no support noopera no support nosafari full support 11.1webview android full support ...
... ≤37chrome android full support 1
8firefox android full support 50opera android no support nosafari ios full support 11.3samsung internet android full support yeslegend full support full support no support no supportexperimental.
FileSystemEntry.name - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetname experimentalchrome full support
8edge full support 79firefox full support 50ie no support noopera no support nosafari full support 11.1webview android full support ...
... ≤37chrome android full support 1
8firefox android full support 50opera android no support nosafari ios full support 11.3samsung internet android full support yeslegend full support full support no support no supportexperimental.
FileSystemEntry.remove() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetremove experimentaldeprecatednon-standardchrome full support
8edge full support 79firefox no support noie no support noopera no support nosafari no support nowebview android full support ≤37...
...chrome android full support 1
8firefox android no support noopera android no support nosafari ios no support nosamsung internet android full support yeslegend full support full support no support no supportexperimental.
FileSystemEntry.toURL() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internettourl experimentaldeprecatednon-standardchrome full support
8edge full support 79firefox no support noie no support noopera no support nosafari no support nowebview android full support ≤37...
...chrome android full support 1
8firefox android no support noopera android no support nosafari ios no support nosamsung internet android full support yeslegend full support full support no support no supportexperimental.
FileSystemFileEntry.createWriter() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetcreatewriter deprecatednon-standardchrome full support
8edge full support 79firefox no support 50 — 52notes no support 50 — 52notes notes while the createwriter() method existed, it immediately called errorcallback with the ns_error_dom_security_err error.ie no support noopera no support ...
... nosafari no support nowebview android full support ≤37chrome android full support 1
8firefox android no support 50 — 52notes no support 50 — 52notes notes while the createwriter() method existed, it immediately called errorcallback with the ns_error_dom_security_err error.opera android no support nosafari ios no support nosamsung internet android full support yeslegend full support full support...
FileSystemFileEntry.file() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetfilechrome full support
8edge full support 79firefox full support 50ie no support noopera no support nosafari full support 11.1webview android full support ...
... ≤37chrome android full support 1
8firefox android full support 50opera android no support nosafari ios full support 11.3samsung internet android full support yeslegend full support full support no support no support ...
Introduction to the File and Directory Entries API - Web APIs
the file and directory entries api and other storage apis the file and directory entries api is an alternative to other storage apis like indexeddb, websql (which has been deprecated since november1
8, 2010), and appcache.
...for example, while an app or a page in http://www.example.com/app/ can access files from http://www.example.com/dir/, because they have the same origin, it cannot retrieve files from http://www.example.com:
80
80/dir/ (different port) or https://www.example.com/dir/ (different protocol).
FocusEvent - Web APIs
k; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/uievent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#fff" ...
...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 xlink:href="/docs/web/api/focusevent" target="_top"><rect x="231" y="1" width="100" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="2
81" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">focusevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor focusevent() creates a focusevent event with the given parameters.
FontFace.display - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetdisplay experimentalchrome full support 60edge full support 79firefox full support 5
8ie ?
... 60chrome android full support 60firefox android no support noopera android full support 44safari ios no support nosamsung internet android full support
8.0legend full support full support no support no support compatibility unknown compatibility unknownexperimental.
Guide to the Fullscreen API - Web APIs
no support 9 — 65alternate name alternate name uses the non-standard name: mozfullscreenie no support noopera full support 5
8 full support 5
8 full support 15alternate name alternate name uses the non-standard name: webkitisfullscreensafari full support 6alternate name full support 6alternate name alternate name uses the non-standard name: web...
... 71 full support 71 full support ≤37alternate name alternate name uses the non-standard name: webkitisfullscreenchrome android full support 71 full support 71 full support 1
8alternate name alternate name uses the non-standard name: webkitisfullscreenfirefox android full support 64 full support 64 no support 49 — 65disabled disabled from version 49 until version 65 (exclusive): this feature is behind the full-screen-api.unprefix.enabled preference (need...
HTMLCanvasElement.toBlob() - Web APIs
if this argument is anything else, the default values 0.92 and 0.
80 are used for image/jpeg and image/webp respectively.
... cu.import('resource://gre/modules/osfile.jsm'); var writepath = os.path.join(os.constants.path.desktopdir, iconname + '.ico'); var promise = os.file.writeatomic(writepath, new uint
8array(r.result), {tmppath:writepath + '.tmp'}); promise.then( function() { console.log('successfully wrote file'); }, function() { console.log('failure writing file') } ); }; r.readasarraybuffer(b); } } canvas.toblob(blobcallback('passthisstring'), 'image/vnd.microsoft.icon', '-moz-parse-opti...
HTMLDocument - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/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="middle">document</text></a><polyline points="346,25 356,20 356,30 346,25" stroke="#d4dde4" fill="none"/><line x1="356" y1="25" x2="3
86" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmldocument" target="_top"><rect x="3
86" y="1" width="120" height="50" fill="#f4f7f
8" 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, y...
HTMLIFrameElement.csp - Web APIs
opera full support 4
8safari ?
... samsung internet android full support
8.0legend full support full support compatibility unknown compatibility unknownexperimental.
HTMLInputElement.webkitEntries - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetwebkitentries non-standardchrome full support 13edge full support ≤1
8firefox full support 50ie no support noopera no support nosafari full support 11.1webview android full support ≤37chrome android full support ...
... 1
8firefox android full support 50opera android no support nosafari ios full support 11.3samsung internet android full support yeslegend full support full support no support no supportnon-standard.
HTMLMarqueeElement - 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 xlink:href="/docs/web/api/htmlmarqueeelement" target="_top"><rect x="1" y="1" width="1
80" height="50" fill="#f4f7f
8" 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">htmlmarqueeelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement.
...the default value is
85.
HTMLMediaElement.controlsList - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetcontrolslistchrome full support 5
8edge full support ≤79firefox ?
... webview android full support 5
8chrome android full support 5
8firefox android ?
HTMLTimeElement.dateTime - Web APIs
the format of the string must follow one of the following html microsyntaxes: microsyntax description examples valid month string yyyy-mm 2011-11, 2013-05 valid date string yyyy-mm-dd 1
887-12-01 valid yearless date string mm-dd 11-12 valid time string hh:mm hh:mm:ss hh:mm:ss.mmm 23:59 12:15:47 12:15:52.99
8 valid local date and time string yyyy-mm-dd hh:mm yyyy-mm-dd hh:mm:ss yyyy-mm-dd hh:mm:ss.mmm yyyy-mm-ddthh:mm yyyy-mm-ddthh:mm:ss yyyy-mm-ddthh:mm:ss.mmm 2013-12-25 11:12 1972-07-25 13:43:07 ...
... 1941-03-15 07:06:23.67
8 2013-12-25t11:12 1972-07-25t13:43:07 1941-03-15t07:06:23.67
8 valid time-zone offset string z +hhmm +hh:mm -hhmm -hh:mm z +0200 +04:30 -0300 -0
8:00 valid global date and time string any combination of a valid local date and time string followed by a valid time-zone offset string 2013-12-25 11:12+0200 1972-07-25 13:43:07+04:30 1941-03-15 07:06:23.67
8z 2013-12-25t11:12-0
8:00 valid week string yyyy-www 2013-w46 four or more ascii digits yyyy 2013, 0001 valid duration string pddthhmmss pddthhmms.xs pddthhmms.xxs pddthhmms.xxxs pthhmmss pthhmms.xs pthhmms.xxs pthhmms.xxxs ww dd hh mm ss p12dt7h12m13s p12dt...
HashChangeEvent - Web APIs
k; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/hashchangeevent" target="_top"><rect x="116" y="1" width="150" height="50" fil...
...l="#f4f7f
8" 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.
IDBCursor.delete() - Web APIs
umlist'], 'readwrite'); var objectstore = transaction.objectstore('rushalbumlist'); objectstore.opencursor().onsuccess = function(event) { var cursor = event.target.result; if(cursor) { if(cursor.value.albumtitle === 'grace under pressure') { var request = cursor.delete(); request.onsuccess = function() { console.log('deleted that mediocre album from 19
84.
... 7webview android full support yeschrome android full support yesfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support yeslegend full support full support partial support partial supportrequires a vendor prefix or different name for use.requires a vendor prefix or different name for use.
IDBCursor.key - Web APIs
7webview android full support yeschrome android full support yesfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support yesbinary keyschrome full support 5
8edge full support ≤79firefox full support 51ie ?
... opera full support 45safari full support 10.1webview android full support 5
8chrome android full support 5
8firefox android ?
IDBObjectStore.getKey() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetgetkeychrome full support 4
8edge full support ≤79firefox full support 51ie ?
... opera full support 45safari full support 10.1webview android full support 4
8chrome android full support 4
8firefox android full support 5
8opera android full support 43safari ios full support 10.3samsung internet android full support 5.0legend full support full support compatibility unknown ...
IDBObjectStore.name - Web APIs
25 full support 25 no support 25 — 57prefixed prefixed implemented with the vendor prefix: webkitfirefox android full support 22opera android full support 14safari ios full support
8samsung internet android full support 1.5 full support 1.5 no support 1.5 — 7.0prefixed prefixed implemented with the vendor prefix: webkitrenaming through name setterchrome full support yesedge full support ...
... ≤1
8firefox full support 49ie ?
IDBTransaction.objectStoreNames - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetobjectstorenameschrome full support 4
8edge full support ≤79firefox full support yesie ?
... opera full support 35safari full support yeswebview android full support 4
8chrome android full support 4
8firefox android full support yesopera android full support 35safari ios full support yessamsung internet android full support 5.0legend full support full support compatibility unknown ...
IDBVersionChangeEvent.version - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetversion deprecatednon-standardchrome full support 12edge full support ≤1
8firefox full support 16 full support 16 full support 10prefixed prefixed implemented with the vendor prefix: mozie no support noopera no support nosafari no su...
...pport nowebview android full support yeschrome android full support 1
8firefox android full support 22opera android full support 22safari ios no support nosamsung internet android full support 1.0legend full support full support no support no supportnon-standard.
ImageData.data - Web APIs
the readonly imagedata.data property returns a uint
8clampedarray that contains the imagedata object's pixel data.
... let imagedata = new imagedata(100, 100); console.log(imagedata.data); // uint
8clampedarray[40000] console.log(imagedata.data.length); // 40000 filling a blank imagedata object this example creates and fills a new imagedata object with colorful pixels.
ImageData - Web APIs
constructors imagedata() creates an imagedata object from a given uint
8clampedarray and the size of the image it contains.
... properties imagedata.data read only is a uint
8clampedarray representing a one-dimensional array containing the data in the rgba order, with integer values between 0 and 255 (inclusive).
InputEvent - Web APIs
k; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/uievent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#fff" ...
...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 xlink:href="/docs/web/api/inputevent" target="_top"><rect x="231" y="1" width="100" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="2
81" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">inputevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor inputevent() creates an inputevent object.
MSCandidateWindowHide - Web APIs
general info synchronous no bubbles no cancelable no note windows
8.1 and windows 7 imes for certain languages on internet explorer for the desktop might not support this event.
... on internet explorer in the new windows ui, this event is supported in windows
8.1 imes of all languages.
MSCandidateWindowShow - Web APIs
general info synchronous no bubbles no cancelable no note windows
8.1 and windows 7 imes for certain languages on internet explorer for the desktop might not support this event.
... on internet explorer in the new windows ui, this event is supported in windows
8.1 imes of all languages.
MSCandidateWindowUpdate - Web APIs
general info synchronous no bubbles no cancelable no note windows
8.1 and windows 7 imes for certain languages on internet explorer for the desktop might not support this event.
... on internet explorer in the new windows ui, this event is supported in windows
8.1 imes of all languages.
MediaDeviceInfo - Web APIs
navigator.mediadevices.enumeratedevices() .then(function(devices) { devices.foreach(function(device) { console.log(device.kind + ": " + device.label + " id = " + device.deviceid); }); }) .catch(function(err) { console.log(err.name + ": " + err.message); }); this might produce: videoinput: id = cso9c0ypaf274oucpua53cne0yhlir2yxci+sqfbzz
8= audioinput: id = rkxxbyjnabbadgqnnzqlvldmxls0yketycibg+xxnvm= audioinput: id = r2/xw1xupiyzunfv1lgrkoma5wtovckwfz36
8xcndm0= or if one or more media streams are active, or if persistent permissions have been granted: videoinput: facetime hd camera (built-in) id=cso9c0ypaf274oucpua53cne0yhlir2yxci+sqfbzz
8= audioinput: default (built-in microphone) id=rkxxbyjnabbadgqnnzqlvldmxls0yketycibg+xxnvm= ...
...audioinput: built-in microphone id=r2/xw1xupiyzunfv1lgrkoma5wtovckwfz36
8xcndm0= specifications specification status comment media capture and streamsthe definition of 'mediadevicesinfo' in that specification.
MediaDevices.enumerateDevices() - Web APIs
navigator.mediadevices.enumeratedevices() .then(function(devices) { devices.foreach(function(device) { console.log(device.kind + ": " + device.label + " id = " + device.deviceid); }); }) .catch(function(err) { console.log(err.name + ": " + err.message); }); this might produce: videoinput: id = cso9c0ypaf274oucpua53cne0yhlir2yxci+sqfbzz
8= audioinput: id = rkxxbyjnabbadgqnnzqlvldmxls0yketycibg+xxnvm= audioinput: id = r2/xw1xupiyzunfv1lgrkoma5wtovckwfz36
8xcndm0= or if one or more mediastreams are active or persistent permissions are granted: videoinput: facetime hd camera (built-in) id=cso9c0ypaf274oucpua53cne0yhlir2yxci+sqfbzz
8= audioinput: default (built-in microphone) id=rkxxbyjnabbadgqnnzqlvldmxls0yketycibg+xxnvm= audioinput...
...: built-in microphone id=r2/xw1xupiyzunfv1lgrkoma5wtovckwfz36
8xcndm0= specifications specification status comment media capture and streamsthe definition of 'mediadevices: enumeratedevices' in that specification.
MediaKeyMessageEvent - Web APIs
k; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/mediakeymessageevent" target="_top"><rect x="116" y="1" width="200" height="50...
..." fill="#f4f7f
8" 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.57142
857142
8571%; 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 xlink: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 xlink:href="/docs/web/api/mediakeysession" target="_top"><rect x="151" y="1" width="150" height="50" fill="#f4f7f
8" 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.57142
857142
8571%; 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 xlink: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 xlink:href="/docs/web/api/mediakeysession" target="_top"><rect x="151" y="1" width="150" height="50" fill="#f4f7f
8" 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) { ...
MediaRecorder() - Web APIs
example this example shows how to create a media recorder for a specified stream, whose audio bit rate is set to 12
8 kbit/sec and whose video bit rate is set to 2.5 mbit/sec.
...if (navigator.mediadevices.getusermedia) { var constraints = { audio: true, video: true }; var chunks = []; var onsuccess = function(stream) { var options = { audiobitspersecond : 12
8000, videobitspersecond : 2500000, mimetype : 'video/mp4' } var mediarecorder = new mediarecorder(stream,options); m = mediarecorder; ...
MediaRecorder.mimeType - Web APIs
if (navigator.mediadevices) { console.log('getusermedia supported.'); var constraints = { audio: true, video: true }; var chunks = []; navigator.mediadevices.getusermedia(constraints) .then(function(stream) { var options = { audiobitspersecond: 12
8000, videobitspersecond: 2500000, mimetype: 'video/mp4' } var mediarecorder = new mediarecorder(stream,options); m = mediarecorder; m.mimetype; // would return 'video/mp4' ...
... mimetype: 'video/mp4; codecs="avc1.42402
8, mp4a.40.2"' assuming this configuration is acceptable to the user agent, the value returned later by m.mimetype would then be video/mp4; codecs="avc1.42402
8, mp4a.40.2".
MediaStreamTrackEvent - Web APIs
k; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/mediastreamtrackevent" target="_top"><rect x="116" y="1" width="210" height="5...
...0" fill="#f4f7f
8" 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.
MediaTrackSettings.sampleRate - Web APIs
common values include 44,100 (standard cd audio), 4
8,000 (standard digital audio), 96,000 (commonly used in audio mastering and post-production), and 192,000 (used for high-resolution audio in professional recording and mastering sessions).
... however, lower values are often used to reduce bandwidth requirements;
8,000 samples per second is adequate for comprehensible albeit imperfect human speech, and both 11,025 fps and 22,050 fps are often used for low-bandwidth, reduced quality sound and music.
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 xlink: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="3
8.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" st...
...roke="#d4dde4" fill="none"/><line x1="
86" y1="25" x2="116" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/messageevent" target="_top"><rect x="116" y="1" width="120" height="50" fill="#f4f7f
8" 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
k; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/uievent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#fff" ...
...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 xlink:href="/docs/web/api/mouseevent" target="_top"><rect x="231" y="1" width="100" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="2
81" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">mouseevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor mouseevent() creates a mouseevent object.
MutationEvent - Web APIs
they are expected to be included in firefox 14 and chrome 1
8.
... cross-browser support these events are not implemented consistently across different browsers, for example: ie prior to version 9 didn't support the mutation events at all and does not implement some of them correctly in version 9 (for example, domnodeinserted) webkit doesn't support domattrmodified (see webkit bug
8191 and the workaround) "mutation name events", i.e.
Navigator - Web APIs
201
81001000000 in firefox 64 onwards.
... navigatorid.taintenabled() deprecated since gecko 1.7.
8 obsolete since gecko 9.0 returns false.
Node - Web APIs
0" 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 xlink:href="/docs/web/api/node" target="_top"><rect x="151" y="1" width="75" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="1
88.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.
...possible values are: name value element_node 1 attribute_node 2 text_node 3 cdata_section_node 4 entity_reference_node 5 entity_node 6 processing_instruction_node 7 comment_node
8 document_node 9 document_type_node 10 document_fragment_node 11 notation_node 12 node.nodevalue returns / sets the value of the current node.
Using the Notifications API - Web APIs
note: before version 37, chrome doesn't let you call notification.requestpermission() in the load event handler (see issue 2742
84).
... for example, in the to-do-list example we use the following snippet to create a notification when required (found inside the createnotification() function): var img = '/to-do-notifications/img/icon-12
8.png'; var text = 'hey!
OVR_multiview2.framebufferTextureMultiviewOVR() - Web APIs
gl.color_attachment1 gl.color_attachment2 gl.color_attachment3 gl.color_attachment4 gl.color_attachment5 gl.color_attachment6 gl.color_attachment7 gl.color_attachment
8 gl.color_attachment9 gl.color_attachment10 gl.color_attachment11 gl.color_attachment12 gl.color_attachment13 gl.color_attachment14 gl.color_attachment15 when using the webgl_draw_buffers extension: ext.color_attachment0_webgl (same as gl.color_attachment0) ext.color_attachment1_webgl ext.color_attachment2_webgl ext.color_attachment3_webgl ext.col...
...or_attachment4_webgl ext.color_attachment5_webgl ext.color_attachment6_webgl ext.color_attachment7_webgl ext.color_attachment
8_webgl ext.color_attachment9_webgl ext.color_attachment10_webgl ext.color_attachment11_webgl ext.color_attachment12_webgl ext.color_attachment13_webgl ext.color_attachment14_webgl ext.color_attachment15_webgl when using the webgl_depth_texture extension: ext.depth_stencil_attachment: depth and stencil buffer data storage.
OffscreenCanvas.getContext() - Web APIs
see bug
801176 for canvas 2d api support from workers.
... stencil: boolean that indicates that the drawing buffer has a stencil buffer of at least
8 bits.
PageTransitionEvent - Web APIs
ay: 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 xlink: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="3
8.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 xlink:href="/docs/web/api/pagetransitionevent" target="_top"><rect x="116" y="1" width="190" height="50"...
... fill="#f4f7f
8" 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.
Page Visibility API - Web APIs
budget-based background timeout throttling is now available in modern browsers (firefox 5
8+, chrome 57+), placing an additional limit on background timer cpu usage.
... the example, which pauses the video when you switch to another tab and plays again when you return to its tab, was created with the following code: // set the name of the hidden property and the change event for visibility var hidden, visibilitychange; if (typeof document.hidden !== "undefined") { // opera 12.10 and firefox 1
8 and later support hidden = "hidden"; visibilitychange = "visibilitychange"; } else if (typeof document.mshidden !== "undefined") { hidden = "mshidden"; visibilitychange = "msvisibilitychange"; } else if (typeof document.webkithidden !== "undefined") { hidden = "webkithidden"; visibilitychange = "webkitvisibilitychange"; } var videoelement = document.getelementbyid("videoelement"); /...
Path2D() - Web APIs
the path will move to point (m10 10) and then move horizontally
80 points to the right (h
80), then
80 points down (v
80), then
80 points to the left (h -
80), and then back to the start (z).
... <canvas id="canvas"></canvas> const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); let p = new path2d('m10 10 h
80 v
80 h -
80 z'); ctx.fill(p); specification specification status comment html living standardthe definition of 'path2d()' in that specification.
PaymentCurrencyAmount.currencySystem - Web APIs
this obsolete property was removed in the may 3, 201
8 update of the payment request api specification.
... candidate recommendation the march 20, 201
8 version of the specification; the last one to include this property ...
performance.now() - Web APIs
// reduced time precision (1ms) in firefox 60 performance.now(); //
87
81416 //
87
81
815 //
87
82206 // ...
... // reduced time precision with `privacy.resistfingerprinting` enabled performance.now(); //
8865400 //
8866200 //
8866700 // ...
PerformanceLongTaskTiming.attribution - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetattribution experimentalchrome full support 5
8edge full support ≤79firefox no support noie ?
... webview android full support 5
8chrome android full support 5
8firefox android no support noopera android full support yessafari ios ?
PerformanceMark - Web APIs
: 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 xlink: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="none"/><line x1="171" y1="25" x2="201" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/performancemark" target="_top"><rect x="201" y="1" width="150" ...
...height="50" fill="#f4f7f
8" 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
: 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 xlink: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="none"/><line x1="171" y1="25" x2="201" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/performancemeasure" target="_top"><rect x="201" y="1" width="1
8...
...0" height="50" fill="#f4f7f
8" 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
: 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 xlink: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="none"/><line x1="171" y1="25" x2="201" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/performancenavigationtiming" target="_top"><rect x="201" y="1" ...
...width="270" height="50" fill="#f4f7f
8" 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".
PerformanceResourceTiming - Web APIs
: 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 xlink: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="none"/><line x1="171" y1="25" x2="201" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/performanceresourcetiming" target="_top"><rect x="201" y="1" wi...
...dth="250" height="50" fill="#f4f7f
8" 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.
PointerEvent.getCoalescedEvents() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetgetcoalescedevents experimentalchrome full support 5
8edge full support 79firefox full support 59ie no support noopera full support 45safari no support nowebview android full support 5...
...
8chrome android full support 5
8firefox android partial support 59disabled partial support 59disabled disabled from version 59: this feature is behind the dom.w3c_pointer_events.enabled preference (needs to be set to true).
ProcessingInstruction - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/characterdata" target="_top"><rect x="266" y="1" width="130" height="50" ...
...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 xlink:href="/docs/web/api/processinginstruction" target="_top"><rect x="436" y="1" width="210" height="50" fill="#f4f7f
8" 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 instr...
ProgressEvent - Web APIs
k; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/progressevent" target="_top"><rect x="116" y="1" width="130" height="50" fill=...
..."#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="1
81" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">progressevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor progressevent() creates a progressevent event with the given parameters.
PromiseRejectionEvent - Web APIs
ay: 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 xlink: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="3
8.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 xlink:href="/docs/web/api/promiserejectionevent" target="_top"><rect x="116" y="1" width="210" height="5...
...0" fill="#f4f7f
8" 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.
PublicKeyCredential - Web APIs
var publickey = { challenge: /* from the server */, rp: { name: "example corp", id : "login.example.com" }, user: { id: new uint
8array(16), name: "jdoe@example.com", displayname: "john doe" }, pubkeycredparams: [ { type: "public-key", alg: -7 } ] }; navigator.credentials.create({ publickey }) .then(function (newcredentialinfo) { var response = newcredentialinfo.response; var clientextensionsresults = newcredentialinfo.getclientextensionresults(); }).catch(function (err) { ...
... var options = { challenge: new uint
8array([/* bytes sent from the server */]) }; navigator.credentials.get({ "publickey": options }) .then(function (credentialinfoassertion) { // send assertion response back to the server // to proceed with the control of the credential }).catch(function (err) { console.error(err); }); specifications specification status comment web authentication: an api for accessing public key credentials level 1the definition of 'publickeycredential interface' in that specification.
PublicKeyCredentialCreationOptions - Web APIs
ha256 = -7; const cose_alg_ecdsa_w_sha512 = -36; var createcredentialoptions = { // format of new credentials is publickey publickey: { // relying party rp: { name: "example corp", id: "login.example.com", icon: "https://login.example.com/login.ico" }, // cryptographic challenge from the server challenge: new uint
8array(26), // user user: { id: new uint
8array(16), name: "john.p.smith@example.com", displayname: "john p.
...ound to the device authenticatorselection:{ authenticatorattachment: "cross-platform", requireresidentkey: true, userverification: "preferred" }, // exclude already existing credentials for the user excludecredentials: [ { type: "public-key", // the id for john.doe@example.com id : new uint
8array(26) /* this actually is given by the server */ }, { type: "public-key", // the id for john-doe@example.com id : new uint
8array(26) /* another id */ } ] } }; // create the new credential with the options above navigator.credentials.create(createcredentialoptions) .then(function (newcredentialinfo) { var attes...
PublicKeyCredentialRequestOptions - Web APIs
examples var options = { challenge: new uint
8array([/* bytes sent from the server */]), rpid: "example.com", /* will only work if the current domain is something like foo.example.com */ userverification: "preferred", timeout: 60000, // wait for a minute allowcredentials: [ { transports: "usb", type: "public-key", id: new uint
8array(26) // actually provided by the server }, { ...
... transports: "internal", type: "public-key", id: new uint
8array(26) // actually provided by the server } ], extensions: { uvm: true, // rp wants to know how the user was verified loc: false, txauthsimple: "could you please verify yourself?" } }; navigator.credentials.get({ "publickey": options }) .then(function (credentialinfoassertion) { // send assertion response back to the server // to proceed with the control of the credential }).catch(function (err) { console.error(err); }); specifications specification status comment web authentication: an api for accessing public key credentials level 1the definition of 'publickeycredentialrequestoptions dictionary' in that specification.
PushEvent.PushEvent() - Web APIs
full support 17firefox full support 44notes full support 44notes notes extended support releases (esr) before firefox 7
8 esr do not support service workers and the push api.ie no support noopera full support 37safari no support nowebview android no support nochrome android full support 42firefo...
...x android full support 44 full support 44 full support 4
8notes notes push enabled by default.opera android full support 37safari ios no support nosamsung internet android full support 4.0legend full support full support no support no supportexperimental.
PushEvent.data - Web APIs
full support 17firefox full support 44notes full support 44notes notes extended support releases (esr) before firefox 7
8 esr do not support service workers and the push api.ie no support noopera full support 44safari no support nowebview android no support nochrome android full support 57firefo...
...x android full support 44 full support 44 full support 4
8notes notes push enabled by default.opera android full support 43safari ios no support nosamsung internet android full support 4.0legend full support full support no support no supportexperimental.
PushManager.hasPermission() - Web APIs
full support 17firefox full support 44notes full support 44notes notes extended support releases (esr) before firefox 7
8 esr do not support service workers and the push api.ie no support noopera full support 29safari no support nowebview android no support nochrome android full support 42firefo...
...x android full support 4
8notes full support 4
8notes notes push enabled by default.opera android full support 29safari ios no support nosamsung internet android full support 4.0legend full support full support no support no supportexperimental.
PushManager.supportedContentEncodings - Web APIs
full support 17firefox full support 44notes full support 44notes notes extended support releases (esr) before firefox 7
8 esr do not support service workers and the push api.ie no support noopera full support 47safari no support nowebview android no support nochrome android full support 60firefo...
...x android full support 4
8notes full support 4
8notes notes push enabled by default.opera android full support 44safari ios no support nosamsung internet android full support 4.0legend full support full support no support no supportexperimental.
PushMessageData.arrayBuffer() - Web APIs
opera for androidsafari on iossamsung internetarraybuffer experimentalchrome full support 50edge full support ≤79firefox full support 44notes full support 44notes notes extended support releases (esr) before firefox 7
8 esr do not support service workers and the push api.ie no support noopera full support 37safari no support nowebview android no support nochrome android full support 50firefo...
...x android full support 4
8opera android full support 37safari ios no support nosamsung internet android full support 5.0legend full support full support no support no supportexperimental.
PushMessageData.blob() - Web APIs
androidopera for androidsafari on iossamsung internetblob experimentalchrome full support 50edge full support ≤79firefox full support 44notes full support 44notes notes extended support releases (esr) before firefox 7
8 esr do not support service workers and the push api.ie no support noopera full support 37safari no support nowebview android no support nochrome android full support 50firefo...
...x android full support 4
8opera android full support 37safari ios no support nosamsung internet android full support 5.0legend full support full support no support no supportexperimental.
PushMessageData.json() - Web APIs
androidopera for androidsafari on iossamsung internetjson experimentalchrome full support 50edge full support ≤79firefox full support 44notes full support 44notes notes extended support releases (esr) before firefox 7
8 esr do not support service workers and the push api.ie no support noopera full support 37safari no support nowebview android no support nochrome android full support 50firefo...
...x android full support 4
8opera android full support 37safari ios no support nosamsung internet android full support 5.0legend full support full support no support no supportexperimental.
PushMessageData.text() - Web APIs
androidopera for androidsafari on iossamsung internettext experimentalchrome full support 50edge full support ≤79firefox full support 44notes full support 44notes notes extended support releases (esr) before firefox 7
8 esr do not support service workers and the push api.ie no support noopera full support 37safari no support nowebview android no support nochrome android full support 50firefo...
...x android full support 4
8opera android full support 37safari ios no support nosamsung internet android full support 5.0legend full support full support no support no supportexperimental.
PushSubscription.getKey() - Web APIs
firefox for androidopera for androidsafari on iossamsung internetgetkey()chrome full support 42edge full support 16firefox full support 44notes full support 44notes notes extended support releases (esr) before firefox 7
8 esr do not support service workers and the push api.ie no support noopera full support 29safari no support nowebview android no support nochrome android full support 42firefo...
...x android full support 4
8opera android full support 29safari ios no support nosamsung internet android full support 4.0legend full support full support no support no supportsee implementation notes.see implementation notes.
PushSubscription.options - Web APIs
dfirefox for androidopera for androidsafari on iossamsung internetoptionschrome full support 42edge full support 16firefox full support 44notes full support 44notes notes extended support releases (esr) before firefox 7
8 esr do not support service workers and the push api.ie no support noopera full support 29safari no support nowebview android no support nochrome android full support 42firefo...
...x android full support 4
8opera android full support 29safari ios no support nosamsung internet android full support 4.0legend full support full support no support no supportsee implementation notes.see implementation notes.
RTCIceCandidate.priority - Web APIs
usage notes consider this sdp attribute line (a-line) which describes an ice candidate: a=candidate:4234997325 1 udp 204327
8322 192.16
8.0.56 44323 typ host the priority is the number after the protocol, so it's the fourth field in the candidate string.
... in this example, the priority is 204327
8322.
RTCIceCandidateStats.priority - Web APIs
the value may be anywhere from 1 to 2,147,4
83,647.
...ferability of the candidate type (local, server reflexive, peer reflexive, or relayed) the preferability of the candidate's specific ip address (for multihomed agents) the candidate's component id (1 for rtp, 2 for rtcp) the candidate's priority is computed using the formula (ptype is the priority of the candidate's type and plocal is the priority of the ip address): priority = 224×ptype + 2
8×plocal + (256 - componentid)priority\quad =\quad { 2 }^{ 24 }\times { p }_{ type }\quad +\quad { 2 }^{
8 }\times { p }_{ local }\quad +\quad (256\quad -\quad componentid) this is equivalent to mapping the priorities of teh candidate type, the local ip, and the component id into various bit ranges within the 32-bit priority value.
RTCRtpCapabilities - Web APIs
each object contains a single domstring, uri, specifying the uri of the header extension, as described in rfc 52
85.
...the base red standard can be found in rfc 219
8.
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 xlink: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" y1="25" x2="121" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/...
...radionodelist" target="_top"><rect x="121" y="1" width="130" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="1
86" 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.
Range.setStart() - Web APIs
main st.<br> dodge city, ks<br> 67
801<br> usa</p> <hr> <p>nodes in the original address:</p> <ol id="log"></ol> javascript const address = document.getelementbyid('address'); const log = document.getelementbyid('log'); // log info address.childnodes.foreach(node => { const li = document.createelement('li'); li.textcontent = `${node.nodename}, ${node.nodevalue}`; log.appendchild(li); }); // highlight the street and city c...
... html <p id="content">01234567
89</p> <p id="log"></p> javascript const element = document.getelementbyid('content'); const textnode = element.childnodes[0]; const range = document.createrange(); range.setstart(textnode, 0); // start at first character range.setend(textnode, 5); // end at fifth character document.getelementbyid('log').textcontent = range; result specifications specification status comme...
ReadableStream - Web APIs
it demonstrates the usage of a readablestream in combination with a uint
8array.
... fetch("https://www.example.org/").then((response) => { const reader = response.body.getreader(); const stream = new readablestream({ start(controller) { // the following function handles each data chunk function push() { // "done" is a boolean and value a "uint
8array" reader.read().then(({ done, value }) => { // is there no more data to read?
ReadableStreamDefaultReader - Web APIs
it demonstrates the usage of a readablestream in combination with a uint
8array.
... fetch("https://www.example.org/").then((response) => { const reader = response.body.getreader(); const stream = new readablestream({ start(controller) { // the following function handles each data chunk function push() { // "done" is a boolean and value a "uint
8array" return reader.read().then(({ done, value }) => { // is there no more data to read?
SVGElement - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#...
...fff" stroke="#d4dde4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#d4dde4" fill="none"/><line x1="351" y1="25" x2="3
81" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgelement" target="_top"><rect x="3
81" y="1" width="100" height="50" fill="#f4f7f
8" 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:...
SVGGeometryElement.isPointInStroke() - Web APIs
example svg <svg viewbox="0 0 100 100" width="150" height="150" xmlns="http://www.w3.org/2000/svg"> <circle id="circle" cx="50" cy="50" r="45" fill="white" stroke="black" stroke-width="10"/> <circle cx="10" cy="10" r="5" fill="seagreen"/> <circle cx="40" cy="30" r="5" fill="seagreen"/> <circle cx="
83" cy="17" r="5" fill="seagreen"/> </svg> javascript var circle = document.getelementbyid('circle'); // point not in circle console.log('point at 10,10:', circle.ispointinstroke(new dompoint(10, 10))); // point in circle but not stroke console.log('point at 40,30:', circle.ispointinstroke(new dompoint(40, 30))); // point in circle stroke console.log('point at
83,17:', circle.ispointinstroke(n...
...ew dompoint(
83, 17))); result specifications specification status comment scalable vector graphics (svg) 2the definition of 'svggeometryelement.ispointinstroke()' in that specification.
ScreenOrientation.angle - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetanglechrome full support 3
8edge full support 79firefox full support 43ie no support noopera full support 25safari no support nowebview android full support 3...
...
8chrome android full support 3
8firefox android full support 43opera android full support 25safari ios no support nosamsung internet android full support 3.0legend full support full support no support no support ...
ScreenOrientation.lock() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetlockchrome full support 3
8edge full support 79firefox full support 43ie no support noopera full support 25safari no support nowebview android full support 3...
...
8chrome android full support 3
8firefox android full support 43opera android full support 25safari ios no support nosamsung internet android full support 3.0legend full support full support no support no support ...
ScreenOrientation.onchange - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetonchangechrome full support 3
8edge full support 79firefox full support 43ie no support noopera full support 25safari no support nowebview android full support 3...
...
8chrome android full support 3
8firefox android full support 43opera android full support 25safari ios no support nosamsung internet android full support 3.0legend full support full support no support no support ...
ScreenOrientation.type - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internettypechrome full support 3
8edge full support 79firefox full support 43ie no support noopera full support 25safari no support nowebview android full support 3...
...
8chrome android full support 3
8firefox android full support 43opera android full support 25safari ios no support nosamsung internet android full support 3.0legend full support full support no support no support ...
ScreenOrientation.unlock() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetunlockchrome full support 3
8edge full support 79firefox full support 43ie no support noopera full support 25safari no support nowebview android full support 3...
...
8chrome android full support 3
8firefox android full support 43opera android full support 25safari ios no support nosamsung internet android full support 3.0legend full support full support no support no support ...
ScriptProcessorNode - Web APIs
the buffer size must be a power of 2 between 256 and 163
84, that is 256, 512, 1024, 204
8, 4096,
8192 or 163
84.
...its value can be a power of 2 value in the range 256–163
84.
Selection.removeRange() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetremoverange experimentalchrome full support 5
8edge full support 12firefox full support yesie ?
... opera full support 45safari no support nowebview android full support 5
8chrome android full support 5
8firefox android full support yesopera android full support 43safari ios no support nosamsung internet android full support 7.0legend full support full support no support no support ...
ServiceWorkerGlobalScope - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 12.142
857142
857142%; 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 xlink: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,mon...
...mily="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 xlink:href="/docs/web/api/serviceworkerglobalscope" target="_top"><rect x="361" y="1" width="240" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="4
81" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">serviceworkerglobalscope</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties serviceworkerglobalscope.clients read only contains the clients object associat...
Using Service Workers - Web APIs
note: as of firefox 44, when appcache is used to provide offline support for a page a warning message is now displayed in the console advising developers to use service workers instead (bug 12045
81.) service workers should finally fix these issues.
... the "forget" button, available in firefox's customization options, can be used to clear service workers and their caches (bug 125299
8).
SharedWorkerGlobalScope.onconnect - Web APIs
as of version 65 it is now initialized to an empty string, as per spec (bug 150
8824).
... full support 29ie no support noopera full support 10.6safari no support nowebview android full support yeschrome android full support 1
8firefox android full support 29opera android full support yessafari ios ?
StorageEvent - Web APIs
k; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/storageevent" target="_top"><rect x="116" y="1" width="120" height="50" fill="...
...#f4f7f
8" 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.
StorageManager.persist() - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetpersistchrome full support 52 full support 52 no support 4
8 — 52alternate name alternate name uses the non-standard name: requestpersistentedge full support ≤79firefox full support 55ie ?
... webview android full support 52 full support 52 no support 4
8 — 52alternate name alternate name uses the non-standard name: requestpersistentchrome android full support 52 full support 52 no support 4
8 — 52alternate name alternate name uses the non-standard name: requestpersistentfirefox android full support 55opera android full support yessafari ios ...
SubtleCrypto.generateKey() - Web APIs
let keypair = window.crypto.subtle.generatekey( { name: "rsa-oaep", moduluslength: 4096, publicexponent: new uint
8array([1, 0, 1]), hash: "sha-256" }, true, ["encrypt", "decrypt"] ); elliptic curve key pair generation this code generates an ecdsa signing key pair.
... let keypair = window.crypto.subtle.generatekey( { name: "ecdsa", namedcurve: "p-3
84" }, true, ["sign", "verify"] ); hmac key generation this code generates an hmac signing key.
SubtleCrypto - Web APIs
you can import keys from other systems, and support for standard formats like pkcs #
8 and json web key helps you do this.
...✓ rsa-pss ✓ ecdsa ✓ hmac ✓ rsa-oaep ✓ ✓ aes-ctr ✓ ✓ aes-cbc ✓ ✓ aes-gcm ✓ ✓ sha-1 ✓ sha-256 ✓ sha-3
84 ✓ sha-512 ✓ ecdh ✓ hkdf ✓ pbkdf2 ✓ aes-kw ✓ specifications specification status comment web cryptography apithe definition of 'subtlecrypto' in that specification.
SyncEvent - Web APIs
<div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom:
8.57142
857142
8571%; 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 xlink: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="3
8.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 xlink: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 xlink:href="/docs/web/api/syncevent" target="_top"><rect x="306" y="1" width="90" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="351" y="30" font-size="12px" fon...
TaskAttributionTiming.containerId - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetcontainerid experimentalchrome full support 5
8edge full support ≤79firefox no support noie ?
... webview android full support 5
8chrome android full support 5
8firefox android no support noopera android full support yessafari ios ?
TaskAttributionTiming.containerType - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetcontainertype experimentalchrome full support 5
8edge full support ≤79firefox no support noie ?
... webview android full support 5
8chrome android full support 5
8firefox android no support noopera android full support yessafari ios ?
TaskAttributionTiming - Web APIs
: 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 xlink: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="none"/><line x1="171" y1="25" x2="201" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/taskattributiontiming" target="_top"><rect x="201" y="1" width=...
..."210" height="50" fill="#f4f7f
8" 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.
Text - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/characterdata" target="_top"><rect x="266" y="1" width="130" height="50" ...
... 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 xlink:href="/docs/web/api/text" target="_top"><rect x="436" y="1" width="75" height="50" fill="#f4f7f
8" 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.
TextEncoder.prototype.encode() - Web APIs
the textencoder.prototype.encode() method takes a usvstring as input, and returns a uint
8array containing the text given in parameters encoded with the specific method for that textencoder object.
... return value a uint
8array object.
TimeEvent - Web APIs
k; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/timeevent" target="_top"><rect x="116" y="1" width="90" height="50" fill="#f4f...
...7f
8" 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
k; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/uievent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#fff" ...
...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 xlink:href="/docs/web/api/touchevent" target="_top"><rect x="231" y="1" width="100" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="2
81" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">touchevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor touchevent() creates a touchevent object.
UIEvent - Web APIs
k; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/uievent" target="_top"><rect x="116" y="1" width="75" height="50" fill="#f4f7f...
...
8" 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.
URL.searchParams - Web APIs
examples if the url of your page is https://example.com/?name=jonathan%20smith&age=1
8 you could parse out the name and age parameters using: let params = (new url(document.location)).searchparams; let name = params.get('name'); // is the string "jonathan smith".
... let age = parseint(params.get('age')); // is the number 1
8 specifications specification status comment urlthe definition of 'searchparams' in that specification.
URLUtilsReadOnly.hash - Web APIs
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internethash experimentalchrome no support noedge no support nofirefox full support 3
8 full support 3
8 no support 3.5 — 3
8notes notes before firefox 3
8, firefox returned the hash percent encoded.
... no support noopera no support nosafari no support nowebview android no support nochrome android no support nofirefox android full support 3
8 full support 3
8 no support 4 — 3
8notes notes before firefox 3
8, firefox returned the hash percent encoded.
USB.requestDevice() - Web APIs
for example, if only a usb device with product id 0xa
800 is found, then only one device will be listed by the user agent.
... const filters = [ {vendorid: 0x1209, productid: 0xa
800}, {vendorid: 0x1209, productid: 0xa
850} ]; navigator.usb.requestdevice({filters: filters}) .then(usbdevice => { console.log("product name: " + usbdevice.productname); }) .catch(e => { console.log("there is no device.
USBDevice.opened - Web APIs
async setdevicecolor(usbdevice, r, g, b) { if (device.opened) { // this hypothetical usb device requires that the data passed to // it be in a uint
8array.
... let payload = new uint
8array([r, g, b]); await usbdevice.controltransferout({ requesttype: 'vendor', recipient: 'device', request: 1, value: 0, index: 0, }, payload); } } specifications specification status comment webusbthe definition of 'opened' in that specification.
WEBGL_draw_buffers - Web APIs
ext.color_attachment0_webgl ext.color_attachment1_webgl ext.color_attachment2_webgl ext.color_attachment3_webgl ext.color_attachment4_webgl ext.color_attachment5_webgl ext.color_attachment6_webgl ext.color_attachment7_webgl ext.color_attachment
8_webgl ext.color_attachment9_webgl ext.color_attachment10_webgl ext.color_attachment11_webgl ext.color_attachment12_webgl ext.color_attachment13_webgl ext.color_attachment14_webgl ext.color_attachment15_webgl a glenum specifying a color buffer.
... ext.draw_buffer0_webgl ext.draw_buffer1_webgl ext.draw_buffer2_webgl ext.draw_buffer3_webgl ext.draw_buffer4_webgl ext.draw_buffer5_webgl ext.draw_buffer6_webgl ext.draw_buffer7_webgl ext.draw_buffer
8_webgl ext.draw_buffer9_webgl ext.draw_buffer10_webgl ext.draw_buffer11_webgl ext.draw_buffer12_webgl ext.draw_buffer13_webgl ext.draw_buffer14_webgl ext.draw_buffer15_webgl a glenum returning a draw buffer.
WebGL2RenderingContext.renderbufferStorageMultisample() - Web APIs
possible values: gl.r
8 gl.r
8ui gl.r
8i gl.r16ui gl.r16i gl.r32ui gl.r32i gl.rg
8 gl.rg
8ui gl.rg
8i gl.rg16ui gl.rg16i gl.rg32ui gl.rg32i gl.rgb
8 gl.rgba
8 gl.srgb
8_alpha
8 gl.rgba4 gl.rgb565 gl.rgb5_a1 gl.rgb10_a2 gl.rgba
8ui gl.rgba
8i gl.rgb10_a2ui gl.rgba16ui gl.rgba16i gl.rgba32i gl.rgba32ui gl.depth_component16 gl.depth_component24 gl.depth_component32f gl.dep...
...th_stencil gl.depth24_stencil
8 gl.depth32f_stencil
8 gl.stencil_index
8 width a glsizei specifying the width of the renderbuffer in pixels.
WebGLContextEvent - Web APIs
k; 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 xlink: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="3
8.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 xlink:href="/docs/web/api/webglcontextevent" target="_top"><rect x="116" y="1" width="170" height="50" f...
...ill="#f4f7f
8" 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.activeTexture() - Web APIs
it is, per specification, at least
8.
... gl.activetexture(gl.texture0); gl.getparameter(gl.active_texture); // returns "339
84" (0x
84c0, gl.texture0 enum value) specifications specification status comment webgl 1.0the definition of 'activetexture' in that specification.
WebGLRenderingContext.framebufferRenderbuffer() - Web APIs
when using a webgl 2 context, the following values are available additionally: gl.color_attachment1 gl.color_attachment2 gl.color_attachment3 gl.color_attachment4 gl.color_attachment5 gl.color_attachment6 gl.color_attachment7 gl.color_attachment
8 gl.color_attachment9 gl.color_attachment10 gl.color_attachment11 gl.color_attachment12 gl.color_attachment13 gl.color_attachment14 gl.color_attachment15 when using the webgl_draw_buffers extension: ext.color_attachment0_webgl (same as gl.color_attachment0) ext.color_attachment1_webgl ext.color_attachment2_webgl ext.color_attachmen...
...t3_webgl ext.color_attachment4_webgl ext.color_attachment5_webgl ext.color_attachment6_webgl ext.color_attachment7_webgl ext.color_attachment
8_webgl ext.color_attachment9_webgl ext.color_attachment10_webgl ext.color_attachment11_webgl ext.color_attachment12_webgl ext.color_attachment13_webgl ext.color_attachment14_webgl ext.color_attachment15_webgl renderbuffertarget a glenum specifying the binding point (target) for the render buffer.
WebGLRenderingContext.framebufferTexture2D() - Web APIs
gl.color_attachment1 gl.color_attachment2 gl.color_attachment3 gl.color_attachment4 gl.color_attachment5 gl.color_attachment6 gl.color_attachment7 gl.color_attachment
8 gl.color_attachment9 gl.color_attachment10 gl.color_attachment11 gl.color_attachment12 gl.color_attachment13 gl.color_attachment14 gl.color_attachment15 when using the webgl_draw_buffers extension: ext.color_attachment0_webgl (same as gl.color_attachment0) ext.color_attachment1_webgl ext.color_attachment2_webgl ext.color_attachmen...
...t3_webgl ext.color_attachment4_webgl ext.color_attachment5_webgl ext.color_attachment6_webgl ext.color_attachment7_webgl ext.color_attachment
8_webgl ext.color_attachment9_webgl ext.color_attachment10_webgl ext.color_attachment11_webgl ext.color_attachment12_webgl ext.color_attachment13_webgl ext.color_attachment14_webgl ext.color_attachment15_webgl when using the webgl_depth_texture extension: gl.depth_stencil_attachment: depth and stencil buffer data storage.
WebGLRenderingContext.getFramebufferAttachmentParameter() - Web APIs
when using a webgl 2 context, the following values are available additionally: gl.color_attachment1 gl.color_attachment2 gl.color_attachment3 gl.color_attachment4 gl.color_attachment5 gl.color_attachment6 gl.color_attachment7 gl.color_attachment
8 gl.color_attachment9 gl.color_attachment10 gl.color_attachment11 gl.color_attachment12 gl.color_attachment13 gl.color_attachment14 gl.color_attachment15 when using the webgl_draw_buffers extension: ext.color_attachment0_webgl (same as gl.color_attachment0) ext.color_attachment1_webgl ext.color_attachment2_webgl ext.color_attachmen...
...t3_webgl ext.color_attachment4_webgl ext.color_attachment5_webgl ext.color_attachment6_webgl ext.color_attachment7_webgl ext.color_attachment
8_webgl ext.color_attachment9_webgl ext.color_attachment10_webgl ext.color_attachment11_webgl ext.color_attachment12_webgl ext.color_attachment13_webgl ext.color_attachment14_webgl ext.color_attachment15_webgl pname a glenum specifying information to query.
WebGLRenderingContext.pixelStorei() - Web APIs
pixel storage parameters parameter name (for pname) description type default value allowed values (for param) specified in gl.pack_alignment packing of pixel data into memory glint 4 1, 2, 4,
8 opengl es 2.0 gl.unpack_alignment unpacking of pixel data from memory.
... glint 4 1, 2, 4,
8 opengl es 2.0 gl.unpack_flip_y_webgl flips the source data along its vertical axis if true.
WebGLRenderingContext.readPixels() - Web APIs
uint
8array for gl.unsigned_byte.
... examples var canvas = document.getelementbyid('canvas'); var gl = canvas.getcontext('webgl'); var pixels = new uint
8array(gl.drawingbufferwidth * gl.drawingbufferheight * 4); gl.readpixels(0, 0, gl.drawingbufferwidth, gl.drawingbufferheight, gl.rgba, gl.unsigned_byte, pixels); console.log(pixels); // uint
8array specifications specification status comment webgl 1.0the definition of 'readpixels' in that specification.
WebGLRenderingContext.texSubImage2D() - Web APIs
possible values: gl.unsigned_byte:
8 bits per channel for gl.rgba gl.unsigned_short_5_6_5: 5 red bits, 6 green bits, 5 blue bits.
...en using the oes_texture_half_float extension: gl.half_float_oes when using a webgl 2 context, the following values are available additionally: gl.byte gl.unsigned_short gl.short gl.unsigned_int gl.int gl.half_float gl.float gl.unsigned_int_2_10_10_10_rev gl.unsigned_int_10f_11f_11f_rev gl.unsigned_int_5_9_9_9_rev gl.unsigned_int_24_
8 gl.float_32_unsigned_int_24_
8_rev (pixels must be null) pixels one of the following objects can be used as a pixel source for the texture: arraybufferview, a uint
8array must be used if type is gl.unsigned_byte.
WebGLRenderingContext.viewport() - Web APIs
int32array[163
84, 163
84] to get the current viewport, query the viewport constant.
...int32array[0, 0, 640, 4
80] specifications specification status comment webgl 1.0the definition of 'viewport' in that specification.
Hello GLSL - Web APIs
hello glsl!</p> <canvas>your browser does not seem to support html5 canvas.</canvas> body { text-align : center; } canvas { width : 2
80px; height : 210px; margin : auto; padding : 0; border : none; background-color : black; } button { display : block; font-size : inherit; margin : auto; padding : 0.6em; } <script type="x-shader/x-vertex" id="vertex-shader"> #version 100 void main() { gl_position = vec4(0.0, 0.0, 0.0, 1.0); gl_pointsize = 64.0; } </script> <script type="x-shader/x-fragment" id="fragment...
...-shader"> #version 100 void main() { gl_fragcolor = vec4(0.1
8, 0.54, 0.34, 1.0); } </script> ;(function(){ "use strict" window.addeventlistener("load", setupwebgl, false); var gl, program; function setupwebgl (evt) { window.removeeventlistener(evt.type, setupwebgl, false); if (!(gl = getrenderingcontext())) return; var source = document.queryselector("#vertex-shader").innerhtml; var vertexshader = gl.createshader(gl.vertex_shader); 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, vertexs...
Hello vertex attributes - Web APIs
click on the canvas to change the horizontal position of the square.</p> <canvas>your browser does not seem to support html5 canvas.</canvas> body { text-align : center; } canvas { width : 2
80px; height : 210px; margin : auto; padding : 0; border : none; background-color : black; } button { display : block; font-size : inherit; margin : auto; padding : 0.6em; } <script type="x-shader/x-vertex" id="vertex-shader"> #version 100 precision highp float; attribute float position; void main() { gl_position = vec4(position, 0.0, 0.0, 1.0); gl_pointsize = 64.0; } </s...
...cript> <script type="x-shader/x-fragment" id="fragment-shader"> #version 100 precision mediump float; void main() { gl_fragcolor = vec4(0.1
8, 0.54, 0.34, 1.0); } </script> ;(function(){ "use strict" window.addeventlistener("load", setupwebgl, false); var gl, program; function setupwebgl (evt) { window.removeeventlistener(evt.type, setupwebgl, false); if (!(gl = getrenderingcontext())) return; var source = document.queryselector("#vertex-shader").innerhtml; var vertexshader = gl.createshader(gl.vertex_shader); 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(fr...
Creating 3D objects using WebGL - Web APIs
if you wonder why we need 24 vertices, and not just
8, it is because each corner belongs to three faces of different colors, and a single vertex needs to have a single specific color; therefore we will create three copies of each vertex in three different colors, one for each face.
... const indices = [ 0, 1, 2, 0, 2, 3, // front 4, 5, 6, 4, 6, 7, // back
8, 9, 10,
8, 10, 11, // top 12, 13, 14, 12, 14, 15, // bottom 16, 17, 1
8, 16, 1
8, 19, // right 20, 21, 22, 20, 22, 23, // left ]; // now send the element array to gl gl.bufferdata(gl.element_array_buffer, new uint16array(indices), gl.static_draw); return { position: positionbuffer, color: colorbuffer, indices: indexbuffer, }; } ...
WebGL types - Web APIs
glbyte byte
8-bit twos complement signed integer.
... glubyte octet
8-bit twos complement unsigned integer.
WebSocket.close() - Web APIs
this string must be no longer than 123 bytes of utf-
8 text (not characters).
... note: in gecko, this method didn't support any parameters prior to gecko
8.0 (firefox
8.0 / thunderbird
8.0 / seamonkey 2.5).
WebSocket.send() - Web APIs
the string is added to the buffer in utf-
8 format, and the value of bufferedamount is increased by the number of bytes required to represent the utf-
8 string.
... note: gecko's implementation of the send() method differs somewhat from the specification in gecko 6.0; gecko returns a boolean indicating whether or not the connection is still open (and, by extension, that the data was successfully queued or transmitted); this is corrected in gecko
8.0.
Geometry and reference spaces in WebXR - Web APIs
to convert degrees to radians, simply multiply the value in degrees by π/1
80.
... const radians_per_degree = math.pi / 1
80.0; let degreestoradians = (deg) => deg * radians_per_degree; let radianstodegrees = (rad) => rad / radians_per_degree; times and durations note that for security reasons, domhighrestimestamp usually introduces a small amount of imprecision to the clock in order to prevent it from being used in fingerprinting and timing-based attacks.
Controlling multiple parameters with ConstantSourceNode - Web APIs
<div class="controls"> <div class="left"> <div id="playbutton" class="button"> ▶️ </div> </div> <div class="right"> <span>volume: </span> <input type="range" min="0.0" max="1.0" step="0.01" value="0.
8" name="volume" id="volumecontrol"> </div> </div> <p>use the button above to start and stop the tones, and the volume control to change the volume of the notes e and g in the chord.</p> css .controls { width: 400px; position: relative; vertical-align: middle; height: 44px; } .button { font-size: 32px; cursor: pointer; user-select: none; -moz-user-select: none; -webkit-user...
... function startoscillators() { oscnode1 = context.createoscillator(); oscnode1.type = "sine"; oscnode1.frequency.value = 261.62556530059
8634; // middle c oscnode1.connect(gainnode1); oscnode2 = context.createoscillator(); oscnode2.type = "sine"; oscnode2.frequency.value = 329.627556912
869929; // e oscnode2.connect(gainnode2); oscnode3 = context.createoscillator(); oscnode3.type = "sine"; oscnode3.frequency.value = 391.9954359
81749294 // g oscnode3.connect(gainnode3); oscnode1.start(); oscnode2.start(); os...
Privileged features - Web APIs
the dependent feature is currently under revision to be removed (bug 214
867) in msie 6, the nearest equivalent to this feature is the showmodelessdialog() method.
...this was added in firefox 66 (see bug 1519
893).
WindowOrWorkerGlobalScope.btoa() - Web APIs
for example: // convert a unicode string to a string in which // each 16-bit unit occupies only one byte function tobinary(string) { const codeunits = new uint16array(string.length); for (let i = 0; i < codeunits.length; i++) { codeunits[i] = string.charcodeat(i); } return string.fromcharcode(...new uint
8array(codeunits.buffer)); } // a string that contains characters occupying > 1 byte const mystring = "☸☹☺☻☼☾☿"; const converted = tobinary(mystring); const encoded = btoa(converted); console.log(encoded); // ocy5jjomoyy
8jj4mpyy= if you do this, of course you'll have to reverse the conversion on the decoded string: function frombinary(binary) { const bytes = new...
... uint
8array(binary.length); for (let i = 0; i < bytes.length; i++) { bytes[i] = binary.charcodeat(i); } return string.fromcharcode(...new uint16array(bytes.buffer)); } const decoded = atob(encoded); const original = frombinary(decoded); console.log(original); // ☸☹☺☻☼☾☿ polyfill you can use a polifill from https://github.com/maxart2501/base64-js/blob/master/base64.js for browsers that don't support it.
WindowOrWorkerGlobalScope.fetch() - Web APIs
(this behavior was corrected in firefox 65 — see bug 150
8661).
... integrity contains the subresource integrity value of the request (e.g., sha256-bpfbw7ivv
8q2jlit13fxdyae2tjllusrsz273h2nfse=).
XMLDocument - Web APIs
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 xlink: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="1
88.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#d4dde4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/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="middle">document</text></a><polyline points="346,25 356,20 356,30 346,25" stroke="#d4dde4" fill="none"/><line x1="356" y1="25" x2="3
86" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/xmldocument" target="_top"><rect x="3
86" y="1" width="110" height="50" fill="#f4f7f
8" 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:...
Synchronous and asynchronous requests - Web APIs
example.html (the main page): <!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-
8" /> <title>mdn example</title> <script type="text/javascript"> var worker = new worker("mytask.js"); worker.onmessage = function(event) { alert("worker said: " + event.data); }; worker.postmessage("hello"); </script> </head> <body></body> </html> myfile.txt (the target of the synchronous xmlhttprequest invocation): hello world!!
...:( client.setrequestheader("content-type", "text/plain;charset=utf-
8"); client.send(analyticsdata); } using the sendbeacon() method, the data will be transmitted asynchronously to the web server when the user agent has had an opportunity to do so, without delaying the unload or affecting the performance of the next navigation.
XMLHttpRequest.send() - Web APIs
}; xhr.send(null); // xhr.send('string'); // xhr.send(new blob()); // xhr.send(new int
8array()); // xhr.send(document); example: post var xhr = new xmlhttprequest(); xhr.open("post", '/server', true); //send the proper header information along with the request xhr.setrequestheader("content-type", "application/x-www-form-urlencoded"); xhr.onreadystatechange = function() { // call a function when the state changes.
... } } xhr.send("foo=bar&lorem=ipsum"); // xhr.send(new int
8array()); // xhr.send(document); specifications specification status comment xmlhttprequestthe definition of 'send()' in that specification.
XMLHttpRequest.sendAsBinary() - Web APIs
/*\ |*| |*| :: xmlhttprequest.prototype.sendasbinary() polyfill :: |*| |*| https://developer.mozilla.org/docs/dom/xmlhttprequest#sendasbinary() |*| \*/ if (!xmlhttprequest.prototype.sendasbinary) { xmlhttprequest.prototype.sendasbinary = function (sdata) { var nbytes = sdata.length, ui
8data = new uint
8array(nbytes); for (var nidx = 0; nidx < nbytes; nidx++) { ui
8data[nidx] = sdata.charcodeat(nidx) & 0xff; } /* send as arraybufferview...: */ this.send(ui
8data); /* ...or as arraybuffer (legacy)...: this.send(ui
8data.buffer); */ }; } note: it's possible to build this polyfill putting two types of data as argument for send(): an arraybuffer (ui
8data.buff...
...er – the commented code) or an arraybufferview (ui
8data, which is a typed array of
8-bit unsigned integers – uncommented code).
XMLHttpRequest - Web APIs
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 xlink:href="/docs/web/api/xmlhttprequest" target="_top"><rect x="441" y="1" width="140" height="50" fill="#f4f7f
8" stroke="#d4dde4" stroke-width="2px" /><text x="511" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">xmlhttprequest</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} despite its name, xmlhttprequest can be used to retrieve any type of data, not just xml.
... note: according to the http/2 specification (
8.1.2.4 response pseudo-header fields), http/2 does not define a way to carry the version or reason phrase that is included in an http/1.1 status line.
XSL Transformations in Mozilla FAQ - Web APIs
see the discussion on bug #33
8621 for more information.
... original document information author(s): axel hecht last updated date: february 2, 2005 copyright information: portions of this content are © 199
8–2006 by individual mozilla.org contributors; content available under a creative commons license ...
ARIA live regions - Accessibility
in windows eyes supports live regions since version
8.0 "for use outside of browse mode for microsoft internet explorer and mozilla firefox".
... nvda added some basic support for live regions for mozilla firefox back in 200
8 and was improved in 2010 and 2014.
ARIA: contentinfo role - Accessibility
examples <body> <!-- other page content --> <div role="contentinfo"> <h2>mdn web docs</h2> <ul> <li><a href="#">web technologies</a></li> <li><a href="#">learn web development</a></li> <li><a href="#">about mdn</a></li> <li><a href="#">feedback</a></li> </ul> <p>© 2005-201
8 mozilla and individual contributors.
... <article> <h2>everyday pad thai</h2> <!-- article content --> <footer aria-label="everyday pad thai metadata"> <p>posted on <time datetime="201
8-09-23 12:17">may 16</time> by <a href="#">lisa</a>.</p> </footer> </article> ...
ARIA: gridcell role - Accessibility
<div role="row"> <div role="gridcell">jane</div> <div role="gridcell">smith</div> <div role="gridcell">496-619-509
8</div> … </div> the first rule of aria is if a native html element or attribute has the semantics and behavior you require, use it instead of re-purposing an element and adding aria.
...columnheader">name</div> <div role="columnheader">diameter (km)</div> <div role="columnheader">length of day (hours)</div> <div role="columnheader">distance from sun (10<sup>6</sup>km)</div> <div role="columnheader">number of moons</div> </div> </div> <div role="rowgroup"> <div role="row"> <div role="gridcell">jupiter</div> <div role="gridcell">142,9
84</div> <div role="gridcell">9.9</div> <div role="gridcell">77
8.6</div> <div role="gridcell">67</div> </div> </div> <div role="rowgroup"> <div role="row"> <div role="gridcell">saturn</div> <div role="gridcell">120,536</div> <div role="gridcell">10.7</div> <div role="gridcell">1433.5</div> <div role="gridcell">62</div> </div> </div> ...
Multipart labels: Using ARIA for labels with embedded fields inside them - Accessibility
example: shut down computer after minutes <input aria-labelledby="labelshutdown shutdowntime shutdownunit" type="checkbox" /> <span id="labelshutdown">shut down computer after</span> <input aria-labelledby="labelshutdown shutdowntime shutdownunit" id="shutdowntime" type="text" value="10" /> <span id="shutdownunit"> minutes</span> a note for jaws
8 users jaws
8.0 has its own logic to find labels, causing it to always override the accessiblename the textbox of an html document gets.
... with jaws
8, i have not found a way to make it to accept the label from the example above.
Alerts - Accessibility
d="true"/> <br /> <label for="email">e-mail address (required):</label> <input name="email" id="email" aria-required="true"/> <br /> <label for="website">website (optional):</label> <input name="website" id="website"/> </fieldset> <label for="message">please enter your message (required):</label> <br /> <textarea name="message" id="message" rows="5" cols="
80" aria-required="true"></textarea> <br /> <input type="submit" name="submit" value="send message"/> <input type="reset" name="reset" value="reset form"/> </form> checking for validity and notifying the user form validations consists of several steps: checking if the e-mail address or entered name are valid.
...jaws 9 supports this, but jaws
8 does not, so this may not work in all versions of the screen readers supported.
-moz-image-region - CSS: Cascading Style Sheets
/* keyword value */ -moz-image-region: auto; /* <shape> value */ -moz-image-region: rect(0,
8px, 4px, 4px); /* global values */ -moz-image-region: inherit; -moz-image-region: initial; -moz-image-region: unset; the syntax is similar to the clip property.
...ape> = rect(<top>, <right>, <bottom>, <left>) examples clipping an image #example-button { /* display only the 4x4 area from the top left of this image */ list-style-image: url("chrome://example/skin/example.png"); -moz-image-region: rect(0px, 4px, 4px, 0px); } #example-button:hover { /* use the 4x4 area to the right of the first for the hovered button */ -moz-image-region: rect(0px,
8px, 4px, 4px); } specifications not part of any standard.
:checked - CSS: Cascading Style Sheets
s</label> <input type="radio" name="my-input" id="no"> <label for="no">no</label> </div> <div> <input type="checkbox" name="my-checkbox" id="opt-in"> <label for="opt-in">check me!</label> </div> <select name="my-select" id="fruit"> <option value="opt1">apples</option> <option value="opt2">grapes</option> <option value="opt3">pears</option> </select> css div, select { margin:
8px; } /* labels for checked inputs */ input:checked + label { color: red; } /* radio element, when checked */ input[type="radio"]:checked { box-shadow: 0 0 0 3px orange; } /* checkbox element, when checked */ input[type="checkbox"]:checked { box-shadow: 0 0 0 3px hotpink; } /* option elements, when selected */ option:checked { box-shadow: 0 0 0 3px lime; color: red; } result tog...
... notes on macos, styling <option&rt; elements has no effect.safari full support 3.1notes full support 3.1notes notes styling <option&rt; elements has no effect.webview android full support 2chrome android full support 1
8firefox android full support 4notes full support 4notes notes from firefox 56, <option&rt; elements cannot be styled.opera android full support 10.1safari ios full support 3.1notes full support ...
:has() - CSS: Cascading Style Sheets
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internet:has()chrome no support nonotes no support nonotes notes see bug 66905
8edge no support nonotes no support nonotes notes see bug 66905
8firefox no support nonotes no support nonotes notes see bug 41
8039ie no support noopera no sup...
... nosafari no support nowebview android no support nochrome android no support nofirefox android no support nonotes no support nonotes notes see bug 41
8039opera android no support nosafari ios no support nosamsung internet android no support nolegend no support no supportsee implementation notes.see implementation notes.
:host-context() - CSS: Cascading Style Sheets
riandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internet:host-context()chrome full support 54edge full support 79firefox no support nonotes no support nonotes notes see bug 10
82060.ie no support noopera full support 41safari no support nowebview android full support 54chrome android full support 54firefox android no support ...
... nonotes no support nonotes notes see bug 10
82060.opera android full support 41safari ios no support nosamsung internet android full support 6.0legend full support full support no support no supportsee implementation notes.see implementation notes.
:lang() - CSS: Cascading Style Sheets
/* selects any <p> in english (en) */ p:lang(en) { quotes: '\201c' '\201d' '\201
8' '\2019'; } note: in html, the language is determined by a combination of the lang attribute, the <meta> element, and possibly by information from the protocol (such as http headers).
... html <div lang="en"><q>this english quote has a <q>nested</q> quote inside.</q></div> <div lang="fr"><q>this french quote has a <q>nested</q> quote inside.</q></div> <div lang="de"><q>this german quote has a <q>nested</q> quote inside.</q></div> css :lang(en) > q { quotes: '\201c' '\201d' '\201
8' '\2019'; } :lang(fr) > q { quotes: '« ' ' »'; } :lang(de) > q { quotes: '»' '«' '\2039' '\203a'; } result specifications specification status comment selectors level 4the definition of ':lang()' in that specification.
:read-only - CSS: Cascading Style Sheets
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internet:read-onlychrome full support 1edge full support 13firefox full support 7
8 full support 7
8 full support 1.5prefixed prefixed implemented with the vendor prefix: -moz-ie no support noopera full support 9safari full support 4webview android ...
... full support ≤37chrome android full support 1
8firefox android full support 4prefixed full support 4prefixed prefixed implemented with the vendor prefix: -moz-opera android full support 10.1safari ios full support 3.2samsung internet android full support 1.0legend full support full support no support no supportrequires a vendor prefix or different name for use.requires a vendor prefix or d...
:read-write - CSS: Cascading Style Sheets
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internet:read-writechrome full support 1edge full support 13firefox full support 7
8 full support 7
8 full support 1.5prefixed prefixed implemented with the vendor prefix: -moz-ie no support noopera full support 9safari full support 4webview android ...
... full support ≤37chrome android full support 1
8firefox android full support 4prefixed full support 4prefixed prefixed implemented with the vendor prefix: -moz-opera android full support 10.1safari ios full support 3.2samsung internet android full support 1.0legend full support full support no support no supportrequires a vendor prefix or different name for use.requires a vendor prefix or d...
aspect-ratio - CSS: Cascading Style Sheets
</div> css /* minimum aspect ratio */ @media (min-aspect-ratio:
8/5) { div { background: #9af; /* blue */ } } /* maximum aspect ratio */ @media (max-aspect-ratio: 3/2) { div { background: #9ff; /* cyan */ } } /* exact aspect ratio, put it at the bottom to avoid override*/ @media (aspect-ratio: 1/1) { div { background: #f9a; /* red */ } } _example used iframe and dataurl to enable this iframe could resize html <label id="wf" for=...
..."w">width:165</label> <input id="w" name="w" type="range" min="100" max="250" step="5" value="165"> <label id="hf" for="w">height:165</label> <input id="h" name="h" type="range" min="100" max="250" step="5" value="165"> <iframe id="outer" src="data:text/html,<style> @media (min-aspect-ratio:
8/5) { div { background: %239af; } } @media (max-aspect-ratio: 3/2) { div { background: %239ff; } } @media (aspect-ratio: 1/1) { div { background: %23f9a; } }</style><div id='inner'> watch this element as you resize your viewport's width and height.</div>"> </iframe> css iframe{ display:block; } javascript outer.style.width=outer.style.height="165px" w.onchange=w.oninput=function(){ outer.style.width=w.value+"px" wf.textcontent="width:"+w.value } h.onchange=h.oninput=function(){ outer.st...
Using multi-column layouts - CSS: Cascading Style Sheets
excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum </div> css #columns_4 { columns: 4; } result the two css declarations column-width:
8em and column-count: 12 can be replaced by columns: 12
8em.
...excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum </div> css #columns_12 { columns: 12
8em; } result height balancing the css3 column specification requires that the column heights must be balanced: that is, the browser automatically sets the maximum column height so that the heights of the content in each column are approximately equal.
Using z-index - CSS: Cascading Style Sheets
#1</b> <br />position: absolute; <br />z-index: 5; </div> <div id="rel1"> <b>div #2</b> <br />position: relative; <br />z-index: 3; </div> <div id="rel2"> <b>div #3</b> <br />position: relative; <br />z-index: 2; </div> <div id="abs2"> <b>div #4</b> <br />position: absolute; <br />z-index: 1; </div> <div id="sta1"> <b>div #5</b> <br />no positioning <br />z-index:
8; </div> css div { padding: 10px; opacity: 0.7; text-align: center; } b { font-family: sans-serif; } #abs1 { z-index: 5; position: absolute; width: 150px; height: 350px; top: 10px; left: 10px; border: 1px dashed #900; background-color: #fdd; } #rel1 { z-index: 3; height: 100px; position: relative; top: 30px; border: 1px dashed #696; background-color: #cfc;...
... margin: 0px 50px 0px 50px; } #rel2 { z-index: 2; height: 100px; position: relative; top: 15px; left: 20px; border: 1px dashed #696; background-color: #cfc; margin: 0px 50px 0px 50px; } #abs2 { z-index: 1; position: absolute; width: 150px; height: 350px; top: 10px; right: 10px; border: 1px dashed #900; background-color: #fdd; } #sta1 { z-index:
8; height: 70px; border: 1px dashed #996; background-color: #ffc; margin: 0px 50px 0px 50px; } ...
Using CSS transforms - CSS: Cascading Style Sheets
{ display: block; position: absolute; width: 100px; height: 100px; border: none; line-height: 100px; font-family: sans-serif; font-size: 60px; color: white; text-align: center; } /* define each face based on direction */ .front { background: rgba(0, 0, 0, 0.3); transform: translatez(50px); } .back { background: rgba(0, 255, 0, 1); color: black; transform: rotatey(1
80deg) translatez(50px); } .right { background: rgba(196, 0, 0, 0.7); transform: rotatey(90deg) translatez(50px); } .left { background: rgba(0, 0, 196, 0.7); transform: rotatey(-90deg) translatez(50px); } .top { background: rgba(196, 196, 0, 0.7); transform: rotatex(90deg) translatez(50px); } .bottom { background: rgba(196, 0, 196, 0.7); transform: rotatex(-90deg) translatez(50p...
...e { display: block; position: absolute; width: 100px; height: 100px; border: none; line-height: 100px; font-family: sans-serif; font-size: 60px; color: white; text-align: center; } /* define each face based on direction */ .front { background: rgba(0, 0, 0, 0.3); transform: translatez(50px); } .back { background: rgba(0, 255, 0, 1); color: black; transform: rotatey(1
80deg) translatez(50px); } .right { background: rgba(196, 0, 0, 0.7); transform: rotatey(90deg) translatez(50px); } .left { background: rgba(0, 0, 196, 0.7); transform: rotatey(-90deg) translatez(50px); } .top { background: rgba(196, 196, 0, 0.7); transform: rotatex(90deg) translatez(50px); } .bottom { background: rgba(196, 0, 196, 0.7); transform: rotatex(-90deg) translatez(50px); ...
CSS values and units - CSS: Cascading Style Sheets
numbers a <number> represents a real number, which may or may not have a decimal point with a fractional component, for example 0.255, 12
8 or -1.2.
... adds 4- and
8-digit hex color values, where the last digit(s) represents the alpha value.
Layout and the containing block - CSS: Cascading Style Sheets
<body> <section> <p>this is a paragraph!</p> </section> </body> body { background: beige; } section { width: 400px; height: 4
80px; margin: 30px; padding: 15px; background: lightgray; } p { position: fixed; width: 50%; /* == (50vw - (width of vertical scrollbar)) */ height: 50%; /* == (50vh - (height of horizontal scrollbar)) */ margin: 5%; /* == (5vw - (width of vertical scrollbar)) */ padding: 5%; /* == (5vw - (width of vertical scrollbar)) */ background: cyan; } example 5 in this example, ...
... <body> <section> <p>this is a paragraph!</p> </section> </body> body { background: beige; } section { transform: rotate(0deg); width: 400px; height: 160px; background: lightgray; } p { position: absolute; left:
80px; top: 30px; width: 50%; /* == 200px */ height: 25%; /* == 40px */ margin: 5%; /* == 20px */ padding: 5%; /* == 20px */ background: cyan; } ...
Shorthand properties - CSS: Cascading Style Sheets
font-style: italic; font-weight: bold; font-size: .
8em; line-height: 1.2; font-family: arial, sans-serif; ...
... can be shortened to the following: font: italic bold .
8em/1.2 arial, sans-serif; this shorthand declaration is actually equivalent to the longhand declarations above plus font-variant: normal and font-size-adjust: none (css2.0 / css3), font-stretch: normal (css3).
align-content - CSS: Cascading Style Sheets
baseline<content-distribution> = space-between | space-around | space-evenly | stretch<overflow-position> = unsafe | safe<content-position> = center | start | end | flex-start | flex-end examples css #container { height:200px; width: 240px; align-content: center; /* can be changed in the live sample */ background-color: #
8c
8c
8c; } .flex { display: flex; flex-wrap: wrap; } .grid { display: grid; grid-template-columns: repeat(auto-fill, 50px); } div > div { box-sizing: border-box; border: 2px solid #
8c
8c
8c; width: 50px; display: flex; align-items: center; justify-content: center; } #item1 { background-color: #
8cffa0; min-height: 30px; } #item2 { background-color: #a0c
8ff; min-height: ...
...50px; } #item3 { background-color: #ffa0
8c; min-height: 40px; } #item4 { background-color: #ffff
8c; min-height: 60px; } #item5 { background-color: #ff
8cff; min-height: 70px; } #item6 { background-color: #
8cffff; min-height: 50px; font-size: 30px; } select { font-size: 16px; } .row { margin-top: 10px; } html <div id="container" class="flex"> <div id="item1">1</div> <div id="item2">2</div> <div id="item3">3</div> <div id="item4">4</div> <div id="item5">5</div> <div id="item6">6</div> </div> <div class="row"> <label for="display">display: </label> <select id="display"> <option value="flex">flex</option> <option value="grid">grid</option> </select> </div> <div class="row"> <label for="values">align-content: </label> <select id="valu...
align-items - CSS: Cascading Style Sheets
baseline<overflow-position> = unsafe | safe<self-position> = center | start | end | self-start | self-end | flex-start | flex-end examples css #container { height:200px; width: 240px; align-items: center; /* can be changed in the live sample */ background-color: #
8c
8c
8c; } .flex { display: flex; flex-wrap: wrap; } .grid { display: grid; grid-template-columns: repeat(auto-fill, 50px); } div > div { box-sizing: border-box; border: 2px solid #
8c
8c
8c; width: 50px; display: flex; align-items: center; justify-content: center; } #item1 { background-color: #
8cffa0; min-height: 30px; } #item2 { background-color: #a0c
8ff; min-height: ...
...50px; } #item3 { background-color: #ffa0
8c; min-height: 40px; } #item4 { background-color: #ffff
8c; min-height: 60px; } #item5 { background-color: #ff
8cff; min-height: 70px; } #item6 { background-color: #
8cffff; min-height: 50px; font-size: 30px; } select { font-size: 16px; } .row { margin-top: 10px; } html <div id="container" class="flex"> <div id="item1">1</div> <div id="item2">2</div> <div id="item3">3</div> <div id="item4">4</div> <div id="item5">5</div> <div id="item6">6</div> </div> <div class="row"> <label for="display">display: </label> <select id="display"> <option value="flex">flex</option> <option value="grid">grid</option> </select> </div> <div class="row"> <label for="values">align-items: </label> <select id="values"...
animation-delay - CSS: Cascading Style Sheets
syntax /* single animation */ animation-delay: 3s; animation-delay: 0s; animation-delay: -1500ms; /* multiple animations */ animation-delay: 2.1s, 4
80ms; values <time> the time offset, from the moment at which the animation is applied to the element, at which the animation should begin.
... 43 full support 43 full support ≤37prefixed prefixed implemented with the vendor prefix: -webkit-chrome android full support 43 full support 43 full support 1
8prefixed prefixed implemented with the vendor prefix: -webkit-firefox android full support 16 full support 16 full support 49prefixed prefixed implemented with the vendor prefix: -webkit- full support 44prefixed disabled...
backdrop-filter - CSS: Cascading Style Sheets
filter: url(commonfilters.svg#filter); /* <filter-function> values */ backdrop-filter: blur(2px); backdrop-filter: brightness(60%); backdrop-filter: contrast(40%); backdrop-filter: drop-shadow(4px 4px 10px blue); backdrop-filter: grayscale(30%); backdrop-filter: hue-rotate(120deg); backdrop-filter: invert(70%); backdrop-filter: opacity(20%); backdrop-filter: sepia(90%); backdrop-filter: saturate(
80%); /* multiple filters */ backdrop-filter: url(filters.svg#filter) blur(4px) saturate(150%); /* global values */ backdrop-filter: inherit; backdrop-filter: initial; backdrop-filter: unset; syntax values none no filter is applied to the backdrop.
...ngle> examples css .box { background-color: rgba(255, 255, 255, 0.3); border-radius: 5px; font-family: sans-serif; text-align: center; line-height: 1; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); max-width: 50%; max-height: 50%; padding: 20px 40px; } html, body { height: 100%; width: 100%; } body { background-image: url(https://picsum.photos/id/10
80/6
85
8/4574), linear-gradient(rgb(219, 166, 166), rgb(0, 0, 172)); background-position: center center; background-repeat: no-repeat; background-size: cover; } .container { align-items: center; display: flex; justify-content: center; height: 100%; width: 100%; } html <div class="container"> <div class="box"> <p>backdrop-filter: blur(10px)</p> </div> </div> result spe...
background-color - CSS: Cascading Style Sheets
mal value */ background-color: #bbff00; /* fully opaque */ background-color: #bf0; /* fully opaque shorthand */ background-color: #11ffee00; /* fully transparent */ background-color: #1fe0; /* fully transparent shorthand */ background-color: #11ffeeff; /* fully opaque */ background-color: #1fef; /* fully opaque shorthand */ /* rgb value */ background-color: rgb(255, 255, 12
8); /* fully opaque */ background-color: rgba(117, 190, 21
8, 0.5); /* 50% transparent */ /* hsl value */ background-color: hsl(50, 33%, 25%); /* fully opaque */ background-color: hsla(50, 33%, 25%, 0.75); /* 75% transparent */ /* special keyword values */ background-color: currentcolor; background-color: transparent; /* global values */ background-color: inherit; background-colo...
...large text is defined as 1
8.66px and bold or larger, or 24px or larger.
border-bottom-style - CSS: Cascading Style Sheets
yle> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset examples demonstrating all border styles html <table> <tr> <td class="b1">none</td> <td class="b2">hidden</td> <td class="b3">dotted</td> <td class="b4">dashed</td> </tr> <tr> <td class="b5">solid</td> <td class="b6">double</td> <td class="b7">groove</td> <td class="b
8">ridge</td> </tr> <tr> <td class="b9">inset</td> <td class="b10">outset</td> </tr> </table> css /* define look of the table */ table { border-width: 3px; background-color: #52e3
85; } tr, td { padding: 3px; } /* border-bottom-style example classes */ .b1 {border-bottom-style: none;} .b2 {border-bottom-style: hidden;} .b3 {border-bottom-style: dotted;} .b4 {border-bottom-styl...
...e: dashed;} .b5 {border-bottom-style: solid;} .b6 {border-bottom-style: double;} .b7 {border-bottom-style: groove;} .b
8 {border-bottom-style: ridge;} .b9 {border-bottom-style: inset;} .b10 {border-bottom-style: outset;} result specifications specification status comment css backgrounds and borders module level 3the definition of 'border-bottom-style' in that specification.
border-image-slice - CSS: Cascading Style Sheets
zones 5-
8 are edge regions.
...li> <label for="slice">slide to adjust <code>border-image-slice</code></label> <input type="range" min="10" max="45" id="slice"> <output id="slice-output">30</output> </li> </ul> css .wrapper { width: 400px; height: 300px; } div > div { width: 300px; height: 200px; border-width: 30px; border-style: solid; border-image: url(https://udn.realityripple.com/samples/56/bb9
8f533ef.png); border-image-slice: 30; border-image-repeat: round; } li { display: flex; place-content: center; } javascript const widthslider = document.getelementbyid('width'); const sliceslider = document.getelementbyid('slice'); const widthoutput = document.getelementbyid('width-output'); const sliceoutput = document.getelementbyid('slice-output'); const divelem = document.queryselect...
border-image - CSS: Cascading Style Sheets
the source for the border image is a ".png" file of
81 by
81 pixels, with three diamonds going vertically and horizontally: html <div id="bitmap">this element is surrounded by a bitmap-based border image!</div> css to match the size of a single diamond, we will use a value of
81 divided by 3, or 27, for slicing the image into corner and edge regions.
... #bitmap { width: 200px; background-color: #ffa; border: 36px solid orange; margin: 30px; padding: 10px; border-image: url("https://udn.realityripple.com/samples/2c/fa0192d1
8e.png") /* source */ 27 / /* slice */ 36px 2
8px 1
8px
8px / /* width */ 1
8px 14px 9px 4px /* outset */ round; /* repeat */ } result gradient html <div id="gradient">this element is surrounded by a gradient-based border image!</div> css #gradient { width: 200px; border: 30px solid; border-image: repeating-linear-gr...
border-style - CSS: Cascading Style Sheets
html <table> <tr> <td class="b1">none</td> <td class="b2">hidden</td> <td class="b3">dotted</td> <td class="b4">dashed</td> </tr> <tr> <td class="b5">solid</td> <td class="b6">double</td> <td class="b7">groove</td> <td class="b
8">ridge</td> </tr> <tr> <td class="b9">inset</td> <td class="b10">outset</td> </tr> </table> css /* define look of the table */ table { border-width: 3px; background-color: #52e396; } tr, td { padding: 2px; } /* border-style example classes */ .b1 {border-style:none;} .b2 {border-style:hidden;} .b3 {border-style:dotted;} .b4 {border-style:dashed;} .b5 {border-style:solid;} .
...b6 {border-style:double;} .b7 {border-style:groove;} .b
8 {border-style:ridge;} .b9 {border-style:inset;} .b10 {border-style:outset;} result specifications specification status comment css backgrounds and borders module level 3the definition of 'border-style' in that specification.
border-top-style - CSS: Cascading Style Sheets
yntax <line-style>where <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset examples html <table> <tr> <td class="b1">none</td> <td class="b2">hidden</td> <td class="b3">dotted</td> <td class="b4">dashed</td> </tr> <tr> <td class="b5">solid</td> <td class="b6">double</td> <td class="b7">groove</td> <td class="b
8">ridge</td> </tr> <tr> <td class="b9">inset</td> <td class="b10">outset</td> </tr> </table> css /* define look of the table */ table { border-width: 2px; background-color: #52e3
85; } tr, td { padding: 3px; } /* border-top-style example classes */ .b1 {border-top-style: none;} .b2 {border-top-style: hidden;} .b3 {border-top-style: dotted;} .b4 {border-top-style: dashed;} .b5...
... {border-top-style: solid;} .b6 {border-top-style: double;} .b7 {border-top-style: groove;} .b
8 {border-top-style: ridge;} .b9 {border-top-style: inset;} .b10 {border-top-style: outset;} result specifications specification status comment css backgrounds and borders module level 3the definition of 'border-top-style' in that specification.
box-sizing - CSS: Cascading Style Sheets
html <div class="content-box">content box</div> <br> <div class="border-box">border box</div> css div { width: 160px; height:
80px; padding: 20px; border:
8px solid red; background: yellow; } .content-box { box-sizing: content-box; /* total width: 160px + (2 * 20px) + (2 *
8px) = 216px total height:
80px + (2 * 20px) + (2 *
8px) = 136px content box width: 160px content box height:
80px */ } .border-box { box-sizing: border-box; /* total width: 160px total height:
80px content box w...
...idth: 160px - (2 * 20px) - (2 *
8px) = 104px content box height:
80px - (2 * 20px) - (2 *
8px) = 24px */ } result specifications specification status comment css basic user interface module level 3the definition of 'box-sizing' in that specification.
clip - CSS: Cascading Style Sheets
otherwiseanimation typea rectangle formal syntax <shape> | autowhere <shape> = rect(<top>, <right>, <bottom>, <left>) examples clipping an image css .dotted-border { border: dotted; position: relative; width: 536px; height: 350px; } #top-left, #middle, #bottom-right { position: absolute; top: 0; } #top-left { left: 360px; clip: rect(0 175px 113px 0); } #middle { left: 2
80px; clip: rect(119px 255px 229px
80px); } #bottom-right { left: 200px; clip: rect(235px 335px 345px 160px); } html <p class="dotted-border"> <img src="https://udn.realityripple.com/samples/
8f/15174f3500.jpg" title="original graphic"> <img id="top-left" src="https://udn.realityripple.com/samples/
8f/15174f3500.jpg" title="graphic clipped to upper left"> <img id="middle" src="https://...
...udn.realityripple.com/samples/
8f/15174f3500.jpg" title="graphic clipped towards middle"> <img id="bottom-right" src="https://udn.realityripple.com/samples/
8f/15174f3500.jpg" title="graphic clipped to bottom right"> </p> result specifications specification status comment css masking module level 1the definition of 'clip' in that specification.
column-rule - CSS: Cascading Style Sheets
syntax column-rule: dotted; column-rule: solid
8px; column-rule: solid blue; column-rule: thick inset blue; /* global values */ column-rule: inherit; column-rule: initial; column-rule: unset; the column-rule property is specified as one, two, or three of the values listed below, in any order.
...mation typeas each of the properties of the shorthand:column-rule-color: a colorcolumn-rule-style: discretecolumn-rule-width: a length formal syntax <'column-rule-width'> | <'column-rule-style'> | <'column-rule-color'> examples example 1 /* same as "medium dotted currentcolor" */ p.foo { column-rule: dotted; } /* same as "medium solid blue" */ p.bar { column-rule: solid blue; } /* same as "
8px solid currentcolor" */ p.baz { column-rule: solid
8px; } p.abc { column-rule: thick inset blue; } example 2 html <p class="content-box"> this is a bunch of text split into three columns.
content - CSS: Cascading Style Sheets
/* keywords that cannot be combined with other values */ content: normal; content: none; /* <image> values */ content: url("http://www.example.com/test.png"); content: linear-gradient(#e66465, #919
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(val...
... html <div id="replaced">mozilla</div> css #replaced { content: url("https://mdn.mozillademos.org/files/1266
8/mdn.svg"); } #replaced::after { /* will not show if element replacement is supported */ content: " (" attr(id) ")"; } result specifications specification status comment css generated content module level 3the definition of 'content' in that specification.
font-size-adjust - CSS: Cascading Style Sheets
ana">this text uses the verdana font (10px), which has relatively large lowercase letters.</p> <p class="adjtimes">this is the 10px times, but now adjusted to the same aspect ratio as the verdana.</p> css .times { font-family: times, serif; font-size: 10px; } .verdana { font-family: verdana, sans-serif; font-size: 10px; } .adjtimes { font-family: times, serif; font-size-adjust: 0.5
8; font-size: 10px; } results specifications specification status comment css fonts module level 3the definition of 'font-size-adjust' in that specification.
...from version 79: this feature is behind the enable experimental web platform features preference.firefox full support 40 full support 40 full support 3notes notes before firefox 40, font-size-adjust: 0 was incorrectly interpreted as font-size-adjust: none (bug 1144
885).
font-stretch - CSS: Cascading Style Sheets
keyword to numeric mapping the table below shows the mapping between keyword values and numeric percentages: keyword percentage ultra-condensed 50% extra-condensed 62.5% condensed 75% semi-condensed
87.5% normal 100% semi-expanded 112.5% expanded 125% extra-expanded 150% ultra-expanded 200% description some font families offer additional faces in which the characters are narrower than the normal face (condensed faces) or wider than the normal face (expanded faces).
... the table below demonstrates the effect of supplying various different percentage values of font-stretch on two different fonts: 50% 62.5% 75%
87.5% 100% 112.5% 125% 150% 200% helvetica neue league mono variable helvetica neue, which is installed by default on macos, has a single condensed face in addition to the normal face.
grid-auto-columns - CSS: Cascading Style Sheets
umns: auto; /* <length> values */ grid-auto-columns: 100px; grid-auto-columns: 20cm; grid-auto-columns: 50vmax; /* <percentage> values */ grid-auto-columns: 10%; grid-auto-columns: 33.3%; /* <flex> values */ grid-auto-columns: 0.5fr; grid-auto-columns: 3fr; /* minmax() values */ grid-auto-columns: minmax(100px, auto); grid-auto-columns: minmax(max-content, 2fr); grid-auto-columns: minmax(20%,
80vmax); /* fit-content() values */ grid-auto-columns: fit-content(400px); grid-auto-columns: fit-content(5cm); grid-auto-columns: fit-content(20%); /* multiple track-size values */ grid-auto-columns: min-content max-content auto; grid-auto-columns: 100px 150px 390px; grid-auto-columns: 10% 33.3%; grid-auto-columns: 0.5fr 3fr 1fr; grid-auto-columns: minmax(100px, auto) minmax(max-content, 2fr) mi...
...nmax(20%,
80vmax); grid-auto-columns: 100px minmax(100px, auto) 10% 0.5fr fit-content(400px); /* global values */ grid-auto-columns: inherit; grid-auto-columns: initial; grid-auto-columns: unset; values <length> is a non-negative length.
inset - CSS: Cascading Style Sheets
/* <length> values */ inset: 10px; /* value applied to all edges */ inset: 4px
8px; /* top/bottom left/right */ inset: 5px 15px 10px; /* top left/right bottom */ inset: 2.4em 3em 3em 3em; /* top right bottom left */ /* <percentage>s of the width (left/right) or height (top/bottom) of the containing block */ inset: 10% 5% 5% 5%; /* keyword value */ inset: auto; /* global values */ inset: inherit; inset: initial; inset: unset; syntax values the inset property takes the...
...imation typea length, percentage or calc(); formal syntax <'top'>{1,4} examples setting offsets for an element html <div> <span class="exampletext">example text</span> </div> css div { background-color: yellow; width: 150px; height: 120px; position: relative; } .exampletext { writing-mode: sideways-rl; position: absolute; inset: 20px 40px 30px 10px; background-color: #c
8c
800; } result specifications specification status comment css logical properties and values level 1the definition of 'inset' in that specification.
line-height-step - CSS: Cascading Style Sheets
/* point values */ line-height-step: 1
8pt; syntax the line-height-step property is specified as any one of the following: a <length>.
... :root { font-size: 12pt; --my-grid: 1
8pt; line-height-step: var(--my-grid); } h1 { font-size: 20pt; margin-top: calc(2 * var(--my-grid)); } the result of these rules is shown below in the following screenshot: specifications specification status comment css rhythmic sizingthe definition of 'line-height-step' in that specification.
mask-border - CSS: Cascading Style Sheets
div { width: 200px; background-color: lavender; border: 1
8px solid salmon; padding: 10px; /* prefixed longhand properties currently supported in chromium -webkit-mask-box-image-source: url(https://udn.realityripple.com/samples/2d/fd0
8a3134c.png); -webkit-mask-box-image-slice: 30 fill; -webkit-mask-box-image-width: 20px; -webkit-mask-box-image-repeat: round; -webkit-mask-box-image-outset: 1px; */ /* prefixed shorthand propert...
...y currently supported in chromium */ -webkit-mask-box-image: url("https://udn.realityripple.com/samples/2d/fd0
8a3134c.png") /* source */ 30 fill / /* slice */ 20px / /* width */ 1px /* outset */ round; /* repeat */ /* updated standard shorthand property, not supported anywhere yet */ mask-border: url("https://udn.realityripple.com/samples/2d/fd0
8a3134c.png") /* source */ 30 fill / /* slice */ 20px / /* width */ 1px /* outset */ round; /* repeat */ } result specifications specification status comment css masking module level 1the definition of 'mask-border' in that specification.
mask-type - CSS: Cascading Style Sheets
uted 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:xlink="http://www.w3.org/1999/xlink" 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(12
8, 12
8, 12
8); 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:xlink="http://www.w3.org/1999/xlink" w...
...idth="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(12
8, 12
8, 12
8); 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.
object-position - CSS: Cascading Style Sheets
19 full support 12prefixed prefixed implemented with the vendor prefix: -o-safari ios full support 10samsung internet android full support 2.0support for three-value syntax of positionchrome no support 31 — 6
8edge no support 16 — 79firefox no support 36 — 70ie no support noopera no support 19 — 55 no support 19 — 55 full support 11.6prefixed prefixed implemented with the vendor prefix: -o-safari ...
... full support 10webview android no support 4.4.3 — 6
8chrome android no support 31 — 6
8firefox android full support 36opera android no support 19 — 4
8 no support 19 — 4
8 full support 12prefixed prefixed implemented with the vendor prefix: -o-safari ios full support 10samsung internet android no support 2.0 — 10.0legend full support full support no support ...
offset-rotate - CSS: Cascading Style Sheets
it is the same as specifying a value of auto 1
80deg.
... formal syntax [ auto | reverse ] | <angle> examples setting element orientation along its offset path html <div></div> <div></div> <div></div> css div { width: 40px; height: 40px; background: #2bc4a2; margin: 20px; clip-path: polygon(0% 0%, 70% 0%, 100% 50%, 70% 100%, 0% 100%, 30% 50%); animation: move 5000ms infinite alternate ease-in-out; offset-path: path('m20,20 c20,50 1
80,-10 1
80,20'); } div:nth-child(1) { offset-rotate: auto; } div:nth-child(2) { offset-rotate: auto 90deg; } div:nth-child(3) { offset-rotate: 30deg; } @keyframes move { 100% { offset-distance: 100%; } } result specifications specification status comment motion path module level 1the definition of 'offset-rotate' in that specification.
opacity - CSS: Cascading Style Sheets
large text is defined as 1
8.66px and bold or larger, or 24px or larger.
...iv { background-color: yellow; } .light { opacity: 0.2; /* barely see the text over the background */ } .medium { opacity: 0.5; /* see the text more clearly over the background */ } .heavy { opacity: 0.9; /* see the text very clearly over the background */ } result setting opacity on hover html <img src="//developer.mozilla.org/static/img/opengraph-logo.png" alt="mdn logo" width="12
8" height="146" class="opacity"> css img.opacity { opacity: 1; filter: alpha(opacity=100); /* ie
8 and lower */ zoom: 1; /* triggers "haslayout" in ie 7 and lower */ } img.opacity:hover { opacity: 0.5; filter: alpha(opacity=50); zoom: 1; } result specifications specification status comment css color module level 4the definition of 'opacity' in that...
orphans - CSS: Cascading Style Sheets
it has a little bit more text than the first one.</p> </div> css div { background-color: #
8cffa0; height: 150px; columns: 3; orphans: 3; } p { background-color: #
8ca0ff; } p:first-child { margin-top: 0; } result specifications specification status comment css fragmentation module level 3the definition of 'orphans' in that specification.
...efirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetorphanschrome full support 25edge full support 12firefox no support noie full support
8opera full support 9.2safari full support 1.3webview android full support ≤37chrome android full support 25firefox android no support noopera android full su...
pointer-events - CSS: Cascading Style Sheets
full support 1.5ie full support 11opera full support 9safari full support 4webview android full support 2chrome android full support 1
8firefox android full support 4opera android full support 14safari ios full support 3.2samsung internet android full support 1.0applies to html elements experimentalchrome full support ...
... full support 3.6ie full support 11opera full support 15safari full support 4webview android full support 37chrome android full support 1
8firefox android full support 4opera android full support 14safari ios full support 3.2samsung internet android full support 1.0legend full support full...
repeating-linear-gradient() - CSS: Cascading Style Sheets
the values to top, to bottom, to left, and to right are equivalent to the angles 0deg, 1
80deg, 270deg, and 90deg respectively.
...dient(-45deg, transparent, transparent 20px, black 20px, black 40px); /* with multiple color stop lengths */ background-image: repeating-linear-gradient(-45deg, transparent 0 20px, black 20px 40px); } ten repeating horizontal bars body { width: 100vw; height: 100vh; } body { background-image: repeating-linear-gradient(to bottom, rgb(26,19
8,204), rgb(26,19
8,204) 7%, rgb(100,100,100) 10%); } because the last color stop is 10% and the gradient is vertical, each gradient in the repeated gradient is 10% of the height, fitting 10 horizontal bars.
ruby-position - CSS: Cascading Style Sheets
desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetruby-position experimentalchrome no support noedge no support 12 — 79firefox full support 3
8ie no support nonotes no support nonotes notes internet explorer 9 and later support an old draft values: inline (equivalent of having display: inline on the ruby), and above (synonym of the modern over).opera no support nosafari no support ...
...f ruby-position, -webkit-ruby-position: it has two properties: before and after (both equivalent, for ltr and rtl scripts to the standard over value used with ruby-align: start).webview android no support nochrome android no support nofirefox android full support 3
8opera android no support nosafari ios no support nonotes no support nonotes notes safari implements a non-standard, prefixed, version of ruby-position, -webkit-ruby-position: it has two properties: before and after (both equivalent, for ltr and rtl scripts to the ...
scroll-snap-stop - CSS: Cascading Style Sheets
css /* setup */ :root, body { height: 100%; display: flex; align-items: center; justify-content: space-between; flex-flow: column nowrap; font-family: monospace; } .container { display: flex; overflow: auto; outline: 1px dashed lightgray; flex: none; } .container.x { width: 100%; height: 12
8px; flex-flow: row nowrap; } .container.y { width: 256px; height: 256px; flex-flow: column nowrap; } /* definite scroll snap */ .mandatory-scroll-snapping > div { scroll-snap-stop: always; } .proximity-scroll-snapping > div { scroll-snap-stop: normal; } /* scroll-snap */ .x.mandatory-scroll-snapping { scroll-snap-type: x mandatory; } .y.mandatory-scroll-snapping { scroll-snap-typ...
...e: y mandatory; } .x.proximity-scroll-snapping { scroll-snap-type: x proximity; } .y.proximity-scroll-snapping { scroll-snap-type: y proximity; } .container > div { text-align: center; scroll-snap-align: center; flex: none; } .x.container > div { line-height: 12
8px; font-size: 64px; width: 100%; height: 12
8px; } .y.container > div { line-height: 256px; font-size: 12
8px; width: 256px; height: 256px; } /* appearance fixes */ .y.container > div:first-child { line-height: 1.3; font-size: 64px; } /* coloration */ .container > div:nth-child(even) { background-color: #
87ea
87; } .container > div:nth-child(odd) { background-color: #
87ccea; } html <div class="container x mandatory-scroll-snapping" dir="ltr"> <div>x mand.
scroll-snap-type - CSS: Cascading Style Sheets
<div>3</div> <div>4</div> <div>5</div> </div> </div> css /* setup */ html, body, .holster { height: 100%; } .holster { display: flex; align-items: center; justify-content: space-between; flex-flow: column nowrap; font-family: monospace; } .container { display: flex; overflow: auto; outline: 1px dashed lightgray; flex: none; } .container.x { width: 100%; height: 12
8px; flex-flow: row nowrap; } .container.y { width: 256px; height: 256px; flex-flow: column nowrap; } /* scroll-snap */ .x.mandatory-scroll-snapping { scroll-snap-type: x mandatory; } .y.mandatory-scroll-snapping { scroll-snap-type: y mandatory; } .x.proximity-scroll-snapping { scroll-snap-type: x proximity; } .y.proximity-scroll-snapping { scroll-snap-type: y proximity; } .con...
...tainer > div { text-align: center; scroll-snap-align: center; flex: none; } .x.container > div { line-height: 12
8px; font-size: 64px; width: 100%; height: 12
8px; } .y.container > div { line-height: 256px; font-size: 12
8px; width: 256px; height: 100%; } /* appearance fixes */ .y.container > div:first-child { line-height: 1.3; font-size: 64px; } /* coloration */ .container > div:nth-child(even) { background-color: #
87ea
87; } .container > div:nth-child(odd) { background-color: #
87ccea; } results specifications specification status comment css scroll snap module level 1the definition of 'scroll-snap-type' in that specification.
<shape> - CSS: Cascading Style Sheets
full support 1ie full support 5.5opera full support 9.5safari full support 1.3webview android full support 37chrome android full support 1
8firefox android full support 4opera android full support 14safari ios full support 1samsung internet android full support 1.0rect() deprecatedchrome full support 1edge ...
...for internet explorer
8 and later versions, only the standard comma-separated syntax is supported.opera full support 9.5safari full support 1.3webview android full support 37chrome android full support 1
8firefox android full su...
tab-size - CSS: Cascading Style Sheets
formal definition initial value
8applies toblock containersinheritedyescomputed valuethe specified integer or an absolute lengthanimation typea length formal syntax <integer> | <length> examples expanding by character count pre { tab-size: 4; /* set tab size to 4 characters wide */ } collapse tabs pre { tab-size: 0; /* remove indentation */ } comparing to the default size this example compares a default tab size wi...
... html <p>no tab</p> <p>	default tab size of
8 characters wide</p> <p class="custom">	custom tab size of 3 characters wide</p> <p> 3 spaces, equivalent to the custom tab size</p> css p { white-space: pre; } .custom { tab-size: 3; -moz-tab-size: 3; } result specifications specification status comment css text module level 3the definition of 'tab-size' in that specification.
text-size-adjust - CSS: Cascading Style Sheets
/* keyword values */ text-size-adjust: none; text-size-adjust: auto; /* <percentage> value */ text-size-adjust:
80%; /* global values */ text-size-adjust: inherit; text-size-adjust: initial; text-size-adjust: unset; because many websites have not been developed with small devices in mind, mobile browsers differ from desktop browsers in the way they render web pages.
... instead of laying out pages at the width of the device screen, they lay them out using a viewport that is much wider, usually
800 or 1000 pixels.
text-transform - CSS: Cascading Style Sheets
full-width (general) <p>initial string <strong>01234567
89abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyz!"#$%&()*+,-./:;<=>?@{|}~</strong> </p> <p>text-transform: full-width <strong><span>01234567
89abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyz!"#$%&()*+,-./:;<=>?@{|}~</span></strong> </p> span { text-transform: full-width; } strong { width: 100%; float: right; } some characters exists in two formats, normal width and a full-width, wit...
...ll-width (japanese half-width katakana) <p>initial string <strong>ウェブプログラミングの勉強</strong> </p> <p>text-transform: full-width <strong><span>ウェブプログラミングの勉強</span></strong> </p> span { text-transform: full-width; } strong { width: 100%; float: right; } the japanese half-width katakana was used to represent katakana in
8-bit character codes.
matrix3d() - CSS: Cascading Style Sheets
0deg) matrix3d(1,0,0,0,0,1,6,0,0,0,1,0,50,100,0,1.1); } .face { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; position: absolute; backface-visibility: inherit; font-size: 60px; color: #fff; } .front { background: rgba(90,90,90,.7); transform: translatez(50px); } .back { background: rgba(0,210,0,.7); transform: rotatey(1
80deg) translatez(50px); } .right { background: rgba(210,0,0,.7); transform: rotatey(90deg) translatez(50px); } .left { background: rgba(0,0,210,.7); transform: rotatey(-90deg) translatez(50px); } .top { background: rgba(210,210,0,.7); transform: rotatex(90deg) translatez(50px); } .bottom { background: rgba(210,0,210,.7); transform: rotatex(-90deg) translatez(50px); } result ...
...</div> css html { width: 100%; } body { height: 100vh; /* centering content */ display: flex; flex-flow: row wrap; justify-content: center; align-content: center; } .foo { width: 50%; padding: 1em; color: white; background: #ff
8c66; border: 2px dashed black; text-align: center; font-family: system-ui, sans-serif; font-size: 14px; /* setting up animation for better demonstration */ animation: motionscale 2s alternate linear infinite; } @keyframes motionscale { from { /* identity matrix is used as basis here.
scaleY() - CSS: Cascading Style Sheets
transform: rotatex(1
80deg); === transform: scaley(-1); syntax scaley(s) values s is a <number> representing the scaling factor to apply on the ordinate of each point of the element.
... cartesian coordinates on ℝ2 homogeneous coordinates on ℝℙ2 cartesian coordinates on ℝ3 homogeneous coordinates on ℝℙ3 10 0s 1000s0001 1000s0001 10000s0000100001 [1 0 0 s 0 0] examples html <div>normal</div> <div class="scaled">scaled</div> css div { width:
80px; height:
80px; background-color: skyblue; } .scaled { transform: scaley(0.6); background-color: pink; } result specifications specification status comment css transforms level 1the definition of 'scaley()' in that specification.
<transform-function> - CSS: Cascading Style Sheets
>skew(17deg, 13deg)</option> <option>skewx(17deg)</option> <option>skewy(17deg)</option> <option>translate(100px, 100px)</option> <option>translatex(100px)</option> <option>translatey(100px)</option> <option>translatez(100px)</option> <option>translate3d(50px, 50px, 50px)</option> <option>perspective(200px)</option> <option>matrix(1, 2, -1, 1,
80,
80)</option> <option>matrix3d(1,0,0,0,0,1,3,0,0,0,1,0,50,100,0,1.1)</option> </select> </div> </main> css main { width: 400px; height: 200px; padding: 50px; background-image: linear-gradient(135deg, white, cyan, white); } #example-element { width: 100px; height: 100px; transform-style: preserve-3d; transition: transform 1.5s; transform: rotate3d(1, 1, 1, 30deg);...
... } .face { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; position: absolute; backface-visibility: inherit; font-size: 60px; color: #fff; } .front { background: rgba(90,90,90,.7); transform: translatez(50px); } .back { background: rgba(0,210,0,.7); transform: rotatey(1
80deg) translatez(50px); } .right { background: rgba(210,0,0,.7); transform: rotatey(90deg) translatez(50px); } .left { background: rgba(0,0,210,.7); transform: rotatey(-90deg) translatez(50px); } .top { background: rgba(210,210,0,.7); transform: rotatex(90deg) translatez(50px); } .bottom { background: rgba(210,0,210,.7); transform: rotatex(-90deg) translatez(50px); } .select-form { margin-top: 50px; } javascript const select...
vertical-align - CSS: Cascading Style Sheets
" src="https://udn.realityripple.com/samples/16/ed9c61c3b6.png"/> -100%:<img style="vertical-align:-100%" src="https://udn.realityripple.com/samples/16/ed9c61c3b6.png"/> </p> #* { box-sizing: border-box; } img { margin-right: 0.5em; } p { height: 3em; padding: 0 .5em; font-family: monospace; text-decoration: underline overline; margin-left: auto; margin-right: auto; width:
80%; } to vertically align the content of a cell in a table: <table> <tr> <td style="vertical-align: baseline">baseline</td> <td style="vertical-align: top">top</td> <td style="vertical-align: middle">middle</td> <td style="vertical-align: bottom">bottom</td> <td> <p>there is a theory which states that if ever anyone discovers exactly what the universe is for a...
...nd why it is here, it will instantly disappear and be replaced by something even more bizarre and inexplicable.</p> <p>there is another theory which states that this has already happened.</p> </td> </tr> </table> table { margin-left: auto; margin-right: auto; width:
80%; } table, th, td { border: 1px solid black; } td { padding: 0.5em; font-family: monospace; } note that vertical-align only applies to inline, inline-block and table-cell elements: you can't use it to vertically align block-level elements.
z-index - CSS: Cascading Style Sheets
syntax /* keyword value */ z-index: auto; /* <integer> values */ z-index: 0; z-index: 3; z-index: 2
89; z-index: -1; /* negative values to lower the priority */ /* global values */ z-index: inherit; z-index: initial; z-index: unset; the z-index property is specified as either the keyword auto or an <integer>.
... topositioned elementsinheritednocomputed valueas specifiedanimation typean integercreates stacking contextyes formal syntax auto | <integer> examples visually layering elements html <div class="dashed-box">dashed box <span class="gold-box">gold box</span> <span class="green-box">green box</span> </div> css .dashed-box { position: relative; z-index: 1; border: dashed; height:
8em; margin-bottom: 1em; margin-top: 2em; } .gold-box { position: absolute; z-index: 3; /* put .gold-box above .green-box and .dashed-box */ background: gold; width:
80%; left: 60px; top: 3em; } .green-box { position: absolute; z-index: 2; /* put .green-box above .dashed-box */ background: lightgreen; width: 20%; left: 65%; top: -25px; height: 7em; opacity: 0.9; } ...
Adding captions and subtitles to HTML5 video - Developer guides
no image is used for the captions button, so it is simply styled as: .controls button[data-state="subtitles"] { height:
85%; text-indent:0; font-size:16px; font-size:1rem; font-weight:bold; color:#666; background:#000; border-radius:2px; } there are also other css changes that are specific to some extra javascript implementation, but these will be mentioned at the appropriate place below.
...'none' : 'block'); } }); subtitle menu css we also added some rudimentary styling for the newly created subtitles menu: .subtitles-menu { display:none; position:absolute; bottom:14.
8%; right:20px; background:#666; list-style-type:none; margin:0; padding:0; width:100px; padding:10px; } .subtitles-menu li { padding:0; text-align:center; } .subtitles-menu li button { border:none; background:#000; color:#fff; cursor:pointer; width:90%; padding:2px 5px; border-radius:2px; } styling the displayed subtitles one of t...
Live streaming web audio and video - Developer guides
mpeg-dash dash stands for dynamic adaptive streaming over http and is a new format that has recently seen support added to chrome, and internet explorer 11 running on windows
8.1.
... at the start of the streaming session, an extended m3u (m3u
8) playlist is downloaded.
Mutation events - Developer guides
they are expected to be included in firefox 14 and chrome 1
8.
... cross-browser support these events are not implemented consistently across different browsers, for example: ie prior to version 9 didn't support the mutation events at all and does not implement some of them correctly in version 9 (for example, domnodeinserted) webkit doesn't support domattrmodified (see webkit bug
8191 and the workaround) "mutation name events", i.e.
Using HTML sections and outlines - Developer guides
if a significant percentage of your particular target audience is using internet explorer
8 or older, then you can follow the below instructions to make them behave as expected.
...be enabled.</strong></p> <p>javascript is an object-oriented computer programming language commonly used to create interactive effects within web browsers.</p> <p><a href="https://goo.gl/koeeaj">how to enable javascript?</a></p> </noscript> this leads to the following code to allow the support of the html5 sections and headings elements in non-html5 browsers, even for internet explorer (
8 and older), with a proper fallback for the case where this latter browser is configured not to use scripting: <!--[if lt ie 9]> <script> document.createelement("article"); document.createelement("aside"); document.createelement("footer"); document.createelement("header"); document.createelement("nav"); document.createelement("section"); document.createelement("time"...
Printing - Developer guides
open and automatically close a popup window when finished if you want to be able to automatically close a popup window (for example, the printer-friendly version of a document) after the user prints its contents, you can use code like this: <!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-
8" /> <title>javascript window close example </title> <script type="text/javascript"> function popuponclick() { my_window = window.open('', 'mywindow', 'status=1,width=350,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 ...
...the following is a possible example which will print a file named externalpage.html: <!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-
8" /> <title>mdn example</title> <script type="text/javascript"> function closeprint () { document.body.removechild(this.__container__); } function setprint () { this.contentwindow.__container__ = this; this.contentwindow.onbeforeunload = closeprint; this.contentwindow.onafterprint = closeprint; this.contentwindow.focus(); // required for ie this.contentwindow.print(); } function prin...
<aside>: The Aside element - HTML: Hypertext Markup Language
the paragraph is only indirectly related to the main article content: <article> <p> the disney movie <cite>the little mermaid</cite> was first released to theatres in 19
89.
... </p> <aside> <p> the movie earned $
87 million during its initial release.
<input type="email"> - HTML: Hypertext Markup Language
see w3c bug 154
89 for details.
...ailaddress">your e-mail address</label><br> <input id="emailaddress" type="email" size="64" maxlength="64" required placeholder="username@beststartupever.com" pattern=".+@beststartupever.com" title="please provide only a best startup ever corporate e-mail address"> </div> <div class="messagebox"> <label for="message">request</label><br> <textarea id="message" cols="
80" rows="
8" required placeholder="my shoes are too tight, and i have forgotten how to dance."></textarea> </div> <input type="submit" value="send request"> </form> our <form> contains one <input> of type email for the user's e-mail address, a <textarea> to enter their message for it into, and an <input> of type "submit", which creates a button to submit the form.
<input type="url"> - HTML: Hypertext Markup Language
the example below creates a 30-character wide url address entry box, requiring that the contents be no shorter than 10 characters and no longer than
80 characters.
... <input id="myurl" name="myurl" type="url" size="30" minlength="10" maxlength="
80"> note: these attributes also affect validation; a value shorter or longer than the specified minimum/maximum lengths will be classified as invalid; in addition most browsers will simply refuse to let the user enter a value longer than the specified maximum length.
<script>: The Script element - HTML: Hypertext Markup Language
deprecated attributes charset if present, its value must be an ascii case-insensitive match for "utf-
8".
... it’s unnecessary to specify the charset attribute, because documents must use utf-
8, and the script element inherits its character encoding from the document.
<sub>: The Subscript element - HTML: Hypertext Markup Language
denoting the number of atoms of a given element within a chemical formula (such as every developer's best friend, c
8h10n4o2, otherwise known as "caffeine").
... another example: <p>almost every developer's favorite molecule is c<sub>
8</sub>h<sub>10</sub>n<sub>4</sub>o<sub>2</sub>, which is commonly known as "caffeine."</p> the output: specifications specification status comment html living standardthe definition of '<sub> and <sup>' in that specification.
<time> - HTML: Hypertext Markup Language
valid datetime values a valid year string 2011 a valid month string 2011-11 a valid date string 2011-11-1
8 a valid yearless date string 11-1
8 a valid week string 2011-w47 a valid time string 14:54 14:54:39 14:54:39.929 a valid local date and time string 2011-11-1
8t14:54:39.929 2011-11-1
8 14:54:39.929 a valid global date and time string 2011-11-1
8t14:54:39.929z 2011-11-1
8t14:54:39.929-0400 2011-11-1
8t14:54:39.929-04:00 2011-11-1
8 14:54:39.929z 2011-11-1
8 14:54:39.929-0400 2011-11-1
8 1...
...4:54:39.929-04:00 a valid duration string pt4h1
8m3s examples simple example html <p>the concert starts at <time datetime="201
8-07-07t20:00:00">20:00</time>.</p> output datetime example html <p>the concert took place on <time datetime="2001-05-15t19:00">may 15</time>.</p> output specifications specification status comment html living standardthe definition of '<time>' in that specification.
itemid - HTML: Hypertext Markup Language
example html <dl itemscope itemtype="http://vocab.example.net/book" itemid="urn:isbn:0-330-34032-
8"> <dt>title <dd itemprop="title">the reality dysfunction <dt>author <dd itemprop="author">peter f.
... hamilton <dt>publication date <dd><time itemprop="pubdate" datetime="1996-01-26">26 january 1996</time> </dl> structured data itemscope itemtype: itemid http://vocab.example.net/book: urn:isbn:0-330-34032-
8 itemprop title the reality dysfunction itemprop author peter f.
Microdata - HTML: Hypertext Markup Language
.org/softwareapplication"> <span itemprop="name">angry birds</span> - requires <span itemprop="operatingsystem">android</span><br> <link itemprop="applicationcategory" href="http://schema.org/gameapplication"/> <div itemprop="aggregaterating" itemscope itemtype="http://schema.org/aggregaterating"> rating: <span itemprop="ratingvalue">4.6</span> ( <span itemprop="ratingcount">
8864</span> ratings ) </div> <div itemprop="offers" itemscope itemtype="http://schema.org/offer"> price: $<span itemprop="price">1.00</span> <meta itemprop="pricecurrency" content="usd" /> </div> </div> structured data itemscope itemtype softwareapplication (http://schema.org/softwareapplication) itemprop name angry birds itemprop oper...
...atingsystem android itemprop applicationcategory gameapplication (http://schema.org/gameapplication) itemscope itemprop[itemtype] aggregaterating [aggregaterating] itemprop ratingvalue 4.6 itemprop ratingcount
8864 itemscope itemprop[itemtype] offers [offer] itemprop price 1.00 itemprop pricecurrency usd result note: a handy tool for extracting microdata structures from html is google's structured data testing tool.
Quirks Mode and Standards Mode - HTML: Hypertext Markup Language
to ensure that your page uses full standards mode, make sure that your page has a doctype like in this example: <!doctype html> <html lang="en"> <head> <meta charset=utf-
8> <title>hello world!</title> </head> <body> </body> </html> the doctype shown in the example, <!doctype html>, is the simplest possible, and the one recommended by html5.
...note however that serving your pages as application/xhtml+xml will cause internet explorer
8 to show a download dialog box for an unknown format instead of displaying your page, as the first version of internet explorer with support for xhtml is internet explorer 9.
Resource URLs - HTTP
for example: http://searchfox.org/mozilla-central/rev/4
8ea452
803907f2575d
81021e
867
8634e
8067fc2/browser/app/profile/firefox.js#575 web sites can easily collect firefox default preferences by overriding this pref() function and using the script resource:///defaults/preferences/firefox.js.
... solution in order to fix this problem, mozilla changed the behavior of loading resource: uris in bug
863246, which landed in firefox 57 (quantum).
Browser detection using the user agent - HTTP
mozilla/5.0 (linux; android 4.4.2); nexus 5 build/kot49h) applewebkit/537.36 (khtml, like gecko) chrome/33.0.1750.117 mobile safari/537.36 opr/20.0.1396.72047 presto-based (opera 12-) opera mobi/xyz token in the comment (opera 12-) opera/9.
80 (android 2.3.3; linux; opera mobi/adr-1111101157; u; es-es) presto/2.9.201 version/11.50 internet explorer iemobile/xyz token in the comment.
... mozilla/5.0 (windows phone 10.0; android 6.0.1; xbox; xbox one) applewebkit/537.36 (khtml, like gecko) chrome/5
8.0.3029.110 mobile safari/537.36 edge/16.16299 in summary, we recommend looking for the string “mobi” anywhere in the user agent to detect a mobile device.
Reason: CORS request not HTTP - HTTP
local file security in firefox 6
8 when a user opened a page using a file:/// uri in firefox 67 and earlier, the origin of the page was defined as the directory from which the page was opened.
... in response to cve-2019-11730, firefox 6
8 and later define the origin of a page opened using a file:/// uri as unique.
Configuring servers for Ogg media - HTTP
the output from oggz-info looks like this: $ oggz-info /g/media/bruce_vs_ironman.ogv content-duration: 00:01:00.046 skeleton: serialno 197622343
8 4 packets in 3 pages, 1.3 packets/page, 27.50
8% ogg overhead presentation-time: 0.000 basetime: 0.000 theora: serialno 0170995062 1790 packets in 106
8 pages, 1.7 packets/page, 1.049% ogg overhead video-framerate: 29.9
83 fps video-width: 640 video-height: 360 vorbis: serialno 070
89966
88 4531 packets in 167 pages, 27.1 pack...
...ets/page, 1.40
8% ogg overhead audio-samplerate: 44100 hz audio-channels: 2 note that you can't simply serve up the reported content-duration line reported by oggz-info, because it's reported in hh:mm:ss format.
Using HTTP cookies - HTTP
for example: set-cookie: id=a3fwa; expires=wed, 31 oct 2021 07:2
8:00 gmt; note: when an expires date is set, the time and date set is relative to the client the cookie is being set on, not the server.
... here is an example: set-cookie: id=a3fwa; expires=wed, 21 oct 2021 07:2
8:00 gmt; secure; httponly define where cookies are sent the domain and path attributes define the scope of the cookie: what urls the cookies should be sent to.
Cross-Origin Resource Policy (CORP) - HTTP
history the concept was originally proposed in 2012 (as from-origin), but resurrected in q2 of 201
8 and implemented in safari and chromium.
... in early 201
8, two side-channel hardware vulnerabilities known as meltdown and spectre were disclosed.
Accept-Encoding - HTTP
typically, microsoft recommends not to compress if a server uses more than
80% of its computational power.
... examples accept-encoding: gzip accept-encoding: gzip, compress, br accept-encoding: br;q=1.0, gzip;q=0.
8, *;q=0.1 specifications specification title rfc 7231, section 5.3.4: accept-encoding hypertext transfer protocol (http/1.1): semantics and context ...
Accept - HTTP
syntax accept: <mime_type>/<mime_subtype> accept: <mime_type>/* accept: */* // multiple types, weighted with the quality value syntax: accept: text/html, application/xhtml+xml, application/xml;q=0.9, image/webp, */*;q=0.
8 directives <mime_type>/<mime_subtype> a single, precise mime type, like text/html.
... examples accept: text/html accept: image/* // general default accept: */* // default for navigation requests accept: text/html, application/xhtml+xml, application/xml;q=0.9, */*;q=0.
8 specifications specification title rfc 7231, section 5.3.2: accept hypertext transfer protocol (http/1.1): semantics and context ...
Content-Location - HTTP
the server specifies where the new post is with content-location: http/1.1 201 created content-type: text/plain; charset=utf-
8 content-location: /my-first-blog-post ✅ success!
... http/1.1 200 ok content-type: text/html; charset=utf-
8 content-location: /my-receipts/3
8 <!doctype html> (lots of html…) <p>you sent $3
8.00 to exampleuser.</p> (lots more html…) specifications specification title rfc 7231, section 3.1.4.2: content-location hypertext transfer protocol (http/1.1): semantics and content ...
CSP: report-to - HTTP
report-to: { "group": "csp-endpoint", "max_age": 10
886400, "endpoints": [ { "url": "https://example.com/csp-reports" } ] }, { "group": "hpkp-endpoint", "max_age": 10
886400, "endpoints": [ { "url": "https://example.com/hpkp-reports" } ] } content-security-policy: ...; report-to csp-endpoint report-to: { "group": "endpoint-1", "max...
..._age": 10
886400, "endpoints": [ { "url": "https://example.com/reports" }, { "url": "https://backup.com/reports" } ] } content-security-policy: ...; report-to endpoint-1 ...
Device-Memory - HTTP
the header takes on the following values: 0.25, 0.5, 1, 2, 4,
8.
... accept-ch: device-memory accept-ch-lifetime:
86400 then on subsequent requests the client might send device-memory header back: device-memory: 1 specifications specification status comment device memory 1the definition of 'device-memory' in that specification.
Digest - HTTP
header type response header forbidden header name no syntax digest: <digest-algorithm>=<digest-value> digest: <digest-algorithm>=<digest-value>,<digest-algorithm>=<digest-value> directives <digest-algorithm> supported digest algorithms are defined in rfc 3230 and rfc 5
843, and include sha-256 and sha-512.
... examples digest: sha-256=x4
8e9qookqqrvdts
8nojrjn3owduoywxbf7kbu9dbpe= digest: sha-256=x4
8e9qookqqrvdts
8nojrjn3owduoywxbf7kbu9dbpe=,unixsum=30637 specifications specification title draft-ietf-httpbis-digest-headers-latest resource digests for http this header was originally defined in rfc 3230, but the definition of "selected representation" in rfc 7231 made the original definitio...
Forwarded - HTTP
examples using the forwarded header forwarded: for="_mdn" # case insensitive forwarded: for="[2001:db
8:cafe::17]:4711" # separated by semicolon forwarded: for=192.0.2.60;proto=http;by=203.0.113.43 # multiple values can be appended using a comma forwarded: for=192.0.2.43, for=19
8.51.100.17 transitioning from x-forwarded-for to forwarded if your application, server, or proxy supports the standardized forwarded header, the x-forwarded-for header can be replaced.
... x-forwarded-for: 123.34.567.
89 forwarded: for=123.34.567.
89 x-forwarded-for: 192.0.2.43, "[2001:db
8:cafe::17]" forwarded: for=192.0.2.43, for="[2001:db
8:cafe::17]" specifications specification title rfc 7239, section 4: forwarded forwarded http extension ...
Origin - HTTP
note: the origin header is not set on fetch requests with a method of head or get (this behavior was corrected in firefox 65 — see bug 150
8661).
...if no port is given, the default port for the service requested (e.g., "
80" for an http url) is implied.
Public-Key-Pins-Report-Only - HTTP
example public-key-pins-report-only: pin-sha256="cupctazwkaasuywhhnedttwpy3obake3h2+sozs7sws="; pin-sha256="m
8hztczm3eluxkcjr2s5p4hhybnf6lhkmjahkhpgpwe="; includesubdomains; report-uri="https://www.example.org/hpkp-report" in this example, pin-sha256="cupctazwkaasuywhhnedttwpy3obake3h2+sozs7sws=" pins the server's public key used in production.
... the second pin declaration pin-sha256="m
8hztczm3eluxkcjr2s5p4hhybnf6lhkmjahkhpgpwe=" also pins the backup key.
Save-Data - HTTP
note: disabling http/2 server push (rfc 7540, section
8.2: server push) might be desirable too for reducing data downloads.
... with save-data: on request: get /image.jpg http/1.0 host: example.com save-data: on response: http/1.0 200 ok content-length: 102
832 vary: accept-encoding, save-data cache-control: public, max-age=31536000 content-type: image/jpeg [...] without save-data request: get /image.jpg http/1.0 host: example.com response: http/1.0 200 ok content-length: 4
81770 vary: accept-encoding, save-data cache-control: public, max-age=31536000 content-type: image/jpeg [...] specifications specification title dra...
Want-Digest - HTTP
header type general header forbidden header name no syntax want-digest: <digest-algorithm> // multiple algorithms, weighted with the quality value syntax: want-digest: <digest-algorithm><q-value>,<digest-algorithm><q-value> directives <digest-algorithm> supported digest algorithms are defined in rfc 3230 and rfc 5
843, and include sha-256 and sha-512.
... examples want-digest: sha-256 want-digest: sha-512;q=0.3, sha-256;q=1, md5;q=0 basic operation the sender provides a list of digests which it is prepared to accept, and the server uses one of them: request: get /item want-digest: sha-256;q=0.3, sha;q=1 response: http/1.1 200 ok digest: sha-256=x4
8e9qookqqrvdts
8nojrjn3owduoywxbf7kbu9dbpe= unsupported digests the server does not support any of the requested digest algorithms, so uses a different algorithm: request: get /item want-digest: sha;q=1 response: http/1.1 200 ok digest: sha-256=x4
8e9qookqqrvdts
8nojrjn3owduoywxbf7kbu9dbpe= the server does not support any of the requested digest algorithms, so responds with a 400 error ...
Network Error Logging - HTTP
http 400 (bad request) response { "age": 20, "type": "network-error", "url": "https://example.com/previous-page", "body": { "elapsed_time": 33
8, "method": "post", "phase": "application", "protocol": "http/1.1", "referrer": "https://example.com/previous-page", "sampling_fraction": 1, "server_ip": "137.205.2
8.66", "status_code": 400, "type": "http.error", "url": "https://example.com/bad-request" } } dns name not resolved note that the phase is set to dns in this report and no server_ip is available ...
... { "age": 20, "type": "network-error", "url": "https://example.com/previous-page", "body": { "elapsed_time": 1
8, "method": "post", "phase": "dns", "protocol": "http/1.1", "referrer": "https://example.com/previous-page", "sampling_fraction": 1, "server_ip": "", "status_code": 0, "type": "dns.name_not_resolved", "url": "https://example-host.com/" } } the type of the network error may be one of the following pre-defined values from the specification, but browsers can add and send their own error types: dns.unreachable the user's dns server is unreachable dns.name_not_resolved the user's dns server responded but was unable to resolve an ip address for the requested uri.
An overview of HTTP - HTTP
for example: get / http/1.1 host: developer.mozilla.org accept-language: fr read the response sent by the server, such as: http/1.1 200 ok date: sat, 09 oct 2010 14:2
8:02 gmt server: apache last-modified: tue, 01 dec 2009 20:1
8:22 gmt etag: "51142bc1-7449-479b075b2
891b" accept-ranges: bytes content-length: 29769 content-type: text/html <!doctype html...
... the path of the resource to fetch; the url of the resource stripped from elements that are obvious from the context, for example without the protocol (http://), the domain (here, developer.mozilla.org), or the tcp port (here,
80).
HTTP range requests - HTTP
http/1.1 206 partial content content-type: multipart/byteranges; boundary=3d6b6a416f9b5 content-length: 2
82 --3d6b6a416f9b5 content-type: text/html content-range: bytes 0-50/1270 <!doctype html> <html> <head> <title>example do --3d6b6a416f9b5 content-type: text/html content-range: bytes 100-150/1270 eta http-equiv="content-type" content="text/html; c --3d6b6a416f9b5-- conditional range requests when resuming to request more parts of a resource, you need to guarantee that the stored resource h...
... if-range: wed, 21 oct 2015 07:2
8:00 gmt partial request responses there are three relevant statuses, when working with range requests: in case of a successful range request, the 206 partial content status is sent back from a server.
507 Insufficient Storage - HTTP
the hypertext transfer protocol (http) 507 insufficient storage response status code may be given in the context of the web distributed authoring and versioning (webdav) protocol (see rfc 491
8).
... status 507 insufficient storage specifications specification title rfc 491
8, section 11.5: 507 insufficient storage web distributed authoring and versioning ...
JavaScript data types and data structures - JavaScript
the following table helps determine the equivalent c data types: type value range size in bytes description web idl type equivalent c type int
8array -12
8 to 127 1
8-bit two's complement signed integer byte int
8_t uint
8array 0 to 255 1
8-bit unsigned integer octet uint
8_t uint
8clampedarray 0 to 255 1
8-bit unsigned integer (clamped) octet uint
8_t int16array -3276
8 to 32767 2 16-bit two's complement signed integer short int16_t uint16array 0 ...
...to 65535 2 16-bit unsigned integer unsigned short uint16_t int32array -21474
8364
8 to 21474
83647 4 32-bit two's complement signed integer long int32_t uint32array 0 to 4294967295 4 32-bit unsigned integer unsigned long uint32_t float32array 1.2×10-3
8 to 3.4×103
8 4 32-bit ieee floating point number (7 significant digits e.g., 1.1234567) unrestricted float float float64array 5.0×10-324 to 1.
8×1030
8 8 64-bit ieee floating point number (16 significant digits e.g., 1.123...15) unrestricted double double bigint64array -263 to 263-1
8 64-bit two's complement signed integer bigint int64_t (signed long long) biguint64array 0 to 264-1
8 64-bit unsign...
RangeError: radix must be an integer - JavaScript
the most common radixes: 2 for binary numbers,
8 for octal numbers, 10 for decimal numbers, 16 for hexadecimal numbers.
... examples invalid cases (42).tostring(0); (42).tostring(1); (42).tostring(37); (42).tostring(150); // you cannot use a string like this for formatting: (120719
89).tostring('mm-dd-yyyy'); valid cases (42).tostring(2); // "101010" (binary) (13).tostring(
8); // "15" (octal) (0x42).tostring(10); // "66" (decimal) (100000).tostring(16) // "1
86a0" (hexadecimal) ...
Warning: Date.prototype.toLocaleFormat is deprecated - JavaScript
the function is no longer available in firefox 5
8+.
... var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }; var dateformatter = new intl.datetimeformat('de-de', options) var dates = [date.utc(2012, 11, 20, 3, 0, 0), date.utc(2014, 04, 12,
8, 0, 0)]; dates.foreach(date => console.log(dateformatter.format(date))); // "donnerstag, 20.
RangeError: repeat count must be less than infinity - JavaScript
in firefox (spidermonkey) the maximum string size is 22
8 -1 (0xfffffff).
... examples invalid cases 'abc'.repeat(infinity); // rangeerror 'a'.repeat(2**2
8); // rangeerror valid cases 'abc'.repeat(0); // '' 'abc'.repeat(1); // 'abc' 'abc'.repeat(2); // 'abcabc' 'abc'.repeat(3.5); // 'abcabcabc' (count will be converted to integer) ...
TypeError: invalid arguments - JavaScript
examples no strings in typed arrays typed arrays, for example a uint
8array, can't be constructed from a string.
... var ta = new uint
8array("nope"); // typeerror: invalid arguments different ways to create a valid uint
8array: // from a length var uint
8 = new uint
8array(2); uint
8[0] = 42; console.log(uint
8[0]); // 42 console.log(uint
8.length); // 2 console.log(uint
8.bytes_per_element); // 1 // from an array var arr = new uint
8array([21,31]); console.log(arr[1]); // 31 // from another typedarray var x = new uint
8array([21, 31]); var y = new uint
8array(x); console.log(y[0]); // 21 // from an arraybuffer var buffer = new arraybuffer(
8); var z = new uint
8array(buffer, 1, 4); // from an iterable var iterable = function*(){ yield* [1,2,3]; }(); var uint
8 = new uint
8array(iterable); // uint
8array[1, 2, 3] ...
arguments.callee - JavaScript
1 : factorial(n - 1)*n; }); this has numerous benefits: the function can be called like any other from inside your code it does not create a variable in the outer scope (except for ie
8 and below) it has better performance than accessing the arguments object another feature that was deprecated was arguments.callee.caller, or more specifically function.caller.
... function create() { return function(n) { if (n <= 1) return 1; return n * arguments.callee(n - 1); }; } var result = create()(5); // returns 120 (5 * 4 * 3 * 2 * 1) a use of arguments.callee with no good alternative however, in a case like the following, there are not alternatives to arguments.callee, so its deprecation could be a bug (see bug 72539
8): function createperson(sidentity) { var operson = new function('alert(arguments.callee.identity);'); operson.identity = sidentity; return operson; } var john = createperson('john smith'); john(); specifications specification ecmascript (ecma-262)the definition of 'arguments exotic objects' in that specification.
Array.prototype.copyWithin() - JavaScript
var len = o.length >>> 0; // steps 6-
8.
... var direction = 1; if (from < to && to < (from + count)) { direction = -1; from += count - 1; to += count - 1; } // step 1
8.
Array.prototype.every() - JavaScript
function isbigenough(element, index, array) { return element >= 10; } [12, 5,
8, 130, 44].every(isbigenough); // false [12, 54, 1
8, 130, 44].every(isbigenough); // true using arrow functions arrow functions provide a shorter syntax for the same test.
... [12, 5,
8, 130, 44].every(x => x >= 10); // false [12, 54, 1
8, 130, 44].every(x => x >= 10); // true affecting initial array (modifying, appending, and deleting) the following examples tests the behaviour of the every method when the array is modified.
Array.prototype.map() - JavaScript
let k be 0 k = 0; //
8.
... let numbers = [1, 4, 9] let doubles = numbers.map(function(num) { return num * 2 }) // doubles is now [2,
8, 1
8] // numbers is still [1, 4, 9] using map generically this example shows how to use map on a string to get an array of bytes in the ascii encoding representing the character values: let map = array.prototype.map let a = map.call('hello world', function(x) { return x.charcodeat(0) }) // a now equals [72, 101, 10
8, 10
8, 111, 32,
87, 111, 114, 10
8, 100] using map generically queryselector...
Array.prototype.some() - JavaScript
function isbiggerthan10(element, index, array) { return element > 10; } [2, 5,
8, 1, 4].some(isbiggerthan10); // false [12, 5,
8, 1, 4].some(isbiggerthan10); // true testing array elements using arrow functions arrow functions provide a shorter syntax for the same test.
... [2, 5,
8, 1, 4].some(x => x > 10); // false [12, 5,
8, 1, 4].some(x => x > 10); // true checking whether a value exists in an array to mimic the function of the includes() method, this custom function returns true if the element exists in the array: const fruits = ['apple', 'banana', 'mango', 'guava']; function checkavailability(arr, val) { return arr.some(function(arrval) { return val === arrval; }); } checkavailability(fruits, 'kela'); // false checkavailability(fruits, 'banana'); // true checking whether a value exists using an arrow function const fruits = ['apple', 'banana', 'mango', 'guava']; function checkavailability(arr, val) { return arr.some(arrval => val === arrval); } checkavailability(fruits, 'kela'); // false checkavailability(fruits, 'banana'); // t...
Array.prototype.toLocaleString() - JavaScript
'' : firstelement.tolocalestring(locales, options); //
8.
... object: object.prototype.tolocalestring() number: number.prototype.tolocalestring() date: date.prototype.tolocalestring() always display the currency for the strings and numbers in the prices array: var prices = ['¥7', 500,
8123, 12]; prices.tolocalestring('ja-jp', { style: 'currency', currency: 'jpy' }); // "¥7,¥500,¥
8,123,¥12" for more examples, see also the intl, numberformat, and datetimeformat pages.
Atomics.add() - JavaScript
one of int
8array, uint
8array, int16array, uint16array, int32array, uint32array, bigint64array, or biguint64array.
... examples using add() const sab = new sharedarraybuffer(1024); const ta = new uint
8array(sab); atomics.add(ta, 0, 12); // returns 0, the old value atomics.load(ta, 0); // 12 specifications specification ecmascript (ecma-262)the definition of 'atomics.add' in that specification.
Atomics.and() - JavaScript
one of int
8array, uint
8array, int16array, uint16array, int32array, uint32array, bigint64array, or biguint64array.
... 5 0101 1 0001 ---- 1 0001 examples using and() const sab = new sharedarraybuffer(1024); const ta = new uint
8array(sab); ta[0] = 5; atomics.and(ta, 0, 1); // returns 0, the old value atomics.load(ta, 0); // 1 specifications specification ecmascript (ecma-262)the definition of 'atomics.and' in that specification.
Atomics.compareExchange() - JavaScript
one of int
8array, uint
8array, int16array, uint16array, int32array, uint32array, bigint64array, or biguint64array.
... examples using compareexchange() const sab = new sharedarraybuffer(1024); const ta = new uint
8array(sab); ta[0] = 7; atomics.compareexchange(ta, 0, 7, 12); // returns 7, the old value atomics.load(ta, 0); // 12 specifications specification ecmascript (ecma-262)the definition of 'atomics.compareexchange' in that specification.
Atomics.exchange() - JavaScript
one of int
8array, uint
8array, int16array, uint16array, int32array, uint32array, bigint64array, or biguint64array.
... examples using exchange() const sab = new sharedarraybuffer(1024); const ta = new uint
8array(sab); atomics.exchange(ta, 0, 12); // returns 0, the old value atomics.load(ta, 0); // 12 specifications specification ecmascript (ecma-262)the definition of 'atomics.exchange' in that specification.
Atomics.load() - JavaScript
one of int
8array, uint
8array, int16array, uint16array, int32array, uint32array, bigint64array, or biguint64array.
... examples using load const sab = new sharedarraybuffer(1024); const ta = new uint
8array(sab); atomics.add(ta, 0, 12); atomics.load(ta, 0); // 12 specifications specification ecmascript (ecma-262)the definition of 'atomics.load' in that specification.
Atomics.or() - JavaScript
one of int
8array, uint
8array, int16array, uint16array, int32array, uint32array, bigint64array, or biguint64array.
... 5 0101 1 0001 ---- 5 0101 examples using or const sab = new sharedarraybuffer(1024); const ta = new uint
8array(sab); ta[0] = 2; atomics.or(ta, 0, 1); // returns 2, the old value atomics.load(ta, 0); // 3 specifications specification ecmascript (ecma-262)the definition of 'atomics.or' in that specification.
Atomics.store() - JavaScript
one of int
8array, uint
8array, int16array, uint16array, int32array, uint32array, bigint64array, or biguint64array.
... examples using store() var sab = new sharedarraybuffer(1024); var ta = new uint
8array(sab); atomics.store(ta, 0, 12); // 12 specifications specification ecmascript (ecma-262)the definition of 'atomics.store' in that specification.
Atomics.sub() - JavaScript
one of int
8array, uint
8array, int16array, uint16array, int32array, uint32array, bigint64array, or biguint64array.
... examples using sub const sab = new sharedarraybuffer(1024); const ta = new uint
8array(sab); ta[0] = 4
8; atomics.sub(ta, 0, 12); // returns 4
8, the old value atomics.load(ta, 0); // 36 specifications specification ecmascript (ecma-262)the definition of 'atomics.sub' in that specification.
Atomics.xor() - JavaScript
one of int
8array, uint
8array, int16array, uint16array, int32array, uint32array, bigint64array, or biguint64array.
... 5 0101 1 0001 ---- 4 0100 examples using xor const sab = new sharedarraybuffer(1024); const ta = new uint
8array(sab); ta[0] = 5; atomics.xor(ta, 0, 1); // returns 5, the old value atomics.load(ta, 0); // 4 specifications specification ecmascript (ecma-262)the definition of 'atomics.xor' in that specification.
BigInt64Array - JavaScript
8 in the case of a bigint64array.
... examples different ways to create a bigint64array // from a length var bigint64 = new bigint64array(2); bigint64[0] = 42n; console.log(bigint64[0]); // 42n console.log(bigint64.length); // 2 console.log(bigint64.bytes_per_element); //
8 // from an array var arr = new bigint64array([21n,31n]); console.log(arr[1]); // 31n // from another typedarray var x = new bigint64array([21n, 31n]); var y = new bigint64array(x); console.log(y[0]); // 21n // from an arraybuffer var buffer = new arraybuffer(32); var z = new bigint64array(buffer, 0, 4); // from an iterable var iterable = function*(){ yield* [1n, 2n, 3n]; }(); var bigint64 = n...
BigUint64Array - JavaScript
8 in the case of a biguint64array.
... examples different ways to create a biguint64array // from a length var biguint64 = new biguint64array(2); biguint64[0] = 42n; console.log(biguint64[0]); // 42n console.log(biguint64.length); // 2 console.log(biguint64.bytes_per_element); //
8 // from an array var arr = new biguint64array([21n,31n]); console.log(arr[1]); // 31n // from another typedarray var x = new biguint64array([21n, 31n]); var y = new biguint64array(x); console.log(y[0]); // 21n // from an arraybuffer var buffer = new arraybuffer(32); var z = new biguint64array(buffer, 0, 4); // from an iterable var iterable = function*(){ yield* [1n, 2n, 3n]; }(); var biguint6...
DataView.prototype.setBigUint64() - JavaScript
the highest possible value that fits in an unsigned 64-bit integer is 2n ** 64n - 1n (1
8446744073709551615n).
... examples using the setbiguint64 method var buffer = new arraybuffer(
8); var dataview = new dataview(buffer); dataview.setbiguint64(0, 3n); dataview.getbiguint64(0); // 3n specifications specification ecmascript (ecma-262)the definition of 'dataview.prototype.setbiguint64()' in that specification.
Date.prototype.getTime() - JavaScript
// reduced time precision (2ms) in firefox 60 new date().gettime(); // 1519211
809934 // 1519211
810362 // 1519211
811670 // ...
... // reduced time precision with `privacy.resistfingerprinting` enabled new date().gettime(); // 1519129
853500 // 1519129
85
8900 // 1519129
864400 // ...
Date.now() - JavaScript
// reduced time precision (2ms) in firefox 60 date.now() // 1519211
809934 // 1519211
810362 // 1519211
811670 // ...
... // reduced time precision with `privacy.resistfingerprinting` enabled date.now(); // 1519129
853500 // 1519129
85
8900 // 1519129
864400 // ...
Date.prototype.toUTCString() - JavaScript
jan, feb, ...) yyyy year, as four or more digits with leading zeroes if required hh hour, as two digits with leading zero if required mm minute, as two digits with leading zero if required ss seconds, as two digits with leading zero if required prior to ecmascript 201
8, the format of the return value varied according to the platform.
... the most common return value was an rfc-1123 formatted date stamp, which is a slightly updated version of rfc-
822 date stamps.
Error.prototype.stack - JavaScript
browsers using the v
8 javascript engine (such as chrome, opera 15+, android browser) and ie10+, on the other hand, uses a different format (see the archived msdn error.stack docs).
... <!doctype html> <meta charset="utf-
8"> <title>stack trace example</title> <body> <script> function trace() { try { throw new error('myerror'); } catch(e) { alert(e.stack); } } function b() { trace(); } function a() { b(3, 4, '\n\n', undefined, {}); } a('first call, firstarg'); </script> assuming the above markup is saved as c:\example.html on a windows file system it produces an alert message box with the follo...
Error - JavaScript
static methods error.capturestacktrace() a non-standard v
8 function that creates the stack property on an error instance.
... class customerror extends error { constructor(foo = 'bar', ...params) { // pass remaining arguments (including vendor specific ones) to parent constructor super(...params) // maintains proper stack trace for where our error was thrown (only available on v
8) if (error.capturestacktrace) { error.capturestacktrace(this, customerror) } this.name = 'customerror' // custom debugging information this.foo = foo this.date = new date() } } try { throw new customerror('baz', 'bazmessage') } catch(e) { console.error(e.name) //customerror console.error(e.foo) //baz console.error(e.message) //bazmessage console.
Float64Array - JavaScript
8 in the case of an float64array.
... examples different ways to create a float64array // from a length var float64 = new float64array(2); float64[0] = 42; console.log(float64[0]); // 42 console.log(float64.length); // 2 console.log(float64.bytes_per_element); //
8 // from an array var arr = new float64array([21,31]); console.log(arr[1]); // 31 // from another typedarray var x = new float64array([21, 31]); var y = new float64array(x); console.log(y[0]); // 21 // from an arraybuffer var buffer = new arraybuffer(32); var z = new float64array(buffer, 0, 4); // from an iterable var iterable = function*(){ yield* [1,2,3]; }(); var float64 = new float64array(...
Intl.DateTimeFormat - JavaScript
var date = new date(date.utc(2012, 11, 20, 3, 0, 0)); // tolocalestring without arguments depends on the implementation, // the default locale, and the default time zone console.log(new intl.datetimeformat().format(date)); // → "12/19/2012" if run with en-us locale (language) and time zone america/los_angeles (utc-0
800) using locales this example shows some of the variations in localized date and time formats.
... in order to get the format of the language used in the user interface of your application, make sure to specify that language (and possibly some fallback languages) using the locales argument: var date = new date(date.utc(2012, 11, 20, 3, 0, 0)); // results below use the time zone of america/los_angeles (utc-0
800, pacific standard time) // us english uses month-day-year order console.log(new intl.datetimeformat('en-us').format(date)); // → "12/19/2012" // british english uses day-month-year order console.log(new intl.datetimeformat('en-gb').format(date)); // → "19/12/2012" // korean uses year-month-day order console.log(new intl.datetimeformat('ko-kr').format(date)); // → "2012.
Intl.Locale.prototype.calendar - JavaScript
5493 b.c.e) ethiopic ethiopic calendar, amete mihret (epoch approx,
8 c.e.) gregory gregorian calendar hebrew traditional hebrew calendar indian indian calendar islamic islamic calendar islamic-umalqura islamic calendar, umm al-qura islamic-tbla islamic calendar, tabular (intercalary years [2,5,7,10,13,16,1
8,21,24,26,29] - astronomical epoch) islamic-civil islamic calendar, tabular ...
...(intercalary years [2,5,7,10,13,16,1
8,21,24,26,29] - civil epoch) islamic-rgsa islamic calendar, saudi arabia sighting iso
8601 iso calendar (gregorian calendar using the iso
8601 calendar week rules) japanese japanese imperial calendar persian persian calendar roc republic of china calendar the islamicc calendar key has been deprecated.
Intl.NumberFormat() constructor - JavaScript
amount); // → '-3,500.00 us dollars' new intl.numberformat('bn', { style: 'currency', currency: 'usd', currencysign: 'accounting' }).format(amount); // → '($3,500.00)' scientific, engineering or compact notations scientific and compact notation are represented by the notation option and can be formatted like this: new intl.numberformat('en-us', { notation: "scientific" }).format(9
87654321); // → 9.
877e
8 new intl.numberformat('pt-pt', { notation: "scientific" }).format(9
87654321); // → 9,
877e
8 new intl.numberformat('en-gb', { notation: "engineering" }).format(9
87654321); // → 9
87.654e6 new intl.numberformat('de', { notation: "engineering" }).format(9
87654321); // → 9
87,654e6 new intl.numberformat('zh-cn', { notation: "compact" }).format(9
87654321); // → 9.9亿 ...
... new intl.numberformat('fr', { notation: "compact", compactdisplay: "long" }).format(9
87654321); // → 9
88 millions new intl.numberformat('en-gb', { notation: "compact", compactdisplay: "short" }).format(9
87654321); // → 9
88m displaying signs display a sign for positive and negative numbers, but not zero: new intl.numberformat("en-us", { style: "percent", signdisplay: "exceptzero" }).format(0.55); // → '+55%' note that when the currency sign is "accounting", parentheses might be used instead of a minus sign: new intl.numberformat('bn', { style: 'currency', currency: 'usd', currencysign: 'accounting', signdisplay: 'always' }).format(-3500); // → '($3,500.00)' specifications specification ecmascript internationalization api (ecma-4...
Intl.NumberFormat.prototype.format() - JavaScript
examples using format use the format getter function for formatting a single currency value, here for russia: var options = { style: 'currency', currency: 'rub' }; var numberformat = new intl.numberformat('ru-ru', options); console.log(numberformat.format(654321.9
87)); // → "654 321,99 руб." using format with map use the format getter function for formatting all numbers in an array.
... var a = [123456.7
89, 9
87654.321, 4567
89.123]; var numberformat = new intl.numberformat('es-es'); var formatted = a.map(n => numberformat.format(n)); console.log(formatted.join('; ')); // → "123.456,7
89; 9
87.654,321; 456.7
89,123" specifications specification ecmascript internationalization api (ecma-402)the definition of 'intl.numberformat.prototype.format' in that specification.
JSON - JavaScript
in engines that haven't implemented the proposal, u+202
8 line separator and u+2029 paragraph separator are allowed in string literals and property keys in json; but their use in these features in javascript string literals is a syntaxerror.
... consider this example where json.parse() parses the string as json and eval executes the string as javascript: let code = '"\u202
8\u2029"' json.parse(code) // evaluates to "\u202
8\u2029" in all engines eval(code) // throws a syntaxerror in old engines other differences include allowing only double-quoted strings and having no provisions for undefined or comments.
Math.asinh() - JavaScript
polyfill math.asinh can be emulated with the following function: if (!math.asinh) math.asinh = function(x) { var absx = math.abs(x), w if (absx < 3.72529029
8461914e-9) // |x| < 2^-2
8 return x if (absx > 26
8435456) // |x| > 2^2
8 w = math.log(absx) + math.ln2 else if (absx > 2) // 2^2
8 >= |x| > 2 w = math.log(2 * absx + 1 / (math.sqrt(x * x + 1) + absx)) else var t = x * x, w = math.log1p(absx + t / (1 + math.sqrt(1 + t))) return x > 0 ?
... examples using math.asinh() math.asinh(1); // 0.
8813735
87019543 math.asinh(0); // 0 specifications specification ecmascript (ecma-262)the definition of 'math.asinh' in that specification.
Math.fround() - JavaScript
-1 : 1; if (sign < 0) arg = -arg; // compute the exponent (
8 bits, signed).
... var mantissa = math.round((leading - arg / powexp) * 0x
800000); if (mantissa <= -0x
800000) return sign * infinity; return sign * powexp * (leading - mantissa / 0x
800000); }; examples using math.fround() the number 1.5 can be precisely represented in the binary numeral system, and is identical in 32-bit and 64-bit: math.fround(1.5); // 1.5 math.fround(1.5) === 1.5; // true however, the number 1.337 cannot be precisely represented in the binary numeral system, so it differs in 32-bit and 64-bi...
Math.hypot() - JavaScript
the largest number you can represent in js is number.max_value, which is around 1030
8.
...1 / 0 : max * math.sqrt(s)); }; examples using math.hypot() math.hypot(3, 4); // 5 math.hypot(3, 4, 5); // 7.071067
811
8654755 math.hypot(); // 0 math.hypot(nan); // nan math.hypot(nan, infinity); // infinity math.hypot(3, 4, 'foo'); // nan, since +'foo' => nan math.hypot(3, 4, '5'); // 7.071067
811
8654755, +'5' => 5 math.hypot(-3); // 3, the same as math.abs(-3) specifications specification ecmascript (ecma-262)the definition of 'math.hypot' in that sp...
Number.prototype.toLocaleString() - JavaScript
in order to get the format of the language used in the user interface of your application, make sure to specify that language (and possibly some fallback languages) using the locales argument: var number = 123456.7
89; // german uses comma as decimal separator and period for thousands console.log(number.tolocalestring('de-de')); // → 123.456,7
89 // arabic in most arabic speaking countries uses eastern arabic digits console.log(number.tolocalestring('ar-eg')); // → ١٢٣٤٥٦٫٧٨٩ // india uses thousands/lakh/crore separators console.log(number.tolocalestring('en-in')); // → 1,23,456.7
89 // the ...
...chinese decimal console.log(number.tolocalestring('zh-hans-cn-u-nu-hanidec')); // → 一二三,四五六.七八九 // when requesting a language that may not be supported, such as // balinese, include a fallback language, in this case indonesian console.log(number.tolocalestring(['ban', 'id'])); // → 123.456,7
89 using options the results provided by tolocalestring can be customized using the options argument: var number = 123456.7
89; // request a currency format console.log(number.tolocalestring('de-de', { style: 'currency', currency: 'eur' })); // → 123.456,79 € // the japanese yen doesn't use a minor unit console.log(number.tolocalestring('ja-jp', { style: 'currency', currency: 'jpy' })) // → ¥123,457 // limit to three ...
Number - JavaScript
the largest value a number can hold is about 1.
8×1030
8.
... using number to convert a date object the following example converts the date object to a numerical value using number as a function: let d = new date('december 17, 1995 03:24:00') console.log(number(d)) this logs
819199440000.
Object.defineProperty() - JavaScript
// creates a new object // example of an object property added // with defineproperty with a data property descriptor object.defineproperty(o, 'a', { value: 37, writable: true, enumerable: true, configurable: true }); // 'a' property exists in the o object and its value is 37 // example of an object property added // with defineproperty with an accessor property descriptor var bvalue = 3
8; object.defineproperty(o, 'b', { // using shorthand method names (es2015 feature).
... // this is equivalent to: // get: function() { return bvalue; }, // set: function(newvalue) { bvalue = newvalue; }, get() { return bvalue; }, set(newvalue) { bvalue = newvalue; }, enumerable: true, configurable: true }); o.b; // 3
8 // 'b' property exists in the o object and its value is 3
8 // the value of o.b is now always identical to bvalue, // unless o.b is redefined // you cannot try to mix both: object.defineproperty(o, 'conflict', { value: 0x9f91102, get() { return 0xdeadbeef; } }); // throws a typeerror: value appears // only in data descriptors, // get appears only in accessor descriptors modifying a property when the property already exists, object.defineproperty() attempts to modify the property according to the values in the descriptor and the object's curr...
String.prototype.indexOf() - JavaScript
with no fromindex value, or any fromindex value lower than the string's length, the returned value is the same as the fromindex value: 'hello world'.indexof('') // returns 0 'hello world'.indexof('', 0) // returns 0 'hello world'.indexof('', 3) // returns 3 'hello world'.indexof('',
8) // returns
8 however, with any fromindex value equal to or greater than the string's length, the returned value is the string's length: 'hello world'.indexof('', 11) // returns 11 'hello world'.indexof('', 13) // returns 11 'hello world'.indexof('', 22) // returns 11 in the former instance, js seems to find an empty string just after the specified index value.
... const str = 'brave new world' console.log('index of first w from start is ' + str.indexof('w')) // logs
8 console.log('index of "new" from start is ' + str.indexof('new')) // logs 6 indexof() and case-sensitivity the following example defines two string variables.
String length - JavaScript
in versions prior to firefox 65, the maximum length was 2**2
8 - 1 (~256mb).
... unicode since `length` counts code units instead of characters, if you want to get the number of characters you need something like this: function getcharacterlength (str) { // the string iterator that is used here iterates over characters, // not mere code units return [...str].length; } console.log(getcharacterlength('a\ud
87e\udc04z')); // 3 // while not recommended, you could add this to each string as follows: object.defineproperty(string.prototype, 'charlength', { get () { return getcharacterlength(this); } }); console.log('a\ud
87e\udc04z'.charlength); // 3 examples basic usage let x = 'mozilla'; let empty = ''; console.log(x + ' is ' + x.length + ' code units long'); /* "mozilla is 7 code units l...
get TypedArray[@@species] - JavaScript
examples species in ordinary objects the species property returns the default constructor function, which is one of the typed array constructors for a given typed array object: int
8array[symbol.species]; // function int
8array() uint
8array[symbol.species]; // function uint
8array() float32array[symbol.species]; // function float32array() species in derived objects in a derived collection object (e.g.
...however, you might want to overwrite this, in order to return a parent typed array object in your derived class methods: class mytypedarray extends uint
8array { // overwrite mytypedarray species to the parent uint
8array constructor static get [symbol.species]() { return uint
8array; } } specifications specification ecmascript (ecma-262)the definition of 'get %typedarray% [ @@species ]' in that specification.
TypedArray.prototype.every() - JavaScript
function isbigenough(element, index, array) { return element >= 10; } new uint
8array([12, 5,
8, 130, 44]).every(isbigenough); // false new uint
8array([12, 54, 1
8, 130, 44]).every(isbigenough); // true testing typed array elements using arrow functions arrow functions provide a shorter syntax for the same test.
... new uint
8array([12, 5,
8, 130, 44]).every(elem => elem >= 10); // false new uint
8array([12, 54, 1
8, 130, 44]).every(elem => elem >= 10); // true specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.every' in that specification.
TypedArray.prototype.fill() - JavaScript
// https://tc39.github.io/ecma262/#sec-%typedarray%.prototype.fill if (!uint
8array.prototype.fill) { uint
8array.prototype.fill = array.prototype.fill; } examples using fill new uint
8array([1, 2, 3]).fill(4); // uint
8array [4, 4, 4] new uint
8array([1, 2, 3]).fill(4, 1); // uint
8array [1, 4, 4] new uint
8array([1, 2, 3]).fill(4, 1, 2); // uint
8array [1, 4, 3] new uint
8array([1, 2, 3]).fill(4, 1, 1); // uint
8array [1, 2, 3] new uint
8array([1, 2, 3]).fill...
...(4, -3, -2); // uint
8array [4, 2, 3] specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.fill' in that specification.
TypedArray.prototype.filter() - JavaScript
function isbigenough(element, index, array) { return element >= 10; } new uint
8array([12, 5,
8, 130, 44]).filter(isbigenough); // uint
8array [ 12, 130, 44 ] filtering typed array elements using arrow functions arrow functions provide a shorter syntax for the same test.
... new uint
8array([12, 5,
8, 130, 44]).filter(elem => elem >= 10); // uint
8array [ 12, 130, 44 ] specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.filter' in that specification.
TypedArray.prototype.join() - JavaScript
// https://tc39.github.io/ecma262/#sec-%typedarray%.prototype.join if (!uint
8array.prototype.join) { object.defineproperty(uint
8array.prototype, 'join', { value: array.prototype.join }); } if you need to support truly obsolete javascript engines that don't support object.defineproperty, it's best not to polyfill array.prototype methods at all, as you can't make them non-enumerable.
... examples using join var uint
8 = new uint
8array([1,2,3]); uint
8.join(); // '1,2,3' uint
8.join(' / '); // '1 / 2 / 3' uint
8.join(''); // '123' specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.join' in that specification.
TypedArray.prototype.map() - JavaScript
const numbers = new uint
8array([1, 4, 9]); const roots = numbers.map(math.sqrt); // roots is now: uint
8array [1, 2, 3], // numbers is still uint
8array [1, 4, 9] mapping a typed array of numbers using a function containing an argument the following code shows how map works when a function requiring one argument is used with it.
... const numbers = new uint
8array([1, 4, 9]); const doubles = numbers.map(function(num) { return num * 2; }); // doubles is now uint
8array [2,
8, 1
8] // numbers is still uint
8array [1, 4, 9] specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.map' in that specification.
TypedArray.name - JavaScript
please see uint
8clampedarray for more details.
... examples using name int
8array.name; // "int
8array" uint
8array.name; // "uint
8array" uint
8clampedarray.name; // "uint
8clampedarray" int16array.name; // "int16array" uint16array.name; // "uint16array" int32array.name; // "int32array" uint32array.name; // "uint32array" float32array.name; // "float32array" float64array.name; // "float64array" specifications specification ecmascript (ecma-262)the definition of 'typedarray.name' in that specification.
TypedArray.of() - JavaScript
syntax typedarray.of(element0[, element1[, ...[, elementn]]]) where typedarray is one of: int
8array uint
8array uint
8clampedarray int16array uint16array int32array uint32array float32array float64array bigint64array biguint64array parameters elementn elements of which to create the typed array.
... examples using of uint
8array.of(1); // uint
8array [ 1 ] int
8array.of('1', '2', '3'); // int
8array [ 1, 2, 3 ] float32array.of(1, 2, 3); // float32array [ 1, 2, 3 ] int16array.of(undefined); // int16array [ 0 ] specifications specification ecmascript (ecma-262)the definition of '%typedarray%.of' in that specification.
TypedArray.prototype.slice() - JavaScript
if (!uint
8array.prototype.slice) { object.defineproperty(uint
8array.prototype, 'slice', { value: function (begin, end) { return new uint
8array(array.prototype.slice.call(this, begin, end)); } }); } if you need to support truly obsolete javascript engines that don't support object.defineproperty, it's best not to polyfill array.prototype methods at all, as you can't make them non-...
... examples return a portion of an existing typed array const uint
8 = new uint
8array([1,2,3]); uint
8.slice(1); // uint
8array [ 2, 3 ] uint
8.slice(2); // uint
8array [ 3 ] uint
8.slice(-2); // uint
8array [ 2, 3 ] uint
8.slice(0,1); // uint
8array [ 1 ] specifications specification ecmascript (ecma-262)the definition of '%typedarray%.prototype.slice' in that specification.
TypedArray.prototype.toString() - JavaScript
var numbers = new uint
8array([2, 5,
8, 1, 4]) numbers.tostring(); // "2,5,
8,1,4" javascript calls the tostring method automatically when a typed array is to be represented as a text value or when an array is referred to in a string concatenation.
... compatibility if a browser doesn't support the typedarray.prototype.tostring() method yet, javascript will call the tostring method of object: var numbers = new uint
8array([2, 5,
8, 1, 4]) numbers.tostring(); // "[object uint
8array]" specifications specification ecmascript (ecma-262)the definition of 'array.prototype.tostring' in that specification.
WebAssembly.CompileError - JavaScript
rt 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.0compileerror() constructorchrome 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 ...
...rt 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.0legend full support full support no support no supportsee implementation notes.see implementation notes.
WebAssembly.LinkError - JavaScript
rt 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.0linkerror() constructorchrome 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 ...
...rt 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.0legend full support full support no support no supportsee implementation notes.see implementation notes.
WebAssembly.RuntimeError - JavaScript
rt 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.0runtimeerror() constructorchrome 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 ...
...rt 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.0legend full support full support no support no supportsee implementation notes.see implementation notes.
WebAssembly.Table() constructor - JavaScript
the table2.wasm module contains two functions (one that returns 42 and another that returns
83) and stores both into elements 0 and 1 of the imported table (see text representation).
...rt 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.0legend full support full support no support no supportsee implementation notes.see implementation notes.
WebAssembly.compileStreaming() - JavaScript
desktopmobileserverchromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetnode.jscompilestreamingchrome full support 61edge full support 16firefox full support 5
8ie no support noopera full support 47safari no support nowebview android full support 61chrome android full support 61firefox android full support ...
... 5
8opera android full support 45safari ios no support nosamsung internet android full support
8.0nodejs no support nolegend full support full support no support no support ...
WebAssembly.instantiateStreaming() - JavaScript
desktopmobileserverchromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetnode.jsinstantiatestreamingchrome full support 61edge full support 16firefox full support 5
8ie no support noopera full support 47safari no support nowebview android full support 61chrome android full support 61firefox android full support ...
... 5
8opera android full support 45safari ios no support nosamsung internet android full support
8.0nodejs no support nolegend full support full support no support no support ...
decodeURIComponent() - JavaScript
examples decoding a cyrillic url component decodeuricomponent('javascript_%d1%
88%d0%b5%d0%bb%d0%bb%d1%
8b'); // "javascript_шеллы" catching errors try { var a = decodeuricomponent('%e0%a4%a'); } catch(e) { console.error(e); } // urierror: malformed uri sequence decoding query parameters from a url decodeuricomponent cannot be used directly to parse query parameters from a url.
... function decodequeryparam(p) { return decodeuricomponent(p.replace(/\+/g, ' ')); } decodequeryparam('search+query%20%2
8correct%29'); // 'search query (correct)' specifications specification ecmascript (ecma-262)the definition of 'decodeuricomponent' in that specification.
Destructuring assignment - JavaScript
setting a function parameter's default value function drawchart({size = 'big', coords = {x: 0, y: 0}, radius = 25} = {}) { console.log(size, coords, radius); // do some chart drawing } drawchart({ coords: {x: 1
8, y: 30}, radius: 30 }); in the function signature for drawchart above, the destructured left-hand side is assigned to an empty object literal on the right-hand side: {size = 'big', coords = {x: 0, y: 0}, radius = 25} = {}.
... nested object and array destructuring const metadata = { title: 'scratchpad', translations: [ { locale: 'de', localization_tags: [], last_edit: '2014-04-14t0
8:43:37', url: '/de/docs/tools/scratchpad', title: 'javascript-umgebung' } ], url: '/docs/tools/scratchpad' }; let { title: englishtitle, // rename translations: [ { title: localetitle, // rename }, ], } = metadata; console.log(englishtitle); // "scratchpad" console.log(localetitle); // "javascript-umgebung" for of iteration and destructuring const peop...
Left shift (<<) - JavaScript
so e.g.: 9 << 3 translates to: 9 * (2 ** 3) = 9 * (
8) = 72.
... examples using left shift 9 << 3; // 72 // 9 * (2 ** 3) = 9 * (
8) = 72 specifications specification ecmascript (ecma-262)the definition of 'bitwise shift operators' in that specification.
Optional chaining (?.) - JavaScript
for instance: let potentiallynullobj = null; let x = 0; let prop = potentiallynullobj?.[x++]; console.log(x); // 0 as x was not incremented stacking the optional chaining operator with nested structures, it is possible to use optional chaining multiple times: let customer = { name: "carl", details: { age:
82, location: "paradise falls" // detailed address is unknown } }; let customercity = customer.details?.address?.city; // … this also works with optional chaining function call let duration = vacations.trip?.gettime?.(); combining with the nullish coalescing operator the nullish coalescing operator may be used after optional chaining in order to build a default value when none was found...
...: let customer = { name: "carl", details: { age:
82 } }; const customercity = customer?.city ??
Spread syntax (...) - JavaScript
syntax for function calls: myfunction(...iterableobj); for array literals or strings: [...iterableobj, '4', 'five', 6]; for object literals (new in ecmascript 201
8): let objclone = { ...obj }; rest syntax (parameters) rest syntax looks exactly like spread syntax.
... spread in object literals the rest/spread properties for ecmascript proposal (es201
8) added spread properties to object literals.
Unsigned right shift (>>>) - JavaScript
for example, -9 >>> 2 yields 1073741
821, which is different than -9 >> 2 (which yields -3): .
... -9 (base 10): 11111111111111111111111111110111 (base 2) -------------------------------- -9 >>> 2 (base 10): 00111111111111111111111111111101 (base 2) = 1073741
821 (base 10) examples using unsigned right shift 9 >>> 2; // 2 -9 >>> 2; // 1073741
821 specifications specification ecmascript (ecma-262)the definition of 'bitwise shift operators' in that specification.
Strict mode - JavaScript
duplicate property names are a syntax error in strict mode: this is no longer the case in ecmascript 2015 (bug 104112
8).
...syntax error 197 + 142; var sumwithoctal = 0o10 +
8; console.log(sumwithoctal); // 16 seventh, strict mode in ecmascript 2015 forbids setting properties on primitive values.
Values - MathML
constants a replacement for the deprecated constants below is: veryverythinmathspace => 0.05555555555555555em verythinmathspace => 0.1111111111111111em thinmathspace => 0.16666666666666666em mediummathspace => 0.2222222222222222em thickmathspace => 0.277777777777777
8em verythickmathspace => 0.3333333333333333em veryverythickmathspace => 0.3
888888888888889em constant value veryverythinmathspace 1/1
8em verythinmathspace 2/1
8em thinmathspace 3/1
8em mediummathspace 4/1
8em thickmathspace 5/1
8em verythickmathspace 6/1
8em veryverythickmathspace 7/1
8em ...
... negative contstants are introduced in gecko 7.0 (firefox 7.0 / thunderbird 7.0 / seamonkey 2.4) (bug 650530) negativeveryverythinmathspace -1/1
8em negativeverythinmathspace -2/1
8em negativethinmathspace -3/1
8em negativemediummathspace -4/1
8em negativethickmathspace -5/1
8em negativeverythickmathspace -6/1
8em negativeveryverythickmathspace -7/1
8em note: namedspace binding is deprecated in mathml3 and has been removed in gecko 15.0 (firefox 15.0 / thunderbird 15.0 / seamonkey 2.12) (bug 673759).
<mo> - MathML
the constant thickmathspace (5/1
8em) is the default value.
...the constant thickmathspace (5/1
8em) is the default value.
Digital video concepts - Web media technologies
when using integer components, rgb color uses
8 bits each of red, green, and blue, as well as potentially
8 bits of alpha (the amount of transparency).
... since the color data is being encoded at a lower resolution than the luma, when decoding the video to draw it to the screen each pixel's color is computed by calculating an appropriate color given the u and v values for the 4x2 block of
8 pixels in which the pixel resides.
OpenSearch description format
<opensearchdescription xmlns="http://a9.com/-/spec/opensearch/1.1/" xmlns:moz="http://www.mozilla.org/2006/browser/search/"> <shortname>[snk]</shortname> <description>[search engine full name and summary]</description> <inputencoding>[utf-
8]</inputencoding> <image width="16" height="16" type="image/x-icon">[https://example.com/favicon.ico]</image> <url type="text/html" template="[searchurl]"> <param name="[key name]" value="{searchterms}"/> <!-- other params if you need them… --> <param name="[other key name]" value="[parameter value]"/> </url> <url type="application/x-suggestions+json" template="[suggestionurl...
... reference material opensearch documentation safari
8.0 release notes: quick website search microsoft edge dev guide: search provider discovery the chromium projects: tab to search imdb.com has a working osd.xml opensearch plugin generator ready2search - create opensearch plugins.
Navigation and resource timings - Web Performance
for comparison, we can look at the network tab and see that we transferred 22.04kb for an uncompressed file size of
87.24kb.
... if we do the math with these numbers, we get the same result: 1 - (22.04 /
87.24) = 0.747.
Installing and uninstalling web apps - Progressive web apps (PWAs)
installation is supported by chrome for android and android webview version 31 and later, opera for android 32 onward, samsung internet from version 4 onward, and firefox for android version 5
8 and later.
...note that in android
8 and higher, a system-level "add to home screen" permission dialog will be shown first.
Graphic design for responsive sites - Progressive web apps (PWAs)
the downsides here are that css3 properties and svg don't work on old browsers such as ie6-
8 (although polyfills are available, and you could build in fallbacks), and svg isn't suitable for high detail images, such as photographs.
...these may not be supported in older browsers like ie6-
8, but they generally degrade gracefully, are fairly easy to write, and become much more flexible and powerful when combined with javascript and other technologies.
font-size-adjust - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following eight elements: <altglyph>, <text>, <textpath>, <tref>, and <tspan> html, body, svg { height: 100%; } <svg width="600" height="
80" viewbox="0 0 500
80" xmlns="http://www.w3.org/2000/svg"> <text y="20" font-family="times, serif" font-size="10px"> this text uses the times font (10px), which is hard to read in small sizes.
... </text> <text y="60" font-family="times, serif" font-size="10px" font-size-adjust="0.5
8"> this is the 10px times, but now adjusted to the same aspect ratio as the verdana.
fr - SVG: Scalable Vector Graphics
only one element is using this attribute: <radialgradient> html, body, svg { height: 100%; } <svg viewbox="0 0 4
80 200" xmlns="http://www.w3.org/2000/svg"> <defs> <radialgradient id="gradient1" cx="0.5" cy="0.5" r="0.5" fx="0.35" fy="0.35" fr="5%"> <stop offset="0%" stop-color="white"/> <stop offset="100%" stop-color="darkseagreen"/> </radialgradient> <radialgradient id="gradient2" cx="0.5" cy="0.5" r="0.5" fx="0.35" fy="0.35" fr="25%"> <stop offset="0%" stop-color="white"/> <stop offset="100%" stop-color="darkseagreen"/> </radialgradient> </defs> <circle cx="100" cy="100" r="100" fill="url(#gradient1)" /> <circle cx="100" cy="100" r="100"...
...top-color="blue"/> </radialgradient> </defs> <rect x="10" y="10" rx="15" ry="15" width="100" height="100" fill="url(#gradient)" stroke="black" stroke-width="2"/> <circle cx="60" cy="60" r="50" fill="transparent" stroke="white" stroke-width="2"/> <circle cx="35" cy="35" r="2" fill="white" stroke="white"/> <circle cx="60" cy="60" r="2" fill="white" stroke="white"/> <text x="3
8" y="40" fill="white" font-family="sans-serif" font-size="10pt">(fx,fy)</text> <text x="63" y="63" fill="white" font-family="sans-serif" font-size="10pt">(cx,cy)</text> </svg> specifications specification status comment scalable vector graphics (svg) 2the definition of 'fr' in that specification.
fx - SVG: Scalable Vector Graphics
only one element is using this attribute: <radialgradient> html, body, svg { height: 100%; } <svg viewbox="0 0 4
80 200" xmlns="http://www.w3.org/2000/svg"> <defs> <radialgradient id="gradient1" cx="0.5" cy="0.5" r="0.5" fx="0.35" fy="0.35" fr="5%"> <stop offset="0%" stop-color="white"/> <stop offset="100%" stop-color="darkseagreen"/> </radialgradient> <radialgradient id="gradient2" cx="0.5" cy="0.5" r="0.5" fx="0.75" fy="0.35" fr="5%"> <stop offset="0%" stop-color="white"/> <stop offset="100%" stop-color="darkseagreen"/> </radialgradient> </defs> <circle cx="100" cy="100" r="100" fill="url(#gradient1)" /> <circle cx="100" cy="100"...
...top-color="blue"/> </radialgradient> </defs> <rect x="10" y="10" rx="15" ry="15" width="100" height="100" fill="url(#gradient)" stroke="black" stroke-width="2"/> <circle cx="60" cy="60" r="50" fill="transparent" stroke="white" stroke-width="2"/> <circle cx="35" cy="35" r="2" fill="white" stroke="white"/> <circle cx="60" cy="60" r="2" fill="white" stroke="white"/> <text x="3
8" y="40" fill="white" font-family="sans-serif" font-size="10pt">(fx,fy)</text> <text x="63" y="63" fill="white" font-family="sans-serif" font-size="10pt">(cx,cy)</text> </svg> specifications specification status comment scalable vector graphics (svg) 2the definition of 'fx' in that specification.
fy - SVG: Scalable Vector Graphics
only one element is using this attribute: <radialgradient> html, body, svg { height: 100%; } <svg viewbox="0 0 4
80 200" xmlns="http://www.w3.org/2000/svg"> <defs> <radialgradient id="gradient1" cx="0.5" cy="0.5" r="0.5" fx="0.35" fy="0.35" fr="5%"> <stop offset="0%" stop-color="white"/> <stop offset="100%" stop-color="darkseagreen"/> </radialgradient> <radialgradient id="gradient2" cx="0.5" cy="0.5" r="0.5" fx="0.35" fy="0.75" fr="5%"> <stop offset="0%" stop-color="white"/> <stop offset="100%" stop-color="darkseagreen"/> </radialgradient> </defs> <circle cx="100" cy="100" r="100" fill="url(#gradient1)" /> <circle cx="100" cy="100"...
...top-color="blue"/> </radialgradient> </defs> <rect x="10" y="10" rx="15" ry="15" width="100" height="100" fill="url(#gradient)" stroke="black" stroke-width="2"/> <circle cx="60" cy="60" r="50" fill="transparent" stroke="white" stroke-width="2"/> <circle cx="35" cy="35" r="2" fill="white" stroke="white"/> <circle cx="60" cy="60" r="2" fill="white" stroke="white"/> <text x="3
8" y="40" fill="white" font-family="sans-serif" font-size="10pt">(fx,fy)</text> <text x="63" y="63" fill="white" font-family="sans-serif" font-size="10pt">(cx,cy)</text> </svg> specifications specification status comment scalable vector graphics (svg) 2the definition of 'fy' in that specification.
in - SVG: Scalable Vector Graphics
--> <feblend in="backgroundimage" in2="sourcegraphic" mode="multiply"/> </filter> </defs> <image xlink: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:xlink="http://www.w3.org/1999/xlink"> <defs> <filter id="imagemultiply"> <!-- this is a workaround.
... --> <feimage xlink: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.
orient - SVG: Scalable Vector Graphics
m 0 0 l 10 5 l 0 10 z" /> </marker> <marker id="dataarrow" viewbox="0 0 10 10" refx="5" refy="5" markerwidth="6" markerheight="6" orient="-65deg"> <path d="m 0 0 l 10 5 l 0 10 z" fill="red" /> </marker> </defs> <polyline points="10,10 10,90 90,90" fill="none" stroke="black" marker-start="url(#arrow)" marker-end="url(#arrow)" /> <polyline points="15,
80 29,50 43,60 57,30 71,40
85,15" fill="none" stroke="grey" marker-start="url(#dataarrow)" marker-mid="url(#dataarrow)" marker-end="url(#dataarrow)" /> </svg> usage notes value auto | auto-start-reverse | <angle> | <number> default value 0 animatable yes (non-additive) auto this value indicates that the marker is oriented such that its ...
... auto-start-reverse if placed by marker-start, the marker is oriented 1
80° different from the orientation that would be used if auto where specified.
scale - SVG: Scalable Vector Graphics
only one element is using this attribute: <fedisplacementmap> html, body, svg { height: 100%; } <svg viewbox="0 0 4
80 220" xmlns="http://www.w3.org/2000/svg"> <filter id="displacementfilter" x="-20%" y="-20%" width="140%" height="140%"> <feturbulence type="turbulence" basefrequency="0.05" numoctaves="2" result="turbulence"/> <fedisplacementmap in2="turbulence" in="sourcegraphic" scale="5"/> </filter> <filter id="displacementfilter2" x="-20%" y="-20%" width="140%" height="140%"> <feturbulence type="turbulence" basefrequency="0.05" numoctav...
...es="2" result="turbulence"/> <fedisplacementmap in2="turbulence" in="sourcegraphic" scale="50"/> </filter> <circle cx="100" cy="100" r="
80" style="filter: url(#displacementfilter);""/> <circle cx="100" cy="100" r="
80" style="filter: url(#displacementfilter2); transform: translatex(240px);""/> </svg> usage notes value <number> default value none animatable yes <number> this value defines the scale factor for the displacement.
spreadMethod - SVG: Scalable Vector Graphics
examples of spreadmethod with radial gradients svg <svg width="340" height="120" xmlns="http://www.w3.org/2000/svg"> <defs> <radialgradient id="radialpadgradient" cx="75%" cy="25%" r="33%" fx="64%" fy="1
8%" fr="17%"> <stop offset="0%" stop-color="fuchsia"/> <stop offset="100%" stop-color="orange"/> </radialgradient> <radialgradient id="radialreflectgradient" spreadmethod="reflect" cx="75%" cy="25%" r="33%" fx="64%" fy="1
8%" fr="17%"> <stop offset="0%" stop-color="fuchsia"/> <stop offset="100%" stop-color...
...="orange"/> </radialgradient> <radialgradient id="radialrepeatgradient" spreadmethod="repeat" cx="75%" cy="25%" r="33%" fx="64%" fy="1
8%" fr="17%"> <stop offset="0%" stop-color="fuchsia"/> <stop offset="100%" stop-color="orange"/> </radialgradient> </defs> <rect fill="url(#radialpadgradient)" x="10" y="10" width="100" height="100"/> <rect fill="url(#radialreflectgradient)" x="120" y="10" width="100" height="100"/> <rect fill="url(#radialrepeatgradient)" x="230" y="10" width="100" height="100"/> </svg> result specifications specification status comment scalable vector graphics (svg) 2the definition of 'spreadmethod for <radialgradient>' in t...
stdDeviation - SVG: Scalable Vector Graphics
only one element is using this attribute: <fegaussianblur> html, body, svg { height: 100%; } <svg viewbox="0 0 4
80 200" xmlns="http://www.w3.org/2000/svg"> <filter id="gaussianblur1"> <fegaussianblur stddeviation="1" /> </filter> <filter id="gaussianblur2"> <fegaussianblur stddeviation="5" /> </filter> <filter id="gaussianblur3" x="-30%" y="-30%" width="160%" height="160%"> <fegaussianblur stddeviation="10" /> </filter> <circle cx="100" cy="100" r="50" style="filter: url(#gaussianblur1);" /> <circle cx="100" cy="100" r="50" style="filter: url(#gaussianblur2); transform: translatex(140px);" /> <circle cx="100" cy="100" r="50" style="filter: url(#gaussianblur3); transform:...
... translatex(2
80px);" /> </svg> usage notes value <number-optional-number> default value 0 animatable yes <number-optional-number> if two numbers are provided, the first number represents a standard deviation value along the x-axis.
stroke-miterlimit - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following nine elements: <altglyph>, <path>, <polygon>, <polyline>, <rect>, <text>, <textpath>, <tref>, and <tspan> html,body,svg { height:100% } <svg viewbox="0 0 3
8 30" xmlns="http://www.w3.org/2000/svg"> <!-- impact of the default miter limit --> <path stroke="black" fill="none" stroke-linejoin="miter" id="p1" d="m1,9 l7 ,-3 l7 ,3 m2,0 l3.5 ,-3 l3.5 ,3 m2,0 l2 ,-3 l2 ,3 m2,0 l0.75,-3 l0.75,3 m2,0 l0.5 ,-3 l0.5 ,3" /> <!-- impact of the smallest miter limit (1) --> <path stroke="black" fill...
...="none" stroke-linejoin="miter" stroke-miterlimit="1" id="p2" d="m1,19 l7 ,-3 l7 ,3 m2, 0 l3.5 ,-3 l3.5 ,3 m2, 0 l2 ,-3 l2 ,3 m2, 0 l0.75,-3 l0.75,3 m2, 0 l0.5 ,-3 l0.5 ,3" /> <!-- impact of a large miter limit (
8) --> <path stroke="black" fill="none" stroke-linejoin="miter" stroke-miterlimit="
8" id="p3" d="m1,29 l7 ,-3 l7 ,3 m2, 0 l3.5 ,-3 l3.5 ,3 m2, 0 l2 ,-3 l2 ,3 m2, 0 l0.75,-3 l0.75,3 m2, 0 l0.5 ,-3 l0.5 ,3" /> <!-- the following pink lines highlight the position of the path for each stroke --> <path stroke="pink" fill="none" stroke-width="0.05" d="m1, 9 l7,-3 l7,3 m2,0 l3.5,-3 l3.5,3 m2,0 l2,-3 l2,3 m2,0 l0.75,-3 l0.75,3 m2,0 l0.5,-3...
textLength - SVG: Scalable Vector Graphics
<svg width="10cm" height="3cm" viewbox="0 0 1000 300" xmlns="http://www.w3.org/2000/svg"> <rect x="1" y="1" width="99
8" height="29
8" fill="none" stroke="green" stroke-width="2"/> <text id="hello" x="10" y="150" font-family="sans-serif" font-size="60" fill="green"> hello world!
... html the html is also simple, with only two displayed elements contained inside a grouping <div>: <div class="controls"> <input type="range" id="widthslider" min="
80" max="97
8"> <span id="widthdisplay"></span> </div> the <input> element, of type "range", is used to create the slider control the user will manipulate to change the width of the text.
visibility - SVG: Scalable Vector Graphics
<image>, <line>, <path>, <polygon>, <polyline>, <rect>, <text>, <textpath>, <tref>, <tspan>, <video> html, body, svg { height: 100%; } <svg viewbox="0 0 220 120" xmlns="http://www.w3.org/2000/svg"> <rect x="10" y="10" width="200" height="100" stroke="black" stroke-width="5" fill="transparent" /> <g stroke="seagreen" stroke-width="5" fill="skyblue"> <rect x="20" y="20" width="
80" height="
80" visibility="visible" /> <rect x="120" y="20" width="
80" height="
80" visibility="hidden"/> </g> </svg> usage notes value visible | hidden | collapse default value visible animatable yes visible this value indicates that the element will be painted.
... html <button id="nav-toggle-button" > <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" class="button-icon"> <path d="m16.59
8.59l12 13.17 7.41
8.59 6 10l6 6 6-6z" /> <path d="m12
8l-6 6 1.41 1.41l12 10.
83l4.59 4.5
8l1
8 14z" class="invisible" /> <path d="m0 0h24v24h0z" fill="none" /> </svg> <span> click me </span> </button> css svg { display: inline !important; } span { vertical-align: 50%; } button { line-height: 1em; } .invisible { visibility: hidden; } javascript document.queryselector("...
y - SVG: Scalable Vector Graphics
value list of (<length> | <percentage>) default value 0 animatable yes example html,body,svg { height:100% } <svg viewbox="0 0 200 100" xmlns="http://www.w3.org/2000/svg"> <!-- horizontal line to materialized the text base line --> <line x1="0" y1="40%" x2="100%" y2="40%" /> <line x1="0" y1="60%" x2="100%" y2="60%" /> <line x1="0" y1="
80%" x2="100%" y2="
80%" /> <!-- vertical line to materialized the x positioning --> <line x1="5%" y1="0" x2="5%" y2="100%" /> <line x1="55%" y1="0" x2="55%" y2="100%" /> <!-- y with a single value --> <text y="40%" x="5%">svg</text> <!-- y with multiple values --> <text y="40%,60%,
80%" x="55%">svg</text> </svg> text { font: 40px sans-serif; } line { fill: none; stroke: re...
... value list of (<length> | <percentage>) default value none animatable yes example html,body,svg { height:100% } <svg viewbox="0 0 200 100" xmlns="http://www.w3.org/2000/svg"> <!-- horizontal line to materialized the text base line --> <line x1="0" y1="40%" x2="100%" y2="40%" /> <line x1="0" y1="60%" x2="100%" y2="60%" /> <line x1="0" y1="
80%" x2="100%" y2="
80%" /> <!-- vertical line to materialized the x positioning --> <line x1="5%" y1="0" x2="5%" y2="100%" /> <line x1="55%" y1="0" x2="55%" y2="100%" /> <text> <!-- y with a single value --> <tspan y="40%" x="5%">svg</tspan> <!-- y with multiple values --> <tspan y="40%,60%,
80%" x="55%">svg</tspan> </text </svg> text { font: 40px sans-serif; } lin...
y1 - SVG: Scalable Vector Graphics
--> <lineargradient y1="0%" id="g0"> <stop offset="5%" stop-color="black" /> <stop offset="50%" stop-color="red" /> <stop offset="95%" stop-color="black" /> </lineargradient> <rect x="1" y="1" width="
8" height="
8" fill="url(#g0)" /> <!-- here the gradient vector start at the bottom left corner of the bounding box of the shape it is applied to.
... --> <lineargradient y1="100%" id="g1"> <stop offset="5%" stop-color="black" /> <stop offset="50%" stop-color="red" /> <stop offset="95%" stop-color="black" /> </lineargradient> <rect x="11" y="1" width="
8" height="
8" fill="url(#g1)" /> </svg> specifications specification status comment scalable vector graphics (svg) 2the definition of 'y1' in that specification.
y2 - SVG: Scalable Vector Graphics
--> <lineargradient y2="0%" id="g0"> <stop offset="5%" stop-color="black" /> <stop offset="50%" stop-color="red" /> <stop offset="95%" stop-color="black" /> </lineargradient> <rect x="1" y="1" width="
8" height="
8" fill="url(#g0)" /> <!-- here the gradient vector end at the bottom right corner of the bounding box of the shape it is applied to.
... --> <lineargradient y2="100%" id="g1"> <stop offset="5%" stop-color="black" /> <stop offset="50%" stop-color="red" /> <stop offset="95%" stop-color="black" /> </lineargradient> <rect x="11" y="1" width="
8" height="
8" fill="url(#g1)" /> </svg> specifications specification status comment scalable vector graphics (svg) 2the definition of 'y2' in that specification.
<mpath> - SVG: Scalable Vector Graphics
example svg <svg width="100%" height="100%" viewbox="0 0 500 300" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" > <rect x="1" y="1" width="49
8" height="29
8" 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 xlink:href="#path1"/> </animatemotion> </path> </svg> result specifications specification status comment svg animations level 2the definition of '<mpath>' in that spe...
<symbol> - SVG: Scalable Vector Graphics
html,body,svg { height:100% } <svg viewbox="0 0
80 20" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <!-- 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 h
80 m10,0 v20 m25,0 v20 m40,0 v20 m55,0 v20 m70,0 v20" fill="none" stroke...
...="pink" /> <!-- all instances of our symbol --> <use xlink:href="#mydot" x="5" y="5" style="opacity:1.0" /> <use xlink:href="#mydot" x="20" y="5" style="opacity:0.
8" /> <use xlink:href="#mydot" x="35" y="5" style="opacity:0.6" /> <use xlink:href="#mydot" x="50" y="5" style="opacity:0.4" /> <use xlink:href="#mydot" x="65" y="5" style="opacity:0.2" /> </svg> attributes height this attribute determines the height of the symbol.
Linking - SVG: Scalable Vector Graphics
when svg documents are embedded within a parent html document using the tag: page1.html: <html> <body> <p>this is a svg button:</p> <object width="100" height="50" type="image/svg+xml" data="button.svg"/> </body> </html> button.svg: <?xml version="1.1" encoding="utf-
8"?> <svg xmlns="http://www.w3.org/2000/svg"> <a xlink:href="page2.html" target="_top"> <g> <!-- button graphical elements here --> </g> </a> </svg> the specification says that the browser should navigate to the html document page2.html when the button graphics are clicked.
... to get around this, requires a little ugly javascript hacking: button.svg: <?xml version="1.1" encoding="utf-
8"?> <svg xmlns="http://www.w3.org/2000/svg"> <g onclick="top.document.href='page2.html'" cursor="pointer"> <!-- button graphical elements here --> </g> </svg> example for an example of this solution at work see www.codedread.com.
Filter effects - SVG: Scalable Vector Graphics
<svg width="250" viewbox="0 0 200
85" xmlns="http://www.w3.org/2000/svg" version="1.1"> <defs> <!-- filter declaration --> <filter id="myfilter" filterunits="userspaceonuse" x="0" y="0" width="200" height="120"> <!-- offsetblur --> <fegaussianblur in="sourcealpha" stddeviation="4" result="blur"/> <feoffset in="blur" dx="4" dy="4" result="offsetblur"/> <!-- litpaint --...
...int --> <femerge> <femergenode in="offsetblur"/> <femergenode in="litpaint"/> </femerge> </filter> </defs> <!-- graphic elements --> <g filter="url(#myfilter)"> <path fill="none" stroke="#d90000" stroke-width="10" d="m50,66 c-50,0 -50,-60 0,-60 h100 c50,0 50,60 0,60z" /> <path fill="#d90000" d="m60,56 c-30,0 -30,-40 0,-40 h
80 c30,0 30,40 0,40z" /> <g fill="#ffffff" stroke="black" font-size="45" font-family="verdana" > <text x="52" y="52">svg</text> </g> </g> </svg> step 1 <fegaussianblur in="sourcealpha" stddeviation="4" result="blur"/> <fegaussianblur> takes in "sourcealpha", which is the alpha channel of the source graphic, applies a blur of 4, and stores ...
Getting started - SVG: Scalable Vector Graphics
<svg version="1.1" baseprofile="full" width="300" height="200" xmlns="http://www.w3.org/2000/svg"> <rect width="100%" height="100%" fill="red" /> <circle cx="150" cy="100" r="
80" fill="green" /> <text x="150" y="125" font-size="60" text-anchor="middle" fill="white">svg</text> </svg> copy the code and paste it in a file demo1.svg.
... a green circle <circle> with a radius of
80px is drawn atop the center of the red rectangle (center of circle offset 150px to the right, and 100px downward from the top left corner).
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 frag...
...e { imgurl = 'img/default.png'; } let img = document.createelement('img'); img.src = imgurl; icon.appendchild(img); styling the shadow dom after that we create a <style> element and populate it with some css to style it: // create some css to apply to the shadow dom let style = document.createelement('style'); style.textcontent = ` .wrapper { position: relative; } .info { font-size: 0.
8rem; width: 200px; display: inline-block; border: 1px solid black; padding: 10px; background: white; border-radius: 10px; opacity: 0; transition: 0.6s all; position: absolute; bottom: 20px; left: 10px; z-index: 3; } img { width: 1.2rem; } .icon:hover + .info, .icon:focus + .info { opacity: 1; }`; attaching the shadow dom to the shadow root the final step is to att...
Using templates and slots - Web Components
creating a template with some slots first of all, we use the <slot> element within a <template> element to create a new "element-details-template" document fragment containing some named slots: <template id="element-details-template"> <style> details {font-family: "open sans light",helvetica,arial} .name {font-weight: bold; color: #217ac0; font-size: 120%} h4 { margin: 10px 0 -
8px 0; } h4 span { background: #217ac0; padding: 2px 6px 2px 6px } h4 span { border: 1px solid #cee9f9; border-radius: 4px } h4 span { color: white } .attributes { margin-left: 22px; font-size: 90% } .attributes p { margin-left: 16px; font-style: italic } </style> <details> <summary> <span> <code class="name"><<slot name="element-name">need name</slot>></code> ...
... dt { font-weight: bold; color: #217ac0; font-size: 110% } dt { font-family: consolas, "liberation mono", courier } dd { margin-left: 16px } </style> </head> <body> <template id="element-details-template"> <style> details {font-family: "open sans light",helvetica,arial} .name {font-weight: bold; color: #217ac0; font-size: 120%} h4 { margin: 10px 0 -
8px 0; } h4 span { background: #217ac0; padding: 2px 6px 2px 6px } h4 span { border: 1px solid #cee9f9; border-radius: 4px } h4 span { color: white } .attributes { margin-left: 22px; font-size: 90% } .attributes p { margin-left: 16px; font-style: italic } </style> <details> <summary> <span> <code class="name"><<slot name="el...
xml:base - XML: Extensible Markup Language
support was removed from blink (chrome and opera) in 2015: chromium bug 341
854 blink-dev mailing list post and from firefox 66 in bug 903372.
... <svg xml:base="https://foobar.s3-eu-west-1.amazonaws.com/uploads/15066
845653629" width="909" height="12
86" viewbox="0 0 909 12
86"xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <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-...
Advanced Example - XSLT: Extensible Stylesheet Language Transformations
figure 7: sorting based on div contentview example // xhtml fragment: <div id="example"> <div>1</div> <div>2</div> <div>3</div> <div>4</div> <div>5</div> <div>6</div> <div>7</div> <div>
8</div> <div>9</div> <div>10</div> </div> // javascript var xslref; var xslloaded = false; var xsltprocessor = new xsltprocessor(); var mydom; var xmlref = document.implementation.createdocument("", "", null); function sort() { if (!xslloaded){ p = new xmlhttprequest(); p.open("get", "example2.xsl", false); p.send(null); xslref = p.responsexml; xsltprocessor.importsty...
...null, "myorder", "descending"); // initiate the transformation var fragment = xsltprocessor.transformtofragment(xmlref, document); // clear the contents document.getelementbyid("example").innerhtml = ""; mydom = fragment; // add the new content from the transformation document.getelementbyid("example").appendchild(fragment) } // xsl stylesheet: <?xml version="1.0" encoding="utf-
8"?> <xsl:stylesheet version="1.0" xmlns="http://www.w3.org/1999/xhtml" xmlns:html="http://www.w3.org/1999/xhtml" xmlns:xsl="http://www.w3.org/1999/xsl/transform"> <xsl:output method="html" indent="yes" /> <xsl:param name="myorder" /> <xsl:template match="/"> <xsl:apply-templates select="/div//div"> <xsl:sort select="." data-type="number" order="{$myorder}" /> </xsl:apply-tem...
Compiling from Rust to WebAssembly - WebAssembly
create webpack.config.js and put the following in it: const path = require('path'); module.exports = { entry: "./index.js", output: { path: path.resolve(__dirname, "dist"), filename: "index.js", }, mode: "development" }; now we need an html file; create index.html and give it the following contents: <!doctype html> <html> <head> <meta charset="utf-
8"> <title>hello-wasm example</title> </head> <body> <script src="./index.js"></script> </body> </html> finally, create the index.js referenced in the html file and give it these contents: const js = import("./node_modules/hello-wasm/hello_wasm.js"); js.then(js => { js.greet("webassembly"); }); note that you need to fill in your npm username again.
...load http://localhost:
80
80 and an alert box appears on the screen, with hello, webassembly!
Using the CSS Typed Object Model - Web APIs
we'll take a look at that their types are by employing short javascript snippets outputting to console.log(): :root { --maincolor: hsl(19
8, 43%, 42%); --black: hsl(0, 0%, 16%); --white: hsl(0,0%,97%); --unit: 1.2rem; } button { --maincolor: hsl(19
8, 100%, 66%); display: inline-block; padding: var(--unit) calc(var(--unit)*2); width: calc(30% + 20px); background: no-repeat 5% center url(https://mdn.mozillademos.org/files/16793/magicwand.png) var(--maincolor); border: 4px solid var(--maincolor); border-radius: 2px; ...
CanvasPattern.setTransform() - Web APIs
nction() { var pattern = ctx.createpattern(img, 'repeat'); pattern.settransform(matrix.rotate(-45).scale(1.5)); ctx.fillstyle = pattern; ctx.fillrect(0, 0, 400, 400); }; note that newer browser versions started to support dommatrix as an input to settransform(), so for example you could replace the svgmatrix in the above example with the following: const matrix = new dommatrix([1, .2, .
8, 1, 0, 0]); edit the code below and see your changes update live in the canvas: playable code <canvas id="canvas" width="400" height="200" class="playable-canvas"></canvas> <svg id="svg1" style="display:none"></svg> <div class="playable-buttons"> <input id="edit" type="button" value="edit" /> <input id="reset" type="button" value="reset" /> </div> <textarea id="code" class="playable-code"...
CanvasRenderingContext2D.arcTo() - Web APIs
html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.beginpath(); ctx.moveto(1
80, 90); ctx.arcto(1
80,130, 110,130, 130); ctx.lineto(110, 130); ctx.stroke(); result live demo more sophisticated demo of the method.
CanvasRenderingContext2D.clearRect() - Web APIs
const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // draw yellow background ctx.beginpath(); ctx.fillstyle = '#ff6'; ctx.fillrect(0, 0, canvas.width, canvas.height); // draw blue triangle ctx.beginpath(); ctx.fillstyle = 'blue'; ctx.moveto(20, 20); ctx.lineto(1
80, 20); ctx.lineto(130, 130); ctx.closepath(); ctx.fill(); // clear part of the canvas ctx.clearrect(10, 10, 120, 100); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.clearrect' in that specification.
CanvasRenderingContext2D.clip() - Web APIs
html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // create clipping path let region = new path2d(); region.rect(
80, 10, 20, 130); region.rect(40, 50, 100, 50); ctx.clip(region, "evenodd"); // draw stuff that gets clipped ctx.fillstyle = 'blue'; ctx.fillrect(0, 0, canvas.width, canvas.height); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.clip' in that specification.
CanvasRenderingContext2D.closePath() - Web APIs
const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.beginpath(); ctx.arc(240, 20, 40, 0, math.pi); ctx.moveto(100, 20); ctx.arc(60, 20, 40, 0, math.pi); ctx.moveto(215,
80); ctx.arc(150,
80, 65, 0, math.pi); ctx.closepath(); ctx.linewidth = 6; ctx.stroke(); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.closepath' in that specification.
CanvasRenderingContext2D.createImageData() - Web APIs
const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); const imagedata = ctx.createimagedata(100, 50); console.log(imagedata); // imagedata { width: 100, height: 50, data: uint
8clampedarray[20000] } filling a blank imagedata object this example creates and fills a new imagedata object with purple pixels.
CanvasRenderingContext2D.direction - Web APIs
html <canvas id="canvas"></canvas> javascript var canvas = document.getelementbyid('canvas'); var ctx = canvas.getcontext('2d'); ctx.font = '4
8px serif'; ctx.filltext('hi!', 150, 50); ctx.direction = 'rtl'; ctx.filltext('hi!', 150, 130); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.direction' in that specification.
CanvasRenderingContext2D.drawFocusIfNeeded() - Web APIs
; const button1 = document.getelementbyid('button1'); const button2 = document.getelementbyid('button2'); document.addeventlistener('focus', redraw, true); document.addeventlistener('blur', redraw, true); canvas.addeventlistener('click', handleclick, false); redraw(); function redraw() { ctx.clearrect(0, 0, canvas.width, canvas.height); drawbutton(button1, 20, 20); drawbutton(button2, 20,
80); } function handleclick(e) { // calculate click coordinates const x = e.clientx - canvas.offsetleft; const y = e.clienty - canvas.offsettop; // focus button1, if appropriate drawbutton(button1, 20, 20); if (ctx.ispointinpath(x, y)) { button1.focus(); } // focus button2, if appropriate drawbutton(button2, 20,
80); if (ctx.ispointinpath(x, y)) { button2.focus(); }...
CanvasRenderingContext2D.font - Web APIs
html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.font = 'bold 4
8px serif'; ctx.stroketext('hello world', 50, 100); result loading fonts with the css font loading api with the help of the fontface api, you can explicitly load fonts before using them in a canvas.
CanvasRenderingContext2D.getTransform() - Web APIs
html <canvas width="240"></canvas> <canvas width="240"></canvas> css canvas { border: 1px solid black; } javascript const canvases = document.queryselectorall('canvas'); const ctx1 = canvases[0].getcontext('2d'); const ctx2 = canvases[1].getcontext('2d'); ctx1.settransform(1, .2, .
8, 1, 0, 0); ctx1.fillrect(25, 25, 50, 50); let storedtransform = ctx1.gettransform(); console.log(storedtransform); ctx2.settransform(storedtransform); ctx2.beginpath(); ctx2.arc(50, 50, 50, 0, 2 * math.pi); ctx2.fill(); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.gettransform' in that specificati...
CanvasRenderingContext2D.lineJoin - Web APIs
html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.linewidth = 20; ctx.linejoin = 'round'; ctx.beginpath(); ctx.moveto(20, 20); ctx.lineto(190, 100); ctx.lineto(2
80, 20); ctx.lineto(2
80, 150); ctx.stroke(); result comparison of line joins the example below draws three different paths, demonstrating each of the three linejoin options.
CanvasRenderingContext2D.lineTo() - Web APIs
html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.moveto(90, 130); ctx.lineto(95, 25); ctx.lineto(150,
80); ctx.lineto(205, 25); ctx.lineto(210, 130); ctx.linewidth = 15; ctx.stroke(); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.lineto' in that specification.
PublicKeyCredential.rawId - Web APIs
examples var options = { challenge: new uint
8array(26) /* from the server */, rp: { name: "example corp", id : "login.example.com" }, user: { id: new uint
8array(26), /* to be changed for each user */ name: "jdoe@example.com", displayname: "john doe", }, pubkeycredparams: [ { type: "public-key", alg: -7 } ] }; navigator.credentials.create({ publickey: options }) .then(function (pubkeycr...
PublicKeyCredential.response - Web APIs
examples var options = { challenge: new uint
8array(16) /* from the server */, rp: { name: "example corp", id : "login.example.com" }, user: { id: new uint
8array(16) /* from the server */, name: "jdoe@example.com", displayname: "john doe" }, pubkeycredparams: [ { type: "public-key", alg: -7 } ] }; navigator.credentials.create({ publickey: options }) .then(function (pubkeycredential) { ...
PublicKeyCredentialCreationOptions.attestation - Web APIs
examples var publickey = { attestation: "indirect", challenge: new uint
8array(26) /* this actually is given from the server */, rp: { name: "example corp", id : "login.example.com" }, user: { id: new uint
8array(26), /* to be changed for each user */ name: "jdoe@example.com", displayname: "john doe", }, pubkeycredparams: [ { type: "public-key", alg: -7 } ] }; navigator.credentials.create({ publickey }) .then(funct...
PublicKeyCredentialCreationOptions.authenticatorSelection - Web APIs
examples var publickey = { authenticatorselection:{ authenticatorattachment: "cross-platform", requireresidentkey: true, userverification: "required" }, challenge: new uint
8array(26) /* this actually is given from the server */, rp: { name: "example corp", id : "login.example.com" }, user: { id: new uint
8array(26), /* to be changed for each user */ name: "jdoe@example.com", displayname: "john doe", }, pubkeycredparams: [ { type: "public-key", alg: -7 } ] }; navigator.credentials.create({ publickey }) .then(function (newcreden...
PublicKeyCredentialCreationOptions.challenge - Web APIs
examples var publickey = { challenge: new uint
8array(26) /* this actually is given from the server */, rp: { name: "example corp", id : "login.example.com" }, user: { id: new uint
8array(26), /* to be changed for each user */ name: "jdoe@example.com", displayname: "john doe", }, pubkeycredparams: [ { type: "public-key", alg: -7 } ] }; navigator.credentials.create({ publickey }) .then(funct...
PublicKeyCredentialCreationOptions.excludeCredentials - Web APIs
examples var publickey = { excludecredentials: [ { type: "public-key", // the id for john.doe@example.com id : new uint
8array(26) /* this actually is given by the server */ }, { type: "public-key", // the id for john-doe@example.com id : new uint
8array(26) /* another id */ } ], challenge: new uint
8array(26) /* this actually is given from the server */, rp: { name: "example corp", id : "login.example.com" }, user: { id: new uint
8array(26), /* to be changed for eac...
PublicKeyCredentialCreationOptions.extensions - Web APIs
examples var publickey = { extensions:{ uvi: true, loc: false, uvm: false, exts: true }, challenge: new uint
8array(26) /* this actually is given from the server */, rp: { name: "example corp", id : "login.example.com" }, user: { id: new uint
8array(26), /* to be changed for each user */ name: "jdoe@example.com", displayname: "john doe", }, pubkeycredparams: [ { type: "public-key", alg: -7 } ] }; navigator.credentials.create({ publickey }) .then(function (newcreden...
PublicKeyCredentialCreationOptions.pubKeyCredParams - Web APIs
examples var publickey = { pubkeycredparams: [ // we would like an elliptic curve to be used if possible { type: "public-key", alg: -7 }, // if not, then we will fallback on an rsa algorithm { type: "public-key", alg: -37 } ], challenge: new uint
8array(26) /* this actually is given from the server */, rp: { name: "example corp", id : "login.example.com" }, user: { id: new uint
8array(26), /* to be changed for each user */ name: "jdoe@example.com", displayname: "john doe", } }; navigator.credentials.create({ publickey }) .then(function (newcredentialinfo) { // send attestation response and client extension...
PublicKeyCredentialCreationOptions.rp - Web APIs
examples var publickey = { challenge: /* from the server */, rp: { name: "example corp", id : "login.example.com", icon: "https://login.example.com/login.ico" }, user: { id: new uint
8array(16), name: "jdoe@example.com", displayname: "john doe" }, pubkeycredparams: [ { type: "public-key", alg: -7 } ] }; navigator.credentials.create({ publickey }) .then(function (newcredentialinfo) { // send attestation response and client extensions // to the server to proceed with the registration // of the credential }).catch(function (err) {...
PublicKeyCredentialCreationOptions.timeout - Web APIs
challenge: new uint
8array(26) /* this actually is given from the server */, rp: { name: "example corp", id : "login.example.com" }, user: { id: new uint
8array(26), /* to be changed for each user */ name: "jdoe@example.com", displayname: "john doe", }, pubkeycredparams: [ { type: "public-key", alg: -7 } ] }; navigator.credentials.create({ publickey }) .then(funct...
PublicKeyCredentialCreationOptions.user - Web APIs
examples var publickey = { challenge: new uint
8array(26) /* this actually is given from the server */, rp: { name: "example corp", id : "login.example.com" }, user: { // to be changed for each user id: new uint
8array.from(window.atob("laegmlkjnrlkgnamlafalfka="), c=>c.charcodeat(0)); name: "jdoe@example.com", displayname: "john doe", icon: "https://gravatar.com/avatar/jdoe.png" }, pubkeycredparams: [ ...
PublicKeyCredentialRequestOptions.allowCredentials - Web APIs
examples var options = { allowcredentials: [ { transports: ["usb"], type: "public-key", id: new uint
8array(26) // actually provided by the server }, { transports: ["internal"], type: "public-key", id: new uint
8array(26) // actually provided by the server } ], challenge: new uint
8array([/* bytes sent from the server */]) }; navigator.credentials.get({ "publickey": options }) .then(function (credentialinfoassertion) { // send assertion response back to the...
PublicKeyCredentialRequestOptions.challenge - Web APIs
examples var options = { challenge: new uint
8array([/* bytes sent from the server */]) }; navigator.credentials.get({ "publickey": options }) .then(function (credentialinfoassertion) { // send assertion response back to the server // to proceed with the control of the credential }).catch(function (err) { console.error(err); }); specifications specification status comment web authentication: a...
PublicKeyCredentialRequestOptions.extensions - Web APIs
examples var options = { extensions: { uvm: true, loc: false, txauthsimple: "could you please verify yourself?" }, challenge: new uint
8array([/* bytes sent from the server */]) }; navigator.credentials.get({ "publickey": options }) .then(function (credentialinfoassertion) { // send assertion response back to the server // to proceed with the control of the credential }).catch(function (err) { console.error(err); }); specifications specification status comment web authentication: a...
PublicKeyCredentialRequestOptions.rpId - Web APIs
examples var options = { challenge: new uint
8array([/* bytes sent from the server */]), rpid: "example.com" // will only work if the current domain // is something like foo.example.com }; navigator.credentials.get({ "publickey": options }) .then(function (credentialinfoassertion) { // send assertion response back to the server // to proceed with the control of the credential }).catch(function (err) { ...
page-break-before - CSS: Cascading Style Sheets
otes the values avoid, left, and right are unsupported.ie full support 4opera full support 7safari full support 1.2webview android full support 37chrome android full support 1
8firefox android full support 4notes full support 4notes notes the values avoid, left, and right are unsupported.opera android full support 14safari ios full support 1samsung internet android full support...
page-break-inside - CSS: Cascading Style Sheets
it has a little bit more text than the third one.</p> </div> css .page { background-color: #
8cffa0; height: 90px; width: 200px; columns: 1; column-width: 100px; } .list, ol, ul, p { break-inside: avoid; } p { background-color: #
8ca0ff; } ol, ul, .list { margin: 0.5em 0; display: block; background-color: orange; } p:first-child { margin-top: 0; } result specifications specification status comment css paged media module level 3the def...
paint() - CSS: Cascading Style Sheets
in this example, we passed two arguments: whether the background-image on a group of list items is filled or just has a stroke outline, and the width of that outline: <ul> <li>item 1</li> <li>item 2</li> <li>item 3</li> <li>item 4</li> <li>item 5</li> <li>item 6</li> <li>item 7</li> <li>item
8</li> <li>item 9</li> <li>item 10</li> <li>item 11</li> <li>item 12</li> <li>item 13</li> <li>item 14</li> <li>item 15</li> <li>item 16</li> <li>item 17</li> <li>item 1
8</li> <li>item 19</li> <li>item 20</li> </ul> css.paintworklet.addmodule('https://mdn.github.io/houdini-examples/csspaint/intro/worklets/hilite.js'); li { --boxcolor: hsla(55,...
<percentage> - CSS: Cascading Style Sheets
examples width and margin-left <div style="background-color:navy;"> <div style="width:50%; margin-left:20%; background-color:chartreuse;"> width: 50%, left margin: 20% </div> <div style="width:30%; margin-left:60%; background-color:pink;"> width: 30%, left margin: 60% </div> </div> the above html will output: font-size <div style="font-size:1
8px;"> <p>full-size text (1
8px)</p> <p><span style="font-size:50%;">50% (9px)</span></p> <p><span style="font-size:200%;">200% (36px)</span></p> </div> the above html will output: specifications specification status comment css values and units module level 4the definition of '<percentage>' in that specification.
perspective-origin - CSS: Cascading Style Sheets
e { display: block; position: absolute; width: 100px; height: 100px; border: none; line-height: 100px; font-family: sans-serif; font-size: 60px; color: white; text-align: center; } /* define each face based on direction */ .front { background: rgba(0, 0, 0, 0.3); transform: translatez(50px); } .back { background: rgba(0, 255, 0, 1); color: black; transform: rotatey(1
80deg) translatez(50px); } .right { background: rgba(196, 0, 0, 0.7); transform: rotatey(90deg) translatez(50px); } .left { background: rgba(0, 0, 196, 0.7); transform: rotatey(-90deg) translatez(50px); } .top { background: rgba(196, 196, 0, 0.7); transform: rotatex(90deg) translatez(50px); } .bottom { background: rgba(196, 0, 196, 0.7); transform: rotatex(-90deg) translatez(50px); ...
perspective - CSS: Cascading Style Sheets
{ display: block; position: absolute; width: 100px; height: 100px; border: none; line-height: 100px; font-family: sans-serif; font-size: 60px; color: white; text-align: center; } /* define each face based on direction */ .front { background: rgba(0, 0, 0, 0.3); transform: translatez(50px); } .back { background: rgba(0, 255, 0, 1); color: black; transform: rotatey(1
80deg) translatez(50px); } .right { background: rgba(196, 0, 0, 0.7); transform: rotatey(90deg) translatez(50px); } .left { background: rgba(0, 0, 196, 0.7); transform: rotatey(-90deg) translatez(50px); } .top { background: rgba(196, 196, 0, 0.7); transform: rotatex(90deg) translatez(50px); } .bottom { background: rgba(196, 0, 196, 0.7); transform: rotatex(-90deg) translatez(50p...
place-content - CSS: Cascading Style Sheets
", function (evt) { document.getelementbyid("container").style.writingmode = evt.target.value; }); var direction = document.getelementbyid("direction"); direction.addeventlistener("change", function (evt) { document.getelementbyid("container").style.direction = evt.target.value; }); css #container { display: flex; height:240px; width: 240px; flex-wrap: wrap; background-color: #
8c
8c
8c; writing-mode: horizontal-tb; /* can be changed in the live sample */ direction: ltr; /* can be changed in the live sample */ place-content: flex-end center; /* can be changed in the live sample */ } div > div { border: 2px solid #
8c
8c
8c; width: 50px; background-color: #a0c
8ff; } .small { font-size: 12px; height: 40px; } .large { font-size: 14px; height: 50px; } resu...
place-self - CSS: Cascading Style Sheets
html <article class="container"> <span>first</span> <span>second</span> <span>third</span> <span>fourth</span> </article> css html { font-family: helvetica, arial, sans-serif; letter-spacing: 1px; } article { background-color: red; display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows:
80px; grid-gap: 10px; width: 300px; } span:nth-child(2) { place-self: start center; } span:nth-child(3) { place-self: center start; } span:nth-child(4) { place-self: end; } article span { background-color: black; color: white; margin: 1px; text-align: center; } article, span { padding: 10px; border-radius: 7px; } article { margin: 20px; } result specifications ...
<position> - CSS: Cascading Style Sheets
examples valid positions center left center top right
8.5% bottom 12vmin right -6px 10% 20%
8rem 14px invalid positions left right bottom top 10px 15px 20px 15px specifications specification status comment css values and units module level 3the definition of '<position>' in that specification.
quotes - CSS: Cascading Style Sheets
irefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetquoteschrome full support 11edge full support 12firefox full support 1.5ie full support
8opera full support 4safari full support 9webview android full support 37chrome android full support 1
8firefox android full support 4opera android full support ...
repeat() - CSS: Cascading Style Sheets
</div> </div> css #container { display: grid; grid-template-columns: repeat(2, 50px 1fr) 100px; grid-gap: 5px; box-sizing: border-box; height: 200px; width: 100%; background-color: #
8cffa0; padding: 10px; } #container > div { background-color: #
8ca0ff; padding: 5px; } result specifications specification status comment css grid layoutthe definition of 'repeat()' in that specification.
right - CSS: Cascading Style Sheets
full support 1ie full support 5.5opera full support 5safari full support 1webview android full support 1chrome android full support 1
8firefox android full support 4opera android full support 14safari ios full support 1samsung internet android full support 1.0legend full support full s...
rotate - CSS: Cascading Style Sheets
on hover html <div> <p class="rotate">rotation</p> </div> css * { box-sizing: border-box; } html { font-family: sans-serif; } div { width: 150px; margin: 0 auto; } p { padding: 10px 5px; border: 3px solid black; border-radius: 20px; width: 150px; font-size: 1.2rem; text-align: center; } .rotate { transition: rotate 1s; } div:hover .rotate { rotate: 1 -0.5 1 1
80deg; } result specifications specification status comment css transforms level 2the definition of 'individual transforms' in that specification.
Array.prototype.filter() - JavaScript
function isbigenough(value) { return value >= 10 } let filtered = [12, 5,
8, 130, 44].filter(isbigenough) // filtered is [12, 130, 44] find all prime numbers in an array the following example returns all prime numbers in the array: const array = [-3, -2, -1, 0, 1, 2, 3, 4, 5, 6, 7,
8, 9, 10, 11, 12, 13]; function isprime(num) { for (let i = 2; num > i; i++) { if (num % i == 0) { return false; } } return num > 1; } console.log(array.filter(isprim...
Array.prototype.find() - JavaScript
name: 'cherries', quantity: 5 } find a prime number in an array the following example finds an element in the array that is a prime number (or returns undefined if there is no prime number): function isprime(element, index, array) { let start = 2; while (start <= math.sqrt(element)) { if (element % start++ < 1) { return false; } } return element > 1; } console.log([4, 6,
8, 12].find(isprime)); // undefined, not found console.log([4, 5,
8, 12].find(isprime)); // 5 the following examples show that nonexistent and deleted elements are visited, and that the value passed to the callback is their value when visited: // declare array with no elements at indexes 2, 3, and 4 const array = [0,1,,,,5,6]; // shows all indexes, not just those with assigned values array.find...
Array.prototype.findIndex() - JavaScript
function isprime(num) { for (let i = 2; num > i; i++) { if (num % i == 0) { return false; } } return num > 1; } console.log([4, 6,
8, 9, 12].findindex(isprime)); // -1, not found console.log([4, 6, 7, 9, 12].findindex(isprime)); // 2 (array[2] is 7) find index using arrow function the following example finds the index of a fruit using an arrow function: const fruits = ["apple", "banana", "cantaloupe", "blueberries", "grapefruit"]; const index = fruits.findindex(fruit => fruit === "blueberries"); console.log(index); // 3 ...
Array.prototype.flat() - JavaScript
ease check: https://discourse.mozilla.org/t/mdn-rfc-001-mdn-wiki-pages-shouldnt-be-a-distributor-of-polyfills/24500 examples flattening nested arrays const arr1 = [1, 2, [3, 4]]; arr1.flat(); // [1, 2, 3, 4] const arr2 = [1, 2, [3, 4, [5, 6]]]; arr2.flat(); // [1, 2, 3, 4, [5, 6]] const arr3 = [1, 2, [3, 4, [5, 6]]]; arr3.flat(2); // [1, 2, 3, 4, 5, 6] const arr4 = [1, 2, [3, 4, [5, 6, [7,
8, [9, 10]]]]]; arr4.flat(infinity); // [1, 2, 3, 4, 5, 6, 7,
8, 9, 10] flattening and array holes the flat method removes empty slots in arrays: const arr5 = [1, 2, , 4, 5]; arr5.flat(); // [1, 2, 4, 5] specifications specification ecmascript (ecma-262)the definition of 'array.prototype.flat' in that specification.
Array.prototype.forEach() - JavaScript
function flatten(arr) { const result = [] arr.foreach((i) => { if (array.isarray(i)) { result.push(...flatten(i)) } else { result.push(i) } }) return result } // usage const nested = [1, 2, 3, [4, 5, [6, 7],
8, 9]] flatten(nested) // [1, 2, 3, 4, 5, 6, 7,
8, 9] specifications specification ecmascript (ecma-262)the definition of 'array.prototype.foreach' in that specification.
Array.from() - JavaScript
len, setgetitemhandler(isiterator, items), isiterator, mapfn ); }; })(); } examples array from a string array.from('foo'); // [ "f", "o", "o" ] array from a set const set = new set(['foo', 'bar', 'baz', 'foo']); array.from(set); // [ "foo", "bar", "baz" ] array from a map const map = new map([[1, 2], [2, 4], [4,
8]]); array.from(map); // [[1, 2], [2, 4], [4,
8]] const mapper = new map([['1', 'a'], ['2', 'b']]); array.from(mapper.values()); // ['a', 'b']; array.from(mapper.keys()); // ['1', '2']; array from an array-like object (arguments) function f() { return array.from(arguments); } f(1, 2, 3); // [ 1, 2, 3 ] using arrow functions and array.from() // using an arrow function as the map function...
Array.isArray() - JavaScript
ay()); array.isarray(new array('a', 'b', 'c', 'd')); array.isarray(new array(3)); // little known fact: array.prototype itself is an array: array.isarray(array.prototype); // all following calls return false array.isarray(); array.isarray({}); array.isarray(null); array.isarray(undefined); array.isarray(17); array.isarray('array'); array.isarray(true); array.isarray(false); array.isarray(new uint
8array(32)); array.isarray({ __proto__: array.prototype }); instanceof vs isarray when checking for array instance, array.isarray is preferred over instanceof because it works through iframes.
Array.prototype.length - JavaScript
var numbers = [1, 2, 3, 4, 5]; var length = numbers.length; for (var i = 0; i < length; i++) { numbers[i] *= 2; } // numbers is now [2, 4, 6,
8, 10] shortening an array the following example shortens the array numbers to a length of 3 if the current length is greater than 3.
Array.prototype.toString() - JavaScript
ecmascript 5 semantics starting in javascript 1.
8.5 (firefox 4), and consistent with ecmascript 5th edition semantics, the tostring() method is generic and can be used with any object.
Array.prototype.unshift() - JavaScript
5, 6] examples using unshift let arr = [1, 2] arr.unshift(0) // result of the call is 3, which is the new array length // arr is [0, 1, 2] arr.unshift(-2, -1) // the new array length is 5 // arr is [-2, -1, 0, 1, 2] arr.unshift([-4, -3]) // the new array length is 6 // arr is [[-4, -3], -2, -1, 0, 1, 2] arr.unshift([-7, -6], [-5]) // the new array length is
8 // arr is [ [-7, -6], [-5], [-4, -3], -2, -1, 0, 1, 2 ] specifications specification ecmascript (ecma-262)the definition of 'array.prototype.unshift' in that specification.
ArrayBuffer() constructor - JavaScript
var dv = arraybuffer(10); // typeerror: calling a builtin arraybuffer constructor // without new is forbidden var dv = new arraybuffer(10); examples creating an arraybuffer in this example, we create a
8-byte buffer with a int32array view referring to the buffer: var buffer = new arraybuffer(
8); var view = new int32array(buffer); specifications specification ecmascript (ecma-262)the definition of 'arraybuffer' in that specification.
ArrayBuffer.prototype.byteLength - JavaScript
examples using bytelength var buffer = new arraybuffer(
8); buffer.bytelength; //
8 specifications specification ecmascript (ecma-262)the definition of 'arraybuffer.prototype.bytelength' in that specification.
String.prototype.trimStart() - JavaScript
oto=string.prototype; ((o,p)=>{ if(p in o?o[p]?false:true:true){ const r=/^\s+/; o[p]=o.trimleft||function(){ return this.replace(r,'') } } })(proto,'trimstart'); })(window); */ examples using trimstart() the following example displays the lowercase string 'foo ': var str = ' foo '; console.log(str.length); //
8 str = str.trimstart(); console.log(str.length); // 5 console.log(str); // 'foo ' specifications specification ecmascript (ecma-262)the definition of ' string.prototype.trimstart' in that specification.
TypedArray.prototype[@@iterator]() - JavaScript
examples iteration using for...of loop var arr = new uint
8array([10, 20, 30, 40, 50]); // your browser must support for..of loop // and let-scoped variables in for loops for (let n of arr) { console.log(n); } alternative iteration var arr = new uint
8array([10, 20, 30, 40, 50]); var earr = arr[symbol.iterator](); console.log(earr.next().value); // 10 console.log(earr.next().value); // 20 console.log(earr.next().value); // 30 console.log(earr.next().value); // 40 console.log(earr.next().value); // 50 specifications specification e...
TypedArray.BYTES_PER_ELEMENT - JavaScript
examples using bytes_per_element int
8array.bytes_per_element; // 1 uint
8array.bytes_per_element; // 1 uint
8clampedarray.bytes_per_element; // 1 int16array.bytes_per_element; // 2 uint16array.bytes_per_element; // 2 int32array.bytes_per_element; // 4 uint32array.bytes_per_element; // 4 float32array.bytes_per_element; // 4 float64array.bytes_per_element; //
8 specifications ...
TypedArray.prototype.buffer - JavaScript
examples using the buffer property var buffer = new arraybuffer(
8); var uint16 = new uint16array(buffer); uint16.buffer; // arraybuffer { bytelength:
8 } specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.buffer' in that specification.
TypedArray.prototype.byteLength - JavaScript
examples using the bytelength property var buffer = new arraybuffer(
8); var uint
8 = new uint
8array(buffer); uint
8.bytelength; //
8 (matches the bytelength of the buffer) var uint
8 = new uint
8array(buffer, 1, 5); uint
8.bytelength; // 5 (as specified when constructing the uint
8array) var uint
8 = new uint
8array(buffer, 2); uint
8.bytelength; // 6 (due to the offset of the constructed uint
8array) specifications specification ecmascript (ecma-262)...
TypedArray.prototype.byteOffset - JavaScript
examples using the byteoffset property var buffer = new arraybuffer(
8); var uint
8 = new uint
8array(buffer); uint
8.byteoffset; // 0 (no offset specified) var uint
8 = new uint
8array(buffer, 3); uint
8.byteoffset; // 3 (as specified when constructing uint
8array) specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.byteoffset' in that specification.
TypedArray.prototype.copyWithin() - JavaScript
examples using copywithin var buffer = new arraybuffer(
8); var uint
8 = new uint
8array(buffer); uint
8.set([1,2,3]); console.log(uint
8); // uint
8array [ 1, 2, 3, 0, 0, 0, 0, 0 ] uint
8.copywithin(3,0,3); console.log(uint
8); // uint
8array [ 1, 2, 3, 1, 2, 3, 0, 0 ] specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.copywithin' in that specification.
TypedArray.prototype.entries() - JavaScript
examples iteration using for...of loop var arr = new uint
8array([10, 20, 30, 40, 50]); var earray = arr.entries(); // your browser must support for..of loop // and let-scoped variables in for loops for (let n of earray) { console.log(n); } alternative iteration var arr = new uint
8array([10, 20, 30, 40, 50]); var earr = arr.entries(); console.log(earr.next().value); // [0, 10] console.log(earr.next().value); // [1, 20] console.log(earr.next().value);...
TypedArray.prototype.find() - JavaScript
function isprime(element, index, array) { var start = 2; while (start <= math.sqrt(element)) { if (element % start++ < 1) { return false; } } return element > 1; } var uint
8 = new uint
8array([4, 5,
8, 12]); console.log(uint
8.find(isprime)); // 5 specifications specification ecmascript (ecma-262)the definition of '%typedarray%.prototype.find' in that specification.
TypedArray.prototype.findIndex() - JavaScript
function isprime(element, index, array) { var start = 2; while (start <= math.sqrt(element)) { if (element % start++ < 1) { return false; } } return element > 1; } var uint
8 = new uint
8array([4, 6,
8, 12]); var uint16 = new uint16array([4, 6, 7, 12]); console.log(uint
8.findindex(isprime)); // -1, not found console.log(uint16.findindex(isprime)); // 2 specifications specification ecmascript (ecma-262)the definition of '%typedarray%.prototype.findindex' in that specification.
TypedArray.prototype.forEach() - JavaScript
examples logging the contents of a typed array the following code logs a line for each element in a typed array: function logarrayelements(element, index, array) { console.log('a[' + index + '] = ' + element); } new uint
8array([0, 1, 2, 3]).foreach(logarrayelements); // logs: // a[0] = 0 // a[1] = 1 // a[2] = 2 // a[3] = 3 specifications specification ecmascript (ecma-262)the definition of '%typedarray%.prototype.foreach' in that specification.
TypedArray.prototype.includes() - JavaScript
examples using includes var uint
8 = new uint
8array([1,2,3]); uint
8.includes(2); // true uint
8.includes(4); // false uint
8.includes(3, 3); // false // nan handling (only true for float32 and float64) new uint
8array([nan]).includes(nan); // false, since the nan passed to the constructor gets converted to 0 new float32array([nan]).includes(nan); // true; new float64array([nan]).includes(nan); // true; specifications ...
TypedArray.prototype.indexOf() - JavaScript
examples using indexof var uint
8 = new uint
8array([2, 5, 9]); uint
8.indexof(2); // 0 uint
8.indexof(7); // -1 uint
8.indexof(9, 2); // 2 uint
8.indexof(2, -1); // -1 uint
8.indexof(2, -3); // 0 specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.indexof' in that specification.
TypedArray.prototype.keys() - JavaScript
examples iteration using for...of loop var arr = new uint
8array([10, 20, 30, 40, 50]); var earray = arr.keys(); // your browser must support for..of loop // and let-scoped variables in for loops for (let n of earray) { console.log(n); } alternative iteration var arr = new uint
8array([10, 20, 30, 40, 50]); var earr = arr.keys(); console.log(earr.next().value); // 0 console.log(earr.next().value); // 1 console.log(earr.next().value); // 2 console.log(...
TypedArray.prototype.lastIndexOf() - JavaScript
examples using lastindexof var uint
8 = new uint
8array([2, 5, 9, 2]); uint
8.lastindexof(2); // 3 uint
8.lastindexof(7); // -1 uint
8.lastindexof(2, 3); // 3 uint
8.lastindexof(2, 2); // 0 uint
8.lastindexof(2, -2); // 0 uint
8.lastindexof(2, -1); // 3 specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.lastindexof' in that specification.
TypedArray.prototype.length - JavaScript
examples using the length property var buffer = new arraybuffer(
8); var uint
8 = new uint
8array(buffer); uint
8.length; //
8 (matches the length of the buffer) var uint
8 = new uint
8array(buffer, 1, 5); uint
8.length; // 5 (as specified when constructing the uint
8array) var uint
8 = new uint
8array(buffer, 2); uint
8.length; // 6 (due to the offset of the constructed uint
8array) specifications specification ecmascript (ecma-262)the definition o...
TypedArray.prototype.reduce() - JavaScript
examples sum up all values within an array var total = new uint
8array([0, 1, 2, 3]).reduce(function(a, b) { return a + b; }); // total == 6 specifications specification ecmascript (ecma-262)the definition of '%typedarray%.prototype.reduce' in that specification.
TypedArray.prototype.reduceRight() - JavaScript
examples sum up all values within an array var total = new uint
8array([0, 1, 2, 3]).reduceright(function(a, b) { return a + b; }); // total == 6 specifications specification ecmascript (ecma-262)the definition of '%typedarray%.prototype.reduceright' in that specification.
TypedArray.prototype.reverse() - JavaScript
examples using reverse var uint
8 = new uint
8array([1, 2, 3]); uint
8.reverse(); console.log(uint
8); // uint
8array [3, 2, 1] specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.reverse' in that specification.
TypedArray.prototype.set() - JavaScript
examples using set() var buffer = new arraybuffer(
8); var uint
8 = new uint
8array(buffer); uint
8.set([1, 2, 3], 3); console.log(uint
8); // uint
8array [ 0, 0, 0, 1, 2, 3, 0, 0 ] specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.set' in that specification.
TypedArray.prototype.sort() - JavaScript
let numbers = new uint
8array([40, 1, 5, 200]); numbers.sort(); // uint
8array [ 1, 5, 40, 200 ] // unlike plain arrays, a compare function is not required // to sort the numbers numerically.
TypedArray.prototype.subarray() - JavaScript
examples using the subarray method var buffer = new arraybuffer(
8); var uint
8 = new uint
8array(buffer); uint
8.set([1,2,3]); console.log(uint
8); // uint
8array [ 1, 2, 3, 0, 0, 0, 0, 0 ] var sub = uint
8.subarray(0,4); console.log(sub); // uint
8array [ 1, 2, 3, 0 ] specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.subarray' in that specification.
TypedArray.prototype.toLocaleString() - JavaScript
examples using tolocalestring var uint = new uint32array([2000, 500,
8123, 12, 4212]); uint.tolocalestring(); // if run in a de-de locale // "2.000,500,
8.123,12,4.212" uint.tolocalestring('en-us'); // "2,000,500,
8,123,12,4,212" uint.tolocalestring('ja-jp', { style: 'currency', currency: 'jpy' }); // "¥2,000,¥500,¥
8,123,¥12,¥4,212" specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.tolocalestrin...
TypedArray.prototype.values() - JavaScript
examples iteration using for...of loop var arr = new uint
8array([10, 20, 30, 40, 50]); var earray = arr.values(); // your browser must support for..of loop // and let-scoped variables in for loops for (let n of earray) { console.log(n); } alternative iteration var arr = new uint
8array([10, 20, 30, 40, 50]); var earr = arr.values(); console.log(earr.next().value); // 10 console.log(earr.next().value); // 20 console.log(earr.next().value); // 30 conso...
Uint16Array() constructor - JavaScript
nt16 = new uint16array(2); uint16[0] = 42; console.log(uint16[0]); // 42 console.log(uint16.length); // 2 console.log(uint16.bytes_per_element); // 2 // from an array var arr = new uint16array([21,31]); console.log(arr[1]); // 31 // from another typedarray var x = new uint16array([21, 31]); var y = new uint16array(x); console.log(y[0]); // 21 // from an arraybuffer var buffer = new arraybuffer(
8); var z = new uint16array(buffer, 0, 4); // from an iterable var iterable = function*(){ yield* [1,2,3]; }(); var uint16 = new uint16array(iterable); // uint16array[1, 2, 3] specifications specification ecmascript (ecma-262)the definition of 'typedarray constructors' in that specification.
Uint16Array - JavaScript
nt16 = new uint16array(2); uint16[0] = 42; console.log(uint16[0]); // 42 console.log(uint16.length); // 2 console.log(uint16.bytes_per_element); // 2 // from an array var arr = new uint16array([21,31]); console.log(arr[1]); // 31 // from another typedarray var x = new uint16array([21, 31]); var y = new uint16array(x); console.log(y[0]); // 21 // from an arraybuffer var buffer = new arraybuffer(
8); var z = new uint16array(buffer, 0, 4); // from an iterable var iterable = function*(){ yield* [1,2,3]; }(); var uint16 = new uint16array(iterable); // uint16array[1, 2, 3] specifications specification ecmascript (ecma-262)the definition of 'typedarray constructors' in that specification.
WebAssembly.CompileError() constructor - JavaScript
rt 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.0legend full support full support no support no supportsee implementation notes.see implementation notes.
WebAssembly.Instance() constructor - JavaScript
rt 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.0legend full support full support no support no supportsee implementation notes.see implementation notes.
WebAssembly.Instance.prototype.exports - JavaScript
rt 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.0legend full support full support no support no supportsee implementation notes.see implementation notes.
WebAssembly.LinkError() constructor - JavaScript
rt 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.0legend full support full support no support no supportsee implementation notes.see implementation notes.