クリックでclassを付けたり消したりする
jQueryを用いてクラスを付けたり消したりする。
.toggleClassを使用します。
開いたり閉じたりするメニューを作る時に大変お世話になっています。
html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | <style> #sample > p { color:#000; text-align:center; background:#ddd; -webkit-transition:.3s; transition:.3s; } #sample > p.on { color:#fff; background:#13B8FA; } </style> <body> <div id="sample"> <p></p> </div> </body> |
js
1 2 3 4 5 | $function(){ $("#content > p").click(function(){ $(this).toggleClass('on'); }); }); |
クリックして下さい
