Menu
I am making a website using jQuery Mobile.
How to keep jquery mobile header and footer fixed? I just want only the content to scroll(just like it happens in iPhone applications), and keep the headers and footers fixed at top and bottom.
Any suggestions ?
222
Answer: Use CSS fixed positioning You can easily create sticky or fixed header and footer using the CSS fixed positioning. Simply apply the CSS position property with the value fixed in combination with the top and bottom property to place the element on the top or bottom of the viewport accordingly.
(Older devices with browsers that don't understand HTML5 will safely ignore the 'doctype' and various custom attributes.) In the 'head', references to jQuery, jQuery Mobile and the mobile theme CSS are all required to start things off. In short, yes, jQuery core is required. Show activity on this post.
jQuery Mobile CDN: The viewport <meta> tag inside the <head> element specifies how the browser should control the page zoom level and dimensions.
Add this attribute to your header/footer div:
<div data-role="header" data-position="fixed"> <h1>Header Page 1</h1> </div> Also, you might have a look at this: http://jquerymobile.com/test/docs/toolbars/footer-persist-a.html
142
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
