PDA

Click to See Complete Forum and Search --> : simple javaScript onClick Question

dotnetanimal
01-02-2003, 07:40 PM
I am trying to have an up arrow appear as the default view. On click I want it to change to a down arrow. On click again I want it to turn back to the up arrow. Sounds simple but for some reason it is killing me.

Here is what I have now:

<td width="418">Name<span style="POSITION: relative; TOP: 2px"><IMG height="2" src="images/blank.gif" width="315"><IMG title="Sort Reports by Name" style="CURSOR: hand" onclick="sortTable('name', 'asc'); document.getElementById('sortUP').src='images/icon_sortDN_on.gif'" src="images/icon_sortUP_on.gif" id="sortUP"><IMG height="2" src="images/blank.gif" width="5"><IMG title="Sort Reports by Name" style="CURSOR: hand" onclick="sortTable('name', 'des');" src="images/icon_sortDN_on.gif"></span></td>
ChikoritaPro
01-02-2003, 07:58 PM
I am a little too lazy to read yours, lol, but I'll make a new Script to where you can see how to flick Images back and forth onClicks. The crazy thing is, you only need one onClick!

<html>
<head>
<title>Your Title</title>
<script language="JavaScript">
<!--
up=new Image() // Preloading the images.
up.src="up.gif" // Location of the image.
down=new Image()
down.src="down.gif"
whichdirection="up" // Whatever current picture is (So far, up)
// They must be in quotes.
// They don't have to be .gifs, just names, lol.
function changedirection() // Whatever function name you

{ // want.
if(whichdirection=="up"){whichdirection="down"}
else if(whichdirection=="down"){whichdirection="up"}
// These switches pictures
document.arrownames.src=eval(whichdirection+".src")
// arrownames doesn't have to be named arrownames, but
// they have to have the name of the image.
/*
The Method eval() makes anything inside of it a variable, meaning that the direction that it is set on will be activated, with the added word of '.src'. They combine to down.src, which brings the picture to the down arrow.
*/
}
//-->
</script>
</head>
<body>
<img src=up.gif name=arrownames border=0 onClick="changedirection()">
<!-- Man, I forgot to add onClick and function, lol, I need to stop making these mistakes, heh. -->
</body>
</html>


Man, next time, I should go straight to the point, I take so long others would already beaten me by now lol. Anyways, that's basically how to keep the images to switch direction everytime you click on it. Enjoy :)!
dotnetanimal
01-02-2003, 08:24 PM
onclick="sortTable('name', 'asc'); changedirection()" src="images/icon_sortUP_on.gif" name="arrownames" id="sortUP">

Do I have to pass anything to the function changed direction?

Sorry for the stupid question just trying to make sure I am doing this right :)
ChikoritaPro
01-02-2003, 08:28 PM
Not a dumb question at all :)! Anyways, nope, to alter pictures on alternate clicks, you don't need to return anything :)! I don't know if sortTable() is a function or a real method, but I am sure that you only need one function to switch directions :cool: !