# Scroll Modes

By default, the `height` of the ListView depends on its content and its `width` is determined by the available space or parent DOM element. To enable scrolling, you should define a fixed height that is less than the height of the ListView content.

The ListView provides two types of scrolling modes:

* [Default Scrolling](https://www.telerik.com/kendo-vue-ui-develop/components/listview/scroll-modes#default-scrolling) - Suitable for scenarios with a smaller number of data items. In this mode, all ListView data items are pre-rendered.
* [Endless Scrolling](https://www.telerik.com/kendo-vue-ui-develop/components/listview/scroll-modes#endless-scrolling) - Suidable for scenarios with a lot of data. In this mode, all component's items are dynamically loaded based on the user's scrolling.

## Default Scrolling

The following example demonstrates the ListView's default scrolling mode in action. In this scenario, the `height` and `width` of the component are set with an inline style but the same can be implemented through a custom CSS class.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/listview/default-scrolling/source.txt)

## Endless Scrolling

The Kendo UI for Vue ListView can achieve `endless scrolling` allowing to dynamically display large collection of items.

The following example demonstrates the ListView that dynamically adds more items while the user scrolls, using the [onScroll event](https://www.telerik.com/kendo-vue-ui-develop/components/listview/api/listviewprops#onScroll).

[Demo Source](https://demos.telerik.com/kendo-vue-ui/listview/endless-scrolling/source.txt)

## Suggested Links

* [ListView Paging](https://www.telerik.com/kendo-vue-ui-develop/components/listview/paging)
* [API Reference of the ListView](https://www.telerik.com/kendo-vue-ui-develop/components/listview/api/listviewprops)