Why does my jQuery Mobile footer appear and then disappear when the user clicks the background?

I have a footer on my jQuery Mobile website.

<div data-role="footer" data-position="fixed"> <div data-role="navbar"> <ul> <li><a href="/page1">Page 1</a></li> <li><a href="/logout">Logout</a></li> </ul> </div> </div> 

In Google Chrome, when the user clicks on the background, the footer disappears. When the user clicks on the background again, a footer appears. What for? Is this an intentional function?

+4
source share
2 answers

By default, this is enabled. Here is the code you can disable in JQM v 1.1-RC1

 $(document).on('pageinit','[data-role=page]', function(){ $('[data-position=fixed]').fixedtoolbar({ tapToggle:false}); }); 

I like to bind it to the taphold event. That makes more sense to me. Here's how to do it:

 $(document).on('taphold', '[data-role=page]', function(){ $('[data-position=fixed]').fixedtoolbar('toggle'); }); 

If you use JQM v 1.0.1, then you cannot use the .on () method. The on method is new with respect to jquery 1.7. Using .delegate () is recommended for .live (), so do the following:

 $(document).delegate('[data-role=page]','pageinit', function(){ $.mobile.fixedToolbars.setTouchToggleEnabled(false); }); 
+10
source

A simple solution is to add the following attribute to your header:

 data-tap-toggle="false" 

... and the structure will take care of this for you.

See "Toolbar Widget" for details.

+9
source

Source: https://habr.com/ru/post/1403983/


All Articles