Solution for jQuery mobile header and footer to disappear when clicking on the screen

Introduction to jQuery Mobile

jQuery Mobile is the framework for creating mobile web applications.

jQuery Mobile is suitable for all popular smartphones and tablets.

jQuery Mobile uses HTML5 and CSS3 to lay out pages with as few scripts as possible.

Add data-position= "fixed" and data-tap-toggle= "false" to header and footer as follows:

<div data-role="footer" data-position="fixed" data-tap-toggle="false">
<div data-role="navbar">
<ul>
<li><a onclick="app.show('pgJgbfMain','pgJgbfXq')"> Store details </a></li>
<li><a onclick="app.show('pgTgbf','pgJgbfXq')"> Memo registration </a></li>
<li><a onclick="app.show('pgTgbf','pgJgbfXq')"> Return </a></li>
<li><a onclick="app.show('pgTgbf','pgJgbfXq')"> Exchange goods </a></li>
</ul>
</div> 
</div>
<!-- footer end --> 

PS: jquery mobile Cancel header and footer Click Hide

header and footer on the two floating bar, the default is true, click the page will disappear, click again will be displayed

To cancel this feature

Method 1: Add to the HTML tag

<div data-role="header" data-position="fixed" data-tap-toggle="false">
---content
</div>

Method 2: Add jQeury

$("div[data-role=header],div[data-role=footer]").fixedtoolbar({
tapToggle:false
});