scrollable Boolean|Object (default: false)

If enabled, the Menu displays buttons that scroll the items when they cannot fit the width or the popups' height of the Menu. By default, scrolling is disabled.

The following example demonstrates how to enable the scrolling functionality.

Example

<ul id="menu" style="width:150px;">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
</ul>

<script>
    $("#menu").kendoMenu({
        scrollable: true
    });
</script>

scrollable.distance Number (default: 50)

Sets the scroll amount (in pixels) that the Menu scrolls when the scroll buttons are hovered. Each such distance is animated and then another animation starts with the same distance. If clicking a scroll button, the Menu scrolls by doubling the distance.

Example

<ul id="menu" style="width:150px;">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
</ul>

<script>
    $("#menu").kendoMenu({
        scrollable: {
            distance: 20
        }
    });
</script>