I'm trying to open a Menu swiping to the left. On Chrome it works fine, but on my mobile (nexus 5) it just doesn't work.
Someone, could help me with this issue please?
The program is written above.
Thanks very much.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Menu Test</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<script src="js/jquery.js"></script>
<script src="js/jquery.mobile-1.4.5.min.js"></script>
<link rel="stylesheet" href="css/jquery.mobile.css" />
<script>
$( document ).on( "pageinit", "#home", function() {
$( document ).on( "swipeleft swiperight", "#home", function( e ) {
if ( $.mobile.activePage.jqmData( "panel" ) !== "open" ) {
if ( e.type === "swipeleft" ) {
$( "#right-panel" ).panel( "open" );
} else if ( e.type === "swiperight" ) {
$( "#left-panel" ).panel( "open" );
}
}
});
});
</script>
</head>
<body>
<div data-role="page" data-theme="a" class="jqm-demos ui-responsive-panel" id="home" data-title="Home" data-url="Home">
<div data-role="header" data-position="fixed">
<h1>Menu Test</h1>
</div><!-- /header -->
<div role="main" class="ui-content jqm-content jqm-fullwidth">
<p> TEST </P
</div>
<!--MENU-->
<div data-role="panel" id="left-panel" data-display="push" data-position="left" data-theme="c">
<ul data-role="listview">
<li> Main Menu </li>
<li><a href="#home" data-transition="turn">Home</a></li>
<li><a href="#test" data-transition="turn">test</a></li>
<li><a href="#test2" data-transition="turn">test2</a></li>
</ul>
</div>
</div>
</body>
Aucun commentaire:
Enregistrer un commentaire