Hi all,
I'm building a web site for a department at my university and I'm experimenting with javascript in the process. It's new to me, I must warn you. Here's what I'm trying to do:
I have a vertical navigation menu that I want to be part of a Dreamweaver template. I'm using preloaded rollover images for the menu with a simple javascript function that swaps the image on 'onmouseover' and 'onmouseout'. I would like to add extra functionality to my function so that the menu button that is linked to the page currently open is a different color. I want it to work like this:
- When a user is on page X, the button for page X is red (there's always at one one button that is red at a time since that indicates that it is the page currently open)
- If the user clicks on the menu button for page Y, the function switches page X's button back to its original color before it became red and the menu button for page Y will be red when page Y is opened
Of course I could do this by repeating code for the menu on every page but I'm using Dreamweaver templates and want the code for the menu to be part of the template to eliminate as much redundancy as possible and I'm trying to figure out the best way to do it. Is there a way for the function to detect what page is currently viewed, what page corresponds to the button just clicked on by the user, and load the appropriate buttons accordingly?
Cheers,
Omelas
2 Replies - 672 Views - Last Post: 09 January 2010 - 10:16 PM
#1
Javascipt function that checks current page in dwt template code
Posted 04 January 2010 - 02:16 AM
Replies To: Javascipt function that checks current page in dwt template code
#2
Re: Javascipt function that checks current page in dwt template code
Posted 04 January 2010 - 10:50 AM
Here's an idea–you could add a function to the template that gets the page's location (window.location) and then loops through the navigation elements, checking the link addresses against the address of the current page. And if the addresses match, that means that the user is on that page. Then you can change the css class of that element or something.
A problem you might run into is this: window.location is the full url ("www.x.com/a/b/c.html") while the link might be a relative url ("/a/b/c.hmtl")
A problem you might run into is this: window.location is the full url ("www.x.com/a/b/c.html") while the link might be a relative url ("/a/b/c.hmtl")
#3
Re: Javascipt function that checks current page in dwt template code
Posted 09 January 2010 - 10:16 PM
I actually ended up finding a cool way to do this using only CSS. See item 10 on the following page:
http://www.webcredib...ss-tricks.shtml
Thanks for the help,
Omelas
http://www.webcredib...ss-tricks.shtml
Thanks for the help,
Omelas
Page 1 of 1
|
|

New Topic/Question
Reply



MultiQuote



|