2012-04-23 16 views
6

Şu anda bir öğeyi tıklattığınızda farklı videoları oynatmak için bir sayfada çalışıyorum. Bilgisayarda çok güzel çalışırken, iOS cihazlarda değil. Problem şu ki, bu durumda, bir buton tıklandığında, videoyu gösterir, ancak oynatılmaya başlamaması gerektiği gibi. komutiOS5 için tıklatmayla çoklu html5 video başlangıç ​​yapın

$(document).ready(function(){ 
$('#video_1, #video_2').hide(); 

     $('.icon_1').click(function(){ 
      $('#video_2').fadeOut(function(){ 
      $('#video_1').fadeIn(); 
      }); 
     }); 

     $('.icon_2').click(function(){ 
      $('#video_1').fadeOut(function(){ 
      $('#video_2').fadeIn(); 
      }); 
     }); 

$('.icon_1').click(function(){ 

      $('.video_2').get(0).pause(); 
      $('.video_2').get(0).currentTime = 0; 
      $('.video_1').get(0).play(); 

     }); 

$('.icon_2').click(function(){ 
      $('.video_1').get(0).pause(); 
      $('.video_1').get(0).currentTime = 0; 
      $('.video_2').get(0).play(); 

     }); 
      }); 

olduğunu ve html

<button><div class="icon_1" id="mediaplayer" onclick="play">cadillac</div></button> 
<button><div class="icon_2" id="mediaplayer2" onclick="play">nike</div></button> 

<div id="video_1"> 
<video class="video_1" width="50%" height="50%" controls poster="http://www.birds.com/wp-content/uploads/home/bird.jpg" >  
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type="video/mp4" /> 
</video> 
</div> 

<div id="video_2"> 
<video class="video_2" width="50%" height="50%" controls poster="images/BKG_JohnGT.png"> 
<source src="images/01.mp4" type="video/mp4" /> 
</video> 
​</div> 

Herkesin bana bunun mak olabilecek bir işlev verebilir, tht iyi olurdu olduğunu

+0

Sanırım iOS mobil cihazında video öğesini tıklamanız gerekiyor. – Neil

cevap

3

iOS birden çok videodan desteklemiyor bir seferde bir sayfada öğe. Size bir hata mesajı bile vermiyor - sadece poster görüntüsünü (veya ilk kareyi) gösterecek ve daha sonra betimlediğiniz gibi oynamamaktadır.

Ne yazık ki, gerçek bir çapraz geçiş yapamazsınız, ancak yakın gelebilirsiniz. DOM'a bağlı yalnızca bir video öğesiyle başlayın. Bir videodan diğerine geçerken, mevcut videonun dışına çıkabilirsiniz, ardından bittiğinde onu kaldırın ve ikinci videoyu ekleyin. Apple, bunun nasıl yapılacağı konusunda bazı details and code samples sağladı.

Teorik olarak, video karesinin bir tuvalde anlık görüntüsünü yakalayabilmeli ve video için bunu değiştirip tuvalin dışına çıkabilmelisiniz, ancak iOS da tuvalde video karelerini yakalamayı desteklemiyor. Bu ve diğer bazı standart dışı davranışlar this article numaralı belgede iyi tanımlanmıştır.