2

ビデオをコーディングするにはどうすればよいですか。それは再生されます。そして最後まで走った後。その後、ビデオはdivに置き換えられます (具体的には、その #div 内にアニメーション gif が含まれます)。

しかし、いずれにせよ; どうすればこれを書くことができますか?

何かのようなもの; (ただし、新しい Window / URL は必要ありませんが、インラインを置き換える div は必要ありません)

$oVideo.bind('ended', function() {
window.location = 'http://coolurl.com';
$oVideo[0].pause();
$oPause.hide();
$oPlay.css('display', 'block');
});

基本的; ビデオが再生される > 終了する > ビデオが消える > div に置き換わる(アニメーション GIF を含む #div)。

4

1 に答える 1

4

したがって、私が正しく理解していれば、ビデオを再生しようとすると、ビデオが消えて、任意のコンテンツを含むdivに置き換えられます。

通常のHTML/JS / CSSでは、このようなものがあなたが求めていることを実行します。jQueryへの変換はかなり簡単である必要があります(質問で設定しているwindow.locationではなく、ビデオのスタイルをdisplay:noneに設定し、表示したいdivをdisplay:blockに設定するだけです)

<!DOCTYPE html> 
<html> 
<head>
</head>
<body> 
<div class="vidBox" id="box">
    <video class="vid" poster="http://www.rufan-redi.com/assets/lizard_goldeye.jpg" preload="metadata" controls="true" id="video1" height="240" width="360">
        <source src="http://jcath-drg.s3.amazonaws.com/BigBuck.m4v" type="video/mp4">
    </video>
    <div id="other" style="display:none; width:400px; height:300px; background-color:#f0f0f0">
        This appears after the video ends
    </div>
</div>
<script>
    var vid=document.getElementById('video1');
    vid.addEventListener("ended", hideVideo, false);

    function hideVideo() {
        var vid=document.getElementById('video1');
        var other=document.getElementById('other');
        vid.removeEventListener("ended", hideVideo, false);
        vid.style.display='none';
        other.style.display='block';
    }
</script>
</body> 
</html>
于 2013-01-17T20:03:21.530 に答える