web-dev-qa-db-ja.com

iframeでローカルビデオの自動再生を無効にする方法

SrcがローカルPCからのものである場合、ビデオの自動再生を無効にする方法は？

<iframe width="465" height="315" src="videos/example.mp4"></iframe>

私は以下を試しましたが、うまくいきません：

  • src="videos/example.mp4?autoplay=0"
  • src="videos/example.mp4?autoplay=false"
  • src="videos/example.mp4?autostart=0"
  • src="videos/example.mp4?autostart=false"
htmliframevideoautoplay
19
Taleb

HTML5を使用している場合、 Video タグを使用することがこの目的に適しています。

自動再生なしでこの方法でビデオタグを使用できます。

<video width="320" height="240" controls>
    <source src="videos/example.mp4" type="video/mp4">
</video>

自動再生を有効にするには、

<video width="320" height="240" controls autoplay>
    <source src="videos/example.mp4" type="video/mp4">
</video>
39
Abhishek

videoタグについてどう思いますか？ iframeタグを使用する必要がない場合は、代わりにvideoタグを使用できます。

<video width="500" height="345" src="hey.mp4"  />

自動再生を無効にするためにautoplayタグでvideo属性を使用しないでください。

2
Mindsers

自動再生ビデオを無効にするには、このコードを試してください。

その働き。これが終わったら投票してください

<div class="embed-responsive embed-responsive-16by9">
    <video controls="true" class="embed-responsive-item">
      <source src="example.mp4" type="video/mp4" />
    </video>
</div>
2
Guru

ページの読み込み時にプレーヤーのソースを空の文字列として設定できます。この方法では、videoタグに切り替える必要はありません。

var player = document.getElementById("video-player");
player.src = "";

ビデオを再生したいときは、そのsrc属性を変更するだけです。例えば：

function play(source){
   player.src = source;
}
0
Yuanchun

このためにiframeを置き換えます。

<video class="video-fluid z-depth-1" loop controls muted>
  <source src="videos/example.mp4" type="video/mp4" />
</video>
0
Juan Pablo Venditti

考えられるすべてのソリューションを試しましたが、ローカルビデオバインディングには何も機能しませんでした。 iframeを引き続き使用したい場合は、jQueryを使用して修正することが最善の解決策であると考えています。

$(document).ready(function () {
    var ownVideos = $("iframe");
    $.each(ownVideos, function (i, video) {                
        var frameContent = $(video).contents().find('body').html();
        if (frameContent) {
            $(video).contents().find('body').html(frameContent.replace("autoplay", ""));
        }
    });
});

注：ドキュメント上のすべてのiframeが準備されていることを確認し、各iframeコンテンツをループして、autoplay属性を置換/削除します。このソリューションは、プロジェクトのどこでも使用できます。特定の要素に対して実行する場合は、$.each関数の下のコードを使用し、$(video)を$("#myIFrameId")などのiframe要素IDに置き換えます。

0
Mayank Modi