Objectives; Convert onload to onclick and unload by onclick, including when onload statement is absent from script. Must not auto start at page load, but still should terminate with page exit. Need individual link to invoke each event desired and and auto terminate any possible running event before initiating new event. I only want one event running at any time or no event.
Site visitor point-of-view, to be able to select special effects on a singular page at will or choose no special effects to view the page in a “normal” manner without having to load a new page for every effect.
As a beginner any advice and tips from the learned veterans is greatly appreciated.
Thanks in advance.
well, without having the effects you want in front of me, the system i suggest would be to have the desired effect tacked onto the end of the url, using the search string. say your page is thePage.htm, you tack th effect onto it like this: thePage.htm?effectName
then, you have a little piece of javascript, that checks to see if anything is tacked onto the URL, reads that info if there is any, checks it against an array of effects, and takes the appropriate action.
writing the links would then be as simple as linking to the current page, and tacking the appropriate effect name onto the end of it, using a question mark. because the page has to reload every time, two effects couldn't run simultaneously, and including a link that didn't have anything tacked onto it would allow the viewer to see the page with no effects at all.
whether that would work or not could depend on the effects you want to use. was the first thing that came to mind, though.
The effects I intend to use are weather effects mostly by just basic scripts with a small image file and some also with a class file. If it is needed I can post the scripts as this site is a WIP and not online yet, but I hesitated to do that in the initial post because it would tend to make it a miles long. I intend the page to initially load with just common text, background and images. I am trying to avoid having to load a new page for, let’s say viewing the scene with a lightning storm. Also if for no other reason running more than one effect at a time is really not an option because they can be very resource intensive. I am thinking of the average visitors computing power and bandwidth (I have gigs of this and that and multi broadband). I will monitor this post often. Thanks..
Following is sample basic page also "lightning" "Fall" samples.
<p><font color="#FFFFFF">You will need a Java-enabled browser to see the lightning applet.
</applet>
------------------------------------------------------------------------------------------------------------------------------------------------------------------------
<script language="JavaScript">
<!-- Adapted from the Fall script -->
<!-- Original script by Kurt Grigg ([email protected]) -->
if (ns)
{for (i = 0; i < Amount; i++)
{var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.write("<layer name='sn"+i+"' left=0 top=0><img src="+rndPic+"></LAYER>");}}
else
{document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i = 0; i < Amount; i++){
var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.write('<img id="si" src="'+rndPic+'" style="position:absolute;top:0px;left:0px">');}
document.write('</div></div>');}
WinHeight=(document.layers)?window.innerHeight:window.document.body.clientHeight;
WinWidth=(document.layers)?window.innerWidth:window.document.body.clientWidth;
for (i=0; i < Amount; i++)
{Ypos[i] = Math.round(Math.random()*WinHeight);
Xpos[i] = Math.round(Math.random()*WinWidth);
Speed[i]= Math.random()*3+2;
Cstep[i]=0;
Step[i]=Math.random()*0.1+0.05;}
function fall()
{var WinHeight=(document.layers)?window.innerHeight:window.document.body.clientHeight;
var WinWidth=(document.layers)?window.innerWidth:window.document.body.clientWidth;
var hscrll=(document.layers)?window.pageYOffset:document.body.scrollTop;
var wscrll=(document.layers)?window.pageXOffset:document.body.scrollLeft;
for (i=0; i < Amount; i++)
{sy = Speed[i]*Math.sin(90*Math.PI/180);
sx = Speed[i]*Math.cos(Cstep[i]);
Ypos[i]+=sy;
Xpos[i]+=sx;
if (Ypos[i] > WinHeight)
{Ypos[i]=-60;
Xpos[i]=Math.round(Math.random()*WinWidth);
Speed[i]=Math.random()*5+2;}
if (ns)
{document.layers['sn'+i].left=Xpos[i];
document.layers['sn'+i].top=Ypos[i]+hscrll;}
else
{si[i].style.pixelLeft=Xpos[i];
si[i].style.pixelTop=Ypos[i]+hscrll;}
Cstep[i]+=Step[i];}
setTimeout('fall()',10);}
//-->
</script>
so are they all applets, or what?
Originally posted by joh6nn
so are they all applets, or what? I believe so, just the common snow, lightning etc accessing small image files and some use class files. The rain mod can use just text symbols for the rain drops or can also source an image file.
I wanted to use a lake effect, but I think that is for another day and or page.I know this would be easer if I just created a page for each effect on my server and just linked to them so you could show me mod the page code. I have family looking eagerly looking everyday for my first creation and well you know how that is….
k. pseudo code as follows.
<script>
var theEffects = new Array();
theEffects[0] = bigLongStringOfHTMLforApplet1;
theEffects[1] = bigLongStringOfHTMLforApplet2;
theEffects[2] = bigLongStringOfHTMLforApplet3;
if ( window.location.search ) {
var temp = window.location.search.slice(1) - 0;
document.write(theEffects[temp]);
}
</script>
the bigLongStringsofHTMLforApplet 's take the following form:
escape the quotes (ie, put a \ in front of them), and make sure there are no line breaks in the string.
then, your links work like this:
<A HREF="thePageThisIsOn.htm?1">Effect 1</A>
<A HREF="thePageThisIsOn.htm?2">Effect 2</A>
<A HREF="thePageThisIsOn.htm?3">Effect 3</A>
Wow, thanks “joh6nn”. You explained that so well that even I got it straight away, I think.:)
One question. If I read this correctly I will be unloading a page and loading a new page for each event. In consideration for low bandwidth visitors is it possible to keep the main page (rather large file) and load and unload the events only?
PS. :D "bigLongStringOfHTML":D
well, essentially, that's what you're doing. what you're doing, is taking the same page, and reloading it every time. so, the only thing that changes, is the effect that gets used. all of the other content would be cached after the first time, so people with dial up connections would still be doing ok.