Search completed in 1.33 seconds.
nsIFocusManager
dom/interfaces/base/nsi
focusmanager.idlscriptable please add a summary to this article.
... 1.0 66 introduced gecko 1.9.2 inherits from: nsisupports last changed in gecko 5.0 (firefox 5.0 / thunderbird 5.0 / seamonkey 2.2) implemented by: @mozilla.org/
focus-manager;1 as a service: var
focusmanager = components.classes["@mozilla.org/
focus-manager;1"] .getservice(components.interfaces.nsi
focusmanager); method overview void clear
focus(in nsidomwindow awindow); void contentremoved(in nsidocument adocument, in nsicontent aelement); native code only!
... void
focusplugin(in nsicontent aplugin); native code only!
...And 58 more matches
Focus and Selection - Archive of obsolete content
« previousnext » the section will describe how to handle the
focus and selection of elements.
...
focused elements the
focused element refers to the element which currently receives input events.
... if there are three textboxes on a window, the one that has the
focus is the one that the user can currently enter text into.
...And 48 more matches
Focus management with Vue refs - Learn web development
the last bit of functionality to look at is
focus management, or put another way, how we can improve our app's keyboard accessibility.
... objective: to learn how to handle
focus management using vue refs.
... the
focus management problem while we do have working edit functionality, we aren't providing a great experience for non-mouse users.
...And 38 more matches
:focus-visible - CSS: Cascading Style Sheets
the :
focus-visible pseudo-class applies while an element matches the :
focus pseudo-class and the ua (user agent) determines via heuristics that the
focus should be made evident on the element.
... (many browsers show a “
focus ring” by default in this case.) this selector is useful to provide a different
focus indicator based on the user’s input modality (mouse vs.
... note that firefox supports similar functionality through an older, prefixed pseudo-class — :-moz-
focusring.
...And 10 more matches
HTMLElement.focus() - Web APIs
the htmlelement.
focus() method sets
focus on the specified element, if it can be
focused.
... the
focused element is the element which will receive keyboard and similar events by default.
... syntax element.
focus(options); // object parameter parameters options optional an optional object providing options to control aspects of the
focusing process.
...And 9 more matches
:focus - CSS: Cascading Style Sheets
the :
focus css pseudo-class represents an element (such as a form input) that has received
focus.
... /* selects any <input> when
focused */ input:
focus { color: red; } note: this pseudo-class applies only to the
focused element itself.
... use :
focus-within if you want to select an element that contains a
focused element.
...And 8 more matches
Document.hasFocus() - Web APIs
the has
focus() method of the document interface returns a boolean value indicating whether the document or any element inside the document has
focus.
... this method can be used to determine whether the active element in a document has
focus.
... when viewing a document, an element with
focus is always the active element in the document, but an active element does not necessarily have
focus.
...And 6 more matches
GlobalEventHandlers.onfocus - Web APIs
the on
focus property of the globaleventhandlers mixin is an eventhandler that processes
focus events on the given element.
... the
focus event is raised when the user sets
focus on an element.
... for on
focus to fire on non-input elements, they must be given the tabindex attribute (see building keyboard accessibility back in for more details).
...And 6 more matches
-moz-user-focus - CSS: Cascading Style Sheets
the -moz-user-
focus css property is used to indicate whether an element can have the
focus.
... /* keyword values */ -moz-user-
focus: normal; -moz-user-
focus: ignore; /* global values */ -moz-user-
focus: inherit; -moz-user-
focus: initial; -moz-user-
focus: unset; by setting its value to ignore, you can disable
focusing the element, which means that the user will not be able to activate the element.
... initial valuenoneapplies toall elementsinheritednocomputed valueas specifiedanimation typediscrete note: this property doesn't work for xul <xul:textbox> elements, because the textbox itself never takes
focus.
...And 6 more matches
CanvasRenderingContext2D.drawFocusIfNeeded() - Web APIs
the canvasrenderingcontext2d.draw
focusifneeded() method of the canvas 2d api draws a
focus ring around the current or given path, if the specified element is
focused.
... syntax void ctx.draw
focusifneeded(element); void ctx.draw
focusifneeded(path, element); parameters element the element to check whether it is
focused or not.
... examples managing button
focus this example draws two buttons on a canvas.
...And 4 more matches
nsIWebBrowserChromeFocus
embedding/browser/webbrowser/nsiwebbrowserchrome
focus.idlscriptable implemented by the same object as nsiembeddingsitewindow.
... it represents the
focus up-calls from mozilla to the embedding chrome.
... inherits from: nsisupports last changed in gecko 1.7 method overview void
focusnextelement(); void
focusprevelement(); methods
focusnextelement() set the
focus at the next
focusable element in the chrome.
...And 3 more matches
FocusEvent - Web APIs
the
focusevent interface represents
focus-related events, including
focus, blur,
focusin, and
focusout.
...ht="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="153.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">uievent</text></a><polyline points="191,25 201,20 201,30 191,25" stroke="#d4dde4" fill="none"/><line x1="201" y1="25" x2="231" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/
focusevent" target="_top"><rect x="231" y="1" width="100" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="281" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">
focusevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor
focusevent() cr...
...eates a
focusevent event with the given parameters.
...And 3 more matches
Window: focus event - Web APIs
the
focus event fires when an element has received
focus.
... the opposite of
focus is blur.
... bubbles no cancelable no interface
focusevent event handler property on
focus sync / async sync composed yes examples live example this example changes the appearance of a document when it loses
focus.
...And 3 more matches
Element: focus event - Web APIs
the
focus event fires when an element has received
focus.
... the main difference between this event and
focusin is that
focusin bubbles while
focus does not.
... the opposite of
focus is blur.
...And 2 more matches
FocusEvent() - Web APIs
the
focusevent() constructor returns a newly created
focusevent object with an optional eventtarget.
... syntax var
focusevent = new
focusevent(typearg[,
focuseventinit]); properties the
focusevent() constructor also inherits arguments from uievent() and from event().
...
focuseventinit optional is a
focuseventinit dictionary, having the following fields: "relatedtarget", optional and defaulting to null, is an eventtarget representing the secondary target of a
focusevent.
...And 2 more matches
HTMLSelectElement.autofocus - Web APIs
the htmlselectelement.auto
focus property is a boolean that reflects the auto
focus html attribute, which indicates whether the associated <select> element will get input
focus when the page loads, unless the user overrides it.
...if there are several, the first element with the attribute set inserted, usually the first such element on the page, get the initial
focus.
... setting this property doesn't set the
focus to the associated <select> element: it merely tells the browser to
focus to it when the element is inserted in the document.
...And 2 more matches
:-moz-focusring - CSS: Cascading Style Sheets
the :-moz-
focusring css pseudo-class is a mozilla extension that is similar to the :
focus pseudo-class, but it only matches an element if it's currently
focused and a
focus ring or other indicator should be drawn around it.
... if :-moz-
focusring matches, then :
focus also matches, but the converse is not always true: it depends on whether the user agent has
focus ring drawing enabled and how the element was
focused.
... whether the user agent has
focus ring drawing enabled can depend on operating system settings and other factors, so the precise behavior of this pseudo-class will vary from platform to platform.
...And 2 more matches
:focus-within - CSS: Cascading Style Sheets
the :
focus-within css pseudo-class represents an element that has received
focus or contains an element that has received
focus.
... in other words, it represents an element that is itself matched by the :
focus pseudo-class or has a descendant that is matched by :
focus.
... (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.
...And 2 more matches
accessibility.tabfocus
the preference accessibility.tab
focus controls what elements receive
focus when the user presses the tab key.
... type:integer default value: 7 (windows and linux); 2 (mac os x) exists by default: no application support:gecko 1.7 status: active introduction: bugs: bug 140612 values 1 give
focus only to text fields (default on mac osx) 2 give
focus to all form elements except text fields.
... 4 give
focus only to links and linked images.
...the value 7 (give
focus to all elements) is the default on windows and linux.
TakeFocus
« nsiaccessible page summary this method
focuses this accessible node.
... void take
focus(); remarks the state state_
focusable indicates whether this node is normally
focusable.
... it is the callers responsibility to determine whether this node is
focusable.acctake
focus on a node that is not normally
focusable (such as a table), will still set
focus on that node, although normally that will not be visually indicated in most style sheets.
... see also nsiaccessible.
focusedchild ...
Element: focusin event - Web APIs
the
focusin event fires when an element is about to receive
focus.
... the main difference between this event and
focus is that
focusin bubbles while
focus does not.
... the opposite of
focusin is
focusout.
... bubbles yes cancelable no interface
focusevent event handler property on
focusin sync / async sync composed yes examples live example html <form id="form"> <input type="text" placeholder="text input"> <input type="password" placeholder="password"> </form> javascript const form = document.getelementbyid('form'); form.addeventlistener('
focusin', (event) => { event.target.style.background = 'pink'; }); form.addeventlistener('
focusout', (event) => { event.target.style.background = ''; }); result specifications specification status comment ui events working draft added info that this event is composed.
Element: focusout event - Web APIs
the
focusout event fires when an element is about to lose
focus.
... the main difference between this event and blur is that
focusout bubbles while blur does not.
... the opposite of
focusout is
focusin.
... bubbles yes cancelable no interface
focusevent event handler property on
focusout sync / async sync composed yes examples live example html <form id="form"> <input type="text" placeholder="text input"> <input type="password" placeholder="password"> </form> javascript const form = document.getelementbyid('form'); form.addeventlistener('
focusin', (event) => { event.target.style.background = 'pink'; }); form.addeventlistener('
focusout', (event) => { event.target.style.background = ''; }); result specifications specification status comment ui events working draft added info that this event is composed.
FocusEvent.relatedTarget - Web APIs
the
focusevent.relatedtarget read-only property is the secondary target, depending on the type of event: event name target relatedtarget blur the eventtarget losing
focus the eventtarget receiving
focus (if any).
...
focus the eventtarget receiving
focus the eventtarget losing
focus (if any)
focusin the eventtarget receiving
focus the eventtarget losing
focus (if any)
focusout the eventtarget losing
focus the eventtarget receiving
focus (if any) note that many elements can't have
focus, which is a common reason for relatedtarget to be null.
... syntax secondtarget =
focusevent.relatedtarget specifications specification status comment ui eventsthe definition of '
focusevent.relatedtarget' in that specification.
... working draft document object model (dom) level 3 events specificationthe definition of '
focusevent.relatedtarget' in that specification.
Selection.focusNode - Web APIs
the selection.
focusnode read-only property returns the node in which the selection ends.
...the
focus is where the user ended the selection.
...the selection's
focus moves, but the selection's anchor, the other end of the selection, does not move.
... syntax node = sel.
focusnode specifications specification status comment selection apithe definition of 'selection.
focusnode' in that specification.
ShadowRoot.delegatesFocus - Web APIs
the delegates
focus read-only property of the shadowroot interface returns a boolean that indicates whether delegates
focus was set when the shadow was attached (see element.attachshadow()).
... syntax var df = shadowroot.delegates
focus value a boolean value — true if the shadow root does delegate
focus, false if it doesn't.
... // does it delegate
focus?
... let hostelem = shadow.delegates
focus; specifications this feature is not currently in a specification.
noinitialfocus - Archive of obsolete content
« xul reference homenoinitial
focustype: booleanif false, the default value, the element is considered when determining which element should be initially
focused in a dialog.
... if true, the element will not receive initial
focus.
... this lets you prevent things like descriptions and labels from inadvertently receiving initial
focus.
setfocus - Archive of obsolete content
« xul reference home set
focus type: boolean if true or omitted, the
focus will be given to the first element in the corresponding tabpanel when the tabs are navigated via the keyboard.
... if this attribute is false, the
focus does not change during navigation.
... see also dom element
focus ...
Selection.focusOffset - Web APIs
the selection.
focusoffset read-only property returns the number of characters that the selection's
focus is offset within the selection.
focusnode.
...if the selection ends with the first character in the selection.
focusnode, 0 is returned.
... syntax offset = sel.
focusoffset specifications specification status comment selection apithe definition of 'selection.
focusoffset' in that specification.
WindowClient.focus() - Web APIs
the
focus() method of the windowclient interface gives user input
focus to the current client and returns a promise that resolves to the existing windowclient.
... syntax windowclient.
focus().then(function(windowclient) { // do something with your windowclient once it has been
focused }); parameters none.
... example self.addeventlistener('notificationclick', function(event) { console.log('on notification click: ', event.notification.tag); event.notification.close(); // this looks to see if the current is already open and //
focuses if it is event.waituntil(clients.matchall({ type: "window" }).then(function(clientlist) { for (var i = 0; i < clientlist.length; i++) { var client = clientlist[i]; if (client.url == '/' && '
focus' in client) return client.
focus(); } if (clients.openwindow) return clients.openwindow('/'); })); }); specifications specification status comment service workersthe definition of '
focus()' in that specification.
WindowClient.focused - Web APIs
the
focused read-only property of the windowclient interface is a boolean that indicates whether the current client has
focus.
... syntax var my
focused = windowclient.
focused; value a boolean.
... example self.addeventlistener('notificationclick', function(event) { console.log('on notification click: ', event.notification.tag); event.notification.close(); // this looks to see if the current is already open and //
focuses if it is event.waituntil(clients.matchall({ type: "window" }).then(function(clientlist) { for (var i = 0; i < clientlist.length; i++) { var client = clientlist[i]; if (client.url == '/' && '
focus' in client) { if(!client.
focused) return client.
focus(); } } } if (clients.openwindow) return clients.openwindow('/'); })); }); specifications specification status comment service workersthe definition of 'windowclient:
focused' in that specification.
Index - Web APIs
559 canvasrenderingcontext2d.draw
focusifneeded() api, accessibility, canvas, canvasrenderingcontext2d, method, reference the canvasrenderingcontext2d.draw
focusifneeded() method of the canvas 2d api draws a
focus ring around the current or given path, if the specified element is
focused.
... 924 document.has
focus() api, dom,
focus, method, reference the has
focus() method of the document interface returns a boolean value indicating whether the document or any element inside the document has
focus.
... this method can be used to determine whether the active element in a document has
focus.
...And 35 more matches
Building accessible custom components in XUL - Archive of obsolete content
we still have no way to
focus individual cells, nor do we have a way to navigate the spreadsheet with the keyboard.
...further reading table of supported roles and states in firefox
focus issues download stage-3.zip install stage-3.xpi the next step on the road to an accessible spreadsheet is the
focus problem.
... in html documents, you can make any element
focusable with the tabindex attribute.
...And 28 more matches
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.
... when the listbox role is added to an element, or such an element becomes visible, screen readers announce the label and role of the listbox when it gets
focus.
... if an option or item is
focused within the list, it gets announced next, followed by an indication of the item's position with the list if the screen reader supports this.
...And 26 more matches
Implementing a Microsoft Active Accessibility (MSAA) Server - Accessibility
they need to know about
focus changes and other events, and it needs to know what objects are contained in the current document or dialog box.
...screen magnifiers will zoom to the
focus, keeping it on the screen at all times, or even allow the user to enter a special low vision document reading mode, with a variety of features such as ticker mode where text is streamed on a single line.
... a set of system messages that confer accessibility-related events such as
focus changes, changes to document content and state changes in ui objects like checkboxes.
...And 23 more matches
Keyboard-navigable JavaScript widgets - Accessibility
using tabindex by default, when people use the tab key to browse a webpage, only interactive elements (like links, form controls) get
focused.
... with the tabindex global attribute, authors can make other elements
focusable, too.
... when set to 0, the element becomes
focusable by keyboard and script.
...And 23 more matches
ARIA: grid role - Accessibility
the position of each cell is significant and can be
focused using keyboard input.
... key action → moves
focus one cell to the right.
... if
focus is on the right-most cell in the row,
focus does not move.
...And 21 more matches
<input>: The Input (Form Input) element - HTML: Hypertext Markup Language
required for accessibility autocomplete all hint for form autofill feature auto
focus all automatically
focus the form control when the page is loaded capture file media capture input method in file upload controls checked radio, checkbox whether the command or control is checked dirname text, search name of form field to use for sending the element's directionality in form submission disabled all whether the form c...
... auto
focus a boolean attribute which, if present, indicates that the input should automatically have
focus when the page has finished loading (or when the <dialog> containing the element has been displayed).
... note: an element with the auto
focus attribute may gain
focus before the domcontentloaded event is fired.
...And 19 more matches
Accessible Toolkit Checklist
general dialogs/windows/general escape key cancels dialogs and re
focuses the previously
focused on the parent window.
... alt+f4 closes windows, similar to escape but even works on dialogs without cancel button alt+space opens window menu with restore, move, size, minimize, maximize, close the move and size options must be usable with the arrow keys on the keyboard in windows, initial
focus goes to first
focusable widget that is not a clickable tabbed property sheet label making tab order definable.
... tab order must wrap, not have invisible items in tab order dynamically added items must not corrupt the tab cycle or make it disorderly tab cycle must be identical backwards and forwards the f6 and shift+f6 key combinations should cycle through panes in a window making
focus visible on any widget, and
focus must always be visible shift+f10 or context menu key should work like right click on
focused item, and context menu should show just under and to the right of the current
focus.
...And 18 more matches
Selection - Web APIs
the anchor is where the user began the selection and the
focus is where the user ends the selection.
... if you make a selection with a desktop mouse, the anchor is placed where you pressed the mouse button, and the
focus is placed where you released the mouse button.
... anchor and
focus should not be confused with the start and end positions of a selection.
...And 17 more matches
Index - Archive of obsolete content
this tutorial
focuses on extensions for firefox, but the same (or very similar) principles apply to creating extensions for other applications such as thunderbird, seamonkey, and flock.
... 415 dehydra dehydra the development
focus switched to dxr (where the "d" comes from "dehydra"), which is based on clang instead of gcc.
... 442 content states and the style system developing mozilla content states are what gecko uses to implement the various state-dependent in css (examples would be :hover, :active, :
focus, :target, :checked).
...And 16 more matches
How to build custom form controls - Learn web development
note: we'll
focus on building the control, not on how to make the code generic and reusable; that would involve some non-trival javascript code and dom manipulation in an unknown context, and that is out of the scope of this article.
... the control was active and the user moves the
focus to another control using the keyboard (e.g.
... the user hits the tab key and it gains
focus.
...And 15 more matches
Keyboard - Accessibility
focusable elements should have interactive semantics if an element can be
focused using the keyboard, then it should be interactive; that is, the user should be able to do something to it and produce a change of some kind (for example, activating a link or changing an option).
...in such a case,
focusing the nested document is the only way of returning assistive technology to a non-interactive state (often called "browse mode").
... most interactive elements are
focusable by default; you can make an element
focusable by adding a tabindex=0 attribute value to it.
...And 15 more matches
Anonymous Content - Archive of obsolete content
focus and blur events when a
focus or blur event crosses a scope boundary, the bound element is checked to see if it is
focusable (i.e., if the user agent would normally fire a
focus or blur event on the element).
... if the bound element is
focusable, then the event is retargeted.
...if anonymous content underneath a
focusable bound element blurs and anonymous content also underneath the bound element takes
focus, then the blur and
focus events are both stopped.
...And 14 more matches
Mozilla’s UAAG evaluation report
(p1) p onmouseover, onmousedown, onmouseup, onmousemove, onclick, ondbclick: no keyboard support on
focus and onblur: cannot be activated with pointer 1.3 provide text messages.
... checkpoint title status notes/plans 5.1 no automatic content
focus change.
...(p2) c windows can be configured so that the window with the current
focus is always on top.
...And 14 more matches
XUL accessibility guidelines - Archive of obsolete content
because column headers and the column picker, in the upper right hand corner of the tree, can not receive
focus, they are not operable with a keyboard.
... toolbarbuttons by default, toolbar buttons cannot receive
focus with a keyboard.
...in cases where duplication of functionality is not possible (such as a window without a menu bar), toolbar buttons can be made
focusable by adding the special css rule -moz-user-
focus: normal.
...And 13 more matches
CSS and JavaScript accessibility best practices - Learn web development
links hyperlinks — the way you get to new places on the web: <p>visit the <a href="https://www.mozilla.org">mozilla homepage</a>.</p> some very simple link styling is shown below: a { color: #ff0000; } a:hover, a:visited, a:
focus { color: #a60000; text-decoration: none; } a:active { color: #000000; background-color: #a60000; } the standard link conventions are underlined and a different color (default: blue) in their standard state, another color variation when the link has previously been visited (default: purple), and yet another color when the link is activated (default: red).
... in addition, the mouse pointer changes to a pointer icon when links are moused over, and the link receives a highlight when
focused (e.g.
... you shouldn't however deviate too much from the expected visual feedback form elements receive when they are
focused, which is basically the same as links (see above).
...And 12 more matches
ARIA: button role - Accessibility
<div id="savechanges" tabindex="0" role="button" aria-pressed="false">save</div> the above example creates a simple button which is first in the
focus order, though <button> or <input> with type="button" should be used for buttons: <button id="savechanges">save</button> note: if using role="button" instead of the semantic <button> or <input type="button"> elements, you will need to make the element
focusable and have to define event handlers for click and keydown events, including the enter and space keys, in order to process the user's inpu...
... space activates the button following button activation,
focus is set depending on the type of action the button performs.
... for example, if clicking the button opens a dialog, the
focus should move to the dialog.
...And 11 more matches
ARIA: feed role - Accessibility
each article within a feed should be
focusable, with tabindex of 0 or -1.
... an article should be scrolled into view when it, or a descendant element, receives
focus.
... to ensure good user experience, avoid inserting or removing articles in the middle of a feed, load new articles before the user has reached the end of the feed, and provide keyboard commands for moving
focus among articles so that keyboard users can navigate through your feed.
...And 10 more matches
ARIA: dialog role - Accessibility
additionally, the following needs to be done: the dialog must be properly labeled keyboard
focus must be managed correctly the sections below describe how these two requirements can be met.
... labeling even though it is not required for the dialog itself to be able to receive
focus, it still needs to be labeled.
...h is shown in the code snippet below: <div role="dialog" aria-labelledby="dialog1title" aria-describedby="dialog1desc"> <h2 id="dialog1title">your personal details were successfully updated</h2> <p id="dialog1desc">you can change your details at any time in the user account section.</p> <button>close</button> </div> keep in mind that a dialog's title and description text do not have to be
focusable in order to be perceived by screen readers operating in a non-virtual mode.
...And 10 more matches
Index - Archive of obsolete content
128
focused xul attributes, xul reference no summary!
... 208 noauto
focus xul attributes, xul reference no summary!
... 210 noinitial
focus xul, xul attribute, xul reference no summary!
...And 9 more matches
Styling links - Learn web development
focus: a link when it has been
focused (for example moved to by a keyboard user using the tab key or similar, or programmatically
focused using htmlelement.
focus()) — this is styled using the :
focus pseudo class.
...
focused links have an outline around them — you should be able to
focus on the links on this page with the keyboard by pressing the tab key (on mac, you'll need to use option + tab, or enable the full keyboard access: all controls option by pressing ctrl + f7.) active links are red (try holding down the mouse button on the link as you click it.) interestingly enough, these default styles are nearl...
... make them react in some way when hovered/
focused, and in a slightly different way when activated.
...And 9 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, getsessio...
...if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...And 8 more matches
ARIA: tab role - Accessibility
when an element with the tabpanel role has
focus, or a child of it has
focus, that indicates that the connected element with the tab role is the active tab in a tablist.
... associated roles and attributes aria-selected boolean aria-controls id of element with tabpanel role id content keyboard interaction key action tab when
focus is outside of the tablist moves
focus to the active tab.
... if
focus is on the active tab moves
focus to the next element in the keyboard
focus order, ideally the active tab's associated tabpanel.
...And 8 more matches
Cognitive accessibility - Accessibility
in this document, we
focus on steps developers should take to improve the cognitive accessibility of their web sites and applications.
...one way to handle this is to
focus on cognitive skills.
...memory processing speed time management letters and language numbers symbols and math understanding and making choices a solid approach to providing accessible solutions for people with cognitive impairments includes: delivering content in more than one way, such as by text-to-speech or by video; providing easily-understood content, such as text written using plain-language standards;
focusing attention on important content; minimizing distractions, such as unnecessary content or advertisements; providing consistent web page layout and navigation; incorporating familiar elements, such as underlined links that are blue when not visited and purple when visited; dividing processes into logical, essential steps with progress indicators; making website authentication as easy as poss...
...And 8 more matches
Panels - Archive of obsolete content
focus in panels elements within panels may be
focused with the mouse, and the currently
focused element may be adjusted by pressing the tab key.
... when a popup is opened, if an element in the main window is
focused, that element is un
focused, and a blur event is fired at it.
... although no element within the popup panel is
focused by default, the user may
focus the first element within the panel by pressing the tab key.
...And 7 more matches
HTML text fundamentals - Learn web development
playable code <h2>live output</h2> <div class="output" style="min-height: 50px;"> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move
focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="input" style="min-height: 100px; width: 95%">my short story i am a statistician and my name is trish.
...tcaret(text) { var scrollpos = textarea.scrolltop; var caretpos = textarea.selectionstart; var front = (textarea.value).substring(0, caretpos); var back = (textarea.value).substring(textarea.selectionend, textarea.value.length); textarea.value = front + text + back; caretpos = caretpos + text.length; textarea.selectionstart = caretpos; textarea.selectionend = caretpos; textarea.
focus(); textarea.scrolltop = scrollpos; } // update the saved usercode every time the user updates the text area code textarea.onkeyup = function(){ // we only want to save the state when the user code is being shown, // not the solution, so that solution is not saved over the user code if(solution.value === 'show solution') { userentry = textarea.value; } else { solutionentry = te...
... playable code <h2>live output</h2> <div class="output" style="min-height: 50px;"> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move
focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="input" style="min-height: 100px; width: 95%">milk eggs bread hummus</textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { marg...
...And 7 more matches
Index - Learn web development
beginner, composing, needsactivelearning, needsschema when starting with a web project, many people
focus on the technical side.
...in the next article, we'll
focus on numbers in more detail, looking at how to do basic math in javascript.
... 162 styling links article, beginner, css,
focus, guide, learn, links, pseudo-class, hover, hyperlinks, menus, tabs we hope this article has provided you with all you'll need to know about links — for now!
...And 7 more matches
Handling common accessibility problems - Learn web development
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.
... you can then press enter/return to follow a
focused link or press a button (we've included some javascript to make the buttons alert a message), or start typing to enter text in a text input (other form elements have different controls, for example the <select> element can have its options displayed and cycled between using the up and down arrow keys).
...most modern browsers follow the tab pattern described above (you can also do shift + tab to move backwards through the
focusable elements), but some browsers have their own idiosyncracies: firefox for the mac doesn't do tabbing by default.
...And 7 more matches
Gecko info for Windows accessibility vendors
events such as
focus changes must be tracked through msaa events, rather than dom events.
... anything that is
focusable or conveys important information about the structure of the document is exposed in the msaa tree of iaccessibles.
... when you see the content window receive
focus, first check the role.
...And 7 more matches
source-editor.jsm
ring aeventtype, function acallback); void removeeventlistener(string aeventtype, function acallback); undo stack operations boolean canredo(); boolean canundo(); void endcompoundchange(); boolean redo(); void resetundo(); void startcompoundchange(); boolean undo(); display management operations void
focus(); number gettopindex(); boolean has
focus(); void settopindex(number atopindex); content management operations number getcharcount(); string getindentationstring(); string getlinedelimiter(); number getlinecount(); number getlineend(number alineindex, boolean aincludedelimiter); number getlinestart(number a...
... constant value description sourceeditor.events.blur "blur" fired when the editor loses
focus.
... sourceeditor.events.
focus "
focus" fired when the editor gains
focus.
...And 7 more matches
nsIDOMWindowUtils
blenontestmouseevents(in boolean adisable); boolean dispatchdomeventviapresshell(in nsidomnode atarget, in nsidomevent aevent, in boolean atrusted); nsidomelement elementfrompoint(in float ax, in float ay, in boolean aignorerootscrollframe, in boolean aflushlayout); void entermodalstate(); nsidomelement findelementwithviewid(in nsviewid aid); void
focus(in nsidomelement aelement); void forceupdatenativemenuat(in astring indexstring); void garbagecollect([optional] in nsicyclecollectorlistener alistener); short getcursortype(); astring getdocumentmetadata(in astring aname); nsidomwindow getouterwindowwithid(in unsigned long long aouterwindowid); long getpccountscriptcount(); a...
...
focusedinputtype string the type of the currently-
focused html <input> element, if one is
focused.
... ime_status_plugin 3 plug-in has
focus.
...And 7 more matches
HTMLInputElement - Web APIs
see also readonly auto
focus boolean: returns / sets the element's auto
focus attribute, which specifies that a form control should have input
focus when the page loads, unless the user overrides it, for example by typing in a different control.
... only one form element in a document can have the auto
focus attribute.
... it cannot be applied if the type attribute is set to hidden (that is, you cannot automatically set
focus to a hidden control).
...And 7 more matches
Event reference
focus events event name fired when
focus an element has received
focus (does not bubble).
... blur an element has lost
focus (does not bubble).
...
focusin an element is about to receive
focus (does bubble).
...And 7 more matches
XUL Events - Archive of obsolete content
inherited dom events event description blur the opposite of the
focus event, the blur event is passed after an element loses the
focus.
...the event is not sent until the
focus is moved to another element.
...
focus the
focus event is sent to an element when it receives the
focus.
...And 6 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, disableautoco...
...mplete, disablekeynavigation, 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.
...if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...And 6 more matches
Commands - Archive of obsolete content
if you did not use commands, you would need to figure out which field has the
focus, then check to ensure that the operation is suitable for that element.
... in addition, the menu commands would need to be enabled and disabled depending on whether the
focused element had selected text or not, and for paste operations, whether there is something suitable on the clipboard to paste.
...you should use them when the operation depends on which element is
focused.
...And 6 more matches
Updating Commands - Archive of obsolete content
for example, the paste command is valid when a textbox has the
focus and there is something on the clipboard to paste.
... the command will become enabled whenever a textbox is
focused and when the clipboard contents change.
...a simple command updater looks like this: <commandset id="updatepasteitem" commandupdater="true" events="
focus" oncommandupdate="goupdatecommand('cmd_paste');"/> a command updater is indicated by using the commandupdater attribute, which should be set to true.
...And 6 more matches
listbox - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... currentindex type: integer set to the index of the currently
focused item in the list.
...And 6 more matches
richlistbox - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... currentindex type: integer set to the index of the currently
focused item in the list.
...And 6 more matches
textbox - Archive of obsolete content
attributes cols, decimalplaces, disabled, emptytext, hidespinbuttons, increment, label, max, maxlength, min, multiline, newlines, onblur, onchange, on
focus, oninput, placeholder, preference, readonly, rows, searchbutton, size, spellcheck, tabindex, timeout, type, value, wrap, wraparound properties accessibletype, clickselectsall, decimalplaces, decimalsymbol, defaultvalue, disabled, editor, emptytext, increment, inputfield, label, max, maxlength, min, placeholder, readonly, searchbutton, selectionend, selectionstart, size, spinbuttons, tabindex...
...if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...
focused type: boolean this attribute is true if the element is
focused.
...And 6 more matches
HTMLTextAreaElement - Web APIs
autocomplete auto
focus boolean: returns / sets the element's auto
focus attribute, indicating that the control should have input
focus when the page loads cols unsigned long: returns / sets the element's cols attribute, indicating the visible width of the text area.
... methods blur() removes
focus from the control; keystrokes will subsequently go nowhere.
...
focus() gives
focus to the control; keystrokes will subsequently go to this element.
...And 6 more matches
ARIA: application role - Accessibility
in this mode, the web author is completely responsible for handling any and all keyboard input,
focus management, and other interactions and cannot assume assistive technologies would do any processing on their end.
...the screen reader mode, often called forms mode or
focus mode, lets all keyboard input go through to the browser again.
... the application role is designed to provide a means for widgets that are not part of the standard set to be accessible for direct interaction in ats that use both browse and
focus modes for interacting with web content.
...And 6 more matches
Closures - JavaScript
showhelp(help) { document.getelementbyid('help').innerhtml = help; } function setuphelp() { var helptext = [ {'id': 'email', 'help': 'your e-mail address'}, {'id': 'name', 'help': 'your full name'}, {'id': 'age', 'help': 'your age (you must be over 16)'} ]; for (var i = 0; i < helptext.length; i++) { var item = helptext[i]; document.getelementbyid(item.id).on
focus = function() { showhelp(item.help); } } } setuphelp(); try running the code in jsfiddle.
...the loop cycles through these definitions, hooking up an on
focus event to each one that shows the associated help method.
...no matter what field you
focus on, the message about your age will be displayed.
...And 6 more matches
NPEvent - Archive of obsolete content
modifiers: integer; end; xwindows typedef xevent npevent; fields npevent on microsoft windows the data structure has the following fields: event one of the following event types: wm_paint wm_lbuttondown wm_lbuttonup wm_lbuttondblclk wm_rbuttondown wm_rbuttonup wm_rbuttondblclk wm_mbuttondown wm_mbuttonup wm_mbuttondblclk wm_mousemove wm_keyup wm_keydown wm_setcursor wm_set
focus wm_kill
focus for information about these events, see the microsoft windows developer documentation.
...values: 0 nullevent 1 mousedown 2 mouseup 3 keydown 4 keyup 5 autokey 6 updateevt 7 diskevt 8 activateevt 15 osevt 23 khighlevelevent get
focusevent 0, 1 (true, false) lose
focusevent adjustcursorevent 0, 1 (true, false) for information about these events, see the mac os developer documentation.
...the event type may be any of the ollowing: graphicsexpose
focusin
focusout enternotify leavenotify motionnotify buttonpress buttonrelease keypress keyrelease description microsoft windows description the type npevent represents an event passed by npp_handleevent() to a windowless plug-in.
...And 5 more matches
XForms Input Element - Archive of obsolete content
attributes ui common appearance - the value of this attribute gives a hint to the xforms processor as to which type of widget(s) to use to represent this control accesskey - used to specify the keyboard shortcut for
focusing this control single-node binding special inputmode - not supported for this control incremental - supported.
...if "false", or the incremental attribute is omitted on this element then the bound instance node will be updated when the control loses the
focus.
...if "false" then the instance node will be updated when the checkbox loses the
focus.
...And 5 more matches
HTML: A good basis for accessibility - Learn web development
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.
... you can then press enter/return to follow a
focused link or press a button (we've included some javascript to make the buttons alert a message), or start typing to enter text in a text input.
...And 5 more matches
HTML: A good basis for accessibility - Learn web development
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.
... you can then press enter/return to follow a
focused link or press a button (we've included some javascript to make the buttons alert a message), or start typing to enter text in a text input.
...And 5 more matches
UI pseudo-classes - Learn web development
:
focus: selects an element only when it is
focused (i.e.
... note: to enter an invalid/out-of-range value, you'll have to actually
focus the form and type it in using the keyboard.
... a fragment of the html is as follows — note the readonly attribute: <div> <label for="name">name: </label> <input id="name" name="name" type="text" value="mr soft" readonly> </div> if you try the live example, you'll see that the top set of form elements are not
focusable, however, the values are submitted when the form is submitted.
...And 5 more matches
Looping code - Learn web development
utton> <p></p> now on to the javascript: const contacts = ['chris:2232322', 'sarah:3453456', 'bill:7654322', 'mary:9998769', 'dianne:9384975']; const para = document.queryselector('p'); const input = document.queryselector('input'); const btn = document.queryselector('button'); btn.addeventlistener('click', function() { let searchname = input.value.tolowercase(); input.value = ''; input.
focus(); for (let i = 0; i < contacts.length; i++) { let splitcontact = contacts[i].split(':'); if (splitcontact[0].tolowercase() === searchname) { para.textcontent = splitcontact[0] + '\'s number is ' + splitcontact[1] + '.'; break; } else { para.textcontent = 'contact not found.'; } } }); hidden code 3 <!doctype html> <html> <head> <meta charset="utf-8">...
... <script> const contacts = ['chris:2232322', 'sarah:3453456', 'bill:7654322', 'mary:9998769', 'dianne:9384975']; const para = document.queryselector('p'); const input = document.queryselector('input'); const btn = document.queryselector('button'); btn.addeventlistener('click', function() { let searchname = input.value.tolowercase(); input.value = ''; input.
focus(); for (let i = 0; i < contacts.length; i++) { let splitcontact = contacts[i].split(':'); if (splitcontact[0].tolowercase() === searchname) { para.textcontent = splitcontact[0] + '\'s number is ' + splitcontact[1] + '.'; break; } else if (i === contacts.length-1) para.textcontent = 'contact not found.'; } }); </script...
... we store the value entered into the text input in a variable called searchname, before then emptying the text input and
focusing it again, ready for the next search.
...And 5 more matches
Accessibility API cross-reference
they also define a list of possible object states, such as
focused, read-only, checked, etc.
...they also define a list of possible object states, such as
focused, read-only, checked, etc.
... grid a composite widget containing a collection of one or more rows with one or more cells where some or all cells in the grid are
focusable by using methods of two-dimensional navigation, such as directional arrow keys, e.g.
...And 5 more matches
All keyboard shortcuts - Firefox Developer Tools
d) ctrl + shift + i or f12 cmd + opt + i or f12 ctrl + shift + i or f12 close toolbox (if the toolbox is in a separate window and in foreground) ctrl + shift + i or f12 cmd + opt + i or f12 ctrl + shift + i or f12 open web console 1 ctrl + shift + k cmd + opt + k ctrl + shift + k toggle "pick an element from the page" (opens the toolbox and/or
focus the inspector tab) ctrl + shift + c cmd + opt + c ctrl + shift + c open style editor shift + f7 shift + f7 * shift + f7 open profiler shift + f5 shift + f5 * shift + f5 open network monitor 2 ctrl + shift + e cmd + opt + e ctrl + shift + e toggle responsive design mode ctrl + shift + m cmd + opt + m ctrl + shift + m ...
...instead, it
focuses on the web console's command line.
... enter return enter step forward through the attributes of a node tab tab tab step backward through the attributes of a node shift + tab shift + tab shift + tab (when an attribute is selected) start editing the attribute enter return enter hide/show the selected node h h h
focus on the search box in the html pane ctrl + f cmd + f ctrl + f edit as html f2 f2 f2 stop editing html f2 / ctrl +enter f2 / cmd + return f2 / ctrl + enter copy the selected node's outer html ctrl + c cmd + c ctrl + c scroll the selected node into view s s s find the next match in the markup, when searching is...
...And 5 more matches
Selection.setBaseAndExtent() - Web APIs
syntax sel.setbaseandextent(anchornode,anchoroffset,
focusnode,
focusoffset) parameters anchornode the node at the start of the selection.
...
focusnode the node at the end of the selection.
...
focusoffset the number of child nodes from the start of the
focus node that should be included in the selection.
...And 5 more matches
Window - Web APIs
window.blur() sets
focus away from the window.
... window.
focus() sets
focus on the current window.
... globaleventhandlers.onblur called after the window loses
focus, such as due to a popup.
...And 5 more matches
<button>: The Button element - HTML: Hypertext Markup Language
auto
focus html5 this boolean attribute specifies that the button should have input
focus when the page loads.
... disabled this boolean attribute prevents the user from interacting with the button: it cannot be pressed or
focused.
... hand tremors and the giant-button-problem - axess lab firefox firefox will add a small dotted border on a
focused button.
...And 5 more matches
<select>: The HTML Select element - HTML: Hypertext Markup Language
it also accepts most of the general form input attributes such as required, disabled, auto
focus, etc.
... auto
focus this boolean attribute lets you specify that a form control should have input
focus when the page loads.
... only one form element in a document can have the auto
focus attribute.
...And 5 more matches
panel - Archive of obsolete content
// // set the
focus to the text area so the user can // just start typing.
... self.port.on("show", function onshow() { textarea.
focus(); }); finally, the "text-entry.html" file defines the <textarea> element: <html> <head> <style type="text/css" media="all"> textarea { margin: 10px; } body { background-color: gray; } </style> </head> <body> <textarea rows="13" cols="33" id="edit-box"></textarea> </body> </html> finally, save these three icon files to the "data" directory: icon-16.png icon-32.png icon-64.png to learn much more about content scripts, see the working with content scripts guide.
...// // set the
focus to the text area so the user can // just start typing.
...And 4 more matches
Finding window handles - Archive of obsolete content
os specific examples using javascript (js-ctypes) nsibasewindow -> nativehandle in all of the examples below, the native handle to the most recent navigator:browser is obtained and then it is
focused.
...acerequestor) .getinterface(ci.nsibasewindow); var gdkwindowptrstring = basewindow.nativehandle; components.utils.import('resource://gre/modules/ctypes.jsm'); var gdk = ctypes.open('libgdk-x11-2.0.so.0'); // types let guint32 = ctypes.uint32_t; let gdkwindow = ctypes.structtype('gdkwindow'); // https://developer.gnome.org/gdk3/stable/gdk3-windows.html#gdk-window-
focus var gdk_window_
focus = gdk.declare('gdk_window_
focus', ctypes.default_abi, ctypes.void_t, gdkwindow.ptr, guint32); // https://developer.gnome.org/gdk2/stable/gdk2-x-window-system-interaction.html#gdk-x11-get-server-time var gdk_x11_get_server_time = gdk.declare('gdk_x11_get_server_time', ctypes.default_abi, guint32, gdkwindow.ptr); var browserwindow_madeintogdkwinptr = gdkwindow.ptr(ctypes.uint...
...64(gdkwindowptrstring)); var rez_gst = gdk_x11_get_server_time(browserwindow_madeintogdkwinptr); console.info('rez_gst:', rez_gst, uneval(rez_gst)); // return is a number of ms since the computer (xserver) was on var rez_gwf = gdk_window_
focus(browserwindow_madeintogdkwinptr, rez_gst); console.info('rez_gwf:', rez_gwf, uneval(rez_gwf)); // return is void so this will be undefined gdk.close(); gtk+ components.utils.import('resource://gre/modules/services.jsm'); var browserwindow = services.wm.getmostrecentwindow('navigator:browser'); if (!browserwindow) { throw new error('no browser window found'); } var basewindow = browserwindow.queryinterface(ci.nsiinterfacerequestor) .getinterface(ci.nsiwebnavigation) .queryinterface(ci.n...
...And 4 more matches
Keyboard Shortcuts - Archive of obsolete content
however, it would be tedious to do that for every button and menu item (though it could be necessary when one's key commands are only triggered when the user is
focused on a particular element).
...these events are: keypress called when a key is pressed and released when an element has the
focus.
... keydown called when a key is pressed down while an element has the
focus.
...And 4 more matches
panel - Archive of obsolete content
attributes backdrag, close, consumeoutsideclicks, fade, flip, ignorekeys, label, left, level, noauto
focus, noautohide, norestore
focus, onpopuphidden, onpopuphiding, onpopupshowing, onpopupshown, position, titlebar, top, type properties accessibletype, label, popupboxobject, popup, state methods hidepopup, moveto, openpopup, openpopupatscreen, sizeto examples the following example shows how a panel may be attached to a label.
... noauto
focus type: boolean if false, the default value, the currently
focused element will be un
focused whenever the popup is opened or closed.
... if true, the
focus is not adjusted.
...And 4 more matches
radiogroup - Archive of obsolete content
attributes disabled,
focused, preference, tabindex, value properties accessibletype, disabled,
focuseditem, itemcount, selectedindex, selecteditem, tabindex, value methods appenditem, checkadjacentelement, getindexofitem, getitematindex, insertitemat, removeitemat examples <radiogroup> <radio id="orange" label="red"/> <radio id="violet" label="green" selected="true"/> <radio id="yellow" label="blue"/> ...
...if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...
focused type: boolean this attribute is true if the element is
focused.
...And 4 more matches
tree - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
...for trees with
focus, the caret's position is indicated by the
focus ring, but un
focused trees won't show a
focus ring, naturally.
...And 4 more matches
Index - MDN Web Docs Glossary: Definitions of Web-related terms
it's based on the stream-
focused transport layer security (tls), providing a similar level of security.
...it is the software that handles communication between components and input/output, so developers can
focus on the specific purpose of their application.
... 273 mobile first design, glossary, layout, layout mobile mobile first, a form of progressive enhancement, is a web-development and web-design approach that
focuses on prioritizing design and development for mobile screen sizes over design and development for desktop screen sizes.
...And 4 more matches
Basic native form controls - Learn web development
previous overview: forms next in the previous article, we marked up a functional web form example, introducing some form controls and common structural elements, and
focusing on accessibility best practices.
... the following screenshot shows default,
focused and disabled text input types in firefox 71 and safari on macos and in chrome 79 and edge 18 on windows 10.
...because it is hidden, the user can not see nor intentionally edit the value, it will never receive
focus, and a screen reader will not notice it either.
...And 4 more matches
A first splash into JavaScript - Learn web development
} function resetgame() { guesscount = 1; const resetparas = document.queryselectorall('.resultparas p'); for(let i = 0 ; i < resetparas.length ; i++) { resetparas[i].textcontent = ''; } resetbutton.parentnode.removechild(resetbutton); guessfield.disabled = false; guesssubmit.disabled = false; guessfield.value = ''; guessfield.
focus(); lastresult.style.backgroundcolor = 'white'; randomnumber = math.floor(math.random() * 100) + 1; } </script> </body> </html> have a go at playing it — familiarize yourself with the game before you move on.
...extcontent = '!!!game over!!!'; 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 = ''; guessfield.
focus(); } this is a lot of code — phew!
...we add 1 to the guesscount variable so the player uses up their turn (++ is an incrementation operation — increment by 1), and empty the value out of the form text field and
focus it again, ready for the next guess to be entered.
...And 4 more matches
Useful string methods - Learn web development
playable code <h2>live output</h2> <div class="output" style="min-height: 125px;"> <ul> </ul> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move
focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="playable-code" style="height: 290px; width: 95%"> const list = document.queryselector('.output ul'); list.innerhtml = ''; let greetings = ['happy birthday!', 'merry christmas my love', 'a happy christmas to all the family', 'you\'re all i want for christmas', ...
...ext) { const scrollpos = textarea.scrolltop; const caretpos = textarea.selectionstart; const front = (textarea.value).substring(0, caretpos); const back = (textarea.value).substring(textarea.selectionend, textarea.value.length); textarea.value = front + text + back; caretpos = caretpos + text.length; textarea.selectionstart = caretpos; textarea.selectionend = caretpos; textarea.
focus(); textarea.scrolltop = scrollpos; } // update the saved usercode every time the user updates the text area code textarea.onkeyup = function(){ // we only want to save the state when the user code is being shown, // not the solution, so that solution is not saved over the user code if(solution.value === 'show solution') { userentry = textarea.value; } else { solutionentry = te...
... playable code 2 <h2>live output</h2> <div class="output" style="min-height: 125px;"> <ul> </ul> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move
focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="playable-code" style="height: 250px; width: 95%"> const list = document.queryselector('.output ul'); list.innerhtml = ''; let cities = ['london', 'manchester', 'birmingham', 'liverpool']; for (let i = 0; i < cities.length; i++) { let input = cities[i]; // write your code just below here let result = inp...
...And 4 more matches
Aprender y obtener ayuda - Learn web development
different learning methods it is interesting to consider that there are two main ways in which your brain learns things —
focused and diffuse learning:
focused learning is what you might more traditionally associate with academic subjects.
...you are
focused on a narrow area.
...you might think that
focused learning is better for studying, but in reality, both are very important.
...And 4 more matches
Beginning our React todo list - Learn web development
defining user stories before we begin our work will help us
focus our work.
... implementing our styles paste the following css code into src/index.css so that it replaces what's currently there: /* resets */ *, *::before, *::after { box-sizing: border-box; } *:
focus { outline: 3px dashed #228bec; outline-offset: 0; } html { font: 62.5% / 1.15 sans-serif; } h1, h2 { margin-bottom: 0; } ul { list-style: none; padding: 0; } button { border: none; margin: 0; padding: 0; width: auto; overflow: visible; background: transparent; color: inherit; font: inherit; line-height: normal; -webkit-font-smoothing: inherit; -moz-osx-font-smoot...
...hing: inherit; -webkit-appearance: none; } button::-moz-
focus-inner { border: 0; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { overflow: visible; } input[type="text"] { border-radius: 0; } body { width: 100%; max-width: 68rem; margin: 0 auto; font: 1.6rem/1.25 arial, sans-serif; background-color: #f5f5f5; color: #4d4d4d; } @media screen and (min-width: 620px) { body { font-size: 1.9rem; line-height: 1.31579; } } /*end resets*/ /* global styles */ .form-group > input[type="text"] { display: inline-block; margin-top: 0.4rem; } .btn { padding: 0.8rem 1rem 0.7rem; border: 0.2rem solid #4d4d4d; cursor: pointer; text-transform: capitalize; } .btn.toggle-btn { bo...
...And 4 more matches
Starting our Svelte Todo list app - Learn web development
replace the contents of the file public/global.css with the following: /* resets */ *, *::before, *::after { box-sizing: border-box; } *:
focus { outline: 3px dashed #228bec; outline-offset: 0; } html { font: 62.5% / 1.15 sans-serif; } h1, h2 { margin-bottom: 0; } ul { list-style: none; padding: 0; } button { border: none; margin: 0; padding: 0; width: auto; overflow: visible; background: transparent; color: inherit; font: inherit; line-height: normal; -webkit-font-smoothing: inherit; -moz-osx-font-smoot...
...hing: inherit; -webkit-appearance: none; } button::-moz-
focus-inner { border: 0; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { overflow: visible; } input[type="text"] { border-radius: 0; } body { width: 100%; max-width: 68rem; margin: 0 auto; font: 1.6rem/1.25 arial, sans-serif; background-color: #f5f5f5; color: #4d4d4d; } @media screen and (min-width: 620px) { body { font-size: 1.9rem; line-height: 1.31579; } } /*end resets*/ /* global styles */ .form-group > input[type="text"] { display: inline-block; margin-top: 0.4rem; } .btn { padding: 0.8rem 1rem 0.7rem; border: 0.2rem solid #4d4d4d; cursor: pointer; text-transform: capitalize; } .btn.toggle-btn { b...
...th: 50rem; margin-left: auto; margin-right: auto; } .todoapp > form { max-width: 100%; } .todoapp > h1 { display: block; max-width: 100%; text-align: center; margin: 0; margin-bottom: 1rem; } .label__lg { line-height: 1.01567; font-weight: 300; padding: 0.8rem; margin-bottom: 1rem; text-align: center; } .input__lg { padding: 2rem; border: 2px solid #000; } .input__lg:
focus { border-color: #4d4d4d; box-shadow: inset 0 0 0 2px; } [class*="__lg"] { display: inline-block; width: 100%; font-size: 1.9rem; } [class*="__lg"]:not(:last-child) { margin-bottom: 1rem; } @media screen and (min-width: 620px) { [class*="__lg"] { font-size: 2.4rem; } } .filters { width: 100%; margin: unset auto; } /* todo item styles */ .todo { display: flex; flex-direc...
...And 4 more matches
TypeScript support in Svelte - Learn web development
math.max(...todos.map(t => t.id)) + 1 : 1 function addtodo(name: string) { todos = [...todos, { id: newtodoid, name, completed: false }] $alert = `todo '${name}' has been added` } function removetodo(todo: todotype) { todos = todos.filter(t => t.id !== todo.id) todosstatus.
focus() // give
focus to status heading $alert = `todo '${todo.name}' has been deleted` } function updatetodo(todo: todotype) { const i = todos.findindex(t => t.id === todo.id) if (todos[i].name !== todo.name) $alert = `todo '${todos[i].name}' has been renamed to '${todo.name}'` if (todos[i].completed !== todo.completed) $alert = `todo '${todos[i].name}' mar...
...set its type to htmlelement like this: let nameel: htmlelement // reference to the name input dom node last for this file, we need to specify the correct type for our auto
focus variable; update its definition like this: export let auto
focus: boolean = false todo.svelte now the only warnings that npm run validate emits are triggered by calling the todo.svelte component; let's fix them.
...(ts) const
focusoninit = (node) => node && typeof node.
focus === 'function' && node.
focus() ./07-next-steps/src/components/todo.svelte:47:28 warn: parameter 'node' implicitly has an 'any' type, but a better type may be inferred from usage.
...And 4 more matches
Understanding client-side JavaScript frameworks - Learn web development
accessibility in react in our final tutorial article, we'll
focus on (pun intended) accessibility, including
focus management in react, which can improve usability and reduce confusion for both keyboard-only and screen reader users.
...
focus management with vue refs we are nearly done with vue.
... the last bit of functionality to look at is
focus management, or put another way, how we can improve our app's keyboard accessibility.
...And 4 more matches
Index
this chapter will
focus on the functionality that actually handles the web locking.
... 258
focusedchild
focused accessible child of node.
... 286 take
focus this method
focuses this accessible node.
...And 4 more matches
nsIDocShell
void setcurrenturi(in nsiuri auri); void suspendrefreshuris(); void tabtotreeowner(in boolean forward, out boolean took
focus); attributes attribute type description allowauth boolean certain dochshells (like the message pane) should not throw up auth dialogs because it can act as a password trojan.
... canvashas
focus boolean tells the docshell whether the canvas should have
focus.
... called by the
focus manager when the user tabs to the frame rather than an element.
...And 4 more matches
nsISelectionController
selection_find 128 num_selectiontypes 8 9 selection_anchor_region 0 selection_
focus_region 1 selection_whole_selection 2 num_selection_regions 2 3 selection_off 0 selection_hidden 1 hidden displays selection.
...this will also have the effect of collapsing the selection if the extend = pr_false the "point" of selection that is extended is considered the "
focus" point, or the last point adjusted by the selection.
...completemove() will move page view to the top or bottom of the document this will also have the effect of collapsing the selection if the extend = pr_false the "point" of selection that is extended is considered the "
focus" point, or the last point adjusted by the selection.
...And 4 more matches
DocumentOrShadowRoot.activeElement - Web APIs
the activeelement read-only property of the document and shadowroot interfaces returns the element within the dom or shadow dom tree that currently has
focus.
...other times the
focused element might be a <select> element (menu) or an <input> element, of type "button", "checkbox", or "radio".
... typically a user can press the tab key to move the
focus around the page among
focusable elements, and use the space bar to activate one (that is, to press a button or toggle a radio button).
...And 4 more matches
Window.open() - Web APIs
firefox (51.) gets the handle but cannot run any element.
focus() while chrome can run
focus() from opener to child but not between siblings nor, reverse, from child to opener.
...*/ } else { windowobjectreference.
focus(); /* else the window reference must exist and the window is not closed; therefore, we can bring it back on top of any other window with the
focus() method.
...e situations, therefore re-usable in scripts and webpages: <script type="text/javascript"> var windowobjectreference = null; // global variable function openrequestedpopup(url, windowname) { if(windowobjectreference == null || windowobjectreference.closed) { windowobjectreference = window.open(url, windowname, "resizable,scrollbars,status"); } else { windowobjectreference.
focus(); }; } </script> (...) <p><a href="http://www.spreadfirefox.com/" target="promotefirefoxwindow" onclick="openrequestedpopup(this.href, this.target); return false;" title="this link will create a new window or will re-use an already opened one" >promote firefox adoption</a></p> you can also make such function able to open only 1 secondary window and to reuse such single secondary window...
...And 4 more matches
ARIA: document role - Accessibility
because ats with reading mode default to that mode for all elements except for those with a widget or application role set, document role is only useful for
focusable elements within a widget or application that should be read as static rich text.
... adding role="document" and tabindex="0" to the element containing the text within a widget enables the screen reader user to press the tab key to place
focus on the document element and read the text with the screen reader's reading cursor.
... tabindex="0" used to make it
focusable so the assistive technology user can tab to it and start reading right away.
...And 4 more matches
tabindex - HTML: Hypertext Markup Language
the tabindex global attribute indicates that its element can be
focused, and where it participates in sequential keyboard navigation (usually with the tab key, hence the name).
... it accepts an integer as a value, with different results depending on the integer's value: a negative value (usually tabindex="-1") means that the element is not reachable via sequential keyboard navigation, but could be
focused with javascript or visually by clicking with the mouse.
...the user won't be able to
focus any element with a negative tabindex using the keyboard, but a script can do so by calling the
focus() method.
...And 4 more matches
Adding windows and dialogs - Archive of obsolete content
focus and tabbing moving through all input controls in a window using only the keyboard is an accessibility requirement.
...each tab key press moves you to the next control in the window, giving it
focus.
... in general, there's nothing you need to do in order to have good keyboard
focus management.
...And 3 more matches
PopupKeys - Archive of obsolete content
focus in popups a menu does not take the keyboard
focus.
...while a menu is open, the
focus remains where it was before the menu was open.
... for example,
focusing a textbox and opening the textbox's context menu keeps the
focus within the textbox.
...And 3 more matches
XPCOM Examples - Archive of obsolete content
that means that in order to switch the window
focus, we need to do the following: determine the element that the user clicked on.
... switch the
focus to this window.
... the example below shows how we might do this: <toolbox> <menubar id="windowlist-menubar"> <menu label="window" oncommand="switch
focus(event.target);"> <menupopup id="window-menu" datasources="rdf:window-mediator" ref="nc:windowmediatorroot"> <template> <rule> <menuitem uri="rdf:*" label="rdf:http://home.netscape.com/nc-rdf#name"/> </rule> </template> </menupopup> </menu> </menubar> </toolbox> <script> function switch
focus(elem) { var mediator = components.classes["@mozilla.org/rdf/datasource;1?name=window-mediator"].getservice(); mediator.queryinterface(components.interfaces.nsiwindowdatasource); var resource = elem.getattribute('id'); switchwindow = mediator.getwindowforresource(resource); if (switchwindow){ switchwindow.
focus(); } } </s...
...And 3 more matches
label - Archive of obsolete content
if the user clicks the label, it will move the
focus to the associated control, specified with the control attribute.
...when the user clicks on the label, the associated element is given
focus.
...if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...And 3 more matches
tabs - Archive of obsolete content
attributes closebutton, disableclose, disabled, onclosetab, onnewtab, onselect, set
focus, selectedindex, tabbox, tabindex, tooltiptextnew, value, properties accessibletype, disabled, itemcount, selectedindex, selecteditem, tabindex, value, methods advanceselectedtab, appenditem, getindexofitem, getitematindex, insertitemat, removeitemat examples (example needed) attributes closebutton obsolete since gecko 1.9.2 type: boolean if this attribute i...
...if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
... set
focus type: boolean if true or omitted, the
focus will be given to the first element in the corresponding tabpanel when the tabs are navigated via the keyboard.
...And 3 more matches
Advanced text formatting - Learn web development
playable code <h2>live output</h2> <div class="output" style="min-height: 50px;"> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move
focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="input" style="min-height: 100px; width: 95%"> bacon the glue that binds the world together.
...ext) { const scrollpos = textarea.scrolltop; const caretpos = textarea.selectionstart; const front = (textarea.value).substring(0, caretpos); const back = (textarea.value).substring(textarea.selectionend, textarea.value.length); textarea.value = front + text + back; caretpos = caretpos + text.length; textarea.selectionstart = caretpos; textarea.selectionend = caretpos; textarea.
focus(); textarea.scrolltop = scrollpos; } // update the saved usercode every time the user updates the text area code textarea.onkeyup = function(){ // we only want to save the state when the user code is being shown, // not the solution, so that solution is not saved over the user code if(solution.value === 'show solution') { userentry = textarea.value; } else { solutionentry = te...
... playable code 2 <h2>live output</h2> <div class="output" style="min-height: 50px;"> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move
focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="input" style="min-height: 150px; width: 95%"> <p>hello and welcome to my motivation page.
...And 3 more matches
Getting started with HTML - Learn web development
playable code <h2>live output</h2> <div class="output" style="min-height: 50px;"> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move
focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="playable-code" style="min-height: 100px;width: 95%"> this is my text.
...tcaret(text) { var scrollpos = textarea.scrolltop; var caretpos = textarea.selectionstart; var front = (textarea.value).substring(0, caretpos); var back = (textarea.value).substring(textarea.selectionend, textarea.value.length); textarea.value = front + text + back; caretpos = caretpos + text.length; textarea.selectionstart = caretpos; textarea.selectionend = caretpos; textarea.
focus(); textarea.scrolltop = scrollpos; } // update the saved usercode every time the user updates the text area code textarea.onkeyup = function(){ // we only want to save the state when the user code is being shown, // not the solution, so that solution is not saved over the user code if(solution.value === 'show solution') { userentry = textarea.value; } else { solutionentry = te...
... playable code2 <h2>live output</h2> <div class="output" style="min-height: 50px;"> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move
focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="input" style="min-height: 100px;width: 95%"> <p>a link to my favorite website.</p> </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size:...
...And 3 more matches
Arrays - Learn web development
playable code <h2>live output</h2> <div class="output" style="min-height: 150px;"> <ul> </ul> <p></p> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move
focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="playable-code" style="height: 410px;width: 95%"> const list = document.queryselector('.output ul'); const totalbox = document.queryselector('.output p'); let total = 0; list.innerhtml = ''; totalbox.textcontent = ''; // number 1 'underpants:6.99' 'socks:5.99' 't-s...
...ext) { const scrollpos = textarea.scrolltop; const caretpos = textarea.selectionstart; const front = (textarea.value).substring(0, caretpos); const back = (textarea.value).substring(textarea.selectionend, textarea.value.length); textarea.value = front + text + back; caretpos = caretpos + text.length; textarea.selectionstart = caretpos; textarea.selectionend = caretpos; textarea.
focus(); textarea.scrolltop = scrollpos; } // update the saved usercode every time the user updates the text area code textarea.onkeyup = function(){ // we only want to save the state when the user code is being shown, // not the solution, so that solution is not saved over the user code if(solution.value === 'show solution') { userentry = textarea.value; } else { solutionentry = te...
... playable code 2 <h2>live output</h2> <div class="output" style="min-height: 150px;"> <input type="text"><button>search</button> <ul> </ul> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move
focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="playable-code" style="height: 370px; width: 95%"> const list = document.queryselector('.output ul'); const searchinput = document.queryselector('.output input'); const searchbtn = document.queryselector('.output button'); list.innerhtml = ''; let myhistory = []; searchbtn.onclick = function() { // we will...
...And 3 more matches
Getting started with Ember - Learn web development
introducing ember ember is a component-service framework that
focuses on the overall web application development experience, minimizing the trivial differences between applications — all while being a modern and light layer on top of native javascript.
...there are a couple of github issues open about this on the todomvc family of projects: add keyboard access to demos re-enable outline on
focusable elements ember has a strong commitment to being accessible by default and there is an entire section of the ember guides on accessibility on what it means for website / app design.
... that said, because this tutorial is a
focus on the javascript side of making a small web application, todomvc's value comes from providing pre-made css and recommended html structure, which eliminates small differences between implementations, allowing for easier comparison.
...And 3 more matches
Ember app structure and componentization - Learn web development
to start with, delete the contents of application.hbs and replace them with the following: <section class="todoapp"> <h1>todos</h1> <input class="new-todo" aria-label="what needs to be done?" placeholder="what needs to be done?" auto
focus > </section> note: aria-label provides a label for assistive technology to make use of — for example, for a screenreader to read out.
...update the application.hbs file again so its content looks like this: <section class="todoapp"> <h1>todos</h1> <input class="new-todo" aria-label="what needs to be done?" placeholder="what needs to be done?" auto
focus > <section class="main"> <input id="mark-all-complete" class="toggle-all" type="checkbox"> <label for="mark-all-complete">mark all as complete</label> <ul class="todo-list"> <li> <div class="view"> <input aria-label="toggle the completion of this todo" class="toggle" type="checkbox" > <label>buy movi...
...e tickets</label> <button type="button" class="destroy" title="remove this todo" ></button> </div> <input auto
focus class="edit" value="todo text"> </li> <li> <div class="view"> <input aria-label="toggle the completion of this todo" class="toggle" type="checkbox" > <label>go to movie</label> <button type="button" class="destroy" title="remove this todo" ></button> </div> <input auto
focus class="edit" value="todo text"> </li> </ul> </section> <footer class="footer"> <span class="todo-count"> <strong>0</strong> todos left </span> <ul...
...And 3 more matches
Styling Vue components with CSS - Learn web development
add the following contents to the reset.css file: /*reset.css*/ /* resets */ *, *::before, *::after { box-sizing: border-box; } *:
focus { outline: 3px dashed #228bec; } html { font: 62.5% / 1.15 sans-serif; } h1, h2 { margin-bottom: 0; } ul { list-style: none; padding: 0; } button { border: none; margin: 0; padding: 0; width: auto; overflow: visible; background: transparent; color: inherit; font: inherit; line-height: normal; -webkit-font-smoothing: inherit; -moz-osx-font-smoothing: inherit; -web...
...kit-appearance: none; } button::-moz-
focus-inner { border: 0; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { /* 1 */ overflow: visible; } input[type="text"] { border-radius: 0; } body { width: 100%; max-width: 68rem; margin: 0 auto; font: 1.6rem/1.25 "helvetica neue", helvetica, arial, sans-serif; background-color: #f5f5f5; color: #4d4d4d; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } @media screen and (min-width: 620px) { body { font-size: 1.9rem; line-height: 1.31579; } } /*end resets*/ next, in your src/main.js file, import the reset.css file like so: import './assets/reset.css'; this will cause the file to get picked up during the ...
... update your app.vue file’s <style> element so it looks like so: <style> /* global styles */ .btn { padding: 0.8rem 1rem 0.7rem; border: 0.2rem solid #4d4d4d; cursor: pointer; text-transform: capitalize; } .btn__danger { color: #fff; background-color: #ca3c3c; border-color: #bd2130; } .btn__filter { border-color: lightgrey; } .btn__danger:
focus { outline-color: #c82333; } .btn__primary { color: #fff; background-color: #000; } .btn-group { display: flex; justify-content: space-between; } .btn-group > * { flex: 1 1 auto; } .btn-group > * + * { margin-left: 0.8rem; } .label-wrapper { margin: 0; flex: 0 0 100%; text-align: center; } [class*="__lg"] { display: inline-block; width: 100%; font-size: 1.9rem; } [class*=...
...And 3 more matches
Accessibility information for UI designers and developers
see also: understanding sc 1.4.3: contrast the
focus indicator users who navigate by keyboard (or other specialised input methods), rely on
focus styles to see where they are on the page.
... only one element has
focus at a given time, typically revealed by browsers with a dotted outline.
... css lets authors change what the
focus indicator look like, so you can design it to match branding.
...And 3 more matches
Overview of Mozilla embedding APIs
contract-id: ns_webbrowser_contractid implemented interfaces: nsiwebbrowser nsiwebnavigation nsiwebbrowsersetup nsiwebbrowserpersist nsiwebbrowserfind nsiwebbrowserprint nsiwebbrowser
focus nsibasewindow requestor interfaces: nsidomwindow nsidomdocument nsiwebprogress nsiclipboardcommands nsiprompt related interfaces: nsiprompt nsiwebbrowserchrome nsiwebbrowsersitewindow nsiwebprogresslistener nsicontextmenulistener nsiprintoptions overview: most of gecko's functionality is exposed through the nswebbrowser component.
...the search is always performed within the domwindow which currently has the
focus.
...
focus management
focus managment within the webbrowser is accessed via the nsiwebbrowser
focus interface.
...And 3 more matches
nsISelection
focusnode nsidomnode returns the node in which the selection ends.
...
focusoffset long the offset within the (text) node where the selection ends.
...when the selection is collapsed(), and the content is
focused and editable, the caret will blink there.
...And 3 more matches
Hit regions and accessibility - Web APIs
partially overlaying the <a href="http://en.wikipedia.org/wiki/circle" on
focus="drawcircle();" onblur="drawpicture();">circle</a>.
... partially overlaying the circle is a green <a href="http://en.wikipedia.org/wiki/square" on
focus="drawsquare();" onblur="drawpicture();">square</a> and a purple <a href="http://en.wikipedia.org/wiki/triangle" on
focus="drawtriangle();" onblur="drawpicture();">triangle</a>, both of which are semi-opaque, so the full circle can be seen underneath.</p> </canvas> see the video how nvda reads this example by steve faulkner.
...
focus rings when working with the keyboard,
focus rings are a handy indicator to help navigating on a page.
...And 3 more matches
Window: blur event - Web APIs
the blur event fires when an element has lost
focus.
... the opposite of blur is
focus.
... bubbles no cancelable no interface
focusevent event handler property onblur sync / async sync composed yes examples live example this example changes the appearance of a document when it loses
focus.
...And 3 more matches
Using the link role - Accessibility
when this role is added to an element, tab can be used to change
focus to the link, and enter used to execute the link.
...native <a> elements also support keyboard and
focus requirements by default, without need for additional customization.
... assistive technology products should listen for such an event and notify the user accordingly: screen readers should announce the text of the link or its label when it is
focused, along with the fact that it is a link.
...And 3 more matches
ARIA: textbox role - Accessibility
associated aria properties aria-activedescendent attribute taking as it's value the id of is either a descendant of the element with dom
focus or is a logical descendant as indicated by the aria-owns attribute, it indicates when that element has
focus, when it is part of a composite widget such as a combobox.
... for example, in a combobox,
focus may remain on the textbox while the value of aria-activedescendant on the textbox element refers to a descendant of a popup listbox that is controlled by the textbox.this attribute must be updated programmatically as the
focus changes.
...the hint should be a sample value or a brief description of the expected format.this information should not be used as a substitute for a label: a label is
focusable, permanent, indicates what kind of information is expected, and increases the hit area for setting
focus on the control, whereas placeholder text is only temporary hint about the expected value, which if implemented incorrectly can decrease accessibility.
...And 3 more matches
disabled - HTML: Hypertext Markup Language
the boolean disabled attribute, when present, makes the element not mutable,
focusable, or even submitted with the form.
... the user can neither edit nor
focus on the control, nor it's form control descendants.
...often browsers grey out such controls and it won't receive any browsing events, like mouse clicks or
focus-related ones.
...And 3 more matches
Firefox user agent string reference - HTTP
form factor gecko user agent string phone mozilla/5.0 (android 4.4; mobile; rv:41.0) gecko/41.0 firefox/41.0 tablet mozilla/5.0 (android 4.4; tablet; rv:41.0) gecko/41.0 firefox/41.0
focus for android from version 1,
focus is powered by android webview and uses the following user agent string format: mozilla/5.0 (linux; <android version> <build tag etc.>) applewebkit/<webkit rev> (khtml, like gecko) version/4.0
focus/<
focusversion> chrome/<chrome rev> mobile safari/<webkit rev> tablet versions on webview mirror mobile, but do not contain a mobile token.
... starting in version 6, users can opt into using a geckoview-based
focus for android with a hidden preference: it uses a geckoview ua string to advertise gecko compatibility.
...
focus version (rendering engine) user agent string 1.0 (webview mobile) mozilla/5.0 (linux; android 7.0) applewebkit/537.36 (khtml, like gecko) version/4.0
focus/1.0 chrome/59.0.3029.83 mobile safari/537.36 1.0 (webview tablet) mozilla/5.0 (linux; android 7.0) applewebkit/537.36 (khtml, like gecko) version/4.0
focus/1.0 chrome/59.0.3029.83 safari/537.36 6.0 (geckoview) mozilla/5.0 (android 7.0; mobile; rv:62.0) gecko/62.0 firefox/62.0 klar for android since version 4.1, klar for android uses the same ua string as
focus for android.
...And 3 more matches
Miscellaneous - Archive of obsolete content
firefox 3 / gecko 1.9: var utils = window.queryinterface(components.interfaces.nsiinterfacerequestor) .getinterface(components.interfaces.nsidomwindowutils); utils.sendmouseevent("mousedown", 10, 10, 0, 1, 0); utils.sendmouseevent("mouseup", 10, 10, 0, 1, 0); getting the currently selected text from browser.xul overlay context: var selectedtext = document.commanddispatcher.
focusedwindow.getselection().tostring(); or: content.getselection(); // |window| object is implied; i.e., window.content.getselection() or: getbrowserselection(); // |window| object is implied; i.e., window.getbrowserselection() this final option massages the selection to remove leading and trailing whitespace.
... see also http://mxr.mozilla.org/seamonkey/source/browser/base/content/browser.js#4674 discovering which element in the loaded document has
focus //
focusedcontrol stores the
focused field, or null if there is none.
... var
focusedcontrol; window.addeventlistener("load", function(e) { onwindowload(e); }, false); function onwindowload() { gbrowser.addeventlistener("load", onpageload, true); } function onpageload() { pagedoc = document.commanddispatcher.
focusedwindow.document; var inputlist = pagedoc.getelementsbytagname('input'); for (var i=1; i<inputlist.length; i++) { inputlist.item(i).
...And 2 more matches
Tabbed browser - Archive of obsolete content
tabbrowser.selectedtab = tabbrowser.tabcontainer.childnodes[index]; //
focus *this* browser-window browserwin.
focus(); found = true; break; } } } // our url isn't open.
...if such a tab exists, we change its url/uri and
focus/select it.
... if (currenttab.hasattribute(attrname)) { // yes--select and
focus it.
...And 2 more matches
menulist - Archive of obsolete content
attributes accesskey, crop, disableautoselect, disabled, editable,
focused, image, label, oncommand, open, preference, readonly, sizetopopup, tabindex, value properties accessibletype, crop, description, disableautoselect, disabled, editable, editor, image, inputfield, itemcount, label, menuboxobject, menupopup, open, selectedindex, selecteditem, tabindex, value methods appenditem, contains, getindexofitem, getitematindex, insertitemat, removeallitems, remov...
...if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...
focused type: boolean this attribute is true if the element is
focused.
...And 2 more matches
radio - Archive of obsolete content
attributes accesskey, command, crop, disabled,
focused, group, image, label, selected, tabindex, value properties accesskey, accessibletype, control, crop, disabled, image, label, radiogroup, selected, tabindex, value examples <radiogroup> <radio id="orange" label="red" accesskey="r"/> <radio id="violet" label="green" accesskey="g" selected="true"/> <radio id="yellow" label="blue" accesskey="b" disabled="true"/> </radiogroup> at...
...if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...
focused type: boolean this attribute is true if the element is
focused.
...And 2 more matches
WAI-ARIA basics - Learn web development
where this is unavoidable, wai-aria provides a means to allow other elements to receive
focus (using tabindex).
... however, sometimes you will end up having to write code that either uses non-semantic elements as buttons (or other types of control), or uses
focusable controls for not quite the right purpose.
... in terms of making non-
focusable code
focusable, wai-aria extends the tabindex attribute with some new values: tabindex="0" — as indicated above, this value allows elements that are not normally tabbable to become tabbable.
...And 2 more matches
Client-side form validation - Learn web development
in this chapter we are
focusing on client-side validation.
...note how the invalid input gets
focus, a default error message ("please fill out this field") appears, and the form is prevented from being sent.
...xtarea> </p> <p> <button>submit</button> </p> </form> and now some css to style the html: form { font: 1em sans-serif; max-width: 320px; } p > label { display: block; } input[type="text"], input[type="email"], input[type="number"], textarea, fieldset { width : 100%; border: 1px solid #333; box-sizing: border-box; } input:invalid { box-shadow: 0 0 5px 1px red; } input:
focus:invalid { box-shadow: none; } this renders as follows: see validation-related attributes for a complete list of attributes that can be used to constrain input values and the input types that support them.
...And 2 more matches
Mozilla's Section 508 Compliance
(c) a well-defined on-screen indication of the current
focus shall be provided that moves among interactive interface elements as the input
focus changes.
... the
focus shall be programmatically exposed so that assistive technology can track
focus and
focus changes.
...we expose
focus programmatically via msaa (windows) and atk (linux/unix).
...And 2 more matches
<textarea> - HTML: Hypertext Markup Language
the <textarea> element also accepts several attributes common to form <input>s, such as autocomplete, auto
focus, disabled, placeholder, readonly, and required.
... auto
focus this boolean attribute lets you specify that a form control should have input
focus when the page loads.
...droidfirefox for androidopera for androidsafari on iossamsung internettextareachrome full support yesedge full support 12firefox full support yesnotes full support yesnotes notes before firefox 6, when a <textarea> was
focused, the insertion point was placed at the end of the text by default.
...And 2 more matches
window/utils - Archive of obsolete content
parameters window : nsidomwindow returns boolean get
focusedwindow() gets the child window within the topmost browser window that is
focused.
... see nsi
focusmanager for more details.
... returns nsidomwindow get
focusedelement() get the element that is currently
focused.
... this will always be an element within the document loaded in the
focused window, or null if no element in that document is
focused.
Creating annotations - Archive of obsolete content
annotation editor content script in the corresponding content script we do two things: handle a message from the add-on code by giving the text area
focus listen for the return key and when it is pressed, send the contents of the text area to the add-on.
... here's the code: var textarea = document.getelementbyid('annotation-box'); textarea.onkeyup = function(event) { if (event.keycode == 13) { self.postmessage(textarea.value); textarea.value = ''; } }; self.on('message', function() { var textarea = document.getelementbyid('annotation-box'); textarea.value = ''; textarea.
focus(); }); save this inside data/editor as annotation-editor.js.
...editor = panels.panel({ width: 220, height: 220, contenturl: data.url('editor/annotation-editor.html'), contentscriptfile: data.url('editor/annotation-editor.js'), onmessage: function(annotationtext) { if (annotationtext) { console.log(this.annotationanchor); console.log(annotationtext); } annotationeditor.hide(); }, onshow: function() { this.postmessage('
focus'); } }); we create the editor panel but don't show it.
... we will send the editor panel the
focus message when it is shown, so it will give the text area
focus.
Adding Events and Commands - Archive of obsolete content
for a button, it represents the action of the user clicking on it, or
focusing it with the keyboard and then pressing the enter key.
... on
focus and onblur.
... used when an element receives or loses
focus when the user is navigating with the keyboard.
... you can combine these with -moz-user-
focus to add custom
focus behavior to elements that normally wouldn't have it.
Tabs - Archive of obsolete content
blah(lengthstring
focusedstringtostringstringpopstringpushstringreversestringshiftstringsortstringsplicestringunshiftstring)this is some default text lengththe number of open tabsstring
focusedthe current tab in your browserstring tostringstuffstring popstuffstring pushstuffstring reversestuffstring shiftstuffstring sortstuffstring splicestuffstring unshiftstuffstring onready()when the inherited document is fully loaded.
... on
focus()changing the
focus of a tab.
... urlurl to be openedstring jetpack.tabs.open("http://www.example.com/"); blah(lengthstring
focusedstringtostringstringpopstringpushstringreversestringshiftstringsortstringsplicestringunshiftstring)this is some default text lengththe number of open tabsstring
focusedthe current tab in your browserstring tostringstuffstring popstuffstring pushstuffstring reversestuffstring shiftstuffstring sortstuffstring splicestuffstring unshiftstuffstring onready()when the inherited document is fully loaded.
... on
focus()changing the
focus of a tab.
Accessibility/XUL Accessibility Reference - Archive of obsolete content
caption see groupbox checkbox <checkbox label='<!--label text-->' /> colorpicker <colorpicker type="button" palettename="standard" /> colorpicker appears to read color values out if the colorpicker can get
focus in the first place.
... column see grid columns see grid command see keyboard shortcut tutorial commandset see keyboard shortcut tutorial deck only the currently selected deck layer can be
focused.
... jaws indicates percentage to the user radio see radiogroup radiogroup <label value='<!--radio group-->' control='radioid' /> <radiogroup id='radioid'> <radio selected="true" label='<!--option1-->' /> <radio label='<!--option2-->' /> </radiogroup> row see grid rows see grid stack all elements can be
focused, even if not visible due to being hidden under something else statusbar <statusbar> <statusbarpanel label="<!--status bar-->" flex="1"/> </statusbar> read using jaws with insert+page down statusbarpanel see statusbar tab see tabbox tabbox <tabbox> <tabs> <tab label="<!--tab text-->" /> </tabs> <tabpanels> <...
... </tabpanel> </tabpanels>
focusing the tabbox will visually set
focus to the selected tab, then you can select different tabs by using the left and right arrow keys.
command - Archive of obsolete content
typically, this will be the currently
focused element.
...see also: command attribute, commandset element attributes disabled, label, oncommand,reserved examples the following code will send a paste command (cmd_paste) to the currently
focused element: // first include chrome://global/content/globaloverlay.js godocommand("cmd_paste"); example with two buttons <commandset><command id="cmd_openhelp" oncommand="alert('help');"/></commandset> <button label="help" command="cmd_openhelp"/> <button label="more help" command="cmd_openhelp"/> attributes disabled type: boolean indicates whether the element is disabled or not.
...if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
listitem - Archive of obsolete content
this is typically used by a theme to customize the
focus ring.
...if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
tabbox - Archive of obsolete content
thus, if this attribute is not used, the tabbox or an element inside it must have the
focus for the keyboard navigation to apply.
...tab navigation will occur as long as any element in the window is
focused.
...tab navigation will occur as long as any element in the document is
focused.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
toolbarbutton - Archive of obsolete content
where not possible, make all toolbarbuttons
focusable by -moz-user-
focus: normal.
...if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
XForms Custom Controls - Archive of obsolete content
*/ void refresh(); /** * is called when
focus is advanced to the xforms element.
... */ boolean
focus(); /** * is called when control should be disabled.
...
focus() is used by the processor to tell the control that it is getting
focus through one of a variety of ways (i.e.
... through xf:set
focus action) and that the control needs to ensure that the proper widget is given
focus.
Implementation Status - Archive of obsolete content
xforms-recalculate supported 4.3.3 xforms-revalidate supported 4.3.4 xforms-refresh supported 4.3.5 xforms-reset supported 4.3.6 xforms-next xforms-previous supported 4.3.7 xforms-
focus supported 4.3.8 xforms-help xforms-hint supported 4.3.9 xforms-submit partial see section 11.2 for more details 4.3.10 xforms-submit-serialize supported 4.4 notification events supported ...
... 4.4.8 xforms-required supported 4.4.9 xforms-optional supported 4.4.10 xforms-enabled supported 4.4.11 xforms-disabled supported 4.4.12 domactivate supported 4.4.13 dom
focusin supported 4.4.14 dom
focusout supported 4.4.15 xforms-select xforms-deselect supported 4.4.16 xforms-in-range supported 4.4.17 xforms-out-of-range supported 4.4.18 xforms-scroll-...
... 4.6.3 for select or select1 controls partial 4.6.4 for trigger controls supported 4.6.5 for submit controls supported 4.6.6 sequence: selection without value change supported 4.6.7 sequence: value change with
focus change supported 4.6.8 sequence: activating a trigger supported 4.6.9 sequence: submission supported 4.7 resolving id references in xforms unsupported 4.7.1 references to elements within a repeat element unsupported ...
... 303198; 339217; 10.4 delete partial we need to better handle when @at evaluates to nan 303198; 10.5 setindex supported 10.6 toggle supported 10.7 set
focus supported 10.8 dispatch supported 10.9 rebuild partial is dispatching events instead of calling directly 332231; 10.10 recalculate partial is dispatching events instead of calling directly.
XForms Select1 Element - Archive of obsolete content
accesskey - used to specify the keyboard shortcut for
focusing this control.
...loses
focus), otherwise it is updated upon item selection xul widget characteristics analogous widgets are <html:select/> and <xul:menulist/> visual grouping by choices element isn't implemented selection="open" attribute isn't supported if incremental attribute value is false, the bound node is updated when the select control is blurred (i.e.
... loses
focus), otherwise it is updated upon item selection listbox the select1 is represented as listbox (xhtml/xul).
...loses
focus), otherwise it is updated upon item selection radio group the select is represented as group of radios (xhtml/xul).
Choosing Standards Compliance Over Proprietary Practices - Archive of obsolete content
focusing on the software development portion of an organization, there are numerous standards bodies that can affect development decisions.
... telecommunication union ) oasis (organization for the advancement of structured information standards ) oma (open mobile alliance ), uni (unicode consortium ) w3c (world wide web consortium ) iana (internet assigned numbers authority ) ecma international like the processes and standards that accountants and project managers must follow, the above-mentioned standards organizations provide
focus and direction for the development engineering community.
...adhering to a set of future-
focused international standards will make cross-functional integration possible.
...following proprietary de facto standards leaves an organization vulnerable and open to obsolescence when the owner of the de facto changes
focus or direction, or abandons the de facto altogether and renders the standard stagnate.
Game monetization - Game development
the word itself acquired negative connotations after big companies
focused on creating games, the main purpose of which was to get as much money from the players as possible instead of delivering a fun experience.
... other non-game
focused monetization strategies there are other ways you can earn money when building html5 games, and it doesn't even have to be game-related.
...if you
focus on sharing the knowledge first and use your games just as the examples it should be ok.
...you might however also
focus on selling licenses, doing branding, or earning on a revenue share basis from the advertisements.
Pseudo-classes and pseudo-elements - Learn web development
:
focus — only applies if the user
focuses the element using keyboard controls.
... :
focus matches when an element has
focus.
... :
focus-visible matches when an element has
focus and the
focus should be visible to the user.
... :
focus-within matches an element with
focus plus an element with a descendent that has
focus.
Adding vector graphics to the Web - Learn web development
(external stylesheets invoked from the svg file take no effect.) you cannot restyle the image with css pseudoclasses (like :
focus).
... inlining svg is the only approach that lets you use css interactions (like :
focus) and css animations on your svg image (even in your regular stylesheet.) you can make svg markup into a hyperlink by wrapping it in an <a> element.
... playable code <h2>live output</h2> <div class="output" style="min-height: 50px;"> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move
focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="input" style="width: 95%;min-height: 200px;"> <svg width="100%" height="100%"> <rect width="100%" height="100%" fill="red" /> <circle cx="100%" cy="100%" r="150" fill="blue" stroke="black" /> <polygon points="120,0 240,225 0,225" fill="green"/> <text x="50" y="100" font-family="verdana" font-s...
...ext) { const scrollpos = textarea.scrolltop; const caretpos = textarea.selectionstart; const front = (textarea.value).substring(0, caretpos); const back = (textarea.value).substring(textarea.selectionend, textarea.value.length); textarea.value = front + text + back; caretpos = caretpos + text.length; textarea.selectionstart = caretpos; textarea.selectionend = caretpos; textarea.
focus(); textarea.scrolltop = scrollpos; } // update the saved usercode every time the user updates the text area code textarea.onkeyup = function(){ // we only want to save the state when the user code is being shown, // not the solution, so that solution is not saved over the user code if(solution.value === 'show solution') { userentry = textarea.value; } else { solutionentry = te...
Images in HTML - Learn web development
if you get really stuck, press the show solution button to see an answer: playable code <h2>live output</h2> <div class="output" style="min-height: 50px;"> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move
focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="input" style="min-height: 100px; width: 95%"> <img> </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-a...
...tcaret(text) { var scrollpos = textarea.scrolltop; var caretpos = textarea.selectionstart; var front = (textarea.value).substring(0, caretpos); var back = (textarea.value).substring(textarea.selectionend, textarea.value.length); textarea.value = front + text + back; caretpos = caretpos + text.length; textarea.selectionstart = caretpos; textarea.selectionend = caretpos; textarea.
focus(); textarea.scrolltop = scrollpos; } // update the saved usercode every time the user updates the text area code textarea.onkeyup = function(){ // we only want to save the state when the user code is being shown, // not the solution, so that solution is not saved over the user code if(solution.value === 'show solution') { userentry = textarea.value; } else { solutionentry = te...
...if you get really stuck, press the show solution button to see an answer: playable code 2 <h2>live output</h2> <div class="output" style="min-height: 50px;"> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move
focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="input" style="min-height: 100px; width: 95%"> </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: ...
...tcaret(text) { var scrollpos = textarea.scrolltop; var caretpos = textarea.selectionstart; var front = (textarea.value).substring(0, caretpos); var back = (textarea.value).substring(textarea.selectionend, textarea.value.length); textarea.value = front + text + back; caretpos = caretpos + text.length; textarea.selectionstart = caretpos; textarea.selectionend = caretpos; textarea.
focus(); textarea.scrolltop = scrollpos; } // update the saved usercode every time the user updates the text area code textarea.onkeyup = function(){ // we only want to save the state when the user code is being shown, // not the solution, so that solution is not saved over the user code if(solution.value === 'show solution') { userentry = textarea.value; } else { solutionentry = te...
Making decisions in your code — conditionals - Learn web development
"june">june</option> <option value="july">july</option> <option value="august">august</option> <option value="september">september</option> <option value="october">october</option> <option value="november">november</option> <option value="december">december</option> </select> <h1></h1> <ul></ul> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move
focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="playable-code" style="height: 400px;width: 95%"> const select = document.queryselector('select'); const list = document.queryselector('ul'); const h1 = document.queryselector('h1'); select.onchange = function() { const choice = select.value; // add conditional here createcalendar(days, choice); } func...
...ext) { const scrollpos = textarea.scrolltop; const caretpos = textarea.selectionstart; const front = (textarea.value).substring(0, caretpos); const back = (textarea.value).substring(textarea.selectionend, textarea.value.length); textarea.value = front + text + back; caretpos = caretpos + text.length; textarea.selectionstart = caretpos; textarea.selectionend = caretpos; textarea.
focus(); textarea.scrolltop = scrollpos; } // update the saved usercode every time the user updates the text area code textarea.onkeyup = function(){ // we only want to save the state when the user code is being shown, // not the solution, so that solution is not saved over the user code if(solution.value === 'show solution') { userentry = textarea.value; } else { solutionentry = te...
... <label for="theme">select theme: </label> <select id="theme"> <option value="white">white</option> <option value="black">black</option> <option value="purple">purple</option> <option value="yellow">yellow</option> <option value="psychedelic">psychedelic</option> </select> <h1>this is my website</h1> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move
focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="playable-code" style="height: 450px;width: 95%"> const select = document.queryselector('select'); const html = document.queryselector('.output'); select.onchange = function() { const choice = select.value; // add switch statement } function update(bgcolor, textcolor) { html.style.backgroundcolor = bgco...
...ext) { const scrollpos = textarea.scrolltop; const caretpos = textarea.selectionstart; const front = (textarea.value).substring(0, caretpos); const back = (textarea.value).substring(textarea.selectionend, textarea.value.length); textarea.value = front + text + back; caretpos = caretpos + text.length; textarea.selectionstart = caretpos; textarea.selectionend = caretpos; textarea.
focus(); textarea.scrolltop = scrollpos; } // update the saved usercode every time the user updates the text area code textarea.onkeyup = function(){ // we only want to save the state when the user code is being shown, // not the solution, so that solution is not saved over the user code if(solution.value === 'show solution') { userentry = textarea.value; } else { solutionentry = te...
Web performance - Learn web development
this is known as web performance, and in this module you'll
focus on the fundamentals of how to create performant websites.
... the rest of our beginner's learning material tried to stick to web best practices such as performance and accessibility as much as possible, however, it is good to
focus specifically on such topics too, and make sure you are familiar with them.
... css performance features css may be a less important optimization
focus for improved performance, but there are some css features that impact performance more than others.
...
focusing on performance there are many different things a developer can do to improve performance, but how fast is fast enough?
Introduction to client-side frameworks - Learn web development
you often have to employ advanced framework apis to access native browser features like aria live regions or
focus management.
...the browser knows to set
focus to the top of the page and assistive technologies will announce the title of the page.
... with client-side routing, your browser is not loading new web pages, so it doesn't know that it should automatically adjust
focus or announce a new page title.
...ooter functionality, conditional rendering routing in ember ember resources and troubleshooting vue getting started with vue creating our first vue component rendering a list of vue components adding a new todo form: vue events, methods, and models styling vue components with css using vue computed properties vue conditional rendering: editing existing todos
focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
React resources - Learn web development
reach router is well-suited to simpler applications, and automatically manages
focus as the user navigates from page to page.
...
focus management is essential in client-side routing — without it, keyboard users can be trapped in
focus limbo, and screen-reader users may have no idea that they have moved to a new page.
...when this merge happens, react router will be the surviving project (with the addition of the
focus management features of reach).
...ooter functionality, conditional rendering routing in ember ember resources and troubleshooting vue getting started with vue creating our first vue component rendering a list of vue components adding a new todo form: vue events, methods, and models styling vue components with css using vue computed properties vue conditional rendering: editing existing todos
focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
Mozilla accessibility architecture
accessibility apis are used by 3rd party software like screen readers, screen magnifiers, and voice dictation software, which need information about document content and ui controls, as well as important events like changes of
focus.
...all
focusable nodes, tables and text have accessibility interfaces.
...the assistive technology can choose to get the entire tree by using a depth- or breadth- first search, it can choose to get accessibles only based on events like
focus, or it can get the accessible at a given point on the screen.
... gecko events (or callback) event type accessibility event
focus, select standard html dom event event_
focus dommenuitemactive, dommenubaractive mozilla dom event_
focus domnodeinserted w3c dom mutation event event_create (atk) event_reorder (msaa) domsubtreemodified w3c dom mutation event event_reorder domnoderemoved w3c dom mutation event ...
Gecko states
applied to: role_menuitem, role_cell, role_outlineitem, xxx: continue events: event_state_change Сoncomitant state: state_selectable state_
focused the object is
focused applied to: events: concomitant state: state_
focusable state_pressed the object is pressed.
...a speech-based accessibility aid does not announce information when an object with this state has the
focus because the object automatically announces information.
... isn't used state_
focusable the object can be
focused.
... applied to: events: concomitant state: state_
focused state_selectable the object can be selected.
nsIAccessible
the accessible tree is a subset of nodes in the dom tree -- such as documents,
focusable elements and text.
...
focus and selection in order to
focus an accessible or get
focused child accessible use nsiaccessible.take
focus() and nsiaccessible.
focusedchild.
... take
focus this method
focuses this accessible node.
...
focusedchild
focused accessible child of node.
nsIAccessibleHyperLink
selected boolean determines whether the element currently has the
focus, for example after returning from the destination page.
... note: aria links can only be
focused if they have the tabindex attribute set.
... also, state_
focused should then be set on the accessible for this link.
... return value true if the element currently has the
focus.
nsITextInputProcessor
tip.appendclausetopendingcomposition("foo-".length, tip.attr_converted_clause); tip.appendclausetopendingcomposition("bar".length, tip.attr_selected_clause); tip.appendclausetopendingcomposition("-buzz".length, tip.attr_converted_clause); // then, sets the caret if you need tip.setcaretinpendingcomposition("foo-bar".length); // finally, flush the pending composition on the
focused editor if (!tip.flushpendingcomposition()) { return; // composition is not started } if there is no composition, flushpendingcomposition() starts composition with dispatching compositionstart event automatically.
... boolean begininputtransaction(in nsidomwindow awindow, in nsitextinputprocessorcallback acallback); parameters awindow the dom window which has
focused editor.
... boolean begininputtransactionfortests(in nsidomwindow awindow, in nsitextinputprocessorcallback acallback optional); parameters awindow the dom window which has
focused editor.
... flushpendingcomposition() flushes the pending composition which are set by setpendingcompositionstring(), appendclausetopendingcomposition(), and setcaretinpendingcomposition() on the
focused editor.
Clients.openWindow() - Web APIs
elf.registration.shownotification('you\'ve got messages!', notificationobject); } // notification click event listener self.addeventlistener('notificationclick', e => { // close the notification popout e.notification.close(); // get all the window clients e.waituntil(clients.matchall({ type: 'window' }).then(clientsarr => { // if a window tab matching the targeted url already exists,
focus that; const hadwindowto
focus = clientsarr.some(windowclient => windowclient.url === e.notification.data.url ?
... (windowclient.
focus(), true) : false); // otherwise, open a new tab to the applicable url and
focus it.
... if (!hadwindowto
focus) clients.openwindow(e.notification.data.url).then(windowclient => windowclient ?
... windowclient.
focus() : null); })); }); specifications specification status comment service workersthe definition of 'clients: openwindow' in that specification.
Selection.extend() - Web APIs
the selection.extend() method moves the
focus of the selection to a specified point.
...the selection will be from the anchor to the new
focus, regardless of direction.
... syntax sel.extend(node, offset) parameters node the node within which the
focus will be moved.
... offset optional the offset position within node where the
focus will be moved to.
A simple RTCDataChannel sample - Web APIs
when the local peer experiences an open or close event, the handlesendchannelstatuschange() method is called: function handlesendchannelstatuschange(event) { if (sendchannel) { var state = sendchannel.readystate; if (state === "open") { messageinputbox.disabled = false; messageinputbox.
focus(); sendbutton.disabled = false; disconnectbutton.disabled = false; connectbutton.disabled = true; } else { messageinputbox.disabled = true; sendbutton.disabled = true; connectbutton.disabled = false; disconnectbutton.disabled = true; } } } if the channel's state has changed to "open", that indicates that we have finished e...
...the user interface is updated correspondingly by enabling the text input box for the message to send,
focusing the input box so that the user can immediately begin to type, enabling the "send" and "disconnect" buttons, now that they're usable, and disabling the "connect" button, since it is not needed when the conneciton is open.
...that method is simple enough: function sendmessage() { var message = messageinputbox.value; sendchannel.send(message); messageinputbox.value = ""; messageinputbox.
focus(); } first, the text of the message is fetched from the input box's value attribute.
...the rest of this method is just some user experience sugar -- the input box is emptied and re-
focused so the user can immediately begin typing another message.
Viewpoints and viewers: Simulating cameras in WebXR - Web APIs
instead, a zoom shot changes the magnification of the camera over time to make the area of
focus seem closer to or farther away from the viewer, without actually physically moving the camera.
... a slow move can bring a sense of movement, ease, or
focus to a scene, while a rapid zoom can create a sense of anxiety, surprise, or tension.
...the resulting motion can create impressively smooth effects, especially if moving along with the person or object that's the
focus of your shot.
...the camera doesn't rotate at all, so the
focus of the shot slowly glides off the screen.
Fundamentals of WebXR - Web APIs
a vr headset is worn on the head, with a strap that goes behind the head to fasten it in place, and one or two displays whose screens are
focused into the eyes using lenses.
... the vast majority of headsets use a single display whose frame is divided in half, with one half
focused onto each of the user's eyes.
... for example, if a headset uses a 2560x1440 screen, with the left half being used for the left eye's view and the right half or the right eye's view, the framebuffer is used like this: the simplest headsets have no integrated sensors, and simply
focus each half of the screen into the corresponding eye.
... there are a number of theories surrounding exactly what about virtual reality causes some people to feel uncomfortable or sick, most of which
focusing on the idea that even subtle differences between what the brain thinks should be happening and what is being seen can cause these symptoms.
XRSession.visibilityState - Web APIs
the read-only visibilitystate property of the xrsession interface is a string indicating whether the webxr content is currently visible to the user, and if it is, whether it's the primary
focus.
... syntax visibilitystate = xrsession.visibilitystate; value a domstring containing one of the values defined in the enumerated type xrvisibilitystate; this string indicates whether or not the xr content is visible to the user and if it is, whether or not it's currently the primary
focus.
... visible the virtual scene rendered by the xrsession is currently visible to the user and is the primary
focus of the user's attention.
... visible-blurred while the virtual scene rendered by the xrsession may currently be visible to the user, it is not the user's primary
focus at the moment; it's also possible the session is not currently visible at all.
Using the alertdialog role - Accessibility
unlike regular alerts, an alert dialog must have at least one
focusable control and
focus must be moved to that control when the alert dialog appears.
... generally alert dialogs have at least a confirmation, close or cancel button that can be used to move
focus to.
...which particular control
focus should be moved to depends on the purpose of the dialog.
... when the alert dialog is correctly labeled and
focus is moved to a control inside the dialog, screen readers should announce the dialog's accessible role, name and optionally description before announcing the
focused element.
Operable - Accessibility
for example, if you press enter/return on a
focused button to open an options window, you should be able to close that window again and return to the main content using the keyboard.
... see ui controls and building keyboard accessibility back in 2.1.4 character key shortcuts (a) added in 2.1 if a single character key shortcut exists, then at least one of the following is true: single character key shortcuts can be turned off, remapped or are only active when the relevant user interface component is in
focus.
... 2.4.3 logical
focus order (a) the "tabbing order" of
focusable page features (e.g.
... 2.4.7 visible
focus for
focusable elements (aa) when tabbing through
focusable elements such as links or form inputs, there should be a visual indicator to show you which element currently has
focus.
:-moz-ui-invalid - CSS: Cascading Style Sheets
this pseudo-class is applied according to the following rules: if the control does not have
focus, and the value is invalid, apply this pseudo-class.
... if the control has
focus, and the value was valid (including empty) when it gained
focus, do not apply the pseudo-class.
... if the control has
focus, and the value was invalid when it gained
focus, re-validate on every keystroke.
... the result is that if the control was valid when the user started interacting with it, the validity styling is changed only when the user shifts
focus to another control.
:-moz-ui-valid - CSS: Cascading Style Sheets
this pseudo-class is applied according to the following rules: if the control does not have
focus, and the value is valid, apply this pseudo-class.
... if the control has
focus, and the value was valid (including empty) when it gained
focus, apply this pseudo-class.
... if the control has
focus, and the value was invalid when it gained
focus, re-validate on every keystroke.
... the result is that if the control was valid when the user started interacting with it, the validity styling is changed only when the user shifts
focus to another control.
Media - Progressive web apps (PWAs)
many pages in this tutorial
focused on the css properties and values, as well as how you use these to specify the way that content displays.
... there are five special selectors: selector selects e:hover any e element that has the pointer over it e:
focus any e element that has keyboard
focus e:active the e element that is involved in the current user action e:link any e element that is a hyperlink to a url that the user has not visited recently e:visited any e element that is a hyperlink to a url that the user has visited recently note: the information that can be obtained from the :visited selector ...
...ctual pointer shapes in your browser: selector selects pointer indicating a link wait indicating that the program cannot accept input progress indicating that the program is working, but can still accept input default the default (usually an arrow) an outline property creates an outline that is often used to indicate keyboard
focus.
...tive">click me</button></td> </tr> <tr style="line-height:25%;"> <td> </td> </tr> <tr style="font-style:italic;"> <td>disabled</td> <td>normal</td> <td>active</td> </tr> </tbody> </table> live sample a fully functional button also has a dark outline around the entire button when it is the default, and a dotted outline on the face of the button when it has keyboard
focus.
Windows - Archive of obsolete content
re-using and
focusing named windows while specifying the name parameter to window.open or window.opendialog will prevent multiple windows of that name from opening, each call will actually re-initialize the window and thus lose whatever state the user has put it in.
...if it finds one, it
focuses it.
... var wenum = components.classes["@mozilla.org/embedcomp/window-watcher;1"] .getservice(components.interfaces.nsiwindowwatcher) .getwindowenumerator(); var index = 1; var windowname = "yourwindowname"; while (wenum.hasmoreelements()) { var win = wenum.getnext(); if (win.name == windowname) { win.
focus(); return; } index++ } window.open("chrome://to/your/window.xul", windowname, "features"); uniquely identifying dom windows requires gecko 2.0(firefox 4 / thunderbird 3.3 / seamonkey 2.1) in gecko, each dom window has a unique 64-bit id number.
eventnode - Archive of obsolete content
thus, if this attribute is not used, the tabbox or an element inside it must have the
focus for the keyboard navigation to apply.
...tab navigation will occur as long as any element in the window is
focused.
...tab navigation will occur as long as any element in the document is
focused.
Attribute (XUL) - Archive of obsolete content
aces default defaultbutton defaultset description dir disableautocomplete disableautoselect disableclose disabled disablehistory disablekeynavigation disablesecurity dlgtype dragging editable editortype element empty emptytext deprecated since gecko 2 enablecolumndrag enablehistory equalsize eventnode events expr firstdayofweek firstpage first-tab fixed flags flex
focused forcecomplete grippyhidden grippytooltiptext group handlectrltab height helpuri hidden hidechrome hidecolumnpicker hideheader hideseconds hidespinbuttons highlightnonmatches homepage href icon id ignoreblurwhilesearching ignorecase ignoreincolumnpicker ignorekeys image inactivetitlebarcolor increment index inputtooltiptext insertafter insertbefore instantapply i...
...nverted iscontainer isempty key keycode keytext label lastpage lastselected last-tab left linkedpanel max maxheight maxlength maxpos maxrows maxwidth member menu menuactive min minheight minresultsforpopup minwidth mode modifiers mousethrough movetoclick multiline multiple name negate newlines next noauto
focus noautohide noinitial
focus nomatch norestore
focus object observes onbeforeaccept onbookmarkgroup onchange onclick onclosetab oncommand oncommandupdate ondialogaccept ondialogcancel ondialogclosure ondialogextra1 ondialogextra2 ondialoghelp onerror onerrorcommand onextra1 onextra2 oninput onload onnewtab onpageadvanced onpagehide onpagerewound onpageshow onpaneload onpopuphidden onpopuphiding onpopupshowing onpopupshown ...
...l orient pack pageid pageincrement pagestep parent parsetype persist persistence phase pickertooltiptext placeholder popup position predicate preference preference-editable primary priority properties querytype readonly ref rel removeelement resizeafter resizebefore rows screenx screeny searchbutton searchsessions searchlabel selected selectedindex seltype set
focus showcaret showcommentcolumn showpopup size sizemode sizetopopup smoothscroll sort sortactive sortdirection sortresource sortresource2 spellcheck src state statedatasource statusbar statustext style subject substate suppressonselect tabindex tabscrolling targets template timeout title toolbarname tooltip tooltiptext tooltiptextnew top type uri useraction valida...
currentIndex - Archive of obsolete content
for trees with
focus, the caret's position is indicated by the
focus ring, but un
focused trees won't show a
focus ring, naturally.
... for un
focused trees, the (undrawn) caret's position can still be obtained by this property.
... if the caret isn't present for any row (for example, because the tree has never been
focused), the value will be -1.
listbox.currentIndex - Archive of obsolete content
« xul reference currentindex type: integer set to the index of the currently
focused item in the list.
... if no item is
focused, the value will be -1.
...in a multiple selection list, the currently
focused row may be modified by the user without changing the selection by pressing the control key and pressing the cursor keys to navigate.
Adding Labels and Images - Archive of obsolete content
when the user clicks on an associated label, that control will be
focused.
...set the value of the control attribute to the id of the element to be
focused.
... example 3 : source view <label value="click here:" control="open-button"/> <button id="open-button" label="open"/> in the example above, clicking the label will cause the button to be
focused.
arrowscrollbox - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
button - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
checkbox - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
colorpicker - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... value property gets and sets color attribute methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
datepicker - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
description - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
menuitem - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
...datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
menuseparator - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
preference - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
richlistitem - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
scale - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
tab - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
timepicker - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
Theme changes in Firefox 2 - Archive of obsolete content
beline #feedsubscribeoptions #feedsubscribeoptionsgroup #feedsubscribeoptionsgrouptitle #feedtitlecontainer #feedtitleimage #feedtitlelink #readercontainer #readergroup #readers #readers > listitem .feedentrycontent .feedsubscribebutton .feedsubscribebutton .button-icon .feedsubscribelink .feedsubscribelinkbox .field .link .link:hover:active .plain .plain > .button-box .plain:
focus > .button-box .stylelessborderless the default theme also includes styles for a[href] img, body, h1, h2, and html.
... browser.css the following styles that were used in firefox 1.5 are no longer used in firefox 2 and have been removed: tab:
focus tab[beforeselected="true"] > .tab-image-right tab[selected="true"] > .tab-image-left tab[selected="true"] > .tab-image-middle tab[selected="true"] > .tab-image-right the following styles are new in firefox 2: .alltabs-item > .menu-iconic-left > .menu-iconic-icon .alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon .alltabs-item[selected="true"] .tab-close-button .tab-close-but...
...="true"] > .tab-close-button .tabbrowser-tab[selected="true"] > .tab-close-button:hover .tabbrowser-tab[selected="true"] > .tab-close-button:hover:active .tabbrowser-tabs[overflow="true"] .tabs-alltabs-box .tabs-alltabs-box .tabs-alltabs-box:hover .tabs-alltabs-box[flash="true"] tab > .tab-image-left tab > .tab-image-middle tab > .tab-image-middle > .tab-text tab > .tab-image-right tab:
focus > .tab-image-middle > .tab-text tab:hover:not([selected="true"]) > .tab-image-left tab:hover:not([selected="true"]) > .tab-image-middle tab:hover:not([selected="true"]) > .tab-image-right tab:not([selected="true"]) > .tab-image-left tab:not([selected="true"]) > .tab-image-middle tab[selected="true"] .tab-image-middle > .tab-text you may of course wish to make changes to other styles as we...
Game promotion - Game development
when writing a tutorial remember to
focus on delivering something valuable to the reader.
...
focus on one aspect and try to explain it throughout and in detail.
...it's important to
focus on the knowledge part and tone down the marketing — devs are sensitive on this matter and you may end up with an angry crowd if you just try to sell them something.
Practical positioning examples - Learn web development
first, we'll set the :
focus and :hover states of the tabs to look different when they are
focused/hovered, providing users with some visual feedback.
...place the following css below your other styles: .info-box li a:
focus, .info-box li a:hover { background-color: #a60000; color: white; } .info-box li a.active { background-color: #a60000; color: white; } styling the panels the next job is to style our panels.
...in addition, the effect is not great in terms of accessibility; the label is not
focusable by default, and the non-semantic use of the form elements could cause issues with screen readers.
Typesetting a community school homepage - Learn web development
links: give the link, visited,
focus, and hover states some colors that go with the color of the horizontal bars at the top and bottom of the page.
... make it so that links are underlined by default, but when you hover or
focus them, the underline disappears.
... remove the default
focus outline from all the links on the page.
Example 1 - Learn web development
alue">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 /* --------------- */ /* required styles */ /* --------------- */ .select { position: relative; display : inline-block; } .select.active, .select:
focus { box-shadow: 0 0 3px 1px #227755; outline: none; } .select .optlist { position: absolute; top : 100%; left : 0; } .select .optlist.hidden { max-height: 0; visibility: hidden; } /* ------------ */ /* fancy styles */ /* ------------ */ .select { font-size : 0.625em; /* 10px */ font-family : verdana, arial, sans-serif; -moz-box-sizing : border-box; box-sizing : b...
...alue">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 /* --------------- */ /* required styles */ /* --------------- */ .select { position: relative; display : inline-block; } .select.active, .select:
focus { box-shadow: 0 0 3px 1px #227755; outline: none; } .select .optlist { position: absolute; top : 100%; left : 0; } .select .optlist.hidden { max-height: 0; visibility: hidden; } /* ------------ */ /* fancy styles */ /* ------------ */ .select { font-size : 0.625em; /* 10px */ font-family : verdana, arial, sans-serif; box-sizing : border-box; padding : 0.1em 2.
...e">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 /* --------------- */ /* required styles */ /* --------------- */ .select { position: relative; display : inline-block; } .select.active, .select:
focus { box-shadow: 0 0 3px 1px #227755; outline: none; } .select .optlist { position: absolute; top : 100%; left : 0; } .select .optlist.hidden { max-height: 0; visibility: hidden; } /* ------------ */ /* fancy styles */ /* ------------ */ .select { font-size : 0.625em; /* 10px */ font-family : verdana, arial, sans-serif; -moz-box-sizing : border-box; box-sizing : b...
Test your skills: Advanced styling - Learn web development
one thing that is inconsistent across browsers (particularly looking at safari here) is the position of the standard blue
focus outline.
... there is a major problem with just getting rid of the blue
focus outline.
...can you add some kind of styling back in so that users can tell when the search box is being hovered or
focused?
Manipulating documents - Learn web development
in this article we'll
focus mostly on manipulating the document, but we'll show a few other useful bits besides.
... the input should be emptied and
focused ready for you to enter another item.
... finally, use the
focus() method to
focus the input element ready for entering the next shopping list item.
Video and Audio APIs - Learn web development
the contents of aria-label attributes are read out by screenreaders when their users
focus on the elements that contain them.
...first of all, notice the .controls styling: .controls { visibility: hidden; opacity: 0.5; width: 400px; border-radius: 10px; position: absolute; bottom: 20px; left: 50%; margin-left: -200px; background-color: black; box-shadow: 3px 3px 5px black; transition: 1s all; display: flex; } .player:hover .controls, player:
focus .controls { opacity: 1; } we start off with the visibility of the custom controls set to hidden.
...only when you are hovering/
focusing over the player do the controls appear at full opacity.
Getting started with React - Learn web development
this article is going to
focus on the use case of using react to render the entire user interface of an application, using tooling provided by facebook’s own create-react-app tool.
... variables in jsx back in app.js, let’s
focus on line 9: <img src={logo} classname="app-logo" alt="logo" /> here, the <img /> tag's src attribute value is in curly braces.
...ooter functionality, conditional rendering routing in ember ember resources and troubleshooting vue getting started with vue creating our first vue component rendering a list of vue components adding a new todo form: vue events, methods, and models styling vue components with css using vue computed properties vue conditional rendering: editing existing todos
focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
Experimental features in Firefox
nightly 75 no developer edition 75 no beta 75 no release 75 no preference name layout.css.conic-gradient.enabled and gfx.webrender.all pseudo-class: :
focus-visible allows
focus styles to be applied to elements like buttons and form controls, only when they are
focused using the keyboard (e.g.
... when tabbing between elements), and not when they are
focused using a mouse or other pointing device.
... nightly 75 no developer edition 75 no beta 75 no release 75 no preference name layout.css.
focus-visible.enabled single numbers as aspect ratio in media queries support for using a single <number> as a <ratio> when specifying the aspect ratio for a media query.
Release phase
we'll primarily
focus on getting your release repository setup and the mercurial commands you'll need to know to use that repository.
...
focus is on technical accuracy and completion of l10n work; not translation quality.
...
focus is still on technical accuracy and completion of l10n work; not translation quality.
Profiling with the Firefox Profiler
it has tighter integration with firefox than external profilers, and has more of a platform
focus than the devtools performance panel.
... tip:
focus on one section of the tree by clicking on the "arrow-in-a-circle" icon that appears to the right of the tree element as you hover over it.
... as we
focus on using this tool and add additional sample labels coverage should improve.
Hacking Tips
one tip is to start looking at a script with an inverted js stack to locate the most expensive js function, then to
focus on the frame of this js function, and to remove the inverted stack and look at c++ part of this function to determine from where the cost is coming from.
... using ionmonkey spew (js shell) ionmonkey spew is extremely verbose (not as much as the infer spew), but you can filter it to
focus on the list of compiled scripts or channels, ionmonkey spew channels can be selected with the ionflags environment variable, and compilation spew can be filtered with ionfilter.
... $ ionfilter=pdfjs.js:16934 ionflags=logs,scripts,osi,bailouts ./js --ion-offthread-compile=off ./run.js 2>&1 | less the bailouts channel is likely to be the first thing you should
focus on, because this means that something does not stay in ionmonkey and fallback to the interpreter.
Gecko events
is supported: no event_
focus an object has received the keyboard
focus.
... is supported: yes states: state_
focused, state_busy, xxx: event_location_change an object has changed location, shape, or size.
...event_hypertext_changed
focus has changed from one hypertext object to another, or
focus moved from a non-hypertext object to a hypertext object, or
focus moved from a hypertext object to a non-hypertext object.
XForms Accessibility
he wrote: navindex was in xforms - it was stripped out as it was believed the
focus model was dependent on the content which used it.
...if you use xhtml2 use next
focus.
...note, we support -moz-user-
focus style neither for xhtml or xul.
nsIAccessibleStates
state_
focused 0x00000004 the object is
focused.
...a speech-based accessibility aid does not announce information when an object with this state has the
focus because the object automatically announces information.
... state_
focusable 0x00100000 the object can be
focused.
nsITextInputProcessorNotification
this is typically notified when user clicks somewhere,
focus is moved, or web contents modify the value of the editor during composition.
... "notify-
focus" when an editable editor gets
focus, this is notified.
... "notify-blur" when an editable editor loses
focus, this is notified.
Examine and edit CSS - Firefox Developer Tools
while in the rules view, you can press ctrl / cmd + f to
focus the search field.
...-thumb :-moz-range-track :-moz-selection if the selected element has pseudo-elements applied to it, they are displayed before the selected element but hidden by a disclosure triangle: clicking the triangle displays them: viewing common pseudo-classes there's a button to the right of the filter box: click the button to see checkboxes that you can use to enable the :hover, :active and :
focus, :
focus-within and :visited pseudo-classes for the selected element: this feature can also be accessed from the popup menu in the html view.
... while in the computed view, you can press ctrl / cmd + f to
focus the search field.
Examine and edit HTML - Firefox Developer Tools
subtree modification attribute modification node removal use in console show dom properties show accessibility properties change pseudo-class hover active
focus focus-within visited screenshot node scroll into view copy inner html outer html css selector css path xpath image data-url attribute paste inner html outer html before after as first child as last child expand all collapse all open link in new tab * open file in debugger * open file in style-editor * copy link address * ...
... (change pseudo-class)
focus set the :
focus css pseudo-class.
... (change pseudo-class)
focus-within set the :
focus-within css pseudo-class.
Using the CSS properties and values API - Web APIs
that property is then transitioned on hover or
focus to a different color.
... .registered { --registered: #c0ffee; background-image: linear-gradient(to right, #fff, var(--registered)); transition: --registered 1s ease-in-out; } .registered:hover, .registered:
focus { --registered: #b4d455; } .unregistered { --unregistered: #c0ffee; background-image: linear-gradient(to right, #fff, var(--unregistered)); transition: --unregistered 1s ease-in-out; } .unregistered:hover, .unregistered:
focus { --unregistered: #b4d455; } <button class="registered">background registered</button> <button class="unregistered">background not registered</button> .registered { --registered: #c0ffee; background-image: linear-gradient(to right, #fff, var(--regi...
...stered)); transition: --registered 1s ease-in-out; } .registered:hover, .registered:
focus { --registered: #b4d455; } .unregistered { --unregistered: #c0ffee; background-image: linear-gradient(to right, #fff, var(--unregistered)); transition: --unregistered 1s ease-in-out; } .unregistered:hover, .unregistered:
focus { --unregistered: #b4d455; } button { height: 40vh; display: block; width: 100%; font-size: 3vw; } window.css.registerproperty({ name: '--registered', syntax: '<color>', inherits: false, initialvalue: 'red', }); while not functionally accurate, a good way to think about the difference between the unregistered property in the above example and the registered property is the difference between a <custom-ident> and a number when trying to animate he...
Document.alinkColor - Web APIs
gecko supports both alinkcolor/:active and :
focus.
... internet explorer 6 and 7 support alinkcolor/:active only for html anchor (<a>) links and the behavior is the same as :
focus under gecko.
... there is no support for :
focus in ie.
Document - Web APIs
documentorshadowroot.activeelementread only returns the element within the shadow tree that has
focus.
... globaleventhandlers.on
focus is an eventhandler representing the code to be called when the
focus event is raised.
... document.has
focus() returns true if the
focus is currently located anywhere inside the specified document.
Using the Gamepad API - Web APIs
connecting to a gamepad when a new gamepad is connected to the computer, the
focused page first receives a gamepadconnected event.
... if a gamepad is already connected when the page loaded, the gamepadconnected event is dispatched to the
focused page when the user presses a button or moves an axis.
...gamepadconnected), a second event is dispatched to the
focused window, gamepaddisconnected: window.addeventlistener("gamepaddisconnected", function(e) { console.log("gamepad disconnected from index %d: %s", e.gamepad.index, e.gamepad.id); }); the gamepad's index property will be unique per-device connected to the system, even if multiple controllers of the same type are used.
Key Values - Web APIs
qt::key_camera (0x01100020) keycode_camera (27) "camera
focus" the
focus key.
...
focuses the camera.
... qt::key_camera
focus (0x01100021) keycode_
focus (80) "endcall" the end call or hang up button.
RTCDataChannel: open event - Web APIs
finally, the message input box is
focused so the user can immediately begin to type.
... dc.addeventlistener("open", ev => { messageinputbox.disabled = false; sendmessagebutton.disabled = false; disconnectbutton.disabled = false; connectbutton.disabled = true; messageinputbox.
focus(); }, false); this can also be done by directly setting the value of the channel's onopen event handler property.
... dc.onopen = ev => { messageinputbox.disabled = false; sendmessagebutton.disabled = false; disconnectbutton.disabled = false; connectbutton.disabled = true; messageinputbox.
focus(); } ...
Selection API - Web APIs
working draft the selection api specification is based on the html editing apis specification and
focuses on the selection-related functionality.
... nochrome android full support yesfirefox android full support yesopera android full support yessafari ios full support yessamsung internet android full support yes
focusnode experimentalchrome full support yesedge full support 12firefox full support 3.6ie full support 10opera full support yessafari full support ...
... yeschrome android full support yesfirefox android full support yesopera android full support yessafari ios full support yessamsung internet android full support yes
focusoffset experimentalchrome full support yesedge full support 12firefox full support yesie ?
WindowClient - Web APIs
windowclient.
focus() gives user input
focus to the current client.
... windowclient.
focused read only a boolean that indicates whether the current client has
focus.
... example self.addeventlistener('notificationclick', function(event) { console.log('on notification click: ', event.notification.tag); event.notification.close(); // this looks to see if the current is already open and //
focuses if it is event.waituntil(clients.matchall({ type: "window" }).then(function(clientlist) { for (var i = 0; i < clientlist.length; i++) { var client = clientlist[i]; if (client.url == '/' && '
focus' in client) { client.
focus(); break; } } if (clients.openwindow) return clients.openwindow('/'); })); }); specifications specification statu...
XRVisibilityState - Web APIs
the xrvisibilitystate enumerated type defines the string values which are valid for the xrsession interface's visibilitystate property, which indicates whether or not an xr session is currently visible to the user, and if it is, whether or not it's currently the primary
focus.
... visible the virtual scene rendered by the xrsession is currently visible to the user and is the primary
focus of the user's attention.
... visible-blurred while the virtual scene rendered by the xrsession may currently be visible to the user, it is not the user's primary
focus at the moment; it's also possible the session is not currently visible at all.
Using the aria-hidden attribute - Accessibility
this can improve the experience for assistive technology users by hiding: purely decorative content, such as icons or images duplicated content, such as repeated text offscreen or collapsed content, such as menus according to the fourth rule of aria, aria-hidden="true" should not be used on a
focusable element.
... additionally, since this attribute is inherited by an element's children, it should not be added onto the parent or ancestor of a
focusable element.
... deciding between aria-hidden="true", role="presentation", and role="none" on the surface, the aria-hidden="true", role="presentation", and role="none" attributes seem similar because they: hide content from assistive technology cannot be used on a
focusable element cannot be used on the parent of an interactive element despite these similarities, the intent behind each attribute is different.
ARIA: checkbox role - Accessibility
since a checkbox is an interactive control, it must be
focusable and keyboard accessible.
... if the role is applied to a non-
focusable element, use the tabindex attribute to change this.
...this attribute has one of three possible values: true the checkbox is checked false the checkbox is not checked mixed the checkbox is partially checked, or indeterminate tabindex="0" used to make it
focusable so the assistive technology user can tab to it and start reading right away.
Accessibility documentation index - Accessibility
the position of each cell is significant and can be
focused using keyboard input.
... 96 keyboard accessibility, keyboard if an element can be
focused using the keyboard, then it should be interactive; that is, the user should be able to do something to it and produce a change of some kind (for example, activating a link or changing an option).
... 97 operable accessibility,
focus, navigation, principle 2, timing, wcag, web content accessibility guidelines, headings, keyboard, keyboard trap, labels, operable, seizures this article provides practical advice on how to write your web content so that it conforms to the success criteria outlined in the operable principle of the web content accessibility guidelines (wcag) 2.0 and 2.1.
Mozilla CSS extensions - CSS: Cascading Style Sheets
images-in-menus) :-moz-system-metric(mac-graphite-theme) :-moz-system-metric(scrollbar-end-backward) :-moz-system-metric(scrollbar-end-forward) :-moz-system-metric(scrollbar-start-backward) :-moz-system-metric(scrollbar-start-forward) :-moz-system-metric(scrollbar-thumb-proportional) :-moz-system-metric(touch-enabled) :-moz-system-metric(windows-default-theme) -moz-user-
focus -moz-user-input -moz-user-modify -moz-window-dragging -moz-window-shadow formerly proprietary properties that are now standard note: to maximize the compatibility of your css, you should use the unprefixed standard properties instead of the prefixed ones listed below.
...default-color -moz-cellhighlight -moz-cellhighlighttext -moz-field -moz-fieldtext -moz-dialog -moz-dialogtext -moz-dragtargetzone -moz-mac-accentdarkestshadow -moz-mac-accentdarkshadow -moz-mac-accentface -moz-mac-accentlightesthighlight -moz-mac-accentlightshadow -moz-mac-accentregularhighlight -moz-mac-accentregularshadow -moz-mac-chrome-active -moz-mac-chrome-inactive -moz-mac-
focusring -moz-mac-menuselect -moz-mac-menushadow -moz-mac-menutextselect -moz-menuhover -moz-menuhovertext -moz-win-communicationstext -moz-win-mediatext -moz-nativehyperlinktext display -moz-box -moz-inline-block -moz-inline-box -moz-inline-gridobsolete since gecko 62 -moz-inline-stackobsolete since gecko 62 -moz-inline-table -moz-gridobsolete since gecko 62 -moz-grid-gr...
...x-width -moz-min-content -moz-fit-content -moz-max-content -moz-available pseudo-elements and pseudo-classes a – d ::-moz-anonymous-block eg@:- bug 331432 ::-moz-anonymous-positioned-block :-moz-any :-moz-any-link [matches :link and :visited] :-moz-broken ::-moz-canvas ::-moz-color-swatch ::-moz-cell-content :-moz-drag-over f – i :-moz-first-node ::-moz-
focus-inner ::-moz-
focus-outer :-moz-
focusring :-moz-full-screen :-moz-full-screen-ancestor :-moz-handler-blocked :-moz-handler-crashed :-moz-handler-disabled ::-moz-inline-table l :-moz-last-node :-moz-list-bullet :-moz-list-number :-moz-loading :-moz-locale-dir(ltr) :-moz-locale-dir(rtl) :-moz-lwtheme :-moz-lwtheme-brighttext :-moz-lwtheme-darktext n – r :-moz-native-a...
DOM onevent handlers - Developer guides
this page
focuses on how the latter work.
...events are actions like: being clicked detecting pressed keys getting
focus the onevent handler is usually named with the event it reacts to, like onclick, onkeypress, on
focus, etc.
...(the html specification names these: onblur, onerror, on
focus, onload, and onscroll.) event handler's parameters, this binding, and the return value when the event handler is specified as an html attribute, the specified code is wrapped into a function with the following parameters: event — for all event handlers except onerror.
Rich-Text Editing in Mozilla - Developer guides
the function executed the requested command using execcommand() and then sets
focus back to the editable document, as clicking on a button will set
focus on the button itself, which breaks the editing flow.
... figure 4 : executing rich editing commands html: <button onclick="doricheditcommand('bold')" style="font-weight:bold;">b</button> javascript: function doricheditcommand(aname, aarg){ getiframedocument('editorwindow').execcommand(aname,false, aarg); document.getelementbyid('editorwindow').contentwindow.
focus() } example: a simple but complete rich text editor <!doctype html> <html> <head> <title>rich text editor</title> <script type="text/javascript"> var odoc, sdeftxt; function initdoc() { odoc = document.getelementbyid("textbox"); sdeftxt = odoc.innerhtml; if (document.compform.switchmode.checked) { setdocmode(true); } } function formatdoc(scmd, svalue) { if (validatemode()) { document.execcommand(scmd, false, svalue); odoc.
focus(); } } function validatemode() { if (!d...
...ocument.compform.switchmode.checked) { return true ; } alert("uncheck \"show html\"."); odoc.
focus(); return false; } function setdocmode(btosource) { var ocontent; if (btosource) { ocontent = document.createtextnode(odoc.innerhtml); odoc.innerhtml = ""; var opre = document.createelement("pre"); odoc.contenteditable = false; opre.id = "sourcetext"; opre.contenteditable = true; opre.appendchild(ocontent); odoc.appendchild(opre); } else { if (document.all) { odoc.innerhtml = odoc.innertext; } else { ocontent = document.createrange(); ocontent.selectnodecontents(odoc.firstchild); odoc.innerhtml = ocontent.tostring(); } odoc.contenteditable = true; } odoc.
focus(); } function printdoc() { if (!validatemode())...
HTML5 - Developer guides
focus management in html the new html5 activeelement and has
focus attributes are supported.
... pointer lock api allows locking the pointer to the content, so games and similar applications don't lose
focus when the pointer reaches the window limit.
... pointer lock api allows locking the pointer to the content, so games and similar application don't lose
focus when the pointer reaches the window limit.
HTML attribute: multiple - HTML: Hypertext Markup Language
/* uncomment this css to make the multiple the same height as the single */ /* select[multiple] { height: 1.5em; vertical-align: top; } select[multiple]:
focus, select[multiple]:active { height: auto; } */ there are a few ways to select multiple options in a <select> element with a multiple attribute.
...keyboard users can select multiple contiguous items by
focusing on the <select> element, selecting an item at the top or bottom of the range they want to select using the up and down cursor keys to go up and down the options.
...when using the multiple attribute, inform the user that multiple values are allowed and provide directions on how to provide multiple values, such as "separate email addresses with a comma." setting size="1" on a multiple select can make it appear as a single select in some browsers, but then it doesn't expand on
focus, harming usability.
Global attributes - HTML: Hypertext Markup Language
the event handler attributes: onabort, onautocomplete, onautocompleteerror, onblur, oncancel, oncanplay, oncanplaythrough, onchange, onclick, onclose, oncontextmenu, oncuechange, ondblclick, ondrag, ondragend, ondragenter, ondragexit, ondragleave, ondragover, ondragstart, ondrop, ondurationchange, onemptied, onended, onerror, on
focus, oninput, oninvalid, onkeydown, onkeypress, onkeyup, onload, onloadeddata, onloadedmetadata, onloadstart, onmousedown, onmouseenter, onmouseleave, onmousemove, onmouseout, onmouseover, onmouseup, onmousewheel, onpause, onplay, onplaying, onprogress, onratechange, onreset, onresize, onscroll, onseeked, onseeking, onselect, onshow, onsort, onstalled, onsubmit, onsuspend, ontimeupdate, ontoggle, onv...
... tabindex an integer attribute indicating if the element can take input
focus (is
focusable), if it should participate to sequential keyboard navigation, and if so, at what position.
... it can take several values: a negative value means that the element should be
focusable, but should not be reachable via sequential keyboard navigation; 0 means that the element should be
focusable and reachable via sequential keyboard navigation, but its relative order is defined by the platform convention; a positive value means that the element should be
focusable and reachable via sequential keyboard navigation; the order in which the elements are
focused is the increasing value of the tabindex.
HTML documentation index - HTML: Hypertext Markup Language
31 tabindex global attributes, html, reference the tabindex global attribute indicates that its element can be
focused, and where it participates in sequential keyboard navigation (usually with the tab key, hence the name).
... 52 disabled attribute, attributes, constraint validation, forms, required the boolean disabled attribute, when present, makes the element not mutable,
focusable, or even submitted with the form.
... the user can neither edit nor
focus on the control, nor it's form control descendants.
SVG documentation index - SVG: Scalable Vector Graphics
190 specularexponent filters, svg, svg attribute the specularexponent attribute controls the
focus for the light source.
... 213 tabindex svg, svg attribute the tabindex attribute allows you to control whether an element is
focusable and to define the relative order of the element for the purposes of sequential
focus navigation.
...the latter may be described in a later section of the tutorial, while we will
focus completely on the first part: bringing text into an svg image.
SVG 2 support in Mozilla - SVG: Scalable Vector Graphics
svgexternalresourcesrequired removed never implemented svgelement.viewportelement and svgelement.ownersvgelement nullable implementation status unknown svgelement.getpresentationattribute() removed never implemented (prototype removed in bug 921456) svgcolor and svgicccolor removed never implemented svgelement.
focus(), svgelement.blur() not implemented (bug 778654) svgelement.tabindex implemented (bug 778654) document.activeelement implementation status unknown globaleventhandlers on svgelement implementation status unknown options dictionary attribute for svggraphicselement.getbbox() implemented behind the preference svg.new-getbbox.enabled (bug 999964, bug...
... with inline svg applying to whole document content implementation status unknown presentation attributes on any svg namespaced element implementation status unknown display behavior of <style> defined via ua style sheet implementation status unknown !important user agent style rules controlling never-rendered elements implementation status unknown :
focus and ::selection styles implementation status unknown geometry change notes x and y attributes removed from <pattern> and <filter> implementation status unknown auto value of width and height computes to 0 but 100% on <svg> not implemented coordinate systems, transformations and units change notes exception for bad...
...abort, error, and unload instead of svgload, svgabort, svgerror, and svgunload not implemented (bug 620002) only structurally external elements and outermost <svg> element fire load events implementation status unknown resize and scroll instead of svgresize and svgscroll implementation status unknown domactivate removed implementation status unknown
focusin and
focusout instead of dom
focusin and dom
focusout implementation status unknown keyboard events implementation status unknown mutation events removed implementation status unknown svgzoomevent removed implementation status unknown <cursor> element deprecated implementation status unknown linking change notes li...
Display a Popup - Archive of obsolete content
// // set the
focus to the text area so the user can // just start typing.
... self.port.on("show", function onshow() { textarea.
focus(); }); finally, the "text-entry.html" file defines the <textarea> element: <html> <head> <style type="text/css" media="all"> textarea { margin: 10px; } body { background-color: gray; } </style> </head> <body> <textarea rows="13" cols="33" id="edit-box"></textarea> </body> </html> finally, save these three icon files to the "data" directory: icon-16.png icon-32.png icon-64.png try it out: "index.js" is saved in the top level, and the other five files go in your add-on's data directory: my-addon/ data/ get-text.js icon-16.png icon-32.png icon-64.png text-entry.html index.js...
StringView - Archive of obsolete content
object reference to input or a new arraybufferview of the buffer input.buffer (depending on many factors regarding the position of the
focused parts).
... object reference to input or a new arraybufferview of the buffer input.buffer (depending on many factors regarding the position of the
focused parts).
Chapter 3: Introduction to XUL—How to build a more intuitive UI - Archive of obsolete content
the control attribute takes as its value an id reference to another xul element with that id; clicking that label or giving it
focus can be used to pass the
focus to the referenced xul element.
... <key id="key-save" key="s" modifiers="accel,shift" oncommand="save();"/> <key id="key-scroll-up" keycode="vk_page_up" oncommand="advance
focus(-1);"/> listing 19: defining keyboard shortcuts to make letters, numbers, symbols, or the space bar act as triggers, declare that character as the key attribute’s value.
Handling Preferences - Archive of obsolete content
",dialog=no" : ",modal"); this._preferenceswindow = window.opendialog( "chrome://xulschoolhello/content/preferenceswindow.xul", "xulschoolhello-preferences-window", features); } this._preferenceswindow.
focus(); }, this code is based on the code that opens preference windows from the add-ons manager.
...in that case, just give it
focus.
XUL user interfaces - Archive of obsolete content
showstatus(thedate) } catch (ex) {} } setday(thedate) } // internal function setday(adate) { if (currentday) currentday.setattribute("disabled", "true") if (adate == null) currentday = null else { var d = adate.getday() currentday = daybox.firstchild while (d-- > 0) currentday = currentday.nextsibling currentday.removeattribute("disabled") } datebox.
focus(); } function showstatus(adate) { if (adate == null) { status.removeattribute("warning") status.setattribute("label", "") } else if (adate === false || isnan(adate.gettime())) { status.setattribute("warning", "true") status.setattribute("label", "date is not valid") } else { status.removeattribute("warning") status.setattribute("label", adate.tolocaledates...
... using this knowledge, add a rule to the stylesheet that makes the background of the date box pale blue when it has keyboard
focus (but white when keyboard
focus is somewhere else).
Basics - Archive of obsolete content
blah(lengthstring
focusedstringtostringstringpopstringpushstringreversestringshiftstringsortstringsplicestringunshiftstring)this is some default text lengththe number of open tabsstring
focusedthe current tab in your browserstring tostringstuffstring popstuffstring pushstuffstring reversestuffstring shiftstuffstring sortstuffstring splicestuffstring unshiftstuffstring onready()when the inherited document is fully loa...
...on
focus()changing the
focus of a tab.
findbar - Archive of obsolete content
possible values are: find_normal (0): normal find find_typeahead (1): typeahead find find_links (2): link find methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
... this opens the findbar,
focuses the edit field for the search term, and selects its contents.
blur - Archive of obsolete content
« xul reference home blur() return type: no return value if the
focus is on the element, it is removed.
... the
focus is not automatically placed on any other element.
moveByOffset - Archive of obsolete content
« xul reference home movebyoffset( offset , isselecting, isselectingrange) return type: no return value if offset is positive, adjusts the
focused item forward by that many items.
... if offset is negative, adjusts the
focused item backward by that many items.
ContextMenus - Archive of obsolete content
when using the keyboard, the context is the element in the window that is currently
focused.
...however, even when using the keyboard, there will still be a node (the context) that the menu applies to, which will be the element that is currently
focused.
Extensions - Archive of obsolete content
normally, this menu displays menu items specific to what was context clicked or
focused.
...if the keyboard was used to open a context menu, this will be the
focused element.
OpenClose - Archive of obsolete content
a menu in an unprivileged content window (such as a web page) can only open a popup while its window is
focused, and it is in the currently active tab.
...what it does do is affect how the
focus and highlighting of the menu is handled.
Code Samples - Archive of obsolete content
if the window already exists, this code just
focusses it.
... otherwise it opens the window: const name = "...internal name of the window..." const uri = "...chrome uri of the window..." var w = components .classes["@mozilla.org/appshell/window-mediator;1"] .getservice(components.interfaces.nsiwindowmediator) .getmostrecentwindow(name) if (w) w.
focus() else components .classes["@mozilla.org/embedcomp/window-watcher;1"] .getservice(components.interfaces.nsiwindowwatcher) .openwindow(null, uri, name, "chrome,resizable", null) change the first two lines to specify the window that you want to open.
Using the Editor from XUL - Archive of obsolete content
for text widgets and composer): nstexteditorkeylistener (as a nsidomkeylistener) nstexteditormouselistener (as a nsidommouselistener) nstexteditor
focuslistener (as a nsidom
focuslistener) nstexteditortextlistener (as a nsidomtextlistener) nstexteditorcompositionlistener (as a nsidomcompositionlistener) nstexteditordraglistener (as a nsidomdraglistener) in nseditorshell::preparedocumentforediting(), we install a mouse listener.
... nstexteditor
focuslistener editor responds to
focus and blur events by showing and hiding the caret or selection as appropriate.
caption - Archive of obsolete content
the tab order is the order in which the
focus is moved when the user presses the "tab" key.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
commandset - Archive of obsolete content
focus: occurs when the
focused element changes.
...datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
key - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
keyset - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
listcell - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
listhead - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
listheader - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
...datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
menu - Archive of obsolete content
if the element is disabled, it does not respond to user actions, it cannot be
focused, and the command event will not fire.
... methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupport...
prefwindow - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupport...
...if a window with that type is already open, this method will just switch that window to the front and
focus it instead of opening another window.
titlebar - Archive of obsolete content
buttons inside it can't be clicked and textboxes can't be
focused with the mouse.
...datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
-ms-accelerator - Archive of obsolete content
when alt + n is pressed, the <input> element that defines an accesskey attribute value of "n" receives the
focus.
...the user presses the alt key and holds it while pressing the character to move input
focus to the object, and to invoke the default event associated with the object.
XForms Label Element - Archive of obsolete content
focus behavior - when a label element is clicked or its accesskey is activated then the form control that contains the label will be given the
focus.
... attributes ui common accesskey - used to specify the keyboard shortcut for
focusing the parent form control.
XForms Select Element - Archive of obsolete content
accesskey - used to specify the keyboard shortcut for
focusing this control.
...loses
focus), otherwise it is updated upon item selection check group the select is represented as group of checkboxes (xhtml/xul).
Issues Arising From Arbitrary-Element hover - Archive of obsolete content
hover and non-link elements section 5.11.3 of css2 defines the three dynamic pseudo-classes (:hover, :active, and :
focus) and then goes on to say: css doesn't define which elements may be in the above states, or how the states are entered and left.
...thus, a:hover should always be used instead of just :hover, and a:link:hover (and a:visited:hover) are preferred to the simpler a:hover related links the dynamic pseudo-classes: :hover, :active, and :
focus :hover pseudo-class (msdn) original document information author(s): eric a.
Index - Game development
when you've published the game it's time to
focus on promotion — letting people know your game exists.
...you might however also
focus on selling licenses, doing branding, or earning on a revenue share basis from the advertisements.
Game distribution - Game development
desktop vs mobile the vast majority of the traffic we are interested in — people playing html5 games — comes from mobile devices so that's something you will have to
focus on if you truly want to succeed.
...when you've published the game it's time to
focus on promotion — letting people know your game exists.
GLSL Shaders - Game development
this allows the cpu to
focus its processing power on other tasks, like executing code.
...we've used three.js here to make the background code a lot simpler and clearer to understand, so you can just
focus on the shader code.
3D games on the Web - Game development
the main browsers are all supporting webgl and all you need to
focus on is optimizing the performance on the devices you use.
...using a framework for 3d games also helps optimize the performance as a lot is taken care of by the tools you use, so you can
focus on building the game itself.
2D maze game with device orientation - Game development
the phaser framework provides you with a set of tools that will speed up development and help handle generic tasks needed to complete the game, so you can
focus on the game idea itself.
...let’s
focus on the keyboard first by adding the following to the create() function : this.keys = this.game.input.keyboard.createcursorkeys(); as you can see there’s a special phaser function called createcursorkeys(), which will give us an object with event handlers for the four arrow keys to play with: up, down, left and right.
RAIL - MDN Web Docs Glossary: Definitions of Web-related terms
rail, an acronym for response, animation, idle, and load, is a performance model originated by the google chrome team in 2015,
focused on user experience and performance within the browser.
... the performance mantra of rail is "
focus on the user; the end goal isn't to make your site perform fast on any specific device, it's to make users happy." there are 4 stages of interaction: page load, idle, response to input, and scrolling and animation.
What are hyperlinks? - Learn web development
tap or click a link to activate it, or if you use a keyboard, press tab until the link is in
focus and hit enter or spacebar.
... when you're building a website,
focus on internal links, since those make your site usable.
Advanced form styling - Learn web development
note: you may have noticed that in the search field, the "x" delete icon disappears when the input loses
focus in edge and chrome, but stays put in safari.
...however, this seems to get rid of the icon with
focus too, with no apparent way to get it back.
Example 3 - Learn web development
na</li> <li class="option">strawberry</li> <li class="option">apple</li> </ul> </div> </form> css content .widget select, .no-widget .select { position : absolute; left : -5000em; height : 0; overflow : hidden; } /* --------------- */ /* required styles */ /* --------------- */ .select { position: relative; display : inline-block; } .select.active, .select:
focus { box-shadow: 0 0 3px 1px #227755; outline: none; } .select .optlist { position: absolute; top : 100%; left : 0; } .select .optlist.hidden { max-height: 0; visibility: hidden; } /* ------------ */ /* fancy styles */ /* ------------ */ .select { font-size : 0.625em; /* 10px */ font-family : verdana, arial, sans-serif; -moz-box-sizing : border-box; box-sizing : b...
...elect'); 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) { deactivateselect(select); } }); }); }); result ...
Example 4 - Learn web development
na</li> <li class="option">strawberry</li> <li class="option">apple</li> </ul> </div> </form> css content .widget select, .no-widget .select { position : absolute; left : -5000em; height : 0; overflow : hidden; } /* --------------- */ /* required styles */ /* --------------- */ .select { position: relative; display : inline-block; } .select.active, .select:
focus { box-shadow: 0 0 3px 1px #227755; outline: none; } .select .optlist { position: absolute; top : 100%; left : 0; } .select .optlist.hidden { max-height: 0; visibility: hidden; } /* ------------ */ /* fancy styles */ /* ------------ */ .select { font-size : 0.625em; /* 10px */ font-family : verdana, arial, sans-serif; -moz-box-sizing : border-box; box-sizing : b...
...rall('.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...
Example 5 - Learn web development
ion" role="option">strawberry</li> <li class="option" role="option">apple</li> </ul> </div> </form> css content .widget select, .no-widget .select { position : absolute; left : -5000em; height : 0; overflow : hidden; } /* --------------- */ /* required styles */ /* --------------- */ .select { position: relative; display : inline-block; } .select.active, .select:
focus { box-shadow: 0 0 3px 1px #227755; outline: none; } .select .optlist { position: absolute; top : 100%; left : 0; } .select .optlist.hidden { max-height: 0; visibility: hidden; } /* ------------ */ /* fancy styles */ /* ------------ */ .select { font-size : 0.625em; /* 10px */ font-family : verdana, arial, sans-serif; -moz-box-sizing : border-box; box-sizing : b...
...x); 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('keyup', function (event) { var length = optionlist.length, index = getindex(select); if (event.keycode === 27) { deactivateselect(select); } if (event.keycode === 40 && index...
Other form controls - Learn web development
the following screenshots show default,
focused, and disabled <textarea> elements in firefox 71 and safari 13 on macos, and edge 18, yandex 14, firefox 71 and chrome 79 on windows 10.
...the optional size attribute provides control over how many options are visible when the select does not have
focus.
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 ...
...ton the <button> element is really convenient to style with css; you can do whatever you want, even using pseudo-elements: button { padding : 5px; font : bold .6em sans-serif; border : 2px solid #333; border-radius: 5px; background : none; cursor : pointer; transform : rotate(-1.5deg); } button:after { content : " >>>"; } button:hover, button:
focus { outline : none; background : #000; color : #fff; } the final result and voila!
Your first form - Learn web development
keep it simple and stay
focused: ask only for the data you absolutely need.
.../* uniform size & alignment */ display: 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 r...
From object to iframe — other embedding technologies - Learn web development
playable code <h2>live output</h2> <div class="output" style="min-height: 250px;"> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move
focus away from the code area (tab inserts a tab character).</p> <textarea id="code" class="input" style="width: 95%;min-height: 100px;"> </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: ...
...ext) { const scrollpos = textarea.scrolltop; const caretpos = textarea.selectionstart; const front = (textarea.value).substring(0, caretpos); const back = (textarea.value).substring(textarea.selectionend, textarea.value.length); textarea.value = front + text + back; caretpos = caretpos + text.length; textarea.selectionstart = caretpos; textarea.selectionend = caretpos; textarea.
focus(); textarea.scrolltop = scrollpos; } // update the saved usercode every time the user updates the text area code textarea.onkeyup = function(){ // we only want to save the state when the user code is being shown, // not the solution, so that solution is not saved over the user code if(solution.value === 'show solution') { userentry = textarea.value; } else { solutionentry = te...
HTML table basics - Learn web development
in this module we are
focusing on the html part; to find out about the css part you should visit our styling tables article after you've finished here.
... we won't
focus on css in this module, but we have provided a minimal css stylesheet for you to use that will make your tables more readable than the default you get without any styling.
Introduction to events - Learn web development
now try changing btn.onclick to the following different values in turn, and observing the results in the example: btn.on
focus and btn.onblur — the color changes when the button is
focused and un
focused; try pressing the tab to
focus on the button and press the tab again to
focus away from the button.
... these are often used to display information about filling in form fields when they are
focused, or displaying an error message if a form field is filled with an incorrect value.
Ember interactivity: Events, classes and state - Learn web development
add the new line shown below to your header.hbs file: <input class='new-todo' aria-label='what needs to be done?' placeholder='what needs to be done?' auto
focus {{on 'keydown' this.onkeydown}} > this new attribute is inside double curly braces, which tells you it is part of ember's dynamic templating syntax.
...ooter functionality, conditional rendering routing in ember ember resources and troubleshooting vue getting started with vue creating our first vue component rendering a list of vue components adding a new todo form: vue events, methods, and models styling vue components with css using vue computed properties vue conditional rendering: editing existing todos
focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
React interactivity: Editing, filtering, conditional rendering - Learn web development
our next article rounds things off for our react tutorials by looking at including
focus management in react, which can improve usability and reduce confusion for both keyboard-only and screenreader users.
...ooter functionality, conditional rendering routing in ember ember resources and troubleshooting vue getting started with vue creating our first vue component rendering a list of vue components adding a new todo form: vue events, methods, and models styling vue components with css using vue computed properties vue conditional rendering: editing existing todos
focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
Working with Svelte stores - Learn web development
ollowing import statement below the existing ones: import { alert } from '../stores.js' update your addtodo() function like so: function addtodo(name) { todos = [...todos, { id: newtodoid, name, completed: false }] $alert = `todo '${name}' has been added` } update removetodo() like so: function removetodo(todo) { todos = todos.filter(t => t.id !== todo.id) todosstatus.
focus() // give
focus to status heading $alert = `todo '${todo.name}' has been deleted` } update the updatetodo() function to this: function updatetodo(todo) { const i = todos.findindex(t => t.id === todo.id) if (todos[i].name !== todo.name) $alert = `todo '${todos[i].name}' has been renamed to '${todo.name}'` if (todos[i].completed !== todo.completed) $alert ...
...ooter functionality, conditional rendering routing in ember ember resources and troubleshooting vue getting started with vue creating our first vue component rendering a list of vue components adding a new todo form: vue events, methods, and models styling vue components with css using vue computed properties vue conditional rendering: editing existing todos
focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
Vue conditional rendering: editing existing todos - Learn web development
the last bit of functionality to look at is
focus management, or put another way, how we can improve our app's keyboard accessibility.
...ooter functionality, conditional rendering routing in ember ember resources and troubleshooting vue getting started with vue creating our first vue component rendering a list of vue components adding a new todo form: vue events, methods, and models styling vue components with css using vue computed properties vue conditional rendering: editing existing todos
focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
Adding a new todo form: Vue events, methods, and models - Learn web development
this means that vue will only sync data when the input loses
focus or the form is submitted.
...ooter functionality, conditional rendering routing in ember ember resources and troubleshooting vue getting started with vue creating our first vue component rendering a list of vue components adding a new todo form: vue events, methods, and models styling vue components with css using vue computed properties vue conditional rendering: editing existing todos
focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
Command line crash course - Learn web development
prettier is an opinionated code formatting tool for front end developers,
focusing around javascript-based languages and adding support for html, css, scss, json and more.
...adding the --write option to the prettier command will fix those up, leaving us to
focus on actually writing useful code.
CSUN Firefox Materials
screen magnifier users can also benefit from firefox's powerful features today, as caret and
focus tracking are fully enabled.
...it includes such features as duplicating tabs, controlling tab
focus, tab clicking options, undo closed tabs and windows, plus much more.
Embedding API for Accessibility
ading */ moz 0.8 link appearance setcharpref("browser.anchor_color", "#abcdef" /* hex color value */); setcharpref("browser.visited_color", "#abcdef" /* hex color value */); setboolpref("browser.underline_anchors", boolunderlinelinks); moz 0.8
focus appearance setboolpref("browser.display.use_
focus_colors", use
focuscolors); setcharpref("browser.display.
focus_background_color", colorstring); setcharpref("browser.display.
focus_text_color", colorstring); setcharpref("browser.display.
focus_ring_width", numpixels); /* 0-4 */ moz 0...
... timer speed setintpref("timer.relative_speed", percent); /* 100 corresponds to normal speed, 200 to double speed */ no allow cycling in lists and links setboolpref("keyboardnav.allow_cycling", allowcycling); no mouse pointer moves with keyboard
focus setboolpref("keyboardnav.mouse_follows_keyboard_
focus", mousefollows); /* if this pref is set, the mouse pointer will always be move to the 0,0 pixel of the current keyboard
focus frame */ no browse with caret setboolpref("accessibility.browsewithcaret", usecaret); /* if this pref is ...
Mozilla Plugin Accessibility
all browser keys unavailable when plugin has
focus focused plugins currently have no choice but to consume all keyboard events.
...
focus gets stuck in plugin.
Adding a new event
textevents.h this header file should be used for defining input events from keyboard or ime and also other text edit related events like querying
focused content information.
...if your event should be fired on
focused node, you need to modify widgetevent::istargetedat
focusedcontent().
How to implement a custom autocomplete search component
mplete-richlistbox" /> <textbox id="text1" type="autocomplete" autocompletesearch="simple-autocomplete" showcommentcolumn="true" autocompletepopup="richpopup" autocompletesearchparam='[{"value":"mark","comment":"cool dude"},{"value":"mary","comment":"nice lady"},{"value":"jimmy","comment":"very uncool guy"},{"value":"jimbo","comment":null}]' /> how to solve autocomplete panel
focus problems in some situations there may be problems with the display of the autocomplete panel (this is the panel where the autocomplete results/suggestions are displayed): the autocomplete panel seems to appear seldom and very erratically.
...the solution is to define a custom autocomplete panel as follows with the noauto
focus="true" attribute (very important, don't miss this part): <panel id="popup_autocomplete" type="autocomplete" noauto
focus="true" /> <textbox type="autocomplete" autocompletesearch="custom-autocomplete" autocompletepopup="popup_autocomplete" /> there is another example of the use of an autocomplete panel in autocomplete code snippets.
Index
we'll primarily
focus on getting your release repository setup and the mercurial commands you'll need to know to use that repository.
... 27 localizing without a specialized tool from the create a new localization document, an interested localizer can follow a technical step-by-step process that starts the localization process by
focusing on how to localize two of the primary types of localization files (dtd and properties) used in the mozilla source code.
Gecko Profiler FAQ
this mode is usually recommended when you want to find a thread you want to do more
focused profiling on, so that you can find its name and then construct a more useful thread filter string based on the found thread name.
... is it better to profile across multiple platforms, or to
focus time on windows (since that's the bulk of our users)?
browser.search.context.loadInBackground
browser.search.context.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.
... type:boolean default value:false exists by default: yes application support: firefox 13.0 status: active; last updated 2012-02-17 introduction: pushed to nightly on 2012-02-15 bugs: bug 727131 values true new tab with search results will be opened in the background,
focus stays on the current tab.
Preference reference
accessibility.tab
focusthe preference accessibility.tab
focus controls what elements receive
focus when the user presses the tab key.browser.altclicksavethe preference browser.altclicksave controls whether clicking a link while holding the alt key starts the download of that link.browser.dom.window.dump.enabledthis setting enables the dump function, which sends messages to the system console.
...n creates screenshots of visited pages which will be shown if the web page is shown in the grid of the "new tab page" (about:newtab) which offers the most often visited pages for fast navigation.browser.search.context.loadinbackgroundbrowser.search.context.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 whe...
Gecko object attributes
the line number is relative to the top of the currently
focused area (the document, a rich text editable area, or an input control).
... applied to: any
focusable accessible text object margin-bottom specifies how much vertical space there will be after the bottom of the last line of content in a text accessible (see the css margin-bottom property).
Starting WebLock
this chapter will
focus on the functionality that actually handles the web locking.
...n", rv); return -1; } nscomptr<iweblock> weblock; rv = servman->getservicebycontractid("@dougt/weblock", ns_get_iid(iweblock), getter_addrefs(weblock)); if (ns_failed(rv)) { printf("error: xpcom obtaining service [%x].\n", rv); return -1; } implementing the iweblock interface once the interface is defined, you can
focus on implementing the web lock startup functionality itself.
nsIAccessibleEvent
event_
focus 0x8005 0x0008 0x0005 an object has received the keyboard
focus.
... event_hypertext_changed 0x0057 0x0053
focus has changed from one hypertext object to another, or
focus moved from a non-hypertext object to a hypertext object, or
focus moved from a hypertext object to a non-hypertext object.
nsIAlertsService
vice;1'].getservice(ci.nsialertsservice); var notiflistener = { observe: function(asubject, atopic, adata) { console.error('incoming notification observer:', asubject, atopic, adata); if (atopic == 'alertclickcallback') { console.error('user clicked trying to throw click'); services.prompt.alert(services.wm.getmostrecentwindow('navigator:firefox'), '
focus firefox', 'will now
focus fireox and then
focus the tab'); } else if (atopic == 'alertshow') { console.log('just showed notification'); } else if (atopic == 'alertfinished') { console.log('just alertfinished') } } }; as.showalertnotification('chrome://branding/content/icon64.png', 'stackoverflow - new messages', 'there are ## new messages.
... click here to
focus the tab', true, null, notiflistener, 'stackoverflow notifier'); closealert() closes alerts created by the service.
nsICompositionStringSynthesizer
(optional) compositionstringsynthesizer.setcaret("foo-bar".length, 0); // dispatch dom events to modify the
focused editor compositionstringsynthesizer.dispatchevent(); when you modify the composing string, you don't need to recreate the instance anymore.
... dispatchevent() dispatches dom events for setting the composition string which are specified by setstring(), appendclause() and setcaret() to the
focused editor.
nsIMacDockSupport
.org/keymaster/gatekeeper/there.is.only.xul', 'menuitem'); macmenuitem.setattribute('label', 'show most recent window'); macmenuitem.setattribute('id', 'mymacmenuitem'); macmenuitem.addeventlistener('command', function(){ var docksupport = cc['@mozilla.org/widget/macdocksupport;1'].getservice(ci.nsimacdocksupport); docksupport.activateapplication(true); services.wm.getmostrecentwindow(null).
focus() }) macmenu.appendchild(macmenuitem); var mainpopupset = win.document.getelementbyid('mainpopupset'); mainpopupset.appendchild(macmenu); let dockmenuelement = macmenu; //document.getelementbyid("menu_mac_dockmenu");66 let nativemenu = cc["@mozilla.org/widget/standalonenativemenu;1"].createinstance(ci.nsistandalonenativemenu); console.log('dockmenuelement:', dockmenuelement); nativemenu.init(d...
....org/keymaster/gatekeeper/there.is.only.xul', 'menuitem'); macmenuitem.setattribute('label', 'show most recent window'); macmenuitem.setattribute('id', 'mymacmenuitem'); macmenuitem.addeventlistener('command', function(){ var docksupport = cc['@mozilla.org/widget/macdocksupport;1'].getservice(ci.nsimacdocksupport); docksupport.activateapplication(true); services.wm.getmostrecentwindow(null).
focus() }) services.appshell.hiddendomwindow.document.getelementbyid('menu_mac_dockmenu').appendchild(macmenuitem) this adds the "show most recent window" menuitem from the previous example as a third item.
nsITextInputProcessorCallback
example of simple js-ime: var simpleime = { _has
focus: false, _hasrightstocompose: false, _tip: null, _callback: function simpleime_callback(atip, anotification) { try { switch (anotification.type) { case "request-to-commit": atip.commitcomposition(); break; case "request-to-cancel": atip.cancelcomposition(); break; case "notify-
focus": this._has
focus = true;...
... break; case "notify-blur": this._has
focus = false; break; case "notify-detached": this._has
focus = false; this._hasrightstocompose = false; break; } return true; } catch (e) { return false; } }, setcomposition: function simpleime_setcomposition(atext, aclauses, acaret) { if (!this._tip) { this._tip = components.classes["@mozilla.org/text-input-processor;1"].
nsITreeSelection
currentindex long the current item (the one with
focus).
...this is not a reliable method of determining the selected row, as the selection may include multiple rows, or the
focused row may not even be selected.
nsIWebBrowser
the chrome may optionally implement nsiinterfacerequestor, nsiwebbrowserchrome
focus, nsicontextmenulistener and nsitooltiplistener to receive additional notifications from the browser object.
... see also nsibasewindow nsicontextmenulistener nsidomwindow nsiembeddingsitewindow nsiinterfacerequestor nsishistorylistener nsitooltiplistener nsiuricontentlistener nsiweakreference nsiwebbrowserchrome nsiwebbrowserchrome
focus nsiwebprogresslistener ...
nsIWindowMediator
native code only!updatewindowtimestamp call this method when a window gains
focus.
... void updatewindowtimestamp( in nsixulwindow awindow ); parameters awindow the window which has gained
focus.
XPCOM Interface Reference
vicensiftpchannelnsiftpeventsinknsifactorynsifavicondatacallbacknsifaviconservicensifeednsifeedcontainernsifeedelementbasensifeedentrynsifeedgeneratornsifeedpersonnsifeedprocessornsifeedprogresslistenernsifeedresultnsifeedresultlistenernsifeedtextconstructnsifilensifileinputstreamnsifileoutputstreamnsifilepickernsifileprotocolhandlernsifilespecnsifilestreamsnsifileurlnsifileutilitiesnsifileviewnsi
focusmanagernsiformhistory2nsiframeloadernsiframeloaderownernsiframemessagelistenernsiframemessagemanagernsiframescriptloadernsigsettingscollectionnsigsettingsservicensigeolocationprovidernsigeolocationupdatensiglobalhistorynsiglobalhistory2nsiglobalhistory3nsihtmleditornsihttpheaderlistenernsihapticfeedbacknsihttpactivitydistributornsihttpactivityobservernsihttpchannelnsihttpchannelinternalnsihttphead...
...erterservicensiutf8stringenumeratornsiuuidgeneratornsiupdatensiupdatechecklistenernsiupdatecheckernsiupdateitemnsiupdatemanagernsiupdatepatchnsiupdatepromptnsiupdatetimermanagernsiuploadchannelnsiuploadchannel2nsiurllistmanagercallbacknsiusercertpickernsiuserinfonsivariantnsiversioncomparatornsiweakreferencensiwebbrowsernsiwebbrowserchromensiwebbrowserchrome2nsiwebbrowserchrome3nsiwebbrowserchrome
focusnsiwebbrowserfindnsiwebbrowserfindinframesnsiwebbrowserpersistnsiwebcontenthandlerregistrarnsiwebnavigationnsiwebnavigationinfonsiwebpagedescriptornsiwebprogressnsiwebprogresslistenernsiwebprogresslistener2nsiwebsocketchannelnsiwebsocketlistenernsiwebappssupportnsiwifiaccesspointnsiwifilistenernsiwifimonitornsiwinaccessnodensiwinapphelpernsiwintaskbarnsiwindowcreatornsiwindowmediatornsiwindowwatch...
Standard OS Libraries
as wayland is not out yet in the wild this article does not
focus on wayland, it will
focus on gtk+ and xorg(x11/x).
... although jni is done completely through js-ctypes, a jsm was created to abstract away the js-ctypes so developers can
focus on the jni aspect.
Accessibility Inspector - Firefox Developer Tools
for example, one of the links in one demo has states of
focusable, linked, selectable text, opaque, enabled, and sensitive.
... when one of the panels is
focused, you can move the
focus up and down items using the up and down arrow keys, and use the left and right arrow keys to expand and collapse expandable rows (e.g., different hierarchy levels of the accessibility tree).
DOM Inspector FAQ - Firefox Developer Tools
inspect a url this just
focuses the dom inspector's address bar, which allow you to inspect arbitrary documents which can be accessed via a url.
... dom inspector allows you to force the :hover, :active, and :
focus pseudo-classes to apply to a given node.
Index - Firefox Developer Tools
68 select an element guide, inspector, tools the selected element is the element in the page that the inspector is currently
focused on.
... 69 select and highlight elements the selected element is the element in the page that the inspector is currently
focused on.
Migrating from Firebug - Firefox Developer Tools
toggle pseudo-classes firebug lets you toggle the css pseudo-classes :hover, :active and :
focus for an element via the options menu of the style side panel.
...while firebug
focuses on javascript performance and provides detailed information about javascript function calls during the profiling session, the performance tool in the devtools offers a broad spectrum of information regarding a website's performance but doesn't go into detail regarding javascript function calls.
Network request list - Firefox Developer Tools
to delete a blocked item, click the x icon that appears when you
focus the item.
...you can
focus it by clicking in the filter box, or by pressing ctrl + f (or cmd + f on a mac); then start typing.
Call Tree - Firefox Developer Tools
the inverted call tree is a good way to
focus on these self cost values.
...the direct consequence is that this is a view that
focuses more on the function's self time information.
CSS.registerProperty() - Web APIs
we can now use that property to transition a gradient on hover or
focus.
... .registered { --my-color: #c0ffee; background-image: linear-gradient(to right, #fff, var(--my-color)); transition: --my-color 1s ease-in-out; } .registered:hover, .registered:
focus { --my-color: #b4d455; } .unregistered { --unregistered: #c0ffee; background-image: linear-gradient(to right, #fff, var(--unregistered)); transition: --unregistered 1s ease-in-out; } .unregistered:hover, .unregistered:
focus { --unregistered: #b4d455; } button { font-size: 3vw; } we can add these styles to some buttons: <button class="registered">background registered</button> <button class="unregistered">background not registered</button> specifications specificatio...
Document: keypress event - Web APIs
interface keyboardevent bubbles yes cancelable yes default action varies: keypress event; launch text composition system; blur and
focus events; domactivate event; other event examples addeventlistener keypress example this example logs the keyboardevent.code value whenever you press a key.
... <p>press inside this iframe first to
focus it, then try pressing keys on the keyboard.</p> <p id="log"></p> const log = document.getelementbyid('log'); document.addeventlistener('keypress', logkey); function logkey(e) { log.textcontent += ` ${e.code}`; } onkeypress equivalent document.onkeypress = logkey; specifications specification status ui events working draft ...
Element.attachShadow() - Web APIs
this can be one of: open: elements of the shadow root are accessible from javascript outside the root, for example using element.shadowroot: element.shadowroot; // returns a shadowroot obj closed: denies access to the node(s) of a closed shadow root from javascript outside it: element.shadowroot; // returns null delegates
focus a boolean that, when set to true, specifies behavior that mitigates custom element issues around
focusability.
... when a non-
focusable part of the shadow dom is clicked, the first
focusable part is given
focus, and the shadow host is given any available :
focus styling.
Element: keypress event - Web APIs
interface keyboardevent bubbles yes cancelable yes default action varies: keypress event; launch text composition system; blur and
focus events; domactivate event; other event examples addeventlistener keypress example this example logs the keyboardevent.code value whenever you press a key after
focussing the <input> element.
... <div> <label for="sample">
focus the input and type something:</label> <input type="text" name="text" id="sample"> </div> <p id="log"></p> const log = document.getelementbyid('log'); const input = document.queryselector('input'); input.addeventlistener('keypress', logkey); function logkey(e) { log.textcontent += ` ${e.code}`; } onkeypress equivalent input.onkeypress = logkey; specifications specification status ui events working draft ...
Element.tabStop - Web APIs
the tabstop property of the element interface returns a boolean indicating if the element can receive input
focus via the tab key.
...after feedback, this property was removed from the design doc and replaced by shadowroot.delegates
focus.
Using files from web applications - Web APIs
consider this html: <input type="file" id="fileelem" multiple accept="image/*" class="visually-hidden"> <label for="fileelem">select some files</label> and this css: .visually-hidden { position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); } /* separate rule for compatibility, :
focus-within is required on modern firefox and chrome */ input.visually-hidden:
focus + label { outline: thin dotted; } input.visually-hidden:
focus-within + label { outline: thin dotted; } there is no need to add javascript code to call fileelem.click().
...you need to provide a visual cue for the
focus status of the hidden input field on its label, be it an outline as shown above, or background-color or box-shadow.
HTMLBodyElement - Web APIs
living standard technically, the event-related properties onafterprint, onbeforeprint, onbeforeunload, onblur, onerror, on
focus, onhashchange, onlanguagechange, onload, onmessage, onoffline, ononline, onpopstate, onresize, onstorage, and onunload, have been moved to windoweventhandlers.
... the following properties have been added: onafterprint, onbeforeprint, onbeforeunload, onblur, onerror, on
focus, onhashchange, onload, onmessage, onoffline, ononline, onpopstate, onresize, onstorage, and onunload.
HTMLButtonElement - Web APIs
htmlbuttonelement.auto
focus is a boolean indicating whether or not the control should have input
focus when the page loads, unless the user overrides it, for example by typing in a different control.
... the following attributes have been added: auto
focus, formaction, formenctype, formmethod, formnovalidate, formtarget, labels, validity, validationmessage, and willvalidate.
HTMLElement: change event - Web APIs
when the element is :checked (by clicking or using the keyboard) for <input type="radio"> and <input type="checkbox">; when the user commits the change explicitly (e.g., by selecting a value from a <select>'s dropdown with a mouse click, by selecting a date from a date picker for <input type="date">, by selecting a file in the file picker for <input type="file">, etc.); when the element loses
focus after its value was changed, but not commited (e.g., after editing the value of <textarea> or <input type="text">).
...rid-area: result; } javascript const selectelement = document.queryselector('.ice-cream'); selectelement.addeventlistener('change', (event) => { const result = document.queryselector('.result'); result.textcontent = `you like ${event.target.value}`; }); result text input element for some elements, including <input type="text">, the change event doesn't fire until the control loses
focus.
HTMLElement - Web APIs
htmlorforeignelement.blur() removes keyboard
focus from the currently
focused element.
... htmlorforeignelement.
focus() makes the element the current keyboard
focus.
HTMLElement.blur() - Web APIs
the htmlelement.blur() method removes keyboard
focus from the current element.
... syntax element.blur(); examples remove
focus from a text input html <input type="text" id="mytext" value="sample text"> <br><br> <button type="button" onclick="
focusinput()">click me to gain
focus</button> <button type="button" onclick="blurinput()">click me to lose
focus</button> javascript function
focusinput() { document.getelementbyid('mytext').
focus(); } function blurinput() { document.getelementbyid('mytext').blur(); } result specification specification status comment html living standardthe definition of 'blur' in that specification.
HTMLOrForeignElement - Web APIs
on the element.nonce the nonce property of the htmlorforeignelement interface returns the cryptographic number used once that is used by content security policy to determine whether a given fetch will be allowed to proceed.tabindexthe tabindex property of the htmlorforeignelement interface represents the tab order of the current element.methodsblur()the htmlelement.blur() method removes keyboard
focus from the current element.
focus()the htmlelement.
focus() method sets
focus on the specified element, if it can be
focused.
... the
focused element is the element which will receive keyboard and similar events by default.
Using the MediaStream Recording API - Web APIs
first of all, we style the <label> how we want it, making sure that it has enough z-index to always sit above the other elements and therefore be
focusable/clickable: label { font-family: 'notocoloremoji'; font-size: 3rem; position: absolute; top: 2px; right: 3px; z-index: 5; cursor: pointer; } then we hide the actual checkbox, because we don't want it cluttering up our ui: input[type=checkbox] { position: absolute; top: -100px; } next, we style the information screen (wrapped in an <aside> element) how we w...
...on for smooth showing/hiding: aside { position: fixed; top: 0; left: 0; text-shadow: 1px 1px 1px black; width: 100%; height: 100%; transform: translatex(100%); transition: 0.6s all; background-color: #999; background-image: linear-gradient(to top right, rgba(0,0,0,0), rgba(0,0,0,0.5)); } last, we write a rule to say that when the checkbox is checked (when we click/
focus the label), the adjacent <aside> element will have its horizontal translation value changed and transition smoothly into view: input[type=checkbox]:checked ~ aside { transform: translatex(0); } basic app setup to grab the media stream we want to capture, we use getusermedia().
MediaTrackConstraints - Web APIs
focusmode a string specifying one of "none", "manual", "single-shot", or "continuous".
...
focusdistance a constraindouble (a double-precision integer) specifying distance to a
focused object.
Notification.onclick - Web APIs
}; the default behavior is to move the
focus to the viewport of the notification's related browsing context.
... examples in the following example, we use an onclick handler to open a webpage in a new tab (specified by the inclusion of the '_blank' parameter) once a notification is clicked: notification.onclick = function(event) { event.preventdefault(); // prevent the browser from
focusing the notification's tab window.open('http://www.mozilla.org', '_blank'); } specifications specification status comment notifications apithe definition of 'onclick' in that specification.
Page Visibility API - Web APIs
for example, watching for blur and
focus events on the window helps you know when your page is not the active page, but it does not tell you that your page is actually hidden to the user.
... note: while onblur and on
focus will tell you if the user switches windows, it doesn't necessarily mean it's hidden.
ServiceWorkerGlobalScope: notificationclick event - Web APIs
no interface notificationevent event handler onnotificationclick examples you can use the notificationclick event in an addeventlistener method: self.addeventlistener('notificationclick', function(event) { console.log('on notification click: ', event.notification.tag); event.notification.close(); // this looks to see if the current is already open and //
focuses if it is event.waituntil(clients.matchall({ type: "window" }).then(function(clientlist) { for (var i = 0; i < clientlist.length; i++) { var client = clientlist[i]; if (client.url == '/' && '
focus' in client) return client.
focus(); } if (clients.openwindow) return clients.openwindow('/'); })); }); or use the onnotificationclick event handler prop...
...erty: self.onnotificationclick = function(event) { console.log('on notification click: ', event.notification.tag); event.notification.close(); // this looks to see if the current is already open and //
focuses if it is event.waituntil(clients.matchall({ type: "window" }).then(function(clientlist) { for (var i = 0; i < clientlist.length; i++) { var client = clientlist[i]; if (client.url == '/' && '
focus' in client) return client.
focus(); } if (clients.openwindow) return clients.openwindow('/'); })); }; specifications specification status notifications apithe definition of 'onnotificationclick' in that specification.
ShadowRoot - Web APIs
properties shadowroot.delegates
focus read only returns a boolean that indicates whether delegates
focus was set when the shadow was attached (see element.attachshadow()).
... documentorshadowroot.activeelement read only returns the element within the shadow tree that has
focus.
Matrix math for the web - Web APIs
glmatrix is an example of a library that has a
focus on speed and performance.
... the
focus in the glmatrix library is to have target arrays that are allocated before the update loop.
WebXR permissions and security - Web APIs
the document is considered trustworthy, in that it is responsible and is both currently active and has
focus.
...a trustworthy document is one which is both responsible and active, and which currently has
focus.
Starting up and shutting down a WebXR session - Web APIs
on top of that, the document needs to be secure and currently
focused.
... detecting changes to session's visibility state when the state of the xrsession's visibility changes—such as when the session is hidden or displayed, or when the user has
focused another context—the session receives an eventvisibilitychange event.
Window.blur() - Web APIs
shifts
focus away from the window.
... syntax window.blur() example window.blur(); notes the window.blur() method is the programmatic equivalent of the user shifting
focus away from the current window.
Window.captureEvents() - Web APIs
syntax window.captureevents(eventtype) eventtype is a combination of the following values: event.abort, event.blur, event.click, event.change, event.dblclick, event.dragddrop, event.error, event.
focus, event.keydown, event.keypress, event.keyup, event.load, event.mousedown, event.mousemove, event.mouseout, event.mouseover, event.mouseup, event.move, event.reset, event.resize, event.select, event.submit, event.unload.
...--> <script> function 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.
Using the aria-activedescendant attribute - Accessibility
it makes do with the overhead of having all or more than one child
focusable.
... possible effects on user agents and assistive technology the user agent, which is any software that retrieves, renders and facilitates end user interaction with web content, uses the aria-activedescendant property to inform the assistive technology about the active child which has
focus.
Using the group role - Accessibility
assistive technology products should listen for such an event and notify the user accordingly: screen readers should announce the group when
focus first lands on a control inside it, and if aria-describedby has been set, the description may be spoken.
... following this the
focused control may be announced.
Using the slider role - Accessibility
keyboard and
focus the slider should be keyboard
focusable and operable.
... when the user tabs
focus to the slider, it should land on the thumb: the control a mouse user would drag.
ARIA: switch role - Accessibility
since a switch is an interactive control, it must be
focusable and keyboard accessible.
... if the role is applied to a non-
focusable element, use the tabindex attribute to change this.
HTML To MSAA - Accessibility
attribute state_system_ selectable if @name attribute is presented state_system_ linked if @href attribute is presented or click event listener is registered state_system_ traversed if link is traversed n/a "jump" if @href is valid n/a br role_system_ whitespace '\n' (new line char) state_system_ readonly n/a n/a n/a button role_system_ pushbutton from child nodes n/a state_system_
focusable state_system_ default if @type attribute has value "submit" n/a "press" n/a caption bstr role n/a n/a n/a description_for (0x100f), points to table element div bstr role n/a n/a n/a n/a n/a n/a fieldset role_system_ grouping text equivalent from child legend element n/a n/a labelled_by (1003), points to legend element n/a n/a hr role_system_ separator n/a n/a n/a n/a n/...
...stem_ listitem from @label attribute, from child text nodes n/a state_system_ selected if option is selected n/a "select" event_object_ selectionwithin event_object_ selectionadd if selected event_object_ selectionremove if unselected select @size > 1 role_system_ list n/a n/a state_system_ multiselectable if multiselectable n/a n/a n/a select @size = 1 role_system_ combobox n/a name of
focused option state_system_ expanded if combobox open state_system_ collapsed if combobox is collapsed state_system_ haspopup state_system_
focusable n/a "open"/"close" depending on state event_object_ valuechange when selected option is changed table role_system_ table from @summary attribute n/a described_by (0x100e) points to caption element n/a n/a td, th role_system_ cell n/a n/a n/...
Accessibility Information for Web Authors - Accessibility
how-to's key-navigable custom dhtml widgets in mozilla & ie this document discusses how to use tabindex, element.
focus() and onkeypress to make custom dhtml widgets such as menus or tree views keyboard accessible.
...these widgets are usually not even keyboard
focusable.
Mobile accessibility checklist - Accessibility
focus all activatable elements must be
focusable: standard controls such as links, buttons, and form fields are
focusable by default.
...
focus should be handled in a logical order and consistent manner.
Perceivable - Accessibility
unctionality occurs when the following styles are applied: line height (line spacing) to at least 1.5 times the font size spacing following paragraphs to at least 2 times the font size letter spacing (tracking) to at least 0.12 times the font size word spacing to at least 0.16 times the font size understanding text spacing 1.4.13 content on hover or
focus (aa) added in 2.1 while additional content may appear and disappear in coordination with hover and keyboard
focus, this success criterion specifies three conditions that must be met: dismissable (can be closed/removed) hoverable (the additional content does not disappear when the pointer is over it) persistent (the additional content does not disappear without user a...
...ction) understanding content on hover or
focus note: also see the wcag description for guideline 1.4: distinguishable: make it easier for users to see and hear content including separating foreground from background..
::after (:after) - CSS: Cascading Style Sheets
we can also support keyboard users with this technique, by adding a tabindex of 0 to make each span keyboard
focusable, and using a css :
focus selector.
...</p> css span[data-descr] { position: relative; text-decoration: underline; color: #00f; cursor: help; } span[data-descr]:hover::after, span[data-descr]:
focus::after { content: attr(data-descr); position: absolute; left: 0; top: 24px; min-width: 200px; border: 1px #aaaaaa solid; border-radius: 10px; background-color: #ffffcc; padding: 12px; color: #000000; font-size: 14px; z-index: 1; } result specifications specification status comment css pseudo-elements level 4the definition of '::after' in th...
:disabled - CSS: Cascading Style Sheets
an element is disabled if it can't be activated (selected, clicked on, typed into, etc.) or accept
focus.
... the element also has an enabled state, in which it can be activated or accept
focus.
:enabled - CSS: Cascading Style Sheets
an element is enabled if it can be activated (selected, clicked on, typed into, etc.) or accept
focus.
... the element also has a disabled state, in which it can't be activated or accept
focus.
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.
... flexbox and the keyboard navigation disconnect html source order vs css display order the responsive order conflict for keyboard
focus use cases for order there are sometimes places where the fact that the logical and therefore reading order of flex items is separate from the visual order, is helpful.
Pseudo-classes - CSS: Cascading Style Sheets
index of standard pseudo-classes :active :any-link :blank :checked :current :default :defined :dir() :disabled :drop :empty :enabled :first :first-child :first-of-type :fullscreen :future :
focus :
focus-visible :
focus-within :has() :host :host() :host-context() :hover :indeterminate :in-range :invalid :is() :lang() :last-child :last-of-type :left :link :local-link :not() :nth-child() :nth-col() :nth-last-child() :nth-last-col() :nth-last-of-type() :nth-of-type() :only-child :only-of-type :optional :out-of-range :past :placeholder-shown :rea...
... css level 2 (revision 1) recommendation defined :lang(), :first-child, :hover, and :
focus.
matrix3d() - CSS: Cascading Style Sheets
a1a2a3a4b1b2b3b4c1c2c3c4d1d2d3d4 examples cube squashing example the following example shows a 3d cube created from dom elements and transforms, which can be hovered/
focused to apply a matrix3d() transform to it.
...div class="face back">2</div> <div class="face right">3</div> <div class="face left">4</div> <div class="face top">5</div> <div class="face bottom">6</div> </section> css #example-element { width: 100px; height: 100px; transform-style: preserve-3d; transition: transform 1.5s; transform: rotate3d(1, 1, 1, 30deg); margin: 50px auto; } #example-element:hover, #example-element:
focus { transform: rotate3d(1, 1, 1, 30deg) matrix3d(1,0,0,0,0,1,6,0,0,0,1,0,50,100,0,1.1); } .face { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; position: absolute; backface-visibility: inherit; font-size: 60px; color: #fff; } .front { background: rgba(90,90,90,.7); transform: translatez(50px); } .back { background: rgba(0,...
Audio and video manipulation - Developer guides
backrate = 2;</textarea> var textarea = document.getelementbyid('code'); var reset = document.getelementbyid('reset'); var edit = document.getelementbyid('edit'); var code = textarea.value; function setplaybackrate() { eval(textarea.value); } reset.addeventlistener('click', function() { textarea.value = code; setplaybackrate(); }); edit.addeventlistener('click', function() { textarea.
focus(); }) textarea.addeventlistener('input', setplaybackrate); window.addeventlistener('load', setplaybackrate); note: try the playbackrate example live.
... filter.connect(context.destination); var textarea = document.getelementbyid('code'); var reset = document.getelementbyid('reset'); var edit = document.getelementbyid('edit'); var code = textarea.value; function setfilter() { eval(textarea.value); } reset.addeventlistener('click', function() { textarea.value = code; setfilter(); }); edit.addeventlistener('click', function() { textarea.
focus(); }) textarea.addeventlistener('input', setfilter); window.addeventlistener('load', setfilter); note: unless you have cors enabled, to avoid security issues your video should be on the same domain as your code.
Making content editable - Developer guides
ch text editor <!doctype html> <html> <head> <title>rich text editor</title> <script type="text/javascript"> var odoc, sdeftxt; function initdoc() { odoc = document.getelementbyid("textbox"); sdeftxt = odoc.innerhtml; if (document.compform.switchmode.checked) { setdocmode(true); } } function formatdoc(scmd, svalue) { if (validatemode()) { document.execcommand(scmd, false, svalue); odoc.
focus(); } } function validatemode() { if (!document.compform.switchmode.checked) { return true ; } alert("uncheck \"show html\"."); odoc.
focus(); return false; } function setdocmode(btosource) { var ocontent; if (btosource) { ocontent = document.createtextnode(odoc.innerhtml); odoc.innerhtml = ""; var opre = document.createelement("pre"); odoc.contenteditable = false; ...
... opre.appendchild(ocontent); odoc.appendchild(opre); document.execcommand("defaultparagraphseparator", false, "div"); } else { if (document.all) { odoc.innerhtml = odoc.innertext; } else { ocontent = document.createrange(); ocontent.selectnodecontents(odoc.firstchild); odoc.innerhtml = ocontent.tostring(); } odoc.contenteditable = true; } odoc.
focus(); } function printdoc() { if (!validatemode()) { return; } var oprntwin = window.open("","_blank","width=450,height=470,left=400,top=100,menubar=yes,toolbar=no,location=no,scrollbars=yes"); oprntwin.document.open(); oprntwin.document.write("<!doctype html><html><head><title>print<\/title><\/head><body onload=\"print();\">" + odoc.innerhtml + "<\/body><\/html>"); oprntwin.document.clos...
Mobile-friendliness - Developer guides
their desktop site
focuses on getting visitors to book trips.
...if your audience is full of early-adopters, you can
focus on tablets and smartphones with standards-friendly browsers.
<a>: The Anchor element - HTML: Hypertext Markup Language
usually, css hides a skip link offscreen until
focused.
... <body> <a href="#content">skip to main content</a> <header> … </header> <main id="content"> <!-- the skip link jumps to here --> .skip-link { position: absolute; top: -3em; background: #fff; } .skip-link:
focus { top: 0; } skip links let keyboard users bypass content repeated throughout multiple pages, such as header navigation.
<keygen> - HTML: Hypertext Markup Language
auto
focus this boolean attribute lets you specify that the control should have input
focus when the page loads, unless the user overrides it, for example by typing in a different control.
... only one form element in a document can have the auto
focus attribute, which is a boolean.
<label> - HTML: Hypertext Markup Language
this means that, for example, a screenreader will read out the label when the user is
focused on the form input, making it easier for an assistive technology user to understand what data should be entered.
... you can click the associated label to
focus/activate the input, as well as the input itself.
Codecs used by WebRTC - Web media technologies
it's worth noting that the rfc covers a variety of video-related requirements, including color spaces (srgb is the preferred, but not required, default color space), recommendations for webcam processing features (automatic
focus, automatic white balance, automatic light level), and so on.
...if you select avc, make sure you're; aware of any potential fees you may need to pay; that said, the patent holders have generally said that most typical web site developers shouldn't need to worry about paying the license fees, which are typically
focused more on the developers of the encoding and decoding software.
Optimizing startup performance - Web Performance
an often overlooked aspect of app software development—even among those
focusing on performance optimization—is startup performance.
...since that's a universal issue, we won't be
focusing on it too much here.
Performance budgets - Web Performance
however, based on the specific goals and content of your site, you might choose to
focus on other metrics.
...when defining metrics, you should
focus on user experience, which will dictate not only the bounce or conversion rate but how likely is that user to return.
Web Performance
since that's a universal issue, we won't be
focusing on it too much here.
... css performance features css may be a less important optimization
focus for improved performance, but there are some css features that impact performance more than others.
Progressive web app structure - Progressive web apps (PWAs)
we can control what is requested from the server and what is retrieved from the cache with a service worker, which will be explained in detail in the next article — for now let's
focus on the structure itself.
...as you can see it is a very ordinary, one page website — the point is to have something simple so we can
focus on the implementation of the actual pwa features.
SVG Event Attributes - SVG: Scalable Vector Graphics
onrepeat document event attributes onabort, onerror, onresize, onscroll, onunload document element event attributes oncopy, oncut, onpaste global event attributes oncancel, oncanplay, oncanplaythrough, onchange, onclick, onclose, oncuechange, ondblclick, ondrag, ondragend, ondragenter, ondragexit, ondragleave, ondragover, ondragstart, ondrop, ondurationchange, onemptied, onended, onerror, on
focus, oninput, oninvalid, onkeydown, onkeypress, onkeyup, onload, onloadeddata, onloadedmetadata, onloadstart, onmousedown, onmouseenter, onmouseleave, onmousemove, onmouseout, onmouseover, onmouseup, onmousewheel, onpause, onplay, onplaying, onprogress, onratechange, onreset, onresize, onscroll, onseeked, onseeking, onselect, onshow, onstalled, onsubmit, onsuspend, ontimeupdate, ontoggle, onvolumecha...
...nge, onwaiting graphical event attributes onactivate, on
focusin, on
focusout ...
specularExponent - SVG: Scalable Vector Graphics
the specularexponent attribute controls the
focus for the light source.
... value <number> default value 1 animatable yes fespotlight for <fespotlight>, specularexponent defines the exponent value controlling the
focus for the light source.
tabindex - SVG: Scalable Vector Graphics
the tabindex attribute allows you to control whether an element is
focusable and to define the relative order of the element for the purposes of sequential
focus navigation.
...ircle cx="60" cy="60" r="15" tabindex="1" /> <circle cx="60" cy="160" r="30" tabindex="3" /> <circle cx="160" cy="60" r="30" tabindex="2" /> <circle cx="160" cy="160" r="60" tabindex="4" /> </svg> usage notes value valid integer default value none animatable no valid integer relative order of the element for the purposes of sequential
focus navigation.
SVG Attribute reference - SVG: Scalable Vector Graphics
nt attributes animation event attributes onbegin, onend, onrepeat document event attributes onabort, onerror, onresize, onscroll, onunload global event attributes oncancel, oncanplay, oncanplaythrough, onchange, onclick, onclose, oncuechange, ondblclick, ondrag, ondragend, ondragenter, ondragexit, ondragleave, ondragover, ondragstart, ondrop, ondurationchange, onemptied, onended, onerror, on
focus, oninput, oninvalid, onkeydown, onkeypress, onkeyup, onload, onloadeddata, onloadedmetadata, onloadstart, onmousedown, onmouseenter, onmouseleave, onmousemove, onmouseout, onmouseover, onmouseup, onmousewheel, onpause, onplay, onplaying, onprogress, onratechange, onreset, onresize, onscroll, onseeked, onseeking, onselect, onshow, onstalled, onsubmit, onsuspend, ontimeupdate, ontoggle, onvolumecha...
...nge, onwaiting graphical event attributes onactivate, on
focusin, on
focusout ...
Styling a Tree - Archive of obsolete content
the following properties are automatically set as needed: checked this property is set cells whose column is type="checkbox"
focus this property is set if the tree currently has the
focus.
XUL Tutorial - Archive of obsolete content
the box model the box model element positioning box model details groupboxes adding more elements more layout elements stacks and decks stack positioning tabboxes grids content panels splitters toolbars and menus toolbars simple menu bars more menu features popup menus scrolling menus events and scripts adding event handlers more event handlers keyboard shortcuts
focus and selection commands updating commands broadcasters and observers document object model document object model modifying a xul interface manipulating lists box objects xpcom interfaces xpcom examples trees trees more tree features tree selection custom tree views tree view details tree box objects rdf and templates introduction to rdf templates trees and templates ...
Urlbar-icons - Archive of obsolete content
(the url bar is also known as the address bar and the navigation bar.) example the default contents of browser.xul: <hbox id="urlbar-icons"> <button be="" chromedir="ltr" class="urlbar-icon" click="" for="" id="safebrowsing-urlbar-icon" img="" level="safe" might="" onclick="godocommand('safebrowsing-show-warning');" page="" style="-moz-user-
focus:" tooltiptext="this" type="menu"> <img class="urlbar-icon" id="star-button" onclick="placesstarbutton.onclick(event);" /> <img address="" chromedir="ltr" class="urlbar-icon" id="go-button" in="" location="" onclick="handleurlbarcommand(event);" p="" the="" to="" tooltiptext="go" /> </button> </hbox> ...
action - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
assign - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
bbox - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
binding - Archive of obsolete content
, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
bindings - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
box - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
broadcaster - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
broadcasterset - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
browser - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupport...
column - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
columns - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
conditions - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
content - Archive of obsolete content
métodos inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
deck - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
dialog - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupport...
dialogheader - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
dropmarker - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
editor - Archive of obsolete content
inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
grid - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
grippy - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
groupbox - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
hbox - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
iframe - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
image - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
listcol - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
listcols - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
member - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
menubar - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
menupopup - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupport...
notification - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupport...
notificationbox - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupport...
observes - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
page - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
param - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
popupset - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
preferences - Archive of obsolete content
inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
prefpane - Archive of obsolete content
inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
progressmeter - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
query - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
queryset - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
resizer - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
row - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
rows - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
rule - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
script - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
scrollbar - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
scrollbox - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
scrollcorner - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
separator - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
spacer - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
spinbuttons - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
splitter - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
stack - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
statusbar - Archive of obsolete content
, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
<statusbarpanel> - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
stringbundle - Archive of obsolete content
inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
stringbundleset - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
tabbrowser - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupport...
tabpanel - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
tabpanels - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
template - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
textnode - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
toolbar - Archive of obsolete content
inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
toolbargrippy - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
toolbaritem - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
toolbarpalette - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
toolbarseparator - Archive of obsolete content
, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
toolbarset - Archive of obsolete content
, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
toolbarspacer - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
toolbarspring - Archive of obsolete content
, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
toolbox - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupport...
tooltip - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupport...
treecell - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
treechildren - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
treecol - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
treecols - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
treeitem - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
treerow - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
treeseparator - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
triple - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
vbox - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
where - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
window - Archive of obsolete content
datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
wizard - Archive of obsolete content
methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupport...
wizardpage - Archive of obsolete content
x, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, tooltip, tooltiptext, top, width methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand,
focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclientrect(), getclientrects(), getelementsbyattribute, getelementsbyattributens, getelementsbyclassname(), getelementsbytagname(), getelementsbytagnamens(), getfeature, getuserdata, hasattribute(), hasattributens(), hasattributes(), haschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenod...
MacFAQ - Archive of obsolete content
s() { var singletonwindowtype = nspreferences.copyunicharpref("toolkit.singletonwindowtype"); var windowmediator = components.classes["@mozilla.org/appshell/window-mediator;1"] .getservice(components.interfaces.nsiwindowmediator); var win = windowmediator.getmostrecentwindow(singletonwindowtype); if (win) { window.close(); win.
focus(); } } if (window.arguments && window.arguments[0]){ try { var cmdline = window.arguments[0] .queryinterface(components.interfaces.nsicommandline); for (var i = 0; i < cmdline.length; ++i) { debug(cmdline.getargument(i)) } } catch(ex) { debug(window.arguments[0]) // do something with window.argu...
XULRunner tips - Archive of obsolete content
("browser.download.manager.showalertoncomplete", true); pref("browser.download.manager.showalertinterval", 2000); pref("browser.download.manager.retention", 2); pref("browser.download.manager.showwhenstarting", true); pref("browser.download.manager.usewindow", true); pref("browser.download.manager.closewhendone", true); pref("browser.download.manager.opendelay", 0); pref("browser.download.manager.
focuswhenstarting", false); pref("browser.download.manager.flashcount", 2); // pref("alerts.slideincrement", 1); pref("alerts.slideincrementtime", 10); pref("alerts.totalopentime", 4000); pref("alerts.height", 50); if you are missing preferences that a dialog requires, you will get the following errors: component returned failure code: 0x8000ffff (ns_error_unexpected) [nsiprefbranch.getboolpref] er...
2006-10-06 - Archive of obsolete content
discussions none for this week meetings community test day - on friday october 6th, 2006 in irc chat room #testday there will be a test day
focusing on safe browsing between 7am to 5pm pdt.
2006-11-03 - Archive of obsolete content
discussions none meetings community test day - on friday, november 3, 2006 another community test day
focusing on security and stability release, and you can help by verifying bugs, and by running the litmus test cases under the ffts or the bfts.