Hola, estoy iniciando el primer proyecto con html5 / jquery mobile / jquery.
La idea es utilizar el framework phonegap, por lo que inicie el desarrollo para android siguiendo los pasos de instalacion indicados (
http://docs.phonegap.com/en/1.9.0/gu...with%20Android). En principio no tengo problemas con esa parte, ya que logro emular en android el Hola mundo.
Luego utilice Codiqa para armar la estructura que quiero tenga mi aplicacion (
www.codiqa.com). Pero al utilizar el codigo generado, no logro el comportamiento que si veo en al generarlo (que los links de los botones muestren cada pagina con su contenido).
Les copio el codigo, donde no encuentro el problema:
<!DOCTYPE HTML>
<html>
<head>
<title>Ranking Metro E 2012</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/jquery.mobile-1.1.0.min.css" />
<link rel="stylesheet" href="css/my.css" />
<link rel="stylesheet" href="css/estilo.css" />
<script type="text/javascript" src="js/cordova-1.9.0.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/jquery.mobile-1.1.0.min.js"></script>
<script type="text/javascript" src="js/my.js"></script>
</head>
<body>
<!-- Ranking Metro E 2012 -->
<div data-role="page" id="page1" style="background: url('img/pasto.jpg') repeat">
<div data-role="content" style="padding: 15px">
<a data-role="button" data-direction="reverse" data-rel="back" data-transition="fade"
data-theme="d" href="#equipo">
Tu Ubicación
</a>
<a data-role="button" data-direction="reverse" data-rel="back" data-transition="turn"
data-theme="d" href="#ranking">
Tabla General
</a>
<a data-role="button" data-direction="reverse" data-rel="back" data-transition="turn"
data-theme="d" href="#info">
Información
</a>
<a data-role="button" data-direction="reverse" data-rel="back" data-transition="turn"
data-theme="d" href="#salir">
Salir
</a>
</div>
</div>
<!-- equipo -->
<div data-role="page" data-theme="d" id="equipo" style="background: url('img/pasto.jpg') repeat">
<div data-theme="c" data-role="header">
<h3>
Header
</h3>
</div>
<div data-role="content" style="padding: 15px">
<div>
<p>
<b>
contenido
</b>
</p>
</div>
<div data-role="collapsible-set" data-theme="" data-content-theme="">
<div data-role="collapsible" data-collapsed="">
<h3>
Section Header
</h3>
<div>
<p>
<b>
<span data-mce-bogus="true" id="_mce_caret">
<span style="background-color: rgb(255, 255, 255); color: rgb(0, 0, 0);">
</span>
</span>
Enter content here...
</b>
</p>
</div>
</div>
</div>
<a data-role="button" data-transition="fade" data-theme="d" href="#page1">
Inicio
</a>
</div>
<div data-theme="d" data-role="footer" data-position="fixed">
<h3>
Footer
</h3>
</div>
</div>
</body>
</html>
Muchas gracias por su tiempo y ayuda.