1

ページに 3 つの YouTube ビデオがあります。ページは、 src " http://img.youtube.com/vi/ video_id /maxresdefault.jpg" でimg要素を読み込みます。次に、サムネイルごとに、YouTube のiframeビデオ コードに移動します。

display: noneをiframe要素に明示的に指定しても、ビデオが読み込まれ、 autoplay=1を設定すると、目に見えない再生が開始されます。見えない間は読み込まれないと思ったので、javascriptなしでcss呼び出しを介してビデオを表示および非表示にできます。

では、別のサムネイルがクリックされて他のビデオが表示されたときに、 「 iframe src= 」をクリアするようにjQueryに指示するにはどうすればよいですか?

アイデアは、ビデオのサムネイル jpg のみを提供し、サムネイルを明示的にクリックした場合にのみビデオを再生することです。他のビデオが既に再生されている場合は、そのsrcをクリアして停止する必要があります。すべての動画は異なる * ID * を持つことができます。

PS私はあなたが私の英語を理解してくれることを願っています:(

4

2 に答える 2

0

AngularJs の使用に興味がある場合は、非常に簡単に使用できます。

<iframe class="img-responsive" src="{{pdfLoc| trustThisUrl }}" ng-style="{
                height: iframeHeight * 0.75 + 'px'
            }" style="width:100%"></iframe>

ここで trustThisUrl は単なるフィルターです。

angular.module("deck").filter('trustThisUrl', ["$sce", function ($sce) {
        return function (val) {
            return $sce.trustAsResourceUrl(val);
        };
    }]);
于 2018-05-11T05:21:56.217 に答える
-1

jQuery の.attr()メソッドを使用します。したがって、$('iframe').attr('src', '');本質的にそれを削除すると言えます。

$('iframe').attr('src', 'http://www.youtube.com/new-url-goes-here');編集： iframeを設定したiframeまたはIDに変更するだけで、同じ方法で新しいURLを追加できることも追加する必要があります

于 2013-03-15T23:38:41.483 に答える