2013-03-01 8 views
8

Ho una pagina Web che "riproduce un video" utilizzando fogli sprite. La pagina è ottimizzata per dispositivi mobili, quindi può essere caricata su WebViews per Android e iOS. Mi piacerebbe sapere quando la pagina è visibile, quindi solo dopo posso riprodurre il video. Non voglio che gli utenti catturino il video mid-stream perché la WebView si ritarda nel presentarsi.Come scoprire se WebView è visualizzato/su schermo/visibile utilizzando JavaScript

Riesco a vedere alcuni sviluppatori potrebbero attendere fino a quando l'intera pagina non ha completato l'estrazione di tutte le risorse dalla pagina prima di renderla visibile all'utente. Quindi, non voglio che il "video" inizi prima di quel momento. Non posso fare affidamento su window.onload perché quell'evento si attiva anche quando WebView non è visibile o sullo schermo.

Come posso realizzare questo dal lato client, con qualche JavaScript, preferibilmente?

[Modifica] Per essere chiari, sto insinuando che non ho alcun controllo sul WebView nativo. È possibile caricare pagine Web in una WebView che non è sullo schermo e spingere la vista o aggiungerla al layout su schermo in un secondo momento. Il mio problema è che quando l'URL della mia pagina web viene caricato in una WebView, non posso dire quando WebView viene visualizzato sullo schermo.

+2

Hai provato jQuery $ (document) .ready (function() {// code per mostrare il video}); – Stiger

+1

come una semplice correzione, vorrei solo aggiungere un leggero ritardo per l'animazione usando 'setTimeout()' – kennypu

+1

Hmm, non sto usando jQuery affatto. È una buona idea includere quella libreria solo per quella funzione 'ready'? Qual è il normale ol 'equivalente JavaScript? – user2122422

risposta

2

Dai uno sguardo allo Safari Web Content Guide. Scorri verso il basso fino alla tabella degli eventi supportati. Sto pensando (o sperando) che l'evento pageshow farà ciò che speri. C'è anche l'evento focus.

Sembra che l'utilizzo di questi eventi per Safari mobile sarebbe facile come

<body onpageshow="onPageShow();"> 

sono meno familiarità con Android, ma lo farò esaminare il problema reale veloce.

EDIT: La soluzione onpageshow dovrebbe funzionare allo stesso modo in Android 2.2 e soprattutto come fa in iOS 4.0 e superiori. Per quanto riguarda il fatto che funzioni nel modo in cui ne hai bisogno, non ne sono del tutto sicuro. Fammi sapere!

+0

Grazie per la risposta ! Non ho avuto la possibilità di testare, ma riferirò con risultati quando lo faccio. Grazie ancora – user2122422

1

Non è possibile controllare la visualizzazione Web utilizzando JavaScript. Se non è troppo tardi per modificare il design dell'app, l'utilizzo di API native ti darà un maggiore controllo della visualizzazione web.

È possibile inserire un timeout nella pagina Web prima di caricare il video. Potrebbe valerne la pena.

1

è possibile utilizzare phonegap libreria:

document.addEventListener("deviceready", onDeviceReady, false); 

function onDeviceReady() { 
    // Now safe to use the PhoneGap API 
} 

phonegap è molto buono per eventi maniglia e più azione in WebView.

Problemi correlati