How to solve the problem of jQuery mobile's header and footer disappearing when the screen is clicked-JS Tutorial-php.cn

How to solve the problem of jQuery mobile's header and footer disappearing when the screen is clicked

不言

Release： 2018-06-28 14:26:24

Original

1892 people have browsed it

This article mainly introduces the solution for the header and footer of jQuery mobile to disappear when clicking the screen. This is accomplished by adding data-position="fixed" and data-tap-toggle="false" to the header and footer. The function is very good and has reference value. Friends who need it can refer to it

Introduction to jQuery Mobile

##jQuery Mobile is created Framework for mobile web applications.

jQuery Mobile works on all popular smartphones and tablets.

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

Just add data-position="fixed" and data-tap-toggle="false" to the header and footer. The code is as follows:

<p data-role="footer" data-position="fixed" data-tap-toggle="false">
<p data-role="navbar">
<ul>
<li><a onclick="app.show(&#39;pgJgbfMain&#39;,&#39;pgJgbfXq&#39;)">门店详情</a></li>
<li><a onclick="app.show(&#39;pgTgbf&#39;,&#39;pgJgbfXq&#39;)">备忘登记</a></li>
<li><a onclick="app.show(&#39;pgTgbf&#39;,&#39;pgJgbfXq&#39;)">退货</a></li>
<li><a onclick="app.show(&#39;pgTgbf&#39;,&#39;pgJgbfXq&#39;)">换货</a></li>
</ul>
</p> 
</p>
<!-- footer end -->

Copy after login

PS:jquery mobile cancels the header and footer and clicks to hide them

The header and footer are on the upper and lower floating bars. The default is true. Click The page will disappear and click again to display

To cancel this function

Method 1: Add

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

Copy after login

to the HTML tag

Method 2: Join jQeury

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

Copy after login

The above is the entire content of this article, I hope it will be helpful to everyone’s learning. For more related content, please pay attention to the PHP Chinese website!

Related recommendations:

About the analysis of how to use the jquery UI Datepicker time control

About jQuery plug-in Validate to implement customization Code for verification result style

The above is the detailed content of How to solve the problem of jQuery mobile's header and footer disappearing when the screen is clicked. For more information, please follow other related articles on the PHP Chinese website!