From the course: jQuery Mobile Essential Training

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Creating toolbars

Creating toolbars - jQuery Mobile Tutorial

From the course: jQuery Mobile Essential Training

Start my 1-month free trial

Creating toolbars

“

Up until now in the course we've been seeing toolbars used throughout the examples, but we haven't really spent any time talking about how to actually build them, so let's do that now. In jQuery Mobile, toolbars can be defined for both a header and a footer. And again, you've seen this. So to define a header and a footer, you simply have a couple of different sections of content that have a particular data attribute applied to them. So to define a header, I would have a container element, in this case it's a div, and I have an attribute named data-role equals header. And that will tell jQuery Mobile that this container is a header for the page. And similarly, for the footer, I do the same thing. I have a div, and again, I have data-role equals footer. So that's the simple way to declare toolbars, but toolbars can do more than that. Toolbars can also have controls in them. So, for example, if we have a header, and we want to put a button in it, we can do that. We can also have buttons…

Contents