2017-01-24 6 views
2

私は2週間解決できない問題があります。私は、ブートストラップのカルーセルをレンダリングするためにjQueryを使っています。それらのカルーセルで私は高品質のビデオをレンダリングします。そして、ヘッダにページビデオに多くのビデオ要素がある場合は、ロードを停止し、onAbortイベントをスローします。私の再生機能は、私が動的にjQueryを使ってビデオ要素を注入して問題を解決しplay()onabort iphone safari

play: function() {    
     var widget = this; 
     var videoElement = widget._getVideoElement(); 
     if(!widget.options.isMobile.iOS){ 
     videoElement.attr('autoplay', 'true'); 
     widget._getVideoElementNative().play(); 
     widget._setPlayIcon('stop'); 
     widget.options.isPlaying = true; 

     if (!widget.options.canPlay) { 
      widget._getLoadingIcon().show(); 
     } else { 
      widget._getPosterElement().hide(); 
     } 
     } 
     else{ //videoplay for iOS devices 
      widget._getVideoElementNative().currentTime = 0.1; 
    if(widget._getVideoElementNative().readyState !== 4){ 
     widget._getVideoElementNative().addEventListener('canplaythrough', onCanPlayVideo, false); 
     widget._getVideoElementNative().addEventListener('load', onCanPlayVideo, false); //add load event as well to avoid errors, sometimes 'canplaythrough' won't dispatch. 
     setTimeout(function(){ 
     widget._getVideoElementNative().pause(); //block play so it buffers before playing 
    }, 1); //it needs to be after a delay otherwise it doesn't work properly. 
    } 
    else 
    { 
     widget._getVideoElementNative().play(); 
    } 
    } 

}、

 onCanPlayVideo: function(){ 
widget._getVideoElementNative().removeEventListener('canplaythrough', onCanPlay, false); 
widget._getVideoElementNative().removeEventListener('load', onCanPlay, false); 
//video is ready 
widget._getPosterElement().hide(); 
widget._getVideoElementNative().play(); 

}、

答えて

0

のように見えます。ページがロードされているときには、video要素はありませんが、ユーザーが '再生'をクリックすると、特定の要素を作成して再生するように設定します。続いてthis answer

関連する問題