jquery - Simultaneously toggling 2 divs in 1 container + 2 in another container -
i'm not sure how search this: on gallery page want able toggle image between original size , 2x clicking on but also clicking zoom button in container changes state (indicating can either zoom in or out in concordance image div current state)
i got far toggling image clicking or button don't know how toggle button.
thanks.
you can use jquery toggleclass(). example http://jsbin.com/uhiguv/1/edit
and using hasclass can target elements specifically. example: http://jsbin.com/uhiguv/2/edit
<!doctype html> <html> <head> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <meta charset=utf-8 /> <title>js bin</title> <style> .image.active{width:64;height:64;} .active{border:2px solid black;} </style> </head> <body> click image or button<br><br> <img class="ctrl image" src="http://www.gravatar.com/avatar/f9dc5de7822b1679d7133691ec616174?s=32&d=identicon&r=pg"> <br><button class="ctrl button">grow</button> <script> jquery(function(){ $('.ctrl').bind('click', function(){ $('.ctrl').toggleclass('active'); if ($('.ctrl.button').hasclass('active')) { $('.ctrl.button').text('shrink'); } else { $('.ctrl.button').text('grow'); } }); }); </script> </body> </html>
Comments
Post a Comment