1

IOS はビデオの自動読み込みを防止するため、再生ボタンを示す「ポスター」画像を追加する必要があります (この場合)。

ただし、読み込みが開始されたときにポスター画像を読み込み中の画像に交換することにより、接続が遅い場合の読み込み中の画像も表示したいと思います。

問題は、ロード画像の前に再生ボタンが一瞬表示される通常の接続にあります。

では、再生ボタンが押されるまでロードが行われないことが検出されたときに、再生ポスター画像を表示するにはどうすればよいですか。

4

2 に答える 2

0

最初に networkState と readyState の 2 つを確認する必要があります。さらに、preload 属性の値が「none」以外であるか、autoplay 属性を使用していることを確認する必要があります。この場合、次のコードを記述できます (window.onload まで待機することをお勧めします)。

$(window).on('load', function(){
    var myVideo = $('video');
    if(myVideo.prop('readyState') < 1 && myVideo.prop('networkState') != 2){
        //no automatically loading code
        myVideo.prop('poster', 'noloading.jpg');
    }    
});

これはテストされていません。readyState == 0 はデータがないことを意味し、networkState 2 はロードを試行しないことを意味します。

タイムアウトあり:

$(window).on('load', function(){
    var myVideo = $('video');
    if(myVideo.prop('readyState') < 1 && myVideo.prop('networkState') != 2){
        //probably no automatically loading code
        setTimeout(function(){
            if(myVideo.prop('readyState') < 1 && myVideo.prop('networkState') != 2){
                //no automatically loading code
                myVideo.prop('poster', 'noloading.jpg');
            }
        }, 1000);
    }   
});
于 2013-10-31T16:40:13.607 に答える