Q.Pointer Class
Methods for working with pointer and touchscreen events
Item Index
Methods
- boundingRect static
- cancel static
- cancelClick static
- click static
- click static
- elementFromPoint static
- end static
- ended static
- enter static
- fastclick static
- focusin static
- focusout static
- getX static
- getY static
- hint static
- leave static
- move static
- offset static
- preventDefault static
- preventRubberBand
- relatedTarget static
- restoreRubberBand
- scrollLeft static
- scrollTop static
- scrollTop static
- start static
- startBlurringOnTouch
- startBlurringOnTouch
- startCancelingClicksOnScroll
- startCancelingClicksOnScroll
- stopHints static
- target static
- touchclick static
- touchCount static
- which static
- windowHeight static
Properties
- canceledClick static
- options.cancelClickDistance static
Events
- onCancelClick static
- onEnded static
- onStarted static
Methods
boundingRect
-
[container=document.body] -
[omitClasses] -
[omitOverflow=false]
Get the rectangle enclosing all the children of the container element and – for their children with overflow: visible – their overflowed contents.
Parameters:
-
[container=document.body]HTMLElement optionalThe container element
-
[omitClasses]Array optionalPut CSS classes of any elements to omit from calculations
-
[omitOverflow=false]Boolean optionalIf true, doesn't use overflowed content in calculations
Returns:
with properties left, right, top, bottom, width, height
cancel
()
static
Intelligent pointer cancel event that also works on touchscreens
cancelClick
-
[event] -
[extraInfo] -
[skipMask=false]
Cancels a click that may be in progress, setting Q.Pointer.canceledClick to true. This is to tell other handlers in the document, which know about Q, not to react to the click in a standard way. To really stop propagation of this event, also call stopPropagation. However, this canceling itself can be canceled by a handler returning false.
Parameters:
-
[event]Q.Event optionalSome mouse or touch event from the DOM
-
[extraInfo]Object optionalExtra info to pass to onCancelClick
-
[skipMask=false]Boolean optionalPass true here to skip showing the Q.click.mask for 300 milliseconds, which blocks any stray clicks on mouseup or touchend, which occurs on some browsers. You will want to skip the mask if you want to allow scrolling, for instance.
Returns:
click
()
static
Normalized mouse wheel event that works with various browsers
click
()
static
Intelligent click event that also works on touchscreens, and respects Q.Pointer.canceledClick
elementFromPoint
-
e
Consistently obtains the element under pageX and pageY relative to document
Parameters:
-
eQ.EventSome mouse or touch event from the DOM
Returns:
end
()
static
Intelligent pointer end event that also works on touchscreens
ended
()
static
Removes event listeners that are activated when the pointer has started. This method is called automatically when the mouse or fingers are released on the window. However, in the code that stops propagation of the Q.Pointer.end event (mouseup or touchend), you'd have to call this method manually.
enter
()
static
Intelligent pointer enter event that also works on touchscreens
fastclick
()
static
Like click event but fires much sooner on touchscreens, and respects Q.Pointer.canceledClick
focusin
()
static
Intelligent focusin event that fires only once per focusin
focusout
()
static
Intelligent focusout event that fires only once per focusout
getX
-
e
Returns the x coordinate of an event relative to the document
Parameters:
-
eQ.EventSome mouse or touch event from the DOM
Returns:
getY
-
e
Returns the y coordinate of an event relative to the document
Parameters:
-
eQ.EventSome mouse or touch event from the DOM
Returns:
hint
-
targets -
[options] -
[option.dontStopBeforeShown=false]
Places a hint to click or tap on the screen
Parameters:
-
targetsElement | Object | String | ArrayIndicates where to display the hint. A point should contain properties "x" and "y". Can also be a String selector referring to one or more elements after the show.delay, or an array of points, elements, or string css selectors to use with document.querySelector.
-
[options]Object optionalpossible options, which can include:
-
[src]String optionalthe url of the hint pointer image
-
[hotspot={x:0.5,y:0.3}]Point optional"x" and "y" represent the location of the hotspot within the image, using fractions between 0 and 1
-
[width="200px"]String optional -
[height="200px"]String optional -
[zIndex=99999]Integer optional -
[dontRemove=false]Boolean optionalPass true to keep current hints displayed
-
[audio.src]String optionalCan be used to play an audio file.
-
[audio.from=0]String optionalNumber of seconds inside the audio to start playing the audio from. Make sure audio is longer than this.
-
[audio.until]String optionalNumber of seconds inside the audio to play the audio until. Make sure audio is longer than this.
-
[audio.removeAfterPlaying]String optionalWhether to remove the audio object after playing
-
[show.delay=500]Integer optionalHow long to wait after the function call (or after audio file has loaded and starts playing, if one was specified) before showing the hint animation
-
[show.initialScale=10]Integer optionalThe initial scale of the hint pointer image in the show animation
-
[show.duration=500]Integer optionalThe duration of the hint show animation
-
[show.ease=Q.Animation.ease.smooth]Function optional -
[hide.duration=500]Integer optionalThe duration of the hint hide animation
-
[hide.ease=Q.Animation.ease.smooth]Function optional
-
-
[option.dontStopBeforeShown=false]Boolean optionalDon't let Q.Pointer.stopHints stop this hint before it's shown.
leave
()
static
Intelligent pointer leave event that also works on touchscreens
move
()
static
Intelligent pointer move event that also works on touchscreens
offset
-
element
Computes the offset of an element relative to the browser
Parameters:
-
elementElement
Returns:
An object with "left" and "top" properties.
preventDefault
-
e
Consistently prevents the default behavior of an event across browsers
Parameters:
-
eQ.EventSome mouse or touch event from the DOM
Returns:
Whether the preventDefault succeeded
preventRubberBand
-
[options]
Call this function to prevent the rubber band effect on iOS devices, making the app feel more native there.
restoreRubberBand
()
Can restore touch scrolling after preventRubberBand() was called
scrollLeft
()
Number
static
Returns the document's scroll left in pixels, consistently across browsers
Returns:
scrollTop
()
Number
static
Returns the document's scroll top in pixels, consistently across browsers
Returns:
scrollTop
()
Number
static
Returns the window's inner width, in pixels, consistently across browsers
Returns:
start
()
static
Intelligent pointer start event that also works on touchscreens
startBlurringOnTouch
()
Call this function to begin blurring active elements when touching outside them
startBlurringOnTouch
()
Call this function to begin blurring active elements when touching outside them
startCancelingClicksOnScroll
-
{
Call this function to begin canceling clicks on the element or its scrolling parent. This is to good for preventing stray clicks from happening after an accidental scroll, for instance if content changed after a tab was selected, and scrollTop became 0.
Parameters:
-
{Object
startCancelingClicksOnScroll
-
{
Call this function to stop canceling clicks on the element or its scrolling parent. This is to good for preventing stray clicks from happening after an accidental scroll, for instance if content changed after a tab was selected, and scrollTop became 0.
Parameters:
-
{Object
stopHints
-
[container]
Stops any hints that are currently being displayed
Parameters:
-
[container]HTMLElement optionalIf provided, only hints for elements in this container are stopped.
target
-
e
Consistently returns the target of an event across browsers
Parameters:
-
eQ.EventSome mouse or touch event from the DOM
Returns:
touchclick
()
static
Like click event but works on touchscreens even if the viewport moves during click, such as when the on-screen keyboard disappears or a scrolling parent gets scrollTop = 0 because content changed. Respects Q.Pointer.canceledClick
touchCount
-
e
Returns the number of touch points of an event
Parameters:
-
eQ.EventSome mouse or touch event from the DOM
Returns:
Properties
options.cancelClickDistance
Unknown
static
The distance that a finger or mouse has to move for the click to be canceled
Events
onCancelClick
static
This event occurs when a click has been canceled, for one of several possible reasons.
onEnded
static
This event occurs when touching or mouse pressing should have ended
onStarted
static
This event occurs when touching or mouse pressing should have started