In Code

The following tables gives an overview of scrolling-related methods exposed by the List.

Method Description
scrollHeight() Returns the height of the scrollable content in pixels.
scrollToItem(itemIndex) Scrolls the List to the item with a specific index.
scrollToItem(itemElement) Scrolls the List to a specific DOM node.
scrollTo(location) Scrolls the List to a location specified in pixels.
scrollBy(distance) Scrolls the List from the current location by a distance specified in pixels.
scrollTop() Returns a pixel-measured value that shows how far the List is scrolled from the top.

The following examples shows how to call these methods in code.

JavaScript
var list = $("#listContainer").dxList("instance");
var listItems = list.option("items");

// Scrolls the List to the last item
list.scrollToItem(listItems.length-1);

// Scrolls a grouped List to the first item of the last group
list.scrollToItem({
    group: listItems.length-1,
    item: 0
});
JavaScript
// Finds the DOM nodes of all items and scrolls the List to the last node
var listItemNodes = $("#listContainer").find(".dx-list-item");
list.scrollToItem(listItemNodes[listItemNodes.length-1]);

// Finds the DOM nodes of all groups and scrolls the List to the last node
var listGroupNodes = $("#listContainer").find(".dx-list-group");
list.scrollToItem(listGroupNodes[listGroupNodes.length-1]);
JavaScript
var contentHeight = list.scrollHeight();
var scrolledFromTopBy = list.scrollTop();
list.scrollTo(200);
list.scrollBy(100);
See Also