Image to swf onclick

[GiddyRob]

Hi,

I was just wondering how I can have an image that when it is clicked it is replaced by a flash swf?

The problem I have been having is that I have embedded quite a lot of youtube videos on a webpage and it kills the computer trying to load them all. I would like it so that it only loads the embedded clip when the particular image is clicked on. I do not want to refresh the page as this will move back up to the top of the page so that the user can't see the video they wanted to watch without scrolling down and finding it.

Any help would be great.

Cheers

Rob

 

[tsuji]

[1] Like this for a start.
[tt] <div id="divid"><img src="abc.gif" alt="abc.gif" onclick="doit()" /></div>
[/tt]
[2] With the function doit() like this.
[tt]
function doit() {
var s;
s='<OBJECT classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000"\n'+
'codebase="

http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"\n'+

'WIDTH="400"\n'+
'HEIGHT="250"\n'+
'id="your_id"\n' +
'ALIGN="">\n' +
'<PARAM NAME=movie VALUE="[red]xyz.swf?someparam=somevalue_etc[/red]">\n' +
'<PARAM NAME=quality VALUE=high>\n' +
'<PARAM NAME=bgcolor VALUE=#bbbbbb>\n' +
'\n' +
'<EMBED src="[red]xyz.swf?someparam=somevalue_etc[/red]"\n' +
'quality=high\n'+
'bgcolor=#bbbbbb\n'+
'WIDTH="400"\n'+
'HEIGHT="250"\n' +
'NAME="your_name"\n'+
'ALIGN=""\n' +
'swLiveConnect="true"\n'+
'TYPE="application/x-shockwave-flash"\n'+
'PLUGINSPAGE="

http://www.macromedia.com/go/getflashplayer">\n'

+
'</EMBED>\n' +
'</OBJECT>'
document.getElementById("divid").innerHTML=s;
}
[/tt]
Format better to make it look better and with proper parameters fed.