Changing Images - JS
http://rules.swcombine.com/rulesmenu/
What would the JS code be for making the + sign change to a - sign image when the menu is opened then back to a + when it is closed?
The JS for the page is as follows, where would the change image code go in this:
<script language="JavaScript1.2">
//Show Images//
function showLayer(layerName){
obj = document.getElementById(layerName);
obj.style.visibility="visible";
}
//Hide Images//
function hideLayer(layerName){
obj = document.getElementById(layerName);
obj.style.visibility="hidden";
obj.style.display="none";
obj.style.height="0"
}
//Show and Hide Categories
function ChangeLayer(layerName){
obj = document.getElementById(layerName);
if (obj.style.display == "block"){
obj.style.display="none";
obj.style.height="1";
}
else{
obj.style.display="block";
obj.style.height="0";
}
}
</script>
dk01 posted this at 08:58 — 26th January 2003.
He has: 516 posts
Joined: Mar 2002
I can't visualize what yoou are after but maybe this tutorial will help some: http://www.conxiondesigns.com/tutorials/javascript/hideshow/
-dk
Khanny posted this at 10:01 — 26th January 2003.
They have: 51 posts
Joined: Dec 2002
sorry, didn't explain it well.
Go to the menu on the right hand side. Go down to the heading ::Rules::
It should have some links below it like 'General' 'The Universe' etc and to the right of those links should be little images with a plus sign on them.
Click on one of the links in the ::Rules:: category and you'll see it expands out but the little plus image remains the same.
What i'm after is to make it so that when you click on a topic and it expands out the plus image turns into a minus image (already got the minus image) and then when you close it it turns back to the plus image.
Busy posted this at 10:07 — 26th January 2003.
He has: 6,151 posts
Joined: May 2001
menu dosen't work (expand) in Opera6 or mozilla
Khanny posted this at 10:15 — 26th January 2003.
They have: 51 posts
Joined: Dec 2002
gah, pretty much everything JS i've tried has never worked in Opera. Given up on it.
Not to worried bout Opera, not many of our players use that browser.
Abhishek Reddy posted this at 10:23 — 26th January 2003.
He has: 3,348 posts
Joined: Jul 2001
Works partially in Moz 1.2 for me. Menu expands, but height is added on each time when collapsing and expanding.
The code is quite a mess. I suggest you validate and try doing it with CSS/lists first. dk's tutorial is a good lead. Also check out http://www.dynamicdrive.com/dynamicindex1/navigate1.htm.
Khanny posted this at 11:01 — 26th January 2003.
They have: 51 posts
Joined: Dec 2002
this is prolly just my total lack of JS knowledge but how do I get it to show the minus image after it's hidden the plus one
http://rules.swcombine.com/rulesmenu/hidetest.htm
Abhishek Reddy posted this at 11:06 — 26th January 2003.
He has: 3,348 posts
Joined: Jul 2001
Rather than changing visibility of "plus", change its .src to arrowminus.gif or whatever your minus image is called. Then change it back to arrowplus.gif instead of making it visible.
Khanny posted this at 11:12 — 26th January 2003.
They have: 51 posts
Joined: Dec 2002
*frowns*
General
You mean change it to this?:
General
Abhishek Reddy posted this at 11:43 — 26th January 2003.
He has: 3,348 posts
Joined: Jul 2001
Nope. More like this:
<?phpif(aLs(ID).src == \"arrowplus.gif\")
{
aLs(ID).src = \"arrowminus.gif\";
}
else if(aLs(ID).src == \"arrowminus.gif\")
{
aLs(ID).src = \"arrowplus.gif\";
}
?>
Khanny posted this at 11:53 — 26th January 2003.
They have: 51 posts
Joined: Dec 2002
hmm now it doesn't do anything:
http://rules.swcombine.com/rulesmenu/hidetest.htm
Khanny posted this at 14:27 — 26th January 2003.
They have: 51 posts
Joined: Dec 2002
gah, have spent 4 hours trying to get a bunch of different change image onClick scripts to work but can't
dk01 posted this at 21:49 — 28th January 2003.
He has: 516 posts
Joined: Mar 2002
if(aL(ID).src == "arrowplus.gif")
{
aL(ID).src = "arrowminus.gif";
}
else if(aL(ID).src == "arrowminus.gif")
{
aL(ID).src = "arrowplus.gif";
}
Try that instead. It might work. aLs is the divobject.style property aL is the divobject itself.
-dk
Khanny posted this at 03:53 — 29th January 2003.
They have: 51 posts
Joined: Dec 2002
found a bloke to program it for me, cheers
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.