jQuery Mobile - Toolbar

To enhance both headers and footers you can use toolbar widget.

Following table lists different types of toolbar used in jQuery Mobile −

Sr.No.	Toolbar Type & Description
1	Markup It contains toolbars like header that appears at the top and footer that appears at bottom of the page.
2	Theme The theme swatch will be inherited by the header and footer toolbar from the page by default; however you can set the color of the theme swatch easily.
3	Buttons in toolbars Buttons can be positioned on toolbars using ui-btn-left and ui-btn-right classes.
4	Adding back button to header jQuery mobile framework generates a back button on a header when the header has a data-add-back-btn = "true" attribute.
5	Navbars You can use navigation bars inside the header and footer toolbars.
6	Grouped buttons You can use data-role = "controlgroup" and data-type = "horizontal" attributes to group buttons into a set of button and wrap the links within an element.
7	Adding padding The toolbars will not have any padding for navbars and other widgets. To add padding, you can wrap content of the toolbars inside an element and add ui-bar class to the element.

jquery_mobile_widgets.htm

Kickstart Your Career

Get certified by completing the course

Advertisements