[Solved] Fade out/in sperate divs with button click [closed]

by


Your question is very vague, but hopefully this example will get you started in the right direction: http://jsfiddle.net/3mJ3z/

Basically, there are 3 menu items, and 3 corresponding content items. When you click the menu item, all the other content items disappears and the corresponding content item fades in. The HTML:

<div class="item-1 content-item">
    I am the content for item 1
</div>

<div class="item-2 content-item" style="display: none;">
    I am the content for item 2
</div>

<div class="item-3 content-item" style="display: none;">
    I am the content for item 3
</div>

<ul>
    <li class="change-item" data-item="1">Item 1</li>
    <li class="change-item" data-item="2">Item 1</li>
    <li class="change-item" data-item="3">Item 1</li>
</ul>
​

The JS:

$('.change-item').click(function(){
    var this_item = $(this).attr("data-item");
    $('.content-item').hide();
    $('.item-' + this_item).fadeIn();
});​

2

solved Fade out/in sperate divs with button click [closed]