Forum Moderators: open
I need the code so that when the user clicks on an image, say 300x450, the flash movie plays, and then it is replaced by a new image (also 300x450).
The image has to be independent, i.e., not the end part of the Flash movie, not embedded in the swf file, i.e., a jpg file, so users can save/print/email it.
Can you use Javascript to do this so that onClick performs two events back to back, i.e., plays the movie, and when it's finished playing, loads the image into the same space?
What's the shortest code to accomplish this and the best code to implement across a large site, i.e., so you could Find+Replace code sitewide so the mini introduction movie plays before each image?
p/g
P.S. Could you do an onClick double-click event to print out the final image? (One click to download; double click to print.)
See: [w3schools.com...]
Can you use Javascript to do this so that onClick performs two events back to back, i.e., plays the movie, and when it's finished playing, loads the image into the same space?
It might make more sense in this case to have Flash trigger the javascript after the movie is done playing... otherwise you'll be dealing with timers and would have to code all sorts of logic to accomodate users pausing/stopping the video.
best code to implement across a large site, i.e., so you could Find+Replace code sitewide
If you have a large site and are still finding+replacing across static files whenever you need to make code changes, I highly recommend switching over to a dynamic site. These two threads in the PHP forum were how I got my start years ago and the approach will save you thousands of hours of finding+replacing:
[webmasterworld.com...]
[webmasterworld.com...]
It might make more sense in this case to have Flash trigger the javascript after the movie is done playing... otherwise you'll be dealing with timers and would have to code all sorts of logic to accomodate users pausing/stopping the video.
Would that require a unique Flash movie for every image? (i.e., an actionscript at the end of the movie loading a unique specific file).
I'm aiming for just one movie to reduce downloading (cache) and minimize the coding set up time across the site.
Right now I've got onClick working nicely for images, where it swaps one for another onClick:
---
<script type="text/javascript">
<!--
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<p><img src="graphics/one.gif" width="400" height="600" id="Image1" onClick="MM_swapImage('Image1','','pictures/one.jpg',0)"></p>
---
I'd like to have other pages where upon loading the movie plays "automatically." Then the picture loads. So it's similar to what I have now except there's no clicking required.
Instead of an image being swapped for another image, I want the image being swapped with a movie.
Is there no way to force Javascript to complete one event before beginning the next?
How about if you set onLoad to play the movie, and then swap the movie for the image?
p/g
