Help with pages
Help with pages
Hello I have two pages, the first is multipage, and have a menu to two pages more extremos .html, and consejos.html,My problem is that one of these is called extremos.html html, when I using geolocation does not display the map, and when I running it as a single page this draw the map without problems, checking with the developer tools I note that clicking the link and open this page does not delete the data that functions as the index page, like javascripts,images,etc. and that is the reason because the map is not drawn, I place the link to the page as rel="external" and the footer , moves upward through, my question is how I clear the data when I linked to another page? attach I sent to you the code:
- Index.html
- <body>
- <div data-role="page" id="home" data-theme="c">
- <div data-role="header" data-theme="c">
- <h1>Viajando sin papel Higienico </h1>
- </div>
- <div data-role="content">
- <div id="logo"style="text-align: center;">
- <img src="images/logo.gif" id="img-logo" width="200" alt="Logo">
- <script>
- var a = alice.init();
-
- a.slide(["img-logo"], "left", 0, "3000ms", "ease", "10ms", "1", "alternate", "running");
-
-
- </script>
-
- </div>
- <div class="ui-grid-a"><!--cree un grid-->
- <div class="ui-block-a">
- <div data-role="controlgroup" data-theme="d">
- <a href="consejos.html" data-role="button" >Consejos a Mochileros</a></li>
- <a href="#galeria"data-role="button" >Galería</a>
- <a href="#" data-role="button" >Comidas exóticas</a>
- <a href="#" data-role="button" >100 cosas por hacer</a>
- <a href="extremos.html" data-role="button" >Deportes extremos</a>
- </div>
+++++++++
- extremos.html
- <!DOCTYPE HTML>
- <head>
- <meta charset="<html>
- utf-8">
- <title>Extremos</title>
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
- <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" />
- <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
- <script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>
- <link href="css/vsph.css" rel="stylesheet" type="text/css" />
- <style>
- .ui-page, .ui-body-d, .ui-body-d input, .ui-body-d select {
- background: url("images/arches.png") repeat;
- }
- </style>
- <style >
- html,#geo,#geomap {height: 100%}
- body {height: 100%;margin: 0;padding: 0}
- </style>
-
- </head>
- <body>
- <div data-role="page" id="extremos" data-title="Extremos"data-add-back-btn="true" data-back-btn-text="Atrás" data-theme="c">
- <div data-role="header" data-theme="c">
- <h1>Encuentra tu extremo</h1>
- </div>
- <div data-role="content">
- <div style="text-align: center;">
- <div id="geo">
- <button id="see_position">Usar tu ubicación</button>
- <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
- <p id="tracking"><span id="status"></span></p>
- <div id="geo_log"></div>
- <div id="geo_map"></div>
- </div>
- <script src="js/geo.js" async defer></script>
- </div>
-
- <div data-role="footer" data-position="fixed" data-id="nav" data-theme="c">
- <div data-role="navbar">
- <ul>
- <li><a href="index.html#home" class="ui-btn-active ui-state-persist"data-icon="home">Inicio</a></li>
- <li><a href="#index.html#acerca" data-icon="info">Acerca de mi</a></li>
- <li><a href="index.html#contact" data-icon="star">Contacto</a></lid </ul>
- </div>
- </div>
- </div>
- </body>