Search completed in 3.50 seconds.
760 results for "offset":
Your results are loading. Please wait...
XRReferenceSpace.getOffsetReferenceSpace() - Web APIs
the xrreferencespace interface's getoffsetreferencespace() method returns a new reference space object which describes the relative difference in position between the object on which the method is called and a given point in 3d space.
... the object returned by getoffsetreferencespace() is an xrreferencespace if called on an xrreferencespace, or an xrboundedreferencespace if called on an object of that type.
... in other words, when you have an object in 3d space and need to position another object relative to that one, you can call getoffsetreferencespace(), passing into it the position and orientation you want the second object to have relative to the position and orientation of the object on which you call getoffsetreferencespace().
...And 11 more matches
text-underline-offset - CSS: Cascading Style Sheets
the text-underline-offset css property sets the offset distance of an underline text decoration line (applied using text-decoration) from its original position.
... text-underline-offset is not part of the text-decoration shorthand.
... while an element can have multiple text-decoration lines, text-underline-offset only impacts underlining, and not other possible line decoration options such as overline or line-through.
...And 8 more matches
Window.pageYOffset - Web APIs
the read-only window property pageyoffset is an alias for scrolly; as such, it returns the number of pixels the document is currently scrolled along the vertical axis (that is, up or down) with a value of 0.0, indicating that the top edge of the document is currently aligned with the top edge of the window's content area.
... there is slightly better support for pageyoffset than for scrolly in older browsers, but if you're not concerned about browsers more than a handful of years old, you can use either one.
... the corresponding pagexoffset property, which returns the number of pixels scrolled along the horizontal axis (left and right), is an alias for scrollx.
...And 7 more matches
offset-path - CSS: Cascading Style Sheets
the offset-path css property specifies a motion path for an element to follow and defines the element's positioning within the parent container or svg coordinate system.
... syntax /* default */ offset-path: none; /* function values */ offset-path: ray(45deg closest-side contain); /* url */ offset-path: url(#path); /* shapes */ offset-path: circle(50% at 25% 25%); offset-path: inset(50% 50% 50% 50%); offset-path: polygon(30% 0%, 70% 0%, 100% 50%, 30% 100%, 0% 70%, 0% 30%); offset-path: path('m 0,200 q 200,200 260,80 q 290,20 400,0 q 300,100 400,200'); /* geometry boxes */ offset-path: margin-box; offset-path: stroke-box; /* global values */ offset-path: inherit; offset-path: initial; offset-path: unset; values ray() taking up to three values, defines a path that is a line segment starting from the position of the box and proceeds in the direction defined by the specified angle similar to the css gradient angle where 0deg is up, with positive angles i...
...an offset path is either a specified path with one or multiple sub-paths or the geometry of a not-styled basic shape.
...And 7 more matches
WebGLRenderingContext.polygonOffset() - Web APIs
the webglrenderingcontext.polygonoffset() method of the webgl api specifies the scale factors and units to calculate depth values.
... the offset is added before the depth test is performed and before the value is written into the depth buffer.
... syntax void gl.polygonoffset(factor, units); parameters factor a glfloat which sets the scale factor for the variable depth offset for each polygon.
...And 6 more matches
offset-anchor - CSS: Cascading Style Sheets
the offset-anchor css property specifies the point inside the box of an element travelling along an offset-path that is actually moving along the path.
... syntax /* keyword values */ offset-anchor: top; offset-anchor: bottom; offset-anchor: left; offset-anchor: right; offset-anchor: center; offset-anchor: auto; /* <percentage> values */ offset-anchor: 25% 75%; /* <length> values */ offset-anchor: 0 0; offset-anchor: 1cm 2cm; offset-anchor: 10ch 8em; /* edge offsets values */ offset-anchor: bottom 10px right 20px; offset-anchor: right 3em bottom 10px; /* global values */ offset-anchor: inherit; offset-anchor: initial; offset-anchor: unset; values auto offset-anchor is given the same value as the element's transform-origin, unless offset-path is none, in which case it takes its value from offset-position.
...| [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ] ]where <length-percentage> = <length> | <percentage> examples setting various offset-anchor values in the following example, we have three <div> elements nested in <section> elements.
...And 6 more matches
CanvasRenderingContext2D.lineDashOffset - Web APIs
the canvasrenderingcontext2d.linedashoffset property of the canvas 2d api sets the line dash offset, or "phase." note: lines are drawn by calling the stroke() method.
... syntax ctx.linedashoffset = value; value a float specifying the amount of the line dash offset.
... examples offsetting a line dash this example draws two dashed lines.
...And 5 more matches
HTMLElement.offsetHeight - Web APIs
the htmlelement.offsetheight read-only property returns the height of an element, including vertical padding and borders, as an integer.
... typically, offsetheight is a measurement in pixels of the element's css height, including any borders, padding, and horizontal scrollbars (if rendered).
... syntax var intelemoffsetheight = element.offsetheight; intelemoffsetheight is a variable storing an integer corresponding to the offsetheight pixel value of the element.
...And 5 more matches
ConstantSourceNode.offset - Web APIs
the read-only offset property of the constantsourcenode interface returns a audioparam object indicating the numeric a-rate value which is always returned by the source when asked for the next sample.
... while the audioparam named offset is read-only, the value property within is not.
... so you can change the value of offset by setting the value of constantsourcenode.offset.value: myconstantsourcenode.offset.value = newvalue; syntax let offsetparameter = constantaudionode.offset; let offset = constantsourcenode.offset.value; constantsourcenode.offset.value = newvalue; value an audioparam object indicating the a-rate value returned for every sample by this node.
...And 4 more matches
HTMLElement.offsetLeft - Web APIs
the htmlelement.offsetleft read-only property returns the number of pixels that the upper left corner of the current element is offset to the left within the htmlelement.offsetparent node.
... for block-level elements, offsettop, offsetleft, offsetwidth, and offsetheight describe the border box of an element relative to the offsetparent.
... however, for inline-level elements (such as span) that can wrap from one line to the next, offsettop and offsetleft describe the positions of the first border box (use element.getclientrects() to get its width and height), while offsetwidth and offsetheight describe the dimensions of the bounding border box (use element.getboundingclientrect() to get its position).
...And 4 more matches
SVGFEOffsetElement - Web APIs
the svgfeoffsetelement interface corresponds to the <feoffset> element.
...aco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgfeoffsetelement" target="_top"><rect x="301" y="65" width="180" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="391" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgfeoffsetelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this int...
... svgfeoffsetelement.in1 read only an svganimatedstring corresponding to the in attribute of the given element.
...And 4 more matches
offset - CSS: Cascading Style Sheets
WebCSSoffset
the offset css shorthand property sets all the properties required for animating an element along a defined path.
... constituent properties this property is a shorthand for the following css properties: offset-anchor offset-distance offset-path offset-position offset-rotate syntax /* offset position */ offset: auto; offset: 10px 30px; offset: none; /* offset path */ offset: ray(45deg closest-side); offset: path('m 100 100 l 300 100 l 200 300 z'); offset: url(arc.svg); /* offset path with distance and/or rotation */ offset: url(circle.svg) 100px; offset: url(circle.svg) 40%; offset: url(circle.svg) 30deg; offset: url(circle.svg) 50px 20deg; /* including offset anchor */ offset: ray(45deg closest-side) / 40px 20px; offset: url(arc.svg) 2cm / 0.5cm 3cm; offset: url(arc.svg) 30deg / 50px 100px; formal definition initial valueas eac...
...h of the properties of the shorthand:offset-position: autooffset-path: noneoffset-distance: 0offset-anchor: autooffset-rotate: autoapplies totransformable elementsinheritednopercentagesas each of the properties of the shorthand:offset-position: refertosizeofcontainingblockoffset-distance: refer to the total path lengthoffset-anchor: relativetowidthandheightcomputed valueas each of the properties of the shorthand:offset-position: for <length> the absolute value, otherwise a percentageoffset-path: as specifiedoffset-distance: for <length> the absolute value, otherwise a percentageoffset-anchor: for <length> the absolute value, otherwise a percentageoffset-rotate: as specifiedanimation typeas each of the properties of the shorthand:offset-position: a positionoffset-path: as <angle>, <basic-shape> o...
...And 4 more matches
Date.prototype.getTimezoneOffset() - JavaScript
the gettimezoneoffset() method returns the time zone difference, in minutes, from current locale (host system settings) to utc.
... syntax dateobj.gettimezoneoffset() return value a number representing the time-zone offset, in minutes, from the date based on current host system settings to utc.
... description the time-zone offset is the difference, in minutes, from local time to utc.
...And 4 more matches
stroke-dashoffset - SVG: Scalable Vector Graphics
the stroke-dashoffset attribute is a presentation attribute defining an offset on the rendering of the associated dash array.
... note: as a presentation attribute stroke-dashoffset can be used as a css property.
...an be applied to any element but it has effect only on the following twelve elements: <altglyph>, <circle>, <ellipse>, <path>, <line>, <polygon>, <polyline>, <rect>, <text>, <textpath>, <tref>, and <tspan> html,body,svg { height:100% } <svg viewbox="-3 0 33 10" xmlns="http://www.w3.org/2000/svg"> <!-- no dash array --> <line x1="0" y1="1" x2="30" y2="1" stroke="black" /> <!-- no dash offset --> <line x1="0" y1="3" x2="30" y2="3" stroke="black" stroke-dasharray="3 1" /> <!-- the start of the dash array computation is pulled by 3 user units --> <line x1="0" y1="5" x2="30" y2="5" stroke="black" stroke-dasharray="3 1" stroke-dashoffset="3" /> <!-- the start of the dash array computation is pushed by 3 user units --> <line x1="0" y1="7" x...
...And 4 more matches
CanvasRenderingContext2D.shadowOffsetX - Web APIs
the canvasrenderingcontext2d.shadowoffsetx property of the canvas 2d api specifies the distance that shadows will be offset horizontally.
...one of the shadowblur, shadowoffsetx, or shadowoffsety properties must be non-zero, as well.
... syntax ctx.shadowoffsetx = offset; offset a float specifying the distance that shadows will be offset horizontally.
...And 3 more matches
CanvasRenderingContext2D.shadowOffsetY - Web APIs
the canvasrenderingcontext2d.shadowoffsety property of the canvas 2d api specifies the distance that shadows will be offset vertically.
...one of the shadowblur, shadowoffsetx, or shadowoffsety properties must be non-zero, as well.
... syntax ctx.shadowoffsety = offset; offset a float specifying the distance that shadows will be offset vertically.
...And 3 more matches
HTMLElement.offsetParent - Web APIs
the htmlelement.offsetparent read-only property returns a reference to the element which is the closest (nearest in the containment hierarchy) positioned ancestor element.
... note: offsetparent returns null in the following situations: the element or its parent element has the display property set to none.
... offsetparent is useful because offsettop and offsetleft are relative to its padding edge.
...And 3 more matches
HTMLElement.offsetWidth - Web APIs
the htmlelement.offsetwidth read-only property returns the layout width of an element as an integer.
... typically, offsetwidth is a measurement in pixels of the element's css width, including any borders, padding, and vertical scrollbars (if rendered).
... syntax var intelemoffsetwidth = element.offsetwidth; intelemoffsetwidth is a variable storing an integer corresponding to the offsetwidth pixel value of the element.
...And 3 more matches
Range.endOffset - Web APIs
WebAPIRangeendOffset
the range.endoffset read-only property returns a number representing where in the range.endcontainer the range ends.
... if the endcontainer is a node of type text, comment, or cdatasection, then the offset is the number of characters from the start of the endcontainer to the boundary point of the range.
... for other node types, the endoffset is the number of child nodes between the start of the endcontainer and the boundary point of the range.
...And 3 more matches
Range.startOffset - Web APIs
WebAPIRangestartOffset
the range.startoffset read-only property returns a number representing where in the startcontainer the range starts.
... if the startcontainer is a node of type text, comment, or cdatasection, then the offset is the number of characters from the start of the startcontainer to the boundary point of the range.
... for other node types, the startoffset is the number of child nodes between the start of the startcontainer and the boundary point of the range.
...And 3 more matches
offset-distance - CSS: Cascading Style Sheets
the offset-distance css property specifies a position along an offset-path for an element to be placed.
... syntax /* default value */ offset-distance: 0; /* the middle of the offset-path */ offset-distance: 50%; /* a fixed length positioned along the path */ offset-distance: 40px; <length-percentage> a length that specifies how far the element is along the path (defined with offset-path).
... 100% represents the total length of the path (when the offset-path is defined as a basic shape or path()).
...And 3 more matches
startOffset - SVG: Scalable Vector Graphics
the startoffset attribute defines an offset from the start of the path for the initial current text position along the path after converting the path to the <textpath> element's coordinate system.
...vg { height:100% } <svg viewbox="0 0 220 100" xmlns="http://www.w3.org/2000/svg"> <path id="path1" fill="none" stroke="red" d="m10,90 q90,90 90,45 q90,10 50,10 q10,10 10,40 q10,70 45,70 q70,70 75,50" /> <path id="path2" fill="none" stroke="red" d="m130,90 q210,90 210,45 q210,10 170,10 q130,10 130,40 q130,70 165,70 q190,70 195,50" /> <text> <textpath href="#path1" startoffset="0"> quick brown fox jumps over the lazy dog.
... </textpath> </text> <text> <textpath href="#path2" startoffset="40"> quick brown fox jumps over the lazy dog.
...And 3 more matches
offset-position - CSS: Cascading Style Sheets
the offset-position css property defines the initial position of the offset-path.
... syntax /* keyword values */ offset-position: auto; offset-position: top; offset-position: bottom; offset-position: left; offset-position: right; offset-position: center; /* <percentage> values */ offset-position: 25% 75%; /* <length> values */ offset-position: 0 0; offset-position: 1cm 2cm; offset-position: 10ch 8em; /* edge offsets values */ offset-position: bottom 10px right 20px; offset-position: right 3em bottom 10px; offset-position: bottom 10px right; offset-position: top right 10px; /* global values */ offset-position: inherit; offset-position: initial; offset-position: unset; values auto the initial position is the position of the box specified by the position property.
...if three or four values are used, the length-percentage values are offsets for the preceding keyword value(s).
...And 2 more matches
<feOffset> - SVG: Scalable Vector Graphics
WebSVGElementfeOffset
the <feoffset> svg filter primitive allows to offset the input image.
... the input image as a whole is offset by the values specified in the dx and dy attributes.
... usage context categoriesfilter primitive elementpermitted contentany number of the following elements, in any order:<animate>, <set> attributes global attributes core attributes presentation attributes filter primitive attributes class style specific attributes in dx dy dom interface this element implements the svgfeoffsetelement interface.
...And 2 more matches
AbstractRange.endOffset - Web APIs
the endoffset property of the abstractrange interface returns the offset into the end node of the range's end position.
... syntax var endoffset = range.endoffset; value an integer value indicating the number of characters into the node indicated by endcontainer at which the final character of the range is located.
... specifications specification status comment domthe definition of 'endoffset' in that specification.
... living standard static rangethe definition of 'endoffset' in that specification.
AbstractRange.startOffset - Web APIs
the read-only startoffset property of the abstractrange interface returns the offset into the start node of the range's start position.
... syntax var startoffset = range.startoffset value an integer value indicating the number of characters into the node indicated by startcontainer at which the first character of the range is located.
... specifications specification status comment domthe definition of 'startoffset' in that specification.
... living standard static rangethe definition of 'startoffset' in that specification.
HTMLElement.offsetTop - Web APIs
the htmlelement.offsettop read-only property returns the distance of the current element relative to the top of the offsetparent node.
... syntax toppos = element.offsettop; parameters toppos is the number of pixels from the top of the closest relatively positioned parent element.
... example var d = document.getelementbyid("div1"); var toppos = d.offsettop; if (toppos > 10) { // object is offset more // than 10 pixels from its parent } specification specification status comment css object model (cssom) view modulethe definition of 'offsettop' in that specification.
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetoffsettopchrome full support 1edge full support 12firefox full support 1ie full support 8opera full support 8safari full support 3webvie...
MediaSessionActionDetails.seekOffset - Web APIs
the mediasessionactiondetails dictionary's seekoffset property is an optional value passed into the action handler callback to provide the number of seconds the seekforward and seekbackward actions should move the playback time by.
... syntax let mediasessionactiondetails = { seekoffset: deltatimeinseconds }; let deltatime = mediasessionactiondetails.seekoffset; value a floating-point value indicating the time delta in seconds by which to move the playback position relative to its current timestamp.
... if the offset isn't specified, the user agent will choose an appropriate offset automatically.
... specifications specification status comment media session standardthe definition of 'mediasessionactiondetails.seekoffset' in that specification.
SourceBuffer.timestampOffset - Web APIs
the timestampoffset property of the sourcebuffer interface controls the offset applied to timestamps inside media segments that are appended to the sourcebuffer.
... the initial value of timestampoffset is 0.
... syntax var myoffset = sourcebuffer.timestampoffset; sourcebuffer.timestampoffset = 2.5; value a double, with the offset amount expressed in seconds.
... example tbd specifications specification status comment media source extensionsthe definition of 'timestampoffset' in that specification.
StaticRange.endOffset - Web APIs
the endoffset property of the staticrange interface returns the offset into the end node of the range's end position.
... syntax var endoffset = staticrange.endoffset value an integer value indicating the number of characters into the node indicated by endcontainer at which the final character of the range is located.
... specifications specification status comment domthe definition of 'endoffset' in that specification.
... living standard static rangethe definition of 'endoffset' in that specification.
StaticRange.startOffset - Web APIs
the read-only startoffset property of the staticrange interface returns the offset into the start node of the range's start position.
... syntax var startoffset = staticrange.startoffset value an integer value indicating the number of characters into the node indicated by startcontainer at which the first character of the range is located.
... specifications specification status comment domthe definition of 'startoffset' in that specification.
... living standard static rangethe definition of 'startoffset' in that specification.
offset-rotate - CSS: Cascading Style Sheets
the offset-rotate css property defines the orientation/direction of the element as it is positioned along the offset-path.
... syntax /* follow the path direction, with optional additional angle */ offset-rotate: auto; offset-rotate: auto 45deg; /* follow the path direction but facing the opposite direction of `auto` */ offset-rotate: reverse; /* keep a constant rotation regardless the position on the path */ offset-rotate: 90deg; offset-rotate: .5turn; auto the element is rotated by the angle of the direction of the offset-path, relative to the positive x-axis.
... formal definition initial valueautoapplies totransformable elementsinheritednocomputed valueas specifiedanimation typeas <angle>, <basic-shape> or <path()> formal syntax [ auto | reverse ] | <angle> examples setting element orientation along its offset path html <div></div> <div></div> <div></div> css div { width: 40px; height: 40px; background: #2bc4a2; margin: 20px; clip-path: polygon(0% 0%, 70% 0%, 100% 50%, 70% 100%, 0% 100%, 30% 50%); animation: move 5000ms infinite alternate ease-in-out; offset-path: path('m20,20 c20,50 180,-10 180,20'); } div:nth-child(1) { offset-rotate: auto; } div:nth-child(2) { offset-rotate: a...
...uto 90deg; } div:nth-child(3) { offset-rotate: 30deg; } @keyframes move { 100% { offset-distance: 100%; } } result specifications specification status comment motion path module level 1the definition of 'offset-rotate' in that specification.
outline-offset - CSS: Cascading Style Sheets
the outline-offset css property sets the amount of space between an outline and the edge or border of an element.
... syntax /* <length> values */ outline-offset: 3px; outline-offset: 0.2em; /* global values */ outline-offset: inherit; outline-offset: initial; outline-offset: unset; values <length> the width of the space between the element and its outline.
... formal definition initial value0applies toall elementsinheritednocomputed valueas specified, but with relative lengths converted into absolute lengthsanimation typea length formal syntax <length> examples setting outline offset in pixels html <p>gallia est omnis divisa in partes tres.</p> css p { outline: 1px dashed red; outline-offset: 10px; background: yellow; border: 1px solid blue; margin: 15px; } result specifications specification status comment css basic user interface module level 3the definition of 'outline-offset' in that specification.
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetoutline-offsetchrome full support 1edge full support 15firefox full support 1.5ie no support noopera full support 9.5safari full support 1.2webv...
VisualViewport.offsetTop - Web APIs
the offsettop read-only property of the visualviewport interface returns the offset of the top edge of the visual viewport from the top edge of the layout viewport in css pixels.
... syntax var offsettop = visualviewport.offsettop value a double.
... specifications specification status comment visual viewport apithe definition of 'offsettop' in that specification.
VisualViewport.offsetleft - Web APIs
the offsetleft read-only property of the visualviewport interface returns the offset of the left edge of the visual viewport from the left edge of the layout viewport in css pixels.
... syntax var offsetleft = visualviewport.offsetleft value a double.
... specifications specification status comment visual viewport apithe definition of 'offsetleft' in that specification.
WebGLRenderingContext.getVertexAttribOffset() - Web APIs
the webglrenderingcontext.getvertexattriboffset() method of the webgl api returns the address of a specified vertex attribute.
... syntax glintptr gl.getvertexattriboffset(index, pname); parameters index a gluint specifying the index of the vertex attribute.
... examples gl.getvertexattriboffset(i, gl.vertex_attrib_array_pointer); specifications specification status comment webgl 1.0the definition of 'getvertexattriboffset' in that specification.
DataView.prototype.byteOffset - JavaScript
the byteoffset accessor property represents the offset (in bytes) of this view from the start of its arraybuffer or sharedarraybuffer.
... description the byteoffset property is an accessor property whose set accessor function is undefined, meaning that you can only read this property.
... examples using the byteoffset property var buffer = new arraybuffer(8); var dataview = new dataview(buffer); dataview.byteoffset; // 0 (no offset specified) var dataview2 = new dataview(buffer, 3); dataview2.byteoffset; // 3 (as specified when constructing the dataview) specifications specification ecmascript (ecma-262)the definition of 'dataview.prototype.byteoffset' in that specification.
TypedArray.prototype.byteOffset - JavaScript
the byteoffset accessor property represents the offset (in bytes) of a typed array from the start of its arraybuffer.
... description the byteoffset property is an accessor property whose set accessor function is undefined, meaning that you can only read this property.
... examples using the byteoffset property var buffer = new arraybuffer(8); var uint8 = new uint8array(buffer); uint8.byteoffset; // 0 (no offset specified) var uint8 = new uint8array(buffer, 3); uint8.byteoffset; // 3 (as specified when constructing uint8array) specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.byteoffset' in that specification.
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.
MouseEvent.offsetX - Web APIs
the offsetx read-only property of the mouseevent interface provides the offset in the x coordinate of the mouse pointer between that event and the padding edge of the target node.
... syntax var xoffset = instanceofmouseevent.offsetx; return value a double floating point value.
MouseEvent.offsetY - Web APIs
the offsety read-only property of the mouseevent interface provides the offset in the y coordinate of the mouse pointer between that event and the padding edge of the target node.
... syntax var yoffset = instanceofmouseevent.offsety; return value a double floating point value.
Selection.anchorOffset - Web APIs
the selection.anchoroffset read-only property returns the number of characters that the selection's anchor is offset within the selection.anchornode.
... syntax number = sel.anchoroffset specifications specification status comment selection apithe definition of 'selection.anchoroffset' in that specification.
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.
... syntax offset = sel.focusoffset specifications specification status comment selection apithe definition of 'selection.focusoffset' in that specification.
Window.pageXOffset - Web APIs
the read-only window property pagexoffset is an alias for scrollx.
... specification specification status comment css object model (cssom) view modulethe definition of 'window.pagexoffset' in that specification.
IAccessibleText
other-licenses/ia2/accessibletext.idlnot scriptable a structure containing a substring and the start and end offsets in the enclosing string.
...this enum is used in textbeforeoffset(), textatoffset(), and textafteroffset().
... method overview hresult addselection([in] long startoffset, [in] long endoffset ); [propget] hresult attributes([in] long offset, [out] long startoffset, [out] long endoffset, [out] bstr textattributes ); [propget] hresult caretoffset([out] long offset ); [propget] hresult characterextents([in] long offset, [in] enum ia2coordinatetype coordtype, [out] long x, [out] long y, [out] long width, [out] long height ); [propget] hresult ncharacters([out] long ncharacters ); [propget] hresult newtext([out] ia2textsegment newtext ); [propget] hresult nselections([out] long nselections ); [propget] hresult offsetatpoint([in] long x, [in] long y, [in] enum ia2coordinatetype coordtype, [out] long offset ); [propget] hresult oldtext([out] ia2textsegment oldtext ); hresult removeselection...
...And 52 more matches
Index - Web APIs
WebAPIIndex
19 abstractrange.endoffset api, abstractrange, dom, dom api, end, property, range, read-only, reference, endoffset, offset the endoffset property of the abstractrange interface returns the offset into the end node of the range's end position.
... 21 abstractrange.startoffset api, abstractrange, dom, dom api, property, range, read-only, reference, offset, startoffset the read-only startoffset property of the abstractrange interface returns the offset into the start node of the range's start position.
... 117 audiobuffersourcenode.loopend api, audio, audiobuffersourcenode, media, property, reference, web audio api, loopend, sound a floating-point number indicating the offset, in seconds, into the audio buffer at which each loop will loop return to the beginning of the loop (that is, the current play time gets reset to audiobuffersourcenode.loopstart).
...And 51 more matches
StringView - Archive of obsolete content
|*| http://www.gnu.org/licenses/lgpl-3.0.html |*| \*/ function stringview (vinput, sencoding /* optional (default: utf-8) */, noffset /* optional */, nlength /* optional */) { var ftaview, awhole, araw, fputoutptcode, fgetoutptchrsize, ninptlen, nstartidx = isfinite(noffset) ?
... noffset : 0, ntranscrtype = 15; if (sencoding) { this.encoding = sencoding.tostring(); } encswitch: switch (this.encoding) { case "utf-8": fputoutptcode = stringview.pututf8charcode; fgetoutptchrsize = stringview.getutf8charlength; ftaview = uint8array; break encswitch; case "utf-16": fputoutptcode = stringview.pututf16charcode; fgetoutptchrsize = stringview.getutf16charlength; ftaview = uint16array; break encswitch; case "utf-32": ftaview = uint32array; ntranscrtype &= 14; break encswitch; default: /* case "ascii", or case "binarystring" or unknown cases */ ftaview = uint8array; ntranscrtype &= 14; } typeswitch: switch (typeof vinput) { case "string": /* the input argument i...
...*/ ftaview = vinput.constructor; ninptlen = vinput.length; awhole = vinput.byteoffset === 0 && vinput.length === ( ftaview === uint32array ?
...And 47 more matches
nsIDOMWindowUtils
tivekeyevent(in long anativekeyboardlayout, in long anativekeycode, in long amodifierflags, in astring acharacters, in astring aunmodifiedcharacters); void sendnativemouseevent(in long ascreenx, in long ascreeny, in long anativemessage, in long amodifierflags, in nsidomelement aelement); nsiquerycontenteventresult sendquerycontentevent(in unsigned long atype, in unsigned long aoffset, in unsigned long alength, in long ax, in long ay); obsolete since gecko 31.0 nsiquerycontenteventresult sendquerycontentevent(in unsigned long atype, in unsigned long aoffset, in unsigned long alength, in long ax, in long ay, [optional] in unsigned long aadditionalflags); boolean sendselectionsetevent(in unsigned long aoffset, in unsigned long alength, in boolean areverse); ...
...obsolete since gecko 31.0 boolean sendselectionsetevent(in unsigned long aoffset, in unsigned long alength, [optional] in unsigned long aadditionalflags); void sendsimplegestureevent(in astring atype, in float ax, in float ay, in unsigned long adirection, in double adelta, in long amodifiers); void sendtextevent(in astring acompositionstring, in long afirstclauselength, in unsigned long afirstclauseattr, in long asecondclauselength, in unsigned long asecondclauseattr, in long athirdclauselength, in unsigned long athirdclauseattr, in long acaretstart, in long acaretlength); obsolete since gecko 26 boolean sendtouchevent(in astring atype, [array, size_is(count)] in pruint32 aidentifiers, [array, size_is(count)] in print32 axs, [array, size_is(count)] in print3...
...when this is set (or not set query_content_flag_use_xp_line_break), the aoffset and alength are offset and length in/of the content generated with native line breaks (e.g., "\r\n" on windows).
...And 28 more matches
source-editor.jsm
r); number getlinestart(number alineindex); string getmode(); string gettext([optional] number astart, [optional] number aend); string getselectedtext(); void setmode(string amode); void settext(string atext, [optional] number astart, [optional] number aend); selection operations void dropselection(); number getcaretoffset(); object getcaretposition(); object getselection(); void setcaretoffset(number aoffset); void setcaretposition(number aline, [optional] number acolumn, [optional] number aalign); void setselection(number astart, number aend); breakpoint management void addbreakpoint(number alineindex, [optional] string acondition); array get...
... return value returns an integer indicating the offset into the text at which the first character of the found string is located, or -1 if the string wasn't found.
... start number an integer value indicating the offset into the text at which to begin the find operation.
...And 27 more matches
nsIAccessibleText
inherits from: nsisupports last changed in gecko 1.9.1 (firefox 3.5 / thunderbird 3.0 / seamonkey 2.0) method overview void addselection(in long startoffset, in long endoffset); nsiaccessible getattributerange(in long offset, out long rangestartoffset, out long rangeendoffset); obsolete since gecko 1.9.1 wchar getcharacteratoffset(in long offset); void getcharacterextents(in long offset, out long x, out long y, out long width, out long height, in unsigned long coordtype); long getoffsetatpoint(in long x, in long y, in unsigned long coordtype); void getrangeextents(in long startoffset, in long endoffset, out long x, out long y, out long width, out long height, in unsigned long coord...
...type); void getselectionbounds(in long selectionnum, out long startoffset, out long endoffset); astring gettext(in long startoffset, in long endoffset); astring gettextafteroffset(in long offset, in nsaccessibletextboundary boundarytype, out long startoffset, out long endoffset); astring gettextatoffset(in long offset, in nsaccessibletextboundary boundarytype, out long startoffset, out long endoffset); nsipersistentproperties gettextattributes(in boolean includedefattrs, in long offset, out long rangestartoffset, out long rangeendoffset); astring gettextbeforeoffset(in long offset, in nsaccessibletextboundary boundarytype, out long startoffset, out long endoffset); void removeselection(in long selectionnum); void scrollsubstringto(in long startindex, in long endindex, in unsign...
...ed long scrolltype); void scrollsubstringtopoint(in long startindex, in long endindex, in unsigned long coordinatetype, in long x, in long y); void setselectionbounds(in long selectionnum, in long startoffset, in long endoffset); attributes attribute type description caretoffset long the current current caret offset.
...And 26 more matches
Bytecode Descriptions
the sourcestart/sourceend offsets are the start/end offsets of the class definition in the source buffer, used for tostring().
... they must be valid offsets into the source buffer, measured in code units, such that scriptsource->substring(cx, start, end) is valid.
... jumps goto operands: (int32_t offset) jump to a 32-bit offset from the current bytecode.
...And 24 more matches
DataView - JavaScript
function getuint64(dataview, byteoffset, littleendian) { // split 64-bit number into two 32-bit (4-byte) parts const left = dataview.getuint32(byteoffset, littleendian); const right = dataview.getuint32(byteoffset+4, littleendian); // combine the two 32-bit values const combined = littleendian?
... const bigint = window.bigint, bigthirtytwo = bigint(32), bigzero = bigint(0); function getuint64bigint(dataview, byteoffset, littleendian) { // split 64-bit number into two 32-bit (4-byte) parts const left = bigint(dataview.getuint32(byteoffset|0, !!littleendian)>>>0); const right = bigint(dataview.getuint32((byteoffset|0) + 4|0, !!littleendian)>>>0); // combine the two 32-bit values and return return littleendian ?
... dataview.prototype.byteoffset the offset (in bytes) of this view from the start of its arraybuffer.
...And 20 more matches
Debugger.Script - Firefox Developer Tools
getalloffsets() if the instance refers to a jsscript, return an arrayl describing the relationship between bytecode instruction offsets and source code positions in this script.l is sparse, and indexed by source line number.
...if there is code forline, then l[line] is an array of offsets of byte code instructions that are entry points to that line.
... a[i] = i*i; calling getalloffsets() on that code might yield an array like this: [[0], [5, 20], , [10]] this array indicates that: the first line’s code starts at offset 0 in the script; the for statement head has two entry points at offsets 5 and 20 (for the initialization, which is performed only once, and the loop test, which is performed at the start of each iteration); the third line has no code; and the fourth line begins at offset 10.
...And 19 more matches
Space Manager Detailed Design - Archive of obsolete content
* * @return pr_true if there are bands and pr_false if there are no bands */ prbool ymost(nscoord& aymost) const; /** * returns a band starting at the specified y-offset.
... * * the local coordinate space origin, the y-offset, and the max size * describe a rectangle that's used to clip the underlying band of * available space, i.e.
... * {0, ayoffset, amaxsize.width, amaxsize.height} in the local * coordinate space * * @param ayoffset the y-offset of where the band begins.
...And 16 more matches
NS ConvertASCIItoUTF16 external
@return the offset of astr, or -1 if not found parameters nsastring& astr print32 (*)(prunichar*, prunichar*, pruint32) c print32 find(const nsastring&, pruint32, print32 (*)(const prunichar*, const prunichar*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsastring& astr pruint32 aoffset print32 (*)(prunichar*, prunichar*, pruint32) c print32 find(const char*, prbool) const - source find an ascii string within this string.
... @return the offset of astr, or -1 if not found.
...And 16 more matches
NS ConvertUTF8toUTF16 external
@return the offset of astr, or -1 if not found parameters nsastring& astr print32 (*)(prunichar*, prunichar*, pruint32) c print32 find(const nsastring&, pruint32, print32 (*)(const prunichar*, const prunichar*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsastring& astr pruint32 aoffset print32 (*)(prunichar*, prunichar*, pruint32) c print32 find(const char*, prbool) const - source find an ascii string within this string.
... @return the offset of astr, or -1 if not found.
...And 16 more matches
PromiseFlatString (External)
@return the offset of astr, or -1 if not found parameters nsastring& astr print32 (*)(prunichar*, prunichar*, pruint32) c print32 find(const nsastring&, pruint32, print32 (*)(const prunichar*, const prunichar*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsastring& astr pruint32 aoffset print32 (*)(prunichar*, prunichar*, pruint32) c print32 find(const char*, prbool) const - source find an ascii string within this string.
... @return the offset of astr, or -1 if not found.
...And 16 more matches
nsAString (External)
@return the offset of astr, or -1 if not found parameters nsastring& astr print32 (*)(prunichar*, prunichar*, pruint32) c print32 find(const nsastring&, pruint32, print32 (*)(const prunichar*, const prunichar*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsastring& astr pruint32 aoffset print32 (*)(prunichar*, prunichar*, pruint32) c print32 find(const char*, prbool) const - source find an ascii string within this string.
... @return the offset of astr, or -1 if not found.
...And 16 more matches
nsAutoString (External)
@return the offset of astr, or -1 if not found parameters nsastring& astr print32 (*)(prunichar*, prunichar*, pruint32) c print32 find(const nsastring&, pruint32, print32 (*)(const prunichar*, const prunichar*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsastring& astr pruint32 aoffset print32 (*)(prunichar*, prunichar*, pruint32) c print32 find(const char*, prbool) const - source find an ascii string within this string.
... @return the offset of astr, or -1 if not found.
...And 16 more matches
nsDependentString external
@return the offset of astr, or -1 if not found parameters nsastring& astr print32 (*)(prunichar*, prunichar*, pruint32) c print32 find(const nsastring&, pruint32, print32 (*)(const prunichar*, const prunichar*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsastring& astr pruint32 aoffset print32 (*)(prunichar*, prunichar*, pruint32) c print32 find(const char*, prbool) const - source find an ascii string within this string.
... @return the offset of astr, or -1 if not found.
...And 16 more matches
nsDependentSubstring external
@return the offset of astr, or -1 if not found parameters nsastring astr print32* c find(const nsastring&, pruint32, print32 (*) print32 find(const nsastring&, pruint32, print32 (*)(const prunichar*, const prunichar*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsastring astr pruint32 aoffset print32* c find print32 find(const char*, prbool) const - source find an ascii string within this string.
... @return the offset of astr, or -1 if not found.
...And 16 more matches
nsStringContainer (External)
@return the offset of astr, or -1 if not found parameters nsastring& astr print32 (*)(prunichar*, prunichar*, pruint32) c print32 find(const nsastring&, pruint32, print32 (*)(const prunichar*, const prunichar*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsastring& astr pruint32 aoffset print32 (*)(prunichar*, prunichar*, pruint32) c print32 find(const char*, prbool) const - source find an ascii string within this string.
... @return the offset of astr, or -1 if not found.
...And 16 more matches
nsString external
@return the offset of astr, or -1 if not found parameters nsastring& astr print32 (*)(prunichar*, prunichar*, pruint32) c print32 find(const nsastring&, pruint32, print32 (*)(const prunichar*, const prunichar*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsastring& astr pruint32 aoffset print32 (*)(prunichar*, prunichar*, pruint32) c print32 find(const char*, prbool) const - source find an ascii string within this string.
... @return the offset of astr, or -1 if not found.
...And 16 more matches
NS ConvertUTF16toUTF8 external
@return the offset of astr, or -1 if not found parameters nsacstring& astr print32 (*)(char*, char*, pruint32) c print32 find(const nsacstring&, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsacstring& astr pruint32 aoffset print32 (*)(char*, char*, pruint32) c print32 find(const char*, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string.
... @return the offset of astr, or -1 if not found parameters char* astr print32 (*)(char*, char*, pruint32) c print32 find(const char*, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source parameters char* astr pruint32 alen print32 (*)(char*, char*, pruint32) c rfind print32 rfind(const nsacstring&, print32 (*)(const char*, const char*, pruint32)) const - source find the last occurrence of astr in this string.
...And 13 more matches
NS LossyConvertUTF16toASCII external
@return the offset of astr, or -1 if not found parameters nsacstring& astr print32 (*)(char*, char*, pruint32) c print32 find(const nsacstring&, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsacstring& astr pruint32 aoffset print32 (*)(char*, char*, pruint32) c print32 find(const char*, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string.
... @return the offset of astr, or -1 if not found parameters char* astr print32 (*)(char*, char*, pruint32) c print32 find(const char*, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source parameters char* astr pruint32 alen print32 (*)(char*, char*, pruint32) c rfind print32 rfind(const nsacstring&, print32 (*)(const char*, const char*, pruint32)) const - source find the last occurrence of astr in this string.
...And 13 more matches
PromiseFlatCString (External)
@return the offset of astr, or -1 if not found parameters nsacstring& astr print32 (*)(char*, char*, pruint32) c print32 find(const nsacstring&, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsacstring& astr pruint32 aoffset print32 (*)(char*, char*, pruint32) c print32 find(const char*, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string.
... @return the offset of astr, or -1 if not found parameters char* astr print32 (*)(char*, char*, pruint32) c print32 find(const char*, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source parameters char* astr pruint32 alen print32 (*)(char*, char*, pruint32) c rfind print32 rfind(const nsacstring&, print32 (*)(const char*, const char*, pruint32)) const - source find the last occurrence of astr in this string.
...And 13 more matches
nsACString (External)
@return the offset of astr, or -1 if not found parameters nsacstring& astr print32 (*)(char*, char*, pruint32) c print32 find(const nsacstring&, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsacstring& astr pruint32 aoffset print32 (*)(char*, char*, pruint32) c print32 find(const char*, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string.
... @return the offset of astr, or -1 if not found parameters char* astr print32 (*)(char*, char*, pruint32) c print32 find(const char*, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source parameters char* astr pruint32 alen print32 (*)(char*, char*, pruint32) c rfind print32 rfind(const nsacstring&, print32 (*)(const char*, const char*, pruint32)) const - source find the last occurrence of astr in this string.
...And 13 more matches
nsCAutoString (External)
@return the offset of astr, or -1 if not found parameters nsacstring& astr print32 (*)(char*, char*, pruint32) c print32 find(const nsacstring&, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsacstring& astr pruint32 aoffset print32 (*)(char*, char*, pruint32) c print32 find(const char*, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string.
... @return the offset of astr, or -1 if not found parameters char* astr print32 (*)(char*, char*, pruint32) c print32 find(const char*, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source parameters char* astr pruint32 alen print32 (*)(char*, char*, pruint32) c rfind print32 rfind(const nsacstring&, print32 (*)(const char*, const char*, pruint32)) const - source find the last occurrence of astr in this string.
...And 13 more matches
nsCStringContainer (External)
@return the offset of astr, or -1 if not found parameters nsacstring astr print32* c find(const nsacstring&, pruint32, print32 (*) print32 find(const nsacstring&, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsacstring astr pruint32 aoffset print32* c find(const char*, print32 (*) print32 find(const char*, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string.
... @return the offset of astr, or -1 if not found parameters char astr print32* c find(const char*, pruint32, print32 (*) print32 find(const char*, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source parameters char astr pruint32 alen print32* c rfind(const nsacstring&, print32 (*) print32 rfind(const nsacstring&, print32 (*)(const char*, const char*, pruint32)) const - source find the last occurrence of astr in this string.
...And 13 more matches
nsCString external
@return the offset of astr, or -1 if not found parameters nsacstring& astr print32 (*)(char*, char*, pruint32) c print32 find(const nsacstring&, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsacstring& astr pruint32 aoffset print32 (*)(char*, char*, pruint32) c print32 find(const char*, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string.
... @return the offset of astr, or -1 if not found parameters char* astr print32 (*)(char*, char*, pruint32) c print32 find(const char*, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source parameters char* astr pruint32 alen print32 (*)(char*, char*, pruint32) c rfind print32 rfind(const nsacstring&, print32 (*)(const char*, const char*, pruint32)) const - source find the last occurrence of astr in this string.
...And 13 more matches
nsDependentCString external
@return the offset of astr, or -1 if not found parameters nsacstring& astr print32 (*)(char*, char*, pruint32) c print32 find(const nsacstring&, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsacstring& astr pruint32 aoffset print32 (*)(char*, char*, pruint32) c print32 find(const char*, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string.
... @return the offset of astr, or -1 if not found parameters char* astr print32 (*)(char*, char*, pruint32) c print32 find(const char*, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source parameters char* astr pruint32 alen print32 (*)(char*, char*, pruint32) c rfind print32 rfind(const nsacstring&, print32 (*)(const char*, const char*, pruint32)) const - source find the last occurrence of astr in this string.
...And 13 more matches
nsDependentCSubstring external
@return the offset of astr, or -1 if not found parameters nsacstring& astr print32 (*)(char*, char*, pruint32) c print32 find(const nsacstring&, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsacstring& astr pruint32 aoffset print32 (*)(char*, char*, pruint32) c print32 find(const char*, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string.
... @return the offset of astr, or -1 if not found parameters char* astr print32 (*)(char*, char*, pruint32) c print32 find(const char*, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source parameters char* astr pruint32 alen print32 (*)(char*, char*, pruint32) c rfind print32 rfind(const nsacstring&, print32 (*)(const char*, const char*, pruint32)) const - source find the last occurrence of astr in this string.
...And 13 more matches
nsLiteralCString (External)
@return the offset of astr, or -1 if not found parameters nsacstring& astr print32 (*)(char*, char*, pruint32) c print32 find(const nsacstring&, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsacstring& astr pruint32 aoffset print32 (*)(char*, char*, pruint32) c print32 find(const char*, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string.
... @return the offset of astr, or -1 if not found parameters char* astr print32 (*)(char*, char*, pruint32) c print32 find(const char*, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source parameters char* astr pruint32 alen print32 (*)(char*, char*, pruint32) c rfind print32 rfind(const nsacstring&, print32 (*)(const char*, const char*, pruint32)) const - source find the last occurrence of astr in this string.
...And 13 more matches
nsLiteralString (External)
@return the offset of astr, or -1 if not found parameters nsacstring& astr print32 (*)(char*, char*, pruint32) c print32 find(const nsacstring&, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string, beginning at aoffset.
... @return the offset of astr, or -1 if not found parameters nsacstring& astr pruint32 aoffset print32 (*)(char*, char*, pruint32) c print32 find(const char*, print32 (*)(const char*, const char*, pruint32)) const - source find the first occurrence of astr in this string.
... @return the offset of astr, or -1 if not found parameters char* astr print32 (*)(char*, char*, pruint32) c print32 find(const char*, pruint32, print32 (*)(const char*, const char*, pruint32)) const - source parameters char* astr pruint32 alen print32 (*)(char*, char*, pruint32) c rfind print32 rfind(const nsacstring&, print32 (*)(const char*, const char*, pruint32)) const - source find the last occurrence of astr in this string.
...And 13 more matches
IAccessibleEditableText
the substrings used with this interface are specified as follows: if startoffset is less than endoffset, the substring starts with the character at startoffset and ends with the character just before endoffset.
... if endoffset is lower than startoffset, the result is the same as a call with the two arguments exchanged.
...refer to the @ref _specialoffsets "special offsets for use in the iaccessibletext and iaccessibleeditabletext methods" for information about a special offset constant that can be used in iaccessibleeditabletext methods.
...And 13 more matches
background-position - CSS: Cascading Style Sheets
yntax /* keyword values */ background-position: top; background-position: bottom; background-position: left; background-position: right; background-position: center; /* <percentage> values */ background-position: 25% 75%; /* <length> values */ background-position: 0 0; background-position: 1cm 2cm; background-position: 10ch 8em; /* multiple images */ background-position: 0 0, center; /* edge offsets values */ background-position: bottom 10px right 20px; background-position: right 3em bottom 10px; background-position: bottom 10px right; background-position: top right 10px; /* global values */ background-position: inherit; background-position: initial; background-position: unset; the background-position property is specified as one or more <position> values, separated by commas.
...if three or four values are used, the length-percentage values are offsets for the preceding keyword value(s).
... 3-value syntax: two values are keyword values, and the third is the offset for the preceding value: the first value is one of the keyword values top, left, bottom, right, or center.
...And 12 more matches
Architecture - Accessibility
how does an at deal with text (a) to get the embedded object for an embedded object char: linkindex = iahypertext::getlinkindex(offset) iahyperlink*object = iahypertext::getlink(linkindex) iaccessible* accessible = qi/qs(object) (b) to get the offset in the parent text for a given embedded object: qi/qa to iahyperlink if not successful, then it is not embedded in text, so it's position in parent should be determined just by ia2::indexinparent, which will return its child offset within the parent.
...in firefox, the results of getendindex will always be the startindex + 1, because links are always just represented by a single embedded object character (c) to get the next char fom a given offset in an accessible text: if current char is 0 (end of string), then we are on a hard line break: get next node (typical depth first search), and set the current offset = 0 iatext::ch = getcharacteratoffset(++offset); if ch == embedded object char (0xfffc) then get object for that offset (see a above), then set the current offset to -1, and go to step 2 if ch == 0 then we must determine whether we're on a hard line break: ...
... if the current accessible's ia2 role is section, heading or paragraph then we are on a hard line break, so stop get the offset in the parent text for this object (see b above), and then repeat step (c)2 above done (d) to get the next word or line: look one character ahead.
...And 10 more matches
nsISelection
as a service: var selection = components.classes["@mozilla.org/????????????????????????????"] .createinstance(components.interfaces.nsiselection); method overview void addrange(in nsidomrange range); void collapse(in nsidomnode parentnode, in long offset); [noscript,notxpcom,nostdcall] boolean collapsed(); void collapsenative(in nsidomnode parentnode, in long offset); native code only!
... void collapsetoend(); void collapsetostart(); boolean containsnode(in nsidomnode node, in boolean partlycontained); void deletefromdocument(); void extend(in nsidomnode parentnode, in long offset); void extendnative(in nsidomnode parentnode, in long offset); native code only!
... anchoroffset long the offset within the (text) node where the selection begins.
...And 9 more matches
Spaces and reference spaces: Spatial tracking in WebXR - Web APIs
representing a position using a reference space as covered in defining spatial relationships with reference spaces in geometry and reference spaces in webxr, reference spaces establish a local coordinate system which is offset from another coordinate system that is itself defined by some other space.
... the first is described above: applying a reference space to an offset (or vice-versa, since the result is the same) to determine the transform matrix that represents the resulting location in the space's coordinate system.
... offsetting or moving reference spaces while you can't change a reference space since both xrreferencespace and xrboundedreferencespace are read-only, you can easily create new reference spaces by applying an offset transform to them.
...And 9 more matches
Animated PNG graphics
MozillaTechAPNG
the 'actl' chunk contains: byte offset field name field type description 0 num_frames unsigned int the number of frames in the apng.
... byte offset field name field type description 0 sequence_number unsigned int sequence number of the animation chunk, starting with 0.
... 12 x_offset unsigned int x position at which to render the following frame.
...And 8 more matches
WebGL2RenderingContext.texSubImage3D() - Web APIs
syntax void gl.texsubimage3d(target, level, xoffset, yoffset, zoffset, width, height, depth, format, type, arraybufferview?
... srcdata, optional srcoffset); void gl.texsubimage3d(target, level, xoffset, yoffset, zoffset, width, height, depth, format, type, imagebitmap?
... pixels); void gl.texsubimage3d(target, level, xoffset, yoffset, zoffset, width, height, depth, format, type, imagedata?
...And 8 more matches
Movement, orientation, and motion: A WebXR example - Web APIs
enderstate({ baselayer: new xrwebgllayer(xrsession, gl) }); if (session_type == "immersive-vr") { refspacetype = "local"; } else { refspacetype = "viewer"; } mat4.fromtranslation(cubematrix, viewerstartposition); vec3.copy(cubeorientation, viewerstartorientation); xrsession.requestreferencespace(refspacetype) .then((refspace) => { xrreferencespace = refspace.getoffsetreferencespace( new xrrigidtransform(viewerstartposition, cubeorientation)); animationframerequestid = xrsession.requestanimationframe(drawframe); }); return xrsession; } after storing the newly-created xrsession object into xrsession, the label of the button is set to "exit webxr" to indicate its new function after starting the scene, and a handler is installed for the end eve...
...when the promise returned resolves to a xrreferencespace object, we call its getoffsetreferencespace function to obtain a reference space object to represent the object's coordinate system.
... moving using the keyboard in order to allow the user to move through the 3d world even if they don't have a webxr device with the inputs to perform movement through space, our handler for keydown events, handlekeydown(), responds by updating offsets from the object's origin based on which key was pressed.
...And 8 more matches
transform-origin - CSS: Cascading Style Sheets
syntax /* one-value syntax */ transform-origin: 2px; transform-origin: bottom; /* x-offset | y-offset */ transform-origin: 3cm 2px; /* x-offset-keyword | y-offset */ transform-origin: left 2px; /* x-offset-keyword | y-offset-keyword */ transform-origin: right top; /* y-offset-keyword | x-offset-keyword */ transform-origin: top right; /* x-offset | y-offset | z-offset */ transform-origin: 2px 30% 10px; /* x-offset-keyword | y-offset | z-offset */ transform-origin: left 5px -3px; /...
...* x-offset-keyword | y-offset-keyword | z-offset */ transform-origin: right bottom 2cm; /* y-offset-keyword | x-offset-keyword | z-offset */ transform-origin: bottom right 2cm; /* global values */ transform-origin: inherit; transform-origin: initial; transform-origin: unset; the transform-origin property may be specified using one, two, or three values, where each value represents an offset.
... offsets that are not explicitly defined are reset to their corresponding initial values.
...And 8 more matches
Gradients in SVG - SVG: Scalable Vector Graphics
basic example <svg width="120" height="240" version="1.1" xmlns="http://www.w3.org/2000/svg"> <defs> <lineargradient id="gradient1"> <stop class="stop1" offset="0%"/> <stop class="stop2" offset="50%"/> <stop class="stop3" offset="100%"/> </lineargradient> <lineargradient id="gradient2" x1="0" x2="0" y1="0" y2="1"> <stop offset="0%" stop-color="red"/> <stop offset="50%" stop-color="black" stop-opacity="0"/> <stop offset="100%" stop-color="blue"/> </lineargradient> <style type="text/css"><![c...
...these nodes tell the gradient what color it should be at certain positions by specifying an offset attribute for the position, and a stop-color attribute.
...you can insert as many stop colors as you like to create a blend that's as beautiful or hideous as you need, but the offsets should always increase from 0% (or 0 if you want to drop the % sign) to 100% (or 1).
...And 8 more matches
nsISelectionPrivate
method overview void addselectionlistener(in nsiselectionlistener newlistener); void endbatchchanges(); void getcachedframeoffset(in nsiframe aframe, in print32 inoffset, in nspointref apoint); native code only!
... void getrangesforinterval(in nsidomnode beginnode, in print32 beginoffset, in nsidomnode endnode, in print32 endoffset, in prbool allowadjacent, out pruint32 resultcount, [retval, array, size_is(resultcount)] out nsidomrange results); void getrangesforintervalarray(in nsinode beginnode, in print32 beginoffset, in nsinode endnode, in print32 endoffset, in boolean allowadjacent, in rangearray results); native code only!
... void getrangesforintervalcomarray(in nsidomnode beginnode, in print32 beginoffset, in nsidomnode endnode, in print32 endoffset, in prbool allowadjacent, in rangearray results); native code only!
...And 7 more matches
Applying styles and colors - Web APIs
linedashoffset = value specifies where to start a dash array on a line.
...it="return draw();"> <label>miter limit</label> <input type="number" size="3" id="miterlimit"/> <input type="submit" value="redraw"/> </form> </td> </tr> </table> document.getelementbyid('miterlimit').value = document.getelementbyid('canvas').getcontext('2d').miterlimit; draw(); screenshotlive sample using line dashes the setlinedash method and the linedashoffset property specify the dash pattern for lines.
... the setlinedash method accepts a list of numbers that specifies distances to alternately draw a line and a gap and the linedashoffset property sets an offset where to start the pattern.
...And 7 more matches
KeyframeEffect.setKeyframes() - Web APIs
element.animate([ { // from opacity: 0, color: "#fff" }, { // to opacity: 1, ​ color: "#000" } ], 2000); offsets for each keyframe can be specified by providing an offset value.
... element.animate([ { opacity: 1 }, { opacity: 0.1, offset: 0.7 }, { opacity: 0 } ], 2000); note: offset values, if provided, must be between 0.0 and 1.0 (inclusive) and arranged in ascending order.
... it is not necessary to specify an offset for every keyframe.
...And 7 more matches
WebGLRenderingContext.texSubImage2D() - Web APIs
syntax // webgl 1: void gl.texsubimage2d(target, level, xoffset, yoffset, width, height, format, type, arraybufferview?
... pixels); void gl.texsubimage2d(target, level, xoffset, yoffset, format, type, imagedata?
... pixels); void gl.texsubimage2d(target, level, xoffset, yoffset, format, type, htmlimageelement?
...And 7 more matches
begin - SVG: Scalable Vector Graphics
WebSVGAttributebegin
each individual value can be one of the following : <offset-value>, <syncbase-value>, <event-value>, <repeat-value>, <accesskey-value>, <wallclock-sync-value> or the keyword indefinite.
...each value can be one of the following: <offset-value> this value defines a clock-value that represents a point in time relative to the beginning of the svg document (usually the load or domcontentloaded event).
... <syncbase-value> this value defines a syncbase and an optional offset from that syncbase.
...And 7 more matches
PRTimeParameters
syntax #include <prtime.h> typedef struct prtimeparameters { print32 tp_gmt_offset; print32 tp_dst_offset; } prtimeparameters; description each geographic location has a standard time zone, and if daylight saving time (dst) is practiced, a daylight time zone.
... the prtimeparameters structure represents the local time zone information in terms of the offset (in seconds) from gmt.
... the overall offset is broken into two components: tp_gmt_offset the offset of the local standard time from gmt.
...And 6 more matches
NS_ConvertASCIItoUTF16
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount print32 find(const nsaflatstring&, print32, print32) const - source parameters nsaflatstring& astring print32 aoffset print32 acount print32 find(const prunichar*, print32, print32) const - source parameters prunichar* astring print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase ...
...tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...And 6 more matches
NS_ConvertUTF8toUTF16
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount print32 find(const nsaflatstring&, print32, print32) const - source parameters nsaflatstring& astring print32 aoffset print32 acount print32 find(const prunichar*, print32, print32) const - source parameters prunichar* astring print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase ...
...tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...And 6 more matches
nsAdoptingString
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount print32 find(const nsaflatstring&, print32, print32) const - source parameters nsaflatstring& astring print32 aoffset print32 acount print32 find(const prunichar*, print32, print32) const - source parameters prunichar* astring print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase ...
...tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...And 6 more matches
nsAutoString
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount print32 find(const nsaflatstring&, print32, print32) const - source parameters nsaflatstring& astring print32 aoffset print32 acount print32 find(const prunichar*, print32, print32) const - source parameters prunichar* astring print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase ...
...tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...And 6 more matches
nsDependentString
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount print32 find(const nsaflatstring&, print32, print32) const - source parameters nsaflatstring& astring print32 aoffset print32 acount print32 find(const prunichar*, print32, print32) const - source parameters prunichar* astring print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase ...
...tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...And 6 more matches
nsFixedString
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount print32 find(const nsaflatstring&, print32, print32) const - source parameters nsaflatstring& astring print32 aoffset print32 acount print32 find(const prunichar*, print32, print32) const - source parameters prunichar* astring print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase ...
...tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...And 6 more matches
nsPromiseFlatString
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount print32 find(const nsaflatstring&, print32, print32) const - source parameters nsaflatstring& astring print32 aoffset print32 acount print32 find(const prunichar*, print32, print32) const - source parameters prunichar* astring print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase ...
...tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...And 6 more matches
nsString
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount print32 find(const nsaflatstring&, print32, print32) const - source parameters nsaflatstring& astring print32 aoffset print32 acount print32 find(const prunichar*, print32, print32) const - source parameters prunichar* astring print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase ...
...tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...And 6 more matches
nsXPIDLString
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount print32 find(const nsaflatstring&, print32, print32) const - source parameters nsaflatstring& astring print32 aoffset print32 acount print32 find(const prunichar*, print32, print32) const - source parameters prunichar* astring print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase ...
...tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...And 6 more matches
nsISeekableStream
inherits from: nsisupports last changed in gecko 1.7 method overview void seek(in long whence, in long long offset); void seteof(); long long tell(); constants constant value description ns_seek_set 0 specifies that the offset is relative to the start of the stream.
... ns_seek_cur 1 specifies that the offset is relative to the current position in the stream.
... ns_seek_end 2 specifies that the offset is relative to the end of the stream.
...And 6 more matches
AbstractRange - Web APIs
endcontainer read only the dom node in which the end of the range, as specified by the endoffset property, is located.
... endoffset read only an integer value indicating the offset, in characters, from the beginning of the node's contents to the beginning of the range represented by the range object.
... startcontainer read only the dom node in which the beginning of the range, as specified by the startoffset property, is located.
...And 6 more matches
Keyframe Formats - Web APIs
element.animate([ { // from opacity: 0, color: "#fff" }, { // to opacity: 1, ​ color: "#000" } ], 2000); offsets for each keyframe can be specified by providing an offset value.
... element.animate([ { opacity: 1 }, { opacity: 0.1, offset: 0.7 }, { opacity: 0 } ], 2000); note: offset values, if provided, must be between 0.0 and 1.0 (inclusive) and arranged in ascending order.
... it is not necessary to specify an offset for every keyframe.
...And 6 more matches
PR_Seek
moves the current read-write file pointer by an offset expressed as a 32-bit integer.
... syntax #include <prio.h> print32 pr_seek( prfiledesc *fd, print32 offset, prseekwhence whence); parameters the function has the following parameters: fd a pointer to a prfiledesc object.
... offset a value, in bytes, used with the whence parameter to set the file pointer.
...And 5 more matches
PR_Seek64
moves the current read-write file pointer by an offset expressed as a 64-bit integer.
... syntax #include <prio.h> print64 pr_seek64( prfiledesc *fd, print64 offset, prseekwhence whence); parameters the function has the following parameters: fd a pointer to a prfiledesc object.
... offset a value, in bytes, used with the whence parameter to set the file pointer.
...And 5 more matches
NS_ConvertUTF16toUTF8
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...@param acount tells us how many iterations to make starting at the given offset.
...And 5 more matches
NS_LossyConvertUTF16toASCII
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...@param acount tells us how many iterations to make starting at the given offset.
...And 5 more matches
nsAdoptingCString
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...@param acount tells us how many iterations to make starting at the given offset.
...And 5 more matches
nsCAutoString
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...@param acount tells us how many iterations to make starting at the given offset.
...And 5 more matches
nsCString
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...@param acount tells us how many iterations to make starting at the given offset.
...And 5 more matches
nsDependentCString
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...@param acount tells us how many iterations to make starting at the given offset.
...And 5 more matches
nsFixedCString
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...@param acount tells us how many iterations to make starting at the given offset.
...And 5 more matches
nsPromiseFlatCString
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...@param acount tells us how many iterations to make starting at the given offset.
...And 5 more matches
nsXPIDLCString
@param astring is substring to be sought in this @param aignorecase selects case sensitivity @param aoffset tells us where in this string to start searching @param acount tells us how far from the offset we are to search.
...@return offset in string, or knotfound parameters nscstring& astring prbool aignorecase print32 aoffset print32 acount print32 find(const char*, prbool, print32, print32) const - source parameters char* astring prbool aignorecase print32 aoffset print32 acount rfind print32 rfind(const nscstring&, prbool, print32, print32) const - source this methods scans the string backwards, looking for the given string @param astring is substring to be sought in this @param aignorecase tells us whether or not to do caseless compare @param aoffset tells us where in this string to start searching.
...@param acount tells us how many iterations to make starting at the given offset.
...And 5 more matches
nsIAccessibleEditableText
void copytext( in long startpos, in long endpos ); parameters startpos start offset of the text to be copied into the clipboard.
... endpos end offset of the text to be copied into the clipboard.
... void cuttext( in long startpos, in long endpos ); parameters startpos start offset of the text to be deleted and copied to clipboard.
...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.
... anchoroffset the number of child nodes from the start of the anchor node that should be excluded from 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
Geometry and reference spaces in WebXR - Web APIs
the directionality of the coordinate system can be seen in the following diagram: an xrrigidtransform called the origin offset is used to transform points from the space's own effective coordinate system to the xr device's native coordinate system.
... the origin offset is initially simply an identity transform, since typically the two origins are aligned when the space is first established.
... however, as changes in alignment accumulate over time the origin offset may change to compensate.
...And 5 more matches
Box-shadow generator - CSS: Cascading Style Sheets
decrement = function decrement(topic) { var slider = sliders[topic]; if (slider === null || slider === undefined) return; if (slider.value - slider.step >= slider.min) { slider.value -= slider.step; setvalue(topic, slider.value) notify.call(slider); } } // this = slider object var updateslider = function updateslider(e) { var node = this.node; var pos = e.pagex - node.offsetleft; var width = node.clientwidth; var delta = this.max - this.min; var offset = this.pointer.clientwidth + 4; // border width * 2 if (pos < 0) pos = 0; if (pos > width) pos = width; var value = pos * delta / width | 0; var precision = value % this.step; value = value - precision + this.min; if (precision > this.step / 2) value = value + this.step; if (this.snap) pos ...
...= (value - this.min) * width / delta; this.pointer.style.left = pos - offset/2 + "px"; this.value = value; node.setattribute('data-value', value); notify.call(this); } var setvalue = function setvalue(topic, value) { var slider = sliders[topic]; if (value > slider.max || value < slider.min) return; var delta = slider.max - slider.min; var width = slider.node.clientwidth; var offset = slider.pointer.clientwidth; var pos = (value - slider.min) * width / delta; slider.value = value; slider.pointer.style.left = pos - offset / 2 + "px"; slider.node.setattribute('data-value', value); notify.call(slider); } var setmousetracking = function setmousetracking(elem, callback) { elem.addeventlistener("mousedown", function(e) { callback(e); document.addeventli...
... colopicker = (function colopicker() { var colorpicker; var hue_area; var gradient_area; var alpha_area; var gradient_picker; var hue_selector; var alpha_selector; var pick_object; var info_rgb; var info_hsv; var info_hexa; var output_color; var color = new color(); var subscribers = []; var updatecolor = function updatecolor(e) { var x = e.pagex - gradient_area.offsetleft; var y = e.pagey - gradient_area.offsettop; // width and height should be the same var size = gradient_area.clientwidth; if (x > size) x = size; if (y > size) y = size; if (x < 0) x = 0; if (y < 0) y = 0; var value = 100 - (y * 100 / size) | 0; var saturation = x * 100 / size | 0; color.sethsv(color.hue, saturation, value); // should update just ...
...And 5 more matches
Color picker tool - CSS: Cascading Style Sheets
sl'); else this.setpickermode('hsv'); }.bind(this)); this.node.appendchild(button); }; /*************************************************************************/ // updates properties of ui elements /*************************************************************************/ colorpicker.prototype.updatecolor = function updatecolor(e) { var x = e.pagex - this.picking_area.offsetleft; var y = e.pagey - this.picking_area.offsettop; var picker_offset = 5; // width and height should be the same var size = this.picking_area.clientwidth; if (x > size) x = size; if (y > size) y = size; if (x < 0) x = 0; if (y < 0) y = 0; var value = 100 - (y * 100 / size) | 0; var saturation = x * 100 / size | 0; if (this.picker_mode === 'hsv') this.color.sethsv(thi...
...s.color.hue, saturation, value); if (this.picker_mode === 'hsl') this.color.sethsl(this.color.hue, saturation, value); this.color_picker.style.left = x - picker_offset + 'px'; this.color_picker.style.top = y - picker_offset + 'px'; this.updatealphagradient(); this.updatepreviewcolor(); this.notify('value', value); this.notify('lightness', value); this.notify('saturation', saturation); this.notify('red', this.color.r); this.notify('green', this.color.g); this.notify('blue', this.color.b); this.notify('hexa', this.color.gethexa()); notify(this.topic, this.color); }; colorpicker.prototype.updatehueslider = function updatehueslider(e) { var x = e.pagex - this.hue_area.offsetleft; var width = this.hue_area.clientwidth; if (x < 0) x = 0; if (x > width) x =...
... width; // todo 360 => 359 var hue = ((359 * x) / width) | 0; // if (hue === 360) hue = 359; this.updatesliderposition(this.hue_picker, x); this.sethue(hue); }; colorpicker.prototype.updatealphaslider = function updatealphaslider(e) { var x = e.pagex - this.alpha_area.offsetleft; var width = this.alpha_area.clientwidth; if (x < 0) x = 0; if (x > width) x = width; this.color.a = (x / width).tofixed(2); this.updatesliderposition(this.alpha_picker, x); this.updatepreviewcolor(); this.notify('alpha', this.color.a); notify(this.topic, this.color); }; colorpicker.prototype.sethue = function sethue(value) { this.color.sethue(value); this.updatepickerbackground(); this.updatealphagradient(); this.updatepreviewcolor(); this.notify('red', this.color.r); ...
...And 5 more matches
position - CSS: Cascading Style Sheets
WebCSSposition
relative the element is positioned according to the normal flow of the document, and then offset relative to itself based on the values of top, right, bottom, and left.
... the offset does not affect the position of any other elements; thus, the space given for the element in the page layout is the same as if position were static.
... sticky the element is positioned according to the normal flow of the document, and then offset relative to its nearest scrolling ancestor and containing block (nearest block-level ancestor), including table-related elements, based on the values of top, right, bottom, and left.
...And 5 more matches
<position> - CSS: Cascading Style Sheets
it is used in the background-position and offset-anchor properties.
... syntax the <position> data type is specified with one or two keywords, with optional offsets.
... if specified, an offset can be either a relative <percentage> value or an absolute <length> value.
...And 5 more matches
end - SVG: Scalable Vector Graphics
WebSVGAttributeend
each value can be one of the following: <offset-value> this value defines a clock-value that represents a point in time relative to the beginning of the svg document (usually the load or domcontentloaded event).
... <syncbase-value> this value defines a syncbase and an optional offset from that syncbase.
...an optional offset value as defined in <offset-value> can be appended.
...And 5 more matches
Positioning - Archive of obsolete content
context menus will appear offset down and to the right a couple of pixels so that the menu can be dismissed again just by clicking in the same place.
... tooltips will always appear near the current mouse position, offset vertically by a small amount.
...the menu appears at the mouse position offset by a couple of pixels so that the user can close the context menu just by clicking in the same location.
...And 4 more matches
Legacy layout methods - Learn web development
enabling offset containers in our grid the grid we have created works well as long as we want to start all of the containers flush with the left hand side of the grid.
... if we wanted to leave an empty column space before the first container — or between containers — we would need to create an offset class to add a left margin to our site to push it across the grid visually.
... let's create a class in our css that will offset a container element by one column width.
...And 4 more matches
Index
the format of the validity-time argument is yymmddhhmmss[+hhmm|-hhmm|z], which allows offsets to be set relative to the validity end time.
... when specifying an offset time, use yymmddhhmmss+hhmm or yymmddhhmmss-hhmm for adding or subtracting time, respectively.
...the validity period begins at the current system time unless an offset is added or subtracted with the -w option.
...And 4 more matches
certutil
the format of the validity-time argument is yymmddhhmmss[+hhmm|-hhmm|z], which allows offsets to be set relative to the validity end time.
... when specifying an offset time, use yymmddhhmmss+hhmm or yymmddhhmmss-hhmm for adding or subtracting time, respectively.
...the validity period begins at the current system time unless an offset is added or subtracted with the -w option.
...And 4 more matches
Index
MozillaTechXPCOMIndex
the substrings used with this interface are specified as follows: if startoffset is less than endoffset, the substring starts with the character at startoffset and ends with the character just before endoffset.
... if endoffset is lower than startoffset, the result is the same as a call with the two arguments exchanged.
...refer to the @ref _specialoffsets "special offsets for use in the iaccessibletext and iaccessibleeditabletext methods" for information about a special offset constant that can be used in iaccessibleeditabletext methods.
...And 4 more matches
Range.setEnd() - Web APIs
WebAPIRangesetEnd
the range.setend() method sets the end position of a range to be located at the given offset into the specified node x.setting the end point above (higher in the document) than the start point will result in a collapsed range with the start and end points both set to the specified end position.
... syntax range.setend(endnode, endoffset); parameters endnode the node inside which the range should end.
... endoffset an integer greater than or equal to zero representing the offset for the end of the range from the start of endnode.
...And 4 more matches
Using the Web Animations API - Web APIs
the css version here’s a tumbling animation written in css showing alice falling down the rabbit hole that leads to wonderland (see the full code on codepen): notice that the background moves, alice spins, and her color changes at an offset from her spinning.
... representing keyframes the first thing we need is to create a keyframe object corresponding to our css @keyframes block: var alicetumbling = [ { transform: 'rotate(0) translate3d(-50%, -50%, 0)', color: '#000' }, { color: '#431236', offset: 0.3}, { transform: 'rotate(360deg) translate3d(-50%, -50%, 0)', color: '#000' } ]; here we’re using an array containing multiple objects.
... when we want to explicitly set a key’s offset from the other keys, we can specify an offset directly in the object, separated from the declaration with a comma.
...And 4 more matches
Coordinate systems - CSS: Cascading Style Sheets
the position is specified as the number of pixels offset from the origin along each dimension of the context.
... dimensions in the coordinate systems used by web technologies, convention dictates that the horizontal offset is called the x-coordinate, where a negative value indicates a position to the left of the origin and a positive value is to the right of the origin.
... the y-coordinate specifies the vertical offset, with a negative value being above the origin and a positive value being below the origin.
...And 4 more matches
box-shadow - CSS: Cascading Style Sheets
a box shadow is described by x and y offsets relative to the element, blur and spread radius, and color.
... syntax /* keyword values */ box-shadow: none; /* offset-x | offset-y | color */ box-shadow: 60px -16px teal; /* offset-x | offset-y | blur-radius | color */ box-shadow: 10px 5px 5px black; /* offset-x | offset-y | blur-radius | spread-radius | color */ box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2); /* inset | offset-x | offset-y | color */ box-shadow: inset 5em 1em gold; /* any number of shadows, separated by commas */ box-shadow: 3px 3px red, -1...
... if only two values are given, they are interpreted as <offset-x><offset-y> values.
...And 4 more matches
filter - CSS: Cascading Style Sheets
WebCSSfilter
a drop shadow is effectively a blurred, offset version of the input image's alpha mask drawn in a particular color, composited below the image.
...the parameters of the <shadow> parameter are as follows: <offset-x> <offset-y> (required) these are two <length> values to set the shadow offset.
... <offset-x> specifies the horizontal distance.
...And 4 more matches
text-shadow - CSS: Cascading Style Sheets
each shadow is described by some combination of x and y offsets from the element, blur radius, and color.
... syntax /* offset-x | offset-y | blur-radius | color */ text-shadow: 1px 1px 2px black; /* color | offset-x | offset-y | blur-radius */ text-shadow: #fc0 1px 0 10px; /* offset-x | offset-y | color */ text-shadow: 5px 5px #558abb; /* color | offset-x | offset-y */ text-shadow: white 2px 5px; /* offset-x | offset-y /* use defaults for color and blur-radius */ text-shadow: 5px 10px; /* global values */ text-shadow: inherit; text-shadow: initial; text-shadow: unset; this property is specified as a comma-separated list of shadows.
...the first two <length> values are the <offset-x> and <offset-y> values.
...And 4 more matches
Understanding WebAssembly text format - WebAssembly
this means all we need to do to pass a string to javascript is to pass out the offset of the string in linear memory along with some way to indicate the length.
... while there are many different ways to encode a string’s length in the string itself (for example, c strings); for simplicity here we just pass both offset and length as parameters: (import "console" "log" (func $log (param i32) (param i32))) on the javascript side, we can use the textdecoder api to easily decode our bytes into a javascript string.
... (we specify utf8 here, but many other encodings are supported.) function consolelogstring(offset, length) { var bytes = new uint8array(memory.buffer, offset, length); var string = new textdecoder('utf8').decode(bytes); console.log(string); } the last missing piece of the puzzle is where consolelogstring gets access to the webassembly memory.
...And 4 more matches
jspage - Archive of obsolete content
ype==3){g=g.parentnode;}if(j.test(/key/)){var b=a.which||a.keycode;var m=event.keys.keyof(b);if(j=="keydown"){var d=b-111; if(d>0&&d<13){m="f"+d;}}m=m||string.fromcharcode(b).tolowercase();}else{if(j.match(/(click|mouse|menu)/i)){k=(!k.compatmode||k.compatmode=="css1compat")?k.html:k.body; var i={x:a.pagex||a.clientx+k.scrollleft,y:a.pagey||a.clienty+k.scrolltop};var c={x:(a.pagex)?a.pagex-f.pagexoffset:a.clientx,y:(a.pagey)?a.pagey-f.pageyoffset:a.clienty}; if(j.match(/dommousescroll|mousewheel/)){var h=(a.wheeldelta)?a.wheeldelta/120:-(a.detail||0)/3;}var e=(a.which==3)||(a.button==2);var l=null;if(j.match(/over|out/)){switch(j){case"mouseover":l=a.relatedtarget||a.fromelement; break;case"mouseout":l=a.relatedtarget||a.toelement;}if(!(function(){while(l&&l.nodetype==3){l=l.parentnode;}return t...
...omputedstyle(g);}if(a){a=string(a);var c=a.match(/rgba?\([\d\s,]+\)/); if(c){a=a.replace(c[0],c[0].rgbtohex());}}if(browser.engine.presto||(browser.engine.trident&&!$chk(parseint(a,10)))){if(g.test(/^(height|width)$/)){var b=(g=="width")?["left","right"]:["top","bottom"],d=0; b.each(function(h){d+=this.getstyle("border-"+h+"-width").toint()+this.getstyle("padding-"+h).toint();},this);return this["offset"+g.capitalize()]-d+"px"; }if((browser.engine.presto)&&string(a).test("px")){return a;}if(g.test(/(border(.+)width|margin|padding)/)){return"0px";}}return a;},setstyles:function(b){for(var a in b){this.setstyle(a,b[a]); }return this;},getstyles:function(){var a={};array.flatten(arguments).each(function(b){a[b]=this.getstyle(b);},this);return a;}});element.styles=new hash({left:"@px",top:"@px",bott...
...ar d=e+"width",a=e+"style",c=e+"color"; f[e]={};f.borderwidth[d]=f[e][d]=b[d]="@px";f.borderstyle[a]=f[e][a]=b[a]="@";f.bordercolor[c]=f[e][c]=b[c]="rgb(@, @, @)";});(function(){element.implement({scrollto:function(h,i){if(b(this)){this.getwindow().scrollto(h,i); }else{this.scrollleft=h;this.scrolltop=i;}return this;},getsize:function(){if(b(this)){return this.getwindow().getsize();}return{x:this.offsetwidth,y:this.offsetheight}; },getscrollsize:function(){if(b(this)){return this.getwindow().getscrollsize();}return{x:this.scrollwidth,y:this.scrollheight};},getscroll:function(){if(b(this)){return this.getwindow().getscroll(); }return{x:this.scrollleft,y:this.scrolltop};},getscrolls:function(){var i=this,h={x:0,y:0};while(i&&!b(i)){h.x+=i.scrollleft;h.y+=i.scrolltop;i=i.parentnode; }return h;},get...
...And 3 more matches
Introduction to CSS layout - Learn web development
sticky positioning is a newer positioning method which makes an element act like position: static until it hits a defined offset from the viewport, at which point it acts like position: fixed.
...ent.</p> <p>i am a basic block level element.</p> this html will be styled by default using the following css: body { width: 500px; margin: 0 auto; } p { background-color: rgb(207,232,220); border: 2px solid rgb(79,185,227); padding: 10px; margin: 10px; border-radius: 5px; } the rendered output is as follows: relative positioning relative positioning allows you to offset an item from the position in normal flow it would have by default.
...ckground-color: rgb(207,232,220); border: 2px solid rgb(79,185,227); padding: 10px; margin: 10px; border-radius: 5px; } .positioned { position: relative; background: rgba(255,84,104,.3); border: 2px solid rgb(255,84,104); top: 30px; left: 30px; } absolute positioning absolute positioning is used to completely remove an element from normal flow, and place it using offsets from the edges of a containing block.
...And 3 more matches
Drawing graphics - Learn web development
now add the following code to the bottom of the javascript: function degtorad(degrees) { return degrees * math.pi / 180; }; function rand(min, max) { return math.floor(math.random() * (max-min+1)) + (min); } let length = 250; let moveoffset = 20; for(var i = 0; i < length; i++) { } here we are implementing the same degtorad() function we saw in the triangle example above, a rand() function that returns a random number between given lower and upper bounds, length and moveoffset variables (which we'll find out more about later), and an empty for loop.
...add the following code inside your for loop: ctx.fillstyle = 'rgba(' + (255-length) + ', 0, ' + (255-length) + ', 0.9)'; ctx.beginpath(); ctx.moveto(moveoffset, moveoffset); ctx.lineto(moveoffset+length, moveoffset); let triheight = length/2 * math.tan(degtorad(60)); ctx.lineto(moveoffset+(length/2), moveoffset+triheight); ctx.lineto(moveoffset, moveoffset); ctx.fill(); length--; moveoffset += 0.7; ctx.rotate(degtorad(5)); so on each iteration, we: set the fillstyle to be a shade of slightly transparent purple, which changes each time based on the value of length.
... move the pen to a coordinate of (moveoffset, moveoffset); this variable defines how far we want to move each time we draw a new triangle.
...And 3 more matches
IME handling guide
mcompositionstart offset of composition string in mtext.
... mselection::manchor, mselection::mfocus offset of selection anchor and focus in mtext.
...if correspoinding offset is end of the editor contents, its rect should be caret rect.
...And 3 more matches
NSS tools : certutil
the format of the validity-time argument is yymmddhhmmss[+hhmm|-hhmm|z], which allows offsets to be set relative to the validity end time.
...when specifying an offset time, use yymmddhhmmss+hhmm or yymmddhhmmss-hhmm for adding or subtracting time, respectively.
...the validity period begins at the current system time unless an offset is added or subtracted with the -w option.
...And 3 more matches
nsICacheEntryDescriptor
inherits from: nsicacheentryinfo last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) method overview void close(); void doom(); void doomandfailpendingrequests(in nsresult status); string getmetadataelement(in string key); void markvalid(); nsiinputstream openinputstream(in unsigned long offset); nsioutputstream openoutputstream(in unsigned long offset); void setdatasize(in unsigned long size); void setexpirationtime(in pruint32 expirationtime); void setmetadataelement(in string key, in string value); void visitmetadata(in nsicachemetadatavisitor visitor); attributes attribute type description accessgranted nscacheaccessmode get the access granted to this descriptor.
...nsiinputstream openinputstream( in unsigned long offset ); parameters offset read starting from this offset into the cached data.
... an offset beyond the end of the stream has undefined consequences.
...And 3 more matches
AudioBufferSourceNode.start() - Web APIs
syntax audiobuffersourcenode.start([when][, offset][, duration]); parameters when optional the time, in seconds, at which the sound should begin to play, in the same time coordinate system used by the audiocontext.
... offset optional an offset, specified as the number of seconds in the same time coordinate system as the audiocontext, to the time within the audio buffer that playback should begin.
... for example, to start playback halfway through a 10-second audio clip, offset should be 5.
...And 3 more matches
HTMLElement - Web APIs
htmlelement.offsetheight read only returns a double containing the height of an element, relative to the layout.
... htmlelement.offsetleft read only returns a double, the distance from this element's left border to its offsetparent's left border.
... htmlelement.offsetparent read only returns a element that is the element from which all offset calculations are currently computed.
...And 3 more matches
Range.setStart() - Web APIs
WebAPIRangesetStart
if the startnode is a node of type text, comment, or cdatasection, then startoffset is the number of characters from the start of startnode.
... for other node types, startoffset is the number of child nodes between the start of the startnode.
... syntax range.setstart(startnode, startoffset); parameters startnode the node where the range should start.
...And 3 more matches
Text.splitText() - Web APIs
WebAPITextsplitText
the text.splittext() method breaks the text node into two nodes at the specified offset, keeping both nodes in the tree as siblings.
... after the split, the current node contains all the content up to the specified offset point, and a newly created node of the same type contains the remaining text.
...if the offset is equal to the length of the original node, the newly created node has no data.
...And 3 more matches
WebGLRenderingContext.vertexAttribPointer() - Web APIs
syntax void gl.vertexattribpointer(index, size, type, normalized, stride, offset); parameters index a gluint specifying the index of the vertex attribute that is to be modified.
... stride a glsizei specifying the offset in bytes between the beginning of consecutive vertex attributes.
... offset a glintptr specifying an offset in bytes of the first component in the vertex attribute array.
...And 3 more matches
Controlling multiple parameters with ConstantSourceNode - Web APIs
this article demonstrates how to use a constantsourcenode to link multiple parameters together so they share the same value, which can be changed by simply setting the value of the constantsourcenode.offset parameter.
...since constantsourcenode's offset value is simply sent straight through to all of its outputs, it acts as a splitter for that value, sending it to each connected parameter.
... the diagram below shows how this works; an input value, n, is set as the value of the constantsourcenode.offset property.
...And 3 more matches
drop-shadow() - CSS: Cascading Style Sheets
a drop shadow is effectively a blurred, offset version of the input image's alpha mask, drawn in a specific color and composited below the image.
... syntax drop-shadow(offset-x offset-y blur-radius color) the drop-shadow() function accepts a parameter of type <shadow> (defined in the box-shadow property), with the exception that the inset keyword and spread parameters are not allowed.
... parameters offset-x offset-y (required) two <length> values that determine the shadow offset.
...And 3 more matches
Date and time formats used in HTML - HTML: Hypertext Markup Language
time zone offset string a time zone offset string specifies the offset in either a positive or a negative number of hours and minutes from the standard time base.
... there are two standard time bases, which are very close to the same, but not exactly the same: for dates after the establishment of coordinated universal time (utc) in the early 1960s, the time base is z and the offset indicates a particular time zone's offset from the time at the prime meridian at 0º longitude (which passes through the royal observatory at greenwich, england).
...you can specify simply "z" as the time zone offset string to indicate that the time is specified in utc.
...And 3 more matches
dx - SVG: Scalable Vector Graphics
WebSVGAttributedx
seven elements are using this attribute: <altglyph>, <fedropshadow>, <feoffset>, <glyphref>, <text>, <tref>, and <tspan> html,body,svg { height:100% } <svg viewbox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"> <!-- lines materialized the position of the glyphs --> <line x1="0" x2="100%" y1="50%" y2="50%" /> <line x1="10%" x2="10%" y1="0" y2="100%" /> <line x1="60%" x2="60%" y1="0" y2="100%" /> <!-- some reference text --> <text x="10%" y="50%" fill="grey">svg</text> <!-- the same text with a shift along the x-axis --> <text dx="50%" x="10%" y="50%">svg</text> </svg> line { stroke: red; stroke-width: .5px; stroke-dasharray: 3px; } altglyph warning: as of ...
... value list of <length> default value none animatable yes fedropshadow for <fedropshadow>, dx defines the x offset of the droped shadow.
... value <number> default value 2 animatable yes feoffset for <feoffset>, dx defines the x offset of the filter input graphic.
...And 3 more matches
dy - SVG: Scalable Vector Graphics
WebSVGAttributedy
seven elements utilize this attribute: <altglyph>, <fedropshadow>, <feoffset>, <glyphref>, <text>, <tref>, and <tspan> html,body,svg { height:100% } <svg viewbox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"> <!-- lines materialized the position of the glyphs --> <line x1="10%" x2="10%" y1="0" y2="100%" /> <line x1="0" x2="100%" y1="30%" y2="30%" /> <line x1="0" x2="100%" y1="80%" y2="80%" /> <!-- some reference text --> <text x="10%" y="30%" fill="grey">svg</text> <!-- the same text with a shift along the y-axis --> <text dy="50%" x="10%" y="30%">svg</text> </svg> line { stroke: red; stroke-width: .5px; stroke-dasharray: 3px; } altglyph warning: as o...
... value list of <length> default value none animatable yes fedropshadow for <fedropshadow>, dy defines the y offset of the dropped shadow.
... value <number> default value 2 animatable yes feoffset for <feoffset>, dy defines the y offset of the filter input graphic.
...And 3 more matches
Introducing the Audio API extension - Archive of obsolete content
00); var samples = new float32array(22050); for (var i = 0; i < samples.length ; i++) { samples[i] = math.sin( i / 20 ); } output.mozwriteaudio(samples); } </script> </head> <body> <p>this demo plays a one second tone when you click the button below.</p> <button onclick="playtone();">play</button> </body> </html> the mozcurrentsampleoffset() method gives the audible position of the audio stream, meaning the position of the last heard sample.
...var currentsampleoffset = audiooutput.mozcurrentsampleoffset(); audio data written using the mozwriteaudio() method needs to be written at a regular interval in equal portions, in order to keep a little ahead of the current sample offset (the sample offset that is currently being played by the hardware can be obtained with mozcurrentsampleoffset()), where "a little" means something on the order of 500 ms of samples.
... for example, if working with two channels at 44100 samples per second, a writing interval of 100 ms, and a pre-buffer equal to 500 ms, one would write an array of (2 * 44100 / 10) = 8820 samples, and a total of (currentsampleoffset + 2 * 44100 / 2).
...And 2 more matches
Audio for Web games - Game development
recording this offset and querying the playing track's current time gives you enough information to synchronize separate pieces of audio.
...we need an offset here, so if we have started one file playing, we have a record of how far through to start another file.
...the first is when to commence playback and the second is where, which is our offset.
...And 2 more matches
Square tilemaps implementation: Scrolling maps - Game development
var startcol = math.floor(this.camera.x / map.tsize); var endcol = startcol + (this.camera.width / map.tsize); var startrow = math.floor(this.camera.y / map.tsize); var endrow = startrow + (this.camera.height / map.tsize); once we have the first tile, we need to calculate how much its rendering (and therefore the rendering of the other tiles) is offset by.
...in our demo the shifting amount is stored in the offsetx and offsety variables.
... var offsetx = -this.camera.x + startcol * map.tsize; var offsety = -this.camera.y + startrow * map.tsize; with these values in place, the loop that renders the map is quite similar to the one used for rendering static tilemaps.
...And 2 more matches
NSS Tools certutil
when specifying an offset time, use "yymmddhhmmss+hhmm" or "yymmddhhmmss-hhmm".
...the validity period begins at the current system time unless an offset is added or subtracted with the -w option.
... -w offset-months set an offset from the current system time, in months, for the beginning of a certificate's validity period.
...And 2 more matches
Introduction to the JavaScript shell
if function is specified, line is an offset into the specified function.
...if you specify a program counter offset into the function, the line number of the line of code containing that offset is returned.
...when the bytecode at the offset specified by pc in the function function is about to be executed, the expression is evaluated.
...And 2 more matches
mozITXTToHTMLConv
loglinestart on output, this parameter is set to indicate the offset into the string of the first non-cite character.
... findurlinplaintext() returns the start and end offsets of the first url found in a substring.
... apos the character offset into the string at which to begin the scan.
...And 2 more matches
nsISelectionController
void charactermove(in boolean forward, in boolean extend); boolean checkvisibility(in nsidomnode node, in short startoffset, in short endoffset); void completemove(in boolean forward, in boolean extend); void completescroll(in boolean forward); boolean getcaretenabled(); short getdisplayselection(); nsiselection getselection(in short type); void intralinemove(in boolean forward, in boolean extend); void line...
... checkvisibility() checks if textnode and offsets are actually rendered in the current precontext.
... boolean checkvisibility( in nsidomnode node, in short startoffset, in short endoffset ); parameters node nsidomnode to test.
...And 2 more matches
VisualViewport - Web APIs
visualviewport.offsetleft read only returns the offset of the left edge of the visual viewport from the left edge of the layout viewport in css pixels.
... visualviewport.offsettop read only returns the offset of the top edge of the visual viewport from the top edge of the layout viewport in css pixels.
... var bottombar = document.getelementbyid('bottombar'); var viewport = window.visualviewport; function viewporthandler() { var layoutviewport = document.getelementbyid('layoutviewport'); // since the bar is position: fixed we need to offset it by the visual // viewport's offset from the layout viewport origin.
...And 2 more matches
WebGL2RenderingContext.compressedTexSubImage3D() - Web APIs
syntax // read from the buffer bound to gl.pixel_unpack_buffer void gl.compressedtexsubimage3d(target, level, xoffset, yoffset, zoffset, width, height, depth, format, imagesize, offset); void gl.compressedtexsubimage3d(target, level, xoffset, yoffset, zoffset, width, height, depth, format, arraybufferview srcdata, optional srcoffset, optional srclengthoverride); parameters target a glenum specifying the binding point (target) of the active texture.
... xoffset a glint specifying the x offset within the compressed texture image.
... yoffset a glint specifying the y offset within the compressed texture image.
...And 2 more matches
WebGL2RenderingContext.drawRangeElements() - Web APIs
syntax void gl.drawrangeelements(mode, start, end, count, type, offset); parameters mode a glenum specifying the type primitive to render.
... start a gluint specifying the minimum array index contained in offset.
... end a gluint specifying the maximum array index contained in offset.
...And 2 more matches
WebGLRenderingContext.compressedTexSubImage2D() - Web APIs
syntax // webgl 1: void gl.compressedtexsubimage2d(target, level, xoffset, yoffset, width, height, format, arraybufferview?
... pixels); // additionally available in webgl 2: void gl.compressedtexsubimage2d(target, level, xoffset, yoffset, width, height, format, imagesize, offset); void gl.compressedtexsubimage2d(target, level, xoffset, yoffset, width, height, format, arraybufferview srcdata, optional srcoffset, optional srclengthoverride); parameters target a glenum specifying the binding point (target) of the active compressed texture.
... xoffset a glint specifying the horizontal offset within the compressed texture image.
...And 2 more matches
Writing a WebSocket server in C# - Web APIs
networkstream methods: write(byte[] buffer, int offset, int size) writes bytes from buffer, offset and size determine length of message.
... read(byte[] buffer, int offset, int size) reads bytes to buffer.
... offset and size determine the length of the message.
...And 2 more matches
Window.scrollY - Web APIs
WebAPIWindowscrollY
the pageyoffset property is an alias for the scrolly property: window.pageyoffset === window.scrolly; // always true for cross-browser compatibility, use window.pageyoffset instead of window.scrolly.
...a fully compatible example: var supportpageoffset = window.pagexoffset !== undefined; var iscss1compat = ((document.compatmode || "") === "css1compat"); var x = supportpageoffset ?
... window.pagexoffset : iscss1compat ?
...And 2 more matches
XRReferenceSpace - Web APIs
it expands upon the base class, xrspace, by adding support for several different tracking behaviors as well as to request a new reference space which describes the offset transform between the tracked object and another location in the world.
... getoffsetreferencespace() creates and returns a new reference space object as the same type as the one on which you call the method (so, either xrreferencespace or xrboundedreferencespace).
...it's particularly useful when determining the distance between the viewer and an input, or when working with offset spaces.
...And 2 more matches
Basic Shapes - CSS: Cascading Style Sheets
however the inset() types enables the definition of offsets, thus pulling the content in over the shape.
... .shape { float: left; shape-outside: inset(20px 10px 20px 10px round 10px); } using the same rules as we use for the margin shorthand, you can set more than one offset at once.
...if there are two values, the top and bottom offsets are set to the first value and the right and left offsets are set to the second.
...And 2 more matches
background-position-x - CSS: Cascading Style Sheets
<length> the offset of the given background image's left vertical edge from the background position layer's left vertical edge.
... (some browsers allow assigning the right edge for offset).
... <percentage> the offset of the given background image's horizontal position relative to the container.
...And 2 more matches
background-position-y - CSS: Cascading Style Sheets
<length> the offset of the given background image's horizontal edge from the corresponding background position layer's top horizontal edge.
... (some browsers allow assigning the bottom edge for offset).
... <percentage> the offset of the given background image's vertical position relative to the container.
...And 2 more matches
SVG documentation index - SVG: Scalable Vector Graphics
WebSVGIndex
36 by svg, svg attribute the by attribute specifies a relative offset value for an attribute that will be modified during an animation.
... 192 startoffset svg, svg attribute the startoffset attribute defines an offset from the start of the path for the initial current text position along the path after converting the path to the <textpath> element's coordinate system.
...ibute the stroke attribute is a presentation attribute defining the color (or any svg paint servers like gradients or patterns) used to paint the outline of the shape; 203 stroke-dasharray svg, svg attribute the stroke-dasharray attribute is a presentation attribute defining the pattern of dashes and gaps used to paint the outline of the shape; 204 stroke-dashoffset svg, svg attribute the stroke-dashoffset attribute is a presentation attribute defining an offset on the rendering of the associated dash array.
...And 2 more matches
Filter effects - SVG: Scalable Vector Graphics
<svg width="250" viewbox="0 0 200 85" xmlns="http://www.w3.org/2000/svg" version="1.1"> <defs> <!-- filter declaration --> <filter id="myfilter" filterunits="userspaceonuse" x="0" y="0" width="200" height="120"> <!-- offsetblur --> <fegaussianblur in="sourcealpha" stddeviation="4" result="blur"/> <feoffset in="blur" dx="4" dy="4" result="offsetblur"/> <!-- litpaint --> <fespecularlighting in="blur" surfacescale="5" specularconstant=".75" specularexponent="20" lighting-color="#bbbbbb" result="specout"> <fepointlight x="-5000" y="-100...
...00" z="20000"/> </fespecularlighting> <fecomposite in="specout" in2="sourcealpha" operator="in" result="specout"/> <fecomposite in="sourcegraphic" in2="specout" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" result="litpaint"/> <!-- merge offsetblur + litpaint --> <femerge> <femergenode in="offsetblur"/> <femergenode in="litpaint"/> </femerge> </filter> </defs> <!-- graphic elements --> <g filter="url(#myfilter)"> <path fill="none" stroke="#d90000" stroke-width="10" d="m50,66 c-50,0 -50,-60 0,-60 h100 c50,0 50,60 0,60z" /> <path fill="#d90000" d="m60,56 c-30,0 -30,-40 0,-40 h80 c30,0 30,40 0,40z" /> <g fill="#ffffff" stroke="black" font-size="45" font-family="verdana" >...
... step 2 <feoffset in="blur" dx="4" dy="4" result="offsetblur"/> <feoffset> takes in "blur", which we previously created, shifts the result 4 to the right and 4 to the bottom, and stores the result in the buffer "offsetblur".
...And 2 more matches
Index - Archive of obsolete content
1266 movebyoffset xul methods, xul reference no summary!
... 2132 -ms-wrap-margin css, css property, css:microsoft extensions, non-standard, reference, recipe:css-property the -ms-wrap-margin css property is a microsoft extension that specifies a margin that offsets the inner wrap shape from other shapes.
...the function mozcurrentsampleoffset() is used to know the position of the samples being played so that we can fill a 500 ms buffer of audio samples.
...a frame is rectangular, with width, height, and an offset from the parent frame that contains it.
OpenClose - Archive of obsolete content
the third and fourth arguments to openpopup are x and y offsets.
... after the popup is positioned, you can further position the popup by specifying non-zero values for these offsets.
... in the following example, the popup is anchored below an element, yet is offset by 10 pixels to the right and 2 pixels upwards.
...here is an example: somepopup.openpopup(null, "", 60, 50, false, false); an unanchored popup uses the x and y offsets, in this case 60 and 50 as offsets from the edge of the window or frame.
NPByteRange - Archive of obsolete content
syntax typedef struct _npbyterange { int32 offset; /* negative offset = from the end */ uint32 length; struct _npbyterange* next; } npbyterange; fields the data structure has the following fields: offset offset in bytes to the start of the requested range.
... this value may be either positive or negative: positive value: offset from the beginning of the stream.
... negative value: offset from the end of the stream.
... length number of bytes to fetch from the specified offset.
NPP_Write - Archive of obsolete content
(remark: hence the name "npp_write" is misleading - just think of:"data_arrived") syntax #include <npapi.h> int32 npp_write(npp instance, npstream* stream, int32 offset, int32 len, void* buf); parameters the function has the following parameters: instance pointer to the current plug-in instance.
... offset offset in bytes of buf from the beginning of the data in the stream.
... buf buffer of data, delivered by the stream, that contains len bytes of data offset bytes from the start of the stream.
... the plug-in can use the offset parameter to track the bytes that are written.
Build the brick field - Game development
var brickrowcount = 3; var brickcolumncount = 5; var brickwidth = 75; var brickheight = 20; var brickpadding = 10; var brickoffsettop = 30; var brickoffsetleft = 30; here we've defined the number of rows and columns of bricks , their width and height, the padding between the bricks so they won't touch each other and a top and left offset so they won't start being drawn right from the edge of the canvas.
...what we need to do is include some calculations that will work out the x and y position of each brick for each loop iteration: var brickx = (c*(brickwidth+brickpadding))+brickoffsetleft; var bricky = (r*(brickheight+brickpadding))+brickoffsettop; each brickx position is worked out as brickwidth + brickpadding, multiplied by the column number, c, plus the brickoffsetleft; the logic for the bricky is identical except that it uses the values for row number, r, brickheight, and brickoffsettop.
... now every single brick can be placed in its correct place row and column, with padding between each brick, drawn at an offset from the left and top canvas edges.
... the final version of the drawbricks() function, after assigning the brickx and bricky values as the coordinates instead of (0,0) each time, will look like this — add this into your code below the drawpaddle() function: function drawbricks() { for(var c=0; c<brickcolumncount; c++) { for(var r=0; r<brickrowcount; r++) { var brickx = (c*(brickwidth+brickpadding))+brickoffsetleft; var bricky = (r*(brickheight+brickpadding))+brickoffsettop; bricks[c][r].x = brickx; bricks[c][r].y = bricky; ctx.beginpath(); ctx.rect(brickx, bricky, brickwidth, brickheight); ctx.fillstyle = "#0095dd"; ctx.fill(); ctx.closepath(); } } } actually drawing the bricks the last thing to d...
Build the brick field - Game development
to begin with we've included the brickinfo object, as this will come in handy very soon: function initbricks() { brickinfo = { width: 50, height: 20, count: { row: 3, col: 7 }, offset: { top: 50, left: 60 }, padding: 10 }; } this brickinfo object will hold all the information we need: the width and height of a single brick, the number of rows and columns of bricks we will see on screen, the top and left offset (the location on the canvas where we shall start to draw the bricks) and the padding between each row and column of bricks.
...update the brickx and bricky lines as follows: var brickx = (c*(brickinfo.width+brickinfo.padding))+brickinfo.offset.left; var bricky = (r*(brickinfo.height+brickinfo.padding))+brickinfo.offset.top; each brickx position is worked out as brickinfo.width plus brickinfo.padding, multiplied by the column number, c, plus the brickinfo.offset.left; the logic for the bricky is identical except that it uses the values for row number, r, brickinfo.height, and brickinfo.offset.top.
... now every single brick can be placed in its correct place, with padding between each brick, and drawn at an offset from the left and top canvas edges.
... checking the initbricks() code here is the complete code for the initbricks() function: function initbricks() { brickinfo = { width: 50, height: 20, count: { row: 3, col: 7 }, offset: { top: 50, left: 60 }, padding: 10 } bricks = game.add.group(); for(c=0; c<brickinfo.count.col; c++) { for(r=0; r<brickinfo.count.row; r++) { var brickx = (c*(brickinfo.width+brickinfo.padding))+brickinfo.offset.left; var bricky = (r*(brickinfo.height+brickinfo.padding))+brickinfo.offset.top; newbrick = game.add.sprite(brickx, bricky, 'brick'); game.physics.enable(newbrick, phaser.physics.arcade); newbrick.body.immovable = tru...
Investigating leaks using DMD heap scan mode
caveat: i think block_analyzer.py does not attempt to clamp the address you pass into it, so if it is an offset from the start of the block, it won’t find it.
... block_analyzer.py will return a series of entries that look like this (with the [...] indicating where i have removed things): 0x7f089306b000 size = 4096 bytes at byte offset 2168 nsattrandchildarray::growby[...] nsattrandchildarray::insertchildat[...] [...] 0x7f089306b000 is the address of the block that contains $leakaddr.
...the byte offset tells you were in the block the pointer is.
... example analysis of block_analyzer.py results in one debugging session where i was investigating the leak from bug 1451985, i eventually reduced the list of entries until this was the most suspicious looking entry: 0x7f0892f29630 size = 392 bytes at byte offset 56 mozilla::dom::scriptloader::processexternalscript[...] [...] i went to that line of scriptloader::processexternalscript(), and it contained a call to scriptloader::createloadrequest().
Optimizing Applications For NSPR
windows 3.1 does not support 64 bit file offsets.
... the nspr 64 bit file offset apis map to windows 3.1 32 bit file offset apis.
... you may use nspr's 64bit file offset apis in your windows 3.1 applications for cross platform consistency, but do not expect to see real 64 bit file offset behavior.
... on windows 3.1, when nspr detects a value in a 64 bit file offset greater than 32bit significance, it terminates with an assert.
PRSeekWhence
specifies how to interpret the offset parameter in setting the file pointer associated with the fd parameter for the pr_seek and pr_seek64 functions.
... syntax #include <prio.h> typedef prseekwhence { pr_seek_set = 0, pr_seek_cur = 1, pr_seek_end = 2 } prseekwhence; enumerators the enumeration has the following enumerators: pr_seek_set sets the file pointer to the value of the offset parameter.
... pr_seek_cur sets the file pointer to its current location plus the value of the offset parameter.
... pr_seek_end sets the file pointer to the size of the file plus the value of the offset parameter.
PR_MemMap
syntax #include <prio.h> void* pr_memmap( prfilemap *fmap, print64 offset, pruint32 len); parameters the function has the following parameters: fmap a pointer to the file-mapping object representing the file to be memory-mapped.
... offset the starting offset of the section of file to be mapped.
... the offset must be aligned to whole pages.
...the section of the file starts at offset and has the length len.
nss tech note1
offset† .
...if templates are nested, the offset applies to the location of the current component within the target component, typically the decoded sequence.
... sec_asn1_pointer: similar to sec_asn1_inline, except that the memory in the target will be allocated dynamically and a pointer to the dynamically allocated memory will be stored in the dest struct at the offset.
...the offset parameter specifies where to store the type identifier in the target data .
nsIHTMLEditor
void insertelementatselection(in nsidomelement aelement, in boolean adeleteselection); void insertfromdrop(in nsidomevent aevent); void inserthtml(in astring ainputstring); void inserthtmlwithcontext(in astring ainputstring, in astring acontextstr, in astring ainfostr, in astring aflavor, in nsidomdocument asourcedoc, in nsidomnode adestinationnode, in long adestinationoffset, in boolean adeleteselection); void insertlinkaroundselection(in nsidomelement aanchorelement); boolean isanonymouselement(in nsidomelement aelement); void makeorchangelist(in astring alisttype, in boolean entirelist, in astring abullettype); boolean nodeisblock(in nsidomnode node); void pastenoformatting(in long aselectiontype); void rebuildd...
... void inserthtmlwithcontext( in astring ainputstring, in astring acontextstr, in astring ainfostr, in astring aflavor, in nsidomdocument asourcedoc, in nsidomnode adestinationnode, in long adestinationoffset, in boolean adeleteselection ); parameters ainputstring the string to be inserted.
... aflavor transferable flavor, can be "" asourcedoc document where input was dragged from (may be null) adestinationnode location for insertion (such as when dropped) adestinationoffset used with adestnode to determine insert location.
... the selection is set to parent-of-aelement with an offset 1 greater than aelement's offset but it enforces the html 4.0 dtd "cancontain" rules, so it should be useful for other elements.
Debugger.Source - Firefox Developer Tools
introductionscript, introductionoffset if the instance refers to javascript source, and if this source was introduced by calling a function from debuggee code, then introductionscript is the debugger.script instance referring to the script containing that call, and introductionoffset is the call’s bytecode offset within that script.
...thus, setting a dom element’s event handler idl attribute by assigning to the corresponding javascript property creates a source whose introductionscript and introductionoffset refer to the property assignment.
... since a <script> element parsed from a web page’s original html was not introduced by any scripted call, its source’s introductionscript and introductionoffset accessors both return undefined.
...introductionoffset is undefined.
CanvasRenderingContext2D.shadowColor - Web APIs
one of the shadowblur, shadowoffsetx, or shadowoffsety properties must be non-zero, as well.
...the shadowcolor property sets the shadows' color, while shadowoffsetx and shadowoffsety set their position relative to the shapes.
... html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // shadow ctx.shadowcolor = 'red'; ctx.shadowoffsetx = 10; ctx.shadowoffsety = 10; // filled rectangle ctx.fillrect(20, 20, 100, 100); // stroked rectangle ctx.linewidth = 6; ctx.strokerect(170, 20, 100, 100); result shadows on translucent shapes a shadow's opacity is affected by the transparency level of its parent object (even when shadowcolor specifies a completely opaque value).
... const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // shadow ctx.shadowcolor = 'rgba(255, 0, 0, .8)'; ctx.shadowblur = 8; ctx.shadowoffsetx = 30; ctx.shadowoffsety = 20; // filled rectangle ctx.fillstyle = 'rgba(0, 255, 0, .2)'; ctx.fillrect(10, 10, 150, 100); // stroked rectangle ctx.linewidth = 10; ctx.strokestyle = 'rgba(0, 0, 255, .6)'; ctx.strokerect(10, 10, 150, 100); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.shadowcolor' in...
CanvasRenderingContext2D - Web APIs
canvasrenderingcontext2d.linedashoffset specifies where to start a dash array on a line.
... canvasrenderingcontext2d.shadowoffsetx horizontal distance the shadow will be offset.
... canvasrenderingcontext2d.shadowoffsety vertical distance the shadow will be offset.
... canvasrenderingcontext2d.webkitlinedashoffset use canvasrenderingcontext2d.linedashoffset instead.
CharacterData - Web APIs
characterdata.deletedata() removes the specified amount of characters, starting at the specified offset, from the characterdata.data string; when this method returns, data contains the shortened domstring.
... characterdata.insertdata() inserts the specified characters, at the specified offset, in the characterdata.data string; when this method returns, data contains the modified domstring.
... characterdata.replacedata() replaces the specified amount of characters, starting at the specified offset, with the specified domstring; when this method returns, data contains the modified domstring.
... characterdata.substringdata() returns a domstring containing the part of characterdata.data of the specified length and starting at the specified offset.
ConstantSourceNode - Web APIs
in addition, it can be used like a constructible audioparam by automating the value of its offset or by connecting another node to it; see controlling multiple parameters with constantsourcenode.
...the output's value is always the same as the value of the offset parameter.
... properties inherits properties from its parent interface, audioscheduledsourcenode, and adds the following properties: offset an audioparam which specifies the value that this source continuously outputs.
... now, whenever the value of constantnode.offset changes, the gain on both gainnode2 and gainnode3 will change to have that same value.
DataTransfer.setDragImage() - Web APIs
these coordinates define the offset into the image where the mouse cursor should be.
... syntax void datatransfer.setdragimage(img | element, xoffset, yoffset); arguments img | element an image element element to use for the drag feedback image.
... xoffset a long indicating the horizontal offset within the image.
... yoffset a long indicating the vertical offset within the image.
KeyframeEffect.getKeyframes() - Web APIs
the getkeyframes() method of a keyframeeffect returns an array of the computed keyframes that make up this animation along with their computed offsets.
... offset the offset of the keyframe specified as a number between 0.0 and 1.0 inclusive or null.
... computedoffset the computed offset for this keyframe, calculated when the list of computed keyframes was produced according to keyframeeffect.spacing.
... unlike offset, above, the computedoffset is never null.
Range.comparePoint() - Web APIs
if the reference node is a node of type text, comment, or cdatasection, then offset is the number of characters from the start of reference node.
... for other node types, offset is the number of child nodes between the start of the reference node.
... syntax returnvalue = range.comparepoint(referencenode, offset) parameters referencenode the node to compare with the range.
... offset an integer greater than or equal to zero representing the offset inside the referencenode.
StaticRange - Web APIs
the offset into the node at which the end position is located is indicated by endoffset.
... staticrange.endoffset read only returns an integer value indicating the offset into the node given by endcontainer at which the last character of the range is found.
... staticrange.startcontainer read only returns the dom node which contains the starting point of the range (which is in turn identified by startoffset.
... staticrange.startoffset read only returns an integer value indicating the offset into the node specified by startcontainer at which the first character of the range is located.
Touch() - Web APIs
WebAPITouchTouch
"clientx", optional and defaulting to 0, of type double, that is the horizontal position of the touch on the client window of user's screen, excluding any scroll offset.
... "clienty", optional and defaulting to 0, of type double, that is the vertical position of the touch on the client window of the user's screen, excluding any scroll offset.
... "pagex", optional and defaulting to 0, of type double, that is the horizontal position of the touch on the client window of user's screen, including any scroll offset.
... "pagey", optional and defaulting to 0, of type double, that is the vertical position of the touch on the client window of the user's screen, including any scroll offset.
Touch.clientX - Web APIs
WebAPITouchclientX
the touch.clientx read-only property returns the x coordinate of the touch point relative to the viewport, not including any scroll offset.
... syntax touchitem.clientx; return value a long representing the x coordinate of the touch point relative to the viewport, not including any scroll offset.
...the touch.clientx property is the horizontal coordinate of a touch point relative to the browser's viewport excluding any scroll offset.
... the touch.clienty property is the vertical coordinate of the touch point relative to the browser's viewport excluding any scroll offset .
Touch.clientY - Web APIs
WebAPITouchclientY
the touch.clienty read-only property returns the y coordinate of the touch point relative to the browser's viewport, not including any scroll offset.
... syntax touchitem.clienty; return value a long value representing the y coordinate of the touch point relative to the viewport, not including any scroll offset.
...the touch.clientx property is the horizontal coordinate of a touch point relative to the browser's viewport excluding any scroll offset.
... the touch.clienty property is the vertical coordinate of the touch point relative to the browser's viewport excluding any scroll offset .
Touch.pageX - Web APIs
WebAPITouchpageX
the touch.pagex read-only property returns the x coordinate of the touch point relative to the viewport, including any scroll offset.
... syntax touchitem.pagex; return value a long representing the x coordinate of the touch point relative to the viewport, including any scroll offset.
...the touch.pagex property is the horizontal coordinate of a touch point relative to the viewport (in css pixels), including any scroll offset.
... the touch.pagey property is the vertical coordinate of a touch point relative to the viewport (in css pixels), including any scroll offset.
Touch.pageY - Web APIs
WebAPITouchpageY
the touch.pagey read-only property returns the y coordinate of the touch point relative to the viewport, including any scroll offset.
... syntax touchitem.pagey; return value a long value that representes the y coordinate of the touch point relative to the viewport, including any scroll offset.
...the touch.pagex property is the horizontal coordinate of a touch point relative to the viewport (in css pixels), including any scroll offset.
... the touch.pagey property is the vertical coordinate of a touch point relative to the viewport (in css pixels), including any scroll offset.
Touch - Web APIs
WebAPITouch
touch.clientx read only returns the x coordinate of the touch point relative to the left edge of the browser viewport, not including any scroll offset.
... touch.clienty read only returns the y coordinate of the touch point relative to the top edge of the browser viewport, not including any scroll offset.
...unlike clientx, this value includes the horizontal scroll offset, if any.
...unlike clienty, this value includes the vertical scroll offset, if any.
VTTRegion - Web APIs
WebAPIVTTRegion
vttregion.regionanchorx a double representing the region anchor x offset, as a percentage of the region.
... vttregion.regionanchory a double representing the region anchor y offset, as a percentage of the region.
... vttregion.viewportanchorx a double representing the viewport anchor x offset, as a percentage of the video.
... vttregion.viewportanchory a double representing the viewport anchor y offset, as a percentage of the video.
Visual Viewport API - Web APIs
when called it queries the offsetleft and height properties for values it uses in a css translate() method.
... let pendingupdate = false; function viewporthandler(event) { if (pendingupdate) return; pendingupdate = true; requestanimationframe(() => { pendingupdate = false; var layoutviewport = document.getelementbyid('layoutviewport'); // since the bar is position: fixed we need to offset it by the // visual viewport's offset from the layout viewport origin.
... var viewport = event.target; var offsetleft = viewport.offsetleft; var offsettop = viewport.height - layoutviewport.getboundingclientrect().height + viewport.offsettop; // you could also do this by setting style.left and style.top if you // use width: 100% instead.
... bottombar.style.transform = 'translate(' + offsetleft + 'px,' + offsettop + 'px) ' + 'scale(' + 1/viewport.scale + ')' }) } window.visualviewport.addeventlistener('scroll', viewporthandler); window.visualviewport.addeventlistener('resize', viewporthandler); specifications specification status comment visual viewport apithe definition of 'visualviewport' in that specification.
WebGL2RenderingContext.copyTexSubImage3D() - Web APIs
syntax void gl.copytexsubimage3d(target, level, xoffset, yoffset, zoffset, x, y, width, height); parameters target a glenum specifying the binding point (target) of the active texture.
... xoffset a glint specifying the x offset within the texture image.
... yoffset a glint specifying the y offset within the texture image.
... zoffset a glint specifying the z offset within the texture image.
WebGL2RenderingContext.getBufferSubData() - Web APIs
syntax void gl.getbuffersubdata(target, srcbyteoffset, arraybufferview dstdata, optional dstoffset, optional length); parameters target a glenum specifying the binding point (target).
... srcbyteoffset a glintptr specifying the byte offset from which to start reading from the buffer.
... srcoffset optional a gluint specifying the element index offset where to start reading the buffer.
... exceptions an invalid_value error is generated if: offset + returneddata.bytelength would extend beyond the end of the buffer returneddata is null offset is less than zero.
WebGLRenderingContext.getParameter() - Web APIs
x_texture_image_units glint gl.max_texture_size glint gl.max_varying_vectors glint gl.max_vertex_attribs glint gl.max_vertex_texture_image_units glint gl.max_vertex_uniform_vectors glint gl.max_viewport_dims int32array (with 2 elements) gl.pack_alignment glint gl.polygon_offset_factor glfloat gl.polygon_offset_fill glboolean gl.polygon_offset_units glfloat gl.red_bits glint gl.renderbuffer_binding webglrenderbuffer or null see bindrenderbuffer.
...omponents glint64 gl.max_draw_buffers glint gl.max_element_index glint64 gl.max_elements_indices glint gl.max_elements_vertices glint gl.max_fragment_input_components glint gl.max_fragment_uniform_blocks glint gl.max_fragment_uniform_components glint gl.max_program_texel_offset glint gl.max_samples glint gl.max_server_wait_timeout glint64 gl.max_texture_lod_bias glfloat gl.max_transform_feedback_interleaved_components glint gl.max_transform_feedback_separate_attribs glint gl.max_transform_feedback_separate_components glint gl.max_uniform_block_size glint64 ...
... gl.max_uniform_buffer_bindings glint gl.max_varying_components glint gl.max_vertex_output_components glint gl.max_vertex_uniform_blocks glint gl.max_vertex_uniform_components glint gl.min_program_texel_offset glint gl.pack_row_length glint see pixelstorei.
... gl.uniform_buffer_offset_alignment glint see pixelstorei.
WebGLRenderingContext.texImage2D() - Web APIs
pixels); // webgl2: void gl.teximage2d(target, level, internalformat, width, height, border, format, type, glintptr offset); void gl.teximage2d(target, level, internalformat, width, height, border, format, type, htmlcanvaselement source); void gl.teximage2d(target, level, internalformat, width, height, border, format, type, htmlimageelement source); void gl.teximage2d(target, level, internalformat, width, height, border, format, type, htmlvideoelement source); void gl.teximage2d(target, level, internalformat, width, ...
...height, border, format, type, imagebitmap source); void gl.teximage2d(target, level, internalformat, width, height, border, format, type, imagedata source); void gl.teximage2d(target, level, internalformat, width, height, border, format, type, arraybufferview srcdata, srcoffset); parameters target a glenum specifying the binding point (target) of the active texture.
..._4 4 2 rgba unsigned_short_5_5_5_1 4 2 rgb unsigned_short_5_6_5 3 2 luminance_alpha unsigned_byte 2 2 luminance unsigned_byte 1 1 alpha unsigned_byte 1 1 other possible values in webgl2 for the versions of teximage2d that take an arraybufferview or a glintptr offset sized format base format r bits g bits b bits a bits shared bits color renderable texture filterable r8 red 8 ● ● r8_snorm red s8 ● rg8 rg 8 8 ● ● rg8_snorm rg s8 s8 ...
... offset (webgl 2 only) a glintptr byte offset into the webglbuffer's data store.
WebGL constants - Web APIs
0x0cf5 pack_alignment 0x0d05 max_texture_size 0x0d33 max_viewport_dims 0x0d3a subpixel_bits 0x0d50 red_bits 0x0d52 green_bits 0x0d53 blue_bits 0x0d54 alpha_bits 0x0d55 depth_bits 0x0d56 stencil_bits 0x0d57 polygon_offset_units 0x2a00 polygon_offset_factor 0x8038 texture_binding_2d 0x8069 sample_buffers 0x80a8 samples 0x80a9 sample_coverage_value 0x80aa sample_coverage_invert 0x80ab compressed_texture_formats 0x86a3 vendor 0x1f00 renderer 0x1f01 v...
... polygon_offset_fill 0x8037 passed to enable/disable to turn on/off the polygon offset.
...npack_image_height 0x806e max_3d_texture_size 0x8073 max_elements_vertices 0x80e8 max_elements_indices 0x80e9 max_texture_lod_bias 0x84fd max_fragment_uniform_components 0x8b49 max_vertex_uniform_components 0x8b4a max_array_texture_layers 0x88ff min_program_texel_offset 0x8904 max_program_texel_offset 0x8905 max_varying_components 0x8b4b fragment_shader_derivative_hint 0x8b8b rasterizer_discard 0x8c89 vertex_array_binding 0x85b5 max_vertex_output_components 0x9122 max_fragment_input_components 0x9125 max_server_wait_timeout 0...
... max_vertex_uniform_blocks 0x8a2b max_fragment_uniform_blocks 0x8a2d max_combined_uniform_blocks 0x8a2e max_uniform_buffer_bindings 0x8a2f max_uniform_block_size 0x8a30 max_combined_vertex_uniform_components 0x8a31 max_combined_fragment_uniform_components 0x8a33 uniform_buffer_offset_alignment 0x8a34 active_uniform_blocks 0x8a36 uniform_type 0x8a37 uniform_size 0x8a38 uniform_block_index 0x8a3a uniform_offset 0x8a3b uniform_array_stride 0x8a3c uniform_matrix_stride 0x8a3d uniform_is_row_major 0x8a3e uniform_block_binding ...
Window.scrollX - Web APIs
WebAPIWindowscrollX
if (window.scrollx > 400) { window.scroll(0,0); } notes the pagexoffset property is an alias for the scrollx property: window.pagexoffset == window.scrollx; // always true for cross-browser compatibility, use window.pagexoffset instead of window.scrollx.
...a fully compatible example: var x = (window.pagexoffset !== undefined) ?
... window.pagexoffset : (document.documentelement || document.body.parentnode || document.body).scrollleft; var y = (window.pageyoffset !== undefined) ?
... window.pageyoffset : (document.documentelement || document.body.parentnode || document.body).scrolltop; specification specification status comment css object model (cssom) view modulethe definition of 'window.scrollx' in that specification.
Window - Web APIs
WebAPIWindow
window.pagexoffset read only an alias for window.scrollx.
... window.pageyoffset read only an alias for window.scrolly window.parent read only returns a reference to the parent of the current window or subframe.
... window.scrollmaxx read only the maximum offset that the window can be scrolled to horizontally, that is the document width minus the viewport width.
... window.scrollmaxy read only the maximum offset that the window can be scrolled to vertically (i.e., the document height minus the viewport height).
Relationship of grid layout to other layout methods - CSS: Cascading Style Sheets
in this example the grid container is the containing block and so the absolute positioning offset values are calculated in from the outer edges of the area it has been placed into.
...then it is offset in that area using the top and left properties.
... i have given .box3 position relative and then positioned the sub-item with the offset properties.
...in this example the grid area is the containing block and so the absolute positioning offset values are calculated in from the outer edges of the grid area.
<shape> - CSS: Cascading Style Sheets
WebCSSshape
rect() rect(top, right, bottom, left) values top is a <length> representing the offset for the top of the rectangle relative to the top border of the element's box.
... right is a <length> representing the offset for the right of the rectangle relative to the left border of the element's box.
... bottom is a <length> representing the offset for the bottom of the rectangle relative to the top border of the element's box.
... left is a <length> representing the offset for the left of the rectangle relative to the left border of the element's box.
DataView() constructor - JavaScript
syntax new dataview(buffer [, byteoffset [, bytelength]]) parameters buffer an existing arraybuffer or sharedarraybuffer to use as the storage backing the new dataview object.
... byteoffset optional the offset, in bytes, to the first byte in the above buffer for the new view to reference.
... exceptions rangeerror thrown if the byteoffset or bytelength parameter values result in the view extending past the end of the buffer.
... for example, if the buffer is 16 bytes long, the byteoffset is 8, and the bytelength is 10, this error is thrown because the resulting view tries to extend 2 bytes past the total length of the buffer.
DataView.prototype.getBigInt64() - JavaScript
the getbigint64() method gets a signed 64-bit integer (long long) at the specified byte offset from the start of the dataview.
... syntax dataview.getbigint64(byteoffset [, littleendian]) parameters byteoffset the offset, in bytes, from the start of the view to read the data from.
... errors thrown rangeerror thrown if the byteoffset is set such that it would read beyond the end of the view.
... description there is no alignment constraint; multi-byte values may be fetched from any offset.
DataView.prototype.getBigUint64() - JavaScript
the getbiguint64() method gets an unsigned 64-bit integer (unsigned long long) at the specified byte offset from the start of the dataview.
... syntax dataview.getbiguint64(byteoffset [, littleendian]) parameters byteoffset the offset, in bytes, from the start of the view to read the data from.
... errors thrown rangeerror thrown if the byteoffset is set such that it would read beyond the end of the view.
... description there is no alignment constraint; multi-byte values may be fetched from any offset.
DataView.prototype.getFloat32() - JavaScript
the getfloat32() method gets a signed 32-bit float (float) at the specified byte offset from the start of the dataview.
... syntax dataview.getfloat32(byteoffset [, littleendian]) parameters byteoffset the offset, in byte, from the start of the view where to read the data.
... errors thrown rangeerror thrown if the byteoffset is set such as it would read beyond the end of the view.
... description there is no alignment constraint; multi-byte values may be fetched from any offset.
DataView.prototype.getFloat64() - JavaScript
the getfloat64() method gets a signed 64-bit float (double) at the specified byte offset from the start of the dataview.
... syntax dataview.getfloat64(byteoffset [, littleendian]) parameters byteoffset the offset, in byte, from the start of the view where to read the data.
... errors thrown rangeerror thrown if the byteoffset is set such as it would read beyond the end of the view.
... description there is no alignment constraint; multi-byte values may be fetched from any offset.
DataView.prototype.getInt16() - JavaScript
the getint16() method gets a signed 16-bit integer (short) at the specified byte offset from the start of the dataview.
... syntax dataview.getint16(byteoffset [, littleendian]) parameters byteoffset the offset, in byte, from the start of the view where to read the data.
... errors thrown rangeerror thrown if the byteoffset is set such as it would read beyond the end of the view.
... description there is no alignment constraint; multi-byte values may be fetched from any offset.
DataView.prototype.getInt32() - JavaScript
the getint32() method gets a signed 32-bit integer (long) at the specified byte offset from the start of the dataview.
... syntax dataview.getint32(byteoffset [, littleendian]) parameters byteoffset the offset, in bytes, from the start of the view where to read the data.
... errors thrown rangeerror thrown if the byteoffset is set such as it would read beyond the end of the view.
... description there is no alignment constraint; multi-byte values may be fetched from any offset.
DataView.prototype.getInt8() - JavaScript
the getint8() method gets a signed 8-bit integer (byte) at the specified byte offset from the start of the dataview.
... syntax dataview.getint8(byteoffset) parameters byteoffset the offset, in byte, from the start of the view where to read the data.
... errors thrown rangeerror thrown if the byteoffset is set such as it would read beyond the end of the view.
... description there is no alignment constraint; multi-byte values may be fetched from any offset.
DataView.prototype.getUint16() - JavaScript
the getuint16() method gets an unsigned 16-bit integer (unsigned short) at the specified byte offset from the start of the dataview.
... syntax dataview.getuint16(byteoffset [, littleendian]) parameters byteoffset the offset, in byte, from the start of the view where to read the data.
... errors thrown rangeerror thrown if the byteoffset is set such as it would read beyond the end of the view.
... description there is no alignment constraint; multi-byte values may be fetched from any offset.
DataView.prototype.getUint32() - JavaScript
the getuint32() method gets an unsigned 32-bit integer (unsigned long) at the specified byte offset from the start of the dataview.
... syntax dataview.getuint32(byteoffset [, littleendian]) parameters byteoffset the offset, in byte, from the start of the view where to read the data.
... errors thrown rangeerror thrown if the byteoffset is set such as it would read beyond the end of the view.
... description there is no alignment constraint; multi-byte values may be fetched from any offset.
DataView.prototype.getUint8() - JavaScript
the getuint8() method gets an unsigned 8-bit integer (unsigned byte) at the specified byte offset from the start of the dataview.
... syntax dataview.getuint8(byteoffset) parameters byteoffset the offset, in byte, from the start of the view where to read the data.
... errors thrown rangeerror thrown if the byteoffset is set such as it would read beyond the end of the view.
... description there is no alignment constraint; multi-byte values may be fetched from any offset.
String.prototype.replace() - JavaScript
offset the offset of the matched substring within the whole string being examined.
... (the exact number of arguments depends on whether the first argument is a regexp object—and, if so, how many parenthesized submatches it specifies.) the following example will set newstring to 'abc - 12345 - #$*%': function replacer(match, p1, p2, p3, offset, string) { // p1 is nondigits, p2 digits, and p3 non-alphanumerics return [p1, p2, p3].join(' - '); } let newstring = 'abc12345#$*%'.replace(/([^\d]*)(\d*)([^\w]*)/, replacer); console.log(newstring); // abc - 12345 - #$*% examples defining the regular expression in replace() in the following example, the regular expression is defined in replace() and includes the ignore case flag.
... function stylehyphenformat(propertyname) { function uppertohyphenlower(match, offset, string) { return (offset > 0 ?
... function f2c(x) { function convert(str, p1, offset, s) { return ((p1 - 32) * 5/9) + 'c'; } let s = string(x); let test = /(-?\d+(?:\.\d*)?)f\b/g; return s.replace(test, convert); } specifications specification ecmascript (ecma-262)the definition of 'string.prototype.replace' in that specification.
TypedArray.prototype.set() - JavaScript
syntax typedarray.set(array[, offset]) typedarray.set(typedarray[, offset]) parameters array the array from which to copy values.
... all values from the source array are copied into the target array, unless the length of the source array plus the offset exceeds the length of the target array, in which case an exception is thrown.
... offset optional the offset into the target array at which to begin writing values from the source array.
... exceptions a rangeerror, if the offset is set such as it would store beyond the end of the typed array.
TypedArray - JavaScript
these objects all have a common syntax for their constructors: new typedarray(); new typedarray(length); new typedarray(typedarray); new typedarray(object); new typedarray(buffer [, byteoffset [, length]]); where typedarray is a constructor for one of the concrete types.
... buffer, byteoffset, length when called with a buffer, and optionally a byteoffset and a length argument, a new typed array view is created that views the specified arraybuffer.
... the byteoffset and length parameters specify the memory range that will be exposed by the typed array view.
... typedarray.prototype.byteoffset returns the offset (in bytes) of the typed array from the start of its arraybuffer.
spreadMethod - SVG: Scalable Vector Graphics
examples of spreadmethod with linear gradients svg <svg width="220" height="150" xmlns="http://www.w3.org/2000/svg"> <defs> <lineargradient id="padgradient" x1="33%" x2="67%"> <stop offset="0%" stop-color="fuchsia"/> <stop offset="100%" stop-color="orange"/> </lineargradient> <lineargradient id="reflectgradient" spreadmethod="reflect" x1="33%" x2="67%"> <stop offset="0%" stop-color="fuchsia"/> <stop offset="100%" stop-color="orange"/> </lineargradient> <lineargradient id="repeatgradient" spreadmethod="repeat" ...
... x1="33%" x2="67%"> <stop offset="0%" stop-color="fuchsia"/> <stop offset="100%" stop-color="orange"/> </lineargradient> </defs> <rect fill="url(#padgradient)" x="10" y="0" width="200" height="40"/> <rect fill="url(#reflectgradient)" x="10" y="50" width="200" height="40"/> <rect fill="url(#repeatgradient)" x="10" y="100" width="200" height="40"/> </svg> result notice that the middle third of each gradient is the same.
... examples of spreadmethod with radial gradients svg <svg width="340" height="120" xmlns="http://www.w3.org/2000/svg"> <defs> <radialgradient id="radialpadgradient" cx="75%" cy="25%" r="33%" fx="64%" fy="18%" fr="17%"> <stop offset="0%" stop-color="fuchsia"/> <stop offset="100%" stop-color="orange"/> </radialgradient> <radialgradient id="radialreflectgradient" spreadmethod="reflect" cx="75%" cy="25%" r="33%" fx="64%" fy="18%" fr="17%"> <stop offset="0%" stop-color="fuchsia"/> <stop offset="100%" stop-color="orange"/> </radialgradient> <radialgradient id="radialrepeatgradient" ...
... spreadmethod="repeat" cx="75%" cy="25%" r="33%" fx="64%" fy="18%" fr="17%"> <stop offset="0%" stop-color="fuchsia"/> <stop offset="100%" stop-color="orange"/> </radialgradient> </defs> <rect fill="url(#radialpadgradient)" x="10" y="10" width="100" height="100"/> <rect fill="url(#radialreflectgradient)" x="120" y="10" width="100" height="100"/> <rect fill="url(#radialrepeatgradient)" x="230" y="10" width="100" height="100"/> </svg> result specifications specification status comment scalable vector graphics (svg) 2the definition of 'spreadmethod for <radialgradient>' in that specification.
transform-origin - SVG: Scalable Vector Graphics
-percentage> | left | center | right | top | bottom ] | [ [ <length-percentage> | left | center | right ] && [ <length-percentage> | top | center | bottom ] ] <length>?where <length-percentage> = <length> | <percentage> default value 50%, 50% animatable yes the transform-origin property may be specified using one, two, or three values, where each value represents an offset.
... offsets that are not explicitly defined are reset to their corresponding initial values.
... if two or more values are defined and either no value is a keyword, or the only used keyword is center, then the first value represents the horizontal offset and the second represents the vertical offset.
...it always represents the z offset.
Patterns - SVG: Scalable Vector Graphics
WebSVGTutorialPatterns
<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg"> <defs> <lineargradient id="gradient1"> <stop offset="5%" stop-color="white"/> <stop offset="95%" stop-color="blue"/> </lineargradient> <lineargradient id="gradient2" x1="0" x2="0" y1="0" y2="1"> <stop offset="5%" stop-color="red"/> <stop offset="95%" stop-color="orange"/> </lineargradient> <pattern id="pattern" x="0" y="0" width=".25" height=".25"> <rect x="0" y="0" width="50" height="50" fill="skyblue"/> ...
...there are also x and y attributes available if you want to offset the start point of this rectangle somewhere within your drawing.
...the pattern also had to be offset by 10 pixels so that it would start in the upper-left corner of our box, so the x and y attributes of the pattern had to be adjusted to 10÷200 = 0.05.
...pattern" width=".25" height=".25" patterncontentunits="objectboundingbox"> <rect x="0" y="0" width=".25" height=".25" fill="skyblue"/> <rect x="0" y="0" width=".125" height=".125" fill="url(#gradient2)"/> <circle cx=".125" cy=".125" r=".1" fill="url(#gradient1)" fill-opacity="0.5"/> </pattern> now, because the pattern content is in the same unit system as the pattern, we don't have to offset the box so that the pattern starts in the correct place, and if the object size was changed to a larger one, the pattern would automatically scale so that it had the same number of objects and repeats inside it.
listbox - Archive of obsolete content
keynavigation, itemcount, listboxobject, selectedcount, selectedindex, selecteditem, selecteditems, seltype, suppressonselect, tabindex, value methods additemtoselection, appenditem, clearselection, ensureelementisvisible, ensureindexisvisible, getindexoffirstvisiblerow, getindexofitem, getitematindex, getnumberofvisiblerows, getrowcount, getselecteditem, insertitemat, invertselection, movebyoffset, removeitemat, removeitemfromselection, scrolltoindex, selectall, selectitem, selectitemrange, timedselect, toggleitemselection examples <listbox id="thelist"> <listitem label="ruby"/> <listitem label="emerald"/> <listitem label="sapphire" selected="true"/> <listitem label="diamond"/> </listbox> <listbox id="thelist" rows="10" width="400"> <listhead> <listheader label="1ct ...
... 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.
richlistbox - Archive of obsolete content
ynavigation, itemcount, scrollboxobject, selectedcount, selectedindex, selecteditem, selecteditems, seltype, suppressonselect, tabindex, value methods additemtoselection, appenditem, clearselection, ensureelementisvisible, ensureindexisvisible, getindexoffirstvisiblerow, getindexofitem, getitematindex, getnumberofvisiblerows, getrowcount, getselecteditem, insertitemat, invertselection, movebyoffset, removeitemat, removeitemfromselection, scrolltoindex, selectall, selectitem, selectitemrange, timedselect, toggleitemselection examples <richlistbox> <richlistitem> <description>a xul description!</description> </richlistitem> <richlistitem> <button label="a xul button"/> </richlistitem> </richlistbox> the richlistbox element contains multiple richlistitem elements, which ca...
... 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.
Browser Detection and Cross Browser Support - Archive of obsolete content
if (document.all) { // ie4 height = document.body.offsetheight; } else if (document.layers) { // nn4 height = window.innerheight; } else { // other height = 0; } with the introduction of the w3c dom, the standard method document.getelementbyid became available in internet explorer 5 and later in netscape 6 (gecko).
...if (document.all) { // ie4 height = document.body.offsetheight; } else if (document.layers) { // nn4 height = window.innerheight; } else if (document.getelementbyid) { // they think this is gecko // but could be wrong!
... if (document.body && typeof(document.body.offsetheight) == 'number') { height = document.body.offsetheight; } else if (typeof(window.innerheight) == 'number') { height = window.innerheight; } else { height = 0; } note how the previous example does not make assumptions about which browser is being used.
Accessibility/LiveRegionDevGuide
in iaccessible2, iaccessibletext::get_oldtext and iaccessibletext::get_newtext are used to acquire the text and offsets.
...the text offsets associated with a text changed event are used when supporting this property.
... the offsets can be acquired directly in a text changed event object in at-spi and through the use of iaccessibletext::get_oldtext and iaccessibletext::get_newtext in iaccessible2.
Extras
o> <mtable> <mtr> <mtd><mn>1</mn></mtd> <mtd> <mtext> <img width="16" height="16" src="https://udn.realityripple.com/samples/3f/9341cbddc0.png" alt="mozilla-16" /> </mtext> </mtd> </mtr> <mtr> <mtd> <mtext><input value="type" size="4"/></mtext> </mtd> <mtd><mn>4</mn></mtd> </mtr> </mtable> <mo>]</mo> </mrow> </math> <math display="block"> <msqrt> <mpadded width="30px" height="15px" depth="15px" voffset="-15px"> <mtext> <svg width="30px" height="30px"> <defs> <radialgradient id="radgrad1" cx="50%" cy="50%" r="50%" fx="50%" fy="50%"> <stop offset="0%" style="stop-color:rgb(255,255,255); stop-opacity:1;"/> <stop offset="100%" style="stop-color:rgb(255,0,0); stop-opacity:.8;"/> </radialgradient> </defs> <g transform="translate(15,1...
... 10 l 30 15 l 20 20 l 15 30 l 10 20 l 0 15 l 10 10"/> </g> </g> </g> </svg> </mtext> </mpadded> </msqrt> <mo>=</mo> <msubsup> <mo>∫</mo> <mn>0</mn> <mfrac> <mi>π</mi> <mn>2</mn> </mfrac> </msubsup> <msup> <mi>θ</mi> <mtext> <svg width="15px" height="15px"> <defs> <radialgradient id="radgrad2" cx="50%" cy="50%" r="50%" fx="50%" fy="50%"> <stop offset="0%" style="stop-color:rgb(255,255,255); stop-opacity:1;"/> <stop offset="100%" style="stop-color:rgb(0,0,255); stop-opacity:.9;"/> </radialgradient> </defs> <g> <animatemotion path="m0,0 l3,0 l2,5 l5,5 l0,4 l5,2 z" begin="0s" dur="0.5s" repeatcount="indefinite"/> <circle fill="url(#radgrad2)" r="5px" cx="5px" cy="5px"/> </g> </svg> </m...
...text> </msup> <mrow> <mo>ⅆ</mo> <mi>θ</mi> </mrow> </math> <div style="width: 300px; margin-left: auto; margin-right: auto;"> <svg width="300px" height="250px"> <defs> <lineargradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%"> <stop offset="0%" style="stop-color:rgb(0,0,255);stop-opacity:1"/> <stop offset="100%" style="stop-color:rgb(0,255,0);stop-opacity:1"/> </lineargradient> <lineargradient id="grad2" x1="0%" y1="0%" x2="0%" y2="100%"> <stop offset="0%" style="stop-color:rgb(255,0,0);stop-opacity:1"/> <stop offset="100%" style="stop-color:rgb(255,255,0);stop-opacity:1"/> </lineargradient> <radialgradient id="grad3" cx="50%" cy="50%" r="50%" fx="50%" fy="50%"> <stop offset="0%" style="stop-color:rgb(0,255,255);stop-opacity:1"/> <stop offset="100%" style="stop-color:rgb(255,255,255);st...
PR_GMTParameters
returns the time zone offset information that maps the specified prexplodedtime to gmt.
... syntax #include <prtime.h> prtimeparameters pr_gmtparameters ( const prexplodedtime *gmt); parameter gmt a pointer to the clock/calendar time whose offsets are to be determined.
... returns a time parameters structure that expresses the time zone offsets at the specified time.
PR_LocalTimeParameters
returns the time zone offset information that maps the specified prexplodedtime to local time.
... syntax #include <prtime.h> prtimeparameters pr_localtimeparameters ( const prexplodedtime *gmt); parameter gmt a pointer to the clock/calendar time whose offsets are to be determined.
... returns a time parameters structure that expresses the time zone offsets at the specified time.
JS::CompileOptions
tnoscriptrval(bool nsr) owningcompileoptions &setselfhostingmode(bool shm) owningcompileoptions &setcanlazilyparse(bool clp) owningcompileoptions &setsourceislazy(bool l) owningcompileoptions &setintroductiontype(const char *t) bool setintroductioninfo(jscontext *cx, const char *introducerfn, const char *intro, unsigned line, jsscript *script, uint32_t offset) duplicate null-terminated string introducerfn for introducerfilename and set introductiontype, introductionlineno, introductionscriptroot, introductionoffset, and hasintroductioninfo properties.
... compileoptions &setnoscriptrval(bool nsr) compileoptions &setselfhostingmode(bool shm) compileoptions &setcanlazilyparse(bool clp) compileoptions &setsourceislazy(bool l) compileoptions &setintroductiontype(const char *t) compileoptions &setintroductioninfo(const char *introducerfn, const char *intro, unsigned line, jsscript *script, uint32_t offset) compileoptions &maybemakestrictmode(bool strict) properties properties of js::readonlycompileoptions name type description version jsversion version of the script.
... introductionoffset uint32_t bytecode offset in the code which introduces this source code.
Insert
aposition [in] an offset into the string's internal buffer specifying where to place the given characters.
...aposition [in] an offset into the string's internal buffer specifying where to place the given characters.
...aposition [in] an offset into the string's internal buffer specifying where to place the given characters.
Insert
aposition [in] an offset into the string's internal buffer specifying where to place the given characters.
...aposition [in] an offset into the string's internal buffer specifying where to place the given characters.
...aposition [in] an offset into the string's internal buffer specifying where to place the given characters.
nsIContentView
scrollx float horizontal scroll offset in chrome-document css pixels.
... when this view is active (that is it is being painted because it's in the visible region of the screen), this value is at first lined up with the content's scroll offset.
... scrolly float horizontal scroll offset in chrome-document css pixels.
nsIDOMHTMLAudioElement
last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) inherits from: nsidomhtmlmediaelement method overview unsigned long long mozcurrentsampleoffset(); void mozsetup(in pruint32 channels, in pruint32 rate); [implicit_jscontext] unsigned long mozwriteaudio(in jsval data); methods mozcurrentsampleoffset() non-standard this feature is non-standard and is not on a standards track.
... returns the current offset of the audio stream, specified as the number of samples that have played since the beginning of the stream.
... unsigned long long mozcurrentsampleoffset(); parameters none.
nsIDocShell
void preparefornewcontentmodel(); void resumerefreshuris(); void setchildoffset(in unsigned long offset); native code only!
...native code only!setchildoffset set the offset of this child in its container.
... void setchildoffset( in unsigned long offset ); parameters offset the offset of this nsidocshell within its parent.
nsIDragService
if this is supplied, the aimagex and aimagey arguments specify the offset within the image where the cursor would be positioned.
... that is, when the image is drawn, it is offset up and left the amount so that the cursor appears at that location within the image.
... if aimage is null, aimagex and aimagey are not used and the image is instead determined from the source node adomnode, and the offset calculated so that the initial location for the image appears in the same screen position as where the element is located.
nsIResumableChannel
methods asyncopenat() obsolete since gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) open this channel, and read starting at the specified offset.
...startpos the starting offset, in bytes, to use to download.
...void resumeat( in unsigned long long startpos, in acstring entityid ); parameters startpos the starting offset, in bytes, to use to download.
nsISelection2
method overview void getrangesforinterval(in nsidomnode beginnode, in print32 beginoffset, in nsidomnode endnode, in print32 endoffset, in prbool allowadjacent, out pruint32 resultcount, [retval, array, size_is(resultcount)] out nsidomrange results); void getrangesforintervalcomarray(in nsidomnode beginnode, in print32 beginoffset, in nsidomnode endnode, in print32 endoffset, in prbool allowadjacent, in rangearray results); native code only!
... void getrangesforinterval( in nsidomnode beginnode, in print32 beginoffset, in nsidomnode endnode, in print32 endoffset, in prbool allowadjacent, out pruint32 resultcount, [retval, array, size_is(resultcount)] out nsidomrange results ); parameters beginnode beginoffset endnode endoffset these four parameters represent the range to compare against the selection.
... native code only!getrangesforintervalcomarray void getrangesforintervalcomarray( in nsidomnode beginnode, in print32 beginoffset, in nsidomnode endnode, in print32 endoffset, in prbool allowadjacent, in rangearray results ); parameters beginnode beginoffset endnode endoffset these four parameters represent the range to compare against the selection.
nsIStreamListener
method overview void ondataavailable(in nsirequest arequest, in nsisupports acontext, in nsiinputstream ainputstream, in unsigned long aoffset, in unsigned long acount); methods ondataavailable() this method is called when the next chunk of data for the ongoing request may be read without blocking the calling thread.
...void ondataavailable( in nsirequest arequest, in nsisupports acontext, in nsiinputstream ainputstream, in unsigned long aoffset, in unsigned long acount ); parameters arequest an nsirequest indicating the source of the data.
...aoffset number of bytes that were sent in previous ondataavailable() calls for this request.
Streams - Plugins
int32 npp_write(npp instance, npstream *stream, int32 offset, int32 len, void *buf); the instance parameter is the current plug-in instance; the stream parameter specifies the current stream.
... the offset parameter specifies the offset, in bytes, of buf from the beginning of the data in the stream.
...so, you'll need to pay attention to the offsets as data is being written.
ANGLE_instanced_arrays.drawElementsInstancedANGLE() - Web APIs
syntax void ext.drawelementsinstancedangle(mode, count, type, offset, primcount); parameters mode a glenum specifying the type primitive to render.
...possible values are: gl.unsigned_byte gl.unsigned_short when using the oes_element_index_uint extension: gl.unsigned_int offset a glintptr specifying an offset in the element array buffer.
... if offset is a invalid multiple of the size of the given type, a gl.invalid_operation error is thrown.
AudioScheduledSourceNode.start() - Web APIs
syntax audioscheduledsourcenode.start([when [, offset [, duration]]]); parameters when optional the time, in seconds, at which the sound should begin to play.
... offset optional a floating-point number indicating the offset, in seconds, into the audio buffer where playback should begin.
...if no value is passed then the duration will be equal to the length of the audio buffer minus the offset value return value undefined exceptions invalidstatenode the node has already been started.
Determining the dimensions of elements - Web APIs
if you need to know the total amount of space an element occupies, including the width of the visible content, scrollbars (if any), padding, and border, you want to use the htmlelement.offsetwidth and htmlelement.offsetheight properties.
...in case of transforms, the offsetwidth and offsetheight returns the element's layout width and height, while getboundingclientrect() returns the rendering width and height.
... as an example, if the element has width: 100px; and transform: scale(0.5); the getboundingclientrect() will return 50 as the width, while offsetwidth will return 100.
CanvasRenderingContext2D.filter - Web APIs
a drop shadow is effectively a blurred, offset version of the drawing's alpha mask drawn in a particular color, composited below the drawing.
... this function takes up to five arguments: <offset-x>: see <length> for possible units.
... <offset-y>: see <length> for possible units.
ConstantSourceNode() - Web APIs
options a constantsourceoptions dictionary object defining the properties you want the constantsourcenode to have: offset: a read-only audioparam specifying the constant value generated by the source.
... example in this example, an audio context is created, then a constantsourcenode is established with its offset initialized to 0.5.
... let audiocontext = new audiocontext(); let myconstantsource = new constantsourcenode(audiocontext, { offset: 0.5 }); note: the new constantsourcenode created by the constructor has a channelcount of 2.
DocumentOrShadowRoot.caretPositionFromPoint() - Web APIs
the caretpositionfrompoint() property of the documentorshadowroot interface returns a caretposition object, containing the dom node, along with the caret and caret's character offset within that node.
...stet clita kasd gubergren, no sea takimata sanctus est lorem ipsum dolor sit amet.</p> javascript content function insertbreakatpoint(e) { var range; var textnode; var offset; if (document.caretpositionfrompoint) { range = document.caretpositionfrompoint(e.clientx, e.clienty); textnode = range.offsetnode; offset = range.offset; } else if (document.caretrangefrompoint) { range = document.caretrangefrompoint(e.clientx, e.clienty); textnode = range.startcontainer; offset = range.startoffset; } // only split text_nodes if (textnode.node...
...type == 3) { var replacement = textnode.splittext(offset); var br = document.createelement('br'); textnode.parentnode.insertbefore(br, replacement); } } window.onload = function (){ var paragraphs = document.getelementsbytagname("p"); for (i=0 ; i < paragraphs.length; i++) { paragraphs[i].addeventlistener("click", insertbreakatpoint, false); } }; specifications specification status comment css object model (cssom) view modulethe definition of 'caretpositionfrompoint()' in that specification.
Element - Web APIs
WebAPIElement
element.scrollleft is a number representing the left scroll offset of the element.
... element.scrollleftmax read only returns a number representing the maximum left scroll offset possible for the element.
... element.scrolltopmax read only returns a number representing the maximum top scroll offset possible for the element.
GlobalEventHandlers.onkeypress - Web APIs
*/ (function () { const ssecret = /* choose your hidden word...: */ "exit"; let noffset = 0; document.onkeypress = function(opevt) { let oevent = opevt || window.event, nchr = oevent.charcode, snodetype = oevent.target.nodename.touppercase(); if (nchr === 0 || oevent.target.contenteditable.touppercase() === "true" || snodetype === "textarea" || snodetype === "input" && oevent.target.type.touppercase() === "text") { return tru...
...e; } if (nchr !== ssecret.charcodeat(noffset)) { noffset = nchr === ssecret.charcodeat(0) ?
... 1 : 0; } else if (noffset < ssecret.length - 1) { noffset++; } else { noffset = 0; /* do something here...
Drag Operations - Web APIs
event.datatransfer.setdragimage(image, xoffset, yoffset); three arguments are necessary.
...the second and third arguments to the setdragimage() method are offsets where the image should appear relative to the mouse pointer.
...as the canvas is 50×50 pixels, we use offsets of half of this (25) so that the image appears centered on the mouse pointer.
MediaSessionActionDetails - Web APIs
seekoffset optional if the action is either seekforward or seekbackward and this property is present, it is a floating point value which indicates the number of seconds to move the play position forward or backward.
...the mediasessionactiondetails property seekoffset specifies the amount of time to seek backward.
...the mediasessionactiondetails property seekoffset specifies the amount of time to seek forward.
MouseEvent - Web APIs
mouseevent.offsetx read only the x coordinate of the mouse pointer relative to the position of the padding edge of the target node.
... mouseevent.offsety read only the y coordinate of the mouse pointer relative to the position of the padding edge of the target node.
... working draft from document object model (dom) level 3 events specification, added offsetx and offsety, pagex and pagey, x, and y properties.
PannerNode.coneInnerAngle - Web APIs
the x and z components are always at a 90° to each other, so we can use the sine and cosine functions, which are offset by the same amount in radians.
...it's more useful to offset the angle by -90°, which means the pannernode will point directly at the listener at 0° rotation.
...rotation in the 'horizontal plane') to an orientation vector const yrotationtovector = degrees => { // convert degrees to radians and offset the angle so 0 points towards the listener const radians = (degrees - 90) * (math.pi / 180); // using cosine and sine here ensures the output values are always normalised // i.e.
PannerNode.coneOuterAngle - Web APIs
the x and z components are always at a 90° to each other, so we can use the sine and cosine functions, which are offset by the same amount in radians.
...it's more useful to offset the angle by -90°, which means the pannernode will point directly at the listener at 0° rotation.
...rotation in the 'horizontal plane') to an orientation vector const yrotationtovector = degrees => { // convert degrees to radians and offset the angle so 0 points towards the listener const radians = (degrees - 90) * (math.pi / 180); // using cosine and sine here ensures the output values are always normalised // i.e.
PannerNode.coneOuterGain - Web APIs
the x and z components are always at a 90° to each other, so we can use the sine and cosine functions, which are offset by the same amount in radians.
...it's more useful to offset the angle by -90°, which means the pannernode will point directly at the listener at 0° rotation.
...rotation in the 'horizontal plane') to an orientation vector const yrotationtovector = degrees => { // convert degrees to radians and offset the angle so 0 points towards the listener const radians = (degrees - 90) * (math.pi / 180); // using cosine and sine here ensures the output values are always normalised // i.e.
PannerNode.orientationX - Web APIs
the x and z components are always at a 90° to each other, so we can use the sine and cosine functions, which are offset by the same amount in radians.
...it's more useful to offset the angle by -90°, which means the pannernode will point directly at the listener at 0° rotation.
...rotation in the 'horizontal plane') to an orientation vector const yrotationtovector = degrees => { // convert degrees to radians and offset the angle so 0 points towards the listener const radians = (degrees - 90) * (math.pi / 180); // using cosine and sine here ensures the output values are always normalised // i.e.
PannerNode.orientationY - Web APIs
the x and z components are always at a 90° to each other, so we can use the sine and cosine functions, which are offset by the same amount in radians.
...it's more useful to offset the angle by -90°, which means the pannernode will point directly at the listener at 0° rotation.
...rotation in the 'horizontal plane') to an orientation vector const yrotationtovector = degrees => { // convert degrees to radians and offset the angle so 0 points towards the listener const radians = (degrees - 90) * (math.pi / 180); // using cosine and sine here ensures the output values are always normalised // i.e.
PannerNode.orientationZ - Web APIs
the x and z components are always at a 90° to each other, so we can use the sine and cosine functions, which are offset by the same amount in radians.
...it's more useful to offset the angle by -90°, which means the pannernode will point directly at the listener at 0° rotation.
...rotation in the 'horizontal plane') to an orientation vector const yrotationtovector = degrees => { // convert degrees to radians and offset the angle so 0 points towards the listener const radians = (degrees - 90) * (math.pi / 180); // using cosine and sine here ensures the output values are always normalised // i.e.
Range.isPointInRange() - Web APIs
it returns true if the point (cursor position) at offset within referencenode is within this range.
... syntax bool = range.ispointinrange( referencenode, offset ) parameters referencenode the node to compare with the range.
... offset the offset into node of the point to compare with the range.
Selection.extend() - Web APIs
WebAPISelectionextend
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.
... nochrome android full support yesfirefox android full support yesopera android full support yessafari ios full support yessamsung internet android full support yesoffset parameter is optional experimentalchrome full support yesedge full support ≤79firefox full support 55ie no support noopera full support yessafari full suppo...
WebGL2RenderingContext.drawElementsInstanced() - Web APIs
syntax void gl.drawelementsinstanced(mode, count, type, offset, instancecount); parameters mode a glenum specifying the type primitive to render.
...possible values are: gl.unsigned_byte gl.unsigned_short when using the oes_element_index_uint extension: gl.unsigned_int offset a glintptr specifying an offset in the element array buffer.
... if offset is a valid multiple of the size of the given type, a gl.invalid_operation error is thrown.
WebGL2RenderingContext.texImage3D() - Web APIs
syntax void gl.teximage3d(target, level, internalformat, width, height, depth, border, format, type, glintptr offset); void gl.teximage3d(target, level, internalformat, width, height, depth, border, format, type, htmlcanvaselement source); void gl.teximage3d(target, level, internalformat, width, height, depth, border, format, type, htmlimageelement source); void gl.teximage3d(target, level, internalformat, width, height, depth, border, format, type, htmlvideoelement source); void gl.teximage3d(target, level, internalformat, width, height, depth, border, format, type, imagebitmap source); void gl.teximage3d(target, level, internalformat, width, height, depth, border, format, t...
...srcdata); void gl.teximage3d(target, level, internalformat, width, height, depth, border, format, type, arraybufferview srcdata, srcoffset); parameters target a glenum specifying the binding point (target) of the active texture.
... offset a glintptr byte offset into the webglbuffer's data store.
WebGL2RenderingContext.vertexAttribIPointer() - Web APIs
syntax void gl.vertexattribipointer(index, size, type, stride, offset); parameters index a gluint specifying the index of the vertex attribute that is to be modified.
... stride a glsizei specifying the offset in bytes between the beginning of consecutive vertex attributes.
... offset a glintptr specifying an offset in bytes of the first component in the vertex attribute array.
WebGLRenderingContext.bufferSubData() - Web APIs
syntax // webgl1: void gl.buffersubdata(target, offset, arraybuffer srcdata); void gl.buffersubdata(target, offset, arraybufferview srcdata); // webgl2: void gl.buffersubdata(target, dstbyteoffset, arraybufferview srcdata, srcoffset, length); parameters target a glenum specifying the binding point (target).
... dstbyteoffset a glintptr specifying an offset in bytes where the data replacement will start.
... srcoffset a gluint specifying the element index offset where to start reading the buffer.
WebGLRenderingContext.compressedTexImage[23]D() - Web APIs
pixels); // additionally available in webgl 2: // read from buffer bound to gl.pixel_unpack_buffer void gl.compressedteximage2d(target, level, internalformat, width, height, border, glsizei imagesize, glintptr offset); void gl.compressedteximage2d(target, level, internalformat, width, height, border, arraybufferview srcdata, optional srcoffset, optional srclengthoverride); // read from buffer bound to gl.pixel_unpack_buffer void gl.compressedteximage3d(target, level, internalformat, width, height, depth, border, glsizei imagesize, glintptr offset); void gl.compressedteximage3d(t...
...arget, level, internalformat, width, height, depth, border, arraybufferview srcdata, optional srcoffset, optional srclengthoverride); parameters target a glenum specifying the binding point (target) of the active texture.
... offset a glintptr specifying the offset in bytes from which to read from the buffer bound to gl.pixel_unpack_buffer.
WebGLRenderingContext.copyTexSubImage2D() - Web APIs
syntax void gl.copytexsubimage2d(target, level, xoffset, yoffset, x, y, width, height); parameters target a glenum specifying the binding point (target) of the active texture.
... xoffset a glint specifying the horizontal offset within the texture image.
... yoffset a glint specifying the vertical offset within the texture image.
WebGLRenderingContext.drawElements() - Web APIs
syntax void gl.drawelements(mode, count, type, offset); parameters mode a glenum specifying the type primitive to render.
...possible values are: gl.unsigned_byte gl.unsigned_short when using the oes_element_index_uint extension: gl.unsigned_int offset a glintptr specifying a byte offset in the element array buffer.
... if offset is not a valid multiple of the size of the given type, a gl.invalid_operation error is thrown.
WebGLRenderingContext - Web APIs
webglrenderingcontext.pixelstorei() specifies the pixel storage modes webglrenderingcontext.polygonoffset() specifies the scale factors and units to calculate depth values.
... webglrenderingcontext.buffersubdata() updates buffer data starting at a passed offset.
... webglrenderingcontext.getvertexattriboffset() returns the address of a given vertex attribute.
Using bounded reference spaces - Web APIs
if you wish to simulate a human's perspective on the scene, you probably want to move the viewpoint upward by a distance that approximates human eye level by transforming it by providing an appropriate transform matrix to the xrreferencespace method requestoffsetreferencespace().
... this would change the onrefspacecreated() method from the above snippet to: function onrefspacecreated(refspace) { xrsession.updaterenderstate({ baselayer: new xrwebgllayer(xrsession, gl) }); let startposition = vec3.fromvalues(0, 1.5, 0); const startorientation = vec3.fromvalues(0, 0, 1.0); xrreferencespace = xrreferencespace.getoffsetreferencespace( new xrrigidtransform(startposition, startorientation)); xrsession.requestanimationframe(ondrawframe); } in this code, executed after the reference space has been created, we create an xrrigidtransform representing the transform that will move the viewpoint upward by 1.5 meters.
... the new transform is passed into requestoffsetreferenceframe() to obtain a reference frame which maps the coordinates between the base coordinate system and that of the rendered image.
Viewpoints and viewers: Simulating cameras in WebXR - Web APIs
rendering the scene an xr—shorthand that encompasses both virtual reality (vr) and augmented reality (ar)—headset presents 3d imagery to us by drawing two views of the scene, slightly offset from one another just like the views obtained by our two eyes.
... example frame callback a fairly basic (but typical) callback for rendering frames might look like this: function myanimationframecallback(time, frame) { let adjustedrefspace = applypositionoffsets(xrreferencespace); let pose = frame.getviewerpose(adjustedrefspace); animationframerequestid = frame.session.requestanimationframe(myanimationframecallback); if (pose) { let gllayer = frame.session.renderstate.baselayer; gl.bindframebuffer(gl.framebuffer, gllayer.framebuffer); checkglerror("binding the framebuffer"); gl.clearcolor(0, 0, 0, 1.0); gl.cleardepth(1.0); ...
...stframetime) * 0.001; lastframetime = time; for (let view of pose.views) { let viewport = gllayer.getviewport(view); gl.viewport(viewport.x, viewport.y, viewport.width, viewport.height); checkglerror(`setting viewport for eye: ${view.eye}`); myrenderscene(gl, view, scenedata, deltatime); } } } the callback begins by calling a custom function, applypositionoffsets(), which takes a reference space and applies to its transform matrix any changes that need to be made to take into account things such as user inputs from devices not controlled by webxr, such as the keyboard and mouse.
Inputs and input sources - Web APIs
simply apply any needed offset transform to shift the origin to the start point for rendering your object as you apply any rotation needed to orient your model correctly to align with the grip space's orientation.
... to accomplish that, we include in the avatar object a posdelta property, of type dompoint, which includes the offsets to apply to all three axes in order to adjust the avatar's position (the viewer pose's reference space's origin) to include movement and rotation from the keyboard and mouse.
... function applyexternalinputs(avatar) { if (!avatar.posdelta.x && !avatar.posdelta.y && !avatar.posdelta.z) { return; // player hasn't moved with keyboard } let newtransform = new xrrigidtransform( { x: avatar.posdelta.x, y: avatar.posdelta.y, z: avatar.posdelta.z } ); avatar.referencespace = avatar.referencespace.getoffsetreferencespace(newtransform); } ...
Rendering and the WebXR frame animation callback - Web APIs
kicking off the renderer thus looks like this: let worldrefspace; async function runxr(xrsession) { worldrefspace = await xrsession.requestreferencespace("immersive-vr"); if (worldrefspace) { viewerrefspace = worldrefspace.getoffsetreferencespace( new xrrigidtransform(viewerstartposition, viewerstartorientation)); animationframerequestid = xrsession.requestanimationframe(mydrawframe); } } after getting a reference space for the immersive world, this creates an offset reference space representing the position and orientation of the viewer by creating an xrrigidtransform representing that position and orientati...
...on, then calling the xrreferencespace method getoffsetreferencespace().
...because each eye is offset to one side or the other of the head's centerline, and each eye sees about the same field of view, the result is that each eye sees a slightly different part of the world in front of it, and from a slightly different angle.
Starting up and shutting down a WebXR session - Web APIs
and such worlddata = loadglprograms(session, "worlddata.xml"); if (!worlddata) { return null; } // finish configuring webgl worlddata.session.updaterenderstate({ baselayer: new xrwebgllayer(worlddata.session, gl) }); // start rendering the scene referencespace = await worlddata.session.requestreferencespace("unbounded"); worlddata.referencespace = referencespace.getoffsetreferencespace( new xrrigidtransform(worlddata.playerspawnposition, worlddata.playerspawnorientation)); worlddata.animationframerequestid = worlddata.session.requestanimationframe(ondrawframe); return worlddata; } for the purposes of this example, an object named worlddata gets created to encapsulate data about the world and rendering environment.
...if that's so, you call getoffsetreferencespace() on the initial reference space to create a new reference space which offsets the coordinate system so that (0, 0, 0) is located at the position of the viewer, with the orientation likewise shifted to face in the desired direction.
... the input value into getoffsetreferencespace() is an xrrigidtransform encapsulating the player's position and orientation as specified in the default world coordinates.
XRRigidTransform - Web APIs
xrrigidtransform is used to specify transforms throughout the webxr apis, including: the offset and orientation relative to the parent reference space to use when creating a new reference space with getoffsetreferencespace().
... example this code snippet creates an xrrigidtransform to specify the offset and orientation in relation to the current reference space to use when creating a new reference space.
... xrsession.requestreferencespace(refspacetype) .then((refspace) => { xrreferencespace = refspace; xrreferencespace = xrreferencespace.getoffsetreferencespace( new xrrigidtransform(viewerstartposition, cubeorientation)); animationframerequestid = xrsession.requestanimationframe(drawframe); specifications specification status comment webxr device apithe definition of 'xrrigidtransform' in that specification.
XRView - Web APIs
WebAPIXRView
the createteleporttransform() function returns the transform needed to move and rotate an object whose current situation is described by the reference space refspace to a new position and orientation which is computed using previously recorded mouse and keyboard input data which has generated offsets for yaw, pitch, and position along all three axes.
... return refspace.getoffsetreferencespace(newtransform); } this code is broken into four sections.
... the third section creates the new xrrigidtransform, specifying a point providing the offsets along the three axes as the first parameter, and the orientation quaternion as the second parameter.
-webkit-mask-box-image - CSS: Cascading Style Sheets
<length> the size of the mask image's offset.
... <percentage> the mask image's offset has a percentage value relative to the border box's corresponding dimension (width or height).
... examples setting an image .exampleone { -webkit-mask-box-image: url('mask.png'); } offsetting and filling an image .exampletwo { -webkit-mask-box-image: url('logo.png') 100 100 0 0 round round; } specifications not part of any standard.
@keyframes - CSS: Cascading Style Sheets
from a starting offset of 0%.
... to an ending offset of 100%.
... if a given animation time offset is duplicated, all keyframes in the @keyframes rule for that percentage are used for that frame.
Border-image generator - CSS: Cascading Style Sheets
bscribe : subscribe, unsubscribe : unsubscribe }; })(); window.addeventlistener("load", function() { borderimage.init(); }); var borderimage = (function borderimage() { var getelembyid = document.getelementbyid.bind(document); var subject; var preview; var guidelines = []; var positions = ['top', 'right', 'bottom', 'left']; var makedraggable = function makedraggable(elem) { var offsettop; var offsetleft; elem.setattribute('data-draggable', 'true'); var dragstart = function dragstart(e) { if (e.target.getattribute('data-draggable') !== 'true' || e.target !== elem || e.button !== 0) return; offsetleft = e.clientx - elem.offsetleft; offsettop = e.clienty - elem.offsettop; document.addeventlistener('mousemove', mousedrag); document.addeventlistener...
...('mouseup', dragend); }; var dragend = function dragend(e) { if (e.button !== 0) return; document.removeeventlistener('mousemove', mousedrag); document.removeeventlistener('mouseup', dragend); }; var mousedrag = function mousedrag(e) { elem.style.left = e.clientx - offsetleft + 'px'; elem.style.top = e.clienty - offsettop + 'px'; }; elem.addeventlistener('mousedown', dragstart, false); }; var previewcontrol = function previewcontrol() { var dragging = false; var valuex = null; var valuey = null; var dragstart = function dragstart(e) { if (e.button !== 0) return; valuex = e.clientx - preview.clientwidth; valuey = e.clienty - preview.clientheight; dragging = true; document.addeventlistener('mousemove', mousedrag); }; var dr...
... if (unit_topic) inputslidermanager.setstep(unit_topic, value); }; var show = function show(e) { var topic = e.target.getattribute('data-topic'); var precision = inputslidermanager.getprecision(topic); var step = inputslidermanager.getstep(topic); unit_topic = topic; title.textcontent = topic; panel.setattribute('data-active', 'true'); panel.style.top = e.target.offsettop - 40 + 'px'; panel.style.left = e.target.offsetleft + 30 + 'px'; inputslidermanager.setvalue('unit-precision', precision); inputslidermanager.setvalue('unit-step', step); }; var init = function init() { panel = document.createelement('div'); title = document.createelement('div'); var close = document.createelement('div'); step = inputslidermanager.createslider('unit...
In Flow and Out of Flow - CSS: Cascading Style Sheets
in the next example i have three paragraph elements, the second element has position absolute, with offset values of top: 30px and right: 30px.
... using position: fixed also removes the item from flow, however the offsets are based on the viewport rather than the containing block.
... relative positioning and flow if you give an item relative positioning with position: relative it remains in flow, however you are then able to use the offset values to push it around.
CSS Motion Path - CSS: Cascading Style Sheets
with offset-path you can define a specific path of any shape you want.
... you then animate it along that path by animating offset-distance, and can choose to rotate it at any point using offset-rotate.
... basic example <div id="motion-demo"></div> #motion-demo { offset-path: path('m20,20 c20,100 200,0 200,100'); animation: move 3000ms infinite alternate ease-in-out; width: 40px; height: 40px; background: cyan; } @keyframes move { 0% { offset-distance: 0%; } 100% { offset-distance: 100%; } } reference properties offset offset-anchor offset-distance offset-path offset-position offset-rotate specifications specification status comment motion path module level 1 working draft initial definition.
Linear-gradient Generator - CSS: Cascading Style Sheets
sl'); else this.setpickermode('hsv'); }.bind(this)); this.node.appendchild(button); }; /*************************************************************************/ // updates properties of ui elements /*************************************************************************/ colorpicker.prototype.updatecolor = function updatecolor(e) { var x = e.pagex - this.picking_area.offsetleft; var y = e.pagey - this.picking_area.offsettop; // width and height should be the same var size = this.picking_area.clientwidth; if (x > size) x = size; if (y > size) y = size; if (x < 0) x = 0; if (y < 0) y = 0; var value = 100 - (y * 100 / size) | 0; var saturation = x * 100 / size | 0; if (this.picker_mode === 'hsv') this.color.sethsv(this.color.hue, saturation, ...
...tify('value', value); this.notify('lightness', value); this.notify('saturation', saturation); this.notify('red', this.color.r); this.notify('green', this.color.g); this.notify('blue', this.color.b); this.notify('hexa', this.color.gethexa()); notify(this.topic, this.color); }; colorpicker.prototype.updatehueslider = function updatehueslider(e) { var x = e.pagex - this.hue_area.offsetleft; var width = this.hue_area.clientwidth; if (x < 0) x = 0; if (x > width) x = width; var hue = ((359 * x) / width) | 0; this.updatesliderposition(this.hue_picker, x - 1); this.sethue(hue); }; colorpicker.prototype.updatealphaslider = function updatealphaslider(e) { var x = e.pagex - this.alpha_mask.offsetleft; var width = this.alpha_mask.clientwidth; if (x < 0) x = 0; ...
...ibute('axisid')); }); axis.addeventlistener('dragover', allowdropevent); axis.addeventlistener('drop', function swap(e) { if (dragelem === this) return; var from = getorderid(e.datatransfer.getdata('axisid')); var to = getorderid(this.getattribute('axisid')); var swap = lg_axes[from]; lg_axes[from] = lg_axes[to]; lg_axes[to] = swap; var left = dragelem.offsetleft; dragelem.style.left = this.offsetleft + 'px'; this.style.left = left + 'px'; updatecssgradient(); }); activateaxisshortcut(axis); return axis; }; var activateaxisshortcut = function activateaxisshortcut(node) { if (activeshortcut) activeshortcut.removeattribute('data-state'); node.setattribute('data-state', 'active'); activeshortcut = node; }; va...
<basic-shape> - CSS: Cascading Style Sheets
the <basic-shape> css data type represents a shape used in the clip-path, shape-outside, and offset-path properties.
... when all of the first four arguments are supplied they represent the top, right, bottom and left offsets from the reference box inward that define the positions of the edges of the inset rectangle.
... a <position> value in circle() or ellipse() is computed as a pair of offsets (horizontal then vertical) from the top left origin, each given as a combination of an absolute length and a percentage.
scroll-padding-block-end - CSS: Cascading Style Sheets
the scroll-padding-block-end property defines offsets for the end edge in the block dimension of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user.
... syntax /* keyword values */ scroll-padding-block-end: auto; /* <length> values */ scroll-padding-block-end: 10px; scroll-padding-block-end: 1em; scroll-padding-block-end: 10%; /* global values */ scroll-padding-block-end: inherit; scroll-padding-block-end: initial; scroll-padding-block-end: unset; values <length-percentage> an inwards offset from the block end edge of the scrollport, as a valid length or a percentage.
... auto the offset is determind by the user agent.
scroll-padding-block-start - CSS: Cascading Style Sheets
the scroll-padding-block-start property defines offsets for the start edge in the block dimension of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user.
... syntax /* keyword values */ scroll-padding-block-start: auto; /* <length> values */ scroll-padding-block-start: 10px; scroll-padding-block-start: 1em; scroll-padding-block-start: 10%; /* global values */ scroll-padding-block-start: inherit; scroll-padding-block-start: initial; scroll-padding-block-start: unset; values <length-percentage> an inwards offset from the block start edge of the scrollport, as a valid length or a percentage.
... auto the offset is determind by the user agent.
scroll-padding-block - CSS: Cascading Style Sheets
the scroll-padding properties define offsets for the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user.
...ng css properties: scroll-padding-block-end scroll-padding-block-start syntax /* keyword values */ scroll-padding-block: auto; /* <length> values */ scroll-padding-block: 10px; scroll-padding-block: 1em .5em; scroll-padding-block: 10%; /* global values */ scroll-padding-block: inherit; scroll-padding-block: initial; scroll-padding-block: unset; values <length-percentage> an inwards offset from the corresponding edge of the scrollport, as a valid length or a percentage.
... auto the offset is determind by the user agent.
scroll-padding-bottom - CSS: Cascading Style Sheets
the scroll-padding-bottom property defines offsets for the bottom of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user.
... syntax /* keyword values */ scroll-padding-bottom: auto; /* <length> values */ scroll-padding-bottom: 10px; scroll-padding-bottom: 1em; scroll-padding-bottom: 10%; /* global values */ scroll-padding-bottom: inherit; scroll-padding-bottom: initial; scroll-padding-bottom: unset; values <length-percentage> an inwards offset from the bottom edge of the scrollport, as a valid length or a percentage.
... auto the offset is determind by the user agent.
scroll-padding-inline-end - CSS: Cascading Style Sheets
the scroll-padding-inline-end property defines offsets for the end edge in the inline dimension of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user.
... syntax /* keyword values */ scroll-padding-inline-end: auto; /* <length> values */ scroll-padding-inline-end: 10px; scroll-padding-inline-end: 1em; scroll-padding-inline-end: 10%; /* global values */ scroll-padding-inline-end: inherit; scroll-padding-inline-end: initial; scroll-padding-inline-end: unset; values <length-percentage> an inwards offset from the inline end edge of the scrollport, as a valid length or a percentage.
... auto the offset is determind by the user agent.
scroll-padding-inline-start - CSS: Cascading Style Sheets
the scroll-padding-inline-start property defines offsets for the start edge in the inline dimension of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user.
... syntax /* keyword values */ scroll-padding-inline-start: auto; /* <length> values */ scroll-padding-inline-start: 10px; scroll-padding-inline-start: 1em; scroll-padding-inline-start: 10%; /* global values */ scroll-padding-inline-start: inherit; scroll-padding-inline-start: initial; scroll-padding-inline-start: unset; values <length-percentage> an inwards offset from the inline start edge of the scrollport, as a valid length or a percentage.
... auto the offset is determind by the user agent.
scroll-padding-inline - CSS: Cascading Style Sheets
the scroll-padding properties define offsets for the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user.
...operties: scroll-padding-inline-end scroll-padding-inline-start syntax /* keyword values */ scroll-padding-inline: auto; /* <length> values */ scroll-padding-inline: 10px; scroll-padding-inline: 1em .5em; scroll-padding-inline: 10%; /* global values */ scroll-padding-inline: inherit; scroll-padding-inline: initial; scroll-padding-inline: unset; values <length-percentage> an inwards offset from the corresponding edge of the scrollport, as a valid length or a percentage.
... auto the offset is determind by the user agent.
scroll-padding-left - CSS: Cascading Style Sheets
the scroll-padding-left property defines offsets for the left of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user.
... syntax /* keyword values */ scroll-padding-left: auto; /* <length> values */ scroll-padding-left: 10px; scroll-padding-left: 1em; scroll-padding-left: 10%; /* global values */ scroll-padding-left: inherit; scroll-padding-left: initial; scroll-padding-left: unset; values <length-percentage> an inwards offset from the left edge of the scrollport, as a valid length or a percentage.
... auto the offset is determind by the user agent.
scroll-padding-right - CSS: Cascading Style Sheets
the scroll-padding-right property defines offsets for the right of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user.
... syntax /* keyword values */ scroll-padding-right: auto; /* <length> values */ scroll-padding-right: 10px; scroll-padding-right: 1em; scroll-padding-right: 10%; /* global values */ scroll-padding-right: inherit; scroll-padding-right: initial; scroll-padding-right: unset; values <length-percentage> an inwards offset from the top edge of the scrollport, as a valid length or a percentage.
... auto the offset is determind by the user agent.
scroll-padding-top - CSS: Cascading Style Sheets
the scroll-padding-top property defines offsets for the top of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user.
... syntax /* keyword values */ scroll-padding-top: auto; /* <length> values */ scroll-padding-top: 10px; scroll-padding-top: 1em; scroll-padding-top: 10%; /* global values */ scroll-padding-top: inherit; scroll-padding-top: initial; scroll-padding-top: unset; values <length-percentage> an inwards offset from the top edge of the scrollport, as a valid length or a percentage.
... auto the offset is determind by the user agent.
scroll-padding - CSS: Cascading Style Sheets
the scroll-padding-* properties define offsets for the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user.
...wing css properties: scroll-padding-bottom scroll-padding-left scroll-padding-right scroll-padding-top syntax /* keyword values */ scroll-padding: auto; /* <length> values */ scroll-padding: 10px; scroll-padding: 1em .5em 1em 1em; scroll-padding: 10%; /* global values */ scroll-padding: inherit; scroll-padding: initial; scroll-padding: unset; values <length-percentage> an inwards offset from the corresponding edge of the scrollport, as a valid <length> or a <percentage>.
... auto the offset is determind by the user agent.
BigInt64Array() constructor - JavaScript
syntax new bigint64array(); new bigint64array(length); new bigint64array(typedarray); new bigint64array(object); new bigint64array(buffer [, byteoffset [, length]]); parameters length when called with a length argument, an internal array buffer is created in memory, of size length multiplied by bytes_per_element bytes, containing zeros.
... buffer, byteoffset, length when called with a buffer, and optionally a byteoffset and a length argument, a new typed array view is created that views the specified arraybuffer.
... the byteoffset and length parameters specify the memory range that will be exposed by the typed array view.
BigUint64Array() constructor - JavaScript
syntax new biguint64array(); new biguint64array(length); new biguint64array(typedarray); new biguint64array(object); new biguint64array(buffer [, byteoffset [, length]]); parameters length when called with a length argument, an internal array buffer is created in memory, of size length multiplied by bytes_per_element bytes, containing zeros.
... buffer, byteoffset, length when called with a buffer, and optionally a byteoffset and a length argument, a new typed array view is created that views the specified arraybuffer.
... the byteoffset and length parameters specify the memory range that will be exposed by the typed array view.
DataView.prototype.setBigInt64() - JavaScript
the setbigint64() method stores a signed 64-bit integer (long long) value at the specified byte offset from the start of the dataview.
... syntax dataview.setbigint64(byteoffset, value [, littleendian]) parameters byteoffset the offset, in bytes, from the start of the view to store the data from.
... errors thrown rangeerror thrown if the byteoffset is set such that it would store beyond the end of the view.
DataView.prototype.setBigUint64() - JavaScript
the setbiguint64() method stores an unsigned 64-bit integer (unsigned long long) value at the specified byte offset from the start of the dataview.
... syntax dataview.setbiguint64(byteoffset, value [, littleendian]) parameters byteoffset the offset, in bytes, from the start of the view to store the data from.
... errors thrown rangeerror thrown if the byteoffset is set such that it would store beyond the end of the view.
DataView.prototype.setFloat32() - JavaScript
the setfloat32() method stores a signed 32-bit float (float) value at the specified byte offset from the start of the dataview.
... syntax dataview.setfloat32(byteoffset, value [, littleendian]) parameters byteoffset the offset, in byte, from the start of the view where to store the data.
... errors thrown rangeerror thrown if the byteoffset is set such as it would store beyond the end of the view.
DataView.prototype.setFloat64() - JavaScript
the setfloat64() method stores a signed 64-bit float (double) value at the specified byte offset from the start of the dataview.
... syntax dataview.setfloat64(byteoffset, value [, littleendian]) parameters byteoffset the offset, in byte, from the start of the view where to store the data.
... errors thrown rangeerror thrown if the byteoffset is set such as it would store beyond the end of the view.
DataView.prototype.setInt16() - JavaScript
the setint16() method stores a signed 16-bit integer (short) value at the specified byte offset from the start of the dataview.
... syntax dataview.setint16(byteoffset, value [, littleendian]) parameters byteoffset the offset, in byte, from the start of the view where to store the data.
... errors thrown rangeerror thrown if the byteoffset is set such as it would store beyond the end of the view.
DataView.prototype.setInt32() - JavaScript
the setint32() method stores a signed 32-bit integer (long) value at the specified byte offset from the start of the dataview.
... syntax dataview.setint32(byteoffset, value [, littleendian]) parameters byteoffset the offset, in byte, from the start of the view where to store the data.
... errors thrown rangeerror thrown if the byteoffset is set such as it would store beyond the end of the view.
DataView.prototype.setInt8() - JavaScript
the setint8() method stores a signed 8-bit integer (byte) value at the specified byte offset from the start of the dataview.
... syntax dataview.setint8(byteoffset, value) parameters byteoffset the offset, in byte, from the start of the view where to store the data.
... errors thrown rangeerror thrown if the byteoffset is set such as it would store beyond the end of the view.
DataView.prototype.setUint16() - JavaScript
the setuint16() method stores an unsigned 16-bit integer (unsigned short) value at the specified byte offset from the start of the dataview.
... syntax dataview.setuint16(byteoffset, value [, littleendian]) parameters byteoffset the offset, in byte, from the start of the view where to store the data.
... errors thrown rangeerror thrown if the byteoffset is set such as it would store beyond the end of the view.
DataView.prototype.setUint32() - JavaScript
the setuint32() method stores an unsigned 32-bit integer (unsigned long) value at the specified byte offset from the start of the dataview.
... syntax dataview.setuint32(byteoffset, value [, littleendian]) parameters byteoffset the offset, in byte, from the start of the view where to store the data.
... errors thrown rangeerror thrown if the byteoffset is set such as it would store beyond the end of the view.
DataView.prototype.setUint8() - JavaScript
the setuint8() method stores an unsigned 8-bit integer (byte) value at the specified byte offset from the start of the dataview.
... syntax dataview.setuint8(byteoffset, value) parameters byteoffset the offset, in byte, from the start of the view where to store the data.
... errors thrown rangeerror thrown if the byteoffset is set such as it would store beyond the end of the view.
Float32Array() constructor - JavaScript
syntax new float32array(); // new in es2017 new float32array(length); new float32array(typedarray); new float32array(object); new float32array(buffer [, byteoffset [, length]]); parameters length when called with a length argument, an internal array buffer is created in memory, of size length multiplied by bytes_per_element bytes, containing zeros.
... buffer, byteoffset, length when called with a buffer, and optionally a byteoffset and a length argument, a new typed array view is created that views the specified arraybuffer.
... the byteoffset and length parameters specify the memory range that will be exposed by the typed array view.
Float64Array() constructor - JavaScript
syntax new float64array(); // new in es2017 new float64array(length); new float64array(typedarray); new float64array(object); new float64array(buffer [, byteoffset [, length]]); parameters length when called with a length argument, an internal array buffer is created in memory, of size length multiplied by bytes_per_element bytes, containing zeros.
... buffer, byteoffset, length when called with a buffer, and optionally a byteoffset and a length argument, a new typed array view is created that views the specified arraybuffer.
... the byteoffset and length parameters specify the memory range that will be exposed by the typed array view.
Int16Array() constructor - JavaScript
syntax new int16array(); // new in es2017 new int16array(length); new int16array(typedarray); new int16array(object); new int16array(buffer [, byteoffset [, length]]); parameters length when called with a length argument, an internal array buffer is created in memory, of size length multiplied by bytes_per_element bytes, containing zeros.
... buffer, byteoffset, length when called with a buffer, and optionally a byteoffset and a length argument, a new typed array view is created that views the specified arraybuffer.
... the byteoffset and length parameters specify the memory range that will be exposed by the typed array view.
Int32Array() constructor - JavaScript
syntax new int32array(); // new in es2017 new int32array(length); new int32array(typedarray); new int32array(object); new int32array(buffer [, byteoffset [, length]]); parameters length when called with a length argument, an internal array buffer is created in memory, of size length multiplied by bytes_per_element bytes, containing zeros.
... buffer, byteoffset, length when called with a buffer, and optionally a byteoffset and a length argument, a new typed array view is created that views the specified arraybuffer.
... the byteoffset and length parameters specify the memory range that will be exposed by the typed array view.
Int8Array() constructor - JavaScript
syntax new int8array(); // new in es2017 new int8array(length); new int8array(typedarray); new int8array(object); new int8array(buffer [, byteoffset [, length]]); parameters length when called with a length argument, an internal array buffer is created in memory, of size length multiplied by bytes_per_element bytes, containing zeros.
... buffer, byteoffset, length when called with a buffer, and optionally a byteoffset and a length argument, a new typed array view is created that views the specified arraybuffer.
... the byteoffset and length parameters specify the memory range that will be exposed by the typed array view.
TypedArray.prototype.subarray() - JavaScript
the begin offset is inclusive and the end offset is exclusive.
...the offset is inclusive.
...the offset is exclusive.
Uint16Array() constructor - JavaScript
syntax new uint16array(); // new in es2017 new uint16array(length); new uint16array(typedarray); new uint16array(object); new uint16array(buffer [, byteoffset [, length]]); parameters length when called with a length argument, an internal array buffer is created in memory, of size length multiplied by bytes_per_element bytes, containing zeros.
... buffer, byteoffset, length when called with a buffer, and optionally a byteoffset and a length argument, a new typed array view is created that views the specified arraybuffer.
... the byteoffset and length parameters specify the memory range that will be exposed by the typed array view.
Uint32Array() constructor - JavaScript
syntax new uint32array(); // new in es2017 new uint32array(length); new uint32array(typedarray); new uint32array(object); new uint32array(buffer [, byteoffset [, length]]); parameters length when called with a length argument, an internal array buffer is created in memory, of size length multiplied by bytes_per_element bytes, containing zeros.
... buffer, byteoffset, length when called with a buffer, and optionally a byteoffset and a length argument, a new typed array view is created that views the specified arraybuffer.
... the byteoffset and length parameters specify the memory range that will be exposed by the typed array view.
Uint8Array() constructor - JavaScript
syntax new uint8array(); // new in es2017 new uint8array(length); new uint8array(typedarray); new uint8array(object); new uint8array(buffer [, byteoffset [, length]]); parameters length when called with a length argument, an internal array buffer is created in memory, of size length multiplied by bytes_per_element bytes, containing zeros.
... buffer, byteoffset, length when called with a buffer, and optionally a byteoffset and a length argument, a new typed array view is created that views the specified arraybuffer.
... the byteoffset and length parameters specify the memory range that will be exposed by the typed array view.
Uint8ClampedArray() constructor - JavaScript
syntax new uint8clampedarray(); // new in es2017 new uint8clampedarray(length); new uint8clampedarray(typedarray); new uint8clampedarray(object); new uint8clampedarray(buffer [, byteoffset [, length]]); parameters length when called with a length argument, an internal array buffer is created in memory, of size length multiplied by bytes_per_element bytes, containing zeros.
... buffer, byteoffset, length when called with a buffer, and optionally a byteoffset and a length argument, a new typed array view is created that views the specified arraybuffer.
... the byteoffset and length parameters specify the memory range that will be exposed by the typed array view.
cx - SVG: Scalable Vector Graphics
WebSVGAttributecx
three elements are using this attribute: <circle>, <ellipse>, and <radialgradient> html,body,svg { height:100% } <svg viewbox="0 0 300 100" xmlns="http://www.w3.org/2000/svg"> <radialgradient cx="25%" id="mygradient"> <stop offset="0" stop-color="white" /> <stop offset="100%" stop-color="black" /> </radialgradient> <circle cx="50" cy="50" r="45"/> <ellipse cx="150" cy="50" rx="45" ry="25" /> <rect x="205" y="5" width="90" height="90" fill="url(#mygradient)" /> </svg> circle for <circle>, cx defines the x-axis coordinate of the center of the shape.
... value <length> default value 50% animatable yes example html,body,svg { height:100% } <svg viewbox="0 0 34 10" xmlns="http://www.w3.org/2000/svg"> <defs> <radialgradient cx="0" id="mygradient000"> <stop offset="0%" stop-color="gold" /> <stop offset="50%" stop-color="green" /> <stop offset="100%" stop-color="white" /> </radialgradient> <radialgradient cx="50%" id="mygradient050"> <stop offset="0%" stop-color="gold" /> <stop offset="50%" stop-color="green" /> <stop offset="100%" stop-color="white" /> </radialgradient> <radialgradient cx="100%" id="myg...
...radient100"> <stop offset="0%" stop-color="gold" /> <stop offset="50%" stop-color="green" /> <stop offset="100%" stop-color="white" /> </radialgradient> </defs> <rect x="1" y="1" width="8" height="8" fill="url(#mygradient000)" stroke="black" /> <rect x="13" y="1" width="8" height="8" fill="url(#mygradient050)" stroke="black" /> <rect x="25" y="1" width="8" height="8" fill="url(#mygradient100)" stroke="black" /> </svg> specifications specification status comment scalable vector graphics (svg) 2the definition of 'cx' in that specification.
cy - SVG: Scalable Vector Graphics
WebSVGAttributecy
three elements are using this attribute: <circle>, <ellipse>, and <radialgradient> html,body,svg { height:100% } <svg viewbox="0 0 100 300" xmlns="http://www.w3.org/2000/svg"> <radialgradient cy="25%" id="mygradient"> <stop offset="0" stop-color="white" /> <stop offset="100%" stop-color="black" /> </radialgradient> <circle cy="50" cx="50" r="45"/> <ellipse cy="150" cx="50" rx="45" ry="25" /> <rect x="5" y="205" width="90" height="90" fill="url(#mygradient)" /> </svg> circle for <circle>, cy defines the y-axis coordinate of the center of the shape.
... value <length> default value 50% animatable yes example html,body,svg { height:100% } <svg viewbox="0 0 34 10" xmlns="http://www.w3.org/2000/svg"> <defs> <radialgradient cy="0" id="mygradient000"> <stop offset="0%" stop-color="gold" /> <stop offset="50%" stop-color="green" /> <stop offset="100%" stop-color="white" /> </radialgradient> <radialgradient cy="50%" id="mygradient050"> <stop offset="0%" stop-color="gold" /> <stop offset="50%" stop-color="green" /> <stop offset="100%" stop-color="white" /> </radialgradient> <radialgradient cy="100%" id="myg...
...radient100"> <stop offset="0%" stop-color="gold" /> <stop offset="50%" stop-color="green" /> <stop offset="100%" stop-color="white" /> </radialgradient> </defs> <rect x="1" y="1" width="8" height="8" fill="url(#mygradient000)" stroke="black" /> <rect x="13" y="1" width="8" height="8" fill="url(#mygradient050)" stroke="black" /> <rect x="25" y="1" width="8" height="8" fill="url(#mygradient100)" stroke="black" /> </svg> specifications specification status comment scalable vector graphics (svg) 2the definition of 'cy' in that specification.
SVG Attribute reference - SVG: Scalable Vector Graphics
WebSVGAttribute
g in in2 intercept k k k1 k2 k3 k4 kernelmatrix kernelunitlength kerning keypoints keysplines keytimes l lang lengthadjust letter-spacing lighting-color limitingconeangle local m marker-end marker-mid marker-start markerheight markerunits markerwidth mask maskcontentunits maskunits mathematical max media method min mode n name numoctaves o offset opacity operator order orient orientation origin overflow overline-position overline-thickness p panose-1 paint-order path pathlength patterncontentunits patterntransform patternunits ping pointer-events points pointsatx pointsaty pointsatz preservealpha preserveaspectratio primitiveunits r r radius referrerpolicy refx refy rel rendering-intent repeatcount...
... repeatdur requiredextensions requiredfeatures restart result rotate rx ry s scale seed shape-rendering slope spacing specularconstant specularexponent speed spreadmethod startoffset stddeviation stemh stemv stitchtiles stop-color stop-opacity strikethrough-position strikethrough-thickness string stroke stroke-dasharray stroke-dashoffset stroke-linecap stroke-linejoin stroke-miterlimit stroke-opacity stroke-width style surfacescale systemlanguage t tabindex tablevalues target targetx targety text-anchor text-decoration text-rendering textlength to transform transform-origin type u u1 u2 underline-position underline-thickness unicode unicode-bidi unicode-range units-per-em v v-alphabetic v-hanging v-ideographic v-mathe...
..., flood-color, flood-opacity, font-family, font-size, font-size-adjust, font-stretch, font-style, font-variant, font-weight, glyph-orientation-horizontal, glyph-orientation-vertical, image-rendering, kerning, letter-spacing, lighting-color, marker-end, marker-mid, marker-start, mask, opacity, overflow, pointer-events, shape-rendering, stop-color, stop-opacity, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, text-anchor, text-decoration, text-rendering, transform, transform-origin, unicode-bidi, vector-effect, visibility, word-spacing, writing-mode filters attributes filter primitive attributes height, result, width, x, y transfer function attributes type, tablevalues, slope, intercept, amplitude, exponent, offset...
SVG Filters Tutorial - SVG: Scalable Vector Graphics
by adding feoffset and result, the effect layer is defined <result> attribute is a reference that can be use later.
...<feoffset> primitive has the blur result from the gaussian blur.
... <femerge> primitive contains the nodes <femergenode> taking as input the result offsetblur , this will allow it to appear below the sourcegraphic implementation of more primitives <defs> <filter id="drop-shadow"> <fegaussianblur in="sourcealpha" stddeviation="3" result="blur"/> <feoffset in="blur" dx="4" dy="4" result="offsetblur"/> </filter> <femerge> <femergenode in="offsetblur"/> <femergenode in="sourcegraphic"/> </femerge> </defs> ...
Creating a Web based tone generator - Archive of obsolete content
the function mozcurrentsampleoffset() is used to know the position of the samples being played so that we can fill a 500 ms buffer of audio samples.
... var currentposition = audio.mozcurrentsampleoffset(); var available = currentposition + prebuffersize - currentwriteposition; if(available > 0) { // request some sound data from the callback function.
Documentation for BiDi Mozilla - Archive of obsolete content
examples of this are in nstextframe::painttextslowly; nstextframe::paintunicodetext when a selection is displayed; nstextframe::getposition; nstextframe::getpointfromoffset.
...g reordering shaping numeric translation conversion to/from presentation forms nsbidipresutils layout/base/nsbidipresutils.cpp utilities for the layout engine including: resolve frames by bidi level split framesreorder frames format bidi text support for deletion and insertion of frames by editor nsbiditextframe layout/generic/nsbidiframes.cpp subclass of nsframe with additional method setoffsets, to adjust mcontentoffset and mcontentlength during bidi processing nsdirectionalframe layout/generic/nsbidiframes.cpp subclass of nsframethis is a special frame which represents a bidi control.
The new nsString class implementation (1999) - Archive of obsolete content
static void ensurecapacity(nsstrimpl& astring,pruint32 anewlength); static void growcapacity(nsstrimpl& astring,pruint32 anewlength); static void append(nsstrimpl& adest,const nsstrimpl& asource,pruint32 anoffset,print32 acount); static void appendcstring(nsstrimpl& adest,const char* asource,pruint32 anoffset,print32 acount); static void assign(nsstrimpl& adest,const nsstrimpl& asource,pruint32 anoffset,print32 acount); static void assigncstring(nsstrimpl& adest,const char* asource,pruint32 anoffset,print32 acount); // assign a char or a substring into the existing string...
... static void insert(nsstrimpl& adest,pruint32 adestoffset, const nsstrimpl& asource,pruint32 asrcoffset,print32 acount); static void insertcstring(nsstrimpl& adest,pruint32 adestoffset, const char* asource,pruint32 asrcoffset,print32 acount); static void insertchar(nsstrimpl& adest,pruint32 adestoffset,char thechar); static void insertchar(nsstrimpl& adest,pruint32 adestoffset,prunichar theunichar); static void insertchar(nsstrimpl& adest,pruint32 adestoffset,print32 thequadchar); static void delete(nsstrimpl& adest,pruint32 adestoffset,pruint32 acount); static void truncate(nsstrimpl& adest,pruint32 adestoffset); static print32 compare(const nsstrimpl& adest,const nsstrimpl& asource, print32 acount,prb...
Stacks and Decks - Archive of obsolete content
the first, however is offset one pixel to the right and down by adding a padding to its left and top sides.
... this has the result of drawing the same text 'shadowed' again but slightly offset from the other.
menupopup - Archive of obsolete content
x, y for an anchored popup, the x and y arguments may be used to offset the popup from its anchored position by some number, measured in css pixels.
... to have a popup appear relative to another element yet still offset by some number of pixels, determine the actual screen position of the element using the boxobject.screenx and boxobject.screeny properties of the element, and use those as the x and y arguments offset by the desired values.
tooltip - Archive of obsolete content
x, y for an anchored popup, the x and y arguments may be used to offset the popup from its anchored position by some number, measured in css pixels.
... to have a popup appear relative to another element yet still offset by some number of pixels, determine the actual screen position of the element using the boxobject.screenx and boxobject.screeny properties of the element, and use those as the x and y arguments offset by the desired values.
Browser Feature Detection - Archive of obsolete content
ueafter true false false cuebefore true false false cursor true true true direction true true true elevation true false false emptycells true false true fontsizeadjust true false true fontstretch true false true left true true true markeroffset true false true marks true false true maxheight true ie7 only true maxwidth true ie7 only true minheight true true true minwidth true ie7 only true orphans true false true outline true false true outlinecolor true false true outlinestyle...
...{name: 'cueafter', 'supported': false}, {name: 'cuebefore', 'supported': false}, {name: 'cursor', 'supported': false}, {name: 'direction', 'supported': false}, {name: 'elevation', 'supported': false}, {name: 'emptycells', 'supported': false}, {name: 'fontsizeadjust', 'supported': false}, {name: 'fontstretch', 'supported': false}, {name: 'left', 'supported': false}, {name: 'markeroffset', 'supported': false}, {name: 'marks', 'supported': false}, {name: 'maxheight', 'supported': false}, {name: 'maxwidth', 'supported': false}, {name: 'minheight', 'supported': false}, {name: 'minwidth', 'supported': false}, {name: 'orphans', 'supported': false}, {name: 'outline', 'supported': false}, {name: 'outlinecolor', 'supported': false}, {name: 'outlinestyle', 'supported': f...
-ms-wrap-margin - Archive of obsolete content
the -ms-wrap-margin css property is a microsoft extension that specifies a margin that offsets the inner wrap shape from other shapes.
... remarks offsets created by the -ms-wrap-margin property are offset from the outside of the exclusion.
Styling the Amazing Netscape Fish Cam Page - Archive of obsolete content
rather than try to fight it or push the image below the h3's element box, i let the image mostly overlap the h3, but with a slight offset.
...in order to create visual appeal, i decided to offset the top let corners of the fish image and fish name.
Mobile touch controls - Game development
can use it for both cases: when the player touches the screen but doesn't move it (touchstart), and when the finger is moved on the screen (touchmove): document.addeventlistener("touchstart", touchhandler); document.addeventlistener("touchmove", touchhandler); the touchhandler function looks like this: function touchhandler(e) { if(e.touches) { playerx = e.touches[0].pagex - canvas.offsetleft - playerwidth / 2; playery = e.touches[0].pagey - canvas.offsettop - playerheight / 2; output.innerhtml = "touch: "+ " x: " + playerx + ", y: " + playery; e.preventdefault(); } } if the touch occurs (touches object is not empty), then we will have all the info we need in that object.
... we can get the first touch (e.touches[0], our example is not multitouch-enabled), extract the pagex and pagey variables and set the player's ship position on the screen by subtracting the canvas offset (distance from the canvas and the edge of the screen) and half the player's width and height.
Advanced styling effects - Learn web development
now the css: p { margin: 0; } article { max-width: 500px; padding: 10px; background-color: red; background-image: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.25)); } .simple { box-shadow: 5px 5px 5px rgba(0,0,0,0.7); } this gives us the following result: you'll see that we've got four items in the box-shadow property value: the first length value is the horizontal offset — the distance to the right the shadow is offset from the original box (or left, if the value is negative).
... the second length value is the vertical offset — the distance downwards that the shadow is offset from the original box (or upwards, if the value is negative).
Fundamental text and font styling - Learn web development
this takes up to four values, as shown in the example below: text-shadow: 4px 4px 5px red; the four properties are as follows: the horizontal offset of the shadow from the original text — this can take most available css length and size units, but you'll most commonly use px; positive values move the shadow right, and negative values left.
... the vertical offset of the shadow from the original text; behaves basically just like the horizontal offset, except that it moves the shadow up/down, not left/right.
CSS basics - Learn web development
its four values are: the first pixel value sets the horizontal offset of the shadow from the text: how far it moves across.
... the second pixel value sets the vertical offset of the shadow from the text: how far it moves down.
Performance best practices for Firefox front-end engineers
for instance, at time of writing accessing event.rangeoffset triggers reflow in gecko, and does not occur in the earlier link.
... nsidomwindowutils.getscrollxy() returns the window's scroll offsets without taking the chance of causing a sync reflow.
I/O Types
directory type file descriptor types file info types network address types types used with socket options functions type used with memory-mapped i/o offset interpretation for seek functions directory type prdir file descriptor types nspr represents i/o objects, such as open files and sockets, by file descriptors of type prfiledesc.
... file info types prfileinfo prfileinfo64 prfiletype network address types prnetaddr pripv6addr types used with socket options functions prsocketoptiondata prsockoption prlinger prmcastrequest type used with memory-mapped i/o prfilemap offset interpretation for seek functions prseekwhence ...
PRTimeParamFn
this type defines a callback function to calculate and return the time parameter offsets from a calendar time object in gmt.
... syntax #include <prtime.h> typedef prtimeparameters (pr_callback_decl *prtimeparamfn) (const prexplodedtime *gmt); description the type prtimeparamfn represents a callback function that, when given a time instant in gmt, returns the time zone information (offset from gmt and dst offset) at that time instant.
Pork Tool Development
source locations ast nodes have a location associated with them; sourceloc is defined to be an integer corresponding to an string offset.
... this can be translated to an unboxedloc, which has a line and column offset (see renamer.cc:65).
64-bit Compatibility
for example, this code will not load a native integer correctly on a 64-bit machine: struct object { void *data; }; lir->insload(lir_ld, objins, ins->insimm(offsetof(object, data))); lir_ld is 32-bit.
...luckily there is an alias that will choose the right opcode for you - lir_ldp: struct object { void *data; }; lir->insload(lir_ldp, objins, ins->insimm(offsetof(object, data))); when you use lirwriter::insstore, the correct size is chosen for you automatically, based on the size of the input operands.
Shell global objects
createmappedarraybuffer(filename, [offset, [size]]) create an array buffer that mmaps the given file.
... stackpointerinfo() return an int32 value which corresponds to the offset of the latest stack pointer, such that one can take the differences of 2 to estimate a frame-size.
Secure Development Guidelines
+2147483647 unsigned int 0 - +4294967295 64 signed long long -9223372036854775808 - +9223372036854775807 unsigned long long 0 - +18446744073709551615 int vuln_funct(int size) { char buf[1024]; if (size > sizeof(buf) - 1) return -1; } signedness issues: don’t mix signed and unsigned integers use unsigned integers for sizes, offsets, and indexes casting and truncation example: void vuln_funct() { u_int32_t size1 = 0xffffffff; u_int16_t size2 = size1; void *ptr = malloc(size2); if (!ptr) exit(exit_failure); memcpy(ptr, user_data, size1); } casting issues: sign extension example: int main() { int32_t new_size = 0; int8_t size = 0xff; new_size = size; printf("0x%...
...08x\r\n", new_size); } casting issues: sign extension prevention be careful with signed integers use unsigned integers for sizes, offsets, and indexes denial of service: divide by zero example: int main() { int a, b; if (argc != 3) return 1; a = atoi(argv[1]); b = atoi(argv[2]); return a/b; } denial of service: divide int_min by -1 example: int main(int argc, char **argv) { int a, b; if (argc != 3) return 1; a = atoi(argv[1]); b = atoi(argv[2]); return b ?
nsACString_internal
32) const - source parameters pruint32 i operator[] char operator[](pruint32) const - source parameters pruint32 i first char first() const - source last char last() const - source countchar pruint32 countchar(char) const - source parameters char <anonymous> findchar print32 findchar(char, pruint32) const - source parameters char <anonymous> pruint32 offset equals prbool equals(const nsacstring_internal&) const - source equality parameters nsacstring_internal& <anonymous> prbool equals(const nsacstring_internal&, const nscstringcomparator&) const - source parameters nsacstring_internal& <anonymous> nscstringcomparator& <anonymous> prbool equals(const char*) const - source parameters char* data prbool equals(const char*, cons...
... @param achar -- char to be stripped @param aoffset -- where in this string to start stripping chars parameters char achar print32 aoffset ...
nsAString_internal
uint32 i operator[] prunichar operator[](pruint32) const - source parameters pruint32 i first prunichar first() const - source last prunichar last() const - source countchar pruint32 countchar(prunichar) const - source parameters prunichar <anonymous> findchar print32 findchar(prunichar, pruint32) const - source parameters prunichar <anonymous> pruint32 offset equals prbool equals(const nsastring_internal&) const - source equality parameters nsastring_internal& <anonymous> prbool equals(const nsastring_internal&, const nsstringcomparator&) const - source parameters nsastring_internal& <anonymous> nsstringcomparator& <anonymous> prbool equals(const prunichar*) const - source parameters prunichar* data prbool equals(const prunich...
... @param achar -- char to be stripped @param aoffset -- where in this string to start stripping chars parameters prunichar achar print32 aoffset ...
nsDependentCSubstring
32) const - source parameters pruint32 i operator[] char operator[](pruint32) const - source parameters pruint32 i first char first() const - source last char last() const - source countchar pruint32 countchar(char) const - source parameters char <anonymous> findchar print32 findchar(char, pruint32) const - source parameters char <anonymous> pruint32 offset equals prbool equals(const nsacstring_internal&) const - source equality parameters nsacstring_internal& <anonymous> prbool equals(const nsacstring_internal&, const nscstringcomparator&) const - source parameters nsacstring_internal& <anonymous> nscstringcomparator& <anonymous> prbool equals(const char*) const - source parameters char* data prbool equals(const char*, cons...
... @param achar -- char to be stripped @param aoffset -- where in this string to start stripping chars parameters char achar print32 aoffset ...
nsDependentSubstring
uint32 i operator[] prunichar operator[](pruint32) const - source parameters pruint32 i first prunichar first() const - source last prunichar last() const - source countchar pruint32 countchar(prunichar) const - source parameters prunichar <anonymous> findchar print32 findchar(prunichar, pruint32) const - source parameters prunichar <anonymous> pruint32 offset equals prbool equals(const nsastring_internal&) const - source equality parameters nsastring_internal& <anonymous> prbool equals(const nsastring_internal&, const nsstringcomparator&) const - source parameters nsastring_internal& <anonymous> nsstringcomparator& <anonymous> prbool equals(const prunichar*) const - source parameters prunichar* data prbool equals(const prunich...
... @param achar -- char to be stripped @param aoffset -- where in this string to start stripping chars parameters prunichar achar print32 aoffset ...
IAccessibleHyperlink
endindex() [propget] hresult endindex( [out] long index ); parameters index the 0 based character offset at which the textual representation of the hyperlink ends.
...startindex() [propget] hresult startindex( [out] long index ); parameters index the 0 based character offset at which the textual representation of the hyperlink starts.
nsIAccessibleHyperLink
endindex long the end offset of the hyperlink accessible within the parent accessible.
... startindex long the offset of the hyperlink accessible within the parent accessible.
nsICompositionStringSynthesizer
sitioncommitasis", "", ""); if you need to commit composition with different commit string gecko 36 or later, you can use "compositioncommit": domwindowutils.sendcompositionevent("compositioncommit", "foo-bar-buzz", ""); method overview void appendclause(in unsigned long alength, in unsigned long aattribute); boolean dispatchevent(); void setcaret(in unsigned long aoffset, in unsigned long alength); void setstring(in astring astring); constants constant value description attr_raw_input 0x02 a clause attribute.
... void setcaret(in unsigned long aoffset, in unsigned long alength); parameters aoffset caret offset in the composition string.
nsIDOMHTMLTimeRanges
methods end() returns the time offset to the end of the specified time range.
... start() returns the time offset to the start of the specified time range.
nsIDOMWindowInternal
pagexoffset long returns the number of pixels that the document has already been scrolled horizontally.
... pageyoffset long returns the number of pixels that the document has already been scrolled vertically.
nsIInstallLocation
you should not use the exact values here, you should offset from these values each time you create a new install location.
... offsetting can be brittle but you should know what install locations are being defined for your own application.
nsIMsgDBHdr
statusoffset unsigned long indicates the offset within the message of the x-mozilla-status header.
... messageoffset unsigned long indicates the position of the offline copy of an imap or news messages within the offline store.
nsIMsgFolder
msgwindow); void setmsgdatabase(in nsimsgdatabase msgdatabase); nsimsgdatabase getdbfolderinfoanddb(out nsidbfolderinfo folderinfo); nsimsgdbhdr getmessageheader(in nsmsgkey msgkey); boolean shouldstoremsgoffline(in nsmsgkey msgkey); boolean hasmsgoffline(in nsmsgkey msgkey); nsiinputstream getofflinefilestream(in nsmsgkey msgkey, out pruint32 offset, out pruint32 size); void downloadmessagesforoffline(in nsisupportsarray messages, in nsimsgwindow window); nsimsgfolder getchildwithuri(in acstring uri, in boolean deep, in boolean caseinsensitive); void downloadallforoffline(in nsiurllistener listener, in nsimsgwindow window); void enablenotifications(in long notificationtype, in boolean enable, in boolean db...
...tdbfolderinfoanddb(out nsidbfolderinfo folderinfo); getmessageheader() nsimsgdbhdr getmessageheader(in nsmsgkey msgkey); shouldstoremsgoffline() boolean shouldstoremsgoffline(in nsmsgkey msgkey); hasmsgoffline() boolean hasmsgoffline(in nsmsgkey msgkey); getofflinefilestream() nsiinputstream getofflinefilestream(in nsmsgkey msgkey, out pruint32 offset, out pruint32 size); downloadmessagesforoffline() void downloadmessagesforoffline(in nsisupportsarray messages, in nsimsgwindow window); getchildwithuri() nsimsgfolder getchildwithuri(in acstring uri, in boolean deep, in boolean caseinsensitive); downloadallf...
nsIMsgSearchTerm
* @param ascopeterm scope of search * @param aoffset offset of message in message store.
... */ boolean matchbody(in nsimsgsearchscopeterm ascopeterm, in unsigned long long aoffset, in unsigned long alength, in string acharset, in nsimsgdbhdr amsg, in nsimsgdatabase adb); ...
nsINavHistoryQuery
nsigned long transitions); void setfolders([const,array, size_is(foldercount)] in long long folders, in unsigned long foldercount); void settransitions([const,array, size_is(count)] in unsigned long transitions, in unsigned long count); attributes attribute type description absolutebegintime prtime read only: retrieves the begin time value that the currently loaded reference points + offset resolve to.
... absoluteendtime prtime read only: retrieves the end time value that the currently loaded reference points + offset resolve to.
nsIOutputStream
example writesegments() example // copy data from a string to a stream static ns_method copysegment(nsiinputstream* astream, void* aclosure, char* atosegment, pruint32 afromoffset, pruint32 acount, pruint32* areadcount) { // afromsegment now contains acount bytes of data.
... nsacstring* pbuf = (nsacstring*) aclosure; const char* data; pruint32 len = ns_cstringgetdata(&data); data += afromoffset; len -= afromoffset; if (len > acount) len = acount; memcpy(atosegment, data, len); // indicate that we have copied len bytes to the segment *areadcount = len; return ns_ok; } // write the contents of asource into astream, using writesegments // to avoid intermediate buffer copies.
nsITextInputProcessor
vent adomkeyevent, [optional] in unsigned long akeyflags); boolean getmodifierstate(in domstring amodifierkeyname); boolean keydown([optional] in nsidomkeyevent adomkeyevent, [optional] in unsigned long akeyflags); boolean keyup([optional] in nsidomkeyevent adomkeyevent, [optional] in unsigned long akeyflags); void setcaretinpendingcomposition(in unsigned long aoffset); void setpendingcompositionstring(in domstring astring); void sharemodifierstateof(in nsitextinputprocessor aother); boolean startcomposition([optional] in nsidomkeyevent adomkeyevent, [optional] in unsigned long akeyflags); attributes attribute type description hascomposition boolean whether the instance has composition or not...
... void setcaretinpendingcomposition(in unsigned long aoffset); parameters aoffset caret offset in the composition string.
nsITraceableChannel
this.deferreddone = { promise: null, resolve: null, reject: null }; this.deferreddone.promise = new promise(function(resolve, reject) { this.resolve = resolve; this.reject = reject; }.bind(this.deferreddone)); object.freeze(this.deferreddone); this.promisedone = this.deferreddone.promise; } tracinglistener.prototype = { ondataavailable: function(arequest, acontext, ainputstream, aoffset, acount) { var istream = new binaryinputstream(ainputstream) // binaryainputstream var sstream = new storagestream(8192, acount, null); // storagestream // not sure why its 8192 but thats how eveyrone is doing it, we should ask why var ostream = new binaryoutputstream(sstream.getoutputstream(0)); // binaryoutputstream // copy received data as they come.
... var data = istream.readbytes(acount); this.receivedchunks.push(data); ostream.writebytes(data, acount); this.originallistener.ondataavailable(arequest, acontext, sstream.newinputstream(0), aoffset, acount); }, onstartrequest: function(arequest, acontext) { this.originallistener.onstartrequest(arequest, acontext); }, onstoprequest: function(arequest, acontext, astatuscode) { this.responsebody = this.receivedchunks.join(""); delete this.receivedchunks; this.responsestatus = astatuscode; this.originallistener.onstoprequest(arequest, acontext, astatuscode); this.deferreddone.resolve(); }, queryinterface: function(aiid) { if (aiid.equals(ci.nsistreamlistener) || aiid.equals(ci.nsisupports)) { return this; } throw cr.ns_nointerface; } }; var httpresponseobserve...
NS_CStringInsertData
#include "nsstringapi.h" nsresult ns_cstringinsertdata( nsacstring& astring, pruint32 aoffset, const char* adata, pruint32 adatalength = pr_uint32_max ); parameters astring [in] a nsacstring instance to be modified.
... aoffset [in] an offset into the string's internal buffer specifying where to place the given characters.
NS_StringInsertData
#include "nsstringapi.h" nsresult ns_stringinsertdata( nsacstring& astring, pruint32 aoffset, const prunichar* adata, pruint32 adatalength = pr_uint32_max ); parameters astring [in] a nsacstring instance to be modified.
... aoffset [in] an offset into the string's internal buffer specifying where to place the given characters.
Drawing and Event Handling - Plugins
instead, the windowed plug-in draws into the graphics port associated with the browser window, at the offset that the browser specifies.
... the plugin should draw to the drawable with the offset specified in the x and y members of the npwindow structure, with the clip rectangle specified in the cliprect member, and with the visual and colormap specified in the ws_info member.
Debugger.Frame - Firefox Developer Tools
offset the offset of the bytecode instruction currently being executed in script, or undefined if the frame’s script property is null.
... when this handler is called, this frame’s current execution location, as reflected in its offset and environment properties, is the operation which caused it to be unwound.
Debugger - Firefox Developer Tools
setting this to true enables code coverage instrumentation, which can be accessed via the debugger.script getoffsetscoverage function.
... offset the index of the character within linetext at which the error occurred.
Edit Shape Paths in CSS - Firefox Developer Tools
inset() if the value of shape-outside is inset() then you are using the inset basic shape, which enables the creation of offset values pulling the content in from the margin box.
... each side of the rectangle can be targeted after clicking on the shapes icon to activate the shape path editor, and dragging each side will update the values for the top, right, bottom, and left offset values.
Reposition elements in the page - Firefox Developer Tools
if the element is absolutely positioned, dashed lines are shown representing the offset parent.
...the offsets are indicated by a line and a tooltip for each side.
AudioBufferSourceNode.AudioBufferSourceNode() - Web APIs
this attribute is converted to an exact sample frame offset within the buffer, by multiplying by the buffer's sample rate and rounding to the nearest integer value.
...this attribute is converted to an exact sample frame offset within the buffer, by multiplying by the buffer's sample rate and rounding to the nearest integer value.
AudioBufferSourceNode.loopEnd - Web APIs
the loopend property of the audiobuffersourcenode interface specifies is a floating point number specifying, in seconds, at what offset into playing the audiobuffer playback should loop back to the time indicated by the loopstart property.
... syntax audiobuffersourcenode.loopend = endoffsetinseconds; var endoffsetinseconds = audiobuffersourcenode.loopend; value a floating-point number indicating the offset, in seconds, into the audio buffer at which each loop will loop return to the beginning of the loop (that is, the current play time gets reset to audiobuffersourcenode.loopstart).
Blob.slice() - Web APIs
WebAPIBlobslice
if you specify a negative value, it's treated as an offset from the end of the blob toward the beginning.
...if you specify a negative value, it's treated as an offset from the end of the blob toward the beginning.
CanvasGradient.addColorStop() - Web APIs
the canvasgradient.addcolorstop() method adds a new color stop, defined by an offset and a color, to a given canvas gradient.
... syntax void gradient.addcolorstop(offset, color); parameters offset a number between 0 and 1, inclusive, representing the position of the color stop.
CanvasGradient - Web APIs
canvasgradient.addcolorstop() adds a new stop, defined by an offset and a color, to the gradient.
... if the offset is not between 0 and 1, inclusive, an index_size_err is raised; if the color can't be parsed as a css <color>, a syntax_err is raised.
CanvasRenderingContext2D.arcTo() - Web APIs
const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); const p0 = { x: 230, y: 20 } const p1 = { x: 90, y: 130 } const p2 = { x: 20, y: 20 } const labelpoint = function (p) { const offset = 15; ctx.filltext('(' + p.x + ',' + p.y + ')', p.x + offset, p.y + offset); } ctx.beginpath(); ctx.moveto(p0.x, p0.y); ctx.arcto(p1.x, p1.y, p2.x, p2.y, 50); ctx.lineto(p2.x, p2.y); labelpoint(p0); labelpoint(p1); labelpoint(p2); ctx.stroke(); result result of a large radius if you use a relatively large radius, the arc may appear in a place you didn't expect.
...ument.getelementbyid('radius-output'); const control = document.getelementbyid('radius'); control.oninput = () => { controlout.textcontent = r = control.value; }; const mouse = { x: 0, y: 0 }; let r = 100; // radius const p0 = { x: 0, y: 50 }; const p1 = { x: 100, y: 100 }; const p2 = { x: 150, y: 50 }; const p3 = { x: 200, y: 100 }; const labelpoint = function (p, offset, i = 0){ const {x, y} = offset; ctx.beginpath(); ctx.arc(p.x, p.y, 2, 0, math.pi * 2); ctx.fill(); ctx.filltext(`${i}:(${p.x}, ${p.y})`, p.x + x, p.y + y); } const drawpoints = function (points){ for (let i = 0; i < points.length; i++) { var p = points[i]; labelpoint(p, { x: 0, y: -20 } , i) } } // draw arc const drawarc = function ([p0, p1, p2], r) { ctx.begi...
CaretPosition - Web APIs
caretposition.offsetnode read only returns a node containing the found node at the caret's position.
... caretposition.offset read only returns a long representing the character offset in the caret position node.
DOMLocator - Web APIs
domlocator.byteoffset read only returns a positive integer or -1.
... domlocator.utf16offset read only returns a positive integer or -1.
Document.caretRangeFromPoint() - Web APIs
stet clita kasd gubergren, no sea takimata sanctus est lorem ipsum dolor sit amet.</p> javascript function insertbreakatpoint(e) { let range; let textnode; let offset; if (document.caretpositionfrompoint) { range = document.caretpositionfrompoint(e.clientx, e.clienty); textnode = range.offsetnode; offset = range.offset; } else if (document.caretrangefrompoint) { range = document.caretrangefrompoint(e.clientx, e.clienty); textnode = range.startcontainer; offset = range.startoffset; } // only split text_nodes if (textnode && te...
...xtnode.nodetype == 3) { let replacement = textnode.splittext(offset); let br = document.createelement('br'); textnode.parentnode.insertbefore(br, replacement); } } let paragraphs = document.getelementsbytagname("p"); for (let i = 0; i < paragraphs.length; i++) { paragraphs[i].addeventlistener('click', insertbreakatpoint, false); } result ...
EffectTiming.iterationStart - Web APIs
syntax var timingproperties = { iterationstart = iterationnumber }; timingproperties.iterationstart = iterationnumber; value a floating-point value whose value is at least 0 and is not +infinity, indicating the offset into the number of iterations the animation sequence is to run at which to start animating.
... usually you'll use a value between 0.0 and 1.0 to indicate an offset into the first run of the animation at which to begin the animation performance, but any positive, non-infinite value is allowed.
Element.clientTop - Web APIs
WebAPIElementclientTop
as it happens, all that lies between the two locations (offsettop and client area top) is the element's border.
... this is because the offsettop indicates the location of the top of the border (not the margin) while the client area starts immediately below the border, (client area includes padding.) therefore, the clienttop value will always equal the integer portion of the .getcomputedstyle() value for "border-top-width".
Element: mousedown event - Web APIs
html <h1>drawing with mouse events</h1> <canvas id="mypics" width="560" height="360"></canvas> css canvas { border: 1px solid black; width: 560px; height: 360px; } javascript // when true, moving the mouse draws on the canvas let isdrawing = false; let x = 0; let y = 0; const mypics = document.getelementbyid('mypics'); const context = mypics.getcontext('2d'); // event.offsetx, event.offsety gives the (x,y) offset from the edge of the canvas.
... // add the event listeners for mousedown, mousemove, and mouseup mypics.addeventlistener('mousedown', e => { x = e.offsetx; y = e.offsety; isdrawing = true; }); mypics.addeventlistener('mousemove', e => { if (isdrawing === true) { drawline(context, x, y, e.offsetx, e.offsety); x = e.offsetx; y = e.offsety; } }); window.addeventlistener('mouseup', e => { if (isdrawing === true) { drawline(context, x, y, e.offsetx, e.offsety); x = 0; y = 0; isdrawing = false; } }); function drawline(context, x1, y1, x2, y2) { context.beginpath(); context.strokestyle = 'black'; context.linewidth = 1; context.moveto(x1, y1); context.lineto(x2, y2); context.stroke(); context.closepath(); } result specifications specification status ...
Element: mousemove event - Web APIs
html <h1>drawing with mouse events</h1> <canvas id="mypics" width="560" height="360"></canvas> css canvas { border: 1px solid black; width: 560px; height: 360px; } javascript // when true, moving the mouse draws on the canvas let isdrawing = false; let x = 0; let y = 0; const mypics = document.getelementbyid('mypics'); const context = mypics.getcontext('2d'); // event.offsetx, event.offsety gives the (x,y) offset from the edge of the canvas.
... // add the event listeners for mousedown, mousemove, and mouseup mypics.addeventlistener('mousedown', e => { x = e.offsetx; y = e.offsety; isdrawing = true; }); mypics.addeventlistener('mousemove', e => { if (isdrawing === true) { drawline(context, x, y, e.offsetx, e.offsety); x = e.offsetx; y = e.offsety; } }); window.addeventlistener('mouseup', e => { if (isdrawing === true) { drawline(context, x, y, e.offsetx, e.offsety); x = 0; y = 0; isdrawing = false; } }); function drawline(context, x1, y1, x2, y2) { context.beginpath(); context.strokestyle = 'black'; context.linewidth = 1; context.moveto(x1, y1); context.lineto(x2, y2); context.stroke(); context.closepath(); } result specifications specification status ...
Element: mouseup event - Web APIs
html <h1>drawing with mouse events</h1> <canvas id="mypics" width="560" height="360"></canvas> css canvas { border: 1px solid black; width: 560px; height: 360px; } javascript // when true, moving the mouse draws on the canvas let isdrawing = false; let x = 0; let y = 0; const mypics = document.getelementbyid('mypics'); const context = mypics.getcontext('2d'); // event.offsetx, event.offsety gives the (x,y) offset from the edge of the canvas.
... // add the event listeners for mousedown, mousemove, and mouseup mypics.addeventlistener('mousedown', e => { x = e.offsetx; y = e.offsety; isdrawing = true; }); mypics.addeventlistener('mousemove', e => { if (isdrawing === true) { drawline(context, x, y, e.offsetx, e.offsety); x = e.offsetx; y = e.offsety; } }); window.addeventlistener('mouseup', e => { if (isdrawing === true) { drawline(context, x, y, e.offsetx, e.offsety); x = 0; y = 0; isdrawing = false; } }); function drawline(context, x1, y1, x2, y2) { context.beginpath(); context.strokestyle = 'black'; context.linewidth = 1; context.moveto(x1, y1); context.lineto(x2, y2); context.stroke(); context.closepath(); } result specifications specification status ...
HTMLAudioElement - Web APIs
mozcurrentsampleoffset() returns the number of samples form the beginning of the stream that have been written so far into the audio stream created by calling mozwriteaudio().
... mozwriteaudio() writes a batch of audio frames to the stream at the current offset, returning the number of bytes actually written to the stream.
HTMLImageElement - Web APIs
htmlimageelement.x read only an integer indicating the horizontal offset of the left border edge of the image's css layout box relative to the origin of the <html> element's containing block.
... htmlimageelement.y read only the integer vertical offset of the top border edge of the image's css layout box relative to the origin of the <html> element's containing block.
IntersectionObserver.rootMargin - Web APIs
syntax var marginstring = intersectionobserver.rootmargin; value a string, formatted similarly to the css margin property's value, which contains offsets for one or more sides of the root's bounding box.
... these offsets are added to the corresponding values in the root's bounding box before the intersection between the resulting rectangle and the target element's bounds.
IntersectionObserver - Web APIs
intersectionobserver.rootmargin read only an offset rectangle applied to the root's bounding box when calculating intersections, effectively shrinking or growing the root for calculation purposes.
...each offset can be expressed in pixels (px) or as a percentage (%).
IntersectionObserverEntry.rootBounds - Web APIs
the intersectionobserverentry interface's read-only rootbounds property is a domrectreadonly corresponding to the target's root intersection rectangle, offset by the intersectionobserver.rootmargin if one is specified.
... this rectangle is offset by the values in intersectionobserver.rootmargin.
Intersection Observer API - Web APIs
the values in rootmargin define offsets added to each side of the intersection root's bounding box to create the final intersection root bounds (which are disclosed in intersectionobserverentry.rootbounds when the callback is executed).
...we need no margin, so the margin offset, rootmargin, is specified as "0px".
MSManipulationEvent - Web APIs
inertiadestinationxread only represents the predicted horizontal scroll offset after the inertia phase completes.
... inertiadestinationyread only represents the predicted vertical scroll offset after the inertia phase completes.
Media Session action types - Web APIs
the mediasessionactiondetails property seekoffset specifies the amount of time to seek backward.
...the mediasessionactiondetails property seekoffset specifies the amount of time to seek forward.
Range - Web APIs
WebAPIRange
range.endoffset read only returns a number representing where in the endcontainer the range ends.
... range.startoffset read only returns a number representing where in the startcontainer the range starts.
SVGAnimationElement - Web APIs
svganimationelement.beginelementat() creates a begin instance time for the current time plus the specified offset.
... svganimationelement.endelementat() creates a end instance time for the current time plus the specified offset.
Selection.collapse() - Web APIs
syntax sel.collapse(node, offset); parameters node the caret location will be within this node.
... offset optional the offset in node to which the selection will be collapsed.
Selection - Web APIs
WebAPISelection
selection.anchoroffsetread only returns a number representing the offset of the selection's anchor within the anchornode.
... selection.focusoffsetread only returns a number representing the offset of the selection's anchor within the focusnode.
Selection API - Web APIs
yeschrome android full support yesfirefox android full support yesopera android full support yessafari ios full support yessamsung internet android full support yesanchoroffset experimentalchrome full support 1edge full support 12firefox full support yesie ?
... yeschrome android full support yesfirefox android full support yesopera android full support yessafari ios full support yessamsung internet android full support yesfocusoffset experimentalchrome full support yesedge full support 12firefox full support yesie ?
StaticRange.StaticRange() - Web APIs
startoffset the offset into the starting node at which the first character of the range is found.
... endoffset the offset into the node indicated by endoffset at which the last character in the range is located.
Touch.screenX - Web APIs
WebAPITouchscreenX
summary returns the x coordinate of the touch point relative to the screen, not including any scroll offset.
... syntax var x = touchitem.screenx; return value x the x coordinate of the touch point relative to the screen, not including any scroll offset.
Touch.screenY - Web APIs
WebAPITouchscreenY
summary returns the y coordinate of the touch point relative to the screen, not including any scroll offset.
... syntax var y = touchitem.screeny; return value y the y coordinate of the touch point relative to the screen, not including any scroll offset.
WebGL2RenderingContext.bindBufferRange() - Web APIs
syntax void gl.bindbufferrange(target, index, buffer, offset, size); parameters target a glenum specifying the target for the bind operation.
... offset a glintptr specifying the starting offset.
WebGL2RenderingContext.copyBufferSubData() - Web APIs
syntax void gl.copybuffersubdata(readtarget, writetarget, readoffset, writeoffset, size); parameters readtarget writetarget a glenum specifying the binding point (target) from whose data store should be read or written.
... readoffset writeoffset a glintptr specifying the byte offset from which to start reading from or writing to the buffer.
WebGL2RenderingContext.getActiveUniforms() - Web APIs
gl.uniform_offset: returns an array of glint indicating the uniform buffer offsets.
... examples var uniformindices = gl.getuniformindices(program, ['ubored', 'ubogreen', 'uboblue']); var uniformoffsets = gl.getactiveuniforms(program, uniformindices, gl.uniform_offset); specifications specification status comment webgl 2.0the definition of 'getactiveuniforms' in that specification.
WebGL2RenderingContext.uniform[1234][uif][v]() - Web APIs
syntax void gl.uniform1ui(location, v0); void gl.uniform2ui(location, v0, v1); void gl.uniform3ui(location, v0, v1, v2); void gl.uniform4ui(location, v0, v1, v2, v3); void gl.uniform1fv(location, data, optional srcoffset, optional srclength); void gl.uniform2fv(location, data, optional srcoffset, optional srclength); void gl.uniform3fv(location, data, optional srcoffset, optional srclength); void gl.uniform4fv(location, data, optional srcoffset, optional srclength); void gl.uniform1iv(location, data, optional srcoffset, optional srclength); void gl.uniform2iv(location, data, optional srcoffset, optional srclength...
...); void gl.uniform3iv(location, data, optional srcoffset, optional srclength); void gl.uniform4iv(location, data, optional srcoffset, optional srclength); void gl.uniform1uiv(location, data, optional srcoffset, optional srclength); void gl.uniform2uiv(location, data, optional srcoffset, optional srclength); void gl.uniform3uiv(location, data, optional srcoffset, optional srclength); void gl.uniform4uiv(location, data, optional srcoffset, optional srclength); parameters location a webgluniformlocation object containing the location of the uniform attribute to modify.
WebGL2RenderingContext.uniformMatrix[234]x[234]fv() - Web APIs
syntax void gl.uniformmatrix2fv(location, transpose, data, optional srcoffset, optional srclength); void gl.uniformmatrix3x2fv(location, transpose, data, optional srcoffset, optional srclength); void gl.uniformmatrix4x2fv(location, transpose, data, optional srcoffset, optional srclength); void gl.uniformmatrix2x3fv(location, transpose, data, optional srcoffset, optional srclength); void gl.uniformmatrix3fv(location, transpose, data, optional srcoffset, optional srclength); void gl.uniformmatrix4x3fv(location, transpose, data, o...
...ptional srcoffset, optional srclength); void gl.uniformmatrix2x4fv(location, transpose, data, optional srcoffset, optional srclength); void gl.uniformmatrix3x4fv(location, transpose, data, optional srcoffset, optional srclength); void gl.uniformmatrix4fv(location, transpose, data, optional srcoffset, optional srclength); parameters location a webgluniformlocation object containing the location of the uniform attribute to modify.
WebGLRenderingContext.bufferData() - Web APIs
srcdata, usage); void gl.bufferdata(target, arraybufferview srcdata, usage); // webgl2: void gl.bufferdata(target, arraybufferview srcdata, usage, srcoffset, length); parameters target a glenum specifying the binding point (target).
... srcoffset a gluint specifying the element index offset where to start reading the buffer.
WebGLRenderingContext.disable() - Web APIs
gl.polygon_offset_fill deactivates adding an offset to depth values of polygon's fragments.
... see webglrenderingcontext.polygonoffset().
WebGLRenderingContext.enable() - Web APIs
gl.polygon_offset_fill activates adding an offset to depth values of polygon's fragments.
... see webglrenderingcontext.polygonoffset().
WebGLRenderingContext.isEnabled() - Web APIs
gl.polygon_offset_fill adding an offset to depth values of polygon's fragments.
... see webglrenderingcontext.polygonoffset().
WebGLRenderingContext.readPixels() - Web APIs
syntax // webgl1: void gl.readpixels(x, y, width, height, format, type, pixels); // webgl2: void gl.readpixels(x, y, width, height, format, type, glintptr offset); void gl.readpixels(x, y, width, height, format, type, arraybufferview pixels, gluint dstoffset); parameters x a glint specifying the first horizontal pixel that is read from the lower left corner of a rectangular block of pixels.
... dstoffset optional offset.
Adding 2D content to a WebGL context - Web APIs
{ const numcomponents = 2; // pull out 2 values per iteration const type = gl.float; // the data in the buffer is 32bit floats const normalize = false; // don't normalize const stride = 0; // how many bytes to get from one set of values to the next // 0 = use type and numcomponents above const offset = 0; // how many bytes inside the buffer to start from gl.bindbuffer(gl.array_buffer, buffers.position); gl.vertexattribpointer( programinfo.attriblocations.vertexposition, numcomponents, type, normalize, stride, offset); gl.enablevertexattribarray( programinfo.attriblocations.vertexposition); } // tell webgl to use ...
...our program when drawing gl.useprogram(programinfo.program); // set the shader uniforms gl.uniformmatrix4fv( programinfo.uniformlocations.projectionmatrix, false, projectionmatrix); gl.uniformmatrix4fv( programinfo.uniformlocations.modelviewmatrix, false, modelviewmatrix); { const offset = 0; const vertexcount = 4; gl.drawarrays(gl.triangle_strip, offset, vertexcount); } } the first step is to clear the canvas to our background color; then we establish the camera's perspective.
Creating 3D objects using WebGL - Web APIs
gl.vertexattribpointer( programinfo.attriblocations.vertexposition, numcomponents, type, normalize, stride, offset); gl.enablevertexattribarray( programinfo.attriblocations.vertexposition); } define the vertices' colors we also need to build an array of colors for each of the 24 vertices.
... { const vertexcount = 36; const type = gl.unsigned_short; const offset = 0; gl.drawelements(gl.triangles, vertexcount, type, offset); } since each face of our cube is comprised of two triangles, there are 6 vertices per side, or 36 total vertices in the cube, even though many of them are duplicates.
WebXR Device API - Web APIs
each view has an offset used to shift the position of the view relative to the camera, in order to allow for creating stereographic effects.
...one view is offset to the left slightly from the viewer's position, and the other view is offset to the right by the same distance.
window.location - Web APIs
WebAPIWindowlocation
example #6: using bookmarks without changing the hash property: <!doctype html> <html> <head> <meta charset="utf-8"/> <title>mdn example</title> <script> function shownode (onode) { document.documentelement.scrolltop = onode.offsettop; document.documentelement.scrollleft = onode.offsetleft; } function showbookmark (sbookmark, busehash) { if (arguments.length === 1 || busehash) { location.hash = sbookmark; return; } var obookmark = document.queryselector(sbookmark); if (obookmark) { shownode(obookmark); } } </script> <style> span.intlink { cursor: pointer; color: #0000ff; text-decoration: underline; } </...
...window.addeventlistener("scroll", _chkowner, false); } else if (window.attachevent) { window.attachevent("onscroll", _chkowner); } return function (sbookmark, busehash) { var onode = document.queryselector(sbookmark); _scrolly = document.documentelement.scrolltop; _scrollx = document.documentelement.scrollleft; _bookmark = sbookmark; _usehash = busehash === true; _nodex = onode.offsetleft; _nodey = onode.offsettop; _itframe = 1; if (_scrollid === -1) { _scrollid = setinterval(_next, math.round(nduration / nframes)); } }; })(); specifications specification status comment html living standardthe definition of 'window.location' in that specification.
Window.open() - Web APIs
WebAPIWindowopen
an offset is universally implemented by browser manufacturers (it is 29 pixels in ie6 sp2 with the default theme) and its purpose is to help users to notice new windows opening.
... if the most recently used window was maximized, then there is no offset: the new window will be maximized as well.
XRPose.emulatedPosition - Web APIs
if its position is computed as an offset from another object (such as by basing it off the model representing the user's body), then this value is true.
... this information is important because devices whose position is emulated are prone to their offset drifting relative to the real world space over time.
XRRigidTransform() - Web APIs
let animationframerequestid = 0; xrsession.requestreferencespace("local-floor") .then((refspace) => { xrreferencespace = refspace.getoffsetreferencespace( new xrrigidtransform(viewerposition, viewerorientation)); animationframerequestid = xrsession.requestanimationframe(drawframe); }); after requesting a reference space of type local-floor, the returned promise is eventually resolved, at which time we receive a new reference space object, refspace.
... after creating an xrrigidtransform from the viewer's initial position and orientation, we pass the new transform into getoffsetreferencespace() to create another reference space, now offset so that its origin is located at the same place in space as the coordinates given by viewerposition, with the orientation also revised in the same fashion.
XRRigidTransform.position - Web APIs
bounded-floor").then((refspace) => { refspacecreated(refspace); }).catch(() => { session.requestreferencespace("local-floor").then(refspacecreated); }); } else { session.requestreferencespace("viewer").then(refspacecreated); } } function refspacecreated(refspace) { if (immersivesession) { xrreferencespace = refspace; } else { xrreferencespace = refspace.getoffsetreferencespace( new xrrigidtransform({y: -1.5}); ); } xrsession.requestanimationframe(onframe); } after setting up the graphics context for webxr use, this begins by looking to see if a variable immersivesession is true; if so, we first request a bounded-floor reference space.
...however, for inline sesions, we know we're in a space not automatically adjusted for floor level, so we request an offset reference space to shift the viewer's height to 1.5 meters above the presumed floor level of 0 meters.
XRViewport.x - Web APIs
WebAPIXRViewportx
the read-only xrviewport interface's x property indicates the offset from the left edge of the destination surface (typically a xrwebgllayer to the left edge of the viewport within the surface into which webxr content is to be rendered.
... syntax x = xrviewport.x; value the offset from the left edge of the rendering surface to the left edge of the viewport, in pixels.
XRViewport.y - Web APIs
WebAPIXRViewporty
the read-only xrviewport interface's y property indicates the offset from the bottom edge of the destination surface (typically a xrwebgllayer to the bottom edge of the viewport within the surface into which webxr content is to be rendered.
... syntax y = xrviewport.y; value the offset from the bottom edge of the rendering surface to the bottom edge of the viewport, in pixels.
XRViewport - Web APIs
x read only the offset from the origin of the destination graphics surface (typically a xrwebgllayer) to the left edge of the viewport, in pixels.
... y read only the offset from the origin of the viewport to the bottom edge of the viewport; webgl's coordinate system places (0, 0) at the bottom left corner of the surface.
Box alignment for block, absolutely positioned and table layout - CSS: Cascading Style Sheets
absolutely positioned elements the alignment container is the positioned block, accounting for the offset values of top, left, bottom, and right.
... absolutely positioned elements the alignment container is the positioned block, accounting for the offset values of top, left, bottom, and right.
CSS grids, logical values, and writing modes - CSS: Cascading Style Sheets
if we position an item using absolute positioning, we use these physical keywords as offset values to push the item around.
... if you use absolute positioning within a grid area, then you will again be using physical offsets to push the item around inside the grid area.
Animatable CSS properties - CSS: Cascading Style Sheets
n-block-end margin-block-start margin-bottom margin-inline-end margin-inline-start margin-left margin-right margin-top mask mask-border mask-position mask-size max-block-size max-height max-inline-size max-lines max-width min-block-size min-height min-inline-size min-width object-position offset offset-anchor offset-distance offset-path offset-position offset-rotate opacity order outline outline-color outline-offset outline-width padding padding-block-end padding-block-start padding-bottom padding-inline-end padding-inline-start padding-left padding-right padding-top perspective ...
...oll-padding-left scroll-padding-right scroll-padding-top scroll-snap-coordinate scroll-snap-destination scrollbar-color shape-image-threshold shape-margin shape-outside tab-size text-decoration text-decoration-color text-decoration-thickness text-emphasis text-emphasis-color text-indent text-shadow text-underline-offset top transform transform-origin translate vertical-align visibility width word-spacing z-index zoom ...
Layout and the containing block - CSS: Cascading Style Sheets
percentage values that are applied to the width, height, padding, margin, and offset properties of an absolutely positioned element (i.e., which has its position set to absolute or fixed) are computed from the element's containing block.
...the properties that work this way are box model properties and offset properties: the height, top, and bottom properties compute percentage values from the height of the containing block.
CSS reference - CSS: Cascading Style Sheets
WebCSSReference
trix3d()max()max-block-sizemax-heightmax-height (@viewport)max-inline-sizemax-widthmax-width (@viewport)max-zoom (@viewport)@mediamin()min-block-sizemin-heightmin-height (@viewport)min-inline-sizemin-widthmin-width (@viewport)min-zoom (@viewport)minmax()mix-blend-modemmmsn@namespacenegative (@counter-style):not:nth-child:nth-last-child:nth-last-of-type:nth-of-type<number>oobject-fitobject-positionoffsetoffset-anchoroffset-distanceoffset-pathoffset-rotate:only-child:only-of-typeopacityopacity():optionalorderorientation (@viewport)@ornamentsornaments()orphans:out-of-rangeoutlineoutline-coloroutline-offsetoutline-styleoutline-widthoverflowoverflow-anchoroverflow-blockoverflow-inlineoverflow-wrapoverflow-xoverflow-yoverscroll-behavioroverscroll-behavior-blockoverscroll-behavior-inlineoverscroll-beha...
...rgettarget-counter()target-counters()target-text()text-aligntext-align-lasttext-combine-uprighttext-decorationtext-decoration-colortext-decoration-linetext-decoration-skip-inktext-decoration-styletext-decoration-thicknesstext-emphasistext-emphasis-colortext-emphasis-positiontext-emphasis-styletext-indenttext-justifytext-orientationtext-overflowtext-renderingtext-shadowtext-transformtext-underline-offsettext-underline-position<time><time-percentage><timing-function>top@top-centertouch-actiontransformtransform-box<transform-function>transform-origintransform-styletransitiontransition-delaytransition-durationtransition-propertytransition-timing-functiontranslatetranslate()translate3d()translatex()translatey()translatez()turnuunicode-bidiunicode-range (@font-face)unset<url>url()user-zoom (@viewport)...
Cubic Bezier Generator - CSS: Cascading Style Sheets
radius, 0, 2 * math.pi); ctx.fill(); ctx.stroke(); ctx.closepath(); } else { alert('you need safari or firefox 1.5+ to see this demo.'); } } function mousedown(e) { var canvas = document.getelementbyid('bezier'); var x1 = cx(document.getelementbyid('x1').value); var y1 = cy(document.getelementbyid('y1').value); var x = e.pagex - canvas.offsetleft; var y = e.pagey - canvas.offsettop; var output = document.getelementbyid('output'); output.value = "(" + x + "," + y + ") should be (" + x1 + "," + y1 + ")"; if ((x1 + radius >= x) && (x1 - radius <= x) && (y1 + radius >= y) && (y1 - radius <= y)) { var output = document.getelementbyid('output'); output.value = "p1!"; dragsm = 1; } var x2 =...
... // if we are starting a drag if (dragsm != 0) { canvas.onmousemove = mousemove; } } function mouseup(e) { var output = document.getelementbyid('output'); output.value = "mouse up!"; dragsm = 0; canvas.onmousemove = null; } function mousemove(e) { if (dragsm != 0) { var canvas = document.getelementbyid('bezier'); var x = e.pagex - canvas.offsetleft; var y = e.pagey - canvas.offsettop; var output = document.getelementbyid('output'); output.value = "drag!"; if (dragsm == 1) { var x1 = document.getelementbyid('x1'); var y1 = document.getelementbyid('y1'); x1.value = reversex(x); x1.value = math.round(x1.value * 10000) / 10000; y1.value = reversey(...
border-image-slice - CSS: Cascading Style Sheets
values <number> represents an edge offset in pixels for raster images and coordinates for vector images.
... <percentage> represents an edge offset as a percentage of the source image's size: the width of the image for horizontal offsets, the height for vertical offsets.
inset-block-end - CSS: Cascading Style Sheets
the inset-block-end css property defines the logical block end offset of an element, which maps to a physical inset depending on the element's writing mode, directionality, and text orientation.
... formal definition initial valueautoapplies topositioned elementsinheritednopercentageslogical-height of containing blockcomputed valuesame as box offsets: top, right, bottom, left properties except that directions are logicalanimation typea length, percentage or calc(); formal syntax <'top'> examples setting block end offset html <div> <p class="exampletext">example text</p> </div> css div { background-color: yellow; width: 120px; height: 120px; } .exampletext { writing-mode: vertical-rl; position: relative; inset-block-en...
inset-block-start - CSS: Cascading Style Sheets
the inset-block-start css property defines the logical block start offset of an element, which maps to a physical inset depending on the element's writing mode, directionality, and text orientation.
... formal definition initial valueautoapplies topositioned elementsinheritednopercentageslogical-height of containing blockcomputed valuesame as box offsets: top, right, bottom, left properties except that directions are logicalanimation typea length, percentage or calc(); formal syntax <'top'> examples setting block start offset html <div> <p class="exampletext">example text</p> </div> css div { background-color: yellow; width: 120px; height: 120px; } .exampletext { writing-mode: vertical-lr; position: relative; inset-block-...
inset-block - CSS: Cascading Style Sheets
the inset-block css property defines the logical block start and end offsets of an element, which maps to physical offsets depending on the element's writing mode, directionality, and text orientation.
... formal definition initial valueautoapplies topositioned elementsinheritednopercentageslogical-height of containing blockcomputed valuesame as box offsets: top, right, bottom, left properties except that directions are logicalanimation typea length, percentage or calc(); formal syntax <'top'>{1,2} examples setting block start and end offsets html <div> <p class="exampletext">example text</p> </div> css div { background-color: yellow; width: 120px; height: 120px; } .exampletext { writing-mode: vertical-lr; position: relative; ...
inset-inline-start - CSS: Cascading Style Sheets
the inset-inline-start css property defines the logical inline start inset of an element, which maps to a physical offset depending on the element's writing mode, directionality, and text orientation.
... formal definition initial valueautoapplies topositioned elementsinheritednopercentageslogical-width of containing blockcomputed valuesame as box offsets: top, right, bottom, left properties except that directions are logicalanimation typea length, percentage or calc(); formal syntax <'top'> examples setting inline start offset html <div> <p class="exampletext">example text</p> </div> css div { background-color: yellow; width: 120px; height: 120px; } .exampletext { writing-mode: vertical-lr; position: relative; inset-inlin...
inset-inline - CSS: Cascading Style Sheets
the inset-inline css property defines the logical start and end offsets of an element in the inline direction, which maps to physical offsets depending on the element's writing mode, directionality, and text orientation.
... formal definition initial valueautoapplies topositioned elementsinheritednopercentageslogical-width of containing blockcomputed valuesame as box offsets: top, right, bottom, left properties except that directions are logicalanimation typea length, percentage or calc(); formal syntax <'top'>{1,2} examples setting inline start and end offsets html <div> <p class="exampletext">example text</p> </div> css div { background-color: yellow; width: 120px; height: 120px; } .exampletext { writing-mode: vertical-lr; position: relative;...
inset - CSS: Cascading Style Sheets
WebCSSinset
the inset css property, though part of the logical specification, doesn't define logical block or inline offsets, and instead defines physical offsets, regardless of the element's writing mode, directionality, and text orientation.
...formal definition initial valueautoapplies topositioned elementsinheritednopercentageslogical-height of containing blockcomputed valuesame as box offsets: top, right, bottom, left properties except that directions are logicalanimation typea length, percentage or calc(); formal syntax <'top'>{1,4} examples setting offsets for an element html <div> <span class="exampletext">example text</span> </div> css div { background-color: yellow; width: 150px; height: 120px; position: relative; } .exampletext { writing-mode: sideways-rl;...
mask-border-slice - CSS: Cascading Style Sheets
values <number> represents an edge offset in pixels for raster images and coordinates for vector images.
... <percentage> represents an edge offset as a percentage of the source image's size: the width of the image for horizontal offsets, the height for vertical offsets.
mask-position - CSS: Cascading Style Sheets
relative or absolute offsets can be given.
... formal definition initial valuecenterapplies toall elements; in svg, it applies to container elements excluding the defs element and all graphics elementsinheritednopercentagesrefer to size of mask painting area minus size of mask layer image (see the text for background-position)computed valueconsists of two keywords representing the origin and two offsets from that origin, each given as an absolute length (if given a <length>), otherwise as a percentage.animation typerepeatable list of simple list of length, percentage, or calc formal syntax <position>#where <position> = [ [ left | center | right ] | [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ]?
mix-blend-mode - CSS: Cascading Style Sheets
class="col"> <div class="note">blending in isolation (no blending with the background)</div> <div class="row isolate"> <div class="cell"> normal <div class="container normal"> <div class="group"> <div class="item firefox"></div> <svg viewbox="0 0 150 150"> <defs> <lineargradient id="red"> <stop offset="0" stop-color="hsl(0,100%,50%)" /> <stop offset="100%" stop-color="hsl(0,0%,100%)" /> </lineargradient> <lineargradient id="green"> <stop offset="0" stop-color="hsl(120,100%,50%)" /> <stop offset="100%" stop-color="hsl(120,0%,100%)" /> </lineargradient> <lineargradient id="...
...blue"> <stop offset="0" stop-color="hsl(240,100%,50%)" /> <stop offset="100%" stop-color="hsl(240,0%,100%)" /> </lineargradient> </defs> <ellipse class="item r" cx="75" cy="75" rx="25" ry="70"></ellipse> <ellipse class="item g" cx="75" cy="75" rx="25" ry="70"></ellipse> <ellipse class="item b" cx="75" cy="75" rx="25" ry="70"></ellipse> </svg> </div> </div> </div> <div class="cell"> multiply <div class="container multiply"> <div class="group"> <div class="item firefox"></div> <svg viewbox="0 0 150 150"> <ellipse class="item r" cx="75" cy="75" rx="25" ry="70"></ellipse> <ellipse...
scroll-snap-type-x - CSS: Cascading Style Sheets
if content is added, moved, deleted or resized the scroll offset will be adjusted to maintain the resting on that snap point.
...if content is added, moved, deleted or resized the scroll offset may be adjusted to maintain the resting on that snap point.
scroll-snap-type-y - CSS: Cascading Style Sheets
if content is added, moved, deleted or resized the scroll offset will be adjusted to maintain the resting on that snap point.
...if content is added, moved, deleted or resized the scroll offset may be adjusted to maintain the resting on that snap point.
scroll-snap-type - CSS: Cascading Style Sheets
if content is added, moved, deleted or resized the scroll offset will be adjusted to maintain the resting on that snap point.
...if content is added, moved, deleted or resized the scroll offset may be adjusted to maintain the resting on that snap point.
<colgroup> - HTML: Hypertext Markup Language
WebHTMLElementcolgroup
possible values are: left, aligning the content to the left of the cell center, centering the content in the cell right, aligning the content to the right of the cell justify, inserting spaces into the textual content so that the content is justified in the cell char, aligning the textual content on a special character with a minimal offset, defined by the char and charoff attributes.
... charoff this attribute is used to indicate the number of characters to offset the column data from the alignment character specified by the char attribute.
<tbody>: The Table Body element - HTML: Hypertext Markup Language
WebHTMLElementtbody
possible values are: left, aligning the content to the left of the cell center, centering the content in the cell right, aligning the content to the right of the cell justify, inserting spaces into the textual content so that the content is justified in the cell char, aligning the textual content on a special character with a minimal offset, defined by the char and charoff attributes.
... charoff this attribute is used to indicate the number of characters to offset the column data from the alignment characters specified by the char attribute.
<tfoot>: The Table Foot element - HTML: Hypertext Markup Language
WebHTMLElementtfoot
possible values are: left, aligning the content to the left of the cell center, centering the content in the cell right, aligning the content to the right of the cell justify, inserting spaces into the textual content so that the content is justified in the cell char, aligning the textual content on a special character with a minimal offset, defined by the char and charoff attributes unimplemented (see bug 2212).
... charoff deprecated since html4obsolete since html5 this attribute is used to indicate the number of characters to offset the column data from the alignment characters specified by the char attribute.
<thead>: The Table Head element - HTML: Hypertext Markup Language
WebHTMLElementthead
possible values are: left, aligning the content to the left of the cell center, centering the content in the cell right, aligning the content to the right of the cell justify, inserting spaces into the textual content so that the content is justified in the cell char, aligning the textual content on a special character with a minimal offset, defined by the char and charoff attributes unimplemented (see bug 2212).
... charoff in html 4, in html5 this attribute is used to indicate the number of characters to offset the column data from the alignment characters specified by the char attribute.
Array.prototype.slice() - JavaScript
a negative index can be used, indicating an offset from the end of the sequence.
... a negative index can be used, indicating an offset from the end of the sequence.
DataView.prototype.byteLength - JavaScript
if the dataview is not specifying an offset or a bytelength, the bytelength of the referenced arraybuffer or sharedarraybuffer will be returned.
... examples using the bytelength property var buffer = new arraybuffer(8); var dataview = new dataview(buffer); dataview.bytelength; // 8 (matches the bytelength of the buffer) var dataview2 = new dataview(buffer, 1, 5); dataview2.bytelength; // 5 (as specified when constructing the dataview) var dataview3 = new dataview(buffer, 2); dataview3.bytelength; // 6 (due to the offset of the constructed dataview) specifications specification ecmascript (ecma-262)the definition of 'dataview.prototype.bytelength' in that specification.
Date.prototype.toString() - JavaScript
"26" space the string "gmt" timezone offset sign, either: "+" for positive offsets (0 or greater) "-" for negative offsets (less than zero) two digit hour offset, e.g.
... "14" two digit minute offset, e.g.
Date - JavaScript
host system) time zone and offset.
...(negative values are returned for prior times.) date.prototype.gettimezoneoffset() returns the time-zone offset in minutes for the current locale.
SharedArrayBuffer.prototype.slice() - JavaScript
a negative index can be used, indicating an offset from the end of the sequence.
... a negative index can be used, indicating an offset from the end of the sequence.
TypedArray.prototype.byteLength - JavaScript
if the typedarray is not specifying an byteoffset or a length, the length of the referenced arraybuffer will be returned.
... examples using the bytelength property var buffer = new arraybuffer(8); var uint8 = new uint8array(buffer); uint8.bytelength; // 8 (matches the bytelength of the buffer) var uint8 = new uint8array(buffer, 1, 5); uint8.bytelength; // 5 (as specified when constructing the uint8array) var uint8 = new uint8array(buffer, 2); uint8.bytelength; // 6 (due to the offset of the constructed uint8array) specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.bytelength' in that specification.
TypedArray.prototype.length - JavaScript
if the typedarray is not specifying an byteoffset or a length, the length of the referenced arraybuffer will be returned.
... examples using the length property var buffer = new arraybuffer(8); var uint8 = new uint8array(buffer); uint8.length; // 8 (matches the length of the buffer) var uint8 = new uint8array(buffer, 1, 5); uint8.length; // 5 (as specified when constructing the uint8array) var uint8 = new uint8array(buffer, 2); uint8.length; // 6 (due to the offset of the constructed uint8array) specifications specification ecmascript (ecma-262)the definition of 'typedarray.prototype.length' in that specification.
TypedArray.prototype.slice() - JavaScript
a negative index can be used, indicating an offset from the end of the sequence.
... a negative index can be used, indicating an offset from the end of the sequence.
for - JavaScript
var i = 0; for (;;) { if (i > 3) break; console.log(i); i++; } using for without a statement the following for cycle calculates the offset position of a node in the final-expression section, and therefore it does not require the use of a statement section, a semicolon is used instead.
... function showoffsetpos(sid) { var nleft = 0, ntop = 0; for ( var oitnode = document.getelementbyid(sid); /* initialization */ oitnode; /* condition */ nleft += oitnode.offsetleft, ntop += oitnode.offsettop, oitnode = oitnode.offsetparent /* final-expression */ ); /* semicolon */ console.log('offset position of \'' + sid + '\' element:\n left: ' + nleft + 'px;\n top: ' + ntop + 'px;'); } /* example call: */ showoffsetpos('content'); // output: // "offset position of "content" element: // left: 0px; // top: 153px;" note: this is one of the few cases in javascript where the semicolon is mandatory.
JavaScript typed arrays - JavaScript
a view provides a context — that is, a data type, starting offset, and the number of elements — that turns the data into a typed array.
... working with complex data structures by combining a single buffer with multiple views of different types, starting at different offsets into the buffer, you can interact with data objects containing multiple data types.
<mpadded> - MathML
voffset sets or increments the vertical position.
... pseudo-units it is possible to use the keywords "depth", "height", and "width" as a pseudo-unit for the attributes depth, height, lspace, voffset, and width.
SVG Presentation Attributes - SVG: Scalable Vector Graphics
font-family font-size font-size-adjust font-stretch font-style font-variant font-weight glyph-orientation-horizontal glyph-orientation-vertical image-rendering kerning letter-spacing lighting-color marker-end marker-mid marker-start mask opacity overflow pointer-events shape-rendering solid-color solid-opacity stop-color stop-opacity stroke stroke-dasharray stroke-dashoffset stroke-linecap stroke-linejoin stroke-miterlimit stroke-opacity stroke-width text-anchor text-decoration text-rendering transform unicode-bidi vector-effect visibility word-spacing writing-mode attributes alignment-baseline it specifies how an object is aligned along the font baseline with respect to its parent.
... value: none|<dasharray>; animatable: yes stroke-dashoffset defines an offset on the rendering of the associated dash array.
color-interpolation-filters - SVG: Scalable Vector Graphics
therefore, it has no effect on filter primitives like <feoffset>, <feimage>, <fetile> or <feflood>.
... as a presentation attribute, it can be applied to any element but it only has an effect on the following eighteen elements: <fespotlight>, <feblend>, <fecolormatrix>, <fecomponenttransfer>, <fecomposite>, <feconvolvematrix>, <fediffuselighting>, <fedisplacementmap>, <fedropshadow>, <feflood>, <fegaussianblur>, <feimage>, <femerge>, <femorphology>, <feoffset>, <fespecularlighting>, <fetile>, <feturbulence> usage notes value auto | srgb | linearrgb default value linearrgb animatable yes auto indicates that the user agent can choose either the srgb or linearrgb spaces for color interpolation.
fr - SVG: Scalable Vector Graphics
WebSVGAttributefr
only one element is using this attribute: <radialgradient> html, body, svg { height: 100%; } <svg viewbox="0 0 480 200" xmlns="http://www.w3.org/2000/svg"> <defs> <radialgradient id="gradient1" cx="0.5" cy="0.5" r="0.5" fx="0.35" fy="0.35" fr="5%"> <stop offset="0%" stop-color="white"/> <stop offset="100%" stop-color="darkseagreen"/> </radialgradient> <radialgradient id="gradient2" cx="0.5" cy="0.5" r="0.5" fx="0.35" fy="0.35" fr="25%"> <stop offset="0%" stop-color="white"/> <stop offset="100%" stop-color="darkseagreen"/> </radialgradient> </defs> <circle cx="100" cy="100" r="100" fill="url(#gradient1)" /> <circle cx="100" cy="100" r="100" fill...
...="url(#gradient2)" style="transform: translatex(240px);" /> </svg> usage notes value <length> default value 0 animatable none example <svg viewbox="0 0 120 120" width="200" height="200" xmlns="http://www.w3.org/2000/svg"> <defs> <radialgradient id="gradient" cx="0.5" cy="0.5" r="0.5" fx="0.35" fy="0.35" fr="5%"> <stop offset="0%" stop-color="red"/> <stop offset="100%" stop-color="blue"/> </radialgradient> </defs> <rect x="10" y="10" rx="15" ry="15" width="100" height="100" fill="url(#gradient)" stroke="black" stroke-width="2"/> <circle cx="60" cy="60" r="50" fill="transparent" stroke="white" stroke-width="2"/> <circle cx="35" cy="35" r="2" fill="white" stroke="white"/> <circle cx="60" cy="60" r="2" f...
fx - SVG: Scalable Vector Graphics
WebSVGAttributefx
only one element is using this attribute: <radialgradient> html, body, svg { height: 100%; } <svg viewbox="0 0 480 200" xmlns="http://www.w3.org/2000/svg"> <defs> <radialgradient id="gradient1" cx="0.5" cy="0.5" r="0.5" fx="0.35" fy="0.35" fr="5%"> <stop offset="0%" stop-color="white"/> <stop offset="100%" stop-color="darkseagreen"/> </radialgradient> <radialgradient id="gradient2" cx="0.5" cy="0.5" r="0.5" fx="0.75" fy="0.35" fr="5%"> <stop offset="0%" stop-color="white"/> <stop offset="100%" stop-color="darkseagreen"/> </radialgradient> </defs> <circle cx="100" cy="100" r="100" fill="url(#gradient1)" /> <circle cx="100" cy="100" r="1...
... animatable none example <svg viewbox="0 0 120 120" width="200" height="200" xmlns="http://www.w3.org/2000/svg"> <defs> <radialgradient id="gradient" cx="0.5" cy="0.5" r="0.5" fx="0.35" fy="0.35" fr="5%"> <stop offset="0%" stop-color="red"/> <stop offset="100%" stop-color="blue"/> </radialgradient> </defs> <rect x="10" y="10" rx="15" ry="15" width="100" height="100" fill="url(#gradient)" stroke="black" stroke-width="2"/> <circle cx="60" cy="60" r="50" fill="transparent" stroke="white" stroke-width="2"/> <circle cx="35" cy="35" r="2" fill="white" stroke="white"/> <circle cx="60" cy="...
fy - SVG: Scalable Vector Graphics
WebSVGAttributefy
only one element is using this attribute: <radialgradient> html, body, svg { height: 100%; } <svg viewbox="0 0 480 200" xmlns="http://www.w3.org/2000/svg"> <defs> <radialgradient id="gradient1" cx="0.5" cy="0.5" r="0.5" fx="0.35" fy="0.35" fr="5%"> <stop offset="0%" stop-color="white"/> <stop offset="100%" stop-color="darkseagreen"/> </radialgradient> <radialgradient id="gradient2" cx="0.5" cy="0.5" r="0.5" fx="0.35" fy="0.75" fr="5%"> <stop offset="0%" stop-color="white"/> <stop offset="100%" stop-color="darkseagreen"/> </radialgradient> </defs> <circle cx="100" cy="100" r="100" fill="url(#gradient1)" /> <circle cx="100" cy="100" r="1...
... animatable none example <svg viewbox="0 0 120 120" width="200" height="200" xmlns="http://www.w3.org/2000/svg"> <defs> <radialgradient id="gradient" cx="0.5" cy="0.5" r="0.5" fx="0.35" fy="0.35" fr="5%"> <stop offset="0%" stop-color="red"/> <stop offset="100%" stop-color="blue"/> </radialgradient> </defs> <rect x="10" y="10" rx="15" ry="15" width="100" height="100" fill="url(#gradient)" stroke="black" stroke-width="2"/> <circle cx="60" cy="60" r="50" fill="transparent" stroke="white" stroke-width="2"/> <circle cx="35" cy="35" r="2" fill="white" stroke="white"/> <circle cx="60" cy="...
gradientTransform - SVG: Scalable Vector Graphics
two elements are using this attribute: <lineargradient> and <radialgradient> html, body, svg { height: 100%; } <svg viewbox="0 0 420 200" xmlns="http://www.w3.org/2000/svg"> <radialgradient id="gradient1" gradientunits="userspaceonuse" cx="100" cy="100" r="100" fx="100" fy="100"> <stop offset="0%" stop-color="darkblue" /> <stop offset="50%" stop-color="skyblue" /> <stop offset="100%" stop-color="darkblue" /> </radialgradient> <radialgradient id="gradient2" gradientunits="userspaceonuse" cx="100" cy="100" r="100" fx="100" fy="100" gradienttransform="skewx(20) translate(-35, 0)"> <stop offset="0%" stop-color="darkblue" /> <stop offset="50%" stop-color="sk...
...yblue" /> <stop offset="100%" stop-color="darkblue" /> </radialgradient> <rect x="0" y="0" width="200" height="200" fill="url(#gradient1)" /> <rect x="0" y="0" width="200" height="200" fill="url(#gradient2)" style="transform: translatex(220px);" /> </svg> usage notes default value identity transform value <transform-list> animatable yes <transform-list> a list of transformation functions specifying some additional transformation from the gradient coordinate system onto the target coordinate system.
height - SVG: Scalable Vector Graphics
WebSVGAttributeheight
twenty five elements are using this attribute: <feblend>, <fecolormatrix>, <fecomponenttransfer>, <fecomposite>, <feconvolvematrix>, <fediffuselighting>, <fedisplacementmap>, <fedropshadow>, <feflood>, <fegaussianblur>, <feimage>, <femerge>, <femorphology>, <feoffset>, <fespecularlighting>, <fetile>, <feturbulence>, <filter>, <foreignobject>, <image>, <mask>, <pattern>, <rect>, <svg>, and <use> html,body,svg { height:100% } <svg viewbox="0 0 300 100" xmlns="http://www.w3.org/2000/svg"> <!-- with a height of 0 or less, nothing will be rendered --> <rect y="0" x="0" width="90" height="0"/> <rect y="0" x="100" width="90" height="60"/> <rect y="0" x="200" width="90" height="100%"/> </svg> ...
... value <length> | <percentage> default value 100% animatable yes feoffset for <feoffset>, height defines the vertical length for the rendering area of the primitive.
requiredFeatures - SVG: Scalable Vector Graphics
http://www.w3.org/tr/svg11/feature#basictext the browser supports the <text> element http://www.w3.org/tr/svg11/feature#paintattribute the browser supports the color, fill, fill-rule, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-width, color-interpolation and color-rendering attributes http://www.w3.org/tr/svg11/feature#basicpaintattribute the browser supports the color, fill, fill-rule, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-width and color-rendering attributes http://www.w3.org/tr/svg11/...
...ip-path attribute http://www.w3.org/tr/svg11/feature#mask the browser supports the <mask> element http://www.w3.org/tr/svg11/feature#filter the browser supports the <filter>, <feblend>, <fecolormatrix>, <fecomponenttransfer>, <fecomposite>, <feconvolvematrix>, <fediffuselighting>, <fedisplacementmap>, <feflood>, <fegaussianblur>, <feimage>, <femerge>, <femergenode>, <femorphology>, <feoffset>, <fespecularlighting>, <fetile>, <fedistantlight>, <fepointlight>, <fespotlight>, <fefuncr>, <fefuncg>, <fefuncb> and <fefunca> elements http://www.w3.org/tr/svg11/feature#basicfilter the browser supports the <filter>, <feblend>, <fecolormatrix>, <fecomponenttransfer>, <fecomposite>, <feflood>, <fegaussianblur>, <feimage>, <femerge>, <femergenode>, <feoffset>, <fetile>, <fefuncr>, <fefuncg...
width - SVG: Scalable Vector Graphics
WebSVGAttributewidth
twenty five elements are using this attribute: <feblend>, <fecolormatrix>, <fecomponenttransfer>, <fecomposite>, <feconvolvematrix>, <fediffuselighting>, <fedisplacementmap>, <fedropshadow>, <feflood>, <fegaussianblur>, <feimage>, <femerge>, <femorphology>, <feoffset>, <fespecularlighting>, <fetile>, <feturbulence>, <filter>, <foreignobject>, <image>, <mask>, <pattern>, <rect>, <svg>, and <use> html,body,svg { height:100% } <svg viewbox="0 0 100 300" xmlns="http://www.w3.org/2000/svg"> <!-- with a width of 0 or less, nothing will be rendered --> <rect x="0" y="0" width="0" height="90"/> <rect x="0" y="100" width="60" height="90"/> <rect x="0" y="200" width="100%" height="90"/> </svg> ...
... value <length> | <percentage> default value 100% animatable yes feoffset for <feoffset>, width defines the horizontal length for the rendering area of the primitive.
x - SVG: Scalable Vector Graphics
WebSVGAttributex
thirty seven elements are using this attribute: <altglyph>, <feblend>, <fecolormatrix>, <fecomponenttransfer>, <fecomposite>, <feconvolvematrix>, <fediffuselighting>, <fedisplacementmap>, <fedropshadow>, <feflood>, <fefunca>, <fefuncb>, <fefuncg>, <fefuncr>, <fegaussianblur>, <feimage>, <femerge>, <femergenode>, <femorphology>, <feoffset>, <fepointlight>, <fespecularlighting>, <fespotlight>, <fetile>, <feturbulence>, <filter>, <foreignobject>, <glyphref>, <image>, <mask>, <pattern>, <rect>, <svg>, <text>, <tref>, <tspan>, and <use> html,body,svg { height:100% } <svg viewbox="0 0 300 100" xmlns="http://www.w3.org/2000/svg"> <rect x="20" y="20" width="60" height="60" /> <rect x="120" y="20" width="60" height="60" /> <re...
... value <length> | <percentage> default value 0% animatable yes feoffset for <feoffset>, x defines the minimum x coordinate for the rendering area of the primitive.
y - SVG: Scalable Vector Graphics
WebSVGAttributey
thirty seven elements are using this attribute: <altglyph>, <feblend>, <fecolormatrix>, <fecomponenttransfer>, <fecomposite>, <feconvolvematrix>, <fediffuselighting>, <fedisplacementmap>, <fedropshadow>, <feflood>, <fefunca>, <fefuncb>, <fefuncg>, <fefuncr>, <fegaussianblur>, <feimage>, <femerge>, <femergenode>, <femorphology>, <feoffset>, <fepointlight>, <fespecularlighting>, <fespotlight>, <fetile>, <feturbulence>, <filter>, <foreignobject>, <glyphref>, <image>, <mask>, <pattern>, <rect>, <svg>, <text>, <tref>, <tspan>, and <use> html,body,svg { height:100% } <svg viewbox="0 0 100 300" xmlns="http://www.w3.org/2000/svg"> <rect y="20" x="20" width="60" height="60" /> <rect y="120" x="20" width="60" height="60" /> <re...
... value <length> | <percentage> default value 0% animatable yes feoffset for <feoffset>, y defines the minimum y coordinate for the rendering area of the primitive.
y1 - SVG: Scalable Vector Graphics
WebSVGAttributey1
--> <lineargradient y1="0%" id="g0"> <stop offset="5%" stop-color="black" /> <stop offset="50%" stop-color="red" /> <stop offset="95%" stop-color="black" /> </lineargradient> <rect x="1" y="1" width="8" height="8" fill="url(#g0)" /> <!-- here the gradient vector start at the bottom left corner of the bounding box of the shape it is applied to.
... --> <lineargradient y1="100%" id="g1"> <stop offset="5%" stop-color="black" /> <stop offset="50%" stop-color="red" /> <stop offset="95%" stop-color="black" /> </lineargradient> <rect x="11" y="1" width="8" height="8" fill="url(#g1)" /> </svg> specifications specification status comment scalable vector graphics (svg) 2the definition of 'y1' in that specification.
y2 - SVG: Scalable Vector Graphics
WebSVGAttributey2
--> <lineargradient y2="0%" id="g0"> <stop offset="5%" stop-color="black" /> <stop offset="50%" stop-color="red" /> <stop offset="95%" stop-color="black" /> </lineargradient> <rect x="1" y="1" width="8" height="8" fill="url(#g0)" /> <!-- here the gradient vector end at the bottom right corner of the bounding box of the shape it is applied to.
... --> <lineargradient y2="100%" id="g1"> <stop offset="5%" stop-color="black" /> <stop offset="50%" stop-color="red" /> <stop offset="95%" stop-color="black" /> </lineargradient> <rect x="11" y="1" width="8" height="8" fill="url(#g1)" /> </svg> specifications specification status comment scalable vector graphics (svg) 2the definition of 'y2' in that specification.
<defs> - SVG: Scalable Vector Graphics
WebSVGElementdefs
html,body,svg { height:100% } <svg viewbox="0 0 10 10" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <!-- some graphical objects to use --> <defs> <circle id="mycircle" cx="0" cy="0" r="5" /> <lineargradient id="mygradient" gradienttransform="rotate(90)"> <stop offset="20%" stop-color="gold" /> <stop offset="90%" stop-color="red" /> </lineargradient> </defs> <!-- using my graphical objects --> <use x="5" y="5" xlink:href="#mycircle" fill="url('#mygradient')" /> </svg> attributes global attributes core attributes most notably: id lang styling attributes class, style event attributes global event attributes, document element event ...
...attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility usage notes categoriescontainer element, structural elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, ...
<feComponentTransfer> - SVG: Scalable Vector Graphics
example svg <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 600 300"> <defs> <lineargradient id="rainbow" gradientunits="userspaceonuse" x1="0" y1="0" x2="100%" y2="0"> <stop offset="0" stop-color="#ff0000"></stop> <stop offset="0.2" stop-color="#ffff00"></stop> <stop offset="0.4" stop-color="#00ff00"></stop> <stop offset="0.6" stop-color="#00ffff"></stop> <stop offset="0.8" stop-color="#0000ff"></stop> <stop offset="1" stop-color="#800080"></stop> </lineargradient> <filter id="identity" x="0" y="0" width="100%" height="100%"> <fec...
... <fefuncr type="linear" slope="0.5" intercept="0"></fefuncr> <fefuncg type="linear" slope="0.5" intercept="0.25"></fefuncg> <fefuncb type="linear" slope="0.5" intercept="0.5"></fefuncb> </fecomponenttransfer> </filter> <filter id="gamma" x="0" y="0" width="100%" height="100%"> <fecomponenttransfer> <fefuncr type="gamma" amplitude="4" exponent="7" offset="0"></fefuncr> <fefuncg type="gamma" amplitude="4" exponent="4" offset="0"></fefuncg> <fefuncb type="gamma" amplitude="4" exponent="1" offset="0"></fefuncb> </fecomponenttransfer> </filter> </defs> <g font-weight="bold"> <text x="0" y="20">default</text> <rect x="0" y="30" width="100%" height="20"></rect> <text x="0" y="70">identity</text> <rect x="0"...
<feDropShadow> - SVG: Scalable Vector Graphics
tddeviation="0" flood-color="pink" flood-opacity="0.5"/> </filter> </defs> <circle cx="5" cy="50%" r="4" style="fill:pink; filter:url(#shadow);"/> <circle cx="15" cy="50%" r="4" style="fill:pink; filter:url(#shadow2);"/> <circle cx="25" cy="50%" r="4" style="fill:pink; filter:url(#shadow3);"/> </svg> attributes dx this attribute defines the x offset of the drop shadow.
... value type: <number>; default value: 2; animatable: yes dy this attribute defines the y offset of the drop shadow.
<linearGradient> - SVG: Scalable Vector Graphics
html,body,svg { height:100% } <svg viewbox="0 0 10 10" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <lineargradient id="mygradient" gradienttransform="rotate(90)"> <stop offset="5%" stop-color="gold" /> <stop offset="95%" stop-color="red" /> </lineargradient> </defs> <!-- using my linear gradient --> <circle cx="5" cy="5" r="4" fill="url('#mygradient')" /> </svg> attributes gradientunits this attribute defines the coordinate system for attributes x1, x2, y1, y2 value type: userspaceonuse|objectboundingbox ; default value: objectboundingbox; an...
...es core attributes most notably: id styling attributes class, style event attributes global event attributes, document element event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility xlink attributes xlink:href, xlink:title usage notes categoriesgradient elementpermitted contentany number of the following elements, in any order:descriptive elements<animate>, <animatetransform>, <set>, <stop> specifications specification status comment ...
<radialGradient> - SVG: Scalable Vector Graphics
html,body,svg { height:100% } <svg viewbox="0 0 10 10" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <radialgradient id="mygradient"> <stop offset="10%" stop-color="gold" /> <stop offset="95%" stop-color="red" /> </radialgradient> </defs> <!-- using my linear gradient --> <circle cx="5" cy="5" r="4" fill="url('#mygradient')" /> </svg> attributes cx this attribute defines the x coordinate of the end circle of the radial gradient.
...es core attributes most notably: id styling attributes class, style event attributes global event attributes, document element event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility xlink attributes xlink:href, xlink:title usage notes categoriesgradient elementpermitted contentany number of the following elements, in any order:descriptive elements<animate>, <animatetransform>, <set>, <stop> specifications specification status comment ...
<textPath> - SVG: Scalable Vector Graphics
WebSVGElementtextPath
value type: auto|exact ; default value: exact; animatable: yes startoffset how far the beginning of the text should be offset from the beginning of the path.
...ditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expanded, aria-flowt...
SVG element reference - SVG: Scalable Vector Graphics
WebSVGElement
sform> c <circle> <clippath> <color-profile> d <defs> <desc> <discard> e <ellipse> f <feblend> <fecolormatrix> <fecomponenttransfer> <fecomposite> <feconvolvematrix> <fediffuselighting> <fedisplacementmap> <fedistantlight> <fedropshadow> <feflood> <fefunca> <fefuncb> <fefuncg> <fefuncr> <fegaussianblur> <feimage> <femerge> <femergenode> <femorphology> <feoffset> <fepointlight> <fespecularlighting> <fespotlight> <fetile> <feturbulence> <filter> <foreignobject> g <g> h <hatch> <hatchpath> i <image> l <line> <lineargradient> m <marker> <mask> <mesh> <meshgradient> <meshpatch> <meshrow> <metadata> <mpath> p <path> <pattern> <polygon> <polyline> r <radialgradient> <rect> s <script> <set> <solidcol...
..., <pattern>, <svg>, <switch>, <symbol>, <unknown> descriptive elements <desc>, <metadata>, <title> filter primitive elements <feblend>, <fecolormatrix>, <fecomponenttransfer>, <fecomposite>, <feconvolvematrix>, <fediffuselighting>, <fedisplacementmap>, <fedropshadow>, <feflood>,<fefunca>, <fefuncb>, <fefuncg>, <fefuncr>,<fegaussianblur>, <feimage>, <femerge>, <femergenode>, <femorphology>, <feoffset>, <fespecularlighting>, <fetile>, <feturbulence> font elements <font>, <font-face>, <font-face-format>, <font-face-name>, <font-face-src>, <font-face-uri>, <hkern>, <vkern> gradient elements <lineargradient>, <meshgradient>, <radialgradient>, <stop> graphics elements <circle>, <ellipse>, <image>, <line>, <mesh>, <path>, <polygon>, <polyline>, <rect>, <text>, <use> graphics referencing elem...
SVG 2 support in Mozilla - SVG: Scalable Vector Graphics
implementation status unknown kerning property removed implementation status unknown path attribute for <textpath> implemented (bug 1446617) reference basic shapes to <textpath> implementation status unknown side attribute for <textpath> implemented (bug 1446650) render characters for one loop of a single closed path, effected by the startoffset attribute and text-anchor property implementation status unknown <tref> removed implementation status unknown <altglyph>, <altglyphdef>, <altglyphitem> and <glyphref> removed <altglyph>, <altglyphdef> and <altglyphitem> removed (bug 1260032), <glyphref> never really implemented (bug 1302693) svgtextcontentelement.selectsubstring() deprecated implementation s...
...tatus unknown getcomputedtextlength() not including dx and dy values implementation status unknown text in non-rendered elements not included in addressable characters implementation status unknown unknown elements in text render as unpositioned spans implementation status unknown offset distances of text positioned along a transformed path measured in text elements coordinate system implementation status unknown embedded content change notes <video> implementation status unknown <audio> implementation status unknown <iframe> implementation status unknown <canvas> implementation status unknown <source> implementation status unknown <track> implementation...
SVG and CSS - SVG: Scalable Vector Graphics
croll to get all of it: <svg width="600px" height="600px" viewbox="-300 -300 600 600" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <title>svg demonstration</title> <desc>mozilla css getting started - svg demonstration</desc> <defs> <radialgradient id="fade" cx="0" cy="0" r="200" gradientunits="userspaceonuse"> <stop id="fade-stop-1" offset="33%"/> <stop id="fade-stop-2" offset="95%"/> </radialgradient> </defs> <text id="heading" x="-280" y="-270">svg demonstration</text> <text id="caption" x="-280" y="-250">move your mouse pointer over the flower.</text> <g id="flower"> <circle id="overlay" cx="0" cy="0" r="200" stroke="none" fill="url(#fade)"/> <g id="outer-petals"> <g class="quadrant"> ...
... transform="rotate(72)"/> </g> <g id="petals"> <use xlink:href="#quadrant"/> <use xlink:href="#quadrant" transform="rotate(90)"/> <use xlink:href="#quadrant" transform="rotate(180)"/> <use xlink:href="#quadrant" transform="rotate(270)"/> </g> <radialgradient id="fade" cx="0" cy="0" r="200" gradientunits="userspaceonuse"> <stop id="fade-stop-1" offset="33%"/> <stop id="fade-stop-2" offset="95%"/> </radialgradient> </defs> <text id="heading" x="-280" y="-270">svg demonstration</text> <text id="caption" x="-280" y="-250">move your mouse pointer over the flower.</text> <g id="flower"> <circle id="overlay" cx="0" cy="0" r="200" stroke="none" fill="url(#fade)"/> <use id="outer-petals" xlink:href="#petals"/> <use id=...
Texts - SVG: Scalable Vector Graphics
WebSVGTutorialTexts
dx start drawing the text with a horizontal offset dx from the default current position.
... here, too, you may provide a list of values that are applied to consecutive characters, hence piling up the offset over time.
Canvas code snippets - Archive of obsolete content
suretext', // drawfocusring not currently supported // the following might instead be wrapped to be able to chain their child objects 'createimagedata', 'createlineargradient', 'createradialgradient', 'getimagedata', 'putimagedata' ]; var props = ['canvas', 'fillstyle', 'font', 'globalalpha', 'globalcompositeoperation', 'linecap', 'linejoin', 'linewidth', 'miterlimit', 'shadowoffsetx', 'shadowoffsety', 'shadowblur', 'shadowcolor', 'strokestyle', 'textalign', 'textbaseline']; for (let m of methods) { let method = m; canvas2dcontext.prototype[method] = function() { this.ctx[method].apply(this.ctx, arguments); return this; }; } for (let m of gettermethods) { let method = m; canvas2dcontext.prototype[method] = function() { return...
Forms related code snippets - Archive of obsolete content
ndchild(this.display); this.container.appendchild(ocapt); this.container.appendchild(othead); this.current.setdate(1); this.writedays(); otarget.onclick = function () { if (otable.parentnode) { otable.parentnode.removechild(otable); return; } otable.style.zindex = nzindex++; otable.style.position = "absolute"; otable.style.left = otarget.offsetleft + "px"; otable.style.top = (otarget.offsettop + otarget.offsetheight) + "px"; otarget.parentnode.insertbefore(otable, otarget); }; ainstances.push(this); } datepicker.prototype.writedays = function () { const nendblanks = (this.current.getday() + bzeroismonday * 6) % 7, nend = amonthlengths[this.current.getmonth()] + nendblanks, ntotal = nend...
Offering a context menu for form controls - Archive of obsolete content
window.addeventlistener("load", function() { let settargetoriginal = nscontextmenu.prototype.settarget; components.utils.reporterror(settargetoriginal); nscontextmenu.prototype.settarget = function(anode, arangeparent, arangeoffset) { settargetoriginal.apply(this, arguments); if (this.istargetaformcontrol(anode)) this.shoulddisplay = true; }; }, false); this code, which is run when the window is opened up, works by replacing the settarget() routine for the prototype of nscontextmenu with one that forces the context menu to display if the target of the menu is a form control.
CSS3 - Archive of obsolete content
support for the css outline-offset property giving more control on the position of the outline.
Notes on HTML Reflow - Archive of obsolete content
a frame is rectangular, with width, height, and an offset from the parent frame that contains it.
Locked config settings - Archive of obsolete content
the encoding is a simple "byte-shifting" with an offset of 13 (netscape 4 used a similar encoding, but with a of 7 instead).
Block and Line Layout Cheat Sheet - Archive of obsolete content
mcomputedwidth mcomputedheight mcomputedmargin mcomputedborderpadding mcomputedpadding mcomputedoffsets mcomputedminwidth mcomputedmaxwidth mcomputedminheight mcomputedmaxheight given the current container frame and the style applied to the child, these values are the resolved values for the child frame's box.
Nanojit - Archive of obsolete content
figuring out how to compile it is left as an exercise for the reader; the following works when run in the object directory of an --enable-debug spidermonkey shell: g++ -ddebug -g3 -wno-invalid-offsetof -fno-rtti -include js-confdefs.h -i dist/include/ -i..
Table Cellmap - Archive of obsolete content
#define span 0x00000001 // there a row or col span #define row_span 0x00000002 // there is a row span #define row_span_0 0x00000004 // the row span is 0 #define row_span_offset 0x0000fff8 // the row offset to the data containing the original cell #define col_span 0x00010000 // there is a col span #define col_span_0 0x00020000 // the col span is 0 #define overlap 0x00040000 // there is a row span and col span but no by same cell #define col_span_offset 0xfff80000 // the col offset to the data containing the original cell #define row_span_shift ...
Tamarin Acceptance Test Template - Archive of obsolete content
this is the test template for tamarin acceptance tests (placed in test/acceptance/feature_name): /* -*- mode: js; c-basic-offset: 4; indent-tabs-mode: nil; tab-width: 4 -*- */ /* vi: set ts=4 sw=4 expandtab: (add to ~/.vimrc: set modeline modelines=5) */ /* ***** begin license block ***** * version: mpl 1.1/gpl 2.0/lgpl 2.1 * * the contents of this file are subject to the mozilla public license version * 1.1 (the "license"); you may not use this file except in compliance with * the license.
Building accessible custom components in XUL - Archive of obsolete content
(technically, it draws the border inside the element instead of outside.) <code> grid.spreadsheet description:focus, grid.spreadsheet label:focus { outline: 1px dotted black; outline-offset: -2px; } </code> however, neither of those are our biggest problem.
Index - Archive of obsolete content
ArchiveMozillaXULIndex
535 movebyoffset xul methods, xul reference no summary!
openPopup - Archive of obsolete content
x, y for an anchored popup, the x and y arguments may be used to offset the popup from its anchored position by some number, measured in css pixels.
showPopup - Archive of obsolete content
to have a popup appear relative to another element yet still offset by some number of pixels, determine the actual screen position of the element using the boxobject.screenx and boxobject.screeny properties of the element, and use those as the x and y arguments offset by the desired values.
Methods - Archive of obsolete content
earchat getselecteditem getsession getsessionbyname getsessionresultat getsessionstatusat getsessionvalueat getstring goback gobackgroup godown goforward goforwardgroup gohome goto gotoindex goup hidepopup increase increasepage insertitem insertitemat invertselection loadgroup loadonetab loadtabs loaduri loaduriwithflags makeeditable movebyoffset moveto movetoalertposition onsearchcomplete ontextentered ontextreverted openpopup openpopupatscreen opensubdialog openwindow preferenceforelement reload reloadalltabs reloadtab reloadwithflags removeallitems removeallnotifications removealltabsbut removecurrentnotification removecurrenttab removeitemat removeitemfromselection removenotification remov...
Popup Menus - Archive of obsolete content
it currently offsets 21 pixels vertically from the anchor, see bug 619887).
panel - Archive of obsolete content
ArchiveMozillaXULpanel
x, y for an anchored popup, the x and y arguments may be used to offset the popup from its anchored position by some number, measured in css pixels.
nsIContentPolicy - Archive of obsolete content
query any dom properties that depend on layout (e.g., offset* properties).
Gecko Compatibility Handbook - Archive of obsolete content
later versions did support netscape 6; however, in netscape 6.1 and higher, support for internet explorer's proprietary offsetxxx properties results in hiermenu placing popups in the wrong position.
2006-10-27 - Archive of obsolete content
it was determined that the offsetwidth property can be used to get this value.
2006-11-03 - Archive of obsolete content
perf question (reflow branch) a look into bug #352367 and the mention of possibly reducing the number of times nsframe::intrinsicwidthoffsets is called for each cell within a table.
NPP_HandleEvent - Archive of obsolete content
instead, the windowed plug-in draws into the graphics port associated with the the browser window, at the offset that the browser specifies.
NPStream - Archive of obsolete content
end offset in bytes of the end of the stream (equivalent to the length of the stream in bytes).
CSS - Archive of obsolete content
ArchiveWebCSS
-ms-touch-selectthe -ms-touch-select css property is a microsoft extension that toggles the gripper visual elements that enable touch text selection.-ms-wrap-flowthe -ms-wrap-flow css property is a microsoft extension that specifies how exclusions impact inline content within block-level elements.-ms-wrap-marginthe -ms-wrap-margin css property is a microsoft extension that specifies a margin that offsets the inner wrap shape from other shapes.-ms-wrap-throughthe -ms-wrap-through css property is a microsoft extension that specifies how content should wrap around an exclusion element.:-moz-full-screen-ancestorthe :-moz-full-screen-ancestor css pseudo-class is a mozilla extension that represents all ancestors of the full-screen element, except containing frames in parent documents, which are the fu...
Collision detection - Game development
update your drawbricks() function as follows: function drawbricks() { for(var c=0; c<brickcolumncount; c++) { for(var r=0; r<brickrowcount; r++) { if(bricks[c][r].status == 1) { var brickx = (c*(brickwidth+brickpadding))+brickoffsetleft; var bricky = (r*(brickheight+brickpadding))+brickoffsettop; bricks[c][r].x = brickx; bricks[c][r].y = bricky; ctx.beginpath(); ctx.rect(brickx, bricky, brickwidth, brickheight); ctx.fillstyle = "#0095dd"; ctx.fill(); ctx.closepath(); } } } } ...
Mouse controls - Game development
add the following function to your code, below the previous line you added: function mousemovehandler(e) { var relativex = e.clientx - canvas.offsetleft; if(relativex > 0 && relativex < canvas.width) { paddlex = relativex - paddlewidth/2; } } in this function we first work out a relativex value, which is equal to the horizontal mouse position in the viewport (e.clientx) minus the distance between the left edge of the canvas and left edge of the viewport (canvas.offsetleft) — effectively this is equal to the distance between...
Player paddle and controls - Game development
it's very similar to positioning the paddle — we need to have it placed in the middle of the screen horizontally and at the bottom vertically with a little offset from the bottom.
Mobile accessibility - Learn web development
this occurs because we are using code such as the following: div.onmousedown = function() { initialboxx = div.offsetleft; initialboxy = div.offsettop; movepanel(); } document.onmouseup = stopmove; to enable other forms of control, you need to use different, yet equivalent events — for example, touch events work on touchscreen devices: div.ontouchstart = function(e) { initialboxx = div.offsetleft; initialboxy = div.offsettop; positionhandler(e); movepanel(); } panel.ontouchend = stopmove; we'v...
Backgrounds and borders - Learn web development
background-repeat: no-repeat; background-position: 20px 10%; } you can also mix keyword values with lengths or percentages, for example: .box { background-image: url(star.png); background-repeat: no-repeat; background-position: top 20px; } finally, you can also use a 4-value syntax in order to indicate a distance from certain edges of the box — the length unit, in this case, is an offset from the value that precedes it.
CSS values and units - Learn web development
it can take keywords such as top, left, bottom, right, and center to align items with specific bounds of a 2d box, along with lengths, which represent offsets from the top and left-hand edges of the box.
Positioning - Learn web development
you may recall from previous points in the course where we discussed web pages using horizontal (x-axis) and vertical (y-axis) coordinates to work out positioning for things like background images and drop shadow offsets.
Advanced text formatting - Learn web development
--> <time datetime="19:30:01.856">19:30:01.856</time> <!-- date and time --> <time datetime="2016-01-20t19:30">7.30pm, 20 january 2016</time> <!-- date and time with timezone offset --> <time datetime="2016-01-20t19:30+01:00">7.30pm, 20 january 2016 is 8.30pm in france</time> <!-- calling out a specific week number --> <time datetime="2016-w04">the fourth week of 2016</time> test your skills!
Server-side web frameworks - Learn web development
c++ or javascript, may well be offset by the costs of learning and maintenance.
Beginning our React todo list - Learn web development
implementing our styles paste the following css code into src/index.css so that it replaces what's currently there: /* resets */ *, *::before, *::after { box-sizing: border-box; } *:focus { outline: 3px dashed #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-smoothing: inherit; -webkit-appearance: none; } butto...
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-smoothing: inherit; -webkit-appearance: none; } butto...
Styling Vue components with CSS - Learn web development
thing: grayscale; font-weight: 400; font-size: 16px; font-size: 1rem; line-height: 1.25; box-sizing: border-box; width: 100%; height: 40px; height: 2.5rem; margin-top: 0; padding: 5px; border: 2px solid #0b0c0c; border-radius: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .custom-checkbox > input:focus { outline: 3px dashed #fd0; outline-offset: 0; box-shadow: inset 0 0 0 2px; } .custom-checkbox { font-family: arial, sans-serif; -webkit-font-smoothing: antialiased; font-weight: 400; font-size: 1.6rem; line-height: 1.25; display: block; position: relative; min-height: 40px; margin-bottom: 10px; padding-left: 40px; clear: left; } .custom-checkbox > input[type="checkbox"] { -webkit-font-smoothing: antialiased; c...
Accessible Toolkit Checklist
for autocomplete lists, use the system color offset by 1, so that it looks active but the list items don't get echoed while they user's trying to simply type and edit.
Creating Sandboxed HTTP Connections
treamlistener(callbackfunc); gchannel.notificationcallbacks = listener; gchannel.asyncopen(listener, null); function streamlistener(acallbackfunc) { this.mcallbackfunc = acallbackfunc; } streamlistener.prototype = { mdata: "", // nsistreamlistener onstartrequest: function (arequest, acontext) { this.mdata = ""; }, ondataavailable: function (arequest, acontext, astream, asourceoffset, alength) { var scriptableinputstream = components.classes["@mozilla.org/scriptableinputstream;1"] .createinstance(components.interfaces.nsiscriptableinputstream); scriptableinputstream.init(astream); this.mdata += scriptableinputstream.read(alength); }, onstoprequest: function (arequest, acontext, astatus) { if (components.issuccesscode(astatus)) { // re...
OS.File for the main thread
promise<void> setposition( in number offset, in object origin ) arguments offset the new position, as a number of bytes from the origin.
PopupNotifications.jsm
for most use cases, the value of this parameter should be date.now() plus an offset indicating the amount of time the notification should be kept open (for example, date.now() + 30000 for 30 seconds).
PR_dtoa
decpt a pointer to a memory location where the runtime will store the offset, relative to the beginning of the output string, of the conversion's decimal point.
NSPR API Reference
module initialization locks lock type lock functions condition variables condition variable type condition variable functions monitors monitor type monitor functions cached monitors cached monitor functions i/o types directory type file descriptor types file info types network address types types used with socket options functions type used with memory-mapped i/o offset interpretation for seek functions i/o functions functions that operate on pathnames functions that act on file descriptors directory i/o functions socket manipulation functions converting between host and network addresses memory-mapped i/o functions anonymous pipe function polling functions pollable events manipulating layers network addresses network address types and constan...
NSS 3.33 release notes
port_zallocalignedoffset - allocate aligned memory for structs.
nss tech note4
secitem phonenum; secitem rfc822name; secitem id; secitem maxusers; }; typedef struct _mycertextdata mycertextdata; /* template used for decoding the extension */ const sec_asn1template mycertexttemplate[] = { { sec_asn1_sequence, 0, null, sizeof( mycertextdata ) }, { sec_asn1_integer, offsetof(mycertextdata, version) }, { sec_asn1_octet_string, offsetof( mycertextdata, streetaddress ) }, { sec_asn1_octet_string, offsetof( mycertextdata, phonenum ) }, { sec_asn1_octet_string, offsetof( mycertextdata, rfc822name ) }, { sec_asn1_octet_string, offsetof( mycertextdata, id ) }, { sec_asn1_integer, offsetof(mycertextd...
nss tech note7
struct myrsapublickey { secitem m_modulus; secitem m_exponent; } inpubkey; secitem derpubkey; seckeypublickey *pubkey; const sec_asn1template myrsapublickeytemplate[] = { { sec_asn1_sequence, 0, null, sizeof(myrsapublickey) }, { sec_asn1_integer, offsetof(myrsapublickey,m_modulus), }, { sec_asn1_integer, offsetof(myrsapublickey,m_exponent), }, { 0, } }; prarenapool *arena; /* * point inpubkey.m_modulus and m_exponent at the data, and * then set their types to unsigned integers.
Hacking Tips
│ auto funcptr = js_data_to_func_ptr(exportfuncptr, codebase() + func.entryoffset()); │ if (!call_generated_2(funcptr, exportargs.begin(), &tlsdata_)) │ return false; after it's set, x/64i funcptr will show you the trampoline code.
Property cache
to be more precise regarding property specs, y's properties have the same names, getters, setters, property attributes, and slot offsets, and they are in the same order, as x's properties at t0.
SpiderMonkey Internals
to make matters worse, java (and therefore javascript) uses "local" time numbers (offsets from the epoch) in its date class.
JIT Optimization Outcomes
inconsistentfieldoffset the offset of an unboxed field is not consistent across all the different types of objects it could be accessed from.
Redis Tips
zrange gives you everything in the zset, in order of score, from the beginning offset to the end offset.
Handling Mozilla Security Bugs
however, this is offset by the fact that the person reporting a bug has visibility into the activities (if any) being taken to address the bug, and has the power to open the bug report for public scrutiny.
Using XPCOM Utilities to Make Things Easier
in c++, the string literal "xpcom", for example, consists of 6 consecutive bytes, where `x' is at byte offset zero and a null character is at byte offset 5.
XPCOM Stream Guide
MozillaTechXPCOMGuideStreams
from the nsistreamlistener interface, the .ondataavailable(request, context, inputstream, offset, count) method gives you the input stream and the number of bytes available.
nsACString
index_type [pruint32] type used to represent an offset into the string.
nsAString
index_type [pruint32] type used to represent an offset into the string.
imgIEncoder
xoffset=# -- default: "0" yoffset=# -- default: "0" where to draw the frame, relative to the canvas.
nsIAccessibleCaretMoveEvent
1.0 66 introduced gecko 1.9 inherits from: nsisupports last changed in gecko 1.9 (firefox 3) attributes attribute type description caretoffset long return caret offset.
nsIAccessibleHyperText
getlinkindex() the link index at the given offset (character index).
nsIAccessibleTextChangeEvent
start long returns offset of changed text in accessible.
nsIDOMOfflineResourceList
mozitem returns the uri of the item at the specific offset into the list of cached resources.
nsIDOMWindow
scrollto() scrolls the window to an absolute pixel offset.
nsIEditor
void cloneattribute(in astring aattribute, in nsidomnode asourcenode); void cloneattributes(in nsidomnode destnode, in nsidomnode sourcenode); nsidomnode createnode(in astring tag, in nsidomnode parent, in long position); void insertnode(in nsidomnode node, in nsidomnode parent, in long aposition); void splitnode(in nsidomnode existingrightnode, in long offset, out nsidomnode newleftnode); void joinnodes(in nsidomnode leftnode, in nsidomnode rightnode, in nsidomnode parent); void deletenode(in nsidomnode child); void marknodedirty(in nsidomnode node); direction controller void switchtextdirection(); output methods astring outputtostring(in astring formattype, in unsigned long flags); ...
nsIInputStream
static ns_method appendsegment(nsiinputstream* astream, void* aclosure, const char* afromsegment, uint32_t atooffset, uint32_t acount, uint32_t* awritecount) { // afromsegment now contains acount bytes of data.
nsIScriptableInputStream
var scriptableinputstream = cc("@mozilla.org/scriptableinputstream;1", "nsiscriptableinputstream", "init"); var blah = { data: '', onstartrequest: function (arequest, acontext) { this.data = ''; }, ondataavailable: function(request, context, inputstream, offset, count) { var scriptstream = new scriptableinputstream(inputstream); this.data += scriptstream.read(count); scriptstream.close(); } }; see also nsscriptableinputstream nsiinputstream ...
NS_CStringSetDataRange
ring& str, const nsacstring& matchval, const nsacstring& newval) { const char* sp, *mp, *np; pruint32 sl, ml, nl; sl = ns_cstringgetdata(str, &sp); ml = ns_cstringgetdata(matchval, &mp); nl = ns_cstringgetdata(newval, &np); for (const char* iter = sp; iter <= sp + sl - ml; ++iter) { if (memcmp(iter, mp, ml) == 0) { pruint32 offset = iter - sp; ns_cstringsetdatarange(str, offset, ml, np, nl); sl = ns_cstringgetdata(str, &sp); iter = sp + offset + nl - 1; } } } history this function was frozen for mozilla 1.7.
NS_StringSetDataRange
const nsastring& matchval, const nsastring& newval) { const prunichar* sp, *mp, *np; pruint32 sl, ml, nl; sl = ns_stringgetdata(str, &sp); ml = ns_stringgetdata(matchval, &mp); nl = ns_stringgetdata(newval, &np); for (const prunichar* iter = sp; iter <= sp + sl - ml; ++iter) { if (memcmp(iter, mp, ml) == 0) { pruint32 offset = iter - sp; ns_stringsetdatarange(str, offset, ml, np, nl); sl = ns_stringgetdata(str, &sp); iter = sp + offset + nl - 1; } } } history this function was frozen for mozilla 1.7.
Add to iPhoto
cfrange cfrange is a structure that identifies a range; that is, it identifies an offset to an item in a list and a number of items.
Using Objective-C from js-ctypes
*/ // apple docs :: working with blocks - https://developer.apple.com/library/ios/documentation/cocoa/conceptual/programmingwithobjectivec/workingwithblocks/workingwithblocks.html var _nsconcreteglobalblock = ctypes.open(ctypes.libraryname('objc')).declare('_nsconcreteglobalblock', ctypes.voidptr_t); // //github.com/realityripple/uxp/blob/master/js/src/ctypes/library.cpp?offset=0#271 /** * the "block descriptor" is a static singleton struct.
ArrayType
cdata addressofelement( idx ); parameters idx a numeric value indicating the offset into the array of the element just to return a pointer.
CData
arcode); var char16_val = fromcharcode.join(''); console.info('char16_val:', char16_val); return char16_val; } if (!jschar) { try { var char8_val = stringptr.readstring(); console.info('stringptr.readstring():', char8_val); return char8_val; } catch (ex if ex.message.indexof('malformed utf-8 character sequence at offset ') == 0) { console.warn('ex of offset utf8 read error when trying to do readstring so using alternative method, ex:', ex); return readjscharstring(); } } else { return readjscharstring(); } } ...
Library
the syntax for this is seen in firefox codebase here: //github.com/realityripple/uxp/blob/master/js/src/ctypes/library.cpp?offset=0#271 this shows that we can also supply only two arguments to the declare function.
Debugger-API - Firefox Developer Tools
given a debugger.script, one can set breakpoints, translate between source positions and bytecode offsets (a deviation from the “source level” design principle), and find other static characteristics of the code.
Animation inspector example: Web Animations API - Firefox Developer Tools
le; line-height: normal; } #icon { width: 50px; height: 50px; filter: grayscale(100%); } #note { margin-left: 1em; font: 1.5em "open sans",arial,sans-serif; overflow: hidden; white-space: nowrap; display: inline-block; opacity: 0; width: 0; } javascript content var iconkeyframeset = [ { transform: 'scale(1)', filter: 'grayscale(100%)'}, { filter: 'grayscale(100%)', offset: 0.333}, { transform: 'scale(1.5)', offset: 0.666 }, { transform: 'scale(1.5)', filter: 'grayscale(0%)'} ]; var notekeyframeset = [ { opacity: '0', width: '0'}, { opacity: '1', width: '300px'} ]; var iconkeyframeoptions = { duration: 750, fill: 'forwards', easing: 'ease-in', enddelay: 100 } var notekeyframeoptions = { duration: 500, fill: 'forwards', easing: 'ease-out', ...
Work with animations - Firefox Developer Tools
if you hover over a dot, you'll see the value assigned to that property at that point in the timeline: this is essentially a visual representation of the animation's keyframes: var iconkeyframeset = [ { transform: 'scale(1)', filter: 'grayscale(100%)' }, { filter: 'grayscale(100%)', offset: 0.333 }, { transform: 'scale(1.5)', offset: 0.666 }, { transform: 'scale(1.5)', filter: 'grayscale(0%)' } ]; application to the example applying all this to our example, we can see that: the animation involved two elements, span#note and img#icon.
AudioBuffer.copyFromChannel() - Web APIs
startinchannel optional an optional offset into the source channel's buffer from which to begin copying samples.
AudioBuffer.copyToChannel() - Web APIs
startinchannel optional an optional offset to copy the data to.
AudioBufferSourceNode.loopStart - Web APIs
syntax audiobuffersourcenode.loopstart = startoffsetinseconds; startoffsetinseconds = audiobuffersourcenode.loopstart; value a floating-point number indicating the offset, in seconds, into the audio buffer at which each loop should begin during playback.
BaseAudioContext.createPeriodicWave() - Web APIs
the first value is the dc offset, which is the value at which the oscillator starts.
CanvasRenderingContext2D.drawFocusIfNeeded() - Web APIs
ton2'); document.addeventlistener('focus', redraw, true); document.addeventlistener('blur', redraw, true); canvas.addeventlistener('click', handleclick, false); redraw(); function redraw() { ctx.clearrect(0, 0, canvas.width, canvas.height); drawbutton(button1, 20, 20); drawbutton(button2, 20, 80); } function handleclick(e) { // calculate click coordinates const x = e.clientx - canvas.offsetleft; const y = e.clienty - canvas.offsettop; // focus button1, if appropriate drawbutton(button1, 20, 20); if (ctx.ispointinpath(x, y)) { button1.focus(); } // focus button2, if appropriate drawbutton(button2, 20, 80); if (ctx.ispointinpath(x, y)) { button2.focus(); } } function drawbutton(el, x, y) { const active = document.activeelement === el; const width = 150...
CanvasRenderingContext2D.isPointInPath() - Web APIs
canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // create circle const circle = new path2d(); circle.arc(150, 75, 50, 0, 2 * math.pi); ctx.fillstyle = 'red'; ctx.fill(circle); // listen for mouse moves canvas.addeventlistener('mousemove', function(event) { // check whether point is inside circle if (ctx.ispointinpath(circle, event.offsetx, event.offsety)) { ctx.fillstyle = 'green'; } else { ctx.fillstyle = 'red'; } // draw circle ctx.clearrect(0, 0, canvas.width, canvas.height); ctx.fill(circle); }); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.ispointinpath' in that specification.
CanvasRenderingContext2D.isPointInStroke() - Web APIs
canvas.getcontext('2d'); // create ellipse const ellipse = new path2d(); ellipse.ellipse(150, 75, 40, 60, math.pi * .25, 0, 2 * math.pi); ctx.linewidth = 25; ctx.strokestyle = 'red'; ctx.fill(ellipse); ctx.stroke(ellipse); // listen for mouse moves canvas.addeventlistener('mousemove', function(event) { // check whether point is inside ellipse's stroke if (ctx.ispointinstroke(ellipse, event.offsetx, event.offsety)) { ctx.strokestyle = 'green'; } else { ctx.strokestyle = 'red'; } // draw ellipse ctx.clearrect(0, 0, canvas.width, canvas.height); ctx.fill(ellipse); ctx.stroke(ellipse); }); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.ispointinstroke' in that specification...
CanvasRenderingContext2D.save() - Web APIs
the current values of the following attributes: strokestyle, fillstyle, globalalpha, linewidth, linecap, linejoin, miterlimit, linedashoffset, shadowoffsetx, shadowoffsety, shadowblur, shadowcolor, globalcompositeoperation, font, textalign, textbaseline, direction, imagesmoothingenabled.
CanvasRenderingContext2D.shadowBlur - Web APIs
one of the shadowblur, shadowoffsetx, or shadowoffsety properties must be non-zero, as well.
Basic animations - Web APIs
img.src = 'https://mdn.mozillademos.org/files/4553/capitan_meadows,_yosemite_national_park.jpg'; var canvasxsize = 800; var canvasysize = 200; var speed = 30; // lower is faster var scale = 1.05; var y = -4.5; // vertical offset // main program var dx = 0.75; var imgw; var imgh; var x = 0; var clearx; var cleary; var ctx; img.onload = function() { imgw = img.width * scale; imgh = img.height * scale; if (imgw > canvasxsize) { // image larger than canvas x = canvasxsize - imgw; } if (imgw > canvasxsize) { // image width larger than canvas clearx = imgw; } else { ...
Compositing example - Web APIs
le = "rgba(0,255,0,1)"; ctx.arc(160, 100, 100, math.pi*2, 0, false); ctx.fill(); ctx.restore(); ctx.beginpath(); ctx.fillstyle = "#f00"; ctx.fillrect(0,0,30,30) ctx.fill(); }; var colorsphere = function(element) { var ctx = canvas1.getcontext("2d"); var width = 360; var halfwidth = width / 2; var rotate = (1 / 360) * math.pi * 2; // per degree var offset = 0; // scrollbar offset var oleft = -20; var otop = -20; for (var n = 0; n <= 359; n ++) { var gradient = ctx.createlineargradient(oleft + halfwidth, otop, oleft + halfwidth, otop + halfwidth); var color = color.hsv_rgb({ h: (n + 300) % 360, s: 100, v: 100 }); gradient.addcolorstop(0, "rgba(0,0,0,0)"); gradient.addcolorstop(0.7, "rgba("+color.r+","+col...
Transformations - Web APIs
the current values of the following attributes: strokestyle, fillstyle, globalalpha, linewidth, linecap, linejoin, miterlimit, linedashoffset, shadowoffsetx, shadowoffsety, shadowblur, shadowcolor, globalcompositeoperation, font, textalign, textbaseline, direction, imagesmoothingenabled.
DOMMatrix - Web APIs
WebAPIDOMMatrix
the identity matrix is one in which every value is 0 except those on the main diagonal from top-left to bottom-right corner (in other words, where the offsets in each direction are equal).
DOMMatrixReadOnly - Web APIs
the identity matrix is one in which every value is 0 except those on the main diagonal from top-left to bottom-right corner (in other words, where the offsets in each direction are equal).
DOMPoint.DOMPoint() - Web APIs
WebAPIDOMPointDOMPoint
examples this example creates a dompoint representing the top-left corner of the current window, then creates a second point based on the first, which is then offset by 100 pixels both vertically and horizontally.
Document.createRange() - Web APIs
example let range = document.createrange(); range.setstart(startnode, startoffset); range.setend(endnode, endoffset); notes once a range is created, you need to set its boundary points before you can make use of most of its methods.
Document.timeline - Web APIs
WebAPIDocumenttimeline
the time values for this timeline are calculated as a fixed offset from the global clock such that the zero time corresponds to the navigationstart moment plus a signed delta known as the origin time.
Document - Web APIs
WebAPIDocument
documentorshadowroot.caretpositionfrompoint() returns a caretposition object containing the dom node containing the caret, and caret's character offset within that node.
DocumentOrShadowRoot - Web APIs
methods documentorshadowroot.caretpositionfrompoint() returns a caretposition object containing the dom node containing the caret, and caret's character offset within that node.
Document Object Model (DOM) - Web APIs
vgfecomponenttransferelement svgfecompositeelement svgfeconvolvematrixelement svgfediffuselightingelement svgfedisplacementmapelement svgfedistantlightelement svgfedropshadowelement svgfefloodelement svgfefuncaelement svgfefuncbelement svgfefuncgelement svgfefuncrelement svgfegaussianblurelement svgfeimageelement svgfemergeelement svgfemergenodeelement svgfemorphologyelement svgfeoffsetelement svgfepointlightelement svgfespecularlightingelement svgfespotlightelement svgfetileelement svgfeturbulenceelement svgfilterelement svgfilterprimitivestandardattributes svgfontelement svgfontfaceelement svgfontfaceformatelement svgfontfacenameelement svgfontfacesrcelement svgfontfaceurielement svgforeignobjectelement svggelement svggeometryelement svgglyphelemen...
EffectTiming.fill - Web APIs
WebAPIEffectTimingfill
elem.style.transform = 'translatey(100px)'; elem.animate({ transform: 'none', offset: 0 }, 200); for some complex effects where animations layer on top of one another, it may be necessary to use a fill mode temporarily to capture the final value of an animation before canceling it.
Element.getBoundingClientRect() - Web APIs
cross-browser fallback scripts requiring high cross-browser compatibility can use window.pagexoffset and window.pageyoffset instead of window.scrollx and window.scrolly.
Element.getClientRects() - Web APIs
fractional pixel offsets are possible.
Element.msZoomTo() - Web APIs
WebAPIElementmsZoomTo
example /* zooming in on an element while still keeping it centered in the viewport */ var args = { contentx: target.offsetleft + target.offsetwidth/2; contenty: target.offsettop + target.offsetheight/2; scalefactor: 2.0; } zoomer.mszoomto(args); see also microsoft api extensions ...
Element.scrollLeftMax - Web APIs
the element.scrollleftmax read-only property returns a number representing the maximum left scroll offset possible for the element.
Element.scrollTopMax - Web APIs
the element.scrolltopmax read-only property returns a number representing the maximum top scroll offset possible for the element.
Element.scrollWidth - Web APIs
check for overflow </button> </body> <script> var buttonone = document.getelementbyid('abutton'), buttontwo = document.getelementbyid('anotherbutton'), divone = document.getelementbyid('adiv'), divtwo = document.getelementbyid('anotherdiv'); //check to determine if an overflow is happening function isoverflowing(element) { return (element.scrollwidth > element.offsetwidth); } function alertoverflow(element) { if (isoverflowing(element)) { alert('contents are overflowing the container.'); } else { alert('no overflows!'); } } buttonone.addeventlistener('click', function() { alertoverflow(divone); }); buttontwo.addeventlistener('click', function() { alertoverflow(divtwo); ...
HTMLCanvasElement.toDataURL() - Web APIs
isplay = 'none'; } function removecolors() { var aimages = document.getelementsbyclassname('grayscale'), nimgslen = aimages.length, ocanvas = document.createelement('canvas'), octx = ocanvas.getcontext('2d'); for (var nwidth, nheight, oimgdata, ograyimg, npixel, apix, npixlen, nimgid = 0; nimgid < nimgslen; nimgid++) { ocolorimg = aimages[nimgid]; nwidth = ocolorimg.offsetwidth; nheight = ocolorimg.offsetheight; ocanvas.width = nwidth; ocanvas.height = nheight; octx.drawimage(ocolorimg, 0, 0); oimgdata = octx.getimagedata(0, 0, nwidth, nheight); apix = oimgdata.data; npixlen = apix.length; for (npixel = 0; npixel < npixlen; npixel += 4) { apix[npixel + 2] = apix[npixel + 1] = apix[npixel] = (apix[npixel] + apix[npixel + 1] + ap...
HTMLCollection.item - Web APIs
the htmlcollection method item() returns the node located at the specified offset into the collection.
HTMLImageElement.isMap - Web APIs
usage notes when an image marked as being part of a server-side image map is clicked, the browser constructs the string "?x,y", where x and y indicate the coordinates at which the mouse was clicked as offsets from the top-left corner of the image, specified in css pixels.
HTMLImageElement.x - Web APIs
the third cell is taken from that row (once again, specifying 2 as the zero-based offset).
HTMLImageElement.y - Web APIs
the third cell is taken from that row (once again, specifying 2 as the zero-based offset).
HTMLInputElement - Web APIs
when there's no selection, this returns the offset of the character immediately following the current text input cursor position.
HTMLTableColElement - Web APIs
htmltablecolelement.choff is a domstring representing the offset for the alignment character.
HTMLTimeElement.dateTime - Web APIs
mmm 23:59 12:15:47 12:15:52.998 valid local date and time string yyyy-mm-dd hh:mm yyyy-mm-dd hh:mm:ss yyyy-mm-dd hh:mm:ss.mmm yyyy-mm-ddthh:mm yyyy-mm-ddthh:mm:ss yyyy-mm-ddthh:mm:ss.mmm 2013-12-25 11:12 1972-07-25 13:43:07 1941-03-15 07:06:23.678 2013-12-25t11:12 1972-07-25t13:43:07 1941-03-15t07:06:23.678 valid time-zone offset string z +hhmm +hh:mm -hhmm -hh:mm z +0200 +04:30 -0300 -08:00 valid global date and time string any combination of a valid local date and time string followed by a valid time-zone offset string 2013-12-25 11:12+0200 1972-07-25 13:43:07+04:30 1941-03-15 07:06:23.678z 2013-12-25t11:12-08:00 valid week string yyyy-www 2...
IntersectionObserver.IntersectionObserver() - Web APIs
rootmargin a string which specifies a set of offsets to add to the root's bounding_box when calculating intersections, effectively shrinking or growing the root for calculation purposes.
IntersectionObserver.root - Web APIs
the intersection of this bounding rectangle, offset by any margins specified in the options passed to the intersectionobserver() constructor, the target element's bounds, minus the bounds of every element or other object which overlaps the target element, is considered to be the visible area of the target element.
KeyboardEvent.code - Web APIs
function updateposition(offset) { let rad = angle * (math.pi/180); position.x += (math.sin(rad) * offset); position.y -= (math.cos(rad) * offset); if (position.x < 0) { position.x = 399; } else if (position.x > 399) { position.x = 0; } if (position.y < 0) { position.y = 399; } else if (position.y > 399) { position.y = 0; } } the refresh() function handles applying the rotation and position...
KeyframeEffect - Web APIs
keyframeeffect.getkeyframes() returns the computed keyframes that make up this effect along with their computed keyframe offsets.
LockedFile - Web APIs
lockedfile.write() allows to write some data in the file starting at the location offset.
MediaSessionActionDetails.seekTime - Web APIs
to change the time by an offset rather than moving to an absolute time, the seekforward or seekbackward actions should be used instead.
MouseEvent.screenX - Web APIs
the screenx read-only property of the mouseevent interface provides the horizontal coordinate (offset) of the mouse pointer in global (screen) coordinates.
MouseEvent.screenY - Web APIs
the screeny read-only property of the mouseevent interface provides the vertical coordinate (offset) of the mouse pointer in global (screen) coordinates.
OscillatorNode.OscillatorNode() - Web APIs
detune a detuning value (in cents) which will offset the frequency by the given amount.
OscillatorNode.setPeriodicWave() - Web APIs
the first value is the dc offset, which is the value at which the oscillator starts.
PeriodicWave - Web APIs
the first value is the dc offset, which is the value at which the oscillator starts.
Range.collapsed - Web APIs
WebAPIRangecollapsed
syntax iscollapsed = range.collapsed; example let range = document.createrange(); range.setstart(startnode, startoffset); range.setend(endnode, endoffset); iscollapsed = range.collapsed; specifications specification status comment domthe definition of 'range.collapsed' in that specification.
Range.endContainer - Web APIs
syntax endrangenode = range.endcontainer; example var range = document.createrange(); range.setstart(startnode,startoffset); range.setend(endnode,endoffset); endrangenode = range.endcontainer; specifications specification status comment domthe definition of 'range.endcontainer' in that specification.
Range.selectNodeContents() - Web APIs
the startoffset is 0, and the endoffset is the number of child nodes or number of characters contained in the reference node.
Range.startContainer - Web APIs
syntax startrangenode = range.startcontainer; example range = document.createrange(); range.setstart(startnode,startoffset); range.setend(endnode,endoffset); startrangenode = range.startcontainer; specifications specification status comment domthe definition of 'range.endcontainer' in that specification.
SVGComponentTransferFunctionElement - Web APIs
svgcomponenttransferfunctionelement.offset read only an svganimatednumber corresponding to the offset attribute of the given element.
SVGStopElement - Web APIs
svgstopelement.offset read only an svganimatednumber corresponding to the offset of the given element.
SVGTextPathElement - Web APIs
svgtextpathelement.startoffset read only an svganimatedlength corresponding to the x component of the startoffset attribute of the given element.
ShadowRoot - Web APIs
documentorshadowroot.caretpositionfrompoint() returns a caretposition object containing the dom node containing the caret, and caret's character offset within that node.
SourceBuffer - Web APIs
sourcebuffer.timestampoffset controls the offset applied to timestamps inside media segments that are subsequently appended to the sourcebuffer.
Text - Web APIs
WebAPIText
text.splittext breaks the node into two nodes at a specified offset.
TimeRanges.end() - Web APIs
WebAPITimeRangesend
returns the time offset at which a specified time range ends.
TimeRanges.start() - Web APIs
WebAPITimeRangesstart
returns the time offset at which a specified time range begins.
TimeRanges - Web APIs
a timeranges object includes one or more ranges of time, each specified by a starting and ending time offset.
TransformStream - Web APIs
async transform(chunk, controller) { chunk = await chunk switch (typeof chunk) { case 'object': // just say the stream is done i guess if (chunk === null) controller.terminate() else if (arraybuffer.isview(chunk)) controller.enqueue(new uint8array(chunk.buffer, chunk.byteoffset, chunk.bytelength)) else if (array.isarray(chunk) && chunk.every(value => typeof value === 'number')) controller.enqueue(new uint8array(chunk)) else if ('function' === typeof chunk.valueof && chunk.valueof() !== chunk) this.transform(chunk.valueof(), controller) // hack else if ('tojson' in chunk) this.transform(json.stringify(chunk), controller) ...
UIEvent.pageX - Web APIs
WebAPIUIEventpageX
this value is relative to the left edge of the entire document, regardless of the current horizontal scrolling offset of the document.
WEBGL_compressed_texture_pvrtc - Web APIs
constants the compressed texture formats are exposed by four constants and can be used in two functions: compressedteximage2d() (where the height and width parameters must be powers of 2) and compressedtexsubimage2d() (where the the height and width parameters must equal the current values of the existing texture and the xoffset and yoffset parameters must be 0).
WebGL2RenderingContext.clearBuffer[fiuv]() - Web APIs
syntax void gl.clearbufferfv(buffer, drawbuffer, values, optional srcoffset); void gl.clearbufferiv(buffer, drawbuffer, values, optional srcoffset); void gl.clearbufferuiv(buffer, drawbuffer, values, optional srcoffset); void gl.clearbufferfi(buffer, drawbuffer, depth, stencil); parameters buffer a glenum specifying the buffer to clear.
Hello vertex attributes - Web APIs
" + "error log: " + linkerrlog; return; } initializeattributes(); gl.useprogram(program); gl.drawarrays(gl.points, 0, 1); document.queryselector("canvas").addeventlistener("click", function (evt) { var clickxrelativtocanvas = evt.pagex - evt.target.offsetleft; var clickxinwebglcoords = 2.0 * (clickxrelativtocanvas- gl.drawingbufferwidth/2) / gl.drawingbufferwidth; gl.bufferdata(gl.array_buffer, new float32array([clickxinwebglcoords]), gl.static_draw); gl.drawarrays(gl.points, 0, 1); }, false); } var buffer; function initializeattributes() { gl.enablevertexattribarray(0); buffer = gl.createbuff...
Raining rectangles - Web APIs
var position = [ evt.pagex - evt.target.offsetleft, gl.drawingbufferheight - (evt.pagey - evt.target.offsettop), ]; // if the click falls inside the rectangle, we caught it.
Lighting in WebGL - Web APIs
{ const numcomponents = 3; const type = gl.float; const normalize = false; const stride = 0; const offset = 0; gl.bindbuffer(gl.array_buffer, buffers.normal); gl.vertexattribpointer( programinfo.attriblocations.vertexnormal, numcomponents, type, normalize, stride, offset); gl.enablevertexattribarray( programinfo.attriblocations.vertexnormal); } finally, we need to update the code that builds the uniform matrices to generate and d...
Using shaders to apply color in WebGL - Web APIs
{ const numcomponents = 4; const type = gl.float; const normalize = false; const stride = 0; const offset = 0; gl.bindbuffer(gl.array_buffer, buffers.color); gl.vertexattribpointer( programinfo.attriblocations.vertexcolor, numcomponents, type, normalize, stride, offset); gl.enablevertexattribarray( programinfo.attriblocations.vertexcolor); } view the complete code | open this demo on a new page « previousnext » ...
Using textures in WebGL - Web APIs
rst, the code to specify the colors buffer is gone, replaced with this: // tell webgl how to pull out the texture coordinates from buffer { const num = 2; // every coordinate composed of 2 values const type = gl.float; // the data in the buffer is 32 bit float const normalize = false; // don't normalize const stride = 0; // how many bytes to get from one set to the next const offset = 0; // how many bytes inside the buffer to start from gl.bindbuffer(gl.array_buffer, buffers.texturecoord); gl.vertexattribpointer(programinfo.attriblocations.texturecoord, num, type, normalize, stride, offset); gl.enablevertexattribarray(programinfo.attriblocations.texturecoord); } then add code to specify the texture to map onto the faces, just before draw: // tell webgl we wa...
WebGL best practices - Web APIs
promise((resolve, reject) => { function test() { const res = gl.clientwaitsync(sync, flags, 0); if (res == gl.wait_failed) { reject(); return; } if (res == gl.timeout_expired) { settimeout(test, interval_ms); return; } resolve(); } test()); }); } async function getbuffersubdataasync( gl, target, buffer, srcbyteoffset, dstbuffer, /* optional */ dstoffset, /* optional */ length) { const sync = gl.fencesync(gl.sync_gpu_commands_complete, 0); gl.flush(); await clientwaitasync(gl, sync, 0, 10); gl.deletesync(sync); gl.bindbuffer(target, buffer); gl.getbuffersubdata(target, srcbyteoffset, dstbuffer, dstoffset, length); gl.bindbuffer(target, null); return dest; } async function readpixelsasyn...
Writing a WebSocket server in Java - Web APIs
outputstream methods: write(byte[] b, int off, int len) writes len bytes from the specified byte array starting at offset off to this output stream.
Using IIR filters - Web APIs
// create a canvas element and append it to our dom const canvascontainer = document.queryselector('.filter-graph'); const canvasel = document.createelement('canvas'); canvascontainer.appendchild(canvasel); // set 2d context and set dimesions const canvasctx = canvasel.getcontext('2d'); const width = canvascontainer.offsetwidth; const height = canvascontainer.offsetheight; canvasel.width = width; canvasel.height = height; // set background fill canvasctx.fillstyle = 'white'; canvasctx.fillrect(0, 0, width, height); // set up some spacing based on size const spacing = width/16; const fontsize = math.floor(spacing/1.5); // draw our axis canvasctx.linewidth = 2; canvasctx.strokestyle = 'grey'; canvasctx.beginpath(...
Visualizations with Web Audio API - Web APIs
for each one, we make the barheight equal to the array value, set a fill colour based on the barheight (taller bars are brighter), and draw a bar at x pixels across the canvas, which is barwidth wide and barheight/2 tall (we eventually decided to cut each bar in half so they would all fit on the canvas better.) the one value that needs explaining is the vertical offset position we are drawing each bar at: height-barheight/2.
Web Audio API - Web APIs
eory behind how the features of the web audio api work, to help you make informed decisions while designing how audio is routed through your app.controlling multiple parameters with constantsourcenodethis article demonstrates how to use a constantsourcenode to link multiple parameters together so they share the same value, which can be changed by simply setting the value of the constantsourcenode.offset parameter.example and tutorial: simple synth keyboardthis article presents the code and working demo of a video keyboard you can play using the mouse.
Window.screenLeft - Web APIs
WebAPIWindowscreenLeft
initialleft = window.screenleft + canvaselem.offsetleft; initialtop = window.screentop + canvaselem.offsettop; function positionelem() { let newleft = window.screenleft + canvaselem.offsetleft; let newtop = window.screentop + canvaselem.offsettop; let leftupdate = initialleft - newleft; let topupdate = initialtop - newtop; ctx.fillstyle = 'rgb(0, 0, 0)'; ctx.fillrect(0, 0, width, height); ctx.fillstyle = 'rgb(0, 0, 255)'; ctx.be...
Window.screenTop - Web APIs
WebAPIWindowscreenTop
initialleft = window.screenleft + canvaselem.offsetleft; initialtop = window.screentop + canvaselem.offsettop; function positionelem() { let newleft = window.screenleft + canvaselem.offsetleft; let newtop = window.screentop + canvaselem.offsettop; let leftupdate = initialleft - newleft; let topupdate = initialtop - newtop; ctx.fillstyle = 'rgb(0, 0, 0)'; ctx.fillrect(0, 0, width, height); ctx.fillstyle = 'rgb(0, 0, 255)'; ctx.be...
Window.screenX - Web APIs
WebAPIWindowscreenX
initialleft = window.screenleft + canvaselem.offsetleft; initialtop = window.screentop + canvaselem.offsettop; function positionelem() { let newleft = window.screenleft + canvaselem.offsetleft; let newtop = window.screentop + canvaselem.offsettop; let leftupdate = initialleft - newleft; let topupdate = initialtop - newtop; ctx.fillstyle = 'rgb(0, 0, 0)'; ctx.fillrect(0, 0, width, height); ctx.fillstyle = 'rgb(0, 0, 255)'; ctx.be...
Window.screenY - Web APIs
WebAPIWindowscreenY
initialleft = window.screenleft + canvaselem.offsetleft; initialtop = window.screentop + canvaselem.offsettop; function positionelem() { let newleft = window.screenleft + canvaselem.offsetleft; let newtop = window.screentop + canvaselem.offsettop; let leftupdate = initialleft - newleft; let topupdate = initialtop - newtop; ctx.fillstyle = 'rgb(0, 0, 0)'; ctx.fillrect(0, 0, width, height); ctx.fillstyle = 'rgb(0, 0, 255)'; ctx.be...
Sending and Receiving Binary Data - Web APIs
var filestream = load_binary_resource(url); var abyte = filestream.charcodeat(x) & 0xff; // throw away high-order byte (f7) the example above fetches the byte at offset x within the loaded binary data.
XRBoundedReferenceSpace.boundsGeometry - Web APIs
each entry in boundsgeometry is equal to an entry in the list of native bounds geometry points for the room, premultiplied by the inverse of the origin offset.
XRPermissionDescriptor.optionalFeatures - Web APIs
it's particularly useful when determining the distance between the viewer and an input, or when working with offset spaces.
XRPermissionDescriptor.requiredFeatures - Web APIs
it's particularly useful when determining the distance between the viewer and an input, or when working with offset spaces.
XRPermissionStatus.granted - Web APIs
it's particularly useful when determining the distance between the viewer and an input, or when working with offset spaces.
XRReferenceSpace: reset event - Web APIs
instead of allowing this to happen, you can integrate the emulatedposition into the teleportation offset calculated prior to calling getoffsetreferencespace() to create a new reference space whose updated effective origin is adjusted by the distance the viewer's position jumped since the previous frame.
XRReferenceSpaceType - Web APIs
it's particularly useful when determining the distance between the viewer and an input, or when working with offset spaces.
XRRigidTransform.matrix - Web APIs
2(q_xq_y - q_zq_w) & 2(q_xq_z + q_yq_w) & p_x\\ 2(q_xq_y + q_zq_w) & 1 - 2(q_x^2 + q_z^2) & 2(q_yq_z - q_xq_w) & p_y\\ 2(q_xq_z - q_yq_w) & 2(q_yq_z + q_xq_w) & 1 - 2(q_x^2 + q_y^2) & p_z\\ 0 & 0 & 0 & 1 \end{bmatrix} examples in this example, a transform is created to create a matrix which can be used as a transform during rendering of webgl objects, in order to place objects to match a given offset and orientation.
XRRigidTransform.orientation - Web APIs
examples to create a reference space which is oriented to look straight up, positioned 2 meters off of ground level: xrreferencespace = refspace.getoffsetreferencespace( new xrrigidtransform({y: -2}, {x: 0.0, y: 1.0, z: 0.0, w: 1.0}); ); the unit quaternion specified here is [0.0, 1.0, 0.0, 1.0] to indicate that the object should be facing directly along the y axis.
XRSession.requestAnimationFrame() - Web APIs
the callback receives as input two parameters: time a domhighrestimestamp indicating the time offset at which the updated viewer state was received from the webxr device.
XRSession.requestReferenceSpace() - Web APIs
it's particularly useful when determining the distance between the viewer and an input, or when working with offset spaces.
Web APIs
WebAPI
ormatrixelement svgfecomponenttransferelement svgfecompositeelement svgfeconvolvematrixelement svgfediffuselightingelement svgfedisplacementmapelement svgfedistantlightelement svgfedropshadowelement svgfefloodelement svgfefuncaelement svgfefuncbelement svgfefuncgelement svgfefuncrelement svgfegaussianblurelement svgfeimageelement svgfemergeelement svgfemergenodeelement svgfemorphologyelement svgfeoffsetelement svgfepointlightelement svgfespecularlightingelement svgfespotlightelement svgfetileelement svgfeturbulenceelement svgfilterelement svgfilterprimitivestandardattributes svgfontelement svgfontfaceelement svgfontfaceformatelement svgfontfacenameelement svgfontfacesrcelement svgfontfaceurielement svgforeignobjectelement svggelement svggeometryelement svgglyphelement svgglyphrefel...
Web Accessibility: Understanding Colors and Luminance - Accessibility
from iec 61966-2-2:2003(en), "video systems approximate the lightness response of vision by computing a luma component y′ as a weighted sum of nonlinear r′g′b′ primary components: each rgb signal is, comparable to the 1/3 power function with an offset defined by l*.
-moz-image-region - CSS: Cascading Style Sheets
its parameters define the top, right, bottom, and left offsets of the edges of the image, in this order.
-webkit-box-reflect - CSS: Cascading Style Sheets
/* direction values */ -webkit-box-reflect: above; -webkit-box-reflect: below; -webkit-box-reflect: left; -webkit-box-reflect: right; /* offset value */ -webkit-box-reflect: below 10px; /* mask value */ -webkit-box-reflect: below 0 linear-gradient(transparent, white); /* global values */ -webkit-box-reflect: inherit; -webkit-box-reflect: initial; -webkit-box-reflect: unset; note: this feature is not intended to be used by web sites.
:nth-child() - CSS: Cascading Style Sheets
functional notation <an+b> represents elements in a list whose indices match those found in a custom pattern of numbers, defined by an+b, where: a is an integer step size, b is an integer offset, n is all positive integers, starting from 0.
CSS Basic User Interface - CSS: Cascading Style Sheets
reference properties appearance box-sizing cursor ime-mode nav-down nav-left nav-right nav-up outline outline-width outline-style outline-color outline-offset resize text-overflow user-select guides using url values for the cursor property explains how a url can be used with the cursor property to produce custom cursors.
Box alignment in CSS Grid Layout - CSS: Cascading Style Sheets
setting auto margins, using margin-right or margin-left however, or absolutely positioning items using the top, right, bottom and left offsets would not honor writing modes.
CSS Logical Properties and Values - CSS: Cascading Style Sheets
nd inline-start keywords) inset inset-block inset-block-end inset-block-start inset-inline inset-inline-end inset-inline-start other properties caption-side (inline-end and inline-start keywords) overflow-block overflow-inline overscroll-behavior-block overscroll-behavior-inline resize (block and inline keywords) text-align (end and start keywords) deprecated properties offset-block-end (now inset-block-end ) offset-block-start (now inset-block-start ) offset-inline-end (now inset-inline-end ) offset-inline-start (now inset-inline-start ) guides basic concepts of logical properties and values logical properties for sizing logical properties for margins, borders and padding logical properties for floating and positioning specifications ...
CSS Properties Reference - CSS: Cascading Style Sheets
ntop overflow overflow padding padding padding-bottom paddingbottom padding-left paddingleft padding-right paddingright padding-top paddingtop page-break-after pagebreakafter page-break-before pagebreakbefore position position stroke-dasharray strokedasharray stroke-dashoffset strokedashoffset stroke-width strokewidth text-align textalign text-decoration textdecoration text-indent textindent text-transform texttransform top top vertical-align verticalalign visibility visibility width width z-index zindex ...
Overview of CSS Shapes - CSS: Cascading Style Sheets
the specification defines four <basic-shape> values, which are: inset() circle() ellipse() polygon() using the value inset() wraps text around a rectangular shape however you are able to add offset values, thus pulling the line boxes of any wrapping content closer to the object than would otherwise happen.
CSS Text Decoration - CSS: Cascading Style Sheets
reference properties letter-spacing text-align text-decoration text-decoration-color text-decoration-line text-decoration-offset text-decoration-skip-ink text-decoration-style text-decoration-thickness text-emphasis text-emphasis-color text-emphasis-position text-emphasis-style text-indent text-rendering text-shadow text-transform white-space word-spacing guides none.
Mozilla CSS extensions - CSS: Cascading Style Sheets
ill accepted] -moz-hyphens [prefixed version still accepted] -moz-margin-end [superseded by the standard version margin-inline-end] -moz-margin-start [superseded by the standard version margin-inline-start] mask [applying to more than svg] o -moz-opacityobsolete since gecko 1.9.1 -moz-outlineobsolete since gecko 1.9.2 -moz-outline-colorobsolete since gecko 1.9.2 -moz-outline-offsetobsolete since gecko 1.9.2 -moz-outline-styleobsolete since gecko 1.9.2 -moz-outline-widthobsolete since gecko 1.9.2 p -moz-padding-end [superseded by the standard version padding-inline-start] -moz-padding-start [superseded by the standard version padding-inline-end] -moz-perspective [prefixed version still accepted] -moz-perspective-origin [prefixed version still accepted] p...
Shorthand properties - CSS: Cascading Style Sheets
shorthand properties: animation, background, border, border-bottom, border-color, border-left, border-radius, border-right, border-style, border-top, border-width, column-rule, columns, flex, flex-flow, font, grid, grid-area, grid-column, grid-row, grid-template, list-style, margin, offset, outline, overflow, padding, place-content, place-items, place-self, text-decoration, transition ...
animation-delay - CSS: Cascading Style Sheets
syntax /* single animation */ animation-delay: 3s; animation-delay: 0s; animation-delay: -1500ms; /* multiple animations */ animation-delay: 2.1s, 480ms; values <time> the time offset, from the moment at which the animation is applied to the element, at which the animation should begin.
background - CSS: Cascading Style Sheets
it also applies to ::first-letter and ::first-line.inheritednopercentagesas each of the properties of the shorthand:background-position: refer to the size of the background positioning area minus size of background image; size refers to the width for horizontal offsets and to the height for vertical offsetsbackground-size: relative to the background positioning areacomputed valueas each of the properties of the shorthand:background-image: as specified, but with <url> values made absolutebackground-position: a list, each item consisting of two keywords representing the origin and two offsets from that origin, each given as an absolute length (if given a <length...
border-image-width - CSS: Cascading Style Sheets
percentages are relative to the width of the border image area for horizontal offsets and the height of the border image area for vertical offsets.
border - CSS: Cascading Style Sheets
WebCSSborder
amazing, isn't it?</div> css div { border: 0.5rem outset pink; outline: 0.5rem solid khaki; box-shadow: 0 0 0 2rem skyblue; border-radius: 12px; font: bold 1rem sans-serif; margin: 2rem; padding: 1rem; outline-offset: 0.5rem; } result specifications specification status comment css backgrounds and borders module level 3the definition of 'border' in that specification.
clip - CSS: Cascading Style Sheets
WebCSSclip
the <top> and <bottom> values are offsets from the inside top border edge of the box, while <right> and <left> are offsets from the inside left border edge of the box — that is, the extent of the padding box.
inset-inline-end - CSS: Cascading Style Sheets
formal definition initial valueautoapplies topositioned elementsinheritednopercentageslogical-width of containing blockcomputed valuesame as box offsets: top, right, bottom, left properties except that directions are logicalanimation typea length, percentage or calc(); formal syntax <'top'> examples setting inline end offset html <div> <p class="exampletext">example text</p> </div> css div { background-color: yellow; width: 120px; height: 120px; } .exampletext { writing-mode: vertical-rl; position: relative; inset-inline-e...
justify-items - CSS: Cascading Style Sheets
for absolutely-positioned elements, it aligns the items inside their containing block on the inline axis, accounting for the offset values of top, left, bottom, and right.
justify-self - CSS: Cascading Style Sheets
for absolutely-positioned elements, it aligns an item inside its containing block on the inline axis, accounting for the offset values of top, left, bottom, and right.
mask-border-width - CSS: Cascading Style Sheets
percentages are relative to the width of the border area for horizontal offsets and the height of the border area for vertical offsets.
mask - CSS: Cascading Style Sheets
WebCSSmask
shorthand:mask-position: refer to size of mask painting area minus size of mask layer image (see the text for background-position)computed valueas each of the properties of the shorthand:mask-image: as specified, but with <url> values made absolutemask-mode: as specifiedmask-repeat: consists of two keywords, one per dimensionmask-position: consists of two keywords representing the origin and two offsets from that origin, each given as an absolute length (if given a <length>), otherwise as a percentage.mask-clip: as specifiedmask-origin: as specifiedmask-size: as specified, but with relative lengths converted into absolute lengthsmask-composite: as specifiedanimation typeas each of the properties of the shorthand:mask-image: discretemask-mode: discretemask-repeat: discretemask-position: repeatab...
object-position - CSS: Cascading Style Sheets
relative or absolute offsets can be used.
outline - CSS: Cascading Style Sheets
WebCSSoutline
a coloroutline-width: a lengthoutline-style: discrete formal syntax [ <'outline-color'> | <'outline-style'> | <'outline-width'> ] examples using outline to set a focus style html <a href="#">this link has a special focus style.</a> css a { border: 1px solid; border-radius: 3px; display: inline-block; margin: 10px; padding: 5px; } a:focus { outline: 4px dotted #e73; outline-offset: 4px; background: #ffa; } result specifications specification status comment css basic user interface module level 3the definition of 'outline' in that specification.
overflow - CSS: Cascading Style Sheets
WebCSSoverflow
the content can be scrolled programmatically (for example, by setting the value of a property such as offsetleft), so the element is still a scroll container.
repeating-conic-gradient() - CSS: Cascading Style Sheets
syntax /* starburst: a a blue on blue starburst: the gradient is a starburst of lighter and darker blue, centered in the upper left quandrant, offset by 3degrees so there is no up/down straight line */ background: repeating-conic-gradient( from 3deg at 25% 25%, hsl(200, 100%, 50%) 0deg 15deg, hsl(200, 100%, 60%) 10deg 30deg); ); values <angle> preceded by the from keyterm, and taking an angle as its value, defines the gradient rotation in clockwise direction.
scroll-snap-coordinate - CSS: Cascading Style Sheets
<position> specifies the offset of the snap coordinates from the start edge of the element’s border box.
scroll-snap-destination - CSS: Cascading Style Sheets
/* <position> value */ scroll-snap-destination: 400px 600px; /* global values */ scroll-snap-destination: inherit; scroll-snap-destination: initial; scroll-snap-destination: unset; syntax values <position> specifies the offset of the snap destination from the start edge of the scroll container’s visual viewport.
url() - CSS: Cascading Style Sheets
WebCSSurl()
ttps://example.com/images/myimg.jpg); url(data:image/png;base64,irxvb0…); url(myfont.woff); url(#idofsvgpath); /* associated properties */ background-image: url("https://mdn.mozillademos.org/files/16761/star.gif"); list-style-image: url('../images/bullet.jpg'); content: url("pdficon.jpg"); cursor: url(mycursor.cur); border-image-source: url(/media/diamonds.png); src: url('fantasticfont.woff'); offset-path: url(#path); mask-image: url("masks.svg#mask1"); /* properties with fallbacks */ cursor: url(pointer.cur), pointer; /* associated short-hand properties */ background: url('https://mdn.mozillademos.org/files/16761/star.gif') bottom right repeat-x blue; border-image: url("/media/diamonds.png") 30 fill / 30px / 30px space; /* as a parameter in another css function */ background-image: cross-...
WAI ARIA Live Regions/API Support - Developer guides
ual new accessible object) object replaced with different object (this happens especially if an object's interfaces or role changes) children_changed::remove followed immediately by children_change::add event_object_hide followed immediately by event_object_show text removed text_changed::delete ia2_event_text_removed (use iaccessibletext::get_oldtext to retrieve the offsets and removed text) text inserted text_changed::insert ia2_event_text_inserted (use iaccessibletext::get_newtext to retrieve the offsets and inserted text) text replaced text_changed::delete followed immediately by text_changed::insert ia2_event_text_removed followed immediately by ia2_event_text_inserted * we do not use msaa's create/destroy at the request of s...
Cross-browser audio basics - Developer guides
ay the hand pointer on hover: #progress { margin-left: 80px; border: 1px solid black; cursor: pointer; } then we add the code that detects the click and moves the 'playhead' to the correct position: var progress = document.getelementbyid('progress'); progress.addeventlistener('click', function(e) { // calculate the normalized position clicked var clickposition = (e.pagex - this.offsetleft) / this.offsetwidth; var clicktime = clickposition * myaudio.duration; // move the playhead to the correct position myaudio.currenttime = clicktime; }); buffering ok, we're getting there, but there is another piece of useful information we can display: the amount of audio has been buffered or downloaded in advance.
Video player styling basics - Developer guides
it now also needs to take into account the offset position of the parent element: progress.addeventlistener('click', function(e) { var pos = (e.pagex - (this.offsetleft + this.offsetparent.offsetleft)) / this.offsetwidth; video.currenttime = pos * video.duration; }); fullscreen the fullscreen implemention hasn't changed.
Creating a cross-browser video player - Developer guides
this can also be achieved by adding a simple click event listener to the progress element: progress.addeventlistener('click', function(e) { var pos = (e.pagex - this.offsetleft) / this.offsetwidth; video.currenttime = pos * video.duration; }); this piece of code simply uses the clicked position to (roughly) work out where in the progress element the user has clicked, and to move the video to that position by setting its currenttime attribute.
<a>: The Anchor element - HTML: Hypertext Markup Language
WebHTMLElementa
a { display: inline-block; background: #69c; color: #fff; padding: 5px 10px; } javascript var canvas = document.queryselector('canvas'), c = canvas.getcontext('2d'); c.fillstyle = 'hotpink'; function draw(x, y) { if (isdrawing) { c.beginpath(); c.arc(x, y, 10, 0, math.pi*2); c.closepath(); c.fill(); } } canvas.addeventlistener('mousemove', event => draw(event.offsetx, event.offsety) ); canvas.addeventlistener('mousedown', () => isdrawing = true); canvas.addeventlistener('mouseup', () => isdrawing = false); document.queryselector('a').addeventlistener('click', event => event.target.href = canvas.todataurl() ); result security and privacy <a> elements can have consequences for users’ security and privacy.
<col> - HTML: Hypertext Markup Language
WebHTMLElementcol
charoff this attribute is used to indicate the number of characters to offset the column data from the alignment characters specified by the char attribute.
<input type="datetime-local"> - HTML: Hypertext Markup Language
for example: <input type="hidden" id="timezone" name="timezone" value="-08:00"> on the other hand, if you were required to allow the user to enter a timezone along with a date/time input, you could provide a means of inputting a timezone, such as a <select> element: <select name="timezone_offset" id="timezone-offset" class="span5"> <option value="-12:00">(gmt -12:00) eniwetok, kwajalein</option> <option value="-11:00">(gmt -11:00) midway island, samoa</option> <option value="-10:00">(gmt -10:00) hawaii</option> <option value="-09:50">(gmt -9:30) taiohae</option> <option value="-09:00">(gmt -9:00) alaska</option> <option value="-08:00">(gmt -8:00) pacific time (us ...
<input type="range"> - HTML: Hypertext Markup Language
WebHTMLElementinputrange
offsetting the origin by 75px on each axis means we will rotate around the center of that space.
<td>: The Table Data Cell element - HTML: Hypertext Markup Language
WebHTMLElementtd
char (with text only): the content is aligned to a character inside the <th> element with minimal offset.
<th> - HTML: Hypertext Markup Language
WebHTMLElementth
char (with text only): the content is aligned to a character inside the <th> element with minimal offset.
<video>: The Video Embed element - HTML: Hypertext Markup Language
WebHTMLElementvideo
if the media has not started playing yet, the time offset at which it will begin is returned.
Indexed collections - JavaScript
a view provides a context — that is, a data type, starting offset, and number of elements — that turns the data into an actual typed array.
SyntaxError: a declaration in the head of a for-of loop can't have an initializer - JavaScript
maybe you intended to make 50 an offset value, in that case you could add it to the loop body, for example.
Array.prototype.indexOf() - JavaScript
if the provided index value is a negative number, it is taken as the offset from the end of the array.
Array.prototype.lastIndexOf() - JavaScript
if negative, it is taken as the offset from the end of the array.
BigInt64Array - JavaScript
bigint64array.prototype.byteoffset returns the offset (in bytes) of the bigint64array from the start of its arraybuffer.
BigUint64Array - JavaScript
biguint64array.prototype.byteoffset returns the offset (in bytes) of the biguint64array from the start of its arraybuffer.
Date.parse() - JavaScript
when the time zone offset is absent, date-only forms are interpreted as a utc time and date-time forms are interpreted as local time.
Date.prototype.setMonth() - JavaScript
syntax dateobj.setmonth(monthvalue[, dayvalue]) versions prior to javascript 1.3 dateobj.setmonth(monthvalue) parameters monthvalue a zero-based integer representing the month of the year offset from the start of the year.
Date.prototype.toGMTString() - JavaScript
examples simple example in this example, the togmtstring() method converts the date to gmt (utc) using the operating system's time-zone offset and returns a string value that is similar to the following form.
Date.prototype.toISOString() - JavaScript
the timezone is always zero utc offset, as denoted by the suffix "z".
Float32Array - JavaScript
float32array.prototype.byteoffset returns the offset (in bytes) of the float32array from the start of its arraybuffer.
Float64Array - JavaScript
float64array.prototype.byteoffset returns the offset (in bytes) of the float64array from the start of its arraybuffer.
Int16Array - JavaScript
int16array.prototype.byteoffset returns the offset (in bytes) of the int16array from the start of its arraybuffer.
Int32Array - JavaScript
int32array.prototype.byteoffset returns the offset (in bytes) of the int32array from the start of its arraybuffer.
Int8Array - JavaScript
int8array.prototype.byteoffset returns the offset (in bytes) of the int8array from the start of its arraybuffer.
Object.prototype.constructor - JavaScript
{} parentwithstatic.startposition = { x: 0, y:0 } // static member property parentwithstatic.getstartposition = function getstartposition() { return this.startposition } function child(x, y) { this.position = { x: x, y: y } } child = object.assign(parentwithstatic) child.prototype = object.create(parentwithstatic.prototype) child.prototype.constructor = child child.prototype.getoffsetbyinitialposition = function getoffsetbyinitialposition() { let position = this.position let startposition = this.constructor.getstartposition() // error undefined is not a function, since the constructor is child return { offsetx: startposition.x - position.x, offsety: startposition.y - position.y } }; for this example we need either to stay parent constructor to continue to wor...
Object.freeze() - JavaScript
iews with elements > object.freeze(new dataview(new arraybuffer(32))) // no elements dataview {} > object.freeze(new float64array(new arraybuffer(64), 63, 0)) // no elements float64array [] > object.freeze(new float64array(new arraybuffer(64), 32, 2)) // has elements typeerror: cannot freeze array buffer views with elements note that; as the standard three properties (buf.bytelength, buf.byteoffset and buf.buffer) are read-only (as are those of an arraybuffer or sharedarraybuffer), there is no reason for attempting to freeze these properties.
String.prototype.charAt() - JavaScript
the string object's charat() method returns a new string consisting of the single utf-16 code unit located at the specified offset into the string.
String.prototype.replaceAll() - JavaScript
offset the offset of the matched substring within the whole string being examined.
TypedArray.prototype.indexOf() - JavaScript
if the provided index value is a negative number, it is taken as the offset from the end of the typed array.
TypedArray.prototype.lastIndexOf() - JavaScript
if negative, it is taken as the offset from the end of the typed array.
Uint16Array - JavaScript
uint16array.prototype.byteoffset returns the offset (in bytes) of the uint16array from the start of its arraybuffer.
Uint32Array - JavaScript
uint32array.prototype.byteoffset returns the offset (in bytes) of the uint32array from the start of its arraybuffer.
Uint8Array - JavaScript
uint8array.prototype.byteoffset returns the offset (in bytes) of the uint8array from the start of its arraybuffer.
Uint8ClampedArray - JavaScript
uint8clampedarray.prototype.byteoffset returns the offset (in bytes) of the uint8clampedarray from the start of its arraybuffer.
MathML attribute reference - MathML
voffset <mpadded> sets the vertical position of the child content.
<mstyle> - MathML
WebMathMLElementmstyle
lspace or voffset do not apply to <mpadded>.
Applying SVG effects to HTML content - SVG: Scalable Vector Graphics
example: masking for example, you can make a gradient mask for html content using svg and css code similar to the following, inside your html document: <svg height="0"> <mask id="mask-1"> <lineargradient id="gradient-1" y2="1"> <stop stop-color="white" offset="0"/> <stop stop-opacity="0" offset="1"/> </lineargradient> <circle cx="0.25" cy="0.25" r="0.25" id="circle" fill="white"/> <rect x="0.5" y="0.2" width="300" height="100" fill="url(#gradient-1)"/> </mask> </svg> .target { mask: url(#mask-1); } p { width: 300px; border: 1px solid #000; display: inline-block; } note that in the css, the mask is specified using a url t...
additive - SVG: Scalable Vector Graphics
it is frequently useful to define animation as an offset or delta to an attribute's value, rather than as absolute values.
alphabetic - SVG: Scalable Vector Graphics
the value is an offset in the font coordinate system.
by - SVG: Scalable Vector Graphics
WebSVGAttributeby
the by attribute specifies a relative offset value for an attribute that will be modified during an animation.
class - SVG: Scalable Vector Graphics
WebSVGAttributeclass
class" cx="40" cy="50" r="26"/> </svg> </body> </html> elements the following elements can use the class attribute: <a> <altglyph> <circle> <clippath> <defs> <desc> <ellipse> <feblend> <fecolormatrix> <fecomponenttransfer> <fecomposite> <feconvolvematrix> <fediffuselighting> <fedisplacementmap> <feflood> <fegaussianblur> <feimage> <femerge> <femorphology> <feoffset> <fespecularlighting> <fetile> <feturbulence> <filter> <font> <foreignobject> <g> <glyph> <glyphref> <image> <line> <lineargradient> <marker> <mask> <missing-glyph> <path> <pattern> <polygon> <polyline> <radialgradient> <rect> <stop> <svg> <switch> <symbol> <text> <textpath> <title> <tref> <tspan> <use> ...
clip - SVG: Scalable Vector Graphics
WebSVGAttributeclip
the <top> and <bottom> values specify offsets from the top border edge of the element viewport, while <right> and <left> specify offsets from the left border edge of the element viewport.
color-rendering - SVG: Scalable Vector Graphics
lineargradient>, <marker>, <mask>, <missing-glyph>, <path>, <pattern>, <polygon>, <polyline>, <radialgradient>, <rect>, <svg>, <switch>, <symbol>, <text>, <textpath>, <tspan>, and <use> html, body, svg { height: 100%; } <svg viewbox="0 0 480 200" xmlns="http://www.w3.org/2000/svg"> <defs> <radialgradient id="gradient" cx="0.5" cy="0.5" r="0.5" fx="0.35" fy="0.35" fr="5%"> <stop offset="0%" stop-color="white"/> <stop offset="100%" stop-color="darkseagreen"/> </radialgradient> </defs> <circle cx="100" cy="100" r="100" fill="url(#gradient)" color-rendering="optimizequality" /> <text x="45" y="50%" color-rendering="optimizequality">quality-optimized</text> <circle cx="100" cy="100" r="100" color-rendering="optimizespeed" fill="url(#gradient)" style="trans...
exponent - SVG: Scalable Vector Graphics
four elements are using this attribute: <fefunca>, <fefuncb>, <fefuncg>, and <fefuncr> html, body, svg { height: 100%; } <svg viewbox="0 0 420 200" xmlns="http://www.w3.org/2000/svg"> <defs> <lineargradient id="gradient" gradientunits="userspaceonuse" x1="0" y1="0" x2="200" y2="0"> <stop offset="0" stop-color="#ff0000" /> <stop offset="0.5" stop-color="#00ff00" /> <stop offset="1" stop-color="#0000ff" /> </lineargradient> </defs> <filter id="componenttransfer1" x="0" y="0" width="100%" height="100%"> <fecomponenttransfer> <fefuncr type="gamma" exponent="1"/> <fefuncg type="gamma" exponent="1"/> <fefuncb type="gamma" exponent="1"/> </fecomponenttransfer> ...
fill - SVG: Scalable Vector Graphics
WebSVGAttributefill
html,body,svg { height:100% } <svg viewbox="0 0 300 100" xmlns="http://www.w3.org/2000/svg"> <!-- simple color fill --> <circle cx="50" cy="50" r="40" fill="pink" /> <!-- fill circle with a gradient --> <defs> <radialgradient id="mygradient"> <stop offset="0%" stop-color="pink" /> <stop offset="100%" stop-color="black" /> </radialgradient> </defs> <circle cx="150" cy="50" r="40" fill="url(#mygradient)" /> <!-- keeping the final state of an animated circle which is a circle with a radius of 40.
hanging - SVG: Scalable Vector Graphics
WebSVGAttributehanging
the value is an offset in the font coordinate system.
ideographic - SVG: Scalable Vector Graphics
the value is an offset in the font coordinate system.
in - SVG: Scalable Vector Graphics
WebSVGAttributein
fourteen elements are using this attribute: <feblend>, <fecolormatrix>, <fecomponenttransfer>, <fecomposite>, <feconvolvematrix>, <fediffuselighting>, <fedisplacementmap>, <fedropshadow>, <fegaussianblur>, <femergenode>, <femorphology>, <feoffset>, <fespecularlighting>, <fetile> usage notes value sourcegraphic | sourcealpha | backgroundimage | backgroundalpha | fillpaint | strokepaint | <filter-primitive-reference> default value sourcegraphic for first filter primitive, otherwise result of previous filter primitive animatable yes sourcegraphic this keyword represents the graphics elements th...
intercept - SVG: Scalable Vector Graphics
four elements are using this attribute: <fefunca>, <fefuncb>, <fefuncg>, and <fefuncr> html, body, svg { height: 100%; } <svg viewbox="0 0 420 200" xmlns="http://www.w3.org/2000/svg"> <defs> <lineargradient id="gradient" gradientunits="userspaceonuse" x1="0" y1="0" x2="200" y2="0"> <stop offset="0" stop-color="#ff0000" /> <stop offset="0.5" stop-color="#00ff00" /> <stop offset="1" stop-color="#0000ff" /> </lineargradient> </defs> <filter id="componenttransfer1" x="0" y="0" width="100%" height="100%"> <fecomponenttransfer> <fefuncr type="linear" intercept="0"/> <fefuncg type="linear" intercept="0"/> <fefuncb type="linear" intercept="0"/> </f...
keyTimes - SVG: Scalable Vector Graphics
each time value in the keytimes list is specified as a floating point value between 0 and 1 (inclusive), representing a proportional offset into the duration of the animation element.
mathematical - SVG: Scalable Vector Graphics
the value is an offset in the font coordinate system.
opacity - SVG: Scalable Vector Graphics
WebSVGAttributeopacity
, <circle>, <ellipse>, <foreignobject>, <g>, <iframe>, <image>, <line>, <marker>, <path>, <polygon>, <polyline>, <rect>, <svg>, <switch>, <symbol>, <text>, <textpath>, <tspan>, <use>, <unknown>, and <video> html, body, svg { height: 100%; } <svg viewbox="0 0 200 100" xmlns="http://www.w3.org/2000/svg"> <defs> <lineargradient id="gradient" x1="0%" y1="0%" x2="0" y2="100%"> <stop offset="0%" style="stop-color:skyblue;" /> <stop offset="100%" style="stop-color:seagreen;" /> </lineargradient> </defs> <rect x="0" y="0" width="100%" height="100%" fill="url(#gradient)" /> <circle cx="50" cy="50" r="40" fill="black" /> <circle cx="150" cy="50" r="40" fill="black" opacity="0.3" /> </svg> usage notes default value 1 value <alpha-value> ...
paint-order - SVG: Scalable Vector Graphics
example <svg xmlns="http://www.w3.org/2000/svg" width="400" height="200"> <lineargradient id="g" x1="0" y1="0" x2="0" y2="1"> <stop stop-color="#888"/> <stop stop-color="#ccc" offset="1"/> </lineargradient> <rect width="400" height="200" fill="url(#g)"/> <g fill="crimson" stroke="white" stroke-width="6" stroke-linejoin="round" text-anchor="middle" font-family="sans-serif" font-size="50px" font-weight="bold"> <text x="200" y="75">stroke over</text> <text x="200" y="150" paint-order="stroke" id="stroke-under">stroke under</text> </g> </svg> the example wou...
r - SVG: Scalable Vector Graphics
WebSVGAttributer
two elements are using this attribute: <circle>, and <radialgradient> html,body,svg { height:100% } <svg viewbox="0 0 300 200" xmlns="http://www.w3.org/2000/svg"> <radialgradient r="0" id="mygradient000"> <stop offset="0" stop-color="white" /> <stop offset="100%" stop-color="black" /> </radialgradient> <radialgradient r="50%" id="mygradient050"> <stop offset="0" stop-color="white" /> <stop offset="100%" stop-color="black" /> </radialgradient> <radialgradient r="100%" id="mygradient100"> <stop offset="0" stop-color="white" /> <stop offset="100%" stop-color="black" /> </radialgradient> <circle cx="50" cy="50" r="0"/> <circle cx="150" cy="50" r="25"/> <circle cx="250" cy="50" r="50"/> <rec...
result - SVG: Scalable Vector Graphics
WebSVGAttributeresult
seventeen elements are using this attribute: <feblend>, <fecolormatrix>, <fecomponenttransfer>, <fecomposite>, <feconvolvematrix>, <fediffuselighting>, <fedisplacementmap>, <fedropshadow>, <feflood>, <fegaussianblur>, <feimage>, <femerge>, <femorphology>, <feoffset>, <fespecularlighting>, <fetile>, and <feturbulence> html, body, svg { height: 100%; } <svg viewbox="0 0 220 220" xmlns="http://www.w3.org/2000/svg"> <filter id="displacementfilter"> <feturbulence type="turbulence" basefrequency="0.05" numoctaves="2" result="turbulence"/> <fedisplacementmap in2="turbulence" in="sourcegraphic" scale="50" xchannelselector="r" ychann...
stroke - SVG: Scalable Vector Graphics
WebSVGAttributestroke
, <ellipse>, <line>, <path>, <polygon>, <polyline>, <rect>, <text>, <textpath>, <tref>, and <tspan> html,body,svg { height:100% } <svg viewbox="0 0 20 10" xmlns="http://www.w3.org/2000/svg"> <!-- simple color stroke --> <circle cx="5" cy="5" r="4" fill="none" stroke="green" /> <!-- stroke a circle with a gradient --> <defs> <lineargradient id="mygradient"> <stop offset="0%" stop-color="green" /> <stop offset="100%" stop-color="white" /> </lineargradient> </defs> <circle cx="15" cy="5" r="4" fill="none" stroke="url(#mygradient)" /> </svg> usage notes value <paint> default value none animatable yes specifications specification status comment scalable vector g...
tableValues - SVG: Scalable Vector Graphics
four elements are using this attribute: <fefunca>, <fefuncb>, <fefuncg>, and <fefuncr> html, body, svg { height: 100%; } <svg viewbox="0 0 420 200" xmlns="http://www.w3.org/2000/svg"> <defs> <lineargradient id="gradient" gradientunits="userspaceonuse" x1="0" y1="0" x2="200" y2="0"> <stop offset="0" stop-color="#ff0000" /> <stop offset="0.5" stop-color="#00ff00" /> <stop offset="1" stop-color="#0000ff" /> </lineargradient> </defs> <filter id="componenttransfer1" x="0" y="0" width="100%" height="100%"> <fecomponenttransfer> <fefuncr type="table" tablevalues="0 1"/> <fefuncg type="table" tablevalues="0 1"/> <fefuncb type="table" tablevalues="0 1"/...
v-alphabetic - SVG: Scalable Vector Graphics
the value is an offset in the font coordinate system relative to the glyph-specific vert-origin-x attribute.
v-hanging - SVG: Scalable Vector Graphics
the value is an offset in the font coordinate system relative to the glyph-specific vert-origin-x attribute.
v-ideographic - SVG: Scalable Vector Graphics
the value is an offset in the font coordinate system relative to the glyph-specific vert-origin-x attribute.
v-mathematical - SVG: Scalable Vector Graphics
the value is an offset in the font coordinate system relative to the glyph-specific vert-origin-x attribute.
x1 - SVG: Scalable Vector Graphics
WebSVGAttributex1
ced by the gradientunits attributs value <length> | <percentage> default value 0% animatable yes example html,body,svg { height:100% } <svg viewbox="0 0 20 10" xmlns="http://www.w3.org/2000/svg"> <!-- by default the gradient vector start at the left bounding limit of the shape it is applied to --> <lineargradient x1="0%" id="g0"> <stop offset="0" stop-color="black" /> <stop offset="100%" stop-color="red" /> </lineargradient> <rect x="1" y="1" width="8" height="8" fill="url(#g0)" /> <!-- here the gradient vector start at 80% of the left bounding limit of the shape it is applied to --> <lineargradient x1="80%" id="g1"> <stop offset="0" stop-color="black" /> <stop offset="100%" stop-color="red" /> <...
x2 - SVG: Scalable Vector Graphics
WebSVGAttributex2
by the gradientunits attributs value <length> | <percentage> default value 100% animatable yes example html,body,svg { height:100% } <svg viewbox="0 0 20 10" xmlns="http://www.w3.org/2000/svg"> <!-- by default the gradient vector end at the right bounding limit of the shape it is applied to --> <lineargradient x2="100%" id="g0"> <stop offset="0" stop-color="black" /> <stop offset="100%" stop-color="red" /> </lineargradient> <rect x="1" y="1" width="8" height="8" fill="url(#g0)" /> <!-- here the gradient vector start at 20% of the left bounding limit of the shape it is applied to --> <lineargradient x2="20%" id="g1"> <stop offset="0" stop-color="black" /> <stop offset="100%" stop-color="red" /> <...
<a> - SVG: Scalable Vector Graphics
WebSVGElementa
t notably: requiredextensions, systemlanguage event attributes global event attributes, document element event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility xlink attributes most notably: xlink:title aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect,...
<altGlyph> - SVG: Scalable Vector Graphics
WebSVGElementaltGlyph
extensions, systemlanguage event attributes global event attributes, document element event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, dominant-baseline, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, text-anchor, transform, vector-effect, visibility xlink attributes xlink:href, xlink:type, xlink:role, xlink:arcrole, xlink:title, xlink:show, xlink:actuate dom interface this element implements the svgaltglyphelement interface.
<circle> - SVG: Scalable Vector Graphics
WebSVGElementcircle
ditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expanded, aria-flowt...
<clipPath> - SVG: Scalable Vector Graphics
WebSVGElementclipPath
alue: userspaceonuse; animatable: yes global attributes core attributes most notably: id styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage presentation attributes most notably: clip-path, clip-rule, color, display, fill, fill-opacity, fill-rule, filter, mask, opacity, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility usage notes categoriesnonepermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elements<text>, <use> specifications specification status comment css masking module level 1the definition o...
<ellipse> - SVG: Scalable Vector Graphics
WebSVGElementellipse
ditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expanded, aria-flowt...
<feGaussianBlur> - SVG: Scalable Vector Graphics
<circle cx="60" cy="60" r="50" fill="green" /> <circle cx="170" cy="60" r="50" fill="green" filter="url(#blurme)" /> </svg> result screenshotlive sample drop shadow example svg <svg width="120" height="120" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <filter id="dropshadow"> <fegaussianblur in="sourcealpha" stddeviation="3" /> <feoffset dx="2" dy="4" /> <femerge> <femergenode /> <femergenode in="sourcegraphic" /> </femerge> </filter> <circle cx="60" cy="60" r="50" fill="green" filter="url(#dropshadow)" /> </svg> result screenshotlive sample specifications specification status comment filter effects module level 1the definition of '<fegaussianblur>' in that s...
<feMerge> - SVG: Scalable Vector Graphics
WebSVGElementfeMerge
usage context categoriesfilter primitive elementpermitted contentany number of the following elements, in any order:<femergenode> example svg <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg"> <filter id="feoffset" x="-40" y="-20" width="100" height="200"> <feoffset in="sourcegraphic" dx="60" dy="60" /> <fegaussianblur stddeviation="5" result="blur2" /> <femerge> <femergenode in="blur2" /> <femergenode in="sourcegraphic" /> </femerge> </filter> <rect x="40" y="40" width="100" height="100" style="stroke: #000000; fill: green; filter: url(#feoffset);" /> </svg> result ...
<feMergeNode> - SVG: Scalable Vector Graphics
usage context categoriesnonepermitted contentany number of the following elements, in any order:<animate>, <set> example <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <filter id="feoffset" x="-40" y="-20" width="100" height="200"> <feoffset in="sourcegraphic" dx="60" dy="60" /> <fegaussianblur in="sourcegraphic" stddeviation="5" result="blur2" /> <femerge> <femergenode in="blur2" /> <femergenode in="sourcegraphic" /> </femerge> </filter> <rect x="40" y="40" width="100" height="100" style="stroke: #000000; fill: green; filter: url(#feoffset);" /> <re...
<foreignObject> - SVG: Scalable Vector Graphics
ns, systemlanguage event attributes global event attributes, graphical event attributes, document event attributes, document element event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expanded, aria-flowt...
<g> - SVG: Scalable Vector Graphics
WebSVGElementg
ditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expanded, aria-flowt...
<hatchpath> - SVG: Scalable Vector Graphics
WebSVGElementhatchpath
usage context categoriesnonepermitted contentany number of the following elements, in any order:animation elementsdescriptive elements<script>, <style> attributes global attributes core attributes global event attributes presentation attributes style attributes specific attributes d offset dom interface this element implements the svghatchpathelement interface.
<line> - SVG: Scalable Vector Graphics
WebSVGElementline
ditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expanded, aria-flowt...
<marker> - SVG: Scalable Vector Graphics
WebSVGElementmarker
utes most notably: id, tabindex styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expanded, aria-flowt...
<mask> - SVG: Scalable Vector Graphics
WebSVGElementmask
default value: 120%; animatable: yes global attributes core attributes most notably: id styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage presentation attributes most notably: clip-path, clip-rule, color, display, fill, fill-opacity, fill-rule, filter, mask, opacity, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility usage notes categoriescontainer elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <fon...
<path> - SVG: Scalable Vector Graphics
WebSVGElementpath
ditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expanded, aria-flowt...
<pattern> - SVG: Scalable Vector Graphics
WebSVGElementpattern
utes most notably: id, tabindex styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility xlink attributes most notably: xlink:title usage notes categoriescontainer elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <col...
<polygon> - SVG: Scalable Vector Graphics
WebSVGElementpolygon
ditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expanded, aria-flowt...
<polyline> - SVG: Scalable Vector Graphics
WebSVGElementpolyline
ditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expanded, aria-flowt...
<rect> - SVG: Scalable Vector Graphics
WebSVGElementrect
ditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expanded, aria-flowt...
<solidcolor> - SVG: Scalable Vector Graphics
--> <lineargradient id="mygradient"> <stop offset="0" stop-color="green" /> </lineargradient> </defs> <text x="10" y="20">circles colored with solidcolor</text> <circle cx="150" cy="65" r="35" stroke-width="2" stroke="url(#mycolor)" fill="white"/> <circle cx="50" cy="65" r="35" fill="url(#mycolor)"/> <text x="10" y="120">circles colored with lineargradient</text> <circle cx="150" cy="165" r="35" stroke-width="2" stroke="u...
<stop> - SVG: Scalable Vector Graphics
WebSVGElementstop
html,body,svg { height:100% } <svg viewbox="0 0 10 10" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <lineargradient id="mygradient" gradienttransform="rotate(90)"> <stop offset="5%" stop-color="gold" /> <stop offset="95%" stop-color="red" /> </lineargradient> </defs> <!-- using my linear gradient --> <circle cx="5" cy="5" r="4" fill="url('#mygradient')" /> </svg> attributes offset this attribute defines where the gradient stop is placed along the gradient vector.
<svg> - SVG: Scalable Vector Graphics
WebSVGElementsvg
ns, systemlanguage event attributes global event attributes, graphical event attributes, document event attributes, document element event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expanded, aria-flowt...
<symbol> - SVG: Scalable Vector Graphics
WebSVGElementsymbol
notably: id styling attributes class, style event attributes global event attributes, document element event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expanded, aria-flowt...
<text> - SVG: Scalable Vector Graphics
WebSVGElementtext
attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, dominant-baseline, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, text-anchor, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expande...
<tspan> - SVG: Scalable Vector Graphics
WebSVGElementtspan
attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, dominant-baseline, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, text-anchor, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expande...
<use> - SVG: Scalable Vector Graphics
WebSVGElementuse
ditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expanded, aria-flowt...
<view> - SVG: Scalable Vector Graphics
WebSVGElementview
al attributes aria attributes » core attributes » global event attributes » externalresourcesrequired specific attributes viewbox preserveaspectratio zoomandpan viewtarget example svg <svg width="600" height="200" viewbox="0 0 600 200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <radialgradient id="gradient"> <stop offset="0%" stop-color="#8cffa0" /> <stop offset="100%" stop-color="#8ca0ff" /> </radialgradient> </defs> <circle r="50" cx="180" cy="50" style="fill:url(#gradient)"/> <view id="halfsizeview" viewbox="0 0 1200 400"/> <view id="normalsizeview" viewbox="0 0 600 200"/> <view id="doublesizeview" viewbox="0 0 300 100"/> <a xlink:href="#halfsizeview"> <text x="5" y="20" font-size=...
SVG 1.1 Support in Firefox - SVG: Scalable Vector Graphics
feoffset implemented.
Clipping and masking - SVG: Scalable Vector Graphics
<svg width="200" height="200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <lineargradient id="gradient"> <stop offset="0" stop-color="black" /> <stop offset="1" stop-color="white" /> </lineargradient> <mask id="mask"> <rect x="0" y="0" width="200" height="200" fill="url(#gradient)" /> </mask> </defs> <rect x="0" y="0" width="200" height="200" fill="green" /> <rect x="0" y="0" width="200" height="200" fill="red" mask="url(#mask)" /> </svg> you see a green-filled rect at the lowes...
Fills and Strokes - SVG: Scalable Vector Graphics
there are additional stroke and fill properties available, including fill-rule, which specifies how to color in shapes that overlap themselves; stroke-miterlimit, which determines if a stroke should draw miters; and stroke-dashoffset, which specifies where to start a dasharray on a line.
Getting started - SVG: Scalable Vector Graphics
a green circle <circle> with a radius of 80px is drawn atop the center of the red rectangle (center of circle offset 150px to the right, and 100px downward from the top left corner).
SVG In HTML Introduction - SVG: Scalable Vector Graphics
enter something:</label> <input type="text"> <span id="err">incorrect value!</span></p> <p><input type="button" value="activate!" onclick="signalerror();"></p> </fieldset> </form> <svg viewbox="0 0 100 100" preserveaspectratio="xmidymid slice" style="width:100%; height:100%; position:absolute; top:0; left:0; z-index:-1;"> <lineargradient id="gradient"> <stop class="begin" offset="0%"/> <stop class="end" offset="100%"/> </lineargradient> <rect x="0" y="0" width="100" height="100" style="fill:url(#gradient)" /> <circle cx="50" cy="50" r="30" style="fill:url(#gradient)" /> </svg> </body> </html> discussion the page is mainly regular html, css and javascript.