UI Mobile Lien dans la page
Bonjour,
je souhaite pouvoir en cliquant sur un lien, aller dans une section de la page, mais quand je clique sur "Afficher la page "deux" (id="deux"), rien ne se passe...
Merci d'avance.
Mon code :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58
| <!DOCTYPE html>
<html class="ui-mobile" lang="fr">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Modèle de page jQuery Mobile</title>
<link rel="stylesheet" href="css/jquery.mobile.structure-1.0rc3.min.css">
<link rel="stylesheet" href="css/jquery.mobile.structure-1.0rc3.css">
<link rel="stylesheet" href="css/jquery.mobile-1.0rc3.css">
<link rel="stylesheet" href="css/jquery.mobile-1.0rc3.min.css">
<link rel="stylesheet" href="css/jquery.mobile-1.0rc3.structure.min.css">
<script type="text/javascript" src="js/jquery.mobile-1.0rc3.js"></script>
<script type="text/javascript" src="js/jquery.mobile-1.0rc3.min.js"></script>
</head>
<body class="ui-mobile-viewport">
<div style="min-height: 506px;" class="ui-page ui-body-c ui-page-active" tabindex="0" data-url="debut" data-role="page" id="debut">
<div role="banner" class="ui-header ui-bar-a" data-role="header">
<h1 aria-level="1" role="heading" tabindex="0" class="ui-title">MENU</h1>
</div><!-- /header -->
<div role="main" class="ui-content" data-role="content" id="une"><!-- DEBUT page Une -->
<h2>Page Une</h2>
<p>Contenu de la première page chargée !...Contenu de la première page chargée !...Contenu de la première page chargée !...</p>
<h3>Afficher les pages internes :</h3>
<p><a class="ui-btn ui-btn-corner-all ui-shadow ui-btn-up-c" data-theme="c" href="#deux" data-role="button">
<span aria-hidden="true" class="ui-btn-inner ui-btn-corner-all"><span class="ui-btn-text">Afficher la page "deux"</span></span></a></p>
<p><a class="ui-btn ui-btn-up-c ui-btn-corner-all ui-shadow" data-theme="c" href="#popup" data-role="button" data-rel="dialog" data-transition="pop">
<span aria-hidden="true" class="ui-btn-inner ui-btn-corner-all"><span class="ui-btn-text">Afficher la page "popup" (comme un dialogue)</span></span></a></p>
</div><!-- FIN page Une -->
<div role="contentinfo" class="ui-footer ui-bar-d" data-role="footer" data-theme="d">
<h4 aria-level="1" role="heading" tabindex="0" class="ui-title">Pied de page</h4>
</div><!-- /footer -->
</div>
<div data-url="deux" data-role="page" id="deux" data-theme="a"><!-- DEBUT page deux -->
<div data-role="header"><h1>Page Deux</h1></div>
<p>Contenu de la deuxième page affichée ensuite !...Contenu de la deuxième page affichée ensuite !...Contenu de la deuxième page affichée ensuite !...</p>
<div data-role="content" id="deux" data-theme="a">
<h2>Page Deux</h2>
<p><a href="#une" data-direction="reverse" data-role="button" data-theme="b">Retourner à la page "une"</a></p>
</div><!-- /content -->
<div data-role="footer"><h4>Pied de page</h4></div>
</div><!-- FIN page deux -->
<div data-url="popup" data-role="page" id="popup"><!-- DEBUT Page popup -->
<div data-role="header" data-theme="e"><h1>Page Dialogue</h1></div>
<div data-role="content" data-theme="d">
<h2>Popup</h2>
<p>Contenu de la page en popup !...Contenu de la page en popup !...Contenu de la page en popup !...</p>
<p><a href="#une" data-rel="back" data-role="button" data-inline="true" data-icon="back">Retourner à la page "une"</a></p>
</div><!-- /content -->
<div data-role="footer"><h4>Pied de page</h4></div>
</div><!-- FIN page popup -->
</body>
</html> |