Newbie help for "Simple Tabs w/ CSS & jQuery"
Hi All,
I'm kinda new to Web Development (knowing just enough of CSS & HTML to be dangerous)...but little or nothing of jQuery/JS to do anything at all.
So anyways, I picked up this great piece of work from http://www.sohtanaka.com/web-design/simple-tabs-w-css-jquery/#comment-14970 (thanks to Soh Tanaka) and it works just great "as-is".
Now, the thing is...I'm trying to modify it to allow for a link (within the content of a selected tab) to change to a different tab (instead of having to click on the required tab itself). So for instance, if we're on the "Gallery" tab and there's a link there which says "Contact us for more information", then clicking that link should take us to the "Contact" tab, and highlight the tab itself i.e. make it white/selected.
Even with my limited knowledge of JS/jQuery, I have been able to modify the stock code (modified code in text format attached to this post) to allow for a link to call up the required tab/content....however, I have absolutely no idea how to get the newly selected tab to be highlighted (or changed to white, to show that it's the one currently selected).
So this is where I need the help of the experts here.
And if this something too easy for any/all of you, then I'd like to throw in the following challenge/stretch-your-thinking request:
- Upon clicking the link, the user must not just be taken to the top of the required tab, but rather to a named anchor, somewhere in the middle or towards the lower portion of the page. In other words, if the "Contact Us" page has a whole lot of "blah blah blah" towards the top, and the actual Contact Us form is below the fold, then upon click the link "Contact us for more information" the user should be taken right to the straight to the form, which happens to be below the fold, on the Contact page.
Hope that's clear (and challenging) enough.
Thanks all, and appreciate the help.
CeeGee