Kendo UI for jQuery ScrollView Overview
The Hybrid UI ScrollView widget scrolls content that is wider than the mobile device screen.
The Hybrid Application by Kendo UI automatically initializes the mobile ScrollView for every element with role data attribute set to scrollview and present in the markup of the views. Alternatively, it can be initialized by using jQuery plugin syntax in the containing mobile View init event handler.
The Hybrid ScrollView supports two operation modes—standard and data-bound. The first one is suitable for displaying static content, while the second one provides remote data virtualization. If the ScrollView has a DataSource set during the initialization, it operates in a data-bound mode.
The ScrollView is part of Kendo UI for jQuery, a
professional grade UI library with 110+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.
Initializing the Hybrid ScrollView
The following example demonstrates how to initialize the Hybrid UI ScrollView by using the data-role attribute.
<div data-role="scrollview">
Foo
</div>
The following example demonstrates how to initialize the Hybrid UI ScrollView by using jQuery plugin syntax.
<div data-role="view" data-init="initScrollView">
<div id="scrollView">
<div data-role="page">Foo</div>
<div data-role="page">Bar</div>
</div>
</div>
<script>
function initScrollView(e) {
e.view.element.find("#scrollView").kendoMobileScrollView();
}
</script>