Closed Thread Icon

Preserved Topic: moving objects Pages that link to <a href="https://ozoneasylum.com/backlink?for=17689" title="Pages that link to Preserved Topic: moving objects" rel="nofollow" >Preserved Topic: moving objects\

 
Author Thread
DL-44
Maniac (V) Inmate

From: under the bed
Insane since: Feb 2000

posted posted 03-17-2000 22:36

I am working with DHTML for the first time really, and I have some "borrowed" code for moving an image when the page loads.
The function goes something like this:<P>function moveDivision1(which, start, finish, step, speed){
if (ie4 &#0124; &#0124; ns4){
if (start < finish){
eval(layerRef + '["' + which +'"]' + styleRef + '.top = start');

start=start+step;
setTimeout("moveDivision1('"+which+"',"+start+","+finish+","+step+","+speed+")",speed);<P>and is called in the body tag like this:<P>onload="moveDivision1('home',10,100,5,10)"<P>My question is: how can I apply this to more than one image? I want several images to start in the same place and end somewhere different - I can't seem to make it work. All the images load but only one moves : (<P>Any ideas? remember I really don't know my syntax here.<P>------------------

DocOzone
Maniac (V) Lord Mad Scientist
Sovereign of all the lands Ozone and just beyond that little green line over there...

From: Stockholm, Sweden
Insane since: Mar 1994

posted posted 03-17-2000 22:45

Ok you have this line here...<P>eval(layerRef + '["' + which +'"]' + styleRef + '.top = start');<P>and you're sending the value 'home' for the layer to be moved, right? You could either ust stack a whole bunch of move(...) calls in your onload statement, seperated by ";", or you could set up a function that had the five move() calls in it and call *that*. OR, you could replace that line with a hard coded call to the div, like...<P>eval(layerRef + '["home"]' + styleRef + '.top = start');<P>and then add four new hard coded lines, like...<P>eval(layerRef + '["moveme"]' + styleRef + '.top = start');
eval(layerRef + '["metoo"]' + styleRef + '.top = start');
eval(layerRef + '["gonow"]' + styleRef + '.top = start');
eval(layerRef + '["nownow"]' + styleRef + '.top = start');<P>Got it? 3 different ways to do things, what could be simpler? <g><P>Your pal, -doc-<P><P>------------------
----- Doctor Thaddeus Ozone --------- "Specialization is for insects"---
  --- OZONE pages .................................. http://www.ozones.com/
    - Hands-On Tutorials ............ http://www.ozones.com/handson/

DL-44
Maniac (V) Inmate

From: under the bed
Insane since: Feb 2000

posted posted 03-17-2000 23:39

ARRRGGGGGGHHHHHHH!
Thanks Doc. I had been trying to use the multiple "move" for the "onLoad" and I knew i needed to seperate with semicolons, but I was using multiple sets of quotation marks. Seems to work now that I put all the info within one set of quotes. Muchas Gracias Senor Lunatic<P>I'll have to keep the other options in mind for later use too!<P>------------------

2winspapa
Bipolar (III) Inmate

From: Alaska, USA
Insane since: Mar 2000

posted posted 03-18-2000 00:07

WOW! A Photoshop guru AND a code expert....<P>(just trying to promote myself to lunatic)<P>Or I could pretend that I'm a mademan (i.e., the sopranos on HBO) instead of a lowly madman.....<P> <IMG SRC="http://www.ozones.com/forum/cool.gif">

Slime
Lunatic (VI) Mad Scientist

From: Massachusetts, USA
Insane since: Mar 2000

posted posted 03-18-2000 00:33

Wouldn't a for loop work well here?

DL-44
Maniac (V) Inmate

From: under the bed
Insane since: Feb 2000

posted posted 03-18-2000 07:10

can you please elaborate Slime?<P>------------------

DocOzone
Maniac (V) Lord Mad Scientist
Sovereign of all the lands Ozone and just beyond that little green line over there...

From: Stockholm, Sweden
Insane since: Mar 1994

posted posted 03-18-2000 10:28

Yah, I thought of putting all of the names in an Array, and then looping through all of them, referring to them as arrayname[x] for the divnames. That's usually how I do things myself.<P><P>------------------
----- Doctor Thaddeus Ozone --------- "Specialization is for insects"---
  --- OZONE pages .................................. http://www.ozones.com/
    - Hands-On Tutorials ............ http://www.ozones.com/handson/

Slime
Lunatic (VI) Mad Scientist

From: Massachusetts, USA
Insane since: Mar 2000

posted posted 03-19-2000 00:12

Say here's your list of names:<P>ImageOne, ImageTwo, ImageThree, ImageFour<P>put them in an array like this:<P>var ImageNames = new Array();
ImageNames[0] = "ImageOne";
ImageNames[1] = "ImageTwo";
ImageNames[2] = "ImageThree";
ImageNames[3] = "ImageFour";<P>then you can use a for loop to go through them all:<P>for (a = 0; a < 4; a++)
{
moveDivision1(ImageNames[a],10,100,5,10);
}<P>put the for loop in a function and call it from the onLoad attribute of the Body tag.<P>if you've never seen a "for" loop before, this is how they work:<P>for (initialization; test; increment
{
//Statements go here.
}<P>when the for loop is reached in the code, the "initialization" statement is executed. Then, the code inside the loop is run over and over. Each time it is run, "increment" will be executed. The code will stop executing once "test" evaluates to false.<P>So the loop above first sets a variable called "a" to 0. It then runs the code inside the loop, and each time it runs the code it adds one to "a". When "a" is no longer less than 4, it stops the loop and moves on. In this way, it executes the code four times, with "a" equal to 0, 1, 2, and 3.<P>Got it? I'm not the best at explanations...<P>(BTW - onLoad is supposed to have the "L" capitalized, but most browsers understand it anyway.)<p>[This message has been edited by Slime (edited 19-03-2000).]

DocOzone
Maniac (V) Lord Mad Scientist
Sovereign of all the lands Ozone and just beyond that little green line over there...

From: Stockholm, Sweden
Insane since: Mar 1994

posted posted 03-19-2000 11:26

Hey, when loading text or numbers into an Array, you can take a shortcut. Instead of <P>var ImageNames = new Array();
ImageNames[0] = "ImageOne";
ImageNames[1] = "ImageTwo";
ImageNames[2] = "ImageThree";
ImageNames[3] = "ImageFour";<P>You can say...<P>var ImageNames = new Array("ImageOne","ImageTwo","ImageThree","ImageFour");<P>Shorter lines, less code => good thing.<P>------------------
----- Doctor Thaddeus Ozone --------- "Specialization is for insects"---
  --- OZONE pages .................................. http://www.ozones.com/
    - Hands-On Tutorials ............ http://www.ozones.com/handson/

Phil
Bipolar (III) Mad Scientist

From: Eastbourne, UK.
Insane since: Mar 2000

posted posted 03-19-2000 18:34

Hey Slime,
2winspapa has stated it elsewhere in the Forum, but I gotta agree with him, you're one very talented young guy...<P>
<P>------------------

DL-44
Maniac (V) Inmate

From: under the bed
Insane since: Feb 2000

posted posted 03-19-2000 23:14

Thanks for the expalnation Slime - it was very informative; I really am starting to understand Javascript much better since coming here. It seems though, that all the images would have to move the same - is that correct? I ended up with a pretty cool effect by staggering the step/speed attributes - I'm pretty happy that I was actually able to make it work how I wanted, with a little help from Doc and friends...<P>Thanks again guys : )<P>------------------

Slime
Lunatic (VI) Mad Scientist

From: Massachusetts, USA
Insane since: Mar 2000

posted posted 03-20-2000 17:40

Heh, thanks guys.<P>To make the images move different amounts, you can either use the variable "a" inside the moveDivision1 function call to change numbers, like...<P>for (a = 0; a < 4; a++)
{
moveDivision1(ImageNames[a],2.5*a,25+a*25,5,10);
}<P>or you may just want to call the function multiple times, if the numbers are very much different, and forget the for loop altogether.

Rend
Paranoid (IV) Inmate

From: Israel
Insane since: Mar 2000

posted posted 03-22-2000 06:54

Hey peeps, i bet we all wanna see them finished works, so if you put em online (which is more or less what they are for) post in the showroom forum and make a link! you probably already did, i didnt check... argh. never mind ill post first and check later.<P>Never Pet a Burning Dog
Rend<P>------------------

« BackwardsOnwards »

Show Forum Drop Down Menu