PopOver Overview
The Hybrid UI PopOver widget represents a transient view which is displayed when the user taps on a navigational widget or area on the screen. It can contain one or more mobile views which can be navigated to, if needed.
Getting Started
The Kendo UI mobile Application automatically instantiates a mobile PopOver for each div element with a role data-attribute set to popover. Alternatively, it can be initialized using jQuery plugin syntax in the containing mobile View init event handler.
Instantiate the PopOver
The Mobile PopOver widget can be opened when any mobile navigational widget, such as a ListView link item, Button, and TabStrip among others, is tapped. To do so, add the data-rel="popover" attribute and a href attribute equal to the PopOver id to the navigational widget DOM element, prefixed with #, like an anchor.
<div data-role="view">
<a data-role="button" href="#foo" data-rel="popover">Say Hello</a>
<div id="foo" data-role="popover">
<div data-role="view">
Hello world!
</div>
</div>
</div>
The Mobile PopOver widget implicitly instantiates a Pane widget for its contents, which allows the containing views to navigate to each other. The Pane widget behavior, including default transition, layout, and other features, may be configured from the pane configuration option.
Configure the PopOver
The dimensions and direction of the Popover can be configured from the popup configuration option.