• 文字サイズ


解決済

メインメニューを開くとサブメニューも開いてしまう

  • 相談者:非公開
  • 2020/12/03 18:05
いつもお世話になっております。

スマホ画面でハンバーガーメニューを開くと中のサブメニューも一緒に開いてしまいます。
サブメニューは『商品一覧』の横にある十字ボタンで開くようにしたいのですが、
たぶんjsでheader全体のis-activeが開くようになっているのが原因なような気がするのですが、
現在使用しているやり方以外で方法が浮かびません。
なにか他に参考になるような方法がございましたら、ご教示していただきたいです。
キーワード:CSSWEBデザインメニュー開閉js
投稿内容について報告する
今気になってる疑問、
セミナーに参加すれば解決するかも!?
2020年は4月から毎週オンラインにて開催し、1900社が参加された90分で学べる楽天集客対策セミナーですが、アップデートをして2021年も開催いたします。

  • 返信者:非公開
  • 2020/12/04 13:15
ECマスターズの田中です。

サブメニューを開くためのスタイルシートが

.is-opened .l-gnav_child { display: blo………(省略)………
  • 返信者:非公開(質問者)
  • 2020/12/04 15:58
ご回答ありがとうございます。
ご教示いただいた設定どおり、コードの方を組みなおしましたら
別々に開閉されるようになりました!

重ねてのご質問で大変恐縮………(省略)………
  • 返信者:非公開
  • 2020/12/04 19:42
ECマスターズの田中です。

transitionを利用する際、
displayプロパティの切り替え(noneとそれ以外)を行っていると
アニメーション………(省略)………
  • 返信者:非公開(質問者)
  • 2020/12/06 10:27
ご回答ありがとうございます。
.header_navのdisplayプロパティを削除して、実装しましたら
アニメーションは実現できたのですが、パソコン表示に………(省略)………
  • 返信者:非公開
  • 2020/12/06 11:29
ECマスターズの海老塚です。

ご返信誠にありがとうございます。

休み明けに確認し、担当よりご回答させていただきます。
今しばらくお待ちいただきます………(省略)………
  • 返信者:非公開
  • 2020/12/07 11:49
ECマスターズの田中です。

テストページを確認したところ、
PC表示の .header_nav に
opacity: 0; が適用されていることが原因………(省略)………