1

通常、html5 ビデオでは別のフォーマットを指定して、ブラウザが満足するフォーマットを見つけます。

<video height="180" width="300" id="ourvideo">
  <source src="http://videos.mozilla.org/serv/webmademovies/popcornplug.mp4">
  <source src="http://videos.mozilla.org/serv/webmademovies/popcornplug.ogv">
  <source src="http://videos.mozilla.org/serv/webmademovies/popcornplug.webm">
</video>

sequence.js を使用すると、見つけることができるすべてのデモで、シーケンス内のクリップごとに 1 つの形式しか指定できません。

http://jsfiddle.net/jmTgD/1/

http://scotland.proximity.on.ca/cadecairos/sequence/issue11/test/functional-plugin.html

本質的に：

var sequence = Popcorn.sequence(
                "container-id",
                [
                    {
                        src: "http://videos.mozilla.org/serv/webmademovies/atultroll.webm",
                        in: 0,
                        out: 3
                    },
                    {
                        src: "http://videos.mozilla.org/serv/webmademovies/justintime.ogv",
                        in: 174,
                        out: 180
                    },
                    {
                        src: "http://videos.mozilla.org/serv/webmademovies/popcornplug.ogv",
                        in: 0,
                        out: 6
                    }
                ]);

sequence.js で別のソースを提供できるかどうか教えてもらえますか?

4

1 に答える 1

2

Popcorn.sequence が複数のソースを処理するようには見えませんが、これを回避する方法があります。

1 つのオプションは、 を使用canPlayTypeしてブラウザーが再生できる形式を検出し、それに応じてソースを設定することです。このようなもの：

var ext = 'ogv', i, vid,
    formats = {
        'mp4': 'mp4',
        'webm': 'webm',
        'ogg': 'ogv'
    },
    files = ['atultroll', 'justintime', 'popcornplug'];

var vid = document.createElement('video');
for (i in formats) {
    if (vid.canPlayType(i)) {
        ext = formats[i];
        break;
    }
}
for (i = 0; i < files.length; i++) {
    files[i] += ext;
}

canPlayType実際のビデオ エンコードにはブラウザがサポートしていないバリエーションがあるため、理論的には 100% 正確ではありませんが、これは通常、実際には問題になりません。

もう 1 つのオプションは、Popcorn Splice Playerを使用することです。Popcorn 1.4 (まだリリースされていませんが、マスター ブランチにあります) では、非ネイティブ プレーヤー (YouTube、Vimeo など) を HTML メディア要素を模倣するオブジェクトにラップするモジュールが可能です。Splice Player は、複数のメディア ソースを組み合わせて 1 つのビデオとして再生するモジュールの 1 つです。複数のソースをサポートします。

var player = Popcorn.SplicePlayer('#container');
player.src = [
    {
        src: [ "atultroll.mp4", "atultroll.webm", "atultroll.ogv" ],
        from: 0,
        to: 3
    },
    {
        src: [ "justintime.mp4", "justintime.webm", "justintime.ogv" ],
        from: 174,
        to: 180
    },
    {
        src: [ "popcornplug.mp4", "popcornplug.webm", "popcornplug.ogv" ]",
        from: 0,
        to: 6
    }
];
于 2012-11-21T20:45:15.413 に答える