jQuery con javascript

que estoy tratando de evitar el uso de esto para la pantalla de bienvenida, ya que no funciona en todos los dispositivos y por otras razones:jQuery con javascript

<link rel="apple-touch-startup-image" href="img/splash.png" />

Así que estoy tratando de utilizar este en su lugar y funciona bien hasta que se deslice en una nueva página, que luego se trata como la pantalla de bienvenida de nuevo (por ejemplo se queda en blanco cuando expira el temporizador - en este caso 4 segundos). ¿Cómo puedo detener/restringir este comportamiento, de modo que changePage permanezca contenido en la página de presentación solamente?

<body> 
<div data-role="page" id="splash"> 
    <div class="splash"> 
    <img src="startup.jpg" alt="startup image" /> 

<script type='text/javascript'>//<![CDATA[ 
      $(window).load(function(){ 
      $(function() { 
       setTimeout(hideSplash, 4000); 
         }); 

      function hideSplash() { 
      $.mobile.changePage("#home", "fade"); 
      } 


      });//]]> 
     </script> 

    </div> 
</div> 

<div data-role="page" id="home"> 
    <div data-role="header" data-backbtn="false"> 
    <h1></h1> 
    </div> 
    <div data-role="content"> 

    </div> 
</div> 
</body>

Fuente

2012-05-26 user1418581

<link rel="apple-touch-startup-image" href="img/splash.png" />

es de hecho sólo para los dispositivos móviles de Apple.

Una pantalla de bienvenida real solo debe estar allí para mostrarle una buena imagen mientras está esperando. Su objetivo no es hacerte esperar por un motivo real. En su caso, está sacando 4 segundos de la vida de sus usuarios solo para que se vea bien.

he modificado el código y ponerlo en este jsfiddle: verás que funciona ahora. Para que la pantalla secundaria tome todo el ancho/alto, edite css para eliminar los márgenes. Configuré el temporizador en 2, eso es más que suficiente, creo.

Fuente

2012-05-26 08:41:26 chrisben

que 4 segundos, aunque sería genial desde un punto de vista de la marca y también para que se siente aplicación web un poco más nativo. Ah, y por cierto, el método .live() está en desuso. Hay una serie de problemas conocidos con eso. Ver http://api.jquery.com/live/ – codaniel

Gracias por sus comentarios - muy apreciados. – user1418581

buena idea aquí es lo que estoy pensando. Use páginas individuales en lugar de páginas múltiples (función de datos múltiples = página). Para index.html o index.php o lo que sea. Pon tu página de bienvenida. El motivo de esto lo explicaré más adelante.

index.html

<head> 
    <!-- First include all jquery stuff --> 
    <script src="app.js"></script><!-- external script because we can just include it in every page --> 
</head> 
<body> 
    <div data-role="page" id="splash"> 
     <div class="splash"> 
      <img src="startup.jpg" alt="startup image" /> 
     </div> 
    </div> 
</body>

app.js

$(document).on('pageinit','#splash',function(){ // the .on() method does require jQuery 1.7 + but this will allow you to have the contained code only run when the #splash page is initialized. 
    setTimeout(function(){ 
     $.mobile.changePage("home.html", "fade"); 
    }, 4000); 
});

Ok, así que han hecho durante esta manera porque digamos que usted tiene menú de navegación y que desea enviar personas a la página de inicio. No tendrá que volver a mostrar la página de presentación. Solo puedes vincular a home.html. También dividir sus páginas ayuda a mantener dom domner. Espero que esto ayude.

Fuente

2012-05-26 10:25:43 codaniel

Gracias por sus comentarios codaniel. Muy útil. – user1418581

Funciona bien con una sola página también – JamesC

Respuesta

Cuestiones relacionadas