問題点
javascript
1$(document).on('click', '.menu-trigger', function(){
2 $('html').toggleClass('active');
3 return false; ← ここでreturn false;しているので、以降の処理がなにもされません。
4});
5
6// look
7$(document).on('click', '.look-trigger', function(){
8 $('html').toggleClass('open');
9 return false;
10});
jQueryのreturn false;は、イベントの伝播と要素のイベント処理、両方を終わらせます。
詳しくは以下を読むとわかります。
jQeryイベント
以上のことを踏まえて、いかに解決策を書きます。
解決策
html
1<a class="look-trigger" href="javascript:void(0);"></a>
2<a class="menu-trigger" href="javascript:void(0);"><div id="menu-arrow"></div></a>
javascript
1$('.menu-trigger').on('click', function(e){
2 e.preventDefault();
3 $('.look-trigger').toggleClass('active');
4});
5$('.look-trigger').on('click', function(e){
6 e.preventDefault();
7 $('#menu-arrow').toggleClass('open');
8});
<a href="javascript:void(0);">
⇒こうするとデフォルトになにもしなく、なります。
$('.menu-trigger')
⇒クリックしたい要素をセレクターで拾います。
e.preventDefault();
⇒イベントをブラウザに通知しなくなります。
aタグなら、hrefに遷移する動作をしなくなります。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/10/01 09:47
退会済みユーザー
2016/10/01 09:54
退会済みユーザー
2016/10/01 10:04 編集
2016/10/01 10:06
2016/10/01 10:07
退会済みユーザー
2016/10/01 12:33