Mixin: module:delite/Scrollable

module:delite/Scrollable

A mixin which adds scrolling capabilities to a widget. When mixed into a widget, this mixin brings scrolling capabilities based on the overflow: auto CSS property. By default, the scrolling capabilities are added to the widget node itself. The host widget can chose the node thanks to the property 'scrollableNode' which must be set at latest in its buildRendering() method. During interactive or programmatic scrolling, native "scroll" events are emitted, and can be listen as follows (here, 'scrollWidget' is the widget into which this mixin is mixed): 

scrollWidget.on("scroll", function () {
...
}
For widgets that customize the 'scrollableNode' property, the events should be listen on widget.scrollableNode.
Source:

Extends

Members

scrollableNode :DomNode

Designates the descendant node of this widget which is made scrollable. The default value is 'null'. If not set, defaults to this widget itself ('this'). Note that this property can be set only at construction time, at latest in the buildRendering() method of the widget into which this class is mixed.
Type:
  • DomNode
Default Value:
  • null
Source:

scrollDirection :string

The direction of the interactive scroll. Possible values are: "vertical", "horizontal", "both, and "none". The default value is "vertical". Note that scrolling programmatically using scrollTo() is possible on both horizontal and vertical directions independently on the value of scrollDirection.
Type:
  • string
Default Value:
  • "vertical"
Source:

Methods

isBottomScroll() → {boolean}

Returns true if container's scroll has reached the maximum at the top of the content. Returns false otherwise.
Source:
Returns:
Type
boolean

isTopScroll() → {boolean}

Returns true if container's scroll has reached the maximum at the top of the content. Returns false otherwise.
Source:
Returns:
Type
boolean
Example
scrollContainer.on("scroll", function () {
  if (scrollContainer.isTopScroll()) {
    console.log("Scroll reached the maximum at the top");
  }
}

scrollBy(by, duration)

Scrolls by the given amount.
Parameters:
Name Type Description
by object The scroll amount. An object with x and/or y properties, for example {x:0, y:-5} or {y:-29}.
duration number Duration of scrolling animation in milliseconds. If 0 or unspecified, scrolls without animation.
Source: