I am using jquery Spry Sliding panels for a new site i am working on. I am looking to style similarly to this example in particular I am trying to find a way to give the navigation links (which will eventually be imgs) an active state (whichever link is currently selected-I wish it to have a different image and same for mouseover) as on the coda website.
I'm quite new to javascript, and having read similar articles on the forum have tried different suggestions, but as my mark-up is quite different in the first place to these with similar problems, haven't been able to find a solution for myself.
From looking at my mark-up below, would the best solution be to use CSS or javascript or both to allow for different active link states?
Here is my html script for the navigation:
Expand|Select|Wrap|Line Numbers
- Navigate by index:
- <a href="#" onclick="sp2.showPanel(0); return false; switchColors(this,'green'); ">ssdfsdfsdfsll</a> |
- <a href="#" onclick="sp2.showPanel(1); return false;">Engineering & Environmental</a> |
- <a href="#" onclick="sp2.showPanel(2); current = $this.parent().index();
- return false;">Financial</a> |
- <a href="#" onclick="sp2.showPanel(3); return false;">Sustainability</a> |
Here is the SprySlidingPanels.js
Many Thanks in advance to anyone who can help me find a solution.
Best,
Sarah