homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

Flash Video To Replace Image
Load and play *.flv file only @ onclick

Msg#: 4233679 posted 5:17 pm on Nov 22, 2010 (gmt 0)

My web page includes an image that has a hotspot. Only when clicking the hotspot I would like the flash video "FLVideo" to load, play and replace the image. The size of the image would be the same as the video field. At the end of the video the image should reappear again. Because I would like a speedy page opening (the size of the video is 25MB) the video would only load at onclick. A loading indicator may show an activity in the video field.

Could someone please help me to solve this challenge ?
Thank you for your reply.



Msg#: 4233679 posted 7:30 pm on Nov 25, 2010 (gmt 0)

Something along those lines might work:

<script type="text/javascript">
function playVid() {
document.getElementById("screen").innerHTML = 'your-flash-embedding-code';

<div id="screen">
<img src="foo.jpg" usemap="#hello">
<map name="hello">
<area shape="circle" coords="50,50,10" onclick="playVid()">

Going back to the image after the video finished playing would be a bit more complicated, but you could use the last frame of the video file instead.


Msg#: 4233679 posted 7:42 am on Nov 27, 2010 (gmt 0)

To some extent this may depend on the purpose of the image which you wish to show at the beginning and end and how much control you have over the content of the flash video and...which player you are using.

For example, if you are using vimeo, youtube or a similar player, and if the first scene of the video contained the desired image, you could simply ensure that autoplay is off in your flash object parameters. So the video player will load, will show the first scene paused (resting on your image) with a play-button overlayed. The 24mb does not start loading until the user presses the play button. When the video is finished, it normally resets to the start position, thus showing your image again (once more with the play button overlayed).

If you search for "flash video object parameters" and include the name of your player in particular, you should find some good resource.


Msg#: 4233679 posted 3:17 am on Nov 30, 2010 (gmt 0)

Thank you for your help. For my website I decided to choose a rather simpler way to embed the Flash video : www.TheSecretOfSuccess.info.
Thanx again

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved