質問: $(window).width(); if (x <= ws ) { $('#header').hide(); $('#m_visual').hover( function(e){ $('#header').slideDown(); }, function(e) { $('#header').slideUp(); }); } }); ``` ### 試したこと 上記以外にも試したのですがうまくできなくて ずっとハマっています。 すみません、どうか教えていただけないでしょうか。 よろしくお願い致します。
回答: 下の試行したコード例で試してみました(PCブラウザです)が、 初期表示時に768以下なら常に表示された状態で動作できました。 なので別問題が発生しているのではないでしょうか。 もしも、ブラウザのサイズを可変したときも対応したいのであればまた別の対応が必要になりますが。。。 ※以下、追記 可変対応ちょっと書いてみました。 サイズの拡大縮小時にslideDown・slideUpするとおかしくなりますので注意してください。 (サイズ変更するたびに実行されるため) ``` $(function() { // windowのサイズ判定用 var hoge = function(){ var x = 768; var ws = $(window).width(); if (x <= ws ) { return true; } else{ return false; } } if ( hoge() ) { $('#header').hide(); } $('#m_visual').hover(function(e){ if ( hoge() ) { $('#header').slideDown(); } }, function(e) { if ( hoge() ) { $('#header').slideUp(); } }); // サイズ縮小時に#headerを表示するし、拡大時に非表示にする $(window).resize(function(){ console.log("リサイズしました"); if(hoge()){ $('#header').hide(); } else{ $('#header').show(); } }) }); ```