###前提・実現したいこと
見た目的なだけでなく可変対応させたいです。
リロードするタイプはできるのですが、
シンプルな方法でリサイズ対応をしたいです。
###発生している問題
PC表示からはじめて480px以下にすると、
見た目的にはリストは非表示になるのですが、
クリックしても動かない(当然ですが)
スマホ表示(480px以下)でリロードすると
動くのですが、PCサイズにリロードしても
見出しをクリックすると動いてしまいます。
できれば今後のためにもコードをシンプルに
したいのですが、できず困っております。
###該当のソースコード
リロードが必要なタイプ
$(function(){ var x = 480; var ws = $(window).width(); if (ws <= x) { $( ".fnavi h4" ).click(function(){ $(this).next("ul").slideToggle(); $(this).toggleClass("active"); }); } });
###上記コードに対して試したこと
他にもいろいろやってみたのですが、
何度も上書きしてしまってとりあえず
今朝やってみたものを下記に挙げています。
$(function() { $(window).resize(function() { var x = 480; var ws = $(window).width(); if (x <= ws ) { $( ".fnavi h3" ).click(function(){ $(this).next("ul").slideToggle(); $(this).toggleClass("active"); }); } }) });
$(function() { var display = function(){ var x = 480; var ws = $(window).width(); if (ws <= x ) { return true; } else{ return false; } } if ( display() ) { $(".fnavi .vl_box ul").hide(); } $( ".fnavi h3" ).click(function(){ $(this).next("ul").slideToggle(); $(this).toggleClass("active"); }); $(window).resize(function(){ if(display()){ $(".fnavi .vl_box ul").hide(); } else{ $(".fnavi .vl_box ul").show(); } }) });
師走の忙しい時にすみませんが、よろしくお願い致します。
回答1件
あなたの回答
tips
プレビュー