CODEWITHSUNDEEP
jquery-mobile
Bram W.
Bram W.

Reputation: 1607

Hide header and/or footer when no scrollbar is present

In the jQuery Mobile documentation, I found the following code:

$("[data-position='fixed']").fixedtoolbar('show');
$("[data-position='fixed']").fixedtoolbar('hide');
$("[data-position='fixed']").fixedtoolbar('toggle')

The goal of this is to either hide or show the header and/or footer of a page.

After some testing and experimenting, I've found that this code only works when the content on your page is big enough to get a vertical scrollbar on the page.

For my project, I'll need to be able to hide and/or show the header and footer of pages that don't have a scrollbar (either because there is not enough content, or because of a custom scrollbar plugin). Does anybody know how to achieve this, using a minimum of extra CSS/JavaScript? Thank you.

Upvotes: 0

Views: 493

Answers (1)

Aravind
Aravind

Reputation: 320

     $("div:jqmData(role='footer')").show();
     $("div:jqmData(role='footer')").hide();

Or simply use the id of the footer and use .show() or .hide()

Hope it helped

Upvotes: 1

Related Questions