video - videojs : フルスクリーン モードのバグと IE 10 での DIV の修正 #videojs

Question

私は VideoJS を使用していますが、Firefox のクロムとサファリですべて正常に動作します。しかし、Internet Explorer 10 では、ナビゲーション バーの下に全画面表示のビデオが表示されます (Z インデックス付きの固定 DIV があります)。http://nielk.github.io/nantes-nord/

videojs css クラスに大きな z-index を追加しようとして失敗しましたが、結果はありません!

誰かが解決策を持っていますか?

Answer 1

回避策を見つけました。videojs プレーヤーにリスナーを追加します。フルスクリーン イベントが発生したときに、固定 DIV にクラスを追加します (プロパティ 'display : none' を追加します)。したがって、フルスクリーン ビデオの上に表示される要素はありません。

 videojs('video-player-id').ready(function(){
    var myPlayer = this;

    var myFunc = function(){
        var myPlayer = this;

        // Do something when the event is fired
        $('#container-nav').toggleClass('fullscreen-ie');
        $('#scroll-top').toggleClass('fullscreen-ie');
    };

    myPlayer.on("fullscreenchange", myFunc);

});

CSS :

.fullscreen-ie {
    display: none;
}