Class

StickyPanelView (ui/panel/sticky)

@ckeditor/ckeditor5-ui/src/panel/sticky/stickypanelview

class

The sticky panel view class.

Filtering

Properties

  • content : ViewCollection

    readonly

    Collection of the child views which creates balloon panel contents.

  • isActive : Boolean

    readonly observable

    Controls whether the sticky panel should be active.

  • isSticky : Boolean

    readonly observable

    Controls whether the sticky panel is in the "sticky" state.

  • limiterBottomOffset : Number

    readonly observable

    The offset from the bottom edge of limiterElement which stops the panel from stickying any further to prevent limiter's content from being completely covered.

    Defaults to 50

  • limiterElement : HTMLElement

    readonly observable

    The limiter element for the sticky panel instance. Its bounding rect limits the "stickyness" of the panel, i.e. when the panel reaches the bottom edge of the limiter, it becomes sticky to that edge and does not float off the limiter. It is mandatory for the panel to work properly and once set, it cannot be changed.

  • viewportTopOffset : Number

    readonly observable

    The offset from the top edge of the web browser's viewport which makes the panel become sticky. The default value is 0, which means the panel becomes sticky when it's upper edge touches the top of the page viewport.

    This attribute is useful when the web page has UI elements positioned to the top either using position: fixed or position: sticky, which would cover the sticky panel or vice–versa (depending on the z-index hierarchy).

    Defaults to 0

  • _contentPanel

    protected

    The panel which accepts children into content collection. Also an element which is positioned when isSticky.

  • _contentPanelPlaceholder

    protected

    A dummy element which visually fills the space as long as the actual panel is sticky. It prevents flickering of the UI.

  • _hasViewportTopOffset : Boolean

    protected readonly observable

    Set true if the sticky panel uses the viewportTopOffset, i.e. not _isStickyToTheLimiter and the viewportTopOffset is not 0.

  • _isStickyToTheLimiter : Boolean

    protected readonly observable

    Set true if the sticky panel reached the bottom edge of the limiterElement.

  • _limiterRect : Object

    protected

    The DOM bounding client rect of the limiterElement of the panel.

  • _marginLeft : String

    protected readonly observable

    Controls the margin-left CSS style of the panel.

  • _panelRect : Object

    protected

    The DOM bounding client rect of the element of the panel.

Methods

  • constructor()

  • render()

  • _checkIfShouldBeSticky()

    protected

    Analyzes the environment to decide whether the panel should be sticky or not.

Events

  • change:_hasViewportTopOffset( eventInfo, name, value, oldValue )

    protected

    Fired when the _hasViewportTopOffset property changed value.

    Parameters

    eventInfo : EventInfo

    An object containing information about the fired event.

    name : String

    Name of the changed property (_hasViewportTopOffset).

    value : Boolean

    New value of the _hasViewportTopOffset property with given key or null, if operation should remove property.

    oldValue : Boolean

    Old value of the _hasViewportTopOffset property with given key or null, if property was not set before.

  • change:_isStickyToTheLimiter( eventInfo, name, value, oldValue )

    protected

    Fired when the _isStickyToTheLimiter property changed value.

    Parameters

    eventInfo : EventInfo

    An object containing information about the fired event.

    name : String

    Name of the changed property (_isStickyToTheLimiter).

    value : Boolean

    New value of the _isStickyToTheLimiter property with given key or null, if operation should remove property.

    oldValue : Boolean

    Old value of the _isStickyToTheLimiter property with given key or null, if property was not set before.

  • change:_marginLeft( eventInfo, name, value, oldValue )

    protected

    Fired when the _marginLeft property changed value.

    Parameters

    eventInfo : EventInfo

    An object containing information about the fired event.

    name : String

    Name of the changed property (_marginLeft).

    value : String

    New value of the _marginLeft property with given key or null, if operation should remove property.

    oldValue : String

    Old value of the _marginLeft property with given key or null, if property was not set before.

  • change:isActive( eventInfo, name, value, oldValue )

    Fired when the isActive property changed value.

    Parameters

    eventInfo : EventInfo

    An object containing information about the fired event.

    name : String

    Name of the changed property (isActive).

    value : Boolean

    New value of the isActive property with given key or null, if operation should remove property.

    oldValue : Boolean

    Old value of the isActive property with given key or null, if property was not set before.

  • change:isSticky( eventInfo, name, value, oldValue )

    Fired when the isSticky property changed value.

    Parameters

    eventInfo : EventInfo

    An object containing information about the fired event.

    name : String

    Name of the changed property (isSticky).

    value : Boolean

    New value of the isSticky property with given key or null, if operation should remove property.

    oldValue : Boolean

    Old value of the isSticky property with given key or null, if property was not set before.

  • change:limiterBottomOffset( eventInfo, name, value, oldValue )

    Fired when the limiterBottomOffset property changed value.

    Parameters

    eventInfo : EventInfo

    An object containing information about the fired event.

    name : String

    Name of the changed property (limiterBottomOffset).

    value : Number

    New value of the limiterBottomOffset property with given key or null, if operation should remove property.

    oldValue : Number

    Old value of the limiterBottomOffset property with given key or null, if property was not set before.

  • change:limiterElement( eventInfo, name, value, oldValue )

    Fired when the limiterElement property changed value.

    Parameters

    eventInfo : EventInfo

    An object containing information about the fired event.

    name : String

    Name of the changed property (limiterElement).

    value : HTMLElement

    New value of the limiterElement property with given key or null, if operation should remove property.

    oldValue : HTMLElement

    Old value of the limiterElement property with given key or null, if property was not set before.

  • change:viewportTopOffset( eventInfo, name, value, oldValue )

    Fired when the viewportTopOffset property changed value.

    Parameters

    eventInfo : EventInfo

    An object containing information about the fired event.

    name : String

    Name of the changed property (viewportTopOffset).

    value : Number

    New value of the viewportTopOffset property with given key or null, if operation should remove property.

    oldValue : Number

    Old value of the viewportTopOffset property with given key or null, if property was not set before.