-
Switch Menu - Questions
I am using the switch menu from http://www.dynamicdrive.com/dynamici...switchmenu.htm
1. Is it possible to have an image change everytime you click the menu? For example, when you look at our website, the navigation on the left, there are [+] signs before each menu, I would like them to go to [-] signs when they are clicked.
www.masd.info
2. I would like to have some kind of expand all feature, I made up one real quick, but it does not work real well.....you will see if you play with the menu a little. This is what I came up with
Code:
<div class="menutitle" onMouseOver="stm(Text[2],Style[1])" onMouseOut="htm()" onclick="SwitchMenu('sub1')">
<div onclick="SwitchMenu('sub2')">
<div onclick="SwitchMenu('sub3')">
<div onclick="SwitchMenu('sub4')">
<div onclick="SwitchMenu('sub5')">
<div onclick="SwitchMenu('sub6')">
<div onclick="SwitchMenu('sub7')">
<div onclick="SwitchMenu('sub8')">
<div onclick="SwitchMenu('sub9')">
<div onclick="SwitchMenu('sub10')">
<div onclick="SwitchMenu('sub11')">
<div onclick="SwitchMenu('sub12')">
<div onclick="SwitchMenu('sub13')">
<div onclick="SwitchMenu('sub14')">
<div onclick="SwitchMenu('sub15')">
<div onclick="SwitchMenu('sub16')">
<span class="titlelink">
<center>Full Menu </center></span>
</div></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div>
Its kind of a cheap quick way to do it. But if you already have one menu open, and you click the "Full Menu" button, it will close the menus you have open, and open the menus you have closed. I would like it to open them all.
3. And you may also see, I have a script that someone wrote in there that allows me to have multiple menus open at the same time, I would like to keep that.
Thanks
-Paul Travis
www.montroseareasd.k12.pa.us
-
Here's an open all that shouldn't interfere with anything:
Code:
function openAll(){
var ar = document.getElementById("masterdiv").getElementsByTagName("span");
for (var i=0; i<ar.length; i++)
if (ar[i].className=="submenu") //DynamicDrive.com change
ar[i].style.display = "block";
}
I'll have to look into the image question, should be doable.
-
2 Attachment(s)
Give this a shot. You will need a minus image:
Attachment 353
Here's the code, if the name of your plus image changes, you will have to change the part that says 'arbo-plus' in the openAll() and the SwitchMenu() functions as well as the path and filename to it in the configuration area where you need to set the path and filename for the minus image as well:
Attachment 354
Note: I changed the calls like SwitchMenu('sub12') to like so:
Code:
onclick="SwitchMenu('sub12', this)"
and the entire 'Full Menu' bit.
-
Thank you!
Thats exactly what I needed!!! Your a great help, I noticed throughout this forum you help many people.
-Paul
www.montroseareasd.k12.pa.us
-
Another Question
I have another question, is there a way for me to force a block to be expanded when a user goes to a page?
You can see on our website, [www.masd.info], under the District Activites menu, there is an Employment link and on the right of that link it says NEW!. I wrote a php script that puts that "NEW" there when ever there are new job listings. I want users to be able to see that.
So I would like that District Activites block to be expanded everytime a user goes to that page. I can make a php script to execute the javascript to expand that block when ever there is a new job listing.
Please help
Thanks
-Paul Travis
www.montroseareasd.k12.pa.us
-
I found how I would do it, I would use onload in the <body> syntax.....but now what I need to know is how to do Multiple onloads
How would I set that up with what I have already?
-
I tried to do this, the way the website is setup, is there is a header file that contains all the navigation, and there is php in that file that decides which page gets which menu blocks
The header file is the same on every page throughout the website, now what I would like to do is when a page is loaded, have block 12 already expanded, and I would also like to have block 4 already expanded. But according to the php I wrote, block 4 and block 12 are on separate pages, they are never on the same page.
So when I put this in the header file
Code:
<body bgcolor="#ffffff" onload="SwitchMenu('sub12'); SwitchMenu('sub4')">
Block 12 expands fine when you are on a page that has block 12, but when you are on a page with block 4, it does not expand.
The reason why I think it is not expanding is because there is an error. When I am on a page that has block 4 and not block 12 I still tries to expand block 12 even though it isn't there, it just stops and does not attempt to expand block 4
This probably seems really confuseing....if you are confused....let me know...i will try to refrase it
-Paul
www.montroseareasd.k12.pa.us
-
It is confusing but, did you try reversing the order of the calls?
This would not avoid an error on the page with no sub12 but, it should get it to work, if it does (even if it doesn't) then you could do like so:
Code:
onload="SwitchMenu('sub4'); if(document.getElementById('sub12')){SwitchMenu('sub12')}"
Ideally, it would be something like so:
Code:
onload="if(document.getElementByID){ if(document.getElementById('sub12')){SwitchMenu('sub12');}else {SwitchMenu('sub4');}};"
Or, perhaps better still done in a script block in or in a script linked to the head of the page(s). The code could then look like so:
Code:
if(document.getElementById)
onload=function(){
if(document.getElementById('sub12'))
SwitchMenu('sub12');
else
SwitchMenu('sub4');
}
-
What does
Code:
document.getElementByID
do? when I put it the code you wrote in my page, nothing happens with the menu when I load it in the browser.
-
That was a typo. I will correct it in the above if the posts are still editable. Anyways, it should be:
document.getElementById
not:
document.getElementByID
sorry about that.
It (if written correctly), gets the element from the document that has the given id.
-
Thats alright, I don't know how much php you understand, but this is what I came up with and it seems to work
Code:
<html>
<head>
...
</head>
<body <?php
if (strstr(dirname($_SERVER['PHP_SELF']),"/schools/lathrop") && ([function that checks for new pictures])){ echo "onload=\"SwitchMenu('sub4')\"";}
elseif (strstr(dirname($_SERVER['PHP_SELF']),"/schools/choconut") && ([function that checks for new pictures])){ echo "onload=\"SwitchMenu('sub6')\"";}
elseif (strstr(dirname($_SERVER['PHP_SELF']),"/schools/highschool") && ([function that checks for new pictures])){ echo "onload=\"SwitchMenu('sub8')\"";}
elseif (strstr(dirname($_SERVER['PHP_SELF']),"/athletics") && ([function that checks for new pictures])){ echo "onload=\"SwitchMenu('sub9')\"";}
elseif (is_current_news("employment")){echo "onload=\"SwitchMenu('sub12')\"";}?>>
...
All the menu stuff
</body>
<html>
But my problem now is when the page loads, it does not change the [+] to a [-]. You can see on the website, www.masd.info, that the symbols are backwards.
In the part of the php where it says [ echo "onload=\"SwitchMenu('sub4')\" ], that is the part that puts that line of code in the body syntax. I changed it to [ echo "onload=\"SwitchMenu('sub4', this)\" ] to see if it would change the image. Note: the [, this]. This did not work. Do you have any ideas?
-Paul
www.montroseareasd.k12.pa.us
