lundi 23 mars 2015

3 button Jquery on/off and both on/off


I have 3 buttons: button 1, button 2 and button 3. button 1 toggles show/hide of the left side. button 2 does the same but does the right side. Button 3 does both sides. What is the right way to do this?


http://ift.tt/1xXVSiL



<div id="list-map-button" class="btn map-btn">LIST</div>
<div id="map-map-button" class="btn map-btn">MAP</div>
<div id="both-map-button" class="btn map-btn map-btn-active">BOTH</div>
<br style="clear:both;"/>
<div class="container">
<div id="left_side">
map side
<div id="block-3">Block 3</div>
<div id="block-4" class="not-active-block">Block 4</div>
</div>
<div id="right_side">
list side
<div id="block-5">Block 5</div>
<div id="block-6" class="not-active-block">Block 6</div>
</div>
<br style="clear:both;"/>
</div>

$(document).ready(function(){
$( "#both-map-button" ).click(function() {
//alert('clicked both button');
$("#block-4, #block-3, #block-5, #block-6").hide();
$("#block-4, #block-3, #block-5, #block-6").addClass("acvite-btn");

$("#block-4, #block-3").show();
$("#block-5, #block-6").show();

});
$( "#map-map-button" ).click(function() {
//alert('clicked map button');
$("#block-5").toggle();
$("#block-6").toggle();
});
$( "#list-map-button" ).click(function() {
//alert('clicked list button');
$("#block-4").toggle();
$("#block-3").toggle();
});
});




Aucun commentaire:

Enregistrer un commentaire