2012-12-13 17 views
5

Sono abbastanza nuovo per le app mobili, quindi sto cercando di far cadere un semplice lettore video utilizzando PhoneGap e jQuery Mobile. Il problema è che jQuery mobile sembra bloccare la riproduzione del video per qualche motivo.Riproduzione video con jQuery Mobile e Phoneegap

Per risolvere il problema, l'ho rimosso direttamente nel seguente codice HTML, ma ottengo lo stesso risultato, ovvero un rettangolo nero in cui dovrebbe essere il video, ma non la riproduzione o i controlli video.

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <meta name="viewport" content="width=device-width,initial-scale=1"/> 
    <link rel="stylesheet" type="text/css" href="css/index.css" /> 
    <link rel="stylesheet" href="css/jquery.mobile-1.2.0.min.css" /> 
<script type="text/javascript" src="cordova-2.2.0.js"></script> 
    <script type="text/javascript" src="js/index.js"></script> 
    <script src="js/jquery-1.8.3.min.js"></script> 
    <script src="js/jquery.mobile-1.2.0.js"></script> 
    <title></title> 
</head> 
<body> 
    <div> 
     <video controls autoplay> 
      <source src="video/video1.mp4" type="video/mp4" > 
     </video> 
    </div> 
</body> 
</html> 

Se rimuovo il link al jquery.mobile-1.2.0.js il video si presenta e interpreta, in caso contrario, solo il rettangolo nero.

Non conosco affatto jQuery mobile, ma la ricerca in js per un riferimento agli elementi del video non viene visualizzata, quindi non ho idea di cosa lo stia bloccando.

Il codice funziona perfettamente in Chrome e Firefox. Non ci sono messaggi di console in Xcode. Ho anche provato a collegarmi a http://debug.phonegap.com/ ma questo non ha dato alcun messaggio di errore.

Qualche idea ??

risposta

0

Questo accade perché iOS blocca la riproduzione multimediale in linea. per iOS si dovrebbe aggiungere in seguito nel config.xml

<preference name="AllowInlineMediaPlayback" value="true"/> 

per ottenere il codice di lavoro. potrebbe essere necessario aggiungere webkit-playsinline nel vostro tag video per più dare un'occhiata a Config.xml cordova doc

potrebbe essere necessario impostare altri attributi come

MediaPlaybackRequiresUserAction(boolean) or MediaPlaybackRequiresUserAction(boolean) 

ottenere maggiori dettagli sulla loro a Config.xml cordova doc

Problemi correlati