Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Graphics, Flash and Multimedia _ need assist with closing intro video

Posted by: lisas Feb 27 2017, 10:59 AM

Hi - I'm new to this and I am building a website for a company. I created an opening video with their logo and a cool graphic mp4 file in Adobe After Effects. I edited the index.htm file with the following code:

<embed src="G:\~~~JB WORKING TEMP\video.mp4" width="1080" Height="720" autoplay="true">

<!DOCTYPE html>
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Language" content="en-us">
<title>landingpage</title>
ect..........

the page opens and plays the video perfectly, when the video is done playing there is a big black place on the landing page where the video was. I want that to close.
I tried google but every link refers to youtube videos. I want this embedded in the website to play as an intro, then close, leaving the landing page open.
Can you help me please?



Posted by: lisas Feb 27 2017, 10:54 PM

Isn't there anyone around this site to assist? unsure.gif

Posted by: Christian J Feb 28 2017, 08:20 AM

There's a javascript "ended" event that seems to fire when e.g. a video has stopped playing, which you might use to remove the space used by the video. I have no idea about browser support.

See also
https://www.w3schools.com/tags/av_event_ended.asp (simple example)
https://developer.mozilla.org/en-US/docs/Web/Events/ended (more details)

Posted by: Christian J Feb 28 2017, 11:01 AM

This worked in my IE9, Firefox and Chrome:

CODE
<video onended="this.style.display='none';">

Note that the page layout will reflow when the VIDEO element disappears, which might be more annoying than a black space.

Maybe it's possible to make the video show a static image once it's finished? One way to do this is by stopping the video at the last second (before it turns black). So if the video is two minutes long you might specify this in the URL:

CODE
src="foo.mp4#t=0,00:01:59"

to make it run from 0 to 00:01:59.

Or you could display the video positioned in front of other content, which avoids reflowing when it's removed.

But I must say that autoplaying videos are quite annoying in most cases, even more so if they block other content while playing (like an ad).

Posted by: lisas Feb 28 2017, 03:07 PM

Thank you for the assist, it is greatly appreciated! I will give your suggestions a try and post back in case someone else has the same issue.
Thx again

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)