1

ビデオの一部がクリックされた場合、ビデオ プレーヤーを再生および一時停止する必要があるため、次のような実装を行いました。

$("#promoPlayer").クリック(関数() {

$("#promoPlayer").click(function() {

    if(this.paused){

        this.play();

    } else {

        this.pause();

    }

});

...しかし、ビデオのコントロールは一時停止/再生しません。

実際の動作はこちら (http://175.107.134.113:8080/) で確認できます。ビデオは、上部のメイン カルーセルの 2 番目のスライドです。

上記のコードから1つ、実際の一時停止/再生ボタンから2つのonclickイベントを取得していると思われます。

実際のビデオ コントロールがどのように機能するのかわかりません。要素を調べると、タグが表示されるだけだからです。コントロールを区別できれば、今頃解決策を見つけていたかもしれません。

私がこれをどのように行うべきだったか、または私の解決策は大丈夫ですか。私のソリューションが問題ない場合、一時停止/再生するクリックイベントが1つだけになるように、コントロールのクリックをインターセプトするにはどうすればよいですか?

メディア要素のホームページを見ると、mouseOver を備えた大きな再生ボタンがありますが、どのようにそれを行ったのかわかりませんか? 他の誰かが助けることができますか？

4

3 に答える 3

0

わかりました、私はばかでした。MediaElement プレーヤーを初期化していませんでした:

$(document).ready(function(){
    $("#promoPlayer").mediaelementplayer({
        features: ['playpause','progress','current','duration','tracks','volume','fullscreen'],
        // Hide controls when playing and mouse is not over the video
        alwaysShowControls: false

    });
});

つまり、私が MediaElement だと思っていたのは、実際には私のブラウザのタグに対するネイティブ サポートであったということではありません...

予想どおり、MediaElement はもちろん、ビデオ フレーム全体をクリックしてビデオを無料で開始できるなどの機能を提供します...

于 2012-07-10T09:14:08.353 に答える
0

ブラウザーのネイティブ プレーヤーのコントロールは個々の DOM 要素ではないため、それらを識別する方法はないと思います。

私の提案は、プレーヤーをカバーするがコントロールをカバーしない目に見えない div を作成し、それにロジックをバインドすることです。

于 2012-07-05T12:37:18.447 に答える
0

プレーヤーはクリックで再生/一時停止する必要がありますが、イベントをアタッチする場合は、成功ハンドラー内で行うのが最善です。

$(document).ready(function(){
    $("#promoPlayer").mediaelementplayer({
        success: function(media, domElement, player) {
            $('#somebutton').on('click', function() {
                  media.play();
            });
        }
    });
 });
于 2012-07-10T20:17:59.623 に答える