...

View Full Version : Remove Video <div> - onended



zugzwangle
03-21-2012, 04:36 PM
Hello there,
I am new to javascript. I would like to remove the div containing a video, by javascript, on the 'onended' event, but am not sure how to do this yet.
Here is my code so far:


<body onload="javascript:showDiv()">
<div class="fullscreen" id="fullscreen">
<video autoplay="autoplay" >
<source src="stage.mp4" type="video/mp4" />
<source src="stage.webm" type="video/webm" />
</video>
</div>

<script>
function hideDiv() {
if (document.getElementById) {
document.getElementById('fullscreen').style.visibility = 'hidden';
}
}
function showDiv() {
if (document.getElementById) {
document.getElementById('fullscreen').style.visibility = 'visible';
}
}
</script>
<script>

var video = document.getElementsByTagName('video')[0];
video.onended = function(e) {
hideDiv();
document.write("<font color=\"white\">Work???</font>");
}
</script>

I expected the text 'Work???' to be executed after the onended function carries out. However the video is not removed...
Thanks in anticipation to your answers..
Zugz

devnull69
03-21-2012, 05:06 PM
Generally you cannot use document.write() to alter elements on your current document. After page load it will always(!) create a new document and overwrite the existing one, including the Javascript code that called it.

Alternatives: element.innerHTML, document.createElement('TAGNAME'), parent.appendChild(element), parent.insertBefore(element, otherelement), document.createTextNode("This is a text node")



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum