Can I hide the embedded video on my website after an amount of time?

Question

Using HTML - Wondering if it's possible using Javascript, CSS or anything else to hide the video (Embedded mp4 on autoplay) after it is finished, or after an amount of time? Cheers for any help, if there's no way I'll find some other way.

You could remove/empty the element. Is there a callback from the video player that tells you its finished or do you want to hope javascript's timing is spot on? — Popnoodles, Dec 07 '13 at 05:12
I am using just I'm not the most knowledgable coder, I don't know how to empty/remove an element or know what a callback is. I don't care if the timing is a second or two late — user3076805, Dec 07 '13 at 05:14
Ok, search for setTimeout(), read http://stackoverflow.com/questions/7561277/remove-an-element-from-the-dom-from-reference-to-element-only and marry the two — Popnoodles, Dec 07 '13 at 05:18

score 3 · Answer 1 · answered Dec 09 '13 at 00:43

You can use setTimeout() and SomeElement.style.display="none" together.

<!DOCTYPE html>
<html>
<head>
    <script>
        setTimeout(hideDiv, 10000); //Instead of 10000 put your video's length, in milliseconds  
            function hideDiv() {
                document.getElementById("toHide").style.display="none";    
            }
        </script>
    </head>
    <body>
        <div id="toHide">
            <p>Your video here</p>
        </div>
    </body>
</html>

In the example above, the div with id toHide disappears after 10 seconds. Simply place your video inside of the div. To change the time after which the div disappears, change the "10000" in setTimeOut() to your video's length, in milliseconds.

Can I hide the embedded video on my website after an amount of time?

1 Answers1