Search completed in 0.90 seconds.
-ms-high-contrast - CSS: Cascading Style Sheets
the -ms-
high-contrast css media feature is a microsoft extension that describes whether the application is being displayed in
high contrast mode, and with what color variation.
...
high contrast mode is a specialized display mode that prioritizes making content as legible as possible by dynamically replacing foreground and background colors with a user-specified theme.
... syntax the -ms-
high-contrast media feature is specified as one of the following values.
...And 12 more matches
Highlight and inspect DOM nodes - Firefox Developer Tools
if you hover over a dom node in the watch expresions, it will be
highlighted in the page.
... when you are working with dom notes in the debugger, you can easily
highlight the node on the page or view it in the page inspector.
...hover over the target to
highlight the item on the page, click on the target to switch to the page inspector with the item
highlighted.
...And 2 more matches
DOMHighResTimeStamp - Web APIs
the dom
highrestimestamp type is a double and is used to store a time value in milliseconds.
... value the value of a dom
highrestimestamp is a double-precision floating-point number which describes the number of milliseconds (accurate to within 5 microseconds if the device supports it) elapsed between two points in time.
... specifications specification status comment
high resolution time level 2the definition of 'dom
highrestimestamp' in that specification.
...And 2 more matches
-ms-high-contrast-adjust - Archive of obsolete content
the -ms-
high-contrast-adjust css property is a microsoft extension that gets or sets a value indicating whether to override any css properties that would have been set in
high contrast mode.
... initial valueautoapplies toall elementsinheritedyescomputed valueas specifiedanimation typediscrete syntax values auto indicates the applicable css properties will be adjusted as expected when the system is in
high contrast mode.
... none indicates the applicable css properties will not be adjusted when the system is in
high contrast mode.
... remarks the -ms-
high-contrast-adjust property works with the -ms-
high-contrast media feature.
-ms-scrollbar-highlight-color - Archive of obsolete content
the -ms-scrollbar-
highlight-color css property is a microsoft extension that specifies the color of the slider tray, the top and left edges of the scroll box, and the scroll arrows of a scroll bar.
... initial valuethreed
highlightapplies toall elementsinheritedyescomputed valueas specifiedanimation typediscrete syntax values <color> the color of the slider tray, the top and left edges of the scroll box, and the scroll arrows of a scroll bar.
...)where <alpha-value> = <number> | <percentage><hue> = <number> | <angle> examples this example uses -ms-scrollbar-
highlight-color, -ms-scrollbar-face-color, and -ms-scrollbar-arrow-color to create two <div> objects with different scroll bar color schemes.
... div { width: 150px; height: 150px; border-style: solid; border-width: thin; overflow-y: scroll; font-family: sans-serif; float: left; margin-right: 10px; } .bluescroll { -ms-scrollbar-
highlight-color: aqua; -ms-scrollbar-face-color: blue; -ms-scrollbar-arrow-color: blue; border-color: blue; } .redscroll { -ms-scrollbar-
highlight-color: bisque; -ms-scrollbar-face-color: red; -ms-scrollbar-arrow-color: red; border-color: red; } <body> <div class="bluescroll"> lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
High-level programming language - MDN Web Docs Glossary: Definitions of Web-related terms
a
high-level programming language has a significant abstraction from the details of computer operation.
...the amount of abstraction provided defines how "
high-level" a programming language is.
... the idea of a language automatically translatable into machine code, but nearer to human logic, was introduced in computer science in the 1950s, especially thanks to the work of john backus (ibm), to whom it owes the first
high-level language to have been widely circulated: fortran.
view_source.syntax_highlight
the preference view_source.syntax_
highlight controls whether markup in the view source view is syntax
highlighted.
... type:boolean default value: true exists by default: yes application support:firefox 1.0 status: active introduction: bugs: bug 52154 values true (default) syntax
hightlighting is enabled.
... false syntax
hightlighting is disabled.
-webkit-tap-highlight-color - CSS: Cascading Style Sheets
-webkit-tap-
highlight-color is a non-standard css property that sets the color of the
highlight that appears over a link while it's being tapped.
... the
highlighting indicates to the user that their tap is being successfully recognized, and indicates which element they're tapping on.
... -webkit-tap-
highlight-color: red; -webkit-tap-
highlight-color: transparent; /* for removing the
highlight */ syntax values a <color value>.
math:highest() - EXSLT
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes math:
highest() returns the node in the specified node-set with the
highest value (where the
highest value calculated using math:max()).
... syntax math:
highest(nodeset) parameters nodeset the node-set whose
highest value is to be returned.
... specifications exslt - math:
highest ...
Select and highlight elements - Firefox Developer Tools
the
highlighted element is the element that's overlaid in the page with a graphic showing the box model, and a tooltip showing its tag and size: with the context menu to open the inspector and select an element immediately, activate the context menu over the element in the page and select "inspect element": with the html pane when the inspector is open, as you move the mouse around the elements listed in the html pane, the corresponding elements are
highlighted in the page.
...after that, as you move the mouse around the page, the element under the mouse is
highlighted.
PositionOptions.enableHighAccuracy - Web APIs
the positionoptions.enable
highaccuracy property is a boolean that indicates the application would like to receive the best possible results.
... syntax positionoptions.enable
highaccuracy = booleanvalue specifications specification status comment geolocation apithe definition of 'positionoptions.enable
highaccuracy' in that specification.
toggleHighlight - Archive of obsolete content
« xul reference home toggle
highlight(
highlight ) return type: no return value turns
highlighting of text matching the search term on and off; specify false to disable
highlighting or true to enable it.
High-level guides - Web APIs
the
high-level guides listed below introduce webrtc technology from a top-down perspective, describing the overall architecture, the life cycle of a webrtc connection, and basic security and technological issues you might run into as you explore and build web content or apps using the webrtc api.
Index - Web APIs
298 blobevent.timecode api, blobevent, media, media stream recording, property, reference the timecode readonlyinline property of the blobevent interface a dom
highrestimestamp indicating the difference between the timestamp of the first chunk in data, and the timestamp of the first chunk in the first blobevent produced by this recorder.
... 424 cssnumericvalue.max() api, css typed object model api, cssnumericvalue, experimental, houdini, method, reference, max() the max() method of the cssnumericvalue interface returns the
highest value from among the values passed.
...it takes a lot of time to redraw complex frames and the performance depends
highly on the speed of the computer it's running on.
...And 33 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 (1920x1080) video in full color (4 bytes per pixel) is 8,294,400 bytes.
... codec name (short) full codec name container support av1 aomedia video 1 mp4, 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 vp8 video processor 8 3gp, ogg, webm vp9 video processor 9 mp4, ogg, webm factors affecting the encoded video as...
... the potential effect of source video format and contents on the encoded video quality and size feature effect on quality effect on size color depth (bit depth) the
higher the color bit depth, the
higher the quality of color fidelity is achieved in the video.
...And 32 more matches
Index - Archive of obsolete content
syntax
highliting support for .htaccess files less.
... 40
high-level apis add-on sdk no summary!
...it's a work-in-progress, with questions in red
highlight.
...And 22 more matches
Digital audio concepts - Web media technologies
the farther the air molecules move with each pulse of the wave, the
higher the amplitude of the wave, and the louder the sound is.
... the faster the molecules vibrate, the
higher the frequency of the wave.
... the
higher the amplitude (height) of the wave, the louder the sound is at that instant.
...And 17 more matches
<color> - CSS: Cascading Style Sheets
activetext text of active links buttonface background of push buttons buttontext text of push buttons canvas background of application content or documents canvastext text in application content or documents field background of input fields fieldtext text in input fields graytext text that is disabled
highlight background of items that are selected in a control
highlighttext text of items that are selected in a control linktext text of non-active, non-visited links visitedtext text of visited links deprecated system color keywords the following keywords were defined in earlier versions of the css color module.
... button
highlight the color of the border facing the light source for 3-d elements that appear 3-d due to that layer of surrounding border.
... threed
highlight the color of the lighter (generally outer) of the two borders facing the light source for 3-d elements that appear 3-d due to two concentric layers of surrounding border.
...And 15 more matches
Power profiling overview
the other states have
higher numbers and reflect increasing deeper idle states.
...the important thing is that c0 is always the active state, and for the idle states a
higher number always means less power consumption.
...p0 is the state where the processor is operating at maximum frequency and voltage, and
higher-numbered p-states operate at a lower frequency and voltage to reduce power consumption.
...And 13 more matches
Using the CSS Painting API - Web APIs
to programmatically create an image used by a css stylesheet we need to work through a few steps: define a paint worklet using the registerpaint() function register the worklet include the paint() css function to elaborate over these steps, we're going to start by creating a half-
highlight background, like on this header: css paint worklet in an external script file, we employ the registerpaint() function to name our css paint worklet.
... registerpaint('header
highlight', class { /* define if alphatransparency is allowed alpha is set to true by default.
... css.paintworklet.addmodule('https://mdn.github.io/houdini-examples/csspaint/intro/01partone/header-
highlight.js'); reference the paint worklet in css once we have a registered paint worklet, we can use it in css.
...And 13 more matches
Web audio codec guide - Web media technologies
even modest quality,
high-fidelity stereo sound can use a substantial amount of disk space.
... sample rate the more samples available per second, the
higher the resulting encoded audio fidelity is likely to be.
... the effect of codec configuration on encoded audio output audio codecs typically employ cleverly-designed and
highly-complex mathematical algorithms to take source audio data and compress it to take substantially less space in memory or network bandwidth.
...And 13 more matches
PerformanceResourceTiming - Web APIs
the interface's properties create a resource loading timeline with
high-resolution timestamps for network events such as redirect start and end times, fetch start, dns lookup start and end times, response start and end times, etc..
... performanceresourcetiming.workerstartread only returns a dom
highrestimestamp immediately before dispatching the fetchevent if a service worker thread is already running, or immediately before starting the service worker thread if it is not already running.
... performanceresourcetiming.redirectstartread only a dom
highrestimestamp that represents the start time of the fetch which initiates the redirect.
...And 10 more matches
Performance fundamentals - Web Performance
on a computer display, a
higher framerate simply makes for a more faithful imitation of reality.
...
high-level declarative languages), or use low-level imperative interfaces offered by the <canvas> element (which includes webgl).
...transitions and animations are particularly important to applications: developers can use css to declare complicated behaviour with a simple,
high-level syntax.
...And 10 more matches
Handling common accessibility problems - Learn web development
prerequisites: familiarity with the core html, css, and javascript languages; an idea of the
high level principles of cross browser testing.
...really, the aim of accessibility is to make your websites/apps usable by as many people in as many contexts as possible, not just those users using
high-powered desktop computers.
... you can try this out using our native-keyboard-accessibility.html example (see the source code) — open this in a new tab, and try pressing the tab key; after a few presses, you should see the tab focus start to move through the different focusable elements; the focused elements are given a
highlighted default style in every browser (it differs slightly between different browsers) so that you can tell what element is focused.
...And 9 more matches
Performance API - Web APIs
the
high resolution time standard defines a performance interface that supports client-side latency measurements within applications.
... the performance interfaces are considered
high resolution because they are accurate to a thousandth of a millisecond (subject to hardware or software constraints).
...as such, the performance api defines a dom
highrestimestamp type rather than using the date.now() interface.
...And 9 more matches
Index - MDN Web Docs Glossary: Definitions of Web-related terms
cdns make for fast service less affected by
high traffic.
... crud typically refers to operations performed in a database or datastore, but it can also apply to
higher level functions of an application such as soft deletes where data is not actually deleted but marked as deleted via a status.
... 203
high-level programming language codingscripting, glossary a
high-level programming language has a significant abstraction from the details of computer operation.
...And 8 more matches
PerformanceNavigationTiming - Web APIs
performanceentry.starttime read only returns a dom
highrestimestamp with a value of "0".
... the interface also supports the following properties: performancenavigationtiming.domcomplete read only a dom
highrestimestamp representing a time value equal to the time immediately before the browser sets the current document readiness of the current document to complete.
... performancenavigationtiming.domcontentloadedeventend read only a dom
highrestimestamp representing the time value equal to the time immediately after the current document's domcontentloaded event completes.
...And 8 more matches
WebGL best practices - Web APIs
this page tackles recommendations across the spectrum of expertise, and not only
highlights dos and don'ts, but also details why.
...m(prog); if (!gl.getprogramparameter(vs, gl.link_status)) { console.error('link failed: ' + gl.getprograminfolog(prog)); console.error('vs info-log: ' + gl.getshaderinfolog(vs)); console.error('fs info-log: ' + gl.getshaderinfolog(fs)); } be precise with glsl variable precision annotations if you expect to pass an essl300 int between shaders, and you need it to have 32-bits, you must use
highp or you will have portability problems.
... (works on desktop, not on android) if you have a float texture, ios requires that you use
highp sampler2d foo;, or it will very painfully give you lowp texture samples!
...And 8 more matches
How to build custom form controls - Learn web development
finally, let's define how the control's options will behave: when the control is opened, the selected option is
highlighted when the mouse is over an option, the option is
highlighted and the previously
highlighted option is returned to its normal state for the purposes of our example, we'll stop with that; however, if you're a careful reader, you'll notice that some behaviors are missing.
...on the other hand, if you consider that the active state and the open state overlap a bit, the value may change but the option will definitely not be
highlighted accordingly, once again because we did not define any keyboard interactions over options when the control is in its opened state (we have only defined what should happen when the control is opened, but nothing after that).
... if it can't, the content will be truncated) */ max-height: 10em; /* 100px */ overflow-y: auto; overflow-x: hidden; border: .2em solid #000; border-top-width : .1em; border-radius: 0 0 .4em .4em; box-shadow: 0 .2em .4em rgba(0,0,0,.4); background: #f0f0f0; } for the options, we need to add a
highlight class to be able to identify the value the user will pick (or has picked).
...And 7 more matches
Cascade and inheritance - Learn web development
a class selector is more specific — it will select only the elements on a page that have a specific class attribute value — so will get a
higher score.
...the below h1 ends up being colored red — the class selector gives its rule a
higher specificity, and so it will be applied even though the rule with the element selector appears further down in the source order.
...this is because that earlier rule has a
higher specificity — it is more specific, and therefore is being chosen by the browser as the one that should style the element.
...And 6 more matches
source-editor.jsm
editor mode constants these constants are used to set the syntax
highlighting mode for the editor by calling its setmode() method, or in the configuration object when first initializing the editor using its init() method.
... theme constants these constants are used to identify the available themes that can be used by the syntax
highlighter.
... constant value description sourceeditor.themes.mozilla "mozilla" the default mozilla syntax
highlighter theme.
...And 6 more matches
NSS API Guidelines
the layering section explains how the nss code is layered, and how
higher-level functions wrap low-level functions.
...in addition, some low-level apis may be completely opaque to
higher level layers.
...the areas which need the most work (both here and throughout the code) is: the relationship of the certificate library with just about every other component (most noticeably pkcs #12, pkcs #7, and pkcs #11) splitting low key and
high key components more clearly the crypto wrappers (pkcs #11 wrappers) and
high key pkcs #12 and pkcs #5 libraries nss compiles into the libraries described below.
...And 6 more matches
Implementing a Microsoft Active Accessibility (MSAA) Server - Accessibility
ing state_marqueed state_animated state_invisible state_offscreen [important] state_sizeable state_moveable state_selfvoicing state_focusable [important] state_selectable [important] state_linked [important] state_traversed [important] state_multiselectable [important] state_extselectable state_alert_low state_alert_medium state_alert_
high state_protected [important] state_haspopup msaa roles cheat sheet for information on what each role does, see the msdn role constants page.
... hacky
highlight tracking causes problems problem: screen readers ignore the msaa focus whenever a
highlight bar moves, speaking the current
highlighted text instead.
... the implementation of automated
highlight tracking simply reads any text that is currently
highlighted, even if it resides in several places on the screen.
...And 6 more matches
Release notes - Archive of obsolete content
firefox 35
highlights added access keys for context menu.
... firefox 34
highlights new api: dev/panel enables you to extend the firefox developer tools.
... firefox 33
highlights added support for context menus in panels via a new option in the panel constructor.
...And 5 more matches
Introduction to the server side - Learn web development
in this first article, we look at server-side programming from a
high level, answering questions such as "what is it?", "how does it differ from client-side programming?", and "why it is so useful?".
...dynamic sites can
highlight content that is more relevant based on user preferences and habits.
... in the modern world of web development, learning about server-side development is
highly recommended.
...And 5 more matches
JS_GetGCParameter
typedef enum jsgcparamkey { jsgc_max_bytes, jsgc_max_malloc_bytes, jsgc_max_nursery_bytes, jsgc_bytes, jsgc_number, jsgc_mode, jsgc_unused_chunks, jsgc_total_chunks, jsgc_slice_time_budget, jsgc_mark_stack_limit, jsgc_
high_frequency_time_limit, jsgc_
high_frequency_low_limit, jsgc_
high_frequency_
high_limit, jsgc_
high_frequency_heap_growth_max, jsgc_
high_frequency_heap_growth_min, jsgc_low_frequency_heap_growth, jsgc_dynamic_heap_growth, jsgc_dynamic_mark_slice, jsgc_allocation_threshold, jsgc_min_empty_chunk_count, jsgc_max_empty_chunk_count, jsgc_compaction_enabled, j...
... jsgc_
high_frequency_time_limit / "
highfrequencytimelimit" gcs less than this far apart in time will be considered '
high-frequency gcs'.
... jsgc_
high_frequency_low_limit / "
highfrequencylowlimit" controls for dynamic heap growth.
...And 5 more matches
Index - Archive of obsolete content
when those elements have reached their maximum sizes, the elements with the next
higher flexgroup are flexed.
... 143
highlightaccesskey no summary!
... 144
highlightnonmatches xul attributes, xul reference no summary!
...And 4 more matches
Index - Game development
19 building up a basic demo with playcanvas editor 3d, animation, beginner, canvas, games, lightning, online, playcanvas, tutorial, webgl, camera, editor, rendering now you can check the playcanvas engine article if you haven't seen it yet, go back to the building up a basic demo with playcanvas page, or go back a level
higher to the main 3d games on the web page.
... 20 building up a basic demo with the playcanvas engine 3d, animation, beginner, canvas, games, playcanvas, tutorial, webgl, camera, engine, lighting, rendering now you can continue reading the playcanvas editor article, go back to the building up a basic demo with playcanvas page, or go back a level
higher to the main 3d games on the web page.
... 27 crisp pixel art look with image-rendering 2d, 3d, css, canvas, games, javascript, webgl, image-rendering, pixel this article discusses a useful technique for giving your canvas/webgl games a crisp pixel art look, even on
high definition monitors.
...And 4 more matches
Other form controls - Learn web development
this value is visually rendered as a bar, and to know how this bar looks, we compare the value to some other set values: the low and
high values divide the range in three parts: the lower part of the range is between the min and low values, inclusive.
... the medium part of the range is between the low and
high values, exclusive.
... the
higher part of the range is between the
high and max values, inclusive.
...And 4 more matches
A first splash into JavaScript - Learn web development
you won't be expected to understand all of the code in detail immediately — we just want to introduce you to the
high-level concepts for now, and give you an idea of how javascript (and other programming languages) work.
...we'll tell you if your guess was too
high or too low.</p> <div class="form"> <label for="guessfield">enter a guess: </label><input type="text" id="guessfield" class="guessfield"> <input type="submit" value="submit guess" class="guesssubmit"> </div> <div class="resultparas"> <p class="guesses"></p> <p class="lastresult"></p> <p class="loworhi"></p> </div> <script> // your javascript goes here le...
...sult.textcontent = '!!!game over!!!'; loworhi.textcontent = ''; setgameover(); } else { lastresult.textcontent = 'wrong!'; lastresult.style.backgroundcolor = 'red'; if(userguess < randomnumber) { loworhi.textcontent = 'last guess was too low!' ; } else if(userguess > randomnumber) { loworhi.textcontent = 'last guess was too
high!'; } } guesscount++; guessfield.value = ''; } guesssubmit.addeventlistener('click', checkguess); function setgameover() { guessfield.disabled = true; guesssubmit.disabled = true; resetbutton = document.createelement('button'); resetbutton.textcontent = 'start new game'; document.body.append(resetbutton); resetbutton.adde...
...And 4 more matches
Multimedia: Images - Learn web development
this is a
high-level introduction to optimizing multimedia delivery on the web, covering general principles and techniques.
... in the future browsers might add support for even more advanced formats like
high efficiency image file format (heif) or av1 still image file format (avif).
...on top of that you'd also want to serve
higher resolution images to those devices that boast a
high dpi screen (e.g.
...And 4 more matches
Server-side web frameworks - Learn web development
this means that you will have an easier job, interacting with easier,
higher-level code rather than lower level networking primitives.
...in addition to "ease of use" of the language itself,
high quality documentation/tutorials and an active community helping new users are your most valuable resources.
...all of them have everything you need to be productive — they are open source, are under active development, have enthusiastic communities creating documentation and helping users on discussion boards, and are used in large numbers of
high-profile websites.
...And 4 more matches
The Firefox codebase: CSS Guidelines
avoid id selectors unless it is really the wanted goal, since ids have
higher specificity and therefore are harder to override.
... writing cross-platform css firefox supports many different platforms and each of those platforms can contain many different configurations: windows 7, 8 and 10 default theme aero basic (windows 7, 8) windows classic (windows 7)
high contrast (all versions) linux macos file structure the browser/ directory contains styles specific to firefox the toolkit/ directory contains styles that are shared across all toolkit applications (thunderbird and seamonkey) under each of those two directories, there is a themes directory containing 4 sub-directories: shared linux osx windows the shared directories contain ...
...
high contrast mode content area on windows
high contrast mode, in the content area, gecko does some automatic color adjustments regarding page colors.
...And 4 more matches
Int64
method overview number compare(a, b); number hi(a); int64 join(
high, low); number lo(a); string tosource(); string tostring([radix]); methods compare() compares two 64-bit integer values.
... hi() returns the
high 32 bits of the specified value.
... number hi( num ); parameters num the value whose
high 32 bits are to be returned.
...And 4 more matches
UInt64
method overview number compare(a, b); number hi(a); uint64 join(
high, low); number lo(a); string tosource(); string tostring([radix]); methods compare() compares two 64-bit integer values.
... hi() returns the
high 32 bits of the specified value.
... number hi( num ); parameters num the value whose
high 32 bits are to be returned.
...And 4 more matches
Examine and edit HTML - Firefox Developer Tools
this shows the complete hierarchy through the document for the branch containing the selected element: hovering over a breadcrumb
highlights that element in the page.
... moving the mouse over a node in the tree
highlights that element in the page.
...clicking the marker enables the grid
highlighter.
...And 4 more matches
RTCIceCandidatePairStats - Web APIs
consentexpiredtimestamp optional a dom
highrestimestamp value indicating the time at which the most recent stun binding response expired.
... firstrequesttimestamp optional a dom
highrestimestamp value which specifies the time at which the first stun request was sent from the local peer to the remote peer for this candidate pair.
... lastpacketreceivedtimestamp optional a dom
highrestimestamp value indicating the time at which the last packet was received by the local peer from the remote peer for this candidate pair.
...And 4 more matches
Using Media Queries for Accessibility - CSS: Cascading Style Sheets
html <div class="animation">animated box</div> css .animation { -webkit-animation: vibrate 0.3s linear infinite both; animation: vibrate 0.3s linear infinite both; } @media (prefers-reduced-motion: reduce) { .animation { animation: none; } }
high contrast mode the -ms-
high-contrast css media feature is a microsoft extension that describes whether the application is being displayed in
high contrast mode, and with what color variation.
... syntax the -ms-
high-contrast media feature is specified as one of the following values.
... values active indicates that the subsequent styling rules will be applied when the system is placed in
high contrast mode with any color variation.
...And 4 more matches
stroke-linejoin - SVG: Scalable Vector Graphics
--> <path d="m9,11 a2,2 0,0,0 2,-3 a3,3 0 0 1 2,3.5" stroke="black" fill="none" stroke-linejoin="arcs" /> <!-- the following pink lines
highlight the position of the path for each stroke --> <g id="
highlight"> <path d="m1,5 a2,2 0,0,0 2,-3 a3,3 0 0 1 2,3.5" stroke="pink" fill="none" stroke-width="0.025" /> <circle cx="1" cy="5" r="0.05" fill="pink" /> <circle cx="3" cy="2" r="0.05" fill="pink" /> <circle cx="5" cy="5.5" r="0.05" fill="pink" /> </g> <use xlink:href="#
highlight" x="6" /> <use xl...
...ink: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.
... example html,body,svg { height:100% } <svg viewbox="0 0 6 6" xmlns="http://www.w3.org/2000/svg"> <!-- effect of the "arcs" value --> <path d="m1,5 a2,2 0,0,0 2,-3 a3,3 0 0 1 2,3" stroke="black" fill="none" stroke-linejoin="arcs" /> <!-- the following pink lines
highlight the position of the path for each stroke --> <g id="p"> <path d="m1,5 a2,2 0,0,0 2,-3 a3,3 0 0 1 2,3" 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" r="0.05" fill="pink" /> </g> </svg> bevel the bevel value indicates that a bevelled corner...
...And 4 more matches
XUL Migration Guide - Archive of obsolete content
if your add-on needs a lot of help from third party packages, low-level apis, or xpcom, then the cost of migrating is
high, and may not be worth it at this point.
... using the supported apis the sdk provides a set of
high level apis providing some basic user interface components and functionality commonly required by add-ons.
... see the tutorials and the
high-level api reference.
...And 3 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-96b8-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 to a "clsid:" urn followed by the unique identifier of an activex control (in the above example, the string beginning with "d27...").
...here is an example of this usage, once again for the macromedia flash plugin: <object type="application/x-shockwave-flash" data="javascript-to-flash.swf" width="366" height="142" id="myflash"> <param name="movie" value="javascript-to-flash.swf" /> <param name="quality" value="
high" /> <param name="swliveconnect" value="true" /> <p>you need flash -- get the latest version from <a href= "http://www.macromedia.com/downloads/">here.</a></p> </object> in the above example, application/x-shockwave-flash is the flash mime type, and will invoke the netscape-specific flash architecture in mozilla-based browsers.
...me animation twice since it also understands the mime type for flash: <!-- usage will not work as intended --> <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-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="142" id="myflashnscp"> <param name="movie" value="javascript-to-flash.swf" /> <param name="quality" value="
high" /> <param name="swliveconnect" value="true" /> <p>you need flash -- get the latest version from <a href="http://www...
...And 3 more matches
Anatomy of a video game - Game development
while we are on the topic of budgeting time, many web browsers have a tool called
high resolution time.
...
high resolution time, on the other hand, counts the number of milliseconds since navigationstart (when the previous document is unloaded).
...it is known as a dom
highrestimestamp but, for all intents and purposes, consider it a floating point number.
...And 3 more matches
CSS and JavaScript accessibility best practices - Learn web development
in addition, the mouse pointer changes to a pointer icon when links are moused over, and the link receives a
highlight when focused (e.g.
...the following image shows the
highlight in both firefox (a dotted outline) and chrome (a blue outline): you can be creative with link styles, as long as you keep giving users feedback when they interact with the links.
... note: a
high contrast ratio will also allow anyone using a smartphone or tablet with a glossy screen to better read pages when in a bright environment, such as sunlight.
...And 3 more matches
Handling text — strings in JavaScript - Learn web development
so, taking a simple example: let song = 'fight the youth'; would be turned into a template literal like so: song = `fight the youth`; if we want to concatenate strings, or include expression results inside them, traditional strings can be fiddly to write: let score = 9; let
highestscore = 10; let output = 'i like the song "' + song + '".
... i gave it a score of ' + (score/
highestscore * 100) + '%.'; template literals simplify this enormously: output = `i like the song "${ song }".
... i gave it a score of ${ score/
highestscore * 100 }%.`; there is no more need to open and close multiple string pieces — the whole lot can just be wrapped in a single pair of backticks.
...And 3 more matches
Strategies for carrying out testing - Learn web development
arts the module off by providing an overview of the topic of (cross) browser testing, answering questions such as "what is cross-browser testing?", "what are the most common types of problems you'll encounter?", and "what are the main approaches for testing, identifying, and fixing problems?" prerequisites: familiarity with the core html, css, and javascript languages; an idea of the
high level principles of cross-browser testing.
... objective: to gain an understanding of the
high-level concepts involved in cross-browser testing.
... a
higher-spec android phone and tablet with browser installed that you need to test — this can include chrome, firefox, and opera mini for android, as well as the original android stock browser.
...And 3 more matches
Accessible Toolkit Checklist
some low vision users will be running your software with
high contrast or large font themes.
... define mnemonics for all standard common dialogs (like yes/no confirmations and retry/exit error dialogs) support mnemonics in dialogs created via method calls layout engine - drawing underline under correct letter events - making keystrokes do the right thing msaa support, via iaccessible's get_acckeyboardshortcut support for ms windows settings when
high contrast checkbox is set (in accessibility control panel, spi_get
highcontrast), or when user selects a "native" skin option in your software, then get all look and feel from current os skin.
... the
high contrast theme can be toggled dynamically with leftalt+leftshift+printscreen expose the spi_getscreenreader flag to xml/scripts so that apps can alter behavior use system
highlight color where possible for item selection, but never use that exact color in more than 1 place at a time, otherwise screen reader will read everything with that color whenever
highlight changes pay attention to spi_getcaretwidth for the correct width of the caret pay attention to 'route mouse pointer to default button' setting it's possible that the user wants mnemonics hidden except when the alt key is pressed.
...And 3 more matches
PRThreadPriority
syntax #include <prthread.h> typedef enum prthreadpriority { pr_priority_first = 0, pr_priority_low = 0, pr_priority_normal = 1, pr_priority_
high = 2, pr_priority_urgent = 3, pr_priority_last = 3 } prthreadpriority; enumerators pr_priority_first placeholder.
... pr_priority_
high slightly
higher priority than pr_priority_normal.
... this priority is for threads performing work of
high urgency but short duration.
...And 3 more matches
nsIVariant
if the value was utf16 then the
high bits are lost.
... if the value was utf8 then it is converted to utf16 and the
high bits are discarded.
...if the value was utf16 then the
high bits are lost.
...And 3 more matches
Set a breakpoint - Firefox Developer Tools
highlighting the line you want to break at in the source pane and pressing ctrl + b (windows/linux) or cmd + b (macos).
... the line number is
highlighted in blue: in addition, if the line contains multiple function calls, each one will be given a small blue arrow icon to the left of it.
...you can set a conditional breakpoint using the context menu (see above), or by
highlighting the line you want to break at in the source pane and pressing ctrl + shift + b (windows/linux) or cmd + shift + b (macos).
...And 3 more matches
DevTools API - Firefox Developer Tools
highlighttool(toolid)
highlights the tab for the given tool.
... parameters: toolid {string} - the tool to
highlight.
... un
highlighttool(toolid) un
highlights the tab for the given tool.
...And 3 more matches
Index - Firefox Developer Tools
if you open a json file in the browser, or view a remote url with the content-type set to application/json, it is parsed and given syntax
highlighting.
... 58 edit css filters css, devtools, filters, page inspector, tools css filter properties in the rules view have a circular gray and white swatch next to them: 59 edit shape paths in css css, devtools, page inspector, rules view, tools,
highlighter, shapes the shape path editor is a tool that helps you see and edit shapes created using clip-path and also the css shape-outside property and <basic-shape> values.
... 69 select and
highlight elements the selected element is the element in the page that the inspector is currently focused on.
...And 3 more matches
View Source - Firefox Developer Tools
if the number is
higher than the lines in a file, you receive an error message.
... syntax
highlighting (toggle) applies syntax
highlighting to the code.when syntax
highlighting is on, view source also
highlights parsing errors in red.
... xml syntax
highlighting view source uses the html tokenizer when
highlighting xml source.
...And 3 more matches
Using the Performance API - Web APIs
the dom
highrestimestamp type (a double) is used by all performance interfaces to hold such time values.
...this guide describes how to use the performance interfaces that are defined in the
high-resolution time standard.
...
high precision timing
high precision timing is achieved by using the dom
highrestimestamp type for time values.
...And 3 more matches
Specificity - CSS: Cascading Style Sheets
(the selectors declared inside :not() do, however.) for more information, visit: "specificity" in "cascade and inheritance", you can also visit: https://specifishity.com inline styles added to an element (e.g., style="font-weight: bold;") always overwrite any styles in external stylesheets, and thus can be thought of as having the
highest specificity.
...by indicating one or more elements before the element you're selecting, the rule becomes more specific and gets
higher priority: <div id="test"> <span>text</span> </div> div#test span { color: green; } div span { color: blue; } span { color: red; } no matter the order, text will be green because that rule is most specific.
... b) overriding
high specificity #someelement p { color: blue; } p.awesome { color: red; } how do you make awesome paragraphs always turn red, even ones inside #someelement?
...And 3 more matches
<meter>: The HTML Meter element - HTML: Hypertext Markup Language
this must be greater than the minimum value (min attribute), and it also must be less than the
high value and maximum value (
high attribute and max attribute, respectively), if any are specified.
...
high the lower numeric bound of the
high end of the measured range.
...if unspecified, or if greater than the maximum value, the
high value is equal to the maximum value.
...And 3 more matches
The building blocks of responsive design - Progressive web apps (PWAs)
we then add a rule that positions the second button in any card a button's width
higher up the card.
...instead, they render pages at a
higher assumed viewport width (something approaching a laptop screen), and then shrink the result down to fit inside the mobile screen.
... another challenge is dealing with
high resolution screens — raster graphics designed for low resolutions are in danger of appearing tiny when displayed on a
high resolution screen, so devices often apply a default zoom factor to rendered pages to avoid this.
...And 3 more matches
Creating annotations - Archive of obsolete content
the matched element is
highlighted and has a click handler bound to it which sends a message to the main add-on code.
... if the page element is eligible for annotation, then the selector
highlights that element and binds a click handler to it.
...you should see the
highlight appearing when you move the mouse over certain elements: click on the
highlight and you should see something like this in the console output: info: show info: http://blog.mozilla.com/addons/2011/02/04/overview-amo-review-process/, post-2249,when you submit a new add-on, you will have to choose between 2 review tracks: full review and preliminary review.
...And 2 more matches
textbox (Toolkit autocomplete) - Archive of obsolete content
attributes accesskey, autocompletepopup, autocompletesearch, autocompletesearchparam, completedefaultindex, completeselectedindex,crop, disableautocomplete, disabled, disablekeynavigation, enablehistory, focused, forcecomplete,
highlightnonmatches, ignoreblurwhilesearching, inputtooltiptext, label, maxlength, maxrows, minresultsforpopup, nomatch, onchange, oninput, onsearchcomplete, ontextentered, ontextreverted, open, readonly,showcommentcolumn, showimagecolumn, size, tabindex, tabscrolling, timeout, type, value properties accessibletype, completedefaultindex, controller, crop, disableautocomplete, disablekeynavig...
...ation, disabled, editable, focused, forcecomplete,
highlightnonmatches, ignoreblurwhilesearching, inputfield, label, maxlength, maxrows, minresultsforpopup, open, popup, popupopen, searchcount, searchparam, selectionend, selectionstart, showcommentcolumn, showimagecolumn,size, tabindex, tabscrolling, textlength, textvalue, timeout, type, value methods getsearchat, onsearchcomplete, ontextentered, ontextreverted, select, setselectionrange examples <textbox type="autocomplete" autocompletesearch="history"/> attributes accesskey type: character this should be set to a character that is used as a shortcut key.
...
highlightnonmatches new in thunderbird 3 requires seamonkey 2.0 type: boolean if true, then the autocomplete field will be
highlighted when no match has been found.
...And 2 more matches
Textbox (XPFE autocomplete) - Archive of obsolete content
attributes accesskey, alwaysopenpopup, autocompletesearch, autocompletesearchparam, autofill, autofillaftermatch, autofill, completedefaultindex, crop, disableautocomplete, disableautocomplete, disabled, disablehistory, enablehistory, focused, forcecomplete, forcecomplete,
highlightnonmatches, ignoreblurwhilesearching, ignoreblurwhilesearching, inputtooltiptext, label, maxlength, maxrows, minresultsforpopup, minresultsforpopup, nomatch, onchange, onerrorcommand, oninput, onsearchcomplete, ontextcommand, ontextentered, ontextrevert, ontextreverted, open, readonly, searchsessions, showcommentcolumn, showcommentcolumn, showpopup, size, tabindex, tabscrolling, tabscrolling,...
... timeout, type, useraction, value properties accessible, alwaysopenpopup, autofill, autofillaftermatch, completedefaultindex, crop, disableautocomplete, disabled, editable, focused, forcecomplete,
highlightnonmatches, ignoreblurwhilesearching, inputfield, issearching, iswaiting, label, maxlength, maxrows, minresultsforpopup, nomatch, open, popup, popupopen, resultspopup, searchcount, searchparam, searchsessions, selectionend, selectionstart, sessioncount, showcommentcolumn, showpopup, size, tabindex, tabscrolling, textlength, textvalue, timeout, type, useraction, value methods addsession, clearresults, getdefaultsession, getresultat, getresultcount, getresultvalueat, getsession, getsessionbyname, getsessionresultat, getsessionstatusat, getsessionvalueat, removes...
...
highlightnonmatches new in thunderbird 3 requires seamonkey 2.0 type: boolean if true, then the autocomplete field will be
highlighted when no match has been found.
...And 2 more matches
TCP/IP Security - Archive of obsolete content
when a user wants to transfer data across networks, the data is passed from the
highest layer through intermediate layers to the lowest layer, with each layer adding information.
... the four tcp/ip layers, from
highest to lowest, are shown below.
... as previously explained, data is passed from the
highest to the lowest layer, with each layer adding more information.
...And 2 more matches
What text editors are available? - Learn web development
in this article we
highlight some things to think about when installing a text editor for web development.
...in particular (if possible in your editor), try to: change syntax
highlighting settings and colors play with indentation width, setting it to an appropriate setting for your needs check autosave and session saving settings configure any available plugins and investigate how to get new ones change color schemes adjust view settings and see how you can change the layout of the views check what programming languages/technologies your editor supports while you'r...
...many text editors help you out with features like: syntax
highlighting.
...And 2 more matches
Responsive images - Learn web development
it is 200px
high.
... to make things more complicated, some devices have
high resolution screens that need larger images than you might expect to display nicely.
...so if the device accessing the page has a standard/low resolution display, with one device pixel representing each css pixel, the elva-fairy-320w.jpg image will be loaded (the 1x is implied, so you don't need to include it.) if the device has a
high resolution of two device pixels per css pixel or more, the elva-fairy-640w.jpg image will be loaded.
...And 2 more matches
Index - Learn web development
at, accessibility, article, beginner, css, codingscripting, html, javascript, learn, tools, users, assistive technology, keyboard, screan reader, screenreader this article should have given you a useful
high-level overview of accessibility, shown you why it's important, and looked at how you can fit it into your workflow.
... 120 images, media, and form elements beginner, css, forms, images, learn, media, replaced content this lesson has
highlighted some of the differences you will encounter when working with images, media, and other unusual elements in css.
...it has also provided a
high level overview of a few popular frameworks, and discussed criteria for choosing a web application framework.
...And 2 more matches
Drawing graphics - Learn web development
canvases with no explicit width and height default to 300 pixels wide by 150 pixels
high.
...the
higher its value, the more it will obscure whatever's behind it.
...the image looks like this: it contains six sprites that make up the whole walking sequence — each one is 102 pixels wide and 148 pixels
high.
...And 2 more matches
Software accessibility: Where are we today?
magnification enlarges the screen's contents: for those with low vision, it may suffice to use a larger font, a built-in
high contrast theme, or even just an an extra large screen.
...screen magnifiers also have some built-in text-to-speech and the ability to filter text and images through various color palettes, such as black on yellow for
high contrast, or green on blue for low contrast.
...for those that read it, braille can offer
higher levels of employment and life fulfillment.
...And 2 more matches
Mozilla’s UAAG evaluation report
(p1) ni we don't make use of scope, headers, axis, or any other table accessibility features we have nothing under properties, or anywhere else, to orient users reading a table 10.2
highlight selection and content focus.
... (p1) vg provides a focus outline box
highlights follow graphical rendering conventions for windows does not
highlight selected images we do not have the ability to show a border around the text selection we have the following focus appearance prefs that are not exposed in the ui, but can be manually inserted in the user's prefs.js file: setboolpref("browser.display.use_focus_colors", usefocuscolors); /* true or false */ setcharpref("browser.display.focus_background_color", colorstring); /* for example #ffeedd or the name of a color */ setcharpref("browser.display.focus_text_color", colorstring); setcharpref("browser.display.focus_ring_width", numpixels); /* integer 0-4 */ 10.3 distinct default
highlight styles.
... 10.4
highlight special elements.
...And 2 more matches
Performance best practices for Firefox front-end engineers
it is, however, advantageous to strive for reflow to only occur in the one place (the layout step of the 16ms tick) as opposed to multiple times during the 16ms tick (which has a
higher probability of running through the 16ms budget).
... it's also possible (though less infallible than promisedocumentflushed) to queue javascript to run very soon after the frame has been painted, where the likelihood is
highest that the dom has not been written to, and layout and style information queries are still cheap.
... }); }); this also implies that querying for size and position information in requestanimationframe() has a
high probability of causing a synchronous reflow.
...And 2 more matches
Activity Monitor, Battery Status Menu and top
task_power_info::task_interrupt_wakeups obtained from the task_info function.) requires
high perf gpu: many macs have two gpus: a low-power, low-performance integrated gpu, and a
high-power,
high-performance external gpu.
... using the
high-performance gpu can greatly increase power consumption, and should be avoided whenever possible.
...furthermore, if you click on an application name in the menu activity monitor will be opened and that application’s entry will be
highlighted.
...And 2 more matches
Filelink Providers
filelink is a thunderbird feature that makes it easy for users to upload large attachments to web-based storage services such as
hightail.
...the
hightail implementation is a great place to look for examples and inspiration.
...
hightail, for example, requires a username and password.
...And 2 more matches
Working with data
you can build the new number using the
high and low 32-bit numbers, or you can create it using a string representation.
...it accepts as its input parameters the
high and low 32-bit values and returns a new 64-bit integer.
... for example: var num = ctypes.int64.join(-0x12345678, 0x90abcdef); performing arithmetic with 64-bit values the int64 and uint64 objects don't provide any methods for performing arithmetic, which means you'll have to do it yourself by pulling out the
high and low 32-bit portions and doing math on them, then joining them back together if necessary to get the complete result.
...And 2 more matches
Accessibility Inspector - Firefox Developer Tools
hovering over the "target" icon
highlights the dom node in the page content.
...
highlighting of ui items in the accessibility tab, when the mouse hovers over accessibility items, you can see a semi-transparent
highlight appear over the ui items they relate to, if appropriate.
... in the following example, you can see that the image has been
highlighted and its role, graphic, name, "road, asphalt, sky, clouds, fall", and the color contrast ratio, 3.46, appears in the information bar above it.
...And 2 more matches
Examine and edit CSS - Firefox Developer Tools
highlight matched elements: next to the selector is a target icon: click this to
highlight all nodes in the page that match this selector.
... this also gets the target icon: , giving you a convenient way to
highlight the currently selected element in the page.
... filtering rules there's a box at the top of the rules view labeled "filter styles": as you type: any rules which don't contain the typed string at all are hidden any declarations which contain the typed string are
highlighted click the "x" at the end of the search box to remove the filter.
...And 2 more matches
BiquadFilterNode() - Web APIs
options optional options are as follows: type: one of "lowpass", "
highpass", "bandpass", "lowshelf", "
highshelf", "peaking", "notch", "allpass".
...
highpass: a
highpass filter is the opposite of a lowpass filter.
...it implements a standard second-order resonant
highpass filter with 12db/octave rolloff.
...And 2 more matches
Drag Operations - Web APIs
however, you could listen to a
higher ancestor as drag events bubble up as most other events do.
... however, you can also update the user interface with an insertion point or
highlight as needed.
... for simple
highlighting, you can use the :-moz-drag-over css pseudoclass on a drop target.
...And 2 more matches
performance.now() - Web APIs
the performance.now() method returns a dom
highrestimestamp, measured in milliseconds.
... in shared or service workers, the value in the worker might be
higher than that of the main context because that window can be created after those workers.
... starting with firefox 79,
high resolution timers can be used if you cross-origin isolate your document using the cross-origin-opener-policy and cross-origin-embedder-policy headers: cross-origin-opener-policy: same-origin cross-origin-embedder-policy: require-corp these headers ensure a top-level document does not share a browsing context group with cross-origin documents.
...And 2 more matches
Performance - Web APIs
it's part of the
high resolution time api, but is enhanced by the performance timeline api, the navigation timing api, the user timing api, and the resource timing api.
... performance.timeorigin read only returns the
high resolution timestamp of the start time of the performance measurement.
... performance.now() returns a dom
highrestimestamp representing the number of milliseconds elapsed since a reference instant.
...And 2 more matches
Resource Timing API - Web APIs
the interface's properties create a resource loading timeline with
high-resolution timestamps for network events such as redirect start and end times, dns lookup start and end times, request start, response start and end times, etc.
...
high-resolution timestamps several of the resource timing properties return
high-resolution timestamps.
... these timestamps have a dom
highrestimestamp type and as its name implies, they represent a
high-resolution point in time.
...And 2 more matches
<mark>: The Mark Text element - HTML: Hypertext Markup Language
the html mark text element (<mark>) represents text which is marked or
highlighted for reference or notation purposes, due to the marked passage's relevance or importance in the enclosing context.
...think of this like using a
highlighter pen in a book to mark passages that you find of interest.
... don't use <mark> for syntax
highlighting purposes; instead, use the <span> element with appropriate css applied to it.
...And 2 more matches
Operator precedence - JavaScript
operators with
higher precedence become the operands of operators with lower precedence.
... a op1 b op2 c if op1 and op2 have different precedence levels (see the table below), the operator with the
highest precedence goes first and associativity does not matter.
... observe how multiplication has
higher precedence than addition and executed first, even though addition is written first in the code.
...And 2 more matches
Animation performance and frame rate - Web Performance
while it is not always possible to maintain 60fps, it is important to maintain a
high and steady frame rate for all animations.
... an example: margin versus transform in this section we'll see how the waterfall can
highlight the difference between animating using margin and animating using transform.
...in the screenshot above we've
highlighted a paint operation, and the box on the right tells us it took 13.11ms.
...And 2 more matches
Graphic design for responsive sites - Progressive web apps (PWAs)
this article provides a
high level discussion aimed at helping you to choose the best option for your graphical needs.
...the issue here is that raster images, when rendered on
high res devices, are in danger of appearing tiny because the same number of pixels is being shown in a much smaller screen space.
...
high res and low res image copies one option here is to create a hi res and a low res set of images, then use resolution media queries to serve the hi res images only to hi res devices.
...And 2 more matches
tabs - Archive of obsolete content
converting to xul tabs to convert from the
high-level tab objects used in this api to the low-level xul tab objects used in the tabs/utils api and by traditional add-ons, use the viewfor() function exported by the viewfor module.
... to convert back the other way, from a xul tab to a
high-level tab object, use the modelfor() function, exported by the modelfor module.
... here's an example converting from a
high-level tab to a xul tab and then back the other way: var { modelfor } = require("sdk/model/core"); var { viewfor } = require("sdk/view/core"); var tabs = require("sdk/tabs"); var tab_utils = require("sdk/tabs/utils"); function map
highleveltolowlevel(tab) { // get the xul tab that corresponds to this
high-level tab var lowleveltab = viewfor(tab); // now we can, for example, access the tab's content directly var browser = tab_utils.getbrowserfortab(lowleveltab); console.log(browser.contentdocument.body.innerhtml); // get the
high-level tab back from the xul tab var
highleveltab = modelfor(lowleveltab); console.log(
highleveltab.url); } tabs.on("ready", map
highleveltolowlevel); note that directly accessing xul objects and web content ...
...like this means you're no longer protected by the compatibility guarantees made by the sdk's
high-level apis.
JavaScript Daemons Management - Archive of obsolete content
this approch: abstraction passage of this object to javascript timers (both setinterval and settimeout) optimisation (avoiding closures) modularity the code the code of this framework is split into three files: daemon.js (the core) daemon-safe.js (an extension of the core which adds a replacement of setinterval with a recursive invocation of settimeout) daemon-methods.js (a wide and
highly scalable collection of methods) the only independent module is daemon.js: both the daemon-safe.js module and the daemon-methods.js module require daemon.js to work.
...2 |*| |*| daemon.js - a javascript
highly scalable daemons manager.
...2 |*| |*| daemon.js - a javascript
highly scalable daemons manager |*| |*| https://developer.mozilla.org/docs/javascript/timers/daemons |*| https://developer.mozilla.org/user:fusionchess |*| |*| this framework is released under the gnu public license, version 3 or later.
...2 |*| |*| daemon.js - a javascript
highly scalable daemons manager |*| |*| https://developer.mozilla.org/docs/javascript/timers/daemons |*| https://developer.mozilla.org/user:fusionchess |*| |*| this framework is released under the gnu public license, version 3 or later.
Bookmark Keywords - Archive of obsolete content
changing the properties to alter the properties of the bookmark,
highlight the bookmark and select the "properties..." button at the top of the bookmark manager.
...you should end up with the result shown in figure 4, without the red
highlighting.
...one such example, with the relevant term
highlighted, is shown in figure 7.
...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.
Layout System Overview - Archive of obsolete content
core classes at the
highest level, the layout system is a group of classes that manages the presentation within a fixed width and either unlimited height (galley presentation) or discrete page heights (paged presentation).
...here are the
high-level classes that make up the layout system.
...for this overview, the frames, style set, and reflow queue are the most important
high-level parts of the presentation shell.
...block frame reflow state reflow metrics space manager styleset stylecontext see also layout faq document history 05/20/2002 - marc attinasi: created, wrote
highest level introduction to general layout concepts, links to relevant specs and existing documents.
tree - Archive of obsolete content
(default in tree.) for trees, you can also use the following values: cell individual cells can be selected text rows are selected; however, the selection
highlight appears only over the text of the primary column.
...elements with a
higher tabindex are later in the tab sequence.
... selstyle type: string if set to the value primary, only the label of the primary column will be
highlighted when an item in the tree is selected.
... otherwise, the entire row will be
highlighted.
Introduction to SSL - Archive of obsolete content
the ssl protocol runs above tcp/ip and below
higher-level protocols such as http or imap.
... it uses tcp/ip on behalf of the
higher-level protocols, and in the process allows an ssl-enabled server to authenticate itself to an ssl-enabled client, allows the client to authenticate itself to the server, and allows both machines to establish an encrypted connection.
... an encrypted ssl connection requires all information sent between a client and a server to be encrypted by the sending software and decrypted by the receiving software, thus providing a
high degree of confidentiality.
...this cipher suite is appropriate for banks and other institutions that handle
highly sensitive data.
The Business Benefits of Web Standards - Archive of obsolete content
the payload might be slightly
higher for the first page.
...separating presentation from content increases the information/markup ratio, making css-based documents more pertinent with regard to the search terms, which makes them rank
higher in search results.
...a single inconsistency between the browsers in a
high end feature for the site can absorb the lead developers in hours of painful and frustrating forum hunting and bug fixing.
...put simply - and quite crudely - a pleasing, satisfying and fulfilling user experience translates, into more traffic, more repeat visitors, fewer bounces, greater loiter time and
higher click throughs.
Type, class, and ID selectors - Learn web development
in the live example below we have created a class called .
highlight, and have applied it to several places in my document.
... all of the elements that have the class applied are
highlighted.
...in this next example we will
highlight a <span> with a class of
highlight differently to an <h1> heading with a class of
highlight.
... note: as we learned in the lesson on specificity, an id has
high specificity and will overrule most other selectors.
Example 4 - Learn web development
e: none; margin : 0; padding: 0; background: #f0f0f0; border: .2em solid #000; border-top-width : .1em; border-radius: 0 0 .4em .4em; box-shadow: 0 .2em .4em rgba(0,0,0,.4); -moz-box-sizing : border-box; box-sizing : border-box; min-width : 100%; max-height: 10em; /* 100px */ overflow-y: auto; overflow-x: hidden; } .select .option { padding: .2em .3em; } .select .
highlight { background: #000; color: #ffffff; } javascript content // ------- // // helpers // // ------- // nodelist.prototype.foreach = function (callback) { array.prototype.foreach.call(this, callback); } // -------------------- // // function definitions // // -------------------- // function deactivateselect(select) { if (!select.classlist.contains('active')) return; var optlist =...
...ptlist'); optlist.classlist.add('hidden'); select.classlist.remove('active'); } function activeselect(select, selectlist) { if (select.classlist.contains('active')) return; selectlist.foreach(deactivateselect); select.classlist.add('active'); }; function toggleoptlist(select, show) { var optlist = select.queryselector('.optlist'); optlist.classlist.toggle('hidden'); } function
highlightoption(select, option) { var optionlist = select.queryselectorall('.option'); optionlist.foreach(function (other) { other.classlist.remove('
highlight'); }); option.classlist.add('
highlight'); }; function updatevalue(select, index) { var nativewidget = select.previouselementsibling; var value = select.queryselector('.value'); var optionlist = select.queryselectorall('.opti...
...on'); nativewidget.selectedindex = index; value.innerhtml = optionlist[index].innerhtml;
highlightoption(select, optionlist[index]); }; function getindex(select) { var nativewidget = select.previouselementsibling; return nativewidget.selectedindex; }; // ------------- // // event binding // // ------------- // window.addeventlistener("load", function () { var form = document.queryselector('form'); form.classlist.remove("no-widget"); form.classlist.add("widget"); }); window.addeventlistener('load', function () { var selectlist = document.queryselectorall('.select'); selectlist.foreach(function (select) { var optionlist = select.queryselectorall('.option'); optionlist.foreach(function (option) { option.addeventlistener('mouseover', function () { ...
...
highlightoption(select, option); }); }); select.addeventlistener('click', function (event) { toggleoptlist(select); }); select.addeventlistener('focus', function (event) { activeselect(select, selectlist); }); select.addeventlistener('blur', function (event) { deactivateselect(select); }); }); }); window.addeventlistener('load', function () { var selectlist = document.queryselectorall('.select'); selectlist.foreach(function (select) { var optionlist = select.queryselectorall('.option'), selectedindex = getindex(select); select.tabindex = 0; select.previouselementsibling.tabindex = -1; updatevalue(select, selectedindex); optionlist.foreach(function (option, index) { option.addeventlistener('clic...
Example 5 - Learn web development
e: none; margin : 0; padding: 0; background: #f0f0f0; border: .2em solid #000; border-top-width : .1em; border-radius: 0 0 .4em .4em; box-shadow: 0 .2em .4em rgba(0,0,0,.4); -moz-box-sizing : border-box; box-sizing : border-box; min-width : 100%; max-height: 10em; /* 100px */ overflow-y: auto; overflow-x: hidden; } .select .option { padding: .2em .3em; } .select .
highlight { background: #000; color: #ffffff; } javascript content // ------- // // helpers // // ------- // nodelist.prototype.foreach = function (callback) { array.prototype.foreach.call(this, callback); } // -------------------- // // function definitions // // -------------------- // function deactivateselect(select) { if (!select.classlist.contains('active')) return; var optlist =...
...ptlist'); optlist.classlist.add('hidden'); select.classlist.remove('active'); } function activeselect(select, selectlist) { if (select.classlist.contains('active')) return; selectlist.foreach(deactivateselect); select.classlist.add('active'); }; function toggleoptlist(select, show) { var optlist = select.queryselector('.optlist'); optlist.classlist.toggle('hidden'); } function
highlightoption(select, option) { var optionlist = select.queryselectorall('.option'); optionlist.foreach(function (other) { other.classlist.remove('
highlight'); }); option.classlist.add('
highlight'); }; function updatevalue(select, index) { var nativewidget = select.previouselementsibling; var value = select.queryselector('.value'); var optionlist = select.queryselectorall('.opti...
...on'); optionlist.foreach(function (other) { other.setattribute('aria-selected', 'false'); }); optionlist[index].setattribute('aria-selected', 'true'); nativewidget.selectedindex = index; value.innerhtml = optionlist[index].innerhtml;
highlightoption(select, optionlist[index]); }; function getindex(select) { var nativewidget = select.previouselementsibling; return nativewidget.selectedindex; }; // ------------- // // event binding // // ------------- // window.addeventlistener("load", function () { var form = document.queryselector('form'); form.classlist.remove("no-widget"); form.classlist.add("widget"); }); window.addeventlistener('load', function () { var selectlist = document.queryselectorall('.select'); selectlist.foreach(function (select) { var ...
...optionlist = select.queryselectorall('.option'), selectedindex = getindex(select); select.tabindex = 0; select.previouselementsibling.tabindex = -1; updatevalue(select, selectedindex); optionlist.foreach(function (option, index) { option.addeventlistener('mouseover', function () {
highlightoption(select, option); }); option.addeventlistener('click', function (event) { updatevalue(select, index); }); }); select.addeventlistener('click', function (event) { toggleoptlist(select); }); select.addeventlistener('focus', function (event) { activeselect(select, selectlist); }); select.addeventlistener('blur', function (event) { deactivateselect(select); }); select.addeventlistener('...
HTML text fundamentals - Learn web development
for example: this liquid is
highly toxic.
... <p>this liquid is <strong>
highly toxic</strong>.</p> <p>i am counting on you.
... <strong>do not</strong> be late!</p> you can nest strong and emphasis inside one another if desired: <p>this liquid is <strong>
highly toxic</strong> — if you drink it, <strong>you may <em>die</em></strong>.</p> active learning: let's be important!
...</p> <!--
highlight keywords in a set of instructions --> <ol> <li> <b>slice</b> two pieces of bread off the loaf.
Aprender y obtener ayuda - Learn web development
diffuse learning is more to do with
high-level thinking around a wider area.
... this is why it is usually good to read some introductory material first to get a
high-level understanding of an area before you leap into the specific details.
...this also
highlights the importance of taking regular breaks when you are studying in front of the computer.
... for example, if you are looking at a task of "build a simple two-column website", you could break it down as follows: create the html structure work out basic site typography work out a basic color scheme implement a
high-level layout — header, horizontal navigation menu, main content area with main and side columns, and footer.
Handling common HTML and CSS problems - Learn web development
prerequisites: familiarity with the core html, css, and javascript languages; an idea of the
high level principles of cross browser testing.
... after the packages have finished installing, try loading up an html file and a css file: you'll see any issues
highlighted with green (for warnings) and red (for errors) circles next to the line numbers, and a separate panel at the bottom provides line numbers, error messages, and sometimes suggested values or other fixes.
... right/cmd + click on the element in question and choose inspect/inspect element (or whatever the option is in your browser) — this should open up the dev tools in your browser, with the element
highlighted in the dom inspector.
... as an example, we entered the following code: body { display: flex; } we
highlighted it and ran the autoprefixer command, and it replaced it with this: body { display: -webkit-box; display: -ms-flexbox; display: flex; } layout issues another problem that might come up is differences in layouts between browsers.
Introduction to cross browser testing - Learn web development
objective: to gain an understanding of the
high-level concepts involved in cross browser testing.
... remember that you are not your users — just because your site works on your macbook pro or
high-end galaxy nexus, doesn't mean it will work for all your users — there's a whole lot of testing to be done!
...if your site includes a load of big animations, it might be ok on a
high spec tablet, but might be sluggish or jerky on a low end device.
... reporting bugs just to reiterate on what was said above, if you discover bugs in browsers, you should report them: firefox bugzilla edgehtml issue tracker safari chrome opera summary this article should have given you a
high-level understanding of the most important concepts you need to know about cross browser testing.
Script security
the security model for web content is based on the same-origin policy, in which code gets full access to objects from its origin but
highly restricted access to objects from a different origin.
...however, javascript is a
highly dynamic, malleable language, and without help it's difficult to write system-privileged code that interacts safely with untrusted web content.
... objects that are cross-origin get
highly restricted access to each other, according to the same-origin policy.
... if the caller has a
higher privilege than the target object, the caller gets an xray wrapper for the object.
Gecko Profiler FAQ
if the issue you are trying to avoid is not profiling on fast machines that mozilla developers typically use to build firefox on, a better solution may be using a less
high-end machine that actually has lower spec’d hardware instead of artificially slowing down just the cpu.
... another approach to get more precision is also raising the sampling frequency to sub-millisecond ranges (it won’t work on windows.)
high frequency sampling may also be an area where native profilers are a useful alternative tool to try.
... [jesup] ok, that's the equivalent to itimer_real, kinda, except that per the previous question it doesn't interrupt every thread at once and snapshot the thread you started the itimer on, it interrupts each thread one at a time, which likely means distortion of the measurement if the number of threads monitored is significant (especially at
high sample rates).
... a cleaner snapshot would stop all threads, walk all their stacks, and then resume all threads, especially on
high-core systems.
Profiling with the Firefox Profiler
note that
high priority events such as vsync are not included here.
... this is good for
highlighting particularly interesting parts of the code, but they miss out on un-annotated areas of the code base, and give no visibility into system libraries or drivers.
...hovering over a layer in the left panel
highlights the layer in the right panel.
...here, i'm hovering over the last layer in the layer tree (a paintedlayercomposite), and a strip at the top of the right panel is
highlighted, telling me that this layer is for the system notification bar in b2g.
about:memory
once firefox's memory usage has gotten
high) open a new tab and type "about:memory" into the address bar and hit "enter".
...if it gets
higher, it indicates that additional memory reporters should be added.
...this is often much
higher than any other measurement (particularly on mac).
...graphics is often a source of
high memory usage, and so these measurements can be helpful for detecting such cases.
Introduction to NSPR
in general, an nspr thread of
higher priority has a statistically better chance of running relative to threads of lower priority.
...at best they are intended to specify a preference with respect to the amount of cpu time that a
higher-priority thread might expect relative to a lower-priority thread.
...nspr guarantees that for each virtual processor the
highest-priority, schedulable local thread is the one executing.
...the chosen thread may be of
higher priority, of the same priority, or even the same thread.
4.3.1 Release Notes
new in jss 4.3.1 a list of bug fixes and enhancement requests were implemented in this release can be obtained by running this bugzilla query jss 4.3.1 requires nss 3.12.5 or
higher.
... platform information you can check out the source from cvs by cvs co -r jss_4_3_1_rtm jss jss 4.3.1 works with jdk versions 4 or
higher we suggest the latest.
... jss 4.3.1 requires nss 3.12.5 or
higher.
... jss 4.3.1 requires nspr 4.7.1 or
higher.
4.3 Release Notes
new in jss 4.3 a list of bug fixes and enhancement requests were implemented in this release can be obtained by running this bugzilla query jss 4.3 requires nss 3.12 or
higher.
... platform information jss 4.3 works with jdk versions 4 or
higher we suggest the latest.
... jss 4.3 requires nss 3.12 or
higher.
... jss 4.3 requires nspr 4.7.1 or
higher.
JSS FAQ
jss 3.x works with jdk versions 1.2 or
higher, except version 1.3.0.
...for jss 3.2 and
higher, if you use jdk 1.4 or
higher you will not need to install the jce, but if you using an earlier version of the jdk then you will also have to install jce 1.2.1.
... yes, jss 3.2 and
higher supports 64 bit.
... you will need jdk 1.4 or
higher and all the 64 bit versions of nspr, and nss.
Index
at a
high level, there are three issues to be aware of: 8 getting spidermonkey source code guide, spidermonkey you can get the spidermonkey source code in gzipped form or directly from the mercurial repository.
... 111 jsgetobjectops jsapi reference, obsolete, spidermonkey jsobjectops is used by js_newobject's internals to discover the set of
high-level object operations to use for new objects of the given class.
...otherwise the
high byte is simply dropped from each jschar.
... 537 tracing jit deprecated, spidermonkey the tracing jit in spidermonkey consists of a generic, low level component called nanojit which is co-maintained between adobe and mozilla, and a spidermonkey-specific
high level component called jstracer.
Tracing JIT
the tracing jit in spidermonkey consists of a generic, low level component called nanojit which is co-maintained between adobe and mozilla, and a spidermonkey-specific
high level component called jstracer.
...running backwards sometimes makes the logic difficult to follow, but it is an essential factor in maintaining the assembler's
high speed and small size.
... spidermonkey-specific
high level component: jstracer.* the files jstracer.cpp and jstracer.h contain a the mechanisms of monitoring and recording the activity of the interpreter.
...the associated fragment is placed in the monitor's fragment table and the monitor returns to monitoring mode, with a
high likelihood of immediately transitioning to executing mode on the next bytecode interpreted.
Index
61 xpconnect wrappers guide, needscontent, xpcom, xpcom:language bindings, xpconnect this document is a
high-level overview of xpconnect wrapper objects (for the more technical description see xpconnect security membranes).
...clients requiring dynamic "binding" of clsids will be required to use some
higher-level services (tbd) to figure out the clsids they should use.
...erformance, xpcom, xpcom interface reference implemented by: @mozilla.org/base/telemetry;1 as a service: 1003 nsitextinputprocessor dom, interface, interface:scriptable, reference, référence(2), xpcom interface reference 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.
... 1006 nsithread firefox 3, interfaces, interfaces:scriptable, threads, xpcom, xpcom api reference, xpcom interface reference this interface provides a
high-level abstraction for an operating system thread.
nsIMutableArray
insertelementat() insert an element at the given position, moving the element currently located in that position, and all elements in
higher position, up by one.
...an index lower than 0 or
higher than the current length of the array is invalid and will be ignored.
... removeelementat() remove an element at a specific position, moving all elements stored at a
higher position down one.
...if the position is
higher than the current length of the array, empty elements are appended followed by the new element at the specified position.
nsISupportsPriority
following unix conventions, smaller (and possibly negative) values have
higher priority.
...typical priority values are defined in the idl file as priority_
highest ...
... constants constant value description priority_
highest -20 the
highest priority.
... priority_
high -10
higher than normal priority.
Animating CSS properties - Firefox Developer Tools
an example: margin versus transform in this section we'll see how the waterfall can
highlight the difference between animating using margin and animating using transform.
...in the screenshot above we've
highlighted a paint operation, and the box on the right tells us it took 13.11ms.
... with only 16.7ms in our total budget, it's not surprising we are missing a consistently
high frame rate.
...we're averaging nearly 60fps, and apart from one dip near the start, we're getting a consistently
high frame rate.
Streams API concepts - Web APIs
in general, the strategy compares the size of the chunks in the queue to a value called the
high water mark, which is the largest total chunk size that the queue can realistically manage.
... the calculation performed is
high water mark - total size of chunks in queue = desired size the desired size is the size of chunks the stream can still accept to keep the stream flowing but below the
high water mark in size.
... as an example, let's take a chunk size of 1, and a
high water mark of 3.
... this means that up to 3 chunks can be enqueued before the
high water mark is reached and backpressure is applied.
WebGLRenderingContext.vertexAttribPointer() - Web APIs
for
highest performance, interleave the attributes and use the smallest data type that still accurately represents your geometry.
...on
high-end graphics cards, the maximum is 16, on lower-end graphics cards, the value will be lower.
...for
highest precision, we use 32-bit floats; in total this uses 12 bytes.
...etfloat32(20 * i + 8, vertices[i].position[2], true); dv.setint8(20 * i + 12, vertices[i].normal[0] * 0x7f); dv.setint8(20 * i + 13, vertices[i].normal[1] * 0x7f); dv.setint8(20 * i + 14, vertices[i].normal[2] * 0x7f); dv.setint8(20 * i + 15, 0); dv.setuint16(20 * i + 16, vertices[i].texcoord[0] * 0xffff, true); dv.setuint16(20 * i + 18, vertices[i].texcoord[1] * 0xffff, true); } for
higher performance, we could also do the previous json to arraybuffer conversion on the server-side, e.g.
WebGL constants - Web APIs
returns a length-2 array with the lo value at 0, and
hight at 1.
...useful for rendering hidden-line images, decals, and or solids with
highlighted edges.
... nicest 0x1102 the most correct or the
highest quality option should be used.
...3 0x8b58 bool_vec4 0x8b59 float_mat2 0x8b5a float_mat3 0x8b5b float_mat4 0x8b5c sampler_2d 0x8b5e sampler_cube 0x8b60 shader precision-specified types constant name value description low_float 0x8df0 medium_float 0x8df1
high_float 0x8df2 low_int 0x8df3 medium_int 0x8df4
high_int 0x8df5 framebuffers and renderbuffers constant name value description framebuffer 0x8d40 renderbuffer 0x8d41 rgba4 0x8056 rgb5_a1 0x8057 rgb565 0x8d62 depth_compone...
Lighting in WebGL - Web APIs
for our purposes, we're going to simplify the lighting model by only considering simple directional and ambient lighting; we won't have any specular
highlights or point light sources in this scene.
...let's take a look at the code: const vssource = ` attribute vec4 avertexposition; attribute vec3 avertexnormal; attribute vec2 atexturecoord; uniform mat4 unormalmatrix; uniform mat4 umodelviewmatrix; uniform mat4 uprojectionmatrix; varying
highp vec2 vtexturecoord; varying
highp vec3 vlighting; void main(void) { gl_position = uprojectionmatrix * umodelviewmatrix * avertexposition; vtexturecoord = atexturecoord; // apply lighting effect
highp vec3 ambientlight = vec3(0.3, 0.3, 0.3);
highp vec3 directionallightcolor = vec3(1, 1, 1);
highp vec3 directionalvector = normalize(vec3(0.85, 0.8, 0.7...
...5));
highp vec4 transformednormal = unormalmatrix * vec4(avertexnormal, 1.0);
highp float directional = max(dot(transformednormal.xyz, directionalvector), 0.0); vlighting = ambientlight + (directionallightcolor * directional); } `; once the position of the vertex is computed, and we pass the coordinates of the texel corresponding to the vertex to the fragment shader, we can work on computing the shading for the vertex.
... the fragment shader the fragment shader now needs to be updated to take into account the lighting value computed by the vertex shader: const fssource = ` varying
highp vec2 vtexturecoord; varying
highp vec3 vlighting; uniform sampler2d usampler; void main(void) {
highp vec4 texelcolor = texture2d(usampler, vtexturecoord); gl_fragcolor = vec4(texelcolor.rgb * vlighting, texelcolor.a); } `; here we fetch the color of the texel, just like we did in the previous example, but before setting the color of the fragment, we multiply t...
WritableStream.WritableStream() - Web APIs
this takes two parameters:
highwatermark a non-negative integer — this defines the total number of chunks that can be contained in the internal queue before backpressure is applied.
...if no queuingstrategy is supplied, the default used is the same as a countqueuingstrategy with a
high water mark of 1.
... defaultwriter.ready .then(() => { defaultwriter.close(); }) .then(() => { console.log("all chunks written"); }) .catch((err) => { console.log("stream error:", err); }); } const decoder = new textdecoder("utf-8"); const queuingstrategy = new countqueuingstrategy({
highwatermark: 1 }); let result = ""; const writablestream = new writablestream({ // implement the sink write(chunk) { return new promise((resolve, reject) => { var buffer = new arraybuffer(2); var view = new uint16array(buffer); view[0] = chunk; var decoded = decoder.decode(view, { stream: true }); var listitem = document.createelement('li'); listitem.textc...
... the
highwatermark property, which is set when creating the counting strategy (line 35), sets the maximum amount of data that the writablestream instance will handle in a single write() operation.
<input>: The Input (Form Input) element - HTML: Hypertext Markup Language
those with extra importance as it relates to <input> are
highlighted.
...this must be an integer value 0 or
higher.
... for the input types whose domain of possible values is periodic (that is, at the
highest possible value, the values wrap back around to the beginning rather than ending), it's possible for the values of the max and min properties to be reversed, which indicates that the range of permitted values starts at min, wraps around to the lowest possible value, then continues on until max is reached.
... function validate(input) { let validitystate_object = input.validity; if(validitystate_object.valuemissing) { input.setcustomvalidity('a value is required'); } else if (input.rangeunderflow) { input.setcustomvalidity('your value is too low'); } else if (input.rangeoverflow) { input.setcustomvalidity('your value is too
high'); } else { input.setcustomvalidity(''); } } the last line, setting the custom validity message to the error string is vital.
A re-introduction to JavaScript (JS tutorial) - JavaScript
javascript is now used by an incredible number of
high-profile applications, showing that deeper knowledge of this technology is an important skill for any web or mobile developer.
...this is always one more than the
highest index in the array.
...consider the following: var a = ['dog', 'cat', 'hen']; a[100] = 'fox'; a.length; // 101 remember — the length of the array is one more than the
highest index.
... function countchars(elm) { if (elm.nodetype == 3) { // text_node return elm.nodevalue.length; } var count = 0; for (var i = 0, child; child = elm.childnodes[i]; i++) { count += countchars(child); } return count; } this
highlights a potential problem with anonymous functions: how do you call them recursively if they don't have a name?
Math.clz32() - JavaScript
the ctrz function below fills in all the
high bits with the lowest filled bit, then negates the bits to erase all
higher set bits so that clz can then be used.
...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.
String.prototype.charAt() - JavaScript
apt 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 < 0xd800 || code > 0xdfff) { return str.charat(i); } //
high surrogate (could change last hex to 0xdb7f to treat
high private // surrogates as single characters) if (0xd800 <= 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 (0xd800 > 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...
...iteration and returning an array with the individual character // and 'i' value (only changed if a surrogate pair) console.log(chr) } function getwholecharandi(str, i) { let code = str.charcodeat(i) if (number.isnan(code)) { return '' // position not found } if (code < 0xd800 || code > 0xdfff) { return [str.charat(i), i] // normal character, keeping 'i' the same } //
high surrogate (could change last hex to 0xdb7f to treat
high private // surrogates as single characters) if (0xd800 <= code && code <= 0xdbff) { if (str.length <= (i + 1)) { throw '
high surrogate without following low surrogate' } let 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), i + 1] } // low surrogate (0xdc00 <= code && code <= 0xdfff) if (i === 0) { throw 'low surrogate without preceding
high surrogate' } let prev = str.charcodeat(i - 1) // (could change last hex to 0xdb7f to treat
high private surrogates // as single characters) if (0xd800 > prev || prev > 0xdbff) { throw 'low surrogate without preceding
high surrogate' } // return the next character instead (and increment) return [str.charat(i + 1), i + 1] } fixing charat() to support non-basic-multilingual-plane (bmp) characters while the previous example may be more useful for programs that must support non-bmp characters (since it does not require the caller to know where any non-bmp character might appear), in the event that ...
Understanding latency - Web Performance
in terms of performance optimization, it's important to optimize to reduce causes of lacency and to test site performance emulating
high latency to optimizer for users with lousy connections.
...
high latency implies that there are many delays.
...the greater the number and size of these requests, the greater the impact of
high latency on user experience.
...on a connection with
high latency, there will be a discernible delay between the time that a request is sent, and the resources are returned.
Web Performance
in terms of performance optimization, it's important to optimize to reduce causes of lacency and to test site performance emulating
high latency to optimizer for users with lousy connections.
... using performance apis performance api this guide describes how to use the performance interfaces that are defined in the
high-resolution time standard.
...this article outlines some javascript best practices that can ensure even complex content's performance is the
highest possible.
...some of these formats can take your
highly optimized media-rich pages even further by offering additional reductions in file size.
stroke-linecap - SVG: Scalable Vector Graphics
default) "butt" value --> <line x1="1" y1="1" x2="5" y2="1" stroke="black" stroke-linecap="butt" /> <!-- effect of the "round" value --> <line x1="1" y1="3" x2="5" y2="3" stroke="black" stroke-linecap="round" /> <!-- effect of the "square" value --> <line x1="1" y1="5" x2="5" y2="5" stroke="black" stroke-linecap="square" /> <!-- the following pink lines
highlight the position of the path for each stroke --> <path d="m1,1 h4 m1,3 h4 m1,5 h4" stroke="pink" stroke-width="0.025" /> </svg> usage notes value butt | round | square default value butt animatable yes butt the butt value indicates that the stroke for each subpath does not extend beyond its two endpoints.
... example html,body,svg { height:100% } <svg viewbox="0 0 6 4" xmlns="http://www.w3.org/2000/svg"> <!-- effect of the "butt" value --> <path d="m1,1 h4" stroke="black" stroke-linecap="butt" /> <!-- effect of the "butt" value on a zero length path --> <path d="m3,3 h0" stroke="black" stroke-linecap="butt" /> <!-- the following pink lines
highlight the position of the path for each stroke --> <path d="m1,1 h4" stroke="pink" stroke-width="0.025" /> <circle cx="1" cy="1" r="0.05" fill="pink" /> <circle cx="5" cy="1" r="0.05" fill="pink" /> <circle cx="3" cy="3" r="0.05" fill="pink" /> </svg> round the round value indicates that at the end of each subpath the stroke will be extended by a half circle with a diameter equal ...
... example html,body,svg { height:100% } <svg viewbox="0 0 6 4" xmlns="http://www.w3.org/2000/svg"> <!-- effect of the "round" value --> <path d="m1,1 h4" stroke="black" stroke-linecap="round" /> <!-- effect of the "round" value on a zero length path --> <path d="m3,3 h0" stroke="black" stroke-linecap="round" /> <!-- the following pink lines
highlight the position of the path for each stroke --> <path d="m1,1 h4" stroke="pink" stroke-width="0.025" /> <circle cx="1" cy="1" r="0.05" fill="pink" /> <circle cx="5" cy="1" r="0.05" fill="pink" /> <circle cx="3" cy="3" r="0.05" fill="pink" /> </svg> square the square value indicates that at the end of each subpath the stroke will be extended by a rectangle with a width equal to ...
... example html,body,svg { height:100% } <svg viewbox="0 0 6 4" xmlns="http://www.w3.org/2000/svg"> <!-- effect of the "square" value --> <path d="m1,1 h4" stroke="black" stroke-linecap="square" /> <!-- effect of the "square" value on a zero length path --> <path d="m3,3 h0" stroke="black" stroke-linecap="square" /> <!-- the following pink lines
highlight the position of the path for each stroke --> <path d="m1,1 h4" stroke="pink" stroke-width="0.025" /> <circle cx="1" cy="1" r="0.05" fill="pink" /> <circle cx="5" cy="1" r="0.05" fill="pink" /> <circle cx="3" cy="3" r="0.05" fill="pink" /> </svg> browser compatibility the compatibility table on this page is generated from structured data.
SDK and XUL Comparison - Archive of obsolete content
advantages of the sdk simplicity the sdk provides
high-level javascript apis to simplify many common tasks in add-on development, and tool support which greatly simplifies the process of developing, testing, and packaging an add-on.
... compatibility although we can't promise we'll never break a
high-level api, maintaining compatibility across firefox versions is a top priority for us.
...if you need more flexibility than the sdk's
high-level apis provide, you can use its low-level apis to load xpcom objects directly or to manipulate the dom directly as in a traditional bootstrapped extension.
Appendix F: Monitoring DOM changes - Archive of obsolete content
unfortunately, adding listeners for any of these events to a document has a
highly deleterious effect on performance, an effect which is not mitigated in the slightest by later removing those listeners.
... mutation observers mutation observers are the more efficient, w3c speced replacement for the
highly inefficient mutation events.
...this scheme is
highly flexible and can be made to work under most circumstances.
Handling Preferences - Archive of obsolete content
« previousnext » preferences in firefox mozilla applications are
highly customizable.
... firefox exposes its most common
high-level preferences through the preferences window and other parts of its ui.
...preferences with non-default values are
highlighted in bold.
JXON - Archive of obsolete content
vval : new vval.constructor(vval); } function createobjtree (oparentnode, nverb, bfreeze, bnesteattr) { const nlevelstart = acache.length, bchildren = oparentnode.haschildnodes(), battributes = oparentnode.hasattributes && oparentnode.hasattributes(), b
highverb = boolean(nverb & 2); var sprop, vcontent, nlength = 0, scollectedtxt = "", vresult = b
highverb ?
... scollectedtxt += onode.nodevalue; } /* nodetype is "cdatasection" (4) */ else if (onode.nodetype === 3) { scollectedtxt += onode.nodevalue.trim(); } /* nodetype is "text" (3) */ else if (onode.nodetype === 1 && !onode.prefix) { acache.push(onode); } /* nodetype is "element" (1) */ } } const nlevelend = acache.length, vbuiltval = parsetext(scollectedtxt); if (!b
highverb && (bchildren || battributes)) { vresult = nverb === 0 ?
...rparent[saprefix + oattrib.name.tolowercase()] = parsetext(oattrib.value.trim()); } if (bnesteattr) { if (bfreeze) { object.freeze(oattrparent); } vresult[sattrprop] = oattrparent; nlength -= nattrlen - 1; } } if (nverb === 3 || (nverb === 2 || nverb === 1 && nlength > 0) && scollectedtxt) { vresult[svalprop] = vbuiltval; } else if (!b
highverb && nlength === 0 && scollectedtxt) { vresult = vbuiltval; } if (bfreeze && (b
highverb || nlength > 0)) { object.freeze(vresult); } acache.length = nlevelstart; return vresult; } function loadobjtree (oxmldoc, oparentel, oparentobj) { var vvalue, ochild; if (oparentobj.constructor === string || oparentobj.constructor === number || oparentobj.constructor...
Localizing an extension - Archive of obsolete content
create a properties file the first thing we do is create a property file for the literal strings used by the javascript code in stockwatcher2.js: changestring=chg: openstring=open: lowstring=low:
highstring=
high: volumestring=vol: the stockwatcher2.properties file shown above maps five keys (changestring, openstring, lowstring,
highstring, and volumestring) to the corresponding text in english.
...we add to refreshinformation() the following code: var stringsbundle = document.getelementbyid("string-bundle"); var changestring = stringsbundle.getstring('changestring') + " "; var openstring = stringsbundle.getstring('openstring') + " "; var lowstring = stringsbundle.getstring('lowstring') + " "; var
highstring = stringsbundle.getstring('
highstring') + " "; var volumestring = stringsbundle.getstring('volumestring') + " "; this code gets a reference to the string bundle element we added to stockwatcher2.xul by calling document.getelementbyid(), specifying the id "string-bundle".
...then we replace any occurrences of the literal strings with the appropriate variables: samplepanel.tooltiptext = changestring + fieldarray[4] + " | " + openstring + fieldarray[5] + " | " + lowstring + fieldarray[6] + " | " +
highstring + fieldarray[7] + " | " + volumestring + fieldarray[8]; localizing the description in install.rdf see localizing extension descriptions.
Source code directories overview - Archive of obsolete content
the [#seamonkey-embedding embedding] code wraps this code with
higher level browser functions like forward, back and history.
... embedding contains c interfaces and code for generic
high-level browser functions (e.g.
... netwerk contains c interfaces and code for low-level access to the network (using sockets and file and memory caches) as well as
higher-level access (using various protocols such as http, ftp, gopher, castanet).
Mozilla Application Framework in Detail - Archive of obsolete content
this is very powerful since you could make improvements to the underlying application logic without having to rewrite the
higher level code.
...gecko is the premier cross-platform, full-featured, mature and well-tested layout engine available, providing robust and
high quality support for a massive array of standards.
...the xpinstall api makes the following functionality available as
high-level javascript objects: an install trigger that initiates installations windows registry access mozilla registration interfaces for registering new mozilla software facilities for detecting and maintaining application versions
high-level objects for manipulating local directories and files complete reference documentation, including useful example installations the following snippet fro...
XUL Events - Archive of obsolete content
this event would be used to update the disabled status of its commands.dommenuitemactivethe dommenuitemactive event is executed when a <menu> or a <menuitem> has been hovered or
highlighted.dommenuiteminactivethe dommenuiteminactive event is executed when a <menu> or a <menuitem> in no longer hovered or
highlighted.popuphiddenthe popuphidden event is executed when a <menupopup>, <panel> or <tooltip> has become hidden.popuphidingthe popuphiding event is executed when a <menupopup>, <panel> or <tooltip> is about to be hidden.popupshowingthe popupshowing event is executed when a...
... attribute: onunderflow dommenuitemactive this event is sent when a menu or menuitem is hovered over, or
highlighted.
... dommenuiteminactive this event is sent when a menu or menuitem is no longer being hovered over, or
highlighted.
findbar - Archive of obsolete content
attributes browserid, findnextaccesskey, findpreviousaccesskey,
highlightaccesskey, matchcaseaccesskey properties browser, findmode methods close, onfindagaincommand, open, startfind, toggle
highlight example <browser type="content-primary" flex="1" id="content" src="about:blank"/> <findbar id="findtoolbar" browserid="content"/> attributes browserid type: string the id of the browser element to which the findbar is attached.
...
highlightaccesskey type: string the access key for the "
highlight" toolbar button in the findbar.
... toggle
highlight(
highlight ) return type: no return value turns
highlighting of text matching the search term on and off; specify false to disable
highlighting or true to enable it.
appendNotification - Archive of obsolete content
if another notification is already present with a
higher priority, the new notification will be added behind it.
... priority levels (defined as properties of notificationbox) : priority_info_low priority_info_medium priority_info_
high priority_warning_low priority_warning_medium priority_warning_
high priority_critical_low priority_critical_medium priority_critical_
high priority_critical_block buttons : the buttons argument is an array of button descriptions.
... popup: null }; buttons.push(button2); //appendnotification( label , value , image (url) , priority , buttons, eventcallback ) notifybox.appendnotification("my notification text", "test notification unique id", "chrome://browser/content/aboutrobots-icon.png", notifybox.priority_info_
high, buttons, testnotificationcallback); } ...
Menus - Archive of obsolete content
when the user moves the mouse over a menuitem, it will
highlight the item.
...the user can press a key to
highlight the menu labels and navigate with the cursor keys.
... this item will be
highlighted, and will do certain functions depending on the kind of item it is, and the way in which it has been activated, whether via the keyboard or mouse.
PopupKeys - Archive of obsolete content
the following table lists the keys that are checked, and what the menu keyboard listener does in response: cursor up/down move the
highlight within the menu up or down, wrapping around if necessary.
...home/end move the
highlight to the beginning or the end of the menu, selecting the first or last item.
... enter/return activate the currently
highlighted item.
Manifest Files - Archive of obsolete content
change the
highlighted parts of the file above to your own information.
...replace the blue
highlighted text above with your application's title and author.
...change the
highlighted text to the file url below of the directory.
XUL Event Propagation - Archive of obsolete content
very often, the event raised by the element is heard by the element itself and handled right there before it bubbles up any
higher.
...where event bubbling propagates an event from its target up
higher into the node hiearchy, event capturing intercepts an event before it is received by other elements, even by the event target itself.
...(see it happen.) for an event to be useful somewhere
higher up, however, it is very often necessary to determine which element below the handler actually raised the event.
Introduction to Public-Key Cryptography - Archive of obsolete content
cas under the subordinate cas in the hierarchy have their ca certificates signed by the
higher-level subordinate cas.
...in general, processes for issuing certificates should be
highly flexible, so organizations can tailor them to their changing needs.
... in general,
high-performance directory services are an essential ingredient of any enterprise certificate management strategy.
Building a Theme - Archive of obsolete content
updating the toolbar's styling note in firefox 4.0 and up, the
highlight feature of dom inspector is broken.
...during the development phase for firefox versions 2.0 and
higher, you can point firefox to the folder where you are developing the theme, and it'll load it up every time you restart firefox.
...it is
highly recommended that you use mozilla add-ons to distribute your themes!
Choosing Standards Compliance Over Proprietary Practices - Archive of obsolete content
at the
high level, there are two primary types of standards: procedural (how do we do it) vs.
...pilot had a
highly-integrated debugging tool called co-pilot that allowed the xerox development organization to quickly and easily debug issues.
...like the engineers, standardization also helps the qa engineers become
highly proficient and capable of shifting from project to project.
Efficient animation for web games - Game development
the reason for this is that css transitions/animations are much
higher level than javascript, and express a very specific intent.
...requestanimationframe includes a dom
highrestimestamp in its callback function prototype, which you definitely should use (as opposed to using the date object), as this will be the time the frame began rendering, and ought to make your animations look more fluid.
... measure performance there are some popular animation-related libraries and ui toolkits with animation functions that still do things like using settimeout to drive their animations, drive all their animations completely individually, or other similar things that aren’t conducive to maintaining a
high frame-rate.
asm.js - Game development
asm.js is a specification defining a subset of javascript that is
highly optimizable.
... this subset of javascript is already
highly optimized in many javascript engines using fancy just-in-time (jit) compiling techniques.
... it also makes it easy for people writing compilers that want to generate
high-performant code on the web.
Mobile accessibility - Learn web development
responsive design — make sure layouts work on mobile, conserve image download sizes, and think about the provision of images for
high-resolution screens.
... thinking about
high resolutions.
... many mobile devices have
high-resolution screens, and therefore need
higher-resolution images so that the display can continue to look crisp and sharp.
What is accessibility? - Learn web development
our advice is to familiarize yourself with the basic areas in which you need to take care, as well as understanding the
high-level structures of the guidelines that are most relevant to you.
...there is no need to learn all of the wcag — be aware of the major areas of concern, and use a variety of techniques and tools to
highlight any areas that don't conform to the wcag criteria (see below for more).
... summary this article should have given you a useful
high-level overview of accessibility, shown you why it's important, and looked at how you can fit it into your workflow.
Images, media, and form elements - Learn web development
understanding what is and isn't possible can save some frustration, and this lesson will
highlight some of the main things that you need to know.
...there are a few key basics worth
highlighting in this section of the article.
... summary this lesson has
highlighted some of the differences you will encounter when working with images, media, and other unusual elements in css.
How CSS is structured - Learn web development
the example below
highlights a single property and value.
...in the example below,
highlighting identifies the css declaration block..
...the colored
highlighting identifies the h1 rule.
Fundamental text and font styling - Learn web development
you can't select and style subsections of text unless you wrap them in an appropriate element (such as a <span> or <strong>), or use a text-specific pseudo-element like ::first-letter (selects the first letter of an element's text), ::first-line (selects the first line of an element's text), or ::selection (selects the text currently
highlighted by the cursor.) fonts let's move straight on to look at properties for styling fonts.
...font size (set with the font-size property) can take values measured in most of these units (and others, such as percentages), however the most common units you'll use to size text are: px (pixels): the number of pixels
high you want the text to be.
... the blur radius — a
higher value means the shadow is dispersed more widely.
What are hyperlinks? - Learn web development
companies naturally want their sites to rank
highly in search results.
... the more incoming links a webpage can boast of, the
higher it ranks in search results.
... seo (search engine optimization) is the study of how to make websites rank
highly in search results.
Example 1 - Learn web development
st { z-index : 2; list-style: none; margin : 0; padding: 0; background: #f0f0f0; border: .2em solid #000; border-top-width : .1em; border-radius: 0 0 .4em .4em; box-shadow: 0 .2em .4em rgba(0,0,0,.4); box-sizing : border-box; min-width : 100%; max-height: 10em; /* 100px */ overflow-y: auto; overflow-x: hidden; } .select .option { padding: .2em .3em; } .select .
highlight { background: #000; color: #ffffff; } result for basic state active state html <div class="select active"> <span class="value">cherry</span> <ul class="optlist hidden"> <li class="option">cherry</li> <li class="option">lemon</li> <li class="option">banana</li> <li class="option">strawberry</li> <li class="option">apple</li> </ul> </div> css /* ---------...
...st { z-index : 2; list-style: none; margin : 0; padding: 0; background: #f0f0f0; border: .2em solid #000; border-top-width : .1em; border-radius: 0 0 .4em .4em; box-shadow: 0 .2em .4em rgba(0,0,0,.4); box-sizing : border-box; min-width : 100%; max-height: 10em; /* 100px */ overflow-y: auto; overflow-x: hidden; } .select .option { padding: .2em .3em; } .select .
highlight { background: #000; color: #ffffff; } result for active state open state html <div class="select active"> <span class="value">cherry</span> <ul class="optlist"> <li class="option
highlight">cherry</li> <li class="option">lemon</li> <li class="option">banana</li> <li class="option">strawberry</li> <li class="option">apple</li> </ul> </div> css /* --------...
...e: none; margin : 0; padding: 0; background: #f0f0f0; border: .2em solid #000; border-top-width : .1em; border-radius: 0 0 .4em .4em; box-shadow: 0 .2em .4em rgba(0,0,0,.4); -moz-box-sizing : border-box; box-sizing : border-box; min-width : 100%; max-height: 10em; /* 100px */ overflow-y: auto; overflow-x: hidden; } .select .option { padding: .2em .3em; } .select .
highlight { background: #000; color: #fff; } result for open state ...
Example 3 - Learn web development
e: none; margin : 0; padding: 0; background: #f0f0f0; border: .2em solid #000; border-top-width : .1em; border-radius: 0 0 .4em .4em; box-shadow: 0 .2em .4em rgba(0,0,0,.4); -moz-box-sizing : border-box; box-sizing : border-box; min-width : 100%; max-height: 10em; /* 100px */ overflow-y: auto; overflow-x: hidden; } .select .option { padding: .2em .3em; } .select .
highlight { background: #000; color: #ffffff; } javascript content // ------- // // helpers // // ------- // nodelist.prototype.foreach = function (callback) { array.prototype.foreach.call(this, callback); } // -------------------- // // function definitions // // -------------------- // function deactivateselect(select) { if (!select.classlist.contains('active')) return; var optlist =...
...ptlist'); optlist.classlist.add('hidden'); select.classlist.remove('active'); } function activeselect(select, selectlist) { if (select.classlist.contains('active')) return; selectlist.foreach(deactivateselect); select.classlist.add('active'); }; function toggleoptlist(select, show) { var optlist = select.queryselector('.optlist'); optlist.classlist.toggle('hidden'); } function
highlightoption(select, option) { var optionlist = select.queryselectorall('.option'); optionlist.foreach(function (other) { other.classlist.remove('
highlight'); }); option.classlist.add('
highlight'); }; // ------------- // // event binding // // ------------- // window.addeventlistener("load", function () { var form = document.queryselector('form'); form.classlist.remove("no-widg...
...et"); form.classlist.add("widget"); }); window.addeventlistener('load', function () { var selectlist = document.queryselectorall('.select'); selectlist.foreach(function (select) { var optionlist = select.queryselectorall('.option'); optionlist.foreach(function (option) { option.addeventlistener('mouseover', function () {
highlightoption(select, option); }); }); select.addeventlistener('click', function (event) { toggleoptlist(select); }, false); select.addeventlistener('focus', function (event) { activeselect(select, selectlist); }); select.addeventlistener('blur', function (event) { deactivateselect(select); }); select.addeventlistener('keyup', function (event) { if (event.keycode === 27) { ...
What’s in the head? Metadata in HTML - Learn web development
specifying a description that includes keywords relating to the content of your page is useful as it has the potential to make your page appear
higher in relevant searches performed in search engines (such activities are termed search engine optimization, or seo.) active learning: the description's use in search engines the description is also used on search engine result pages.
...for example, you'll find this in the source code of the mdn web docs homepage: <!-- third-generation ipad with
high-resolution retina display: --> <link rel="apple-touch-icon-precomposed" sizes="144x144" href="https://developer.cdn.mozilla.net/static/img/favicon144.a6e4162070f4.png"> <!-- iphone with
high-resolution retina display: --> <link rel="apple-touch-icon-precomposed" sizes="114x114" href="https://developer.cdn.mozilla.net/static/img/favicon114.0e9fabd44f85.png"> <!-- first- and second-generation ipad:...
...one, ipod touch, and android 2.1+ devices: --> <link rel="apple-touch-icon-precomposed" href="https://developer.cdn.mozilla.net/static/img/favicon57.a2490b9a2d76.png"> <!-- basic favicon --> <link rel="shortcut icon" href="https://developer.cdn.mozilla.net/static/img/favicon32.e02854fdcf73.png"> the comments explain what each icon is used for — these elements cover things like providing a nice
high resolution icon to use when the website is saved to an ipad's home screen.
Introduction to web APIs - Learn web development
overview: client-side web apis next first up, we'll start by looking at apis from a
high level — what are they, how do they work, how to use them in your code, and how are they structured?
... in the same way, if you want to say, program some 3d graphics, it is a lot easier to do it using an api written in a
higher-level language such as javascript or python, rather than try to directly write low level code (say c or c++) that directly controls the computer's gpu or other graphics functions.
...let's recap this to make it clearer, and also mention where other javascript tools fit in: javascript — a
high-level scripting language built into browsers that allows you to implement functionality on web pages/apps.
Basic math in JavaScript — numbers and operators - Learn web development
change the line that calculates y so the box is 75px
high, but the 75 is calculated using the numbers 25 and 3 and an arithmetic operator.
... change the line that calculates y so the box is 150px
high, but the 150 is calculated using three numbers and the subtraction and division operators.
... change the line that calculates y so the box is 200px
high, but the 200 is calculated using the numbers 50 and 3, the multiplication operator, and the addition assignment operator.
What went wrong? Troubleshooting JavaScript - Learn web development
if you follow this link, you'll see the exact line where the error is
highlighted.
... have a look at line 78, and you'll see the following code: loworhi.textcontent = 'last guess was too
high!'; this line is trying to set the textcontent property of the loworhi constant to a text string, but it's not working because loworhi does not contain what it's supposed to.
...this section
highlights most of them.
Getting started with Svelte - Learn web development
svelte is a compiler that generates minimal and
highly optimized javascript code from our sources; you'll need a terminal with node + npm installed to compile and build your app.
...while frameworks like react and vue do the bulk of their work in the user's browser while the app is running, svelte shifts that work into a compile step that happens only when you build your app, producing
highly-optimized vanilla javascript.
...
highly interactive pages or complex visualizations: if you are building data-visualizations that need to display a large number of dom elements, the performance gains that come from a framework with no runtime overhead will ensure that user interactions are snappy and responsive.
Understanding client-side JavaScript frameworks - Learn web development
this article will explore the main features of “the big 4” frameworks, looking at how frameworks tend to work from a
high level and the differences between them.
...in this article, we'll look at a little bit of vue background, learn how to install it and create a new project, study the
high-level structure of the whole project and an individual component, see how to run the project locally, and get it prepared to start building our example.
...we just think they score
highly on the above criteria.
Client-side tooling overview - Learn web development
from a
high-level perspective, you can put client-side tools into the following three broad categories of problems to solve: safety net — tools that are useful during your code development.
... eslint is the industry standard javascript linter — a
highly configurable tool for catching potential syntax errors and encouraging "best practices" throughout your code.
... summary that rounds off our gentle introduction to the topic of client-side web tooling, from a
high level.
Accessibility API cross-reference
n/a accessible_active_descendant_property aria-activedescendant critical info to convey immediately alert_
high n/a n/a aria-live=assertive info that's important, but does not require immediacy alert_medium n/a n/a aria-live=polite low-priority info such as a tip or hint alert_low n/a n/a n/a this object is changing or moving rapidly animated n/a n/a n/a indicates...
... that the user input is currently directed to that object and it is "armed for selection." example: a
highlighted menu item or a pressed push button.
...for example, could be used with
higher level containers.
Eclipse CDT
introduction eclipse cdt (c/c++ development tools) is an open-source ide for c and c++ development with advanced code assistance (inheritance/call graph explorer, jump to definition, refactoring, autocomplete, syntax
highlighting, and so on).
...if you select one of these classes, then in the method pane to the right the method you searched for will be
highlighted (you may need to scroll to it) - double click to see its definition.
... troubleshooting: if you get an error when trying to update, try clicking "available software sites" in the "install" window, make sure "juno" is still unticked, that "nightly" is ticked,
highlight "nightly", click "reload", "ok", and then try again.
Browser API
htmliframeelement.clearmatch() clears any content
highlighted by findall() or findnext().
... htmliframeelement.findall() searches for a string in a browser <iframe>'s content; if found, the first instance of the string relative to the caret position will be
highlighted.
... htmliframeelement.findnext()
highlights the next or previous instance of a search result after a findall() search has been carried out.
Emscripten
with emscripten, c/c++ developers don’t have the
high cost of porting code manually to javascript — or having to learn javascript at all.
... practically any portable c or c++ codebase can be compiled into javascript using emscripten, ranging from
high performance games that need to render graphics, play sounds, and load and process files, through to application frameworks like qt.
... emscripten generates fast code — its default output format is asm.js , a
highly optimizable subset of javascript that can execute at close to native speed in many cases.
Index
2 an overview of nss internals api, intermediate, intro, nss, tools a
high-level overview to the internals of network security services (nss) software developed by the mozilla.org projects traditionally used its own implementation of security protocols and cryptographic algorithms, originally called netscape security services, nowadays called network security services (nss).
...as a result, when searching for a trust path from (a) to a trusted anchor (root) certificate (z), the set of candidate issuer certificates might have different issuer names (referring to the second or
higher issuer level).
...the
higher the level of compression, the smaller the output but the longer the operation takes.
JSS 4.4.0 Release Notes
zilla.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 055aa3ce8a61 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.28.3 is recommended.
... jss 4.3.1 requires nspr 4.7.1 or
higher though nspr 3.13 is recommended.
Rhino optimization
note some language features (indirect calls to eval, use of the arguments property of function objects) were previously not supported in
higher optimization levels.
... these features have been removed from the language in ecma, so
higher optimization levels are now conformant.
... future versions may allocate more aggressive optimizations to
higher optimization levels.
Bytecode Descriptions
format: jof_jump tableswitch operands: (int32_t defaultoffset, int32_t low, int32_t
high, uint24_t firstresumeindex) stack: i ⇒ optimized switch-statement dispatch, used when all case labels are small integer constants.
... if low <= i <=
high, jump to the instruction at the offset given by script->resumeoffsets()[firstresumeindex + i - low], in bytes from the start of the current script's bytecode.
...the following inequalities must hold: low <=
high and firstresumeindex +
high - low < resumeoffsets().size().
Web Replay
microsoft's and webkit's replay projects operate at a
higher level than rr.
... compared to a
higher level project, this is able to operate on stable, thoroughly documented library apis.
... redirected functions include both low level system call wrappers like sendmsg/recvmsg, and
higher level functions such as various cocoa interfaces.
Observer Notifications
topic data description
highlighter-ready - sent when the
highlighter component is initialized.
... inspector-
highlighting - sent every time a different node in the page gets
highlighted.
... inspector-un
highlighting - sent every time the
highlighter stops
highlighting a node.
nsIDBFolderInfo
long orflags(in long flags); void setbooleanproperty(in string propertyname, in boolean apropertyvalue); void setcharacterset(in string charset); void setcharactersetoverride(in boolean charactersetoverride); obsolete since gecko 1.8 void setcharptrproperty(in string apropertyname, in string apropertyvalue); void set
highwater(in nsmsgkey
highwater, in boolean force); void setlocale(in nsstring locale); native code only!
... type description charactersetoverride boolean expiredmark nsmsgkey expungedbytes long flags long folderdate unsigned long foldername string foldersize unsigned long
highwater nsmsgkey imaphierarchyseparator wchar imaptotalpendingmessages long imapuidvalidity long imapunreadpendingmessages long knownartsset string locale astring mailboxname astring ...
...etoverride missing description exceptions thrown missing exception missing description setcharptrproperty() void setcharptrproperty( in string apropertyname, in string apropertyvalue ); parameters apropertyname missing description apropertyvalue missing description exceptions thrown missing exception missing description set
highwater() void set
highwater( in nsmsgkey
highwater, in boolean force ); parameters
highwater missing description force missing description exceptions thrown missing exception missing description native code only!setlocale obsolete since gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0)this feature is obsolete.
nsIHTMLEditor
nt); void getalignment(out boolean amixed, out short aalign); astring getbackgroundcolorstate(out boolean amixed); nsidomelement getelementorparentbytagname(in astring atagname, in nsidomnode anode); astring getfontcolorstate(out boolean amixed); astring getfontfacestate(out boolean amixed); astring getheadcontentsashtml(); astring get
highlightcolorstate(out boolean amixed); void getindentstate(out boolean acanindent, out boolean acanoutdent); void getinlineproperty(in nsiatom aproperty, in astring aattribute, in astring avalue, out boolean afirst, out boolean aany, out boolean aall); astring getinlinepropertywithattrvalue(in nsiatom aproperty, in astring aattribute, in astring avalue, out boolean afirst,...
... return value get
highlightcolorstate() returns what the
highlight color of the selection.
... astring get
highlightcolorstate( out boolean amixed ); parameters amixed true if there is more than one font color.
nsIWebProgressListener
the degree of security is expressed by state_secure_
high, state_secure_med, or state_secure_low.
... constant value description state_secure_
high 0x00040000 this flag indicates a
high degree of security.
... constant value description state_identity_ev_toplevel 0x00100000 state bits for ev == extended validation ==
high assurance.
Drawing and Event Handling - Plugins
however, for the plug-in to draw at any other time, for example, to
highlight on a mouse-down event or draw animation at idle time, it must save the current setting of the port, set up its drawing environment as appropriate, draw, and then restore the port to the previous settings.
...because the drag manager calls both handlers no matter where the cursor is, the browser does not show the drag
highlight when the cursor is over an instance rectangle.
...the plug-in can then show the drag
highlight and handle drops when they occur within the instance rectangle.
Plug-in Basics - Plugins
you can use the plug-in api to write plug-ins that are media type driven and provide
high performance by taking advantage of native code.
...ing object elements</title> <style type="text/css"> .myplugin { width: 470px; height: 231px; } </style> </head> <body><p> <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,30,0" class="myplugin"> <param name="movie" value="foo.swf"/> <param name="quality" value="
high"/> <param name="salign" value="tl"/> <param name="menu" value="0"/> <object data="foo_movie.swf" type="application/x-shockwave-flash" class="myplugin"/> <param name="quality" value="
high"/> <param name="salign" value="tl"/> <param name="menu" value="0"/> <object type="*" class="myplugin"> <param name="plu...
... example 2: embed within object <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,30,0" width="749" height="68"> <param name="movie" value="foo.swf"> <param name="quality" value="
high"> <param name="bgcolor" value="#eeeeee"> <param name="salign" value="tl"> <param name="menu" value="0"> <embed src="foo.swf" quality="
high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?p1_prod_version=shockwaveflash" type="application/x-shockwave-flash" width="749" height="68" bgcolor="#eeeeee" salign="tl" menu="0"> </embed> </object> using cu...
Edit Shape Paths in CSS - Firefox Developer Tools
clicking the icon will cause the editor to
highlight the shape.
...clicking on the shapes icon next to the value of circle() will
highlight the shape, and also give you the option to resize the circle or move its center.
... moving and scaling shapes there is extra functionality available on the shape
highlight — if you ctrl/cmd + click on the shapes icon for your shape the
highlight will change, instead providing the ability to scale and/or move it.
Paint Flashing Tool - Firefox Developer Tools
the paint flashing tool, when activated,
highlights the part of a page that the browser needs to repaint in response to some input: for example, the user moving the mouse or scrolling.
... using the paint flashing tool open the toolbox, then click the icon labeled "
highlight painted area": then try using the page.
...e page looks like this: in this example, there are two main sources of repaints: moving the mouse over links makes the browser repaint them, because they have a style applied using the :hover pseudo-class scrolling makes the browser repaint the new part of the page coming into view at the bottom of the screen, and also the scrollbar at the top-right to deactivate paint flashing, click the "
highlight painted area" icon in the toolbox again.
Call Tree - Firefox Developer Tools
each row represents a function in which at least one sample was taken, and the rows are ordered by the number of samples taken while in that function,
highest to lowest.
...functions with a relatively
high self cost are good candidates for optimization, either because they take a long time to run, or because they are called very often.
...if we look at the code for sort(), it should be fairly obvious that the
high platform data cost is coming from repeated calls to console.log(): function sort(unsorted) { console.log(bubblesort(unsorted)); console.log(selectionsort(unsorted)); console.log(quicksort(unsorted)); } it would certainly be worthwhile considering more efficient ways of implementing this.
The JavaScript input interpreter - Firefox Developer Tools
syntax
highlighting the text you enter has syntax
highlighting as soon as you have typed enough for the
highlighter to parse it and infer the meanings of the "words".
... the output is
highlighted as well where appropriate.
... note: syntax
highlighting is not visible in your browser if accessibility features have been enabled.
BiquadFilterNode.type - Web APIs
not used
highpass standard second-order resonant
highpass filter with 12db/octave rolloff.
...
highshelf standard second-order
highshelf filer.
... frequencies
higher than the frequency get a boost or an attenuation; frequencies lower than it are unchanged.
BiquadFilterNode - Web APIs
not used
highpass standard second-order resonant
highpass filter with 12db/octave rolloff.
...
highshelf standard second-order
highshelf filter.
... frequencies
higher than the frequency get a boost or an attenuation; frequencies lower than it are unchanged.
Document.querySelectorAll() - Web APIs
a list of matches to obtain a nodelist of all of the <p> elements in the document: var matches = document.queryselectorall("p"); this example returns a list of all <div> elements within the document with a class of either note or alert: var matches = document.queryselectorall("div.note, div.alert"); here, we get a list of <p> elements whose immediate parent element is a <div> with the class
highlighted and which are located inside a container whose id is test.
... var container = document.queryselector("#test"); var matches = container.queryselectorall("div.
highlighted > p"); this example uses an attribute selector to return a list of the <iframe> elements in the document that contain an attribute named data-src: var matches = document.queryselectorall("iframe[data-src]"); here, an attribute selector is used to return a list of the list items contained within a list whose id is userlist which have a data-active attribute whose value is 1: var container = document.queryselector("#userlist"); var matches = container.queryselectorall("li[data-active='1']"); accessing the matches once the nodelist of matching elements is returned, you can examine it just like any array.
...you can use any common looping statement, such as: var
highlighteditems = userlist.queryselectorall(".
highlighted");
highlighteditems.foreach(function(useritem) { deleteuser(useritem); }); user notes queryselectorall() behaves differently than most common javascript dom libraries, which might lead to unexpected results.
Element.querySelectorAll() - Web APIs
a nodelist of all of the <p> elements contained within the element "mybox": var matches = mybox.queryselectorall("p"); this example returns a list of all <div> elements within "mybox" with a class of either "note" or "alert": var matches = mybox.queryselectorall("div.note, div.alert"); here, we get a list of the document's <p> elements whose immediate parent element is a div with the class "
highlighted" and which are located inside a container whose id is "test".
... var container = document.queryselector("#test"); var matches = container.queryselectorall("div.
highlighted > p"); this example uses an attribute selector to return a list of the iframe elements in the document that contain an attribute named "data-src": var matches = document.queryselectorall("iframe[data-src]"); here, an attribute selector is used to return a list of the list items contained within a list whose id is "userlist" which have a "data-active" attribute whose value is "1": var container = document.queryselector("#userlist"); var matches = container.queryselectorall("li[data-active='1']"); accessing the matches once the nodelist of matching elements is returned, you can examine it just like any array.
...you can use any common looping statement, such as: var
highlighteditems = userlist.queryselectorall(".
highlighted");
highlighteditems.foreach(function(useritem) { deleteuser(useritem); }); note: nodelist is not a genuine array, that is to say it doesn't have the array methods like slice, some, map etc.
Using the Geolocation API - Web APIs
a third, optional, parameter is an options object where you can set the maximum age of the position returned, the time to wait for a request, and if you want
high accuracy for the position.
... this object allows you to specify whether to enable
high accuracy, a maximum age for the returned position value (up until this age it will be cached and reused if the same position is requested again; after this the browser will request fresh position data), and a timeout value that dictates how long the browser should attempt to get the position data for, before it times out.
... a call to watchposition could look like: function success(position) { dosomething(position.coords.latitude, position.coords.longitude); } function error() { alert('sorry, no position available.'); } const options = { enable
highaccuracy: true, maximumage: 30000, timeout: 27000 }; const watchid = navigator.geolocation.watchposition(success, error, options); describing a position the user's location is described using a geolocationposition object instance, which itself contains a geolocationcoordinates object instance.
MediaTrackSettings - Web APIs
common values include 1.3333333333 (for the classic television 4:3 "standard" aspect ratio, also used on tablets such as apple's ipad), 1.7777777778 (for the 16:9
high-definition widescreen aspect ratio), and 1.6 (for the 16:10 aspect ratio common among widescreen computers and tablets).
...this is typically the
highest quality camera on the device, used for general photography.
... "crop-and-scale" the track's resolution might be the result of the user agent using cropping or downscaling from a
higher camera resolution.
Performance.timeOrigin - Web APIs
the timeorigin read-only property of the performance interface returns the
high resolution timestamp of the start time of the performance measurement.
... syntax var timeorigin = performance.timeorigin value a
high resolution timestamp.
... specifications specification status
high resolution time level 2the definition of 'timeorigin' in that specification.
RTCRtpStreamStats - Web APIs
a fir packet is sent by the receiving end of the stream when it falls behind or has lost packets and is unable to continue decoding the stream; the sending end of the stream receives the fir packet and responds by sending a full frame instead of a delta frame, thereby letting the receiver "catch up." the
higher this number is, the more often a problem of this nature arose, which can be a sign of network congestion or an overburdened receiving device.
...in general, the
higher this number is, the more heavily compressed the video track was.
...this is a fairly technical part of how codecs work and while the
higher this value is, the more errors occurred in the stream, generally most of the time this value is only interesting to very intensively hardcore media developers.
Range.commonAncestorContainer - Web APIs
the listener gets the common ancestors of each piece of selected text, and triggers an animation to
highlight them.
... html <ul> <li>strings <ul> <li>cello</li> <li>violin <ul> <li>first chair</li> <li>second chair</li> </ul> </li> </ul> </li> <li>woodwinds <ul> <li>clarinet</li> <li>oboe</li> </ul> </li> </ul> css the .
highlight class created below uses a set of css @keyframes to animate a fading outline.
... .
highlight { animation:
highlight linear 1s; } @keyframes
highlight { from { outline: 1px solid #f00f; } to { outline: 1px solid #f000; } } body { padding: 1px; } javascript document.addeventlistener('pointerup', e => { const selection = window.getselection(); if (selection.type === 'range') { for (let i = 0; i < selection.rangecount; i++) { const range = selection.getrangeat(i); playanimation(range.commonancestorcontainer); } } }); function playanimation(el) { if (el.nodetype === node.text_node) { el = el.parentnode; } el.classlist.remove('
highlight'); settimeout(() => { el.classlist.add('
highlight'); }, 0); } result specifications specification status comment domthe definition of 'range.commonancest...
Range.setStart() - Web APIs
examples
highlight part of an element this example uses the range.setstart() and range.setend() methods to add part of an address to a range.
... the selected range is then
highlighted using range.surroundcontents().
... st.<br> dodge city, ks<br> 67801<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 const startoffset = 2; // start at third node: 101 e.
ReadableStream.ReadableStream() - Web APIs
pull(controller) optional this method, also defined by the developer, will be called repeatedly when the stream's internal queue of chunks is not full, up until it reaches its
high water mark.
...this takes two parameters:
highwatermark a non-negative integer — this defines the total number of chunks that can be contained in the internal queue before backpressure is applied.
...if no queuingstrategy is supplied, the default used is the same as a countqueuingstrategy with a
high water mark of 1.
Using writable streams - Web APIs
note: this article assumes that you understand the use cases of writable streams, and are aware of the
high-level concepts.
... the syntax skeleton looks like this: const stream = new writablestream({ start(controller) { }, write(chunk,controller) { }, close(controller) { }, abort(reason) { } }, {
highwatermark, size() }); the constructor takes two objects as parameters.
... the constructor call in our example looks like this: const decoder = new textdecoder("utf-8"); const queuingstrategy = new countqueuingstrategy({
highwatermark: 1 }); let result = ""; const writablestream = new writablestream({ // implement the sink write(chunk) { return new promise((resolve, reject) => { var buffer = new arraybuffer(2); var view = new uint16array(buffer); view[0] = chunk; var decoded = decoder.decode(view, { stream: true }); var listitem = document.createelement('li'); listitem.textc...
Using textures in WebGL - Web APIs
on the other hand if the texture is a power of 2 in both dimensions then webgl can do
higher quality filtering, it can use mipmap, and it can set the wrapping mode to repeat or mirrored_repeat.
... const vssource = ` attribute vec4 avertexposition; attribute vec2 atexturecoord; uniform mat4 umodelviewmatrix; uniform mat4 uprojectionmatrix; varying
highp vec2 vtexturecoord; void main(void) { gl_position = uprojectionmatrix * umodelviewmatrix * avertexposition; vtexturecoord = atexturecoord; } `; the key change here is that instead of fetching the vertex color, we're fetching the texture coordinates and passing them to the vertex shader; this will indicate the location within the texture corresponding to the vertex.
... the fragment shader the fragment shader likewise needs to be updated: const fssource = ` varying
highp vec2 vtexturecoord; uniform sampler2d usampler; void main(void) { gl_fragcolor = texture2d(usampler, vtexturecoord); } `; instead of assigning a color value to the fragment's color, the fragment's color is computed by fetching the texel (that is, the pixel within the texture) based on the value of vtexturecoord which like the colors is interpolated bewteen vertices.
Rendering and the WebXR frame animation callback - Web APIs
but not all displays run at 60 hz; nowadays,
higher performance displays are beginning to use much
higher refresh rates.
...the result is a dom
highrestimestamp value indicating the number of milliseconds that have elapsed since the last frame was rendered.
...this dom
highrestimestamp value is a floating-point value indicating the time at which the frame was scheduled for rendering.
Advanced techniques: Creating and sequencing audio - Web APIs
we want to cut off those
high frequencies and possibly some of the lower ones.
...for the most part a biquad filter will be good enough — it comes with different types such as lowpass,
highpass, and bandpass.
...there's no point repeating it all here, but it's
highly recommended to read this article and use this method.
Using IIR filters - Web APIs
for instance, if you want to filter lower frequencies from your sound, you can set the type to
highpass and then set which frequency to filter from (or cut off).
...so you can create a
highpass filter, or a lowpass filter, or a more bespoke one.
...as well as this, if your audio graph needed a
highpass and a bandpass filter within it, you could just use one iir filter node in place of the two biquad filter nodes you would otherwise need for this.
Window.requestAnimationFrame() - Web APIs
the callback method is passed a single argument, a dom
highrestimestamp, which indicates the current time (based on the number of milliseconds since time origin).
... be sure to always use the first argument (or some other method for getting the current time) to calculate how much the animation will progress in a frame, otherwise the animation will run faster on
high refresh rate screens.
...the callback function is passed one single argument, a dom
highrestimestamp similar to the one returned by performance.now(), indicating the point in time when requestanimationframe() starts to execute callback functions.
ARIA annotations - Accessibility
role="mark" — semantically denotes html elements containing text that is marked/
highlighted for reference purposes.
...as an example, let’s say you have a poll/voting ui widget that shows numbers of votes, but you want to summarize the purpose of the widget in a clear description because the ui does not make it clear: <section aria-description="choose your favourite fruit — the fruit with the
highest number of votes will be added to the lunch options next week."> <p>pick your favourite fruit:</p> <form> <ul> <li><label>apple: <input type="radio" name="fruit" value="apple"></label></li> <li><label>orange: <input type="radio" name="fruit" value="orange"></label></li> <li><label>banana: <input type="radio" name="fruit" value="banana"></label></li> </ul> </form>...
... </section> if the descriptive text does appear in the ui, you can link the description to the widget using aria-describedby, like so: <p id="fruit-desc">choose your favourite fruit — the fruit with the
highest number of votes will be added to the lunch options next week.</p> <section aria-describedby="fruit-desc"> <form> <ul> <li><label>apple: <input type="radio" name="fruit" value="apple"></label></li> <li><label>orange: <input type="radio" name="fruit" value="orange"></label></li> <li><label>banana: <input type="radio" name="fruit" value="banana"></label></li> </ul> </form> </section> insertions and deletions a common wish in online document systems like google docs is to be able to track changes, to see what reviewers or editors have suggested as change...
Web Accessibility: Understanding Colors and Luminance - Accessibility
for example, if you have blue text within a gray "
highlighted" area, your eyes will perceive that same blue text with a gray
highlight differently if it is in a black div, or a white one.
...and also, "..the loss of saturation at
high luminances--the colors converge on white." the special case of "red" not all colors ("hue") are processed the same way by our brains.
...gregg vanderheiden, when testing the photosensitive epilepsy analysis tool, noted seizure rates were much
higher than expected.
::placeholder - CSS: Cascading Style Sheets
it is important to ensure that the contrast ratio between the color of the placeholder text and the background of the input is
high enough that people experiencing low vision conditions will be able to read it while also making sure there is enough of a difference between the placeholder text and input text color that users do not mistake the placeholder for inputed data.
... <label for="user-email">your email address</label> <span id="user-email-hint" class="input-hint">example: jane@sample.com</span> <input id="user-email" aria-describedby="user-email-hint" name="email" type="email"> placeholders in form fields are harmful — nielsen norman group windows
high contrast mode placeholder text will appear with the same styling as user-entered text content when rendered in windows
high contrast mode.
... greg whitworth — how to use -ms-
high-contrast labels placeholders are not a replacement for the <label> element.
::selection - CSS: Cascading Style Sheets
the ::selection css pseudo-element applies styles to the part of a document that has been
highlighted by the user (such as clicking and dragging the mouse across text).
... syntax /* legacy firefox syntax (version 61 and below) */ ::-moz-selection ::selection examples html this text has special styles when you
highlight it.
... if overridden, it is important to ensure that the contrast ratio between the text and background colors of the selection is
high enough that people experiencing low vision conditions can read it.
prefers-contrast - CSS: Cascading Style Sheets
the prefers-contrast css media feature is used to detect if the user has requested that the web content is presented with a
higher (or lower) contrast.
... more indicates that user has notified the system that they prefer an interface that has a
higher level of contrast.
... html <div class="contrast">low contrast box</div> css .contrast { width: 100px; height: 100px; outline: 2px dashed black; } @media (prefers-contrast:
high) { .contrast { outline: 2px solid black; } } result specifications specification status comment media queries level 5the definition of 'prefers-contrast' in that specification.
Ordering Flex Items - CSS: Cascading Style Sheets
in the live example below i have added a focus style in order that as you tab from link to link you can see which is
highlighted.
... order also changes the paint order of the items; items with a lower value for order will be painted first and those with a
higher value for order painted afterwards.
...the heading of the news item is the key thing to
highlight and would be the element that a user might jump to if they were tabbing between headings to find content they wanted to read.
image-rendering - CSS: Cascading Style Sheets
since version 1.9 (firefox 3.0), gecko uses bilinear resampling (
high quality).
...
high-quality identical to smooth, but with a preference for
higher-quality scaling.
... if system resources are constrained, images with
high-quality should be prioritized over those with any other value, when considering which images to degrade the quality of and to what degree.
image-set() - CSS: Cascading Style Sheets
the image-set() css function notation is a method of letting the browser pick the most appropriate css image from a given set, primarily for
high pixel density screens.
...resolution can be used as a proxy for filesize — a user agent on a slow mobile connection with a
high-resolution screen may prefer to receive lower-resolution images rather than waiting for a
higher resolution image to load.
... examples background-image: image-set( "cat.png" 1x, "cat-2x.png" 2x, "cat-print.png" 600dpi); this example shows how to use image-set() to provide two alternative background-image options, chosen depending on the resolution needed: a normal version and a
high-resolution version.
<length> - CSS: Cascading Style Sheets
the anchor is done differently for low-resolution devices, such as screens, versus
high-resolution devices, such as printers.
... for
high-dpi devices, inches (in), centimeters (cm), and millimeters (mm) are the same as their physical counterparts.
...however, for printers and
high-resolution screens, one css pixel implies multiple device pixels.
Event reference
upgradeneeded indexeddb an attempt was made to open a database with a version number
higher than its current version.
... dommenuitemactive xul a menu or menuitem has been hovered or
highlighted.
... dommenuiteminactive xul a menu or menuitem is no longer hovered or
highlighted.
Applying color to HTML elements using CSS - HTML: Hypertext Markup Language
webgl the web graphics library is an opengl es-based api for drawing
high-performance 2d and 3d graphics on the web.
...that would be used as the accent color, to be used sparingly to make things stand out, such as in headlines or in the
highlighting of tabs or other indicators on the site: now we have our base color and our accent.
...if the contrast is too low, your text will tend to be washed out by the background, leaving it unreadable, but if your contrast is too
high, the user may find your site garish and unpleasant to look at.
<img>: The Image Embed element - HTML: Hypertext Markup Language
high: the image is of
high priority.
...for example, (max-height: 500px) 1000px proposes to use a source of 1000px width, if the viewport is not
higher than 500px.
... <a href="https://developer.mozilla.org"> <img src="https://udn.realityripple.com/samples/6c/98485e5d8a.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.
<input type="date"> - HTML: Hypertext Markup Language
for example, try viewing the following in a unsupporting browser: <form> <label for="bday">enter your birthday: <input type="date" name="bday" required pattern="\d{4}-\d{2}-\d{2}"> <span class="validity"></span> </label> <p> <button>submit</button> </p> </form> if you submit it, you'll see that the browser displays an error and
highlights the input as invalid if your entry doesn't match the pattern ####-##-## (where # is a digit from 0 to 9).
...ct> for(i = 1; i <= daynum; i++) { var option = document.createelement('option'); option.textcontent = i; dayselect.appendchild(option); } // if previous day has already been set, set dayselect's value // to that day, to avoid the day jumping back to 1 when you // change the year if(previousday) { dayselect.value = previousday; // if the previous day was set to a
high number, say 31, and then // you chose a month with less total days in it (e.g.
... february), // this part of the code ensures that the
highest day available // is selected, rather than showing a blank dayselect if(dayselect.value === "") { dayselect.value = previousday - 1; } if(dayselect.value === "") { dayselect.value = previousday - 2; } if(dayselect.value === "") { dayselect.value = previousday - 3; } } } function populateyears() { // get this year as a number var date = new date(); var year = date.getfullyear(); // make this year, and the 100 years before it available in the year <select> for(var i = 0; i <= 100; i++) { var option = document.createelement('option'); option.textcontent = year-i; yearselect.appendchild(option); } } // when the month or year <select> values are changed, reru...
<input type="datetime-local"> - HTML: Hypertext Markup Language
min="2017-06-01t08:30" max="2017-06-30t16:30" pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}t[0-9]{2}:[0-9]{2}" required> <span class="validity"></span> </div> <div> <input type="submit" value="book party!"> </div> <input type="hidden" id="timezone" name="timezone" value="-08:00"> </form> if you try submitting it, you'll see that the browser now displays an error message (and
highlights the input as invalid) if your entry doesn't match the pattern nnnn-nn-nntnn:nn, where n is a number from 0 to 9.
...ct> for(i = 1; i <= daynum; i++) { var option = document.createelement('option'); option.textcontent = i; dayselect.appendchild(option); } // if previous day has already been set, set dayselect's value // to that day, to avoid the day jumping back to 1 when you // change the year if(previousday) { dayselect.value = previousday; // if the previous day was set to a
high number, say 31, and then // you chose a month with less total days in it (e.g.
... february), // this part of the code ensures that the
highest day available // is selected, rather than showing a blank dayselect if(dayselect.value === "") { dayselect.value = previousday - 1; } if(dayselect.value === "") { dayselect.value = previousday - 2; } if(dayselect.value === "") { dayselect.value = previousday - 3; } } } function populateyears() { // get this year as a number var date = new date(); var year = date.getfullyear(); // make this year, and the 100 years before it available in the year <select> for(var i = 0; i <= 100; i++) { var option = document.createelement('option'); option.textcontent = year-i; yearselect.appendchild(option); } } function populatehours() { // populate the hours <select>...
<keygen> - HTML: Hypertext Markup Language
currently, the user is given a choice between "
high" strength (2048 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 "secp384r1" for
high, and the curve named "secp256r1" for medium keys.
...currently, two strengths are offered,
high and medium.
<link>: The External Resource Link element - HTML: Hypertext Markup Language
high: indicates to the browser that the resource is of
high priority.
... <!-- third-generation ipad with
high-resolution retina display: --> <link rel="apple-touch-icon-precomposed" sizes="144x144" href="favicon144.png"> <!-- iphone with
high-resolution retina display: --> <link rel="apple-touch-icon-precomposed" sizes="114x114" href="favicon114.png"> <!-- first- and second-generation ipad: --> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="favicon72.png"> <!-- non-retina iphone, ipod touch...
...for example: <link href="print.css" rel="stylesheet" media="print"> <link href="mobile.css" rel="stylesheet" media="all"> <link href="desktop.css" rel="stylesheet" media="screen and (min-width: 600px)"> <link href="
highres.css" rel="stylesheet" media="screen and (min-resolution: 300dpi)"> stylesheet load events you can determine when a style sheet has been loaded by watching for a load event to fire on it; similarly, you can detect if an error has occurred while processing a style sheet by watching for an error event: <script> var mystylesheet = document.queryselector('#my-stylesheet'); mystylesheet.onload ...
Details of the object model - JavaScript
examples) class employee { constructor() { this.name = ''; this.dept = 'general'; } } javascript ** (use this instead) function employee() { this.name = ''; this.dept = 'general'; } java public class employee { public string name = ""; public string dept = "general"; } the manager and workerbee definitions show the difference in how to specify the next object
higher in the inheritance chain.
...similarly, although the terms parent, child, ancestor, and descendant do not have formal meanings in javascript; you can use them informally to refer to objects
higher or lower in the prototype chain.
...you can have the constructor add more properties by directly calling the constructor function for an object
higher in the prototype chain.
String.prototype.charCodeAt() - JavaScript
this is because the
higher code points are represented by a pair of (lower valued) "surrogate" pseudo-characters which are used to comprise the real character.
...fixedcharcodeat('\ud800\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 (0xd800 <= 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 - 0xd800) * 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); // low = code; // return ((hi - 0xd800) * 0x400) + // (low - 0xdc00) + 0x10000; } return code; } fixing charcodeat() to handle non-basic-multilingual-plane characters if their presence earlier in the string is known function knowncharcodeat(str, idx) { str += ''; var code, end = str.length; var surrogatepairs = /[\ud800-\udbff][\udc00-\udfff]/g; while ((surrogatepairs.exec(str)) != null) { var li = surrogatepairs.lastindex; if (li - 2 < idx) { idx++; } else { bre...
Mobile first - Progressive web apps (PWAs)
in our planning your app article, we provided a
high level look into the kinds of planning and functionality decisions you should make before you start coding an app, including some ideas for desktop and mobile design.
... if you are using mechanisms like feature detection and matchmedia to conditionally load scripting functionality depending on viewport size, feature support, etc., you should just load the very basics that pretty much all browsers will need first, then progressively enhance browsers
higher up the food chain.
... selectively include javascript libraries according to media query and feature tests (require.js is built in, which is helpful and very easy to use.) html structure for this example app, the html structure is going to be very simple: i am just including a heading, navigation menu and filler text to
highlight the fact that articles can get very long on narrow screen devices.
d - SVG: Scalable Vector Graphics
/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 command control points (the first one is implicit) ...
...formulae: po′ = pn = {xo + dx, yo + dy} examples html,body,svg { height:100% } <svg viewbox="0 0 200 100" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <!-- quadratic bézier curve with implicit repetition --> <path fill="none" stroke="red" d="m 10,50 q 25,25 40,50 t 30,0 30,0 30,0 30,0 30,0" /> <!--
highlight the curve vertex and control points --> <g> <polyline points="10,50 25,25 40,50" stroke="rgba(0,0,0,.2)" fill="none" /> <circle cx="25" cy="25" r="1.5" /> <!-- curve vertex 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="...
...it is sometimes easier to draw
highly regular curves with an elliptical arc than with a bézier curve.
WebAssembly Concepts - WebAssembly
instead, it is designed to complement and work alongside javascript, allowing web developers to take advantage of both languages' strong points: javascript is a
high-level language, flexible and expressive enough to write web applications.
...(note that webassembly has the
high-level goal of supporting languages with garbage-collected memory models in the future.) with the advent of webassembly appearing in browsers, the virtual machine that we talked about earlier will now load and run two types of code — javascript and webassembly.
... since javascript has complete control over how webassembly code is downloaded, compiled and run, javascript developers could even think of webassembly as just a javascript feature for efficiently generating
high-performance functions.
Understanding WebAssembly text format - WebAssembly
you could also declare the call_indirect parameter explicitly during the command call instead of before it, like this: (call_indirect (type $return_i32) (local.get $i)) in a
higher level, more expressive language like javascript, you could imagine doing the same thing with an array (or probably more likely, object) containing functions.
... atomic memory accesses a number of new wasm instructions have been added that can be used to implement
higher level features like mutexes, condition variables, etc.
... summary this finishes our
high-level tour of the major components of the webassembly text format and how they get reflected in the webassembly js api.
Content Scripts - Archive of obsolete content
there are five basic principles: the add-on's main code, including "main.js" and other modules in "lib", can use the sdk
high-level and low-level apis, but can't access web content directly content scripts can't use the sdk's apis (no access to globals exports, require) but can access web content sdk apis that use content scripts, like page-mod and tabs, provide functions that enable the add-on's main code to load content scripts into web pages content scripts can be loaded in as strings, but are more often stored as...
...the content script simply replaces the content of the page: // main.js var tabs = require("sdk/tabs"); var contentscriptstring = 'document.body.innerhtml = "<h1>this page has been eaten</h1>";' tabs.activetab.attach({ contentscript: contentscriptstring }); the following
high-level sdk modules can use content scripts to modify web pages: page-mod: enables you to attach content scripts to web pages that match a specific url pattern.
Module structure of the SDK - Archive of obsolete content
sdk modules the modules supplied by the sdk are divided into two sorts:
high-level modules like panel and page-mod provide relatively simple, stable apis for the most common add-on development tasks.
...for
high-level modules this is just sdk/<module_name>, and for low-level modules it is sdk/<path_to_module>/<module_name>: // load the
high-level "tabs" module var tabs = require("sdk/tabs"); // load the low-level "uuid" module var uuid = require('sdk/util/uuid'); the path to specify for a low-level module is given along with the module name itself in the title of the module's documentation page (for example, system/environment).
windows - Archive of obsolete content
here's an example converting from a
high-level browserwindow to a chrome window, and then back the other way: var { modelfor } = require("sdk/model/core"); var { viewfor } = require("sdk/view/core"); var browserwindows = require("sdk/windows").browserwindows; function converttochromeandback(browserwindow) { // get the chrome window for this browserwindow var chromewindow = viewfor(browserwindow); // now we can use the chrome wi...
...ndow api console.log(chromewindow.document.location.href); // -> "chrome://browser/content/browser.xul" // convert back to the
high-level window var
highlevelwindow = modelfor(chromewindow); // now we can use the sdk's
high-level window api console.log(
highlevelwindow.title); } browserwindows.on("open", converttochromeandback); note that directly accessing low-level chrome objects like this means you're no longer protected by the compatibility guarantees made by the sdk's
high-level apis.
Low-Level APIs - Archive of obsolete content
building blocks for
higher level modules, such as events and worker.
...in many cases these modules have simpler, more restricted analogs among the "
high-level apis" (for example, windows or request).
cfx - Archive of obsolete content
from firefox 21 onwards, sdk add-ons built with sdk 1.14 or
higher will use the sdk modules that are built into firefox, even if the add-on includes its own copies of the sdk modules.
...from firefox 21 onwards, sdk add-ons built with sdk 1.14 or
higher will use the sdk modules that are built into firefox, even if the add-on includes its own copies of the sdk modules.
Overview - Archive of obsolete content
it identifies page elements which are eligible for annotation,
highlights them on mouseover, and tells the main add-on code when the user clicks a
highlighted element.
...it
highlights any annotated elements that are found.
Annotator - Archive of obsolete content
in this tutorial we'll build an add-on that uses many of the sdk's
high-level apis.
...whenever the user loads a page containing annotated elements these elements are
highlighted, and if the user moves the mouse over an annotated element its annotation is displayed.
Developing for Firefox Mobile - Archive of obsolete content
enable usb debugging on the device (step 2 of this link only) on the development machine: install version 1.5 or
higher of the add-on sdk install the correct version of the android sdk for your device using the android sdk, install the android platform tools next, attach the device to the development machine via usb.
...
high-level apis addon-page not supported base64 supported clipboard not supported context-menu not supported hotkeys supported indexed-db supported l10n supported notifications supported page-mod supported page-worker supported panel not supported passwords s...
StringView - Archive of obsolete content
the aims of this library are: to create a c-like interface for strings (i.e., an array of character codes — an arraybufferview in javascript) based upon the javascript arraybuffer interface to create a
highly extensible library that anyone can extend by adding methods to the object stringview.prototype to create a collection of methods for such string-like objects (since now: stringviews) which work strictly on arrays of numbers rather than on creating new immutable javascript strings to work with unicode encodings other than javascript's default utf-16 domstrings introduction as web applications become more and more powerful, adding features such as audio and video manipulation, access to raw data using websockets, and so forth, it has become clear that there are times when...
... stringview is a
highly extensible library, that anyone can extend by adding methods to the object stringview.prototype.
Chapter 5: Let's build a Firefox extension - Archive of obsolete content
the text output being sent to the console does not suspend any other processes, and this is most useful when there’s a
high volume of messages being output.
...it’s ok to have a low compression ratio when you are creating the jar file, and a
high compression ratio when creating the xpi file.
Introduction - Archive of obsolete content
xul school was created by appcoast (formerly glaxstar), one of the few companies dedicated to building
high-quality firefox extensions.
...the user agent string for firefox at the time of this writing (in us english, mac os x) is: mozilla/5.0 (macintosh; intel mac os x 10.9; rv:25.0.1) gecko/20100101 firefox/25.0.1 the
highlighted section is the gecko version: 25.0.1.
User Notifications and Alerts - Archive of obsolete content
nb.appendnotification( message, "xulschoolhello-friend-notification", "chrome://xulschoolhello/skin/friend-notification.png", nb.priority_info_
high, [ acceptbutton, declinebutton ]); all browser tabs have a notification box by default, so you don't need to do any overlaying.
...you should look for the level that better fits your message, and use the lowest applicable level, to prevent the user from getting used to dismissing
high-level notifications.
Index of archived content - Archive of obsolete content
firefox compatibility module structure of the sdk porting the library detector program id sdk api lifecycle sdk and xul comparison testing the add-on sdk two types of scripts working with events xul migration guide
high-level apis addon-page base64 clipboard context-menu hotkeys indexed-db l10n notifications page-mod page-worker panel passwords private-browsing querystring request ...
... textual data remote xul remote debugging rsyncing the cvs repository running windows debug builds downloaded from tinderbox sxsw 2007 presentations safe browsing safe browsing: design documentation safely loading uris same origin policy for xbl space manager detailed design space manager
high level design standalone xpcom standard makefile header static analysis for windows code under linux stress testing string quick reference string rosetta stone structure of an installable bundle supporting per-window private browsing supporting private browsing mode table cellmap table cel...
MMgc - Archive of obsolete content
drc is a scheme for getting more immediate reclamation of objects, while still achieving
high performance and getting the other benefits of garbage collection.
...even with an incremental collector that doesn't have big pauses, a gc sweep only kicks in every so often, so memory usage can grow very quickly to a
high peak before the gc collects unused objects.
JavaScript Client API - Archive of obsolete content
in this case, it is
highly recommended to use the utils.makeguid() helper to generate new guids: let newguid = utils.makeguid(); your store object must implement the following methods: itemexists(id) createrecord(id, collection) changeitemid(oldid, newid) getallids() wipe() create(record) update(record) remove(record) you may also find it useful to override other methods of the base implementation, for exa...
...the
higher you set this number, the more urgently the scheduler treats your request.
jspage - Archive of obsolete content
se:function(){new cookie(this.key,$merge(this.options,{duration:-1})).write("");return this;}});cookie.write=function(b,c,a){return new cookie(b,a).write(c); };cookie.read=function(a){return new cookie(a).read();};cookie.dispose=function(b,a){return new cookie(b,a).dispose();};var swiff=new class({implements:[options],options:{id:null,height:1,width:1,container:null,properties:{},params:{quality:"
high",allowscriptaccess:"always",wmode:"transparent",swliveconnect:true},callbacks:{},vars:{}},toelement:function(){return this.object; },initialize:function(l,m){this.instance="swiff_"+$time();this.setoptions(m);m=this.options;var b=this.id=m.id||this.instance;var a=document.id(m.container); swiff.callbacks[this.instance]={};var e=m.params,g=m.vars,f=m.callbacks;var h=$extend({height:m.height,width:m...
...ction(c){var e=this.get("tween"),d="opacity",a; c=$pick(c,"toggle");switch(c){case"in":e.start(d,1);break;case"out":e.start(d,0);break;case"show":e.set(d,1);break;case"hide":e.set(d,0);break;case"toggle":var b=this.retrieve("fade:flag",this.get("opacity")==1); e.start(d,(b)?0:1);this.store("fade:flag",!b);a=true;break;default:e.start(d,arguments);}if(!a){this.eliminate("fade:flag");}return this;},
highlight:function(c,a){if(!a){a=this.retrieve("
highlight:original",this.getstyle("background-color")); a=(a=="transparent")?"#fff":a;}var b=this.get("tween");b.start("background-color",c||"#ffff88",a).chain(function(){this.setstyle("background-color",this.retrieve("
highlight:original")); b.callchain();}.bind(this));return this;}});fx.morph=new class({extends:fx.css,initialize:function(b,a){this.eleme...
LIR - Archive of obsolete content
105 cmovi integer conditional move int 106 cmovq quad 64 bit conditional move quad 107 cmovd double conditional move double conversions 108 i2q quad 64 bit sign-extend int to quad 109 ui2uq quad 64 bit zero-extend unsigned int to unsigned quad 110 q2i integer 64 bit truncate quad to int (removes the
high 32 bits) 111 i2d double convert int to double 112 ui2d double convert unsigned int to double 113 d2i integer convert double to int (no exceptions raised) 114 dasq quad 64 bit interpret the bits of a double as a quad 115 qasd double 64 bit interpret the bits of a quad as a double overflow arithmetic 116 addxovi integer ...
...ger subtract int and branch on overflow 121 muljovi integer multiply int and branch on overflow 122 addjovq quad 64 bit add quad and branch on overflow 123 subjovq quad 64 bit subtract quad and branch on overflow softfloat 124 dlo2i integer softfloat get the low 32 bits of a double as an int 125 dhi2i integer softfloat get the
high 32 bits of a double as an int 126 ii2d double softfloat join two ints (1st arg is low bits, 2nd is
high) 127 hcalli integer lir_hcalli is a hack that's only used on 32-bit platforms that use softfloat.
Scripting - Archive of obsolete content
it means that the script has a
higher level of privilege than scripts in the web content and has access to the file system, clipboard and other parts of the native os.
...we are looking into the security aspects of the
higher privilege level.
Tamarin build documentation - Archive of obsolete content
what we want is to have the indexer track the currently selected build config (so the correct conditional compiles are
highlighted in the editor).
... are included for macos with the gcc 4.0 toolchain: mac-32-release mac-64-release mac-32-debug mac-64-debug mac-32-release-debugger mac-64-release-debugger mac-32-debug-debugger mac-64-debug-debugger the build location will be project_root/build_name/avm note: as discussed above, the c++ indexer has been setup to track the current build config, so the correct conditional compiles are
highlighted in the editor run/debug from eclipse for test purposes, a launch config (running the helloworld test from esc) has been included for each of the build configs.
Learn XPI Installer Scripting by Example - Archive of obsolete content
a xpi is a pkzip-compressed archive (like zip and jar files) with a special script at the
highest level that manages the installation.
... first, a quick scan of the contents of the xpi file (which you can open using with any unzip utility) reveals the following
high-level directory structure: install.js bin\ chrome\ components defaults\ icons\ plugins\ res\ note that this
high-level structure parallels the directory structure of the installed browser very closely: as you will see in the installation script, the contents of the archive are installed onto the file system in much the same way that they are stored in the archive itself, though it's possible to rearrange things arbitrarily upon installation--to create new directories, to install files in system folders and other areas.
A XUL Bestiary - Archive of obsolete content
at the
highest level in the tree of nodes that is the dom sits the window object itself.
...if no one at a particular level in the hierarchy is interested in the event, then the event bubbles up to the next
highest level on out to the top of the hierarchy.
OpenClose - Archive of obsolete content
what it does do is affect how the focus and
highlighting of the menu is handled.
...try opening a submenu of a bookmark (a bookmark folder) and note how the
highlighting still changes as the mouse is moved over other menus, and the submenu is closed when the mouse is moved away.
selstyle - Archive of obsolete content
« xul reference selstyle type: string if set to the value primary, only the label of the primary column will be
highlighted when an item in the tree is selected.
... otherwise, the entire row will be
highlighted.
The Joy of XUL - Archive of obsolete content
easy customization, localization, or branding another
highly practical benefit of the separation that xul provides among application logic, presentation, and language text is the ease of customizing for different customers or groups of users.
... overlays are a powerful mechanism for customizing and extending existing applications because they work in two related but
highly different ways.
Adding Event Handlers - Archive of obsolete content
due to the way a single event is passed to all the ancestors, you may attach a listener to a specific element or to an element
higher in the hierarchy.
... naturally, an event attached to an element
higher up will receive notification of all elements inside it, whereas an event attached to a button will only receive events pertaining to that button.
Box Objects - Archive of obsolete content
elements with a lower ordinal value are placed in the box before elements with a
higher ordinal value.
... for example, if one element has an ordinal of 2, it would be placed before an element with ordinal 3 or
higher but after one with ordinal 1.
More Event Handlers - Archive of obsolete content
you could use this to
highlight the element, however css provides a way to do this automatically so you shouldn't do it with an event.
...you might then un
highlight the element or remove status text.
Numeric Controls - Archive of obsolete content
the default arrangement of a scale is horizontal with lower values to the left and
higher values to the right.
...<scale orient="vertical" dir="reverse"/> this scale will be shown vertical with lower values at the bottom and
higher values at the top.
Tree View Details - Archive of obsolete content
the view will need to return 0 for the outermost rows and
higher values for inner rows.
...all those that have a
higher level will need to be removed, but a row at the same level will be the next container which should not be removed.
listbox - Archive of obsolete content
(default in tree.) for trees, you can also use the following values: cell individual cells can be selected text rows are selected; however, the selection
highlight appears only over the text of the primary column.
...elements with a
higher tabindex are later in the tab sequence.
notificationbox - Archive of obsolete content
if another notification is already present with a
higher priority, the new notification will be added behind it.
... priority levels (defined as properties of notificationbox) : priority_info_low priority_info_medium priority_info_
high priority_warning_low priority_warning_medium priority_warning_
high priority_critical_low priority_critical_medium priority_critical_
high priority_critical_block buttons : the buttons argument is an array of button descriptions.
richlistbox - Archive of obsolete content
(default in tree.) for trees, you can also use the following values: cell individual cells can be selected text rows are selected; however, the selection
highlight appears only over the text of the primary column.
...elements with a
higher tabindex are later in the tab sequence.
textbox - Archive of obsolete content
elements with a
higher tabindex are later in the tab sequence.
...for number boxes, the default is 0 or the minimum value returned by the min property, whichever is
higher.
Archived Mozilla and build documentation - Archive of obsolete content
see the
high level design document for an overview of the space manager, and as an introduction to the classes, structures and algorithms container in this, the detailed design document.
... space manager
high level design the space manager and associated classes and structures are used by block and line layout to manage rectangular regions that are occupied and available, for correct handling of floated elements and the elements that flow around them.
External resources for plugin creation - Archive of obsolete content
feature
highlights include thread safety checks, unicode support (with std::wstring), activex support, built-in drawing model negotiation for mac, automatic type conversion (including javascript arrays and objects), advanced security features, and more.
... it contains pretty much everything you're likely to need to create most applications, and is particularly good for creating
highly-specialised uis and for handling graphics and sound.
Adobe Flash - Archive of obsolete content
this is currently not the case, but 12 is a sufficiently
high version number (current versions are version 6r.79) to allow for some leeway for fixing this down the road.
...the following code snippet illustrates the ideas behind the use of fscommands demonstrated in example 3: <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" id="myflash" width="250" height="150" viewastext> <param name="movie" value="js2flash.swf" /> <param name="quality" value="
high"></param> <embed src="js2flash.swf" width="250" height="150" swliveconnect="true" quality="
high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" name="myflash"> </embed> </object> .....
Vulnerabilities - Archive of obsolete content
this article uses three
high-level vulnerability categories: software flaws, security configuration issues, and software feature misuse.
...some will be very easy to exploit, while others will only be exploitable under a combination of
highly unlikely conditions.
Create Your Own Firefox Background Theme - Archive of obsolete content
image requirements dimensions should be 3000px wide × 200px
high png or jpg file format image must be no larger than 300 kb in file size tips subtle, soft contrast images and gradients work best;
highly detailed images will compete with the browser ui.
... image requirements dimensions should be 3000px wide × 100px
high png or jpg file format image must be no larger than 300 kb in file size tips subtle, soft contrast images and gradients work best;
highly detailed images will compete with the browser ui.
Scratchpad - Archive of obsolete content
you'll see the autocomplete box, as shown below: the icon next to each suggestion indicates the type, and the currently
highlighted suggestion gets a popup with more information.
... ↑ and ↓ cycle through the suggestions and enter or tab select the
highlighted choice.
CSS - Archive of obsolete content
pplied to an object.-ms-flow-fromthe -ms-flow-from css property is a microsoft extension that gets or sets a value identifying a region container in the document that accepts the content flow from the data source.-ms-flow-intothe -ms-flow-into css property is a microsoft extension that gets or sets a value identifying an iframe container in the document that serves as the region's data source.-ms-
high-contrast-adjustthe -ms-
high-contrast-adjust css property is a microsoft extension that gets or sets a value indicating whether to override any css properties that would have been set in
high contrast mode.-ms-hyphenate-limit-charsthe -ms-hyphenate-limit-chars css property is a microsoft extension that specifies one to three values indicating the minimum number of characters in a hyphenated word.
...at specifies the base color of the main elements of a scroll bar.-ms-scrollbar-darkshadow-colorthe -ms-scrollbar-darkshadow-color css property is a microsoft extension that specifies the color of a scroll bar's gutter.-ms-scrollbar-face-colorthe -ms-scrollbar-face-color css property is a microsoft extension that specifies the color of the scroll box and scroll arrows of a scroll bar.-ms-scrollbar-
highlight-colorthe -ms-scrollbar-
highlight-color css property is a microsoft extension that specifies the color of the slider tray, the top and left edges of the scroll box, and the scroll arrows of a scroll bar.-ms-scrollbar-shadow-colorthe -ms-scrollbar-shadow-color css property is a microsoft extension that specifies the color of the bottom and right edges of the scroll box and scroll arrows of a s...
VBArray.ubound - Archive of obsolete content
the vbarray.ubound method returns the
highest index value used in the specified dimension of the vbarray.
... dimension optional the dimension of the vbarray for which the
higher bound index is wanted.
New in JavaScript 1.2 - Archive of obsolete content
note that netscape navigator 3.0 and earlier ignored scripts with the language attribute set to "javascript1.2" and
higher.
...it no longer converts undefined elements to null and sorts them to the
high end of the array.
Archive of obsolete content
syntax
highliting support for .htaccess files less.
... security relying on these obsolete security articles is
highly discouraged.
Building up a basic demo with A-Frame - Game development
high level overview the current version of a-frame is 0.3.2, which means it's
highly experimental, but it already works and you can test it right away in the browser.
...you should start off by: making sure you are using a modern browser with good webgl support (and webxr support if you have available vr or ar hardware) such as the latest firefox or chrome — download firefox nightly or chrome (v54 or
higher).
Building up a basic demo with PlayCanvas editor - Game development
ction: this.timer = 0; to move the cone up and down we will use the setposition() method — add the code below to the update() function: this.timer += dt; this.entity.setposition(2, math.sin(this.timer*2), 0); the position of the cone will be animated on each frame by being passed the math.sin() value of the timer at each point in time — we have doubled the this.timer value to make it move
higher.
... summary now you can check the playcanvas engine article if you haven't seen it yet, go back to the building up a basic demo with playcanvas page, or go back a level
higher to the main 3d games on the web page.
Building up a basic demo with the PlayCanvas engine - Game development
drawing everything for given shape is taken care of by the engine, so we can focus on the
high level coding.
... summary now you can continue reading the playcanvas editor article, go back to the building up a basic demo with playcanvas page, or go back a level
higher to the main 3d games on the web page.
Building up a basic demo with Three.js - Game development
let's explain values we are setting for the code above: the value we set for the field of view, 70, is something we can experiment with: the
higher the value, the greater the amount of scene the camera will show.
...detail like drawing required vertices and faces, for a given shape, is handled by the three framework, so we can focus on
higher level coding.
Crisp pixel art look with image-rendering - Game development
this article discusses a useful technique for giving your canvas/webgl games a crisp pixel art look, even on
high definition monitors.
...but since today's screens render content at
high resolutions, there is a problem with making sure the pixel art does not look blurry.
Tiles and tilemaps overview - Game development
this set of articles covers the basics of creating tile maps using javascript and canvas (although the same
high level techniques could be used in any programming language.) besides the performance gains, tilemaps can also be mapped to a logical grid, which can be used in other ways inside the game logic (for example creating a path-finding graph, or handling collisions) or to create a level editor.
...a
high-level algorithm could be: for (var column = 0; column < map.columns; column++) { for (var row = 0; row < map.rows; row++) { var tile = map.gettile(column, row); var x = column * map.tilesize; var y = row * map.tilesize; drawtile(tile, x, y); } } you can read more about this and see an example implementation in square tilemaps implementation: static maps.
Create the Canvas and draw on it - Game development
the <canvas> element has an id of mycanvas to allow us to easily grab a reference to it, and it is 480 pixels wide and 320 pixels
high.
...in our case the rectangle is painted 20 pixels from the left side of the screen and 40 pixels from the top side, and is 50 pixels wide and 50 pixels
high, which makes it a perfect square.
Move the ball - Game development
first, add the following two lines above your draw() function, to define x and y: var x = canvas.width/2; var y = canvas.height-30; next update the draw() function to use the x and y variables in the arc() method, as shown in the following
highlighted line: function draw() { ctx.beginpath(); ctx.arc(x, y, 10, 0, math.pi*2); ctx.fillstyle = "#0095dd"; ctx.fill(); ctx.closepath(); } now comes the important part: we want to add a small value to x and y after every frame has been drawn to make it appear that the ball is moving.
... add the following
highlighted new line to the draw() function: function draw() { ctx.clearrect(0, 0, canvas.width, canvas.height); ctx.beginpath(); ctx.arc(x, y, 10, 0, math.pi*2); ctx.fillstyle = "#0095dd"; ctx.fill(); ctx.closepath(); x += dx; y += dy; } save your code and try again, and this time you'll see the ball move without a trail.
Track the score and win - Game development
add the following
highlighted line to your code: function collisiondetection() { for(var c=0; c<brickcolumncount; c++) { for(var r=0; r<brickrowcount; r++) { var b = bricks[c][r]; if(b.status == 1) { if(x > b.x && x < b.x+brickwidth && y > b.y && y < b.y+brickheight) { dy = -dy; b.status = 0; score++; ...
...add the following
highlighted section into your collisiondetection() function: function collisiondetection() { for(var c=0; c<brickcolumncount; c++) { for(var r=0; r<brickrowcount; r++) { var b = bricks[c][r]; if(b.status == 1) { if(x > b.x && x < b.x+brickwidth && y > b.y && y < b.y+brickheight) { dy = -dy; b.status = 0; ...
HTML: A good basis for accessibility - Learn web development
the focused elements are given a
highlighted default style in every browser (it differs slightly between different browsers) so that you can tell what element is focused.
... this
highlights the importance of not only using meaningful file names in case so-called alt text is not available, but also making sure that alt text is provided in alt attributes wherever possible.
HTML: A good basis for accessibility - Learn web development
the focused elements are given a
highlighted default style in every browser (it differs slightly between different browsers) so that you can tell what element is focused.
... this
highlights the importance of not only using meaningful file names in case so-called alt text is not available, but also making sure that alt text is provided in alt attributes wherever possible.
CSS building blocks - Learn web development
understanding what is and isn't possible can save some frustration, and this lesson will
highlight some of the main things that you need to know.
...this article provides a guide to making html tables look good, with some specific table styling techniques
highlighted.
Positioning - Learn web development
z-index values affect where positioned elements sit on that axis; positive values move them
higher up the stack, and negative values move them lower down the stack.
...
higher values will go above lower values, and it is up to you what values you use.
Supporting older browsers - Learn web development
you should also consider the type of devices and the way people use your site, for example, you may expect a
higher than an average number of mobile devices.
...however, unless you have a very
high number of visitors in older ie versions, you may find it better to focus on creating a fallback that works for all non-supporting browsers.
CSS FAQ - Learn web development
inline style (in html style attributes) has the
highest specificity and will override any selectors, followed by id selectors, then class selectors, and eventually element selectors.
... an element with a
higher z-index/stack order is always rendered in front of an element with a lower z-index/stack order on the screen.
How much does it cost to do something on the Web? - Learn web development
on the other hand, you'll need a
high-bandwidth connection, such as dsl, cable, or fiber access, if you want a more advanced website with hundreds of files, or if you want to deliver heavy video/audio files directly from your web server.
... do you want
high-profile, ultra-responsive dedicated servers, or can you cope with a slower, shared machine?
What are browser developer tools? - Learn web development
(an added bonus: this method straight-away
highlights the code of the element you right-clicked.) the inspector: dom explorer and css editor the developer tools usually open by default to the inspector, which looks something like the following screenshot.
...in the following image, the
highlight on the number 18 shows that the line has a breakpoint set.
Advanced form styling - Learn web development
-webkit-appearance: none; appearance: none; } we can use the :checked and :disabled pseudo-classes to change the appearance of our custom checkbox as its state changes: input[type="checkbox"] { position: relative; width: 1em; height: 1em; border: 1px solid gray; /* adjusts the position of the checkboxes on the text baseline */ vertical-align: -2px; /* set here so that windows'
high-contrast mode can override */ color: green; } input[type="checkbox"]::before { content: "✔"; position: absolute; font-size: 1.2em; right: -1px; top: -0.3em; visibility: hidden; } input[type="checkbox"]:checked::before { /* use `visibility` instead of `display` to avoid recalculating layout */ visibility: visible; } input[type="checkbox"]:disabled { border-color: black; ...
... let's talk about some specifics of each of these types of control,
highlighting difficulties along the way.
HTML Cheatsheet - Learn web development
emphasize some text <em>i'm posh</em> i'm posh italic textt you can mark a phrase in the text in <i>italics</i> you can mark a phrase in the text in italics bold some text <b>bold a word or phrase</b>within the text bold a word or phrase within the text mark text as important <strong>i'm important</strong> i'm important
highlight some text <mark>notice me</mark> notice me draw a line through irrelevant text <s>i'm irrelevant</s> i'm irrelevant underline a non-textual annotation this is <u>mispelled</u> this is mispelled text displayed lower than normal text h<sub>2</sub>o h2o small text used to represent the <small>small print </small>of a document used...
... to represent the small print of a document used for an address <address>main street 67</address> main street 67 used for a textual cite <cite>lorem ipsum</cite> lorem ipsum text displayed
higher than normal text x<sup>2</sup> x2 a short inline quotation <q>the q element indicates a short inline quotation.</q> the q element indicates a short inline quotation.
Tips for authoring fast-loading HTML pages - Learn web development
this can be crucial for
high volume sites or sites which have a spike in traffic due to unusual circumstances such as breaking news stories.
...suppose your website server is located in the united states and it has a visitor from india; the page load time will be much
higher for the indian visitor compared to a visitor from the us.
Manipulating documents - Learn web development
add the following inside your html <head>: <style> .
highlight { color: white; background-color: black; padding: 10px; width: 250px; text-align: center; } </style> now we'll turn to a very useful method for general html manipulation — element.setattribute() — this takes two arguments, the attribute you want to set on the element, and the value you want to set it to.
... in this case we will set a class name of
highlight on our paragraph: para.setattribute('class', '
highlight'); refresh your page, and you'll see no change — the css is still applied to the paragraph, but this time by giving it a class that is selected by our css rule, not as inline css styles.
What is JavaScript? - Learn web development
in this article we will look at javascript from a
high level, answering questions such as "what is it?" and "what can you do with it?", and making sure you are comfortable with javascript's purpose.
... a
high-level definition javascript is a scripting or programming language that allows you to implement complex features on web pages — every time a web page does more than just sit there and display static information for you to look at — displaying timely content updates, interactive maps, animated 2d/3d graphics, scrolling video jukeboxes, etc.
JavaScript First Steps - Learn web development
in this first article we will look at javascript from a
high level, answering questions such as "what is it?", and "what is it doing?", and making sure you are comfortable with javascript's purpose.
... storing the information you need — variables after reading the last couple of articles you should now know what javascript is, what it can do for you, how you use it alongside other web technologies, and what its main features look like from a
high level.
Server-side website programming first steps - Learn web development
finally, we provide a
high-level introductory article about web server security.
...in this first article, we look at server-side programming from a
high level, answering questions such as "what is it?", "how does it differ from client-side programming?", and "why it is so useful?".
Introduction to automated testing - Learn web development
prerequisites: familiarity with the core html, css, and javascript languages; an idea of the
high level principles of cross-browser testing.
... with the in-built image editor,
highlight your screenshot before you push it to your colleagues.
Handling common JavaScript problems - Learn web development
prerequisites: familiarity with the core html, css, and javascript languages; an idea of the
high-level principles of cross browser testing.
... after the packages have finished installing, try loading up a javascript file: you'll see any issues
highlighted with green (for warnings) and red (for errors) circles next to the line numbers, and a separate panel at the bottom provides line numbers, error messages, and sometimes suggested values or other fixes.
Theme concepts
the area your header image needs to fill is a maximum of 200 pixels
high.
... if you are uploading a packaged file, the version number must be
higher than the current version number dynamic themes as an alternative to defining a static theme, you can use the theme api to control the theme used in firefox from within a browser extension.
A bird's-eye view of the Mozilla framework
tiner last updated date: 11/23/05 statement of purpose the purpose of this article is to provide a
high-level technical overview of the architecture of the extensible, object-based mozilla application framework.
... framework layers at a
high level, you can think of the mozilla framework as consisting of a suite of applications, each of which is organized into three basic layers depicted in figure 1.
How Mozilla's build system works
phases when you type mach build to build the tree, three
high-level phases occur within the build system: system detection and validation preparation of the build backend invocation of the build backend phase 1: configure phase 1 centers around the configure script.
...the role of treemetadataemitter is to convert the low-level mozbuildsandbox dictionaries into
higher-level function-specific data structures.
Firefox UI considerations for web developers
if no
high-resolution icon is found, a screenshot is taken of the site; this screenshot is then scaled and cropped to fit in the space allotted to the icon.
... rich icons the
high resolution icons—also known as rich icons—are specified by setting the rel attribute to one of: apple-touch-icon apple-touch-icon-precomposed fluid-icon the size of each icon is taken from the size attribute specified on the <link>, if it's provided.
Using the Browser API
searchform.addeventlistener('submit',function(e) { e.preventdefault(); browser.findall(searchbar.value, 'case-sensitive'); searchactive = true; prev.disabled = false; next.disabled = false; searchbar.blur(); }); with this all done, you'll see your search results are
highlighted; you can cycle through these using the htmliframeelement.findnext() method (specify forward and backward to go in either direction through the results), which is what our next two event listeners do: prev.addeventlistener('touchend',function() { browser.findnext("backward"); }); next.addeventlistener('touchend',function() { browser.findnext("forward"); }); the last event listener in...
...if searchactive is true, meaning that a search has been done, we want to disable the search as we hide the search options — we disable the buttons, make searchactive false, clear the entered search value, and run htmliframeelement.clearmatch(), which gets rid of any stored/
highlighted search results from the browser.
mozbrowserfindchange
activematchordinal a number indicating the position of the currently
highlighted search result, e.g.
... example var browser = document.queryselector("iframe"); browser.addeventlistener("mozbrowserfindchange", function(event) { console.log("currently
highlighted: " + event.details.activematchordinal + " out of " + event.details.numberofmatches); }); related events mozbrowserasyncscroll mozbrowsercontextmenu mozbrowsererror mozbrowsericonchange mozbrowserloadend mozbrowserloadstart mozbrowserlocationchange mozbrowseropenwindow mozbrowsersecuritychange mozbrowsershowmodalprompt mozbrowsertitlechange mozbrowserusernameandpasswordrequired ...
Mozilla Content Localized in Your Language
if these are not applicable styles, what are some of the corresponding ways to express, emphasis or
highlight some of the texts.
...ellipsis should only be used at
high level of ui pages, but not be on the final page (after a series of click-through) where detailed instruction is given.
Localizing with Koala
if you click on the
highlighted arrow pointing down while reading this tutorial on mdc, you will see two string that need to be translated: add "mdc search" manage search engines...
... the entity was added to the file and the english string is automatically
highlighted, so that you can translate it right away.
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.
... zip 2.3 (or
higher) mercurial 1.2 or
higher recommended.
Initial setup
we use version 2.13 and
higher for these builds.
...you can find version 3.79.1 or
higher here.
Fonts for Mozilla 2.0's MathML engine
on mac os x lion (10.7) and
higher versions, stix fonts are already installed and can be used for mathml.
...this requires gecko 15.0 (firefox 15.0 / thunderbird 15.0 / seamonkey 2.12) or
higher.
Using the viewport meta tag to control layout on mobile browsers
on
high dpi screens, pages with initial-scale=1 will effectively be zoomed by browsers.
...to get sharper images on these screens, web developers may want to design images – or whole layouts – at a
higher scale than their final size and then scale them down using css or viewport properties.
Mozilla Style System Documentation
in mozilla, nscssdeclaration objects correspond to css declaration-blocks.) due to the
high similarity of these lists between elements in the content tree, mozilla stores the output of the selector matching process in a lexicographic tree, the rule tree.
...therefore, inherited structs are cached on the style context (but only the top style contexts pointing to them actually "owns" them), but structs that are shared between rule nodes are stored only on the
highest rule node to which they apply and then retrieved from that most upper rule node every time they are needed.
perf
the -r 1 means <command> is executed once;
higher values can be used to get variations.
... wakeups perf can also be used to do
high-context profiling of wakeups.
powermetrics
powermetrics is a mac-only command-line utility that provides many
high-quality power-related measurements.
...
high frequency timers, which typically have short time-to-deadlines, can cause
high power consumption and should be avoided if possible.
Performance
profiling and performance tools profiling with the developer tools profiler the profiler built into the developer tools has a
high-level waterfall, detailed call tree, allocations and gc profiling, and flame graphs.
... perf (linux-only) perf is a powerful command-line utility that can measure many different things, including energy estimates and
high-context measurements of things such as wakeups.
browser.urlbar.formatting.enabled
the preference browser.urlbar.formatting.enabled controls whether the domain name including the top level domain is
highlighted in the address bar by coloring it black and the other parts grey.
... type:boolean default value: true exists by default: yes application support:firefox 6.0 status: active; last updated 2012-04-03 introduction: pushed to nightly on 2011-05-03 bugs: bug 451833 values true (default) the domain name including the top level domain is
highlighted in the address bar by coloring it black and the other parts grey.
Preference reference
xt.loadinbackground controls whether a search from the context menu with "search <search engine> for <selected text>" opening a new tab will give focus to it and load it in the foreground or keep focus on the current tab and open it in the background.browser.urlbar.formatting.enabledthe preference browser.urlbar.formatting.enabled controls whether the domain name including the top level domain is
highlighted in the address bar by coloring it black and the other parts grey.browser.urlbar.trimurlsthe preference browser.urlbar.trimurls controls whether the protocol http and the trailing slash behind domain name (if the open page is exactly the domain name) are hidden.dom.event.clipboardevents.enableddom.event.clipboardevents.enabled lets websites get notifications if the user copies, pastes, or c...
...h the background of a text selection in the user interface or in content will be styled.ui.textselectforegroundui.textselectforeground saves the color in which the text of a text selection in the user interface or the content will be styled.ui.tooltipdelayui.tooltipdelay stores the delay in milliseconds between the mouse stopping over an element and the appearing of its tooltip.view_source.syntax_
highlightthe preference view_source.syntax_
highlight controls whether markup in the view source view is syntax
highlighted.
PRFileDesc
syntax #include <prio.h> struct prfiledesc { priomethods *methods; prfileprivate *secret; prfiledesc *lower, *
higher; void (*dtor)(prfiledesc *fd); prdescidentity identity; }; typedef struct prfiledesc prfiledesc; parameters methods the i/o methods table.
...
higher pointer to
higher layer.
An overview of NSS Internals
a
high-level overview to the internals of network security services (nss) software developed by the mozilla.org projects traditionally used its own implementation of security protocols and cryptographic algorithms, originally called netscape security services, nowadays called network security services (nss).
...as a result, when searching for a trust path from (a) to a trusted anchor (root) certificate (z), the set of candidate issuer certificates might have different issuer names (referring to the second or
higher issuer level).
NSS_3.12_release_notes.html
ameconstraintsexten (see cert.h) cert_getclassicocspdisabledpolicy (see cert.h) cert_getclassicocspenabledhardfailurepolicy (see cert.h) cert_getclassicocspenabledsoftfailurepolicy (see cert.h) cert_getpkixverifynistrevocationpolicy (see cert.h) cert_getusepkixforvalidation (see cert.h) cert_getvaliddnspatternsfromcert (see cert.h) cert_newtempcertificate (see cert.h) cert_setocsptimeout (see cert
high/ocsp.h) cert_setusepkixforvalidation (see cert.h) cert_pkixverifycert (see cert.h) hash_gettype (see sechash.h) nss_initwithmerge (see nss.h) pk11_createmergelog (see pk11pub.h) pk11_creategenericobject (see pk11pub.h) pk11_createpbev2algorithmid (see pk11pub.h) pk11_destroymergelog (see pk11pub.h) pk11_generatekeypairwithopflags (see pk11pub.h) pk11_getpbecryptomechanism (see pk11pub.h) pk11_isr...
.../lib/jar/jarfile.c bug 351408: leaks in jar_jar_sign_archive (security/nss/lib/jar/jarjart.c) bug 351443: remove unused code from mozilla/security/nss/lib/jar bug 351510: remove use_moz_thread code from mozilla/security/lib/jar bug 118830: nss public header files should be c++ safe bug 123996: certutil -h doesn't document certutil -c -a bug 178894: quick decoder updates for lib/certdb and lib/cert
high bug 220115: ckm_invalid_mechanism should be an unsigned long constant.
NSS 3.18 release notes
notable changes in nss 3.18 the
highest tls protocol version enabled by default has been increased from tls 1.0 to tls 1.2.
... similarly, the
highest dtls protocol version enabled by default has been increased from dtls 1.0 to dtls 1.2.
NSS 3.48 release notes
because using an iteration count
higher than 1 with the legacy dbm (key3.db) storage creates files that are incompatible with previous versions of nss, applications that wish to enable it for key3.db are required to set environment variable nss_allow_legacy_dbm_iteration_count=1.
... applications may set environment variable nss_min_mp_pbe_iteration_count to request a
higher iteration count than the library's default, or nss_max_mp_pbe_iteration_count to request a lower iteration count for test environments.
nss tech note7
as a general principle, you should use the
highest layer of nss you can possibly use for what you are trying to accomplish.
...(this api pretty much consists of what was needed to implement ssl and s/mime, plus a few enhancements over the years to support jss.) when using the pk11_ interfaces, the same principal applies: use the
highest available function.
sslerr.html
peer does not support
high-grade encryption." the local system was configured to support the cipher suites permitted for domestic use.
...peer requires
high-grade encryption which is not supported." the remote system was configured to support the cipher suites permitted for domestic use.
sslfnc.html
nss 2.8 and later versions will negotiate the
highest protocol version with the peer application from among the set of protocols that are commonly enabled in both applications.
...on output, the integer will be one of these values: ssl_security_status_ off (= 0) ssl_security_status_ on_
high (= 1) ssl_security_status_on_low (= 2) cipher a pointer to a string pointer.
JSGetObjectOps
description jsobjectops is used by js_newobject's internals to discover the set of
high-level object operations to use for new objects of the given class.
...thus jsclass (which pre-dates jsobjectops in the api) provides a low-level interface to class-specific code and data, while jsobjectops allows for a
higher level of operation, which does not use the object's class except to find the class's jsobjectops struct, by calling clasp->getobjectops, and to finalize the object.
JS_SetNativeStackQuota
each kind of code may have a different stack quota, allowing embedders to keep
higher-priority machinery running in the face of scripted stack exhaustion by something else.
...if 0 is passed for a given kind of code, it defaults to the value of the next-
highest-priority kind.
Property attributes
in javascript 1.3 and
higher, as in ecmascript, attempts to set a value on a read-only property are ignored.
...in javascript 1.3 and
higher, as in ecmascript, such attempts are ignored.
WebReplayRoadmap
code path
highlighting (not yet implemented) when paused in a frame, the code path taken through the frame (the lines/expressions executed) could be
highlighted somehow, which would make it easier to see what happened in the frame.
... expensive dynamic analyses are easier to run in the cloud, allowing a
high level of parallelism without impacting users.
The Places database
this document provides a
high-level overview of the overall database design of the places system.
...the position column numbers each of the peers beneath a given parent starting with 0 and incrementing
higher with each addition.
How to build an XPCOM component in JavaScript
finally, you create an array of your components to be created: var components = [helloworld]; and replace nsgetfactory/nsgetmodule to use this array and xpcomutils: if ("generatensgetfactory" in xpcomutils) var nsgetfactory = xpcomutils.generatensgetfactory(components); // firefox 4.0 and
higher else var nsgetmodule = xpcomutils.generatensgetmodule(components); // firefox 3.x so the total simplified version of your component now looks like (of course documentation and comments aren't a bad thing, but as a template something smaller is nice to have): components.utils.import("resource://gre/modules/xpcomutils.jsm"); function helloworld() { } helloworld.prototype = { classde...
...mponents.id("{xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx}"), contractid: "@dietrich.ganx4.com/helloworld;1", queryinterface: xpcomutils.generateqi([components.interfaces.nsihelloworld]), hello: function() { return "hello world!"; } }; var components = [helloworld]; if ("generatensgetfactory" in xpcomutils) var nsgetfactory = xpcomutils.generatensgetfactory(components); // firefox 4.0 and
higher else var nsgetmodule = xpcomutils.generatensgetmodule(components); // firefox 3.x note: starting with firefox 4.0 you will need to declare your component in chrome.manifest; classdescription and contractid properties on the other hand are no longer required.
Component Internals
in order to support something like an "are you sure you want to quit" dialog, the application needs to provide a
higher-level event (e.g., startshutdown()) which allows for cancellation.
...most components and embedding applications need to link to some string class or other in order to utilize certain gecko apis, but the string code that mozilla uses is
highly complex and even more expensive than the glue code in terms of footprint (~100k).
Detailed XPCOM hashtable guide
nsdatahashtable/nsinterfacehashtable/nsclasshashtable -
high-level c++ wrappers around pldhash; simplifies the common usage pattern mapping a simple keytype to a simple datatype; client does not need to declare or manage an entry class; nsdatahashtable datatype is a scalar such as pruint32; nsinterfacehashtable datatype is an interface; nsclasshashtable datatype is a class pointer owned by the hashtable.
... nsbasehashtable and friends: nsdatahashtable, nsinterfacehashtable, and nsclasshashtable these c++ templates provide a
high-level interface for using hashtables that hides most of the complexities of pldhash.
Mozilla internal string guide
(in the future, these conversions may start asserting in debug builds that their input is in the permissible range.) if the input is actually in the latin1 range, each 16-bit code unit in narrowed to an 8-bit byte by removing the
high half.
...
high bit is not guaranteed across xpconnect boundaries.
mozIRegistry
clients requiring dynamic "binding" of clsids will be required to use some
higher-level services (tbd) to figure out the clsids they should use.
...
higher-level application components this box represents all the potential user's of the core registry/repository interfaces.
nsIAccessibleStates
state_alert_
high 0x10000000 this information is of
high priority.
... state_invalid state_alert_
high indicates a validation failure.
nsIEffectiveTLDService
cookie setting and domain
highlighting, but you should check whether it's the right answer for your application.
...a public suffix is the
highest-level domain under which individual domains may be registered; it may therefore contain one or more dots.
nsIWebPageDescriptor
constants display type constants constant value description display_as_source 0x0001 generates an optionally syntax-
highlighted (for xml/html documents) source of the original page.
...note that if the descriptor is that of the source of another page, this keeps the source view, but uses the current syntax
highlighting preference.
nsIXULWindow
on some platforms, windows with a
higher zlevel will be kept above windows with a lower zlevel.
...
highestz 9 methods addchildwindow() tell this window that it has picked up a child xul window.note that xul windows do not currently track child xul windows.
Weak reference
the new and interesting things are
highlighted.
...ns_interface_map_end // ...if you used a |ns_imple_queryinterfacen| macro, move up to the next
higher one and add a term ns_impl_queryinterfacen+1( ...,nsisupportsweakreference) // ...if you implemented |queryinterface| by hand, add a clause ns_imethodimp nsfoo::queryinterface( refnsiid aiid, void** ainstanceptr ) { // ...
Index
25 filelink providers thunderbird filelink is a thunderbird feature that makes it easy for users to upload large attachments to web-based storage services such as
hightail.
...it is
highly recommended that you use amo to distribute your extensions.
Mozilla
a bird's-eye view of the mozilla framework the purpose of this article is to provide a
high-level technical overview of the architecture of the extensible, object-based mozilla application framework.
... phishing: a short definition in 2014, the msci estimated an annual global impact of phishing, and various forms of identity theft, to be as
high as $5 billion usd.
Introduction to DOM Inspector - Firefox Developer Tools
if you're inspecting a chrome document, as you select nodes in the dom nodes viewer, the rendered versions of those nodes are
highlighted in the user interface itself.
... bugs which prevent the flasher from dom inspector apis from working correctly on certain platforms.) if you inspect the main browser window, for example, and select nodes in the dom nodes viewer (other than the elements which have no visible ui as is the case with the endless list of script elements that are loaded into browser.xul), you will see the various parts of the browser interface being
highlighted with a blinking red border.
Select an element - Firefox Developer Tools
the
highlighted element is the element that's overlaid in the page with a graphic showing the box model, and a tooltip showing its tag and size: with the context menu to open the inspector and select an element immediately, activate the context menu over the element in the page and select "inspect element": with the html pane when the inspector is open, as you move the mouse around the elements listed in the html pane, the corresponding elements are
highlighted in the page.
...after that, as you move the mouse around the page, the element under the mouse is
highlighted.
Waterfall - Firefox Developer Tools
in the screenshot below, we've zoomed in on a js function that's caused a drop in the frame rate: the intensive javascript article shows how the waterfall can
highlight responsiveness problems caused by long javascript functions, and how you can use asynchronous methods to keep the main thread responsive.
...in general, though: gc is needed when a lot of memory is being allocated non-incremental gc is usually needed when the memory allocation rate is
high enough that spidermonkey may run out of memory during incremental gc when the waterfall records a gc marker it indicates: whether the gc was incremental or not the reason the gc was performed if the gc was non-incremental, the reason it was non-incremental starting in firefox 46, if the gc event was caused by allocation pressure, a link appears, labeled "show allocation triggers".
Shader Editor - Firefox Developer Tools
if you hover over an entry in the list, the geometry drawn by that program is
highlighted in red: if you click the eyeball icon just left of the program's entry, that program is disabled.
...for example, you can modify the colors: the editor
highlights syntax errors in your code: if you hover over the cross shown next to a line containing an error, you'll see more details about the problem: ...
Tips - Firefox Developer Tools
in the rules view: click the inspector icon () next to any selector to
highlight all elements that match it.
... click the inspector icon () next to the element{} rule to lock the
highlighter on the current element.
Web Audio Editor - Firefox Developer Tools
this gives you a
high-level view of its operation, and enables you to ensure that all the nodes are connected in the way you expect.
...if, instead, you've connected a node to an audioparam in another node, then the connection is shown as a dashed line between the nodes, and is labeled with the name of the audioparam: inspecting and modifying audionodes if you click on a node, it's
highlighted and you get a node inspector on the right hand side.
BaseAudioContext.createBuffer() - Web APIs
exceptions notsupportederror one or more of the options are negative or otherwise has an invalid value (such as numberofchannels being
higher than supported, or a samplerate outside the nominal range).
...resampled audio is exactly the same — you save space, but in practice you will be unable to properly reproduce
high frequency content (treble sound).
BlobEvent.timecode - Web APIs
the timecode readonlyinline property of the blobevent interface a dom
highrestimestamp indicating the difference between the timestamp of the first chunk in data, and the timestamp of the first chunk in the first blobevent produced by this recorder.
... syntax var timecode = blobevent.timecode value a dom
highrestimestamp.
ByteLengthQueuingStrategy.ByteLengthQueuingStrategy() - Web APIs
syntax var bytelengthqueuingstrategy = new bytelengthqueuingstrategy({
highwatermark}); parameters {
highwatermark} an object containing a
highwatermark property.
... examples const queuingstrategy = new bytelengthqueuingstrategy({
highwatermark: 1 }); const readablestream = new readablestream({ start(controller) { ...
CSS Painting API - Web APIs
we create our paintworklet called 'hollow
highlights' using the registerpaint() function: registerpaint('hollow
highlights', 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 blockhei...
... <li>item 14</li> <li>item 15</li> <li>item 16</li> <li>item 17</li> <li>item 18</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> with the css paint() function: li { --boxcolor: hsla(55, 90%, 60%, 1.0); background-image: paint(hollow
highlights, stroke, 2px); } li:nth-of-type(3n) { --boxcolor: hsla(155, 90%, 60%, 1.0); background-image: paint(hollow
highlights, filled, 3px); } li:nth-of-type(3n+1) { --boxcolor: hsla(255, 90%, 60%, 1.0); background-image: paint(hollow
highlights, stroke, 1px); } we've included a custom property in the selector block defining a boxcolor.
CountQueuingStrategy.CountQueuingStrategy() - Web APIs
syntax var countqueuingstrategy = new countqueuingstrategy({
highwatermark}); parameters {
highwatermark} an object containing a
highwatermark property.
... examples const queuingstrategy = new countqueuingstrategy({
highwatermark: 1 }); const writablestream = new writablestream({ // implement the sink write(chunk) { ...
How whitespace is handled by HTML, CSS, and in the DOM - Web APIs
note: firefox devtools have supported
highlighting text nodes since version 52, making it easier to see exactly what nodes whitespace characters are contained within.
... the firefox devtools html inspector will
highlight text nodes, and also show you exactly what area the elements are taking up — useful if you are wondering what is causing the problem, and are maybe thinking you've got some extra margin in there or something!
EXT_texture_compression_bptc - Web APIs
ext.compressed_rgb_bptc_signed_float_ext compresses
high dynamic range signed floating point values.
... ext.compressed_rgb_bptc_unsigned_float_ext compresses
high dynamic range unsigned floating point values.
Gamepad.timestamp - Web APIs
the gamepad.timestamp property of the gamepad interface returns a dom
highrestimestamp representing the last time the data for this gamepad was updated.
... syntax readonly attribute dom
highrestimestamp timestamp; example var gp = navigator.getgamepads()[0]; console.log(gp.timestamp); value a dom
highrestimestamp.
Using the Gamepad API - Web APIs
each entry in the array is a floating point value in the range -1.0 - 1.0, representing the axis position from the lowest value (-1.0) to the
highest value (1.0).
... timestamp: this returns a dom
highrestimestamp representing the last time the data for this gamepad was updated, allowing developers to determine if the axes and button data have been updated from the hardware.
HTMLObjectElement.setCustomValidity - Web APIs
examples in this example, we pass the id of an input element, and set different error messages depending on whether the value is missing, too low or too
high.
... function validate(inputid) { var input = document.getelementbyid(inputid); var validitystate_object = input.validity; if (validitystate_object.valuemissing) { input.setcustomvalidity('you gotta fill this out, yo!'); input.reportvalidity(); } else if (input.rangeunderflow) { input.setcustomvalidity('we need a
higher number!'); input.reportvalidity(); } else if (input.rangeoverflow) { input.setcustomvalidity('thats too
high!'); input.reportvalidity(); } else { input.setcustomvalidity(''); input.reportvalidity(); } } it's vital to set the message to an empty string if there are no errors.
HTMLScriptElement.referrerPolicy - Web APIs
if referrerpolicy is not explicitly specified on the <script> element, it will adopt a
higher-level referrer policy, i.e.
...if a
higher-level policy is not available, the empty string is treated as being equivalent to no-referrer-when-downgrade.
IDBOpenDBRequest: blocked event - Web APIs
tore.createindex('hours', 'hours', { unique: false }); objectstore.createindex('minutes', 'minutes', { unique: false }); objectstore.createindex('day', 'day', { unique: false }); objectstore.createindex('month', 'month', { unique: false }); objectstore.createindex('year', 'year', { unique: false }); }; dbopenrequest.onsuccess = (event) => { // let's try to open the same database with a
higher revision version const req2 = indexeddb.open('todolist', 5); // in this case the onblocked handler will be executed req2.addeventlistener('blocked', () => { console.log('request was blocked'); }); }; using the onblocked property: // open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = (event) => { const db = event.targe...
...tore.createindex('hours', 'hours', { unique: false }); objectstore.createindex('minutes', 'minutes', { unique: false }); objectstore.createindex('day', 'day', { unique: false }); objectstore.createindex('month', 'month', { unique: false }); objectstore.createindex('year', 'year', { unique: false }); }; dbopenrequest.onsuccess = (event) => { // let's try to open the same database with a
higher revision version const req2 = indexeddb.open('todolist', 5); // in this case the onblocked handler will be executed req2.onblocked = () => { console.log('request was blocked'); }; }; ...
IDBOpenDBRequest - Web APIs
upgradeneeded fired when an attempt was made to open a database with a version number
higher than its current version.
... example in the following example you can see the onupgradeneeded handler being used to update the database structure if a database with a
higher version number is loaded.
IntersectionObserverEntry.time - Web APIs
the intersectionobserverentry interface's read-only time property is a dom
highrestimestamp that indicates the time at which the intersection change occurred relative to the time at which the document was created.
... syntax var time = intersectionobserverentry.time; value a dom
highrestimestamp which indicates the time at which the target element experienced the intersection change described by the intersectionobserverentry.
Using the Media Capabilities API - Web APIs
for example, you can use the api to ensure that you don't try to play
high dynamic range (hdr) content on a standard dynamic range (sdr) screen.
...they will be a useful feature of the api once available, but there is a
high probability of the display capabilities functionality changing a great deal before browser implementations arrive.
Capabilities, constraints, and settings - Web APIs
for example: let constraints = { width: 1920, height: 1080, aspectratio: 1.777777778 }; 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.
...ints of an existing mediastreamtrack on the fly, by calling the track's applyconstraints() method, passing into it an object representing the constraints you wish to apply to the track: videotrack.applyconstraints({ width: 1920, height: 1080 }); in this snippet, the video track referenced by videotrack is updated so that its resolution as closely as possible matches 1920x1080 pixels (1080p
high definition).
ParentNode.querySelectorAll() - Web APIs
examples to obtain a nodelist of all of the <p> elements in the document: var matches = document.queryselectorall("p"); this example returns a list of all <div> elements within the document with a class of either note or alert: var matches = document.queryselectorall("div.note, div.alert"); here, we get a list of <p> elements whose immediate parent element is a <div> with the class
highlighted and which are located inside a container whose id is test.
... var container = document.queryselector("#test"); var matches = container.queryselectorall("div.
highlighted > p"); this example uses an attribute selector to return a list of the <iframe> elements in the document that contain an attribute named data-src: var matches = document.queryselectorall("iframe[data-src]"); here, an attribute selector is used to return a list of the list items contained within a list whose id is userlist which have a data-active attribute whose value is 1: var container = document.queryselector("#userlist"); var matches = container.queryselectorall("li[data-active=1]"); user notes queryselectorall() behaves differently than most common javascript dom libraries, which might lead to unexpected results.
PerformanceEntry - Web APIs
performanceentry.starttime read only a dom
highrestimestamp representing the starting time for the performance metric.
... performanceentry.duration read only a dom
highrestimestamp representing the time value of the duration of the performance event.
PerformanceMark - Web APIs
entries of this type are created by calling performance.mark() to add a named dom
highrestimestamp (the mark) to the browser's performance timeline.
... performanceentry.starttime returns the dom
highrestimestamp when performance.mark() was called.
PerformanceMeasure - Web APIs
entries of this type are created by calling performance.measure() to add a named dom
highrestimestamp (the measure) between two marks to the browser's performance timeline.
... performanceentry.duration returns a dom
highrestimestamp that is the duration of the measure (typically, the measure's end mark timestamp minus its start mark timestamp).
PerformanceResourceTiming.workerStart - Web APIs
the workerstart read-only property of the performanceresourcetiming interface returns a dom
highrestimestamp immediately before dispatching the fetchevent if a service worker thread is already running, or immediately before starting the service worker thread if it is not already running.
... syntax resource.workerstart; value a dom
highrestimestamp.
Performance Timeline - Web APIs
starttime a
high resolution timestamp representing the starting time for the performance entry.
... duration a
high resolution timestamp representing the time value of the duration of the performance event.
PushSubscription.expirationTime - Web APIs
the expirationtime read-only property of the pushsubscription interface returns a dom
highrestimestamp of the subscription expiration time associated with the push subscription, if there is one, or null otherwise.
... syntax var expirationtime = pushsubscription.expirationtime value a dom
highrestimestamp.
RTCIceCandidatePairStats.priority - Web APIs
the
higher the value, the more likely the webrtc layer is to select the candidate pair when the time comes to establish (or re-establish) a connection between the two peers.
...the
higher this value, the better the webrtc layer thinks this pair of candidates is compared to the others, and the more likely a pair is to be selelcted for use.
RTCInboundRtpStreamStats.qpSum - Web APIs
in general, the
higher this number is, the more heavily compressed the video data is.
...since the value of qp is typically larger to indicate
higher compression factors, the larger this sum is, the more heavily compressed the stream generally has been.
RTCInboundRtpStreamStats.sliCount - Web APIs
in general, what's usually of interest is that the
higher this number is, the more the stream data is becoming corrupted between the sender and the receiver, requiring resends or dropping frames.
...a
high value of slicount may be an indication of an unreliable network.
RTCOutboundRtpStreamStats.qpSum - Web APIs
in general, the
higher this number is, the more heavily compressed the video data is.
...since the value of qp is typically larger to indicate
higher compression factors, the larger this sum is, the more heavily compressed the stream generally has been.
RTCOutboundRtpStreamStats.sliCount - Web APIs
an sli packet is used by a decoder to let the encoder (the sender) know that it's detected corruption of one or more consecutive macroblocks, in scan order, in the received media.in general, what's usually of interest is that the
higher this number is, the more the stream data is becoming corrupted between the sender and the receiver, causing the receiver to request retransmits or to drop frames entirely.
...a
high value of slicount may be an indication of an unreliable network.
RTCRtpContributingSource.timestamp - Web APIs
the read-only timestamp property of the rtcrtpcontributingsource interface returns a dom
highrestimestamp indicating the most recent time of playout of an rtp packet from the source.
... syntax var dom
highrestimestamp = rtcrtpcontributingsource.timestamp value a dom
highrestimestamp which indicates the time at which the most recent rtp packet from the corresponding source was played out.
RTCRtpStreamStats.qpSum - Web APIs
in general, the
higher this number is, the more heavily compressed the video data is.
...since the value of qp is typically larger to indicate
higher compression factors, the larger this sum is, the more heavily compressed the stream generally has been.
RTCStats.timestamp - Web APIs
the timestamp property of the rtcstats dictionary is a dom
highrestimestamp object specifying the time at which the data in the object was sampled.
... syntax var timestamp = rtcstats.timestamp; value a dom
highrestimestamp value indicating the time at which the activity described by the statistics in this object was recorded, in milliseconds elapsed since the beginning of january 1, 1970, utc.
Range.getBoundingClientRect() - Web APIs
syntax boundingrect = range.getboundingclientrect() example html <div id="
highlight"></div> <p>this example positions a "
highlight" rectangle behind the contents of a range.
...the bounding client rectangle contains everything selected in the range.</p> css #
highlight { background: yellow; position: absolute; z-index: -1; } p { width: 200px; } javascript const range = document.createrange(); range.setstartbefore(document.getelementsbytagname('b').item(0), 0); range.setendafter(document.getelementsbytagname('b').item(1), 0); const clientrect = range.getboundingclientrect(); const
highlight = document.getelementbyid('
highlight');
highlight.style.left = `${clientrect.x}px`;
highlight.style.top = `${clientrect.y}px`;
highlight.style.width = `${clientrect.width}px`;
highlight.style.height = `${clientrect.height}px`; result specification specification status ...
Using readable streams - Web APIs
note: this article assumes that you understand the use cases of readable streams, and are aware of the
high-level concepts.
... the generic syntax skeleton looks like this: const stream = new readablestream({ start(controller) { }, pull(controller) { }, cancel() { }, type, autoallocatechunksize }, {
highwatermark, size() }); the constructor takes two objects as parameters.
Using Touch Events - Web APIs
add the touch point handlers to the specific target element (rather than the entire document or nodes
higher up in the document tree).
... the implementation status of pointer events in browsers is relatively
high with chrome, firefox, ie11 and edge having complete implementations.
WebGL: 2D and 3D graphics for the web - Web APIs
webgl (web graphics library) is a javascript api for rendering
high-performance interactive 3d and 2d graphics within any compatible web browser without the use of plug-ins.
... libraries glmatrix is a javascript matrix and vector library for
high-performance webgl apps.
Fundamentals of WebXR - Web APIs
the most obvious difference, at the
highest level, is that webxr supports not just virtual reality applications, but also augmented reality, which blends virtual objects with the user's true physical environment.
...
higher-powered solutions typically offload application execution and graphics processing to an external device such as a desktop computer, and are either tethered to the computer using a cable or use a wireless network to receive the imagery to display to the user.
Geometry and reference spaces in WebXR - Web APIs
const radians_per_degree = math.pi / 180.0; let degreestoradians = (deg) => deg * radians_per_degree; let radianstodegrees = (rad) => rad / radians_per_degree; times and durations note that for security reasons, dom
highrestimestamp usually introduces a small amount of imprecision to the clock in order to prevent it from being used in fingerprinting and timing-based attacks.
... all times and durations in webxr are measured using the dom
highrestimestamp type, which is a double-precision floating-point value specifying the time in milliseconds relative to the starting time.
Lighting a WebXR setting - Web APIs
specular light specular light is the light that makes up the
highlights on reflective objects, such as gems, eyes, shiny cups and plates, and the like.
...when performing real-time rendering—as is the case with any virtual or augmented reality application—spherical harmonic lighting is used to simplify and accelerate the process of generating
highly realistic shadows and shading.
Basic concepts behind Web Audio API - Web APIs
the
higher the sample rate, the better the sound quality.
...resampled audio is exactly the same: you save space, but in practice you will be unable to properly reproduce
high frequency content, or treble sound.
Migrating from webkitAudioContext - Web APIs
old code using webkitaudiocontext can be ported to standards based audiocontext like below: // old webkitaudiocontext code: var filter = context.createbiquadfilter(); filter.type = filter.lowpass; // lowpass filter filter.type = filter.
highpass; //
highpass filter filter.type = filter.bandpass; // bandpass filter filter.type = filter.lowshelf; // lowshelf filter filter.type = filter.
highshelf; //
highshelf filter filter.type = filter.peaking; // peaking filter filter.type = filter.notch; // notch filter filter.type = filter.allpass; // allpass filter // new standard audiocontext code: var filter = context.createbiquadfil...
...ter(); filter.type = "lowpass"; // lowpass filter filter.type = "
highpass"; //
highpass filter filter.type = "bandpass"; // bandpass filter filter.type = "lowshelf"; // lowshelf filter filter.type = "
highshelf"; //
highshelf filter filter.type = "peaking"; // peaking filter filter.type = "notch"; // notch filter filter.type = "allpass"; // allpass filter pannernode.panningmodel pannernode's panningmodel property has been changed to use web idl enums.
Window.performance - Web APIs
it serves as the point of exposure for the performance timeline api, the
high resolution time api, the navigation timing api, the user timing api, and the resource timing api.
... specifications specification status comment
high resolution timethe definition of 'window.performance' in that specification.
Worklet - Web APIs
with worklets, you can run javascript and webassembly code to do graphics rendering or audio processing where
high performance is required.
... web audio render thread web audio api animationworklet for creating scroll-linked and other
high performance procedural animations.
WritableStream - Web APIs
defaultwriter.ready .then(() => { defaultwriter.close(); }) .then(() => { console.log("all chunks written"); }) .catch((err) => { console.log("stream error:", err); }); } const decoder = new textdecoder("utf-8"); const queuingstrategy = new countqueuingstrategy({
highwatermark: 1 }); let result = ""; const writablestream = new writablestream({ // implement the sink write(chunk) { return new promise((resolve, reject) => { var buffer = new arraybuffer(2); var view = new uint16array(buffer); view[0] = chunk; var decoded = decoder.decode(view, { stream: true }); var listitem = document.createelement('li'); listitem.textc...
... the
highwatermark property, which is set when creating the counting strategy (line 35), sets the maximum amount of data that the writablestream instance will handle in a single write() operation.
Web APIs
aambient light eventsbbackground tasksbattery api beaconbluetooth apibroadcast channel apiccss counter stylescss font loading api cssomcanvas apichannel messaging apiconsole apicredential management apiddomeencoding apiencrypted media extensionsffetch apifile system api frame timing apifullscreen apiggamepad api geolocation apihhtml drag and drop api
high resolution timehistory apiiimage capture apiindexeddbintersection observer apillong tasks api mmedia capabilities api media capture and streamsmedia session apimedia source extensions mediastream recordingnnavigation timingnetwork information api ppage visibility apipayment request apiperformance apiperformance timeline apipermissions apipointer eventspointer lock apiproximity events push ap...
...lipboard clipboardevent clipboarditem closeevent comment compositionevent constantsourcenode constrainboolean constraindomstring constraindouble constrainulong contentindex contentindexevent convolvernode countqueuingstrategy crashreportbody credential credentialscontainer crypto cryptokey cryptokeypair customelementregistry customevent d domconfiguration domerror domexception dom
highrestimestamp domimplementation domimplementationlist domlocator dommatrix dommatrixreadonly domobject domparser dompoint dompointinit dompointreadonly domquad domrect domrectreadonly domstring domstringlist domstringmap domtimestamp domtokenlist domuserdata datatransfer datatransferitem datatransferitemlist dedicatedworkerglobalscope delaynode deprecationreportbody devicelightevent ...
ARIA Test Cases - Accessibility
(mz) this may be the menu bar or
higher level menu item, or a control that gains focus after the menu was closed after executing a command.
...reads autocomplete suggestions through its ordinary
highlight color mechanism.
Accessibility: What users can do to browse more safely - Accessibility
one work station can be set up to acommodate both a low-vision individual (needs
high-contrast) and to accomodate an individual with photosensitive susceptibilities, by simply, adjusting personalization and accessiblity settings.
... grayscale those who have sufferred traumatic brain injury (tbi) may be
highly sensitive to color; it can require such a great "investment of cognitive energy" on their part, there's no energy for other daily tasks.
Accessibility and Spacial Patterns - Accessibility
symbols which have the same luminance as their background are perceptually less securely located in space and time than are symbols with
higher luminance contrast.
... they tend to "float" visually or be "captured" by adjacent symbols with
high luminance-contrast.
Web accessibility for seizures and physical reactions - Accessibility
a <div> element set to change color and luminosity at
high frequency, easily done via javascript, can cause real harm.
...here are some
highlights: inverted-colors according to the section, user preference media features , "the inverted-colors media feature indicates whether the content is displayed normally, or whether colors have been inverted." forced-colors in forced-colors-mode, the user agent enforces the user's preferred color palette on the page, overriding the author's chosen colors.
::-webkit-meter-even-less-good-value - CSS: Cascading Style Sheets
the ::-webkit-meter-even-less-good-value gives a red color to a <meter> element when the value and the optimum attributes fall outside the low-
high range, but in opposite zones.
... to illustrate, it applies when value < low <
high < optimum or value >
high > low > optimum.
CSS Fonts - CSS: Cascading Style Sheets
specifications specification status comment css fonts module level 4 working draft adds font-variation-settings (and related
higher-level properties) and font-optical-sizing.
... css fonts module level 3 candidate recommendation adds font-feature-settings (and related
higher-level properties) css level 2 (revision 1) recommendation css level 1 recommendation initial definition ...
Layout using named grid lines - CSS: Cascading Style Sheets
.item2 { grid-column: col-start 7 / span 3; } <div class="wrapper"> <div class="item1">i am placed from col-start line 1 to col-start 5</div> <div class="item2">i am placed from col-start line 7 spanning 3 lines</div> </div> if you take a look at this layout in the firefox grid
highlighter you can see how the column lines are shown, and how our items are placed against these lines.
... .main-header, .main-footer { grid-column: col-start / span 12; } .side1 { grid-column: col-start / span 3; grid-row: 2; } .content { grid-column: col-start 4 / span 6; grid-row: 2; } .side2 { grid-column: col-start 10 / span 3; grid-row: 2; } once again, the grid
highlighter is helpful to show us how the grid we have placed our items on works.
Basic Shapes - CSS: Cascading Style Sheets
the floated element has 20 pixels of padding, border and margin applied, and the shapes inspector
highlights these reference boxes.
...the screenshot below shows the shape
highlighted in the tool.
Microsoft CSS extensions - CSS: Cascading Style Sheets
-ms-accelerator -ms-block-progression -ms-content-zoom-chaining -ms-content-zooming -ms-content-zoom-limit -ms-content-zoom-limit-max -ms-content-zoom-limit-min -ms-content-zoom-snap -ms-content-zoom-snap-points -ms-content-zoom-snap-type -ms-filter -ms-flow-from -ms-flow-into -ms-
high-contrast-adjust -ms-hyphenate-limit-chars -ms-hyphenate-limit-lines -ms-hyphenate-limit-zone -ms-ime-align -ms-overflow-style -ms-scrollbar-3dlight-color -ms-scrollbar-arrow-color -ms-scrollbar-base-color -ms-scrollbar-darkshadow-color -ms-scrollbar-face-color -ms-scrollbar-
highlight-color -ms-scrollbar-shadow-color -ms-scrollbar-track-color -ms-scroll-chaining -ms-...
...nap-x -ms-scroll-snap-y -ms-scroll-translation -ms-text-autospace -ms-touch-select -ms-wrap-flow -ms-wrap-margin -ms-wrap-through zoom pseudo-elements ::-ms-browse ::-ms-check ::-ms-clear ::-ms-expand ::-ms-fill ::-ms-fill-lower ::-ms-fill-upper ::-ms-reveal ::-ms-thumb ::-ms-ticks-after ::-ms-ticks-before ::-ms-tooltip ::-ms-track ::-ms-value media features -ms-
high-contrast css-related dom apis mscontentzoomfactor msgetpropertyenabled msgetregioncontent msrangecollection msregionoverflow ...
WebKit CSS extensions - CSS: Cascading Style Sheets
up** -webkit-box-flex** -webkit-box-lines** -webkit-box-ordinal-group** -webkit-box-orient** -webkit-box-pack** -webkit-box-reflect** c -webkit-column-axis -webkit-column-break-after -webkit-column-break-before -webkit-column-break-inside -webkit-column-progression -webkit-cursor-visibility d-i -webkit-dashboard-region -webkit-font-size-delta -webkit-font-smoothing -webkit-
highlight -webkit-hyphenate-character -webkit-hyphenate-limit-after -webkit-hyphenate-limit-before -webkit-hyphenate-limit-lines -webkit-initial-letter l -webkit-line-align -webkit-line-box-contain -webkit-line-clamp -webkit-line-grid -webkit-line-snap -webkit-locale -webkit-logical-height -webkit-logical-width m -webkit-margin-after-collapse -webkit-margin-after -webkit-margin...
...pe -webkit-max-logical-height -webkit-max-logical-width -webkit-min-logical-height -webkit-min-logical-width n -webkit-nbsp-mode p -webkit-padding-after** -webkit-padding-before** -webkit-padding-end** -webkit-padding-start** -webkit-perspective-origin-x -webkit-perspective-origin-y -webkit-print-color-adjust r-s -webkit-rtl-ordering -webkit-svg-shadow t -webkit-tap-
highlight-color -webkit-text-combine -webkit-text-decoration-skip -webkit-text-decorations-in-effect -webkit-text-fill-color -webkit-text-security -webkit-text-stroke-color -webkit-text-stroke-width -webkit-text-stroke -webkit-text-zoom -webkit-transform-origin-x -webkit-transform-origin-y -webkit-transform-origin-z u -webkit-user-drag -webkit-user-modify * a few are on the standa...
math:max() - EXSLT
syntax math:max(nodeset) parameters nodeset the node-set whose
highest value is to be returned.
... returns a result tree fragment representing the
highest valued node's numeric value as a string.
Audio and video manipulation - Developer guides
high pass: allows frequencies above the cutoff frequency to pass through and attenuates frequencies below the cutoff.
...
high shelf: allows all frequencies through, but adds a boost (or attenuation) to the
higher frequencies.
HTML attribute: rel - HTML: Hypertext Markup Language
<!-- a persistent style sheet --> <link rel="stylesheet" href="default.css"> <!-- alternate style sheets --> <link rel="alternate stylesheet" href="
highcontrast.css" title="
high contrast"> with an hreflang attribute that differs from the document language, it indicates a translation.
... non-standard values apple-touch-icon-precomposed <!-- third-generation ipad with
high-resolution retina display: --> <link rel="apple-touch-icon-precomposed" sizes="144x144" href="favicon144.png"> <!-- iphone with
high-resolution retina display: --> <link rel="apple-touch-icon-precomposed" sizes="114x114" href="favicon114.png"> <!-- first- and second-generation ipad: --> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="favicon72.png"> <!-- non-retina iph...
<input type="tel"> - HTML: Hypertext Markup Language
this must be an integer value 0 or
higher.
...for example, let's use this html: <form> <div> <label for="telno">enter a telephone number (required): </label> <input id="telno" name="telno" type="tel" required> <span class="validity"></span> </div> <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...
<input type="time"> - HTML: Hypertext Markup Language
min the earliest time to accept as a valid input readonly a boolean attribute which, if present, indicates that the contents of the time input should not be user-editable step the stepping interval to use both for user interfaces purposes and during constraint validation unlike many data types, time values have a periodic domain, meaning that the values reach the
highest possible value, then wrap back around to the beginning again.
...(opening hours 12:00 to 18:00): </label> <input id="appt-time" type="time" name="appt-time" min="12:00" max="18:00" required pattern="[0-9]{2}:[0-9]{2}"> <span class="validity"></span> </div> <div> <input type="submit" value="submit form"> </div> </form> if you try submitting it, you'll see that non-supporting browsers now display an error message (and
highlight the input as invalid) if your entry doesn't match the pattern nn:nn, where n is a number from 0 to 9.
<picture>: The Picture element - HTML: Hypertext Markup Language
if providing
higher-density versions of an image for
high-dpi (retina) display, use srcset on the <img> element instead.
... a width descriptor, followed by a w (such as 300w); or a pixel density descriptor, followed by an x (such as 2x) to serve a
high-res image for
high-dpi screens.
<th> - HTML: Hypertext Markup Language
values
higher than 1000 will be considered as incorrect and will be set to the default value (1).
...values
higher than 65534 are clipped down to 65534.
HTML elements reference - HTML: Hypertext Markup Language
<h1> is the
highest section level and <h6> is the lowest.
... <mark> the html mark text element (<mark>) represents text which is marked or
highlighted for reference or notation purposes, due to the marked passage's relevance or importance in the enclosing context.
Inline elements - HTML: Hypertext Markup Language
first, some simple css that we'll be using: .
highlight { background-color:#ee3; } inline let's look at the following example which demonstrates an inline element: <div>the following span is an <span class="
highlight">inline element</span>; its background has been colored to display both the beginning and end of the inline element's influence.</div> in this example, the <div> block-level element contains some text.
...because the <span> element is inline, the paragraph correctly renders as a single, unbroken text flow, like this: for looks, this css (not displayed in standard reading mode) is also used: body { margin: 0; padding: 4px; border: 1px solid #333; } .
highlight { background-color:#ee3; } block-level now let's change that <span> into a block-level element, such as <p>: <div>the following paragraph is a <p class="
highlight">block-level element;</p> its background has been colored to display both the beginning and end of the block-level element's influence.</div> the css (not displayed in standard reading mode) is also used: body { margin: 0; padding: 4px; border: 1px solid #333; } .
highlight { background...
Link types - HTML: Hypertext Markup Language
<link> <a>, <area>, <form> modulepreload initiates early (and
high-priority) loading of module scripts.
... <a>, <area> <link>, <form> up indicates that the page is part of a hierarchical structure and that the hyperlink leads to the
higher level resource of that structure.
Evolution of HTTP - HTTP
http has evolved from an early protocol to exchange files in a semi-trusted laboratory environment, to the modern maze of the internet, now carrying images, videos in
high resolution and 3d.
...
high-traffic web sites showed the most rapid adoption, saving considerably on data transfer overheads and subsequent budgets.
Browser detection using the user agent - HTTP
if more people visit the webpage to see the cats, then it might be a good idea to put all the cats
higher in the source code than the dogs so that more people can find what they are looking for faster on smaller screens where the content collapses down to one column.
...(max-width: 24.99em) is simply a poor man's version of not all and (min-width: 25em): do not use (max-width: 24.99em) because the layout might break on very
high font sizes on very
high definition devices in the future.
Compression in HTTP - HTTP
if text can typically have as much as 60% redundancy, this rate can be much
higher for some other media like audio and video.
...in fact, this is often counter productive as the cost of the overhead (algorithms usually need a dictionary that add to the initial size) can be
higher than the extra gain in compression resulting in a larger file.
X-DNS-Prefetch-Control - HTTP
description dns requests are very small in terms of bandwidth, but latency can be quite
high, especially on mobile networks.
...by doing this, the
high-latency domain name resolution process doesn't cause any delay while fetching content.
HTTP Index - HTTP
http has evolved from an early protocol to exchange files in a semi-trusted laboratory environment, to the modern maze of the internet, now carrying images, videos in
high resolution and 3d.
...this could be for reasons such as
high transfer costs, slow connection speeds, etc.
Expressions and operators - JavaScript
the following table describes the precedence of operators, from
highest to lowest.
...use this either with the dot or the bracket notation: this['propertyname'] this.propertyname suppose a function called validate validates an object's value property, given the object and the
high and low values: function validate(obj, lowval, hival) { if ((obj.value < lowval) || (obj.value > hival)) console.log('invalid value!'); } you could call validate in each form element's onchange event handler, using this to pass it to the form element, as in the following example: <p>enter a number between 18 and 99:</p> <input type="text" name="age" size=3 onchange="validate(this, 18, 9...
Inheritance and the prototype chain - JavaScript
for the best learning experience, it is
highly recommended that you open a console, navigate to the "console" tab, copy-and-paste in the below javascript code, and run it by pressing the enter/return key.
...t, width) { this.height = height; this.width = width; } } class square extends polygon { constructor(sidelength) { super(sidelength, sidelength); } get area() { return this.height * this.width; } set sidelength(newlength) { this.height = newlength; this.width = newlength; } } var square = new square(2); performance the lookup time for properties that are
high up on the prototype chain can have a negative impact on the performance, and this may be significant in the code where performance is critical.
Memory Management - JavaScript
the first and last parts are explicit in low-level languages but are mostly implicit in
high-level languages like javascript.
... some
high-level languages, such as javascript, utilize a form of automatic memory management known as garbage collection (gc).
SyntaxError: illegal character - JavaScript
use an editor that supports syntax
highlighting and carefully check your code against mismatches like a minus sign ( - ) versus a dash ( – ) or simple quotes ( " ) vs non-standard quotation marks ( “ ).
... // syntaxerror: illegal character // – is not - but looks like this var foo = 'bar'; // syntaxerror: illegal character // <37e> is not ; but looks like this this should work: "this is actually a string"; 42 - 13; var foo = 'bar'; some editors and ides will notify you or at least use a slightly different
highlighting for it, but not all.
Introduction to progressive web apps - Progressive web apps (PWAs)
by implementing various technological advantages, we can make an app more progressive, thus ending up with a
higher lighthouse score.
... offering these features and making use of all the advantages offered by web applications can create a compelling,
highly flexible offering for your users and customers.
Index - XSLT: Extensible Stylesheet Language Transformations
this intelligent structuring is particularly important as more and more data transfers are automated and take place between
highly heterogeneous machines linked by a network.
...import precedence requires that template rules in main stylesheets have
higher precedence than template rules in imported stylesheets.
Transforming XML with XSLT - XSLT: Extensible Stylesheet Language Transformations
this intelligent structuring is particularly important as more and more data transfers are automated and take place between
highly heterogeneous machines linked by a network.
...because a browser provides a familiar and
highly flexible interface, it is an ideal mechanism for delivering such presentation versions of xml content.
page-mod - Archive of obsolete content
the following add-on creates a button which, when clicked,
highlights all the div elements in the document loaded into the active tab: require("sdk/ui/button/action").actionbutton({ id: "
highlight-divs", label: "
highlight divs", icon: "./icon-16.png", onclick: function() { require("sdk/tabs").activetab.attach({ contentscript: 'var divs = document.getelementsbytagname("div");' + 'for (var i = 0; i < divs.length; ++i) {' + ...
private-browsing - Archive of obsolete content
opting into private browsing add-ons built using the sdk must opt into private browsing by setting the following key in their package.json file: "permissions": {"private-browsing": true} if an add-on has not opted in, then the
high-level sdk modules will not expose private windows, or objects (such as tabs) that are associated with private windows: the windows module will not list any private browser windows, generate any events for private browser windows, or let the add-on open any private browser windows the tabs module will not list any tabs that belong to private browser windows, and the add-on won't receiv...
simple-prefs - Archive of obsolete content
{ "type": "color", "name": "
highlightcolor", "value": "#6a5acd", "title": "
highlight color" } file displayed as a "browse" button that opens a file picker and stores the full path and name of the file selected.
getAttributeNS - Archive of obsolete content
scaping) for (var j = 0; j < attrs.length; j++) { // thisitem's atts // e.g., abc:href, xlink:href while (((result = prefixatt.exec(attrs[j].nodename)) !== null) && thisitem.nodename !== '#document' && thisitem.nodename !== '#document-fragment') { var xmlnsprefix = new regexp('^xmlns:'+result[1]+'$'); // e.g., xmnls:xl, xmlns:xlink // check
higher up for xmlns:prefix // check the current node and if necessary, check for the next matching local name up in the hierarchy (until reaching the document root) while (thisitem.nodename !== '#document' && thisitem.nodename !== '#document-fragment') { attrs2 = thisitem.attributes; for (var i = 0; i < attrs2.length; i++) { // search for any prefix...
Multiple item extension packaging - Archive of obsolete content
when specifying em:targetapplication the minversion specified should be the
highest minversion and the maxversion specified should be the lowest maxversion from all of the installable bundles contained by the multiple item package for the em:targetapplication.
Adding preferences to an extension - Archive of obsolete content
space from the end of the string output = output.replace(/\w*$/, ""); // build the tooltip string var fieldarray = output.split(","); samplepanel.label = symbol + ": " + fieldarray[1]; samplepanel.tooltiptext = "chg: " + 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.
Attribute (XUL) - Archive of obsolete content
y dlgtype dragging editable editortype element empty emptytext deprecated since gecko 2 enablecolumndrag enablehistory equalsize eventnode events expr firstdayofweek firstpage first-tab fixed flags flex focused forcecomplete grippyhidden grippytooltiptext group handlectrltab height helpuri hidden hidechrome hidecolumnpicker hideheader hideseconds hidespinbuttons
highlightnonmatches homepage href icon id ignoreblurwhilesearching ignorecase ignoreincolumnpicker ignorekeys image inactivetitlebarcolor increment index inputtooltiptext insertafter insertbefore instantapply inverted iscontainer isempty key keycode keytext label lastpage lastselected last-tab left linkedpanel max maxheight maxlength maxpos maxrows maxwidth member ...
Property - Archive of obsolete content
disablekeynavigation dlgtype docshell documentcharsetinfo editable editingcolumn editingrow editingsession editor editortype emptytext deprecated since gecko 2 enablecolumndrag eventnode firstordinalcolumn firstpermanentchild flex focused focuseditem forcecomplete group handlectrlpageupdown handlectrltab hasuservalue height hidden hideseconds
highlightnonmatches homepage hour hourleadingzero id ignoreblurwhilesearching image increment inputfield inverted is24hourclock ispm issearching iswaiting itemcount label labelelement lastpermanentchild lastselected left linkedpanel listboxobject locked markupdocumentviewer max maxheight maxlength maxrows maxwidth menu menuboxobject menupo...
Multiple Rule Example - Archive of obsolete content
if you reversed the order of the two rules in the example above, three photos would still be displayed, but the larger rule that displays the image details would be dropped as the other rule has a
higher priority.
Multiple Rules - Archive of obsolete content
le, positive values with another greatermatch if a number is greater than anotherdisplay values greater than 1000 differently beforematch if a value comes before another alphabetically aftermatch if a value comes after another alphabetically startswithmatch if a value starts with a specific string endswithmatch if a value ends with a specific string containsmatch if a value contains a substringto
highlight results that contain a search term here is an example using the 'contains' operator: <vbox datasources="people.xml" ref="*" querytype="xml"> <template> <query expr="person"> <assign var="?letters" expr="string-length(@name) - 1"/> </query> <rule> <where subject="?name" rel="contains" value=" "/> <action> <label uri="?" value="?name has two names for ...
Mozilla release FAQ - Archive of obsolete content
mozilla has (at least) the following new features: xml support a
highly configurable appearance (courtesy of xul) publicly available source code :) http compression exists on more platforms mathml support (somewhat limited at the moment) a significantly faster rendering engine better html support (css 1 and partial css 2, dom 1 and partial dom 2) plug-in jvm support tabbed browsing message filtering an irc client why is the animated icon differ...
2006-10-06 - Archive of obsolete content
discussions firefox trunk and rc1 slowdown using tabs discussion regarding certain theme components (specifically alpha-transparency) creating a
high cpu load on os/2.
2006-10-06 - Archive of obsolete content
discussion
highlights: ziga sancin suggests writing an introductory article for potential developers containing basic project information (history, list of main developers, project goals, roadmap and available communication channels, etc), tools needed to start developing and building tb, documentation on source structure as well as links to help one get started on the project.
NPEvent - Archive of obsolete content
values: 0 nullevent 1 mousedown 2 mouseup 3 keydown 4 keyup 5 autokey 6 updateevt 7 diskevt 8 activateevt 15 osevt 23 k
highlevelevent getfocusevent 0, 1 (true, false) losefocusevent adjustcursorevent 0, 1 (true, false) for information about these events, see the mac os developer documentation.
NPP_URLNotify - Archive of obsolete content
npres_user_break: user canceled stream directly by clicking the stop button or indirectly by some action such as deleting the instance or initiating
higher-priority network operations.
Syndicating content with RSS - Archive of obsolete content
(other sizes and colors, along with their source files, are available too.) advanced syndication techniques although this advanced technique for syndication is not required, support of this is recommended, especially for web sites and applications with
high performance needs.
Common Firefox theme issues and solutions - Archive of obsolete content
you also need to insert the following style rules into the proper place in the browser/browser.css file in your theme theme: /*
highlighter toolbar - html tree */ #inspector-treepanel-toolbutton { list-style-image: url("chrome://browser/skin/devtools/treepanel-button.png"); -moz-margin-end: 0; -moz-image-region: rect(0px 18px 16px 0px); } /*
highlighter toolbar */ #inspector-inspect-toolbutton { list-style-image: url("chrome://browser/skin/devtools/inspect-button.png"); -moz-image-region: rect(0px 16px 16px 0px); }...
Theme changes in Firefox 2 - Archive of obsolete content
ab-button:hover #new-tab-button:hover:active #new-window-button:hover #new-window-button:hover:active #paste-button:hover #paste-button:hover:active #print-button:hover #print-button:hover:active #reload-button:hover #reload-button:hover:active #searchbar[empty="true"] .searchbar-textbox #stop-button:hover #stop-button:hover:active #urlbar-icons-spacer #urlbar-spacer #urlbar[level="
high"] #lock-icon:active #urlbar[level="
high"] #lock-icon:hover #urlbar[level="low"] #lock-icon:active #urlbar[level="low"] #lock-icon:hover .autocomplete-treebody::-moz-tree-cell(suggesthint) .autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolautocompletecomment) .autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolautocompletecomment) .bookmark-item[livemark] .openin...
-ms-scrollbar-track-color - Archive of obsolete content
div { width: 150px; height: 150px; border-style: solid; border-width: thin; overflow-y: scroll; font-family: sans-serif; float: left; margin-right: 10px; } .bluescroll { -ms-scrollbar-
highlight-color: aqua; -ms-scrollbar-face-color: blue; -ms-scrollbar-arrow-color: blue; border-color: blue; } .redscroll { -ms-scrollbar-
highlight-color: bisque; -ms-scrollbar-face-color: red; -ms-scrollbar-arrow-color: red; border-color: red; } <body> <div class="bluescroll"> lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut la...
::-ms-browse - Archive of obsolete content
-ms-background-position-x -ms-background-position-y -ms-
high-contrast-adjust background-clip background-color background-image background-origin background-repeat background-size border-bottom-color border-bottom-left-radius border-bottom-right-radius border-bottom-style border-bottom-width border-left-color border-left-style border-left-width border-right-color border-right-style border-right-width border-top-color border-top-left-radius border-top-right-radius border-top-sty...
::-ms-check - Archive of obsolete content
-ms-background-position-x -ms-background-position-y -ms-
high-contrast-adjust background-clip background-color background-image background-origin background-repeat background-size border-bottom-color border-bottom-left-radius border-bottom-right-radius border-bottom-style border-bottom-width border-left-color border-left-style border-left-width border-right-color border-right-style border-right-width border-top-color border-top-left-radi...
::-ms-clear - Archive of obsolete content
-ms-
high-contrast-adjust background-clip background-color background-image background-origin background-position-x background-position-y background-repeat background-size border-bottom-color border-bottom-left-radius border-bottom-right-radius border-bottom-style border-bottom-width border-left-color border-left-style border-left-width border-right-color border-right-style border-right...
::-ms-expand - Archive of obsolete content
-ms-
high-contrast-adjust background-clip background-color background-image background-origin background-position-x background-position-y background-repeat background-size border-bottom-color border-bottom-left-radius border-bottom-right-radius border-bottom-style border-bottom-width border-left-color border-left-style border-left-width border-right-color border-right-style border-right-width border-top-color border...
::-ms-fill-lower - Archive of obsolete content
or border-right-style border-right-width border-top-color border-top-left-radius border-top-right-radius border-top-style border-top-width box-shadow box-sizing color cursor display (values block, inline-block, none) @font-face font-size font-style font-weight height margin-bottom margin-left margin-right margin-top -ms-background-position-x -ms-background-position-y -ms-
high-contrast-adjust opacity outline-color outline-style outline-width padding-bottom padding-left padding-right padding-top transform transform-origin visibility width specifications not part of any specification.
::-ms-fill-upper - Archive of obsolete content
or border-right-style border-right-width border-top-color border-top-left-radius border-top-right-radius border-top-style border-top-width box-shadow box-sizing color cursor display (values block, inline-block, none) @font-face font-size font-style font-weight height margin-bottom margin-left margin-right margin-top -ms-background-position-x -ms-background-position-y -ms-
high-contrast-adjust opacity outline-color outline-style outline-width padding-bottom padding-left padding-right padding-top transform transform-origin visibility width syntax ::-ms-fill-upper specifications not part of any specification.
::-ms-fill - Archive of obsolete content
animation-name background-clip, background-color, background-image, background-origin, background-repeat, and background-size border border-radius box-shadow box-sizing color cursor display (values block, inline-block, none) font height margin -ms-background-position-x -ms-background-position-y -ms-
high-contrast-adjust opacity outline-color, outline-style, and outline-width padding transform and transform-origin visibility syntax ::-ms-fill example html <progress value="10" max="50"></progress> css progress::-ms-fill { background-color: orange; } result a progress bar using this style might look something like this: ...
::-ms-reveal - Archive of obsolete content
or border-right-style border-right-width border-top-color border-top-left-radius border-top-right-radius border-top-style border-top-width box-shadow box-sizing color cursor display (values block, inline-block, none) @font-face font-size font-style font-weight height margin-bottom margin-left margin-right margin-top -ms-background-position-x -ms-background-position-y -ms-
high-contrast-adjust opacity outline-color outline-style outline-width padding-bottom padding-left padding-right padding-top transform transform-origin visibility width syntax ::-ms-reveal specifications not part of any specification.
::-ms-thumb - Archive of obsolete content
or border-right-style border-right-width border-top-color border-top-left-radius border-top-right-radius border-top-style border-top-width box-shadow box-sizing color cursor display (values block, inline-block, none) @font-face font-size font-style font-weight height margin-bottom margin-left margin-right margin-top -ms-background-position-x -ms-background-position-y -ms-
high-contrast-adjust opacity outline-color outline-style outline-width padding-bottom padding-left padding-right padding-top transform transform-origin visibility width syntax ::-ms-thumb specifications not part of any specification.
::-ms-ticks-after - Archive of obsolete content
or border-right-style border-right-width border-top-color border-top-left-radius border-top-right-radius border-top-style border-top-width box-shadow box-sizing color cursor display (values block, inline-block, none) @font-face font-size font-style font-weight height margin-bottom margin-left margin-right margin-top -ms-background-position-x -ms-background-position-y -ms-
high-contrast-adjust opacity outline-color outline-style outline-width padding-bottom padding-left padding-right padding-top transform transform-origin visibility width syntax ::-ms-ticks-after ...
::-ms-ticks-before - Archive of obsolete content
or border-right-style border-right-width border-top-color border-top-left-radius border-top-right-radius border-top-style border-top-width box-shadow box-sizing color cursor display (values block, inline-block, none) @font-face font-size font-style font-weight height margin-bottom margin-left margin-right margin-top -ms-background-position-x -ms-background-position-y -ms-
high-contrast-adjust opacity outline-color outline-style outline-width padding-bottom padding-left padding-right padding-top transform transform-origin visibility width syntax ::-ms-ticks-before ...
::-ms-track - Archive of obsolete content
or border-right-style border-right-width border-top-color border-top-left-radius border-top-right-radius border-top-style border-top-width box-shadow box-sizing color cursor display (values block, inline-block, none) @font-face font-size font-style font-weight height margin-bottom margin-left margin-right margin-top -ms-background-position-x -ms-background-position-y -ms-
high-contrast-adjust opacity outline-color outline-style outline-width padding-bottom padding-left padding-right padding-top transform transform-origin visibility width syntax ::-ms-track see also ::-ms-thumb ::-ms-fill-upper ::-ms-fill-lower ::-webkit-slider-runnable-track ::-moz-range-track css-tricks: styling cross-browser compatible range inputs with css quirksmode: sty...
::-ms-value - Archive of obsolete content
or border-right-style border-right-width border-top-color border-top-left-radius border-top-right-radius border-top-style border-top-width box-shadow box-sizing color cursor display (values block, inline-block, none) @font-face font-size font-style font-weight height margin-bottom margin-left margin-right margin-top -ms-background-position-x -ms-background-position-y -ms-
high-contrast-adjust opacity outline-color outline-style outline-width padding-bottom padding-left padding-right padding-top transform transform-origin visibility width syntax ::-ms-value example input::-ms-value { color: lime; font-style: italic; } to disable the default styling: select::-ms-value { background-color: transparent; color: inherit; } specifications not pa...
LiveConnect - Archive of obsolete content
note: liveconnect blocked under some conditions liveconnect calls from javascript to java api are blocked when the java control panel security slider is set to very
high level, or when the slider is at the default
high level and the jre has either expired or is below the security baseline.
Game promotion - Game development
you can also sell a full version of the game from inside your browser demo version, which will be a great move considering
high competition, some developers even manage to make full browser versions.
3D games on the Web - Game development
see the building up a basic demo with playcanvas subpage for
higher-level details, and further articles showing how to create demos using the playcanvas library, and the online editor.
Collision detection - Game development
update the following part of the code as indicated by the
highlighted line: var bricks = []; for(var c=0; c<brickcolumncount; c++) { bricks[c] = []; for(var r=0; r<brickrowcount; r++) { bricks[c][r] = { x: 0, y: 0, status: 1 }; } } next we'll check the value of each brick's status property in the drawbricks() function before drawing it — if status is 1, then draw it, but if it's 0, then it was hit by the ball and we don't want it on t...
Bounce off the walls - Game development
compare your code you can check the finished code for this lesson in the live demo below, and play with it to understand better how it works: next steps this is starting to look more like a game now, but we can't control it in any way — it's
high time we introduced the player paddle and controls.
Buttons - Game development
add the following to the bottom of the preload() function: game.load.spritesheet('button', 'img/button.png', 120, 40); a single button frame is 120 pixels wide and 40 pixels
high.
Randomizing gameplay - Game development
function ballhitpaddle(ball, paddle) { ball.animations.play('wobble'); ball.body.velocity.x = -1*5*(paddle.x-ball.x); } it's a little bit of magic — the new velocity is
higher, the larger the distance between the center of the paddle and the place where the ball hits it.
The score - Game development
having a score can also make the game more interesting — you can try to beat your own
highscore, or your friend's.
2D maze game with device orientation - Game development
re adding an event listener to the "deviceorientation" event and binding the handleorientation function which looks like this: handleorientation: function(e) { var x = e.gamma; var y = e.beta; ball._player.body.velocity.x += x; ball._player.body.velocity.y += y; }, the more you tilt the device, the more force is applied to the ball, therefore the faster it moves (the velocity is
higher).
Styling lists - Learn web development
ence, paragraph for reference, paragraph for reference, paragraph for reference, paragraph for reference.</p> <dl> <dt>hummus</dt> <dd>a thick dip/sauce generally made from chick peas blended with tahini, lemon juice, salt, garlic, and other ingredients.</dd> <dt>pita</dt> <dd>a soft, slightly leavened flatbread.</dd> <dt>halloumi</dt> <dd>a semi-hard, unripened, brined cheese with a
higher-than-usual melting point, usually made from goat/sheep milk.</dd> <dt>green salad</dt> <dd>that green healthy stuff that many of us just use to garnish kebabs.</dd> </dl> if you go to the live example now and investigate the list elements using browser developer tools, you'll notice a couple of styling defaults: the <ul> and <ol> elements have a top and bottom margin of 16px (1em) and ...
Example 2 - Learn web development
e: none; margin : 0; padding: 0; background: #f0f0f0; border: .2em solid #000; border-top-width : .1em; border-radius: 0 0 .4em .4em; box-shadow: 0 .2em .4em rgba(0,0,0,.4); -moz-box-sizing : border-box; box-sizing : border-box; min-width : 100%; max-height: 10em; /* 100px */ overflow-y: auto; overflow-x: hidden; } .select .option { padding: .2em .3em; } .select .
highlight { background: #000; color: #ffffff; } javascript content window.addeventlistener("load", function () { var form = document.queryselector('form'); form.classlist.remove("no-widget"); form.classlist.add("widget"); }); result for js no js html content <form class="no-widget"> <select name="myfruit"> <option>cherry</option> <option>lemon</option> <option>banana</o...
Sending form data - Learn web development
it's more common to use one of the many
high quality frameworks that make handling forms easier, such as: django for python (a bit more heavyweight than flask, but with more tools and options).
Styling web forms - Learn web development
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 usin...
Example - Learn web development
that all text field have the same font settings by default, textarea are set with a monospace font */ font: 1em sans-serif; /* to give the same size to all text field */ width: 300px; -moz-box-sizing: border-box; box-sizing: border-box; /* to harmonize the look & feel of text field border */ border: 1px solid #999; } input:focus, textarea:focus { /* to give a little
highligh on active elements */ border-color: #000; } textarea { /* to properly align multiline text field with their label */ vertical-align: top; /* to give enough room to type some text */ height: 5em; /* to allow users to resize any textarea vertically it works only on chrome, firefox and safari */ resize: vertical; } .button { /* to position the buttons to the same positio...
Your first form - Learn web development
: inline-block; width: 90px; text-align: right; } input, textarea { /* to make sure that all text fields have the same font settings by default, textareas have a monospace font */ font: 1em sans-serif; /* uniform text field size */ width: 300px; box-sizing: border-box; /* match form field borders */ border: 1px solid #999; } input:focus, textarea:focus { /* additional
highlight for focused elements */ border-color: #000; } textarea { /* align multiline text fields with their labels */ vertical-align: top; /* provide space to type some text */ height: 5em; } .button { /* align buttons with the text fields */ padding-left: 90px; /* same size as the label elements */ } button { /* this extra margin represent roughly the same space as the space ...
CSS basics - Learn web development
html { font-size: 10px; /* px means "pixels": the base font size is now 10 pixels
high */ font-family: "open sans", sans-serif; /* this should be the rest of the output you got from google fonts */ } note: anything in css between /* and */ is a css comment.
Choosing the right approach - Learn web development
support 24 full support 10prefixed prefixed implemented with the vendor prefix: webkitedge full support 12firefox full support 23notes full support 23notes notes callback parameter is a dom
highrestimestamp.
Looping code - Learn web development
at this point, you probably understand the
high-level concepts behind loops, but you are probably thinking "ok, great, but how does this help me write better javascript code?" as we said earlier, loops are all to do with doing the same thing over and over again, which is great for rapidly completing repetitive tasks.
Client-side web APIs - Learn web development
guides introduction to web apis first up, we'll start by looking at apis from a
high level — what are they, how do they work, how do you use them in your code, and how are they structured?
Client-Server Overview - Learn web development
websites created using this style of application push a lot of computational cost from the server to the web browser, and can result in websites that appear to behave a lot more like native apps (
highly responsive, etc.).
Website security - Learn web development
in other
high-profile cases, millions of passwords, email addresses, and credit card details have been leaked into the public domain, exposing website users to both personal embarrassment and financial risk.
Routing in Ember - Learn web development
it contains the following contents: import emberrouter from '@ember/routing/router'; import config from './config/environment'; export default class router extends emberrouter { location = config.locationtype; rooturl = config.rooturl; } router.map(function() { this.route('completed'); this.route('active'); }); the
highlighted lines were added when the 2nd and 3rd commands above were run.
Ember app structure and componentization - Learn web development
ext to the rendered todo app, there are a number of ways we could decide how to break up the ui, but let's plan on splitting the html out into the following components: the component groupings are as follows: the main input / "new-todo" (red in the image) the containing body of the todo list + the mark-all-complete button (purple in the image) the mark-all-complete button, explicitly
highlighted for reasons given below (yellow in the image) each todo is an individual component (green in the image) the footer (blue in the image) something odd to note is that the mark-all-complete checkbox (marked in yellow), while in the "main" section, is rendered next to the "new-todo" input.
Advanced Svelte: Reactivity, lifecycle, accessibility - Learn web development
tus --> <todosstatus bind:this={todosstatus} {todos} /> now we can call the exported focus() method from our removetodo() function: function removetodo(todo) { todos = todos.filter(t => t.id !== todo.id) todosstatus.focus() // give focus to status heading } go back to your app — now if you delete any todo, the status heading will be focussed — this is useful to
highlight the change in numbers of todos, both to sighted users and screenreader users.
Getting started with Vue - Learn web development
in this article we'll look at a little bit of vue background, learn how to install it and create a new project, study the
high-level structure of the whole project and an individual component, see how to run the project locally, and get it prepared to start building our example.
Cross browser testing - Learn web development
what browsers, devices, and other segments should you make sure are tested), lo-fi testing strategies (get yourself a range of devices and some virtual machines and do ad-hoc tests when needed),
higher tech strategies (automation, using dedicated testing apps), and testing with user groups.
Gecko info for Windows accessibility vendors
const unsigned long state_required = state_alert_low; // used on form controls // to indicate that this field must be filled out to submit the form const unsigned long state_invalid = state_alert_
high; // used on form controls to // indicate the the field does not currently have a legal value const unsigned long state_???
Information for users
firefox accessibility skins and themes at the excellent access firefox website, you will find many valuable resources, including a list of firefox themes that have been specially designed for those with low vision: themes with
high color constrast themes with big icons themes with extra large and bright icons themes with extra large and extra bold text join the mozilla accessibility community live chat both end users and developers are invited for discussion on the live irc channel at irc.mozilla.org/#accessibility.
Multiprocess on Windows
overview a
high-level overview of the ideas behind the a11y+e10s design is available on the wiki.
ZoomText
issues for ai squared, from
high to low priority docreader and appreader don't respect the structure of the document -- no support for columns.
Accessibility and Mozilla
the uaag is not the basis for any government accessibility regulations at this time.multiprocess on windowsa
high-level overview of the ideas behind the a11y+e10s design is available on the wiki.software accessibility: where are we today?the accessibility of computer software has seen drastic improvements over the past two decades.
Lightweight themes
image requirements dimensions should be 3000px wide × 200px
high png or jpg file format image must be no larger than 300 kb in file size tips subtle, soft contrast images and gradients work best;
highly detailed images will compete with the browser ui.
Add-ons
this new,
high-performance browser for android has been rebuilt from the ground up using geckoview, mozilla’s mobile browser engine.
Testopia
new reports: worst offender and case roll-up set priorities on indidual case-runs new clone options uses the latest extjs 3.0 library converts testopia into a true bugzilla extension numerous bug fixes integration points testopia integrates with bugzilla products, components, versions, and milestones to allow a single management interface for
high level objects.
Old Thunderbird build
you should copy the header files to a windows sdk include directory so that the build process will find the files, for example to c:\program files (x86)\windows kits\8.1\include\shared and/or c:\program files (x86)\windows kits\10\include\10.0.nnnnn.0\shared respectively, where nnnnn is the
highest number present on the system.
Simple SeaMonkey build
high speed internet installing build tools if your system is not listed below, see the build prerequisites page.
Simple Thunderbird build
you should copy 17 of the 18 header files to a windows sdk include directory so that the build process will find the files, that is c:\program files (x86)\windows kits\10\include\10.0.nnnnn.0\shared, where nnnnn is the
highest number present on the system.
pymake
on other operating systems (linux, os x, etc), pymake itself only requires python 2.6 or
higher (but not python 3).
ESLint
editor integration it is
highly recommended that you integrate eslint into your editor.
Eclipse CDT Manual Setup
highlight (select) "cdt gcc build output parser", then in the "language settings provider options" that appear below, make sure that "share setting entries between projects (global provider)" is not ticked.
Reviewer Checklist
trailing whitespace (git diff and splinter view both
highlight this, as does hg with the color extension enabled).
mach
because mach command modules are loaded at mach start-up, it is important that they be lean and not have a
high import cost.
Experimental features in Firefox
nightly 77 no developer edition 77 no beta 77 no release 77 no preference name layout.css.grid-template-masonry-value.enabled media feature: prefers-contrast the prefers-contrast media feature is used to detect whether the user has specified a preference for
higher (or lower) contrast in the presentation of web content.
Message manager overview
this article describes the different types of message manager, how to access them, and at a
high level, what sorts of things you can use them for.
Performance
this
highlights some performance pitfalls related to frame scripts/message manager usage and alternative approaches to avoid them.
HTMLIFrameElement.findAll()
the findall() method of the htmliframeelement searches for a string in a browser <iframe>'s text content; if found, the first instance of the string relative to the caret position will be
highlighted.
HTMLIFrameElement.findNext()
the findnext() method of the htmliframeelement
highlights the next or previous instance of a search result after a findall() search has been carried out.
HTMLIFrameElement.setVisible()
if the visible state is set to true, it means that the browser <iframe> should have
high priority over the resources needed to render and handle its content.
Embedding the editor
high-level ui and emebedding code should deal with this editing session interface, without knowledge of the underlying editors.
Gecko SDK
for gecko versions 2.0 and
higher, you must recompile your component for each release as cross-version compatibility is no longer supported.
HTTP Cache
dispatching to a level with a lower number is executed sooner then dispatching to
higher number layers; also any loop on lower levels yields to
higher levels so that scheduled deletion of 1000 files will not block opening cache entries.
How to Report a Hung Firefox
(if you're experiencing
high cpu usage and firefox eventually recovers from a hang, you should try the instructions at reporting a performance problem instead.) is the rest of your system busy (
high cpu or memory usage, or
high disk activity)?
IME handling guide
notify_ime_of_text_change, notify_ime_of_selection_change, notify_ime_of_position_change and notify_ime_of_composition_event_handled are always sent by following order: notify_ime_of_text_change notify_ime_of_selection_change notify_ime_of_position_change notify_ime_of_composition_event_handled if sending one of above notifications causes
higher priority notification, the sender should abort to send remaning notifications and restart from
highet priority notification again.
mozilla::Mutex
please see introduction_to_nspr for a
high-level summary of its semantics.
DMD
this is good for finding parts of the code that cause
high heap churn, e.g.
Memory reporting
making measurements nsimemoryreporter provides the
high-level interface for a memory reporter, but the heart of a memory reporter is the measurement of the "amount".
Profiling with Xperf
for stack walking, windows vista or
higher is required; i haven't tested it at all on xp.
TimerFirings logging
this is useful because timer firings are a major cause of wakeups, which can cause
high power consumption.
Phishing: a short definition
in 2014, the msci estimated an annual global impact of phishing, and various forms of identity theft, to be as
high as $5 billion usd.
L20n
l20n lets localizers reach
higher levels of free linguistic expression by sharpening the divide between localization and application logic.
McCoy
this is located in: %appdata%\mozilla\mccoy (windows) ~/.mozilla/mccoy (linux) ~/library/application support/mccoy (mac os x) it is
highly recommended that you back up your profile folder and store it in a safe location whenever you create a new key; without a backup, there is no way to recover your private keys if they are lost!
Midas
otherwise, all selected characters will be drawn slightly
higher than normal text.
Creating a Cookie Log
run firefox by typing "./firefox" and pressing enter mac os x open terminal.app, which is located in the /applications/utilities folder (these instructions are for bash, the default shell in mac os x 10.3 and
higher; if you use something else, you probably know how to modify these instructions already).
Optimizing Applications For NSPR
the implementation is well suited for
high performance application, such as a server, but clients may find the win-95 version more suited (and adequate) for interactive applications such as are prevalent on today's workstations.
I/O Functions
two new functions, pr_transmitfile and pr_acceptread, can exploit the new system calls of some operating systems for
higher performance.
Logging
you can combine module and level criteria to get
highly selective logging.
PRIOMethods
if a layer provides no functionality, it should call the next lower (
higher) function of the same name (for example, the "close" method would return fd->lower->method->close(fd->lower)).
NSS CERTVerify Log
*/ unsigned int depth; /* how far up the chain are we */ void *arg; /* error specific argument */ struct certverifylognodestr *next; /* next in the list */ struct certverifylognodestr *prev; /* next in the list */ }; the list is a doubly linked null terminated list sorted from low to
high based on depth into the cert chain.
JSS
note that java 1.5 claimed no fips compliance, and java 1.6 or
higher needs to be used.
NSS 3.14.3 release notes
notable changes in nss 3.14.3 cve-2013-1620 recent research by nadhem alfardan and kenny patterson has
highlighted a weakness in the handling of cbc padding as used in ssl, tls, and dtls that allows an attacker to exploit timing differences in mac processing.
NSS 3.23 release notes
clients that perform a version downgrade (which is a dangerous practice) call this with the
highest version number that they possibly support.
nss tech note4
(e.g., two oids) prbool secitem_itemsareequal(const secitem *a, const secitem *b); interpreting a secitem value as an integer if secitem *item->len <=4, then int value = der_getinteger(item); interpreting a secitem value as a string use string copy functions to copy item->len bytes from item->data and null terminate explicitly some
higher level extension functions get a specific extension from the list of extensions, given the extension tag secstatus cert_findcertextension (certcertificate *cert, int tag, secitem *value); get a specific extension from the issuer's cert secstatus cert_findissuercertextension (certcertificate *cert, int tag, secitem *value); get the value o...
nss tech note6
for example, on 32-bit solaris sparc for nss 3.11, say shlibsign -v -i libsoftokn3.so shlibsign -v -i libfreebl_32int64_3.so shlibsign -v -i libfreebl_32fpu_3.soshlibsign -v -i libfreebl_32int_3.so (you need to set ld_library_path appropriately and specify the correct pathnames of the libraries.) option 1 is simpler and
highly preferred.
NSS tools : signtool
the
higher the level of compression, the smaller the output but the longer the operation takes.
Network Security Services
if you're a developer and would like to contribute to nss, you might want to read the documents
highlevel overview of internal details of nss and getting started with nss.
Creating JavaScript tests
even tests that check for polynomial time complexity will start to fail in a few years when they have sped up enough to run faster than the granularity of the os scheduler or when run on platforms with
higher latencies than your development workstation.
GCIntegration - SpiderMonkey Redirect 1
at a
high level, there are three issues to be aware of: interactions between the garbage collector and the cycle collector incremental garbage collection moving garbage collection the apis for gc/cc interaction and incremental gc are already in place.
Hacking Tips
it's designed to
highlight incorrect oom handling and this may show up as a crash or assertion failure at some later point.
Exact Stack Rooting
for this reason it is
highly recommended that this rooting mechanism only be used on the cstack.
Garbage collection
if the allocation rate is
high during incremental gc, the engine may run out of memory before finishing the incremental gc.
JS::Value
it is
highly recommended that you develop and test with an --enable-debug build to detect most js::value misuse.
JSObjectOps.dropProperty
(that is, for each object, all property accesses happened in some order, and what each thread observed was consistent with that order: no stale reads, for example.) however, spidermonkey does not guarantee this
high degree of serialization.
JSObjectOps.getProperty
jsobjectops.getproperty, setproperty, and deleteproperty are
high-level callbacks that implement object property accesses.
JSObjectOps.lookupProperty
the jsobjectops.lookupproperty callback is called for every property access (except when a
higher-level callback, such as jsobjectops.getproperty, is overloaded in a way that does not call lookupproperty).
JS_DefineProperty
js_defineproperty is the fundamental operation on which several more convenient,
higher-level functions are based, including js_definefunction, js_definefunctions, js_defineproperties, js_defineconstdoubles, js_defineobject, and js_initclass.
JS_EncodeString
otherwise the
high byte is simply dropped from each char16_t.
JS_SetArrayLength
if you call js_setarraylength on an existing array, and length is less than the
highest index number for previously defined elements, all elements greater than or equal to length are automatically deleted.
JSAPI reference
null obsolete since jsapi 32 jsval_is_void obsolete since jsapi 32 jsval_is_boolean obsolete since jsapi 32 jsval_is_number obsolete since jsapi 32 jsval_is_int obsolete since jsapi 32 jsval_is_double obsolete since jsapi 32 jsval_is_string obsolete since jsapi 32 jsval_is_object obsolete since jsapi 15 jsval_is_primitive obsolete since jsapi 32 jsval_is_gcthing obsolete since jsapi 32
high-level type-conversion routines for packing and unpacking function arguments.
Parser API
this makes it easier to write tools in javascript that manipulate javascript source programs, such as syntax
highlighters, static analyses, translators, compilers, obfuscators, etc.
Profiling SpiderMonkey
if you'd like to profile something at a
higher level of detail than the js shark functions allow, there are corresponding c functions available at the bottom of jsdbgapi.h.
SpiderMonkey 31
when all jsapi operation has completed, the corresponding js_shutdown method (currently non-mandatory, but
highly recommended as it may become mandatory in the future) uninitializes spidermonkey, cleaning up memory and allocations performed by js_init.
Shell global objects
the name is one of: maxbytes maxmallocbytes gcbytes gcnumber mode unusedchunks totalchunks slicetimebudget markstacklimit
highfrequencytimelimit
highfrequencylowlimit
highfrequency
highlimit
highfrequencyheapgrowthmax
highfrequencyheapgrowthmin lowfrequencyheapgrowth dynamicheapgrowth dynamicmarkslice allocationthreshold minemptychunkcount maxemptychunkcount compactingenabled refreshframeslicesenabled relazifyfunctions(...) perform a gc and allow relazification of functions.
Mozilla Projects
l20n l20n lets localizers reach
higher levels of free linguistic expression by sharpening the divide between localization and application logic.
Exploitable crashes
if you're not sure what rating to give, err on the
higher side so the bug will get more attention.
Gecko object attributes
value attributes valuetext a text equivalent to the current value, such as "
high" in a slider or "unzipping files" in a progress meter.
Implementation Details
at-spi events refer to specific pages to get information of supported events for interested at api: gecko msaa ia2 at-spi implementation features this section
highlights special features of at apis implementation by gecko.
History Service Design
this document provides a
high-level overview of the overall history service design of the places system.
Places Expiration
this means on mobile and old systems expiration will be more aggressive than on
high-end hardware, to try keep the database size at a reasonable (and performant) value.
Using the Places annotation service
however, it is more efficient to just try to do the operation and catch the exception; the extra check requires an additional database lookup (which has
higher overhead).
Using the Places history service
please see history service design for information on the design of the history service, and the places database for a
higher-level design overview of places.
Places
design documents the places database
high-level overview of the places database design.
The Publicity Stream API
example use cases: 'adam got a
high score in mafia wars', 'bethany bought a plane ticket to the caribbean', etc.
An Overview of XPCOM
the brief sections in this chapter introduce the concepts at a very
high level, so that we can discuss and use them with more familiarity in the tutorial itself, which describes the creation of a mozilla component called weblock.
Packaging WebLock
the sample installation script shown below uses the mozilla xpinstall technology to manipulate an installer and talk to mozilla'schrome registry as
high-level javascript objects.
Preface
sidebar sections are included to
highlight technical details.
Starting WebLock
on some platforms, print64 is a struct with two fields - a
high and a low 32-bit integer.
Using XPCOM Components
the webbrowserfind component components are used all over - in
high-level browser-like functionality such as nswebbrowserfind, which provides find() and findnext() methods for finding content in web pages, and in low-level tasks such as the manipulation of data.
Components.isSuccessCode
an xpcom return code indicates success if its
high-order bit is 0, and it indicates failure if its
high-order bit is 1.
XPConnect wrappers
this document is a
high-level overview of xpconnect wrapper objects (for the more technical description see xpconnect security membranes).
IAccessibleText
if the text() is implemented as a tree of text() objects with embed characters in
higher levels representing substrings of child text() objects and the caret is in one of the child text() objects, then the offset in the
higher level text() object would be at the embed character representing child text() object that contains the caret.
nsIAlertsService
see also alerts and notifications bug 782211 - implement notification api spec ui.alertnotificationorigin [en-us] bug 1270819 - nsialertsservice showalertnotification sliding alert unnecessarily big /
high ...
nsIBinaryOutputStream
output is written in big-endian order (
high-order byte first), as this is traditional network order.
nsIClassInfo
reserved 1 << 31 the
high order bit is reserved for consumers of these flags.
nsIClipboardDragDropHooks
because this can be called many times, it is
highly recommended that the implementation be very efficient so user feedback is not negatively impacted.
nsIComponentManager
if you're targeting gecko 10 or
higher there should be no need to call this method, since the bootstrapped add-on's chrome.manifest is loaded automatically now.
nsIDOMGeoPositionOptions
last changed in gecko 1.9.1 (firefox 3.5 / thunderbird 3.0 / seamonkey 2.0) inherits from: nsisupports attributes attribute type description enable
highaccuracy boolean if true,
high accuracy mode is used.
nsIJumpListBuilder
tasks are given the
highest priority of all lists when space is limited.
nsIMsgDatabase
ncache(in string asearchfolderuri, in nsimsgdbhdr ahdr, in boolean aadd); boolean hdrisincache(in string asearchfolderuri, in nsimsgdbhdr ahdr); attributes attribute type description dbfolderinfo nsidbfolderinfo readonly: firstnew nsmsgkey readonly: msgretentionsettings nsimsgretentionsettings msgdownloadsettings nsimsgdownloadsettings lowwaterarticlenum nsmsgkey readonly:
highwaterarticlenum nsmsgkey readonly: nextpseudomsgkey nsmsgkey for undo-redo of move pop->imap.
nsIMsgSearchCustomTerm
length, [retval, array, size_is(length)] out nsmsgsearchopvalue operators); match /** * apply the custom search term to a message * * @param msghdr header database reference representing the message * @param searchvalue user-set value to use in the search * @param searchop search operator (contains, is
higherthan, etc.) * * @return true if the term matches the message, else false */ boolean match(in nsimsgdbhdr msghdr, in autf8string searchvalue, in nsmsgsearchopvalue searchop); ...
nsIProtocolHandler
typically, this flag is used by protocols that show
highly untrusted content in a viewing area that the user expects to have a lot of control over, such as an email reader.
nsIStyleSheetService
an agent sheet loaded via this api will come after ua.css in the cascade (so the rules in it will have
higher precedence than rules in ua.css).
nsISupports
the point of those descriptions is to
highlight the fact that addref() and release() do not necessarily correspond to incrementing and decrementing a counter, respectively, even though that is how they are usually implemented.
nsITextInputProcessor
s interface is a text input events synthesizer and manages its composition and modifier state 1.0 66 introduced gecko 38 inherits from: nsisupports last changed in gecko 38.0 (firefox 38.0 / thunderbird 38.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.
nsIThread
this interface provides a
high-level abstraction for an operating system thread.
nsIURI
warning: setting this is
highly discouraged outside of a protocol handler implementation, since doing so will generally lead to unpredictable results.
nsIWebBrowserFind
methods findnext() finds,
highlights, and scrolls into view the next occurrence of the search string, using the current search settings.
nsIXPCScriptable
s 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 << 28 want_outer_object 1 << 29 want_inner_object 1 << 30 reserved 1 << 31 the
high order bit is reserved for consumers of these flags.
nsMsgPriorityValue
-central/ mailnews/ base/ public/ mailnewstypes2.idl typedef long nsmsgpriorityvalue; [scriptable, uuid(94c0d8d8-2045-11d3-8a8f-0060b0fc04d2)] interface nsmsgpriority { const nsmsgpriorityvalue notset = 0; const nsmsgpriorityvalue none = 1; const nsmsgpriorityvalue lowest = 2; const nsmsgpriorityvalue low = 3; const nsmsgpriorityvalue normal = 4; const nsmsgpriorityvalue
high = 5; const nsmsgpriorityvalue
highest = 6; // the default for a priority picker const nsmsgpriorityvalue default = 4; }; ...
nsMsgSearchOp
ibutes */ 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 is
higherthan = 7; /* for priority.
nsMsgSearchOpValue
nst 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; 158 159 const nsmsgsearchopvalue is
higherthan = 7; /* for priority.
Performance
a command that will give you a
higher level overview is "explain query plan".
Storage
this can result in significantly
higher overhead file operation.
Using nsIDirectoryService
you can directly add a new nsifile with any property string using the nsiproperties interface: components.classes["@mozilla.org/file/directory_service;1"] .getservice(components.interfaces.nsiproperties) .set("myfilename", file); now, if your cost is too
high to set all of these properties at once, you can register to be a callback that can provide an nsifile.
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: x86 - i386 and
higher series (including x86-64 cpus in 32-bit mode) ppc - powerpc series alpha - alpha series x86_64 - amd64/emt64 series in 64-bit mode (32-bit mode is still considered x86) 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++ compiler 2.x gcc3 - gnu...
Thunderbird
currently one of the most popular open source email clients, it is used by tens of millions of people around the world to bring together all their email accounts, chat, newsgroup and feed reading in a familiar
high-productivity environment.
Using the Mozilla source server
if you click "yes", windbg will display *busy* in the status bar while it downloads the source, and then it will automatically open the file and
highlight the current line.
Standard OS Libraries
example: getcursorpos i wanted to get the mouse cursor position without using a mousemove listener, as this is a
high overhead event listener.
Constants - Plugins
npres_user_break 2 user canceled stream directly by clicking the stop button or indirectly by some action such as deleting the instance or initiating
higher-priority network operations.
Streams - Plugins
npres_user_break: the user canceled the stream directly by clicking the stop button or indirectly by some action, such as by deleting the instance or initiating
higher-priority network operations.
Plugins
roadmap
highlights since firefox 52, plugins other than flash are not loaded by firefox.
Access debugging in add-ons - Firefox Developer Tools
window.addeventlistener("debugger:editorunloaded") relevant files: chrome://browser/content/devtools/debugger-controller.js chrome://browser/content/devtools/debugger-toolbar.js chrome://browser/content/devtools/debugger-view.js chrome://browser/content/devtools/debugger-panes.js unfortunately there is not yet any api to evaluate watches/expressions within the debugged scope, or
highlight elements on the page that are referenced as variables in the debugged scope.
Breaking on exceptions - Firefox Developer Tools
to instruct the debugger to pause on an exception, tick these checkboxes in the breakpoints list: pause on exceptions pause on caught exceptions when an exception occurs, the line where it occurs is
highlighted in the source pane, with a squiggly red line under the problematic code.
Search - Firefox Developer Tools
the debugger will display the number of matches in the code and
highlight each result: using the outline tab if you are searching for a specific function within the current javascript file, you can use the outline tab in the debugger to find it quickly.
How to - Firefox Developer Tools
access debugging in add-onsbreaking on exceptionsdebug eval sourcesdisable breakpointsexamine, modify, and watch variables
highlight and inspect dom nodesignore a sourceopen the debuggerpretty-print a minified filesearchset a breakpointset a conditional breakpointset watch expressionsstep through codeuse a source mapuse watchpoints ...
JSON viewer - Firefox Developer Tools
if you open a json file in the browser, or view a remote url with the content-type set to application/json, it is parsed and given syntax
highlighting.
Edit fonts - Firefox Developer Tools
example: if the font is 20 pixels
high and the line-height is 1.5em, when you change the unit of measure from em to px, the value will become 30px.
Examine and edit the box model - Firefox Developer Tools
viewing the box model with the select element button pressed, if you hover over an element in the page, the box model for the element is shown overlaid on the page: it's also shown overlaid if you hover over an element's markup in the html pane: if the element is inline and is split over multiple line boxes, the
highlighter shows each individual line box that together make up the element: the box model view when an element's selected, you can get a detailed look at the box model in the box model view: if you hover over a value, you'll see a tooltip telling you which rule the value comes from: if you hover over part of the box model in the box model view, the corresponding part of the page is
highlighted: editing the box model you can also edit the values in the box...
Animation inspector (Firefox 41 and 42) - Firefox Developer Tools
the animation inspector enables you to: see information about all animations running in the page play/pause all animations play/pause/rewind/fast-forward each animation jump to a specific point in an animation
highlight and inspect the animated node adjust the playback rate of each animation see whether an animation is running in the compositor thread (a lightning bolt icon is displayed next to such animations) ...
How to - Firefox Developer Tools
css flexbox inspector: examine flexbox layoutscss grid inspector: examine grid layoutsedit css filtersedit shape paths in cssedit fontsexamine event listenersexamine and edit cssexamine and edit htmlexamine and edit the box modelinspect and select colorsopen the inspectorreposition elements in the pageselect an elementselect and
highlight elementsuse the inspector apiuse the inspector from the web consoleview background imagesvisualize transformswork with animations ...
Allocations - Firefox Developer Tools
in general, though: allocation pressure - allocating a lot of memory, or allocating memory at a
high rate - makes spidermonkey more likely to run garbage collection, and more likely to run full, non-incremental garbage collection.
Performance - Firefox Developer Tools
intensive javascript uses the frame rate and waterfall tools to
highlight performance problems caused by long-running javascript, and how using workers can help in this situation.
Toolbox - Firefox Developer Tools
the following tools are not included in the toolbar by default, but you can add them in the settings:
highlight painted area 3d view (note that this is not available in firefox 40) scratchpad grab a color from the page take a screenshot of the entire page: take a screenshot of the complete web page and saves it in your downloads directory toggle rulers for the page measure a portion of the page: measure a part of the website by selecting areas within the page toolbox controls finally there's ...
Rich output - Firefox Developer Tools
s", datecreated: 1552404478137 } ​ 1: object { status: "in progress", description: "refactor styles", datecreated: 1552404493169 } ​ 2: object { status: "to do", description: "create feedback form", datecreated: 1552404512630 } ​ 3: object { status: "to do", description: "normalize table", datecreated: 1552404533790 } ​ length: 4 ​ <prototype>: array [] debugger eval code:1:9 undefined
highlighting and inspecting dom nodes if you hover the mouse over any dom element in the console output, it's
highlighted on the page: in the screenshot above you'll also see a blue "target" icon next to the node in the console output: click it to switch to the inspector with that node selected.
AnalyserNode.maxDecibels - Web APIs
when getting data from getfloatfrequencydata() or getbytefrequencydata(), any frequencies with an amplitude of maxdecibels or
higher will be returned as +1.0 or 255, respectively.
AudioBuffer() - Web APIs
exceptions notsupportederror one or more of the options are negative or otherwise has an invalid value (such as numberofchannels being
higher than supported, or a samplerate outside the nominal range).
AudioContext.baseLatency - Web APIs
example // default latency ("interactive") const audioctx1 = new audiocontext(); console.log(audioctx1.baselatency); // 0.00 //
higher latency ("playback") const audioctx2 = new audiocontext({ latencyhint: 'playback' }); console.log(audioctx2.baselatency); // 0.15 specifications specification status comment web audio apithe definition of 'baselatency' in that specification.
Canvas API - Web APIs
easeljs is an open-source canvas library that makes creating games, generative art, and other
highly graphical experiences easy.
Using channel messaging - Web APIs
for example, what if you wanted to add a contact to the address book from the main site, add
high scores from your game into your main profile, or add new background music choices from the audio player onto the game?
ChildNode.after() - Web APIs
with(node) { after("foo"); } // referenceerror: after is not defined polyfill you can polyfill the after() method in internet explorer 9 and
higher with the following code: // from: https://github.com/jserz/js_piece/blob/master/dom/childnode/after()/after().md (function (arr) { arr.foreach(function (item) { if (item.hasownproperty('after')) { return; } object.defineproperty(item, 'after', { configurable: true, enumerable: true, writable: true, value: function after() { var argarr = array...
ChildNode.before() - Web APIs
with(node) { before("foo"); } // referenceerror: before is not defined polyfill you can polyfill the before() method in internet explorer 9 and
higher with the following code: // from: https://github.com/jserz/js_piece/blob/master/dom/childnode/before()/before().md (function (arr) { arr.foreach(function (item) { if (item.hasownproperty('before')) { return; } object.defineproperty(item, 'before', { configurable: true, enumerable: true, writable: true, value: function before() { var argarr = ...
ChildNode.remove() - Web APIs
with(node) { remove(); } // referenceerror: remove is not defined polyfill you can polyfill the remove() method in internet explorer 9 and
higher with the following code: // from:https://github.com/jserz/js_piece/blob/master/dom/childnode/remove()/remove().md (function (arr) { arr.foreach(function (item) { if (item.hasownproperty('remove')) { return; } object.defineproperty(item, 'remove', { configurable: true, enumerable: true, writable: true, value: function remove() { this.parentnod...
ChildNode.replaceWith() - Web APIs
with(node) { replacewith("foo"); } // referenceerror: replacewith is not defined polyfill you can polyfill the replacewith() method in internet explorer 10+ and
higher with the following code: function replacewithpolyfill() { 'use-strict'; // for safari, and ie > 10 var parent = this.parentnode, i = arguments.length, currentnode; if (!parent) return; if (!i) // if there are no arguments parent.removechild(this); while (i--) { // i-- decrements i and returns the value of i before the decrement currentnode = arguments[i]; if (typeof curre...
CountQueuingStrategy.size() - Web APIs
examples const queuingstrategy = new countqueuingstrategy({
highwatermark: 1 }); const writablestream = new writablestream({ // implement the sink write(chunk) { ...
CountQueuingStrategy - Web APIs
examples const queueingstrategy = new countqueuingstrategy({
highwatermark: 1 }); const writablestream = new writablestream({ // implement the sink write(chunk) { ...
Document.cookie - Web APIs
it is
highly recommended for you to use whatwg dom storage if you are going to keep "client-only" data.
Document: drag event - Web APIs
.target.style.opacity = .5; }, false); document.addeventlistener("dragend", function(event) { // reset the transparency event.target.style.opacity = ""; }, false); /* events fired on the drop targets */ document.addeventlistener("dragover", function(event) { // prevent default to allow drop event.preventdefault(); }, false); document.addeventlistener("dragenter", function(event) { //
highlight potential drop target when the draggable element enters it if (event.target.classname == "dropzone") { event.target.style.background = "purple"; } }, false); document.addeventlistener("dragleave", function(event) { // reset background of potential drop target when the draggable element leaves it if (event.target.classname == "dropzone") { event.target.style.background = "";...
Document.requestStorageAccess() - Web APIs
the maximum number of concurrent storage access grants an origin can obtain is a positive integer currently defined as one percent of the number of top-level origins visited in the current session or 5, whichever is
higher.
Document: scroll event - Web APIs
examples scroll event throttling since scroll events can fire at a
high rate, the event handler shouldn't execute computationally expensive operations such as dom modifications.
Document Object Model (DOM) - Web APIs
stringlist domtokenlist element event eventtarget htmlcollection mutationobserver mutationrecord namednodemap node nodefilter nodeiterator nodelist nondocumenttypechildnode parentnode processinginstruction selection range text textdecoder textencoder timeranges treewalker url window worker xmldocument obsolete dom interfaces the document object model has been
highly simplified.
Element.getBoundingClientRect() - Web APIs
cross-browser fallback scripts requiring
high cross-browser compatibility can use window.pagexoffset and window.pageyoffset instead of window.scrollx and window.scrolly.
Element.insertAdjacentText() - Web APIs
polyfill you can polyfill the insertadjacenttext() method in internet explorer 5.5 (maybe earlier) and
higher with the following code: if (!element.prototype.insertadjacenttext) element.prototype.insertadjacenttext = function(type, txt){ this.insertadjacenthtml( type, (txt+'') // convert to string .replace(/&/g, '&') // embed ampersand symbols .replace(/</g, '<') // embed less-than symbols ) } specification specification status comment ...
Element: mouseout event - Web APIs
html <ul id="test"> <li>item 1</li> <li>item 2</li> <li>item 3</li> </ul> javascript let test = document.getelementbyid("test"); // briefly make the list purple when the mouse moves off the // <ul> element test.addeventlistener("mouseleave", function( event ) { //
highlight the mouseleave target event.target.style.color = "purple"; // reset the color after a short delay settimeout(function() { event.target.style.color = ""; }, 1000); }, false); // briefly make an <li> orange when the mouse moves off of it test.addeventlistener("mouseout", function( event ) { //
highlight the mouseout target event.target.style.color = "orange"; // reset the ...
Element: mouseover event - Web APIs
html <ul id="test"> <li>item 1</li> <li>item 2</li> <li>item 3</li> </ul> javascript let test = document.getelementbyid("test"); // this handler will be executed only once when the cursor // moves over the unordered list test.addeventlistener("mouseenter", function( event ) { //
highlight the mouseenter target event.target.style.color = "purple"; // reset the color after a short delay settimeout(function() { event.target.style.color = ""; }, 500); }, false); // this handler will be executed every time the cursor // is moved over a different list item test.addeventlistener("mouseover", function( event ) { //
highlight the mouseover target event.target.style.c...
Element.runtimeStyle - Web APIs
summary element.runtimestyle is a proprietary property similar to htmlelement.style, except its styles, that have
higher precedence and modification.
Element: scroll event - Web APIs
examples scroll event throttling since scroll events can fire at a
high rate, the event handler shouldn't execute computationally expensive operations such as dom modifications.
Event - Web APIs
in addition, work is underway to change this to be a dom
highrestimestamp instead.
Gamepad.axes - Web APIs
analog thumb sticks).- each entry in the array is a floating point value in the range -1.0 – 1.0, representing the axis position from the lowest value (-1.0) to the
highest value (1.0).
Gamepad - Web APIs
gamepad.timestamp read only a dom
highrestimestamp representing the last time the data for this gamepad was updated.
Geolocation.clearWatch() - Web APIs
et, option; function success(pos) { var crd = pos.coords; if (target.latitude === crd.latitude && target.longitude === crd.longitude) { console.log('congratulation, you reach the target'); navigator.geolocation.clearwatch(id); } }; function error(err) { console.warn('error(' + err.code + '): ' + err.message); }; target = { latitude : 0, longitude: 0, } options = { enable
highaccuracy: false, timeout: 5000, maximumage: 0 }; id = navigator.geolocation.watchposition(success, error, options); specifications specification status comment geolocation api recommendation initial specification.
Geolocation.getCurrentPosition() - Web APIs
enable
highaccuracy: false | true examples var options = { enable
highaccuracy: true, timeout: 5000, maximumage: 0 }; function success(pos) { var crd = pos.coords; console.log('your current position is:'); console.log(`latitude : ${crd.latitude}`); console.log(`longitude: ${crd.longitude}`); console.log(`more or less ${crd.accuracy} meters.`); } function error(err) { console.warn(`...
Geolocation.watchPosition() - Web APIs
, options; function success(pos) { var crd = pos.coords; if (target.latitude === crd.latitude && target.longitude === crd.longitude) { console.log('congratulations, you reached the target'); navigator.geolocation.clearwatch(id); } } function error(err) { console.warn('error(' + err.code + '): ' + err.message); } target = { latitude : 0, longitude: 0 }; options = { enable
highaccuracy: false, timeout: 5000, maximumage: 0 }; id = navigator.geolocation.watchposition(success, error, options); specifications specification status comment geolocation apithe definition of 'watchposition()' in that specification.
HTMLCanvasElement - Web APIs
the purpose of mozprintcallback is to obtain a
higher resolution rendering of the canvas at the resolution of the printer being used.
HTMLElement.innerText - Web APIs
as a getter, it approximates the text the user would get if they
highlighted the contents of the element with the cursor and then copied it to the clipboard.
HTMLElement - Web APIs
as a getter, it approximates the text the user would get if they
highlighted the contents of the element with the cursor and then copied it to the clipboard.
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%.
HTMLImageElement.srcset - Web APIs
if you happen to have both standard and
high density displays, try moving this window between them and reloading the page to see the results change.
IDBObjectStore.createIndex() - Web APIs
has been deleted or removed.) in firefox previous to version 41, an invalidstateerror was raised in this case as well, which was misleading; this has now been fixed (see bug 1176165.) example in the following example you can see the idbopendbrequest.onupgradeneeded handler being used to update the database structure if a database with a
higher version number is loaded.
IDBObjectStore.deleteIndex() - Web APIs
example in the following example you can see the idbopendbrequest.onupgradeneeded handler being used to update the database structure if a database with a
higher version number is loaded.
IDBOpenDBRequest.onupgradeneeded - Web APIs
}; example in the following example you can see the onupgradeneeded handler being used to update the database structure if a database with a
higher version number is loaded.
IIRFilterNode - Web APIs
number of inputs 1 number of outputs 1 channel count mode "max" channel count same as on the input channel interpretation "speakers" typically, it's best to use the biquadfilternode interface to implement
higher-order filters.
IdleDeadline.timeRemaining() - Web APIs
syntax timeremaining = idledeadline.timeremaining(); return value a dom
highrestimestamp value (which is a floating-point number) representing the number of milliseconds the user agent estimates are left in the current idle period.
IdleDeadline - Web APIs
methods idledeadline.timeremaining() returns a dom
highrestimestamp, which is a floating-point value providing an estimate of the number of milliseconds remaining in the current idle period.
Using IndexedDB - Web APIs
creating or updating the version of the database when you create a new database or increase the version number of an existing database (by specifying a
higher version number than you did previously, when opening a database), the onupgradeneeded event will be triggered and an idbversionchangeevent object will be passed to any onversionchange event handler set up on request.result (i.e., db in the example).
IntersectionObserverEntry - Web APIs
intersectionobserverentry.time read only a dom
highrestimestamp indicating the time at which the intersection was recorded, relative to the intersectionobserver's time origin.
Key Values - Web APIs
although typical numeric keypads have numeric keys from 0 to 9 (encoded as "0" through "9"), some multimedia keyboards include additional number keys for
higher numbers.
MIDIMessageEvent - Web APIs
note: even though the web midi api specifies a receivedtime property that returns a dom
highrestimestamp, chrome (the only implementation at the time of writing) does not support that property since the basic event.timestamp property already returns a dom
highrestimestamp in chrome.
MediaCapabilitiesInfo - Web APIs
smooth: given the properties defined in the mediaconfiguration, will the playback of the specified piece of media be
high quality?
MediaDevices.getUserMedia() - Web APIs
the following demands a minimum resolution of 1280x720: { audio: true, video: { width: { min: 1280 }, 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.
MediaTrackConstraints.latency - Web APIs
in most cases, low latency is desirable for performance and user experience purposes, but when power consumption is a concern, or delays are otherwise acceptable,
higher latency might be acceptable.
MediaTrackControls.volume - Web APIs
syntax var constraintsobject = { volume: constraint }; constraintsobject.volume = constraint; value a constraindouble describing the acceptable or required value(s) for an audio track's volume, on a linear scale where 0.0 means silence and 1.0 is the
highest supported volume.
MediaTrackSettings.sampleRate - Web APIs
common values include 44,100 (standard cd audio), 48,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).
NamedNodeMap - Web APIs
namednodemap.item() returns the attr at the given index, or null if the index is
higher or equal to the number of nodes.
Using Navigation Timing - Web APIs
the navigation timing api lets you easily obtain detailed and
highly accurate timing information to help isolate performance problems with your site's code or resources.
Navigation Timing API - Web APIs
while this interface is defined by the
high resolution time api, the navigation timing api adds two properties: timing and navigation, of the types below.
PannerNode.panningModel - Web APIs
hrtf: renders a stereo output of
higher quality than equalpower — it uses a convolution with measured impulse responses from human subjects.
ParentNode.append() - Web APIs
let parent = document.createelement("div") with(parent) { append("foo") } // referenceerror: append is not defined polyfill you can polyfill the append() method in internet explorer 9 and
higher with the following code: // source: https://github.com/jserz/js_piece/blob/master/dom/parentnode/append()/append().md (function (arr) { arr.foreach(function (item) { if (item.hasownproperty('append')) { return; } object.defineproperty(item, 'append', { configurable: true, enumerable: true, writable: true, value: function append() { var argarr...
performance.measure() - Web APIs
duration - set to a dom
highrestimestamp that is the duration of the measure (typically, the end mark timestamp minus the start mark timestamp).
performance.toJSON() - Web APIs
example var js; js = window.performance.tojson(); console.log("json = " + json.stringify(js)); specifications specification status comment
high resolution time level 2the definition of 'tojson() serializer' in that specification.
PerformanceResourceTiming.requestStart - Web APIs
syntax resource.requeststart; return value a dom
highrestimestamp representing the time immediately before the browser starts requesting the resource from the server example in the following example, the value of the *start and *end properties of all "resource" type events are logged.
PerformanceResourceTiming.responseEnd - Web APIs
syntax resource.responseend; return value a dom
highrestimestamp immediately after the browser receives the last byte of the resource or immediately before the transport connection is closed, whichever comes first.
Pointer events - Web APIs
add the event handlers to a specific target element (rather than the entire document or nodes
higher up in the document tree).
PositionOptions - Web APIs
properties positionoptions.enable
highaccuracy secure context is a boolean that indicates the application would like to receive the best possible results.
PushSubscription - Web APIs
pushsubscription.expirationtime read only a dom
highrestimestamp of the subscription expiration time associated with the push subscription, if there is one, or null otherwise.
RTCDtlsTransport - Web APIs
for example, to create the connection using the
highest level of bundling: const rtcconfig = { bundlepolicy: "max-bundle" }; const pc = new rtcpeerconnection(rtcconfig); bundling lets you use one rtcdtlstransport to carry the data for multiple
higher-level transports, such as multiple rtcrtptransceivers.
RTCIceCandidate.priority - Web APIs
the rtcicecandidate interface's read-only priority property specifies the candidate's priority according to the remote peer; the
higher this value is, the better the remote peer considers the candidate to be.
RTCIceCandidatePairStats.consentExpiredTimestamp - Web APIs
syntax consentexpiration = rtcicecandidatepairstats.consentexpiredtimestamp; value a dom
highrestimestamp object that indicates the time at which the stun binding that allows the two peers described by this rtcicecandidatepair to communicate will expire (or the time at which the binding did expire, if the time has passed).
RTCIceCandidatePairStats.firstRequestTimestamp - Web APIs
syntax firstrequesttimestamp = rtcicecandidatepairstats.firstrequesttimestamp; value a dom
highrestimestamp object indicating the timestamp at which the first stun request was sent on the connection described by the described pair of candidates.
RTCIceCandidatePairStats.lastPacketReceivedTimestamp - Web APIs
syntax lastpacketreceivedtimestamp = rtcicecandidatepairstats.lastpacketreceivedtimestamp; value a dom
highrestimestamp object indicating the timestamp at which the connection described by pair of candidates last received a packet, stun packets excluded.
RTCIceCandidateStats.lastPacketSentTimestamp - Web APIs
syntax lastpacketsenttimestamp = rtcicecandidatepairstats.lastpacketsenttimestamp; value a dom
highrestimestamp object indicating the timestamp at which the connection described by pair of candidates last sent a packet, stun packets excluded.
RTCIceCandidatePairStats.lastRequestTimestamp - Web APIs
syntax lastrequesttimestamp = rtcicecandidatepairstats.lastrequesttimestamp; value a dom
highrestimestamp object indicating the timestamp at which the last (most recent) stun request was sent on the connection indicated by the described pair of candidates.
RTCIceCandidateStats.lastResponseTimestamp - Web APIs
syntax lastresponsetimestamp = rtcicecandidatepairstats.lastresponsetimestamp; value a dom
highrestimestamp object indicating the timestamp at which the most recent stun response was received on the connection defined by the described pair of candidates.
RTCIceCandidatePairStats.state - Web APIs
each time a candidate pair is done being checked, the next-
highest priority candidate pair remaining on the check list moves from the waiting state to the in-progress state, and its check begins.
RTCIceCandidateType - Web APIs
values these candidate types are listed in order of priority; the
higher in the list they are, the more efficient they are.
RTCInboundRtpStreamStats.firCount - Web APIs
the
higher fircount is, the more often frames were dropped, which may be an indication that the media's bit rate is too
high for the available bandwidth, or that the receiving device is overburdened and is therefore unable to process the incoming data.
RTCOutboundRtpStreamStats.firCount - Web APIs
the
higher fircount is, the more often frames were dropped, which may be an indication that the media's bit rate is too
high for the available bandwidth, or that the receiving device is overburdened and is therefore unable to process the incoming data.
RTCRemoteOutboundRtpStreamStats - Web APIs
remotetimestamp a dom
highrestimestamp specifying the timestamp (on the remote device) at which the statistics in the rtcremoteoutboundrtpstreamstats object were sent by the remote endpoint.
RTCRtpContributingSource.rtpTimestamp - Web APIs
the read-only rtptimestamp property of the rtcrtpcontributingsource interface returns a dom
highrestimestamp indicating the source-generated time at which the media contained int he packet was first sampled or obtained.
RTCRtpContributingSource - Web APIs
timestamp optional a dom
highrestimestamp indicating the most recent time at which a frame originating from this source was delivered to the receiver's mediastreamtrack specifications specification status comment webrtc 1.0: real-time communication between browsersthe definition of 'rtcrtpcontributingsource' in that specification.
RTCRtpStreamStats.firCount - Web APIs
the
higher fircount is, the more often frames were dropped, which may be an indication that the media's bit rate is too
high for the available bandwidth, or that the receiving device is overburdened and is therefore unable to process the incoming data.
RTCStats - Web APIs
timestamp a dom
highrestimestamp object indicating the time at which the sample was taken for this statistics object.
RTCStatsReport - Web APIs
timestamp a dom
highrestimestamp object indicating the time at which the sample was taken for this statistics object.
Range.setEnd() - Web APIs
the range.setend() method sets the end position of a range to be located at the given offset into the specified node x.setting the end point above (
higher in the document) than the start point will result in a collapsed range with the start and end points both set to the specified end position.
Using the Resource Timing API - Web APIs
the interface's properties create a resource loading timeline with
high-resolution timestamps for network events such as redirect start and end times, fetch start, dns lookup start and end times, response start and end times, etc.
SpeechSynthesisUtterance.rate - Web APIs
it can range between 0.1 (lowest) and 10 (
highest), with 1 being the default pitch for the current platform or voice, which should correspond to a normal speaking rate.
SpeechSynthesisUtterance.volume - Web APIs
syntax var myvolume = speechsynthesisutteranceinstance.volume; speechsynthesisutteranceinstance.volume = 0.5; value a float that represents the volume value, between 0 (lowest) and 1 (
highest.) if ssml is used, this value will be overridden by prosody tags in the markup.
TextMetrics.fontBoundingBoxAscent - Web APIs
the read-only fontboundingboxascent property of the textmetrics interface is a double giving the distance from the horizontal line indicated by the canvasrenderingcontext2d.textbaseline attribute to the top of the
highest bounding rectangle of all the fonts used to render the text, in css pixels.
TextMetrics - Web APIs
textmetrics.fontboundingboxascent read only is a double giving the distance from the horizontal line indicated by the canvasrenderingcontext2d.textbaseline attribute to the top of the
highest bounding rectangle of all the fonts used to render the text, in css pixels.
Touch() - Web APIs
​"force", optional and defaulting to 0, of type float, that is the relative value of pressure applied, in the range 0 to 1, where 0 is no pressure, and 1 is the
highest level of pressure the touch device is capable of sensing; 0 if no value is known.
Touch.force - Web APIs
this property is a relative value of pressure applied, in the range 0.0 to 1.0, where 0.0 is no pressure, and 1.0 is the
highest level of pressure the touch device is capable of sensing.
URL API - Web APIs
for instance, try https://url-api.glitch.me?from=mdn&excitement=
high&likelihood=inconceivable.
User Timing API - Web APIs
duration - set to a dom
highrestimestamp that is the duration of the measure (typically, the end mark timestamp minus the start mark timestamp).
VideoPlaybackQuality.creationTime - Web APIs
syntax value = videoplaybackquality.creationtime; value a dom
highrestimestamp object which indicates the number of milliseconds that elapased between the time the browsing context was created and the time at which this sample of the video quality was obtained.
VideoPlaybackQuality - Web APIs
creationtime read only a dom
highrestimestamp containing the time in miliseconds between the start of the navigation and the creation of the object.
WEBGL_compressed_texture_atc - Web APIs
compressed textures reduce the amount of memory needed to store a texture on the gpu, allowing for
higher resolution textures or more of the same resolution textures.
WEBGL_compressed_texture_etc - Web APIs
compressed textures reduce the amount of memory needed to store a texture on the gpu, allowing for
higher resolution textures or more of the same resolution textures.
WEBGL_compressed_texture_etc1 - Web APIs
compressed textures reduce the amount of memory needed to store a texture on the gpu, allowing for
higher resolution textures or more of the same resolution textures.
WEBGL_compressed_texture_pvrtc - Web APIs
compressed textures reduce the amount of memory needed to store a texture on the gpu, allowing for
higher resolution textures or more of the same resolution textures.
WEBGL_compressed_texture_s3tc - Web APIs
compressed textures reduce the amount of memory needed to store a texture on the gpu, allowing for
higher resolution textures or more of the same resolution textures.
WEBGL_draw_buffers - Web APIs
shader will write to using gl_fragdata: ext.drawbufferswebgl([ ext.color_attachment0_webgl, // gl_fragdata[0] ext.color_attachment1_webgl, // gl_fragdata[1] ext.color_attachment2_webgl, // gl_fragdata[2] ext.color_attachment3_webgl // gl_fragdata[3] ]); shader code that writes to multiple textures: <script type="x-shader/x-fragment"> #extension gl_ext_draw_buffers : require precision
highp float; void main(void) { gl_fragdata[0] = vec4(0.25); gl_fragdata[1] = vec4(0.5); gl_fragdata[2] = vec4(0.75); gl_fragdata[3] = vec4(1.0); } </script> specifications specification status comment webgl_draw_buffersthe definition of 'webgl_draw_buffers' in that specification.
WebGLRenderingContext.isContextLost() - Web APIs
examples include: two or more pages are using the gpu, but together place too
high a demand on the gpu, so the browser tells the two contexts that they've lost the connection, then selects one of the two to restore access for.
A basic 2D WebGL animation example - Web APIs
since we're drawing a solid, untextured object with no lighting applied, this is exceptionally simple: <script id="fragment-shader" type="x-shader/x-fragment"> #ifdef gl_es precision
highp float; #endif uniform vec4 uglobalcolor; void main() { gl_fragcolor = uglobalcolor; } </script> this starts by specifying the precision of the float type, as required.
Hello vertex attributes - Web APIs
<canvas>your browser does not seem to support html5 canvas.</canvas> body { text-align : center; } canvas { width : 280px; 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; } </script> <script type="x-shader/x-fragment" id="fragment-shader"> #version 100 precision mediump float; void main() { gl_fragcolor = vec4(0.18, 0.54, 0.34, 1.0); } </script> ;(function(){ "use strict" window.addeventlistener("load", setupwebgl, false); var gl, pro...
Textures from code - Web APIs
<canvas>your browser does not seem to support html5 canvas.</canvas> body { text-align : center; } canvas { width : 280px; 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 vec2 position; void main() { gl_position = vec4(position, 0.0, 1.0); gl_pointsize = 128.0; } </script> <script type="x-shader/x-fragment" id="fragment-shader"> #version 100 precision mediump float; void main() { vec2 fragmentposition = 2.0*gl_pointcoord - 1.0; float distance = length(fragmentposition); float distancesqrd = distance * distance; gl_fragcolor = vec4...
WebRTC coding guide - Web APIs
if you need to learn more about the fundamentals of how webrtc and its protocols work, check out our
high-level guides for webrtc.
Using DTMF with WebRTC - Web APIs
this article offers a brief
high-level overview of how dtmf works over webrtc, then provides a guide for everyday developers about how to send dtmf over an rtcpeerconnection.
Inputs and input sources - Web APIs
user-selected the most complex way to determine a primary input source is
highly flexible but can require a great deal of work to implement.
Web Audio API - Web APIs
timing is controlled with
high precision and low latency, allowing developers to write code that responds accurately to events and is able to target specific samples, even at a
high sample rate.
Using Web Workers - Web APIs
passing data by transferring ownership (transferable objects) google chrome 17+ and firefox 18+ 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.
Window.captureEvents() - Web APIs
unction reg() { window.captureevents(event.click); window.onclick = page_click; } function page_click() { alert('page click event detected!'); } </script> </head> <body onload="reg();"> <p>click anywhere on this page.</p> </body> </html> notes events raised in the dom by user activity (such as clicking buttons or shifting focus away from the current document) generally pass through the
high-level window and document objects first before arriving at the object that initiated the event.
Window.devicePixelRatio - Web APIs
other values may be returned as well in the case of unusually low resolution displays or, more often, when a screen has a
higher pixel depth than simply double the standard resolution of 96 or 76 dpi.
Window.find() - Web APIs
" + window.find(text)); } html <p>apples, bananas, and oranges.</p> <button type="button" onclick='findstring("apples")'>search for apples</button> <button type="button" onclick='findstring("banana")'>search for banana</button> <button type="button" onclick='findstring("orange")'>search for orange</button> result notes in some browsers, window.find() selects (
highlights) the found content on the site.
WindowOrWorkerGlobalScope.queueMicrotask() - Web APIs
this lets your code run without interfering with any other, potentially
higher priority, code that is pending, but before the browser regains control over the execution context, potentially depending on work you need to complete.
WindowOrWorkerGlobalScope - Web APIs
this lets your code run without interfering with other, possibly
higher priority, code, but before the browser runtime regains control, potentially depending upon the work you need to complete.
Worklet.addModule() - Web APIs
let.addmodule('modules/bypassfilter.js', { credentials: 'omit', }); paintworklet example css.paintworklet.addmodule('https://mdn.github.io/houdini-examples/csspaint/intro/worklets/hilite.js'); once a paintworklet is included, the css paint() function can be used to include the image created by the worklet: @supports (background-image: paint(id)) { h1 { background-image: paint(hollow
highlights, filled, 3px); } } specifications specification status comment worklets level 1the definition of 'addmodule()' in that specification.
WritableStream.getWriter() - Web APIs
defaultwriter.ready .then(() => { defaultwriter.close(); }) .then(() => { console.log("all chunks written"); }) .catch((err) => { console.log("stream error:", err); }); } const decoder = new textdecoder("utf-8"); const queuingstrategy = new countqueuingstrategy({
highwatermark: 1 }); let result = ""; const writablestream = new writablestream({ // implement the sink write(chunk) { return new promise((resolve, reject) => { var buffer = new arraybuffer(2); var view = new uint16array(buffer); view[0] = chunk; var decoded = decoder.decode(view, { stream: true }); var listitem = document.createelement('li'); listitem.textc...
WritableStreamDefaultWriter.WritableStreamDefaultWriter() - Web APIs
defaultwriter.ready .then(() => { defaultwriter.close(); }) .then(() => { console.log("all chunks written"); }) .catch((err) => { console.log("stream error:", err); }); } const decoder = new textdecoder("utf-8"); const queuingstrategy = new countqueuingstrategy({
highwatermark: 1 }); let result = ""; const writablestream = new writablestream({ // implement the sink write(chunk) { return new promise((resolve, reject) => { var buffer = new arraybuffer(2); var view = new uint16array(buffer); view[0] = chunk; var decoded = decoder.decode(view, { stream: true }); var listitem = document.createelement('li'); listitem.textc...
WritableStreamDefaultWriter.close() - Web APIs
defaultwriter.ready .then(() => { defaultwriter.close(); }) .then(() => { console.log("all chunks written"); }) .catch((err) => { console.log("stream error:", err); }); } const decoder = new textdecoder("utf-8"); const queuingstrategy = new countqueuingstrategy({
highwatermark: 1 }); let result = ""; const writablestream = new writablestream({ // implement the sink write(chunk) { return new promise((resolve, reject) => { var buffer = new arraybuffer(2); var view = new uint16array(buffer); view[0] = chunk; var decoded = decoder.decode(view, { stream: true }); var listitem = document.createelement('li'); listitem.textc...
WritableStreamDefaultWriter.write() - Web APIs
defaultwriter.ready .then(() => { defaultwriter.close(); }) .then(() => { console.log("all chunks written"); }) .catch((err) => { console.log("stream error:", err); }); } const decoder = new textdecoder("utf-8"); const queuingstrategy = new countqueuingstrategy({
highwatermark: 1 }); let result = ""; const writablestream = new writablestream({ // implement the sink write(chunk) { return new promise((resolve, reject) => { var buffer = new arraybuffer(2); var view = new uint16array(buffer); view[0] = chunk; var decoded = decoder.decode(view, { stream: true }); var listitem = document.createelement('li'); listitem.textc...
WritableStreamDefaultWriter - Web APIs
defaultwriter.ready .then(() => { defaultwriter.close(); }) .then(() => { console.log("all chunks written"); }) .catch((err) => { console.log("stream error:", err); }); } const decoder = new textdecoder("utf-8"); const queuingstrategy = new countqueuingstrategy({
highwatermark: 1 }); let result = ""; const writablestream = new writablestream({ // implement the sink write(chunk) { return new promise((resolve, reject) => { var buffer = new arraybuffer(2); var view = new uint16array(buffer); view[0] = chunk; var decoded = decoder.decode(view, { stream: true }); var listitem = document.createelement('li'); lis...
Sending and Receiving Binary Data - Web APIs
var filestream = load_binary_resource(url); var abyte = filestream.charcodeat(x) & 0xff; // throw away
high-order byte (f7) the example above fetches the byte at offset x within the loaded binary data.
XRFrameRequestCallback - Web APIs
syntax function xrframerequestcallback(time, xrframe){ // process xrframe here } xrsession.requestanimationframe(xrframerequestcallback) parameters dom
highrestimestamp a timestamp corresponding to the returned xrframe.
XRTargetRayMode - Web APIs
the targeted point or object might be indicated by drawing a shape or
highlighting the targeted surface or object.
ARIA: Mark role - Accessibility
the mark landmark role semantically denotes html elements containing text that is marked/
highlighted for reference purposes.
ARIA: heading role - Accessibility
although theoretically you can go
higher, and some screen readers may support it, the results can be unpredictable with other browser/screen reader combinations.
ARIA: listbox role - Accessibility
it is
highly recommended to use the html select element, or a group of radio buttons if only one item can be selected, or a group of checkboxes if multiple items can be selected, because there is a lot of keyboard interactivity to manage focus for all the descendants, and native html elements provide this functionality for you for free.
WAI-ARIA Roles - Accessibility
the main content area consists of content that is directly related to or expands upon the central topic of a document, or the central functionality of an application.aria: mark rolethe mark landmark role semantically denotes html elements containing text that is marked/
highlighted for reference purposes.
Web applications and ARIA FAQ - Accessibility
for example, a screen reader uses this api to read the user interface with a text-to-speech engine, a magnifier uses it to
highlight important or active areas of the screen, and an onscreen keyboard might use it to provide the most efficient keyboard layout for a given context or ui control.
Understandable - Accessibility
3.1.5 reading level (aaa) if text is provided that requires a
higher reading level that lower secondary education level (typically children around 11-14 years old), provide supplementary explainer material to help people who can't read it, or provide an alternative version that is written at lower secondary level.
::grammar-error - CSS: Cascading Style Sheets
allowable properties only a small subset of css properties can be used in a rule with ::grammar-error in its selector: color background-color cursor caret-color outline and its longhands text-decoration and its associated properties text-emphasis-color text-shadow syntax ::grammar-error examples simple document grammar check in this example, eventual supporting browsers should
highlight any flagged grammatical errors with the styles shown.
::spelling-error - CSS: Cascading Style Sheets
allowable properties only a small subset of css properties can be used in a rule with ::spelling-error in its selector: color background-color cursor caret-color outline and its longhands text-decoration and its associated properties text-emphasis-color text-shadow syntax ::spelling-error examples simple document spell check in this example, eventual supporting browsers should
highlight any flagged spelling errors with the styles shown.
:blank - CSS: Cascading Style Sheets
syntax :blank examples simple :blank example in eventual supporting browsers, the :blank pseudo-class will enable developers to
highlight in some way input controls that are not required, but still have no content filled in, perhaps as a reminder to users.
:focus-within - CSS: Cascading Style Sheets
(this includes descendants in shadow trees.) /* selects a <div> when one of its descendants is focused */ div:focus-within { background: cyan; } this selector is useful, to take a common example, for
highlighting an entire <form> container when the user focuses on one of its <input> fields.
:placeholder-shown - CSS: Cascading Style Sheets
html <input id="input1" placeholder="name, rank, and serial number"> <br><br> <input id="input2" placeholder="name, rank, and serial number"> css #input2:placeholder-shown { text-overflow: ellipsis; } result customized input field the following example
highlights the branch and id code fields with a custom style.
:required - CSS: Cascading Style Sheets
/* selects any required <input> */ input:required { border: 1px dashed red; } this pseudo-class is useful for
highlighting fields that must have valid data before a form can be submitted.
:target - CSS: Cascading Style Sheets
; } for example, the following url has a fragment (denoted by the # sign) that points to an element called section2: http://www.example.com/index.html#section2 the following element would be selected by a :target selector when the current url is equal to the above: <section id="section2">example</section> syntax :target examples a table of contents the :target pseudo-class can be used to
highlight the portion of a page that has been linked to from a table of contents.
:valid - CSS: Cascading Style Sheets
/* selects any valid <input> */ input:valid { background-color: powderblue; } this pseudo-class is useful for
highlighting correct fields for the user.
:where() - CSS: Cascading Style Sheets
footer a { color: blue; } this won't work for the red links, because the selectors inside :is() count towards the specificity of the overall selector, and class selectors have a
higher specificity than element selectors.
color - CSS: Cascading Style Sheets
examples html <p>this text should be black on non-color devices, red on devices with a low number of colors, and greenish on devices with a
high number of colors.</p> css p { color: black; } /* any color device */ @media (color) { p { color: red; } } /* any color device with at least 8 bits per color component */ @media (min-color: 8) { p { color: #24ba13; } } result specifications specification status comment media queries level 4the definition of 'color' in that specification.
forced-colors - CSS: Cascading Style Sheets
color fill stroke text-decoration-color text-emphasis-color border-color outline-color column-rule-color scrollbar-color -webkit-tap-
highlight-color box-shadow text-shadow you can use system color keywords with any property other than those listed above, to ensure that the rest of the page integrates with the restricted color palette available in forced colors mode.
Box alignment in CSS Grid Layout - CSS: Cascading Style Sheets
"a a b" "a a b" "c d d"; } .item1 { grid-area: a; margin-left: auto; } .item2 { grid-area: b; } .item3 { grid-area: c; } .item4 { grid-area: d; } <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> you can see how the item is aligned by using the firefox grid
highlighter: alignment and writing modes in all of these examples i have been working in english, which is a left-to-right language.
Using CSS transitions - CSS: Cascading Style Sheets
height; transition-duration: 3s, 5s, 3s, 5s; } similarly, if any property's value list is longer than that for transition-property, it's truncated, so if you have the following css: div { transition-property: opacity, left; transition-duration: 3s, 5s, 2s, 1s; } this gets interpreted as: div { transition-property: opacity, left; transition-duration: 3s, 5s; } using transitions when
highlighting menus a common use of css is to
highlight items in a menu as the user hovers the mouse cursor over them.
CSS Layout cookbook - CSS: Cascading Style Sheets
in addition to providing code you can use as a starting point in your projects, these recipes
highlight the different ways layout specifications can be used, and the choices you can make as a developer.
Mozilla CSS extensions - CSS: Cascading Style Sheets
border-style and outline-style -moz-bg-insetobsolete since gecko 1.9 -moz-bg-outsetobsolete since gecko 1.9 -moz-bg-solidobsolete since gecko 1.9 <color> keywords -moz-activehyperlinktext -moz-hyperlinktext -moz-visitedhyperlinktext -moz-buttondefault -moz-buttonhoverface -moz-buttonhovertext -moz-default-background-color -moz-default-color -moz-cell
highlight -moz-cell
highlighttext -moz-field -moz-fieldtext -moz-dialog -moz-dialogtext -moz-dragtargetzone -moz-mac-accentdarkestshadow -moz-mac-accentdarkshadow -moz-mac-accentface -moz-mac-accentlightest
highlight -moz-mac-accentlightshadow -moz-mac-accentregular
highlight -moz-mac-accentregularshadow -moz-mac-chrome-active -moz-mac-chrome-inactive -moz-mac-focusring -moz-mac-menusele...
background-attachment - CSS: Cascading Style Sheets
however, on the second time round, she came upon a low curtain she had not noticed before, and behind it was a little door about fifteen inches
high: she tried the little golden key in the lock, and to her great delight it fitted!
background-color - CSS: Cascading Style Sheets
accessibility concerns it is important to ensure that the contrast ratio between the background color and the color of the text placed over it is
high enough that people experiencing low vision conditions will be able to read the content of the page.
box-flex-group - CSS: Cascading Style Sheets
/* <integer> values */ box-flex-group: 1; box-flex-group: 5; /* global values */ box-flex-group: inherit; box-flex-group: initial; box-flex-group: unset; for flexible elements assigned to flex groups, the first flex group is 1 and
higher values specify subsequent flex groups.
color - CSS: Cascading Style Sheets
accessibility concerns it is important to ensure that the contrast ratio between the color of the text and the background the text is placed over is
high enough that people experiencing low vision conditions will be able to read the content of the page.
cross-fade() - CSS: Cascading Style Sheets
it can be used for many simple image manipulations, such as tinting an image with a solid color or
highlighting a particular area of the page by combining an image with a radial gradient.
opacity - CSS: Cascading Style Sheets
for example: background: rgba(0, 0, 0, 0.4); accessibility concerns if text opacity is adjusted, it is important to ensure that the contrast ratio between the color of the text and the background the text is placed over is
high enough that people experiencing low vision conditions will be able to read the content of the page.
outline-color - CSS: Cascading Style Sheets
if the color of the outline is adjusted, it is important to ensure that the contrast ratio between it and the background the outline is placed over is
high enough that people experiencing low vision conditions will be able to perceive it.
paint() - CSS: Cascading Style Sheets
<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 18</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, 90%, 60%, 1.0); background-image: paint(hollow
highlights, stroke, 2px); } li:nth-of-type(3n) { --boxcolor: hsla(155, 90%, 60%, 1.0); background-image: paint(hollow
highlights, filled, 3px); } li:nth-of-type(3n+1) { --boxcolor: hsla(255, 90%, 60%, 1.0); background-image: paint(hollow
highlights, stroke, 1px); } we've included a custom property in the selector block defining a boxcolor.
scrollbar-width - CSS: Cascading Style Sheets
and introduced in wcag 2.1, criterion 2.5.5 (target size) advises that touch targets should be at least 44px in width and height (although the problem is compounded on
high-resolution screens; thorough testing is advised).
text-decoration-color - CSS: Cascading Style Sheets
accessibility concerns it is important to ensure that the contrast ratio between the color of the text, the background the text is placed over, and the text decoration line is
high enough that people experiencing low vision conditions will be able to read the content of the page.
CSS: Cascading Style Sheets
in addition to providing code you can use as a starting point in your projects, these recipes
highlight the different ways layout specifications can be used, and the choices you can make as a developer.
Math (math) - EXSLT
math:
highest()math:
highest() returns the node in the specified node-set with the
highest value (where the
highest value calculated using math:max()).math:lowest()math:lowest() returns the node in the specified node-set with the lowest value (where the lowest value calculated using math:min()).math:max()math:max() returns the maximum value of a node-set.math:min()math:min() returns the minimum value of a node-set.
EXSLT
functions math:
highest() math:lowest() math:max() math:min() regular expressions the exslt regular expressions package provides functions that allow testing, matching, and replacing text using javascript style regular expressions.
Getting Started - Developer guides
if you used a synchronous request you don't need to specify a function, but this is
highly discouraged as it makes for an awful user experience.
Guide to Web APIs - Developer guides
web apis from a to z aambient light eventsbbackground tasksbattery api beaconbluetooth apibroadcast channel apiccss counter stylescss font loading api cssomcanvas apichannel messaging apiconsole apicredential management apiddomeencoding apiencrypted media extensionsffetch apifile system api frame timing apifullscreen apiggamepad api geolocation apihhtml drag and drop api
high resolution timehistory apiiimage capture apiindexeddbintersection observer apillong tasks api mmedia capabilities api media capture and streamsmedia session apimedia source extensions mediastream recordingnnavigation timingnetwork information api ppage visibility apipayment request apiperformance apiperformance timeline apipermissions apipointer eventspointer lock apiproximity events push ap...
Introduction to HTML5 - Developer guides
keep in mind that it's still
highly recommended that one writes valid mark-up, as such code is easier to read and maintain, and it greatly decreases the prominence of incompatibilities that exists in various older browsers.
HTML5 - Developer guides
indexeddb indexeddb is a web standard for the storage of significant amounts of structured data in the browser and for
high performance searches on this data using indexes.
HTML attribute: max - HTML: Hypertext Markup Language
syntax for max values for other elements input type syntax example <progress> <number> <progress id="file" max="100" value="70"> 70% </progress> <meter> <number> <meter id="fuel" min="0" max="100" low="33"
high="66" optimum="80" value="40"> at 40/100</meter> ...
Resource URLs - HTTP
for example, a script on browserleaks
highlights what firefox reveals when queried by a simple script running on the site (you can find the code in https://browserleaks.com/firefox#more).
CSP: upgrade-insecure-requests - HTTP
<img src="https://example.com/image.png"> <img src="https://not-example.com/image.png"> navigational upgrades to third-party resources brings a significantly
higher potential for breakage, these are not upgraded: <a href="https://example.com/">home</a> <a href="http://not-example.com/">home</a> finding insecure requests with the help of the content-security-policy-report-only header and the report-uri directive, you can set-up an enforced policy and a reported policy like this: content-security-policy: upgrade-insecure-requests; default-src https: cont...
Save-Data - HTTP
this could be for reasons such as
high transfer costs, slow connection speeds, etc.
HTTP Messages - HTTP
conclusion http messages are the key in using http; their structure is simple, and they are
highly extensible.
CSS Houdini
li { background-image: paint(mycomponent, stroke, 10px); --
highlights: blue; --lowlights: green; } note: with great power comes great responsibility!
Control flow and error handling - JavaScript
type userexception function userexception(message) { this.message = message; this.name = 'userexception'; } // make the exception convert to a pretty string when used as a string // (e.g., by the error console) userexception.prototype.tostring = function() { return `${this.name}: "${this.message}"`; } // create an instance of the object type and throw it throw new userexception('value too
high'); try...catch statement the try...catch statement marks a block of statements to try, and specifies one or more responses should an exception be thrown.
Functions - JavaScript
so, the inner-most scope takes the
highest precedence, while the outer-most scope takes the lowest.
Grammar and types - JavaScript
(this is similar to string interpolation features in perl, python, and more.) optionally, a tag can be added to allow the string construction to be customized, avoiding injection attacks, or constructing
higher-level data structures from string contents.
Indexed collections - JavaScript
this means that the length property will be one more than the
highest index stored in the array: let cats = [] cats[30] = ['dusty'] console.log(cats.length) // 31 you can also assign to the length property.
Using Promises - JavaScript
specifically, a nested catch only catches failures in its scope and below, not errors
higher up in the chain outside the nested scope.
URIError: malformed URI sequence - JavaScript
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('\ud800'); // "urierror: malformed uri sequence" encodeuri('\udfff'); // "urierror: malformed uri sequence" a
high-low pair is ok.
InternalError: too much recursion - JavaScript
function loop(x) { if (x >= 10) // "x >= 10" is the exit condition return; // do stuff loop(x + 1); // the recursive call } loop(0); setting this condition to an extremely
high value, won't work: function loop(x) { if (x >= 1000000000000) return; // do stuff loop(x + 1); } loop(0); // internalerror: too much recursion this recursive function is missing a base case.
Array - JavaScript
the javascript array class is a global object that is used in the construction of arrays; which are
high-level, list-like objects.
Date - JavaScript
in milliseconds // to test a function and get back its return function printelapsedtime(ftest) { let nstarttime = date.now(), vreturn = ftest(), nendtime = date.now() console.log(`elapsed time: ${ string(nendtime - nstarttime) } milliseconds`) return vreturn } let yourfunctionreturn = printelapsedtime(yourfunction) note: in browsers that support the web performance api's
high-resolution time feature, performance.now() can provide more reliable and precise measurements of elapsed time than date.now().
Function.prototype.apply() - JavaScript
to illustrate this latter case: if such an engine had a limit of four arguments (actual limits are of course significantly
higher), it would be as if the arguments 5, 6, 2, 3 had been passed to apply in the examples above, rather than the full array.
InternalError - JavaScript
function loop(x) { if (x >= 10) // "x >= 10" is the exit condition return; // do stuff loop(x + 1); // the recursive call } loop(0); setting this condition to an extremely
high value, won't work: function loop(x) { if (x >= 1000000000000) return; // do stuff loop(x + 1); } loop(0); // internalerror: too much recursion for more information, see internalerror: too much recursion.
Math.fround() - JavaScript
description javascript uses 64-bit double floating-point numbers internally, which offer a very
high precision.
Math.imul() - JavaScript
polyfill this can be emulated with the following function: if (!math.imul) math.imul = function(a, b) { var ahi = (a >>> 16) & 0xffff; var alo = a & 0xffff; var bhi = (b >>> 16) & 0xffff; var blo = b & 0xffff; // the shift by 0 fixes the sign on the
high part // the final |0 converts the unsigned value into a signed value return ((alo * blo) + (((ahi * blo + alo * bhi) << 16) >>> 0) | 0); }; however, the following function is more performant because it is likely that browsers in which this polyfill would be used do not optimize with an internal integer type in javascript, instead using floating points for all numbers.
Math.random() - JavaScript
if extremely large bounds are chosen (253 or
higher), it's possible in extremely rare cases to calculate the usually-excluded upper bound.
Math.random() - JavaScript
if extremely large bounds are chosen (253 or
higher), it's possible in extremely rare cases to calculate the usually-excluded upper bound.
Math.round() - JavaScript
description if the fractional portion of the argument is greater than 0.5, the argument is rounded to the integer with the next
higher absolute value.
Number.MAX_SAFE_INTEGER - JavaScript
polyfill if (!number.max_safe_integer) { number.max_safe_integer = 9007199254740991; // math.pow(2, 53) - 1; } examples return value of max_safe_integer number.max_safe_integer; // 9007199254740991 numbers
higher than safe integer this returns 2 because in floating points, the value is actually the decimal trailing "1" except for in subnormal precision cases such as zero.
SharedArrayBuffer - JavaScript
apis which use sharedarraybuffer objects webglrenderingcontext.bufferdata() webglrenderingcontext.buffersubdata() webgl2renderingcontext.getbuffersubdata() security requirements shared memory and
high-resolution timers were effectively disabled at the start of 2018 in light of spectre.
String.prototype.codePointAt() - JavaScript
: 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 >= 0xd800 && 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 - 0xd800) * 0x400 + second - 0xdc00 + 0x10000; } } return first; }; if (de...
String.fromCodePoint() - JavaScript
or("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) + 0xd800, //
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 object.definep...
WebAssembly.Module.customSections() - JavaScript
(read
high level structure for information on section structures, and how normal sections ("known sections") and custom sections are distinguished.) this provides developers with a way to include custom data inside wasm modules for other purposes, for example the name custom section, which allows developers to provide names for all the functions and locals in the module (like "symbols" in a native build).
encodeURI() - JavaScript
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('\ud800\udfff')); // lone
high surrogate throws "urierror: malformed uri sequence" console.log(encodeuri('\ud800')); // lone low surrogate throws "urierror: malformed uri sequence" console.log(encodeuri('\udfff')); encoding fo...
encodeURIComponent() - JavaScript
20123 (the space gets encoded as %20) console.log(encodeuricomponent(set1)); // %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('\ud800\udfff')); // lone
high surrogate throws "urierror: malformed uri sequence" console.log(encodeuricomponent('\ud800')); // 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.
escape() - JavaScript
(hh are two hexadecimal digits, and the form \xhh\xhh is used for
higher-plane unicode characters.) escaped characters in string literals can be expanded by replacing the \x with %, then using the decodeuricomponent() function.
Exponentiation (**) - JavaScript
in most languages, such as php, python, and others that have an exponentiation operator (**), the exponentiation operator is defined to have a
higher precedence than unary operators, such as unary + and unary -, but there are a few exceptions.
Grouping operator ( ) - JavaScript
syntax ( ) description the grouping operator consists of a pair of parentheses around an expression or sub-expression to override the normal operator precedence so that expressions with lower precedence can be evaluated before an expression with
higher priority.
async function - JavaScript
this
highlights the subtle difference between return foo; and return await foo; — return foo immediately returns foo and never throws, even if foo is a promise that rejects.
Media container formats (file types) - Web media technologies
consider using this container format general purpose video, preferably in an open format webm (ideally with mp4 fallback) general purpose video mp4 (ideally with webm or ogg fallback)
high compression optimized for slow connections 3gp (ideally with mp4 fallback) compatibility with older devices/browsers quicktime (ideally with avi and/or mpeg-2 fallback) these suggestions make a number of assumptions.
Image file type and format guide - Web media technologies
png (portable network graphics) the png (pronounced "ping") image format uses lossless or lossy compression to provide more efficient compression, and supports
higher color depths than gif, as well as full alpha transparency support.
Add to Home screen - Progressive web apps (PWAs)
(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.
order - SVG: Scalable Vector Graphics
it is recommended that only small values (e.g., 3) be used;
higher values may result in very
high cpu overhead and usually do not produce results that justify the impact on performance.
stroke-dashoffset - SVG: Scalable Vector Graphics
y1="7" x2="30" y2="7" stroke="black" stroke-dasharray="3 1" stroke-dashoffset="-3" /> <!-- the start of the dash array computation is pulled by 1 user units which ends up in the same rendering as the previous example --> <line x1="0" y1="9" x2="30" y2="9" stroke="black" stroke-dasharray="3 1" stroke-dashoffset="1" /> <!-- the following red lines
highlight the offset of the dash array for each line --> <path d="m0,5 h-3 m0,7 h3 m0,9 h-1" stroke="rgba(255,0,0,.5)" /> </svg> usage notes value <percentage> | <length> default value 0 animatable yes the offset is usually expressed in user units resolved against the pathlength but if a <percentage> is used, the value is resolved as a percentage ...
stroke-miterlimit - SVG: Scalable Vector Graphics
,-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 l0.5,3 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 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...