I have a menu with seven items. If you click the first item, div one shows. If you click any other item (2 through 7) div two shows. That's what I'm looking to do.
I'm new at all this but am pretty sure it's an if/else function, such that if I click on <a id="1">
, show the first div, else show the second div. I suppose I can do a hide/show to get back to the first div.
I'm going to keep poking around, but if I can't find it, any help is surely appreciated.
<div id="one">
Div contents (has a jquery slider in it)
</div>
<div id="two">
Div contents (contents chosen by user from menu items, below)
</div>
<!--menu-->
<a href="#" id="first_panel"><!--has slider controlled within div-->
<a href"#" id="data_part_one"> </a>
<a href"#" id="data_part_two"> </a>
<a href"#" id="data_part_three"> </a>
...
<a href"#" id="data_part_six"> </a>
Where the data from menu items two through seven will appear in div two.
I got it to work with the code, below. If it's ugly, show me the error of my ways and I'll thank you.
$("#thumbs a").click(function() {
if ($("#t0").is("")) {
$("#open_panel").show();
}
else
{
$("#open_panel").hide();
$("#res_panel").show();
}
});
$('#t0').click(function() {
$('#open_panel').show();
$('#res_panel').hide();
});