web-dev-qa-db-ja.com

メインメニューが2行に分かれるときに、メインメニューバーからオフキャンバスメニューに切り替えをトリガーしますか?

私は3つの言語のウェブサイトを持っているので、メインメニューがすべての言語で同じスペースを取るわけではありません。そのため、メインメニューの単語が一部の言語で長くなると、メインメニューが2行に分割されるため、回避する必要があります。メインメニューバーが私のキャンバス外のメニューに切り替わるようにコード化する方法はありませんか?

2
Joe

実際にCSSを介して方法を考え出した。次のコードをカスタムCSSフィールドに入力するだけです。

@media (max-width:1210 px){
  .sp-megamenu-parent > li > a {
    display:none;
  }
  #offcanvas-toggler {
    display: block!important;
  }
}

ご了承ください:

  • これにより、メガメニューの親が非表示になり、オフキャンバストグラが1210px以下の画面サイズで表示されます(これは、メインメニューの中で最も長いサイズの言語で完全に最も長いサイズです)。
  • .sp-megamenu-parent > li > aおよび#offcanvas-togglerは、メインメニューとオフキャンバスメニューのcss名です。物事を同じようにうまく機能させるために、自分のものを入力してください。
2
Joe