video要素に配置した画像を入れ替える

javascriptでvideo属性のposter要素の値を取得する

javasctipt

<script>
	 function setPoster($poster){
	 	var $videoElement = document.getElementById("video1");
		$videoElement.poster = $poster;
		var $poster = $videoElement.poster;
	}
</script>

HTML

<article class="media_content">
	<video id="video1" controls poster="img/houseki.png" width="200" height="150" onclick="setPoster('img/housek_on.png')" onmouseout="setPoster('img/houseki.png')">
		<source src="img/izumirika.mp4" type="video/mp4" />
		<source src="demo.webm" type="video/webm"/>
		<source src="demo.ogv" type="video/ogg"/>
    </video>
</article>

コメントを残す

CAPTCHA