The Drawer widget

The Drawer widget, commonly known as the Facebook-style side menu, was introduced in the 2013 Q2 release of Kendo UI. This menu style has nowadays turned into a standard for any mobile application that has a lot of content and a complex navigation stack.

The Drawer widget can be initialized by setting the data-role="drawer" attribute to a div element. By default, the widget appears from the left side on a left-to-right swipe. The drawer can be made to slide in from right to left, by setting the position data attribute to right:

data-position="right";

The drawer slides back in when we navigate to another view or an opposite swipe gesture is done by the user. The widget also supports adding a custom header and footer; this feature is optional.

Let's now implement a drawer containing a ListView, which slides in from right to left:

<div data-role="drawer" id="right-drawer"
     data-position="right" >
    <ul data-role="listview" data-type="group">
        <li&gt...