Click to See Complete Forum and Search --> : Had it w/ this code...


krautinator
10-28-2003, 12:04 PM
<HTML>

<HEAD>

<TITLE></TITLE>


<SCRIPT language="JavaScript">
<!--

function moveit(newspot)
{

if (document.layers)
{
var picture=document.image1;
if (newspot<500)
{
picture.left= newspot;
newspot+=30;
setTimeout('moveit('+newspot+')',20);
}
}

if (document.all)
{
var picture=document.all.image1.style;
if (newspot<500)
{
picture.left= newspot;
newspot+=30;
setTimeout('moveit('+newspot+')',20);
}
}

}


function moveitback(newspot)
{

if (document.layers)
{
var picture=document.image1;
if (newspot<500)
{
picture.left = newspot;
newspot-=30;
setTimeout('moveit('+newspot+')',20);
}
}

if (document.all)
{
var picture=document.all.image1.style;
if (newspot<500)
{
picture.left= newspot;
newspot-=30;
setTimeout('moveitback('+newspot+')',20);
}
}

}

//-->
</SCRIPT>


<STYLE type="text/css">
<!--

.moveimage { position:absolute; left:200px; top:10px; z-index:2;filter:alpha(opacity=40) }

-->
</STYLE>

</HEAD>

<BODY background="rain.jpg">

<DIV ID="image1" class="moveimage">
<IMG SRC="rain.jpg">
</DIV>

<img src="drop0.jpg" onmouseover="moveit(200)" onmouseout="moveitback(200)" >


</BODY>

</HTML>


I think the problem is somewhere within the highlighted text, but I'm not sure what it is...
the script is supposed to move an image right a certain amount, and then move back to it's original position,

it moves it right, but then when it tries to move back to the original position, the image keeps going left into infinity...:eek:

???
any ideaz?:confused:

halifaxrick
10-28-2003, 02:18 PM
Is it because one of your movitbacks calls moveit.

function moveitback(newspot)
{

if (document.layers)
{
var picture=document.image1;
if (newspot<500)
{
picture.left = newspot;
newspot-=30;
setTimeout('moveit('+newspot+')',20);
}
}

if (document.all)
{
var picture=document.all.image1.style;
if (newspot<500)
{
picture.left= newspot;
newspot-=30;
setTimeout('moveitback('+newspot+')',20);
}

krautinator
10-28-2003, 03:20 PM
yeh,
fixed that
still behaves the same way though:confused: :mad:

halifaxrick
10-28-2003, 03:42 PM
The reason it goes further back is because you don't tell it to stop. your if statement says if (newspot<500), as it will always be less than 500, it will never stop -20, -40 etc.

You could put if (newspot > 0) (as you know it stopped at 500 an do not need to re-check for this).

halifaxrick
10-28-2003, 04:07 PM
The following code works.

function moveitback(newspot)
{

if (document.layers)
{
var picture=document.image1;
if (newspot>200)
{
picture.left = picture.left - 30;
newspot-=30;
setTimeout('moveitback('+newspot+')',20);
}
}

if (document.all)
{
var picture=document.all.image1.style;
if (newspot>200)
{
picture.left = newspot;
newspot-=30;
setTimeout('moveitback('+newspot+')',20);
}
}

}

I also call the moveit back code like so:

<img src="drop0.jpg" onmouseover="moveit(200)" onmouseout="moveitback(500)" >

This starts the movement back from the 500 mark.

agminer
10-28-2003, 08:48 PM
Try putting the 200 and 500 in single quotes inside the parentheses. Solved my problem, maybe yours too.

krautinator
10-30-2003, 11:08 AM
yeah, I finally fixed it and moved on to a more complete 'beta' version if you will...
http://www.geocities.com/krautinator2001//dialuptester.html

now I'm wondering, how do I make multiple copies of these
w/out having to rewrite the same script?

halifaxrick
10-30-2003, 12:24 PM
Is make the image name another variable within your script. That way you can call moveit(image2, 200) to move the image2 from point 200 to point 500.

You could also make the final location a variable, thus telling the image to moveit from x to y and then just moveitback from y to x.

krautinator
10-30-2003, 01:45 PM
ahhh...
i see
thanx.

also, do you know how to make a .js file?
is it the same way you make an html file? just w/ a .js extension?

TomDenver
10-30-2003, 02:47 PM
Yes, just use .js extension.

halifaxrick
10-30-2003, 02:51 PM
Yes, the .js file is just a text file and is called a bit like this.

<script language="JavaScript" src="/functions.js"></script>