I have jquery tabs setup on a page and they work fine. I'm trying to make it so that when a user clicks on a tab, info appears in the main-content area below the tab, but also in the sidebar....The main-content div and the sidebar div are not wrapped together....
example: if a user clicks 'investment consulting' - I want the investment consulting info to appear below the tab, but I also want the pricing to show up in the sidebar. There are 2 main tabs, 1 for investment consulting and 1 for broker consulting, so the pricing would change in the sidebar for each tab....
I have the page live at the following URL:
http://www.rxaftermath.com/nyc-reale...onsulting.html
I tried binding some elements in the javascript, and though the correct pricing showed up when the tab was clicked, the other info disappeared. Im sure its my code since im a jquery noob....Any help would be greatly appreciated!! even just a point in the right direction.......
heres my javascript
:
Code:
$(document).ready(function() {
//When page loads...
$(".tab_content").hide(); //Hide all content
$("ul.tabs li:first").addClass("active").show(); //Activate first tab
$(".tab_content:first").show(); //Show first tab content
//On Click Event
$("ul.tabs li").click(function() {
$("ul.tabs li").removeClass("selected"); //Remove any "active" class
$(this).addClass("selected"); //Add "active" class to selected tab
$(".tab_content").hide(); //Hide all tab content
var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
$(activeTab + "_price").show(); //Fade in the active ID content
return false;
});
});
thanks!