HTML5フルスクリーンビデオの右上隅にXを追加する

私は、再生ボタンを押すとフルスクリーンでHTML5プレーヤーを使用してビデオを開くビデオバナーでウェブサイトを設計しています。ここでは、再生ボタンが押されたときに呼び出されるJavaScriptがあります。HTML5フルスクリーンビデオの右上隅にXを追加する

function addVideo() { 
    var video = $(document).find('#intro-video')[0]; // find the newly inserterd video 
    video.src = "../../assets/images/intro.mp4"; 
    video.controls = false; 
    video.load(); 
    video.play(); 
    goFullscreen(video); 
} 

function goFullscreen(myVideo) { 
    if (myVideo.requestFullscreen) { 
     myVideo.requestFullscreen(); 
    } else if (myVideo.msRequestFullscreen) { 
     myVideo.msRequestFullscreen(); 
    } else if (myVideo.mozRequestFullScreen) { 
     myVideo.mozRequestFullScreen(); 
    } else if (myVideo.webkitRequestFullScreen) { 
     myVideo.webkitRequestFullScreen(); 
    } 
}

私がクリックし、ビデオの右上隅にあるXを入れたいのですが、エスケープキーを押す動作をシミュレートまたはJavaScriptメソッドを呼び出します。誰かが私にそれの例を教えてもらえますか？

出典

2016-09-13 Nick Gilbert

http://stackoverflow.com/questions/19357854/html5-exiting-video-fullscreen –

ありがとうございました。しかし、私は既にフルスクリーンを終了するJSメソッドを持っています。私はクリックするとそれを閉じるために私のメソッドを呼び出す右上隅にXを追加したい –

私はビデオタグの代わりにdivコンテナのフルスクリーンを作成してしまい、そのdivのビデオを100％幅と高さにしました。 div内に他の要素を配置することができます、ちょうど位置を使用してください：コンテナとオーバーレイされたアイテムの絶対/相対

出典

2016-09-13 18:35:07 StackOverMySoul

それを実感、ありがとう！ –

HTML5フルスクリーンビデオの右上隅にXを追加する

答えて

関連する問題