Chartbreaker
    Preparing search index...

    Interface VisualViewport

    The VisualViewport interface of the CSSOM view API represents the visual viewport for a given window. For a page containing iframes, each iframe, as well as the containing page, will have a unique window object. Each window on a page will have a unique VisualViewport representing the properties associated with that window.

    MDN Reference

    interface VisualViewport {
        height: number;
        offsetLeft: number;
        offsetTop: number;
        onresize: ((this: VisualViewport, ev: Event) => any) | null;
        onscroll: ((this: VisualViewport, ev: Event) => any) | null;
        pageLeft: number;
        pageTop: number;
        scale: number;
        width: number;
        addEventListener<K extends keyof VisualViewportEventMap>(
            type: K,
            listener: (this: VisualViewport, ev: VisualViewportEventMap[K]) => any,
            options?: boolean | AddEventListenerOptions,
        ): void;
        addEventListener(
            type: string,
            listener: EventListenerOrEventListenerObject,
            options?: boolean | AddEventListenerOptions,
        ): void;
        dispatchEvent(event: Event): boolean;
        removeEventListener<K extends keyof VisualViewportEventMap>(
            type: K,
            listener: (this: VisualViewport, ev: VisualViewportEventMap[K]) => any,
            options?: boolean | EventListenerOptions,
        ): void;
        removeEventListener(
            type: string,
            listener: EventListenerOrEventListenerObject,
            options?: boolean | EventListenerOptions,
        ): void;
    }

    Hierarchy

    • EventTarget
      • VisualViewport
    Index

    Properties

    height offsetLeft offsetTop onresize onscroll pageLeft pageTop scale width

    Methods

    addEventListener dispatchEvent removeEventListener

    Properties

    height: number

    The height read-only property of the VisualViewport interface returns the height of the visual viewport, in CSS pixels, or 0 if current document is not fully active.

    MDN Reference

    offsetLeft: number

    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, or 0 if current document is not fully active.

    MDN Reference

    offsetTop: number

    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, or 0 if current document is not fully active.

    MDN Reference

    onresize: ((this: VisualViewport, ev: Event) => any) | null

    MDN Reference

    onscroll: ((this: VisualViewport, ev: Event) => any) | null

    MDN Reference

    pageLeft: number

    The pageLeft read-only property of the VisualViewport interface returns the x coordinate of the left edge of the visual viewport relative to the initial containing block origin, in CSS pixels, or 0 if current document is not fully active.

    MDN Reference

    pageTop: number

    The pageTop read-only property of the VisualViewport interface returns the y coordinate of the top edge of the visual viewport relative to the initial containing block origin, in CSS pixels, or 0 if current document is not fully active.

    MDN Reference

    scale: number

    The scale read-only property of the VisualViewport interface returns the pinch-zoom scaling factor applied to the visual viewport, or 0 if current document is not fully active, or 1 if there is no output device.

    MDN Reference

    width: number

    The width read-only property of the VisualViewport interface returns the width of the visual viewport, in CSS pixels, or 0 if current document is not fully active.

    MDN Reference

    Methods

    • The dispatchEvent() method of the EventTarget sends an Event to the object, (synchronously) invoking the affected event listeners in the appropriate order. The normal event processing rules (including the capturing and optional bubbling phase) also apply to events dispatched manually with dispatchEvent().

      MDN Reference

      Parameters

      • event: Event

      Returns boolean

    • The removeEventListener() method of the EventTarget interface removes an event listener previously registered with EventTarget.addEventListener() from the target. The event listener to be removed is identified using a combination of the event type, the event listener function itself, and various optional options that may affect the matching process; see Matching event listeners for removal.

      MDN Reference

      Type Parameters

      Parameters

      Returns void

    • The removeEventListener() method of the EventTarget interface removes an event listener previously registered with EventTarget.addEventListener() from the target. The event listener to be removed is identified using a combination of the event type, the event listener function itself, and various optional options that may affect the matching process; see Matching event listeners for removal.

      MDN Reference

      Parameters

      Returns void

    Settings

    Member Visibility

    On This Page

    Properties
    Methods