4

モバイル デバイスの限界点で、Foundation 6 レスポンシブ メニューをドロップダウン メニューからドリルダウン メニューに切り替えるにはどうすればよいですか?

Foundation ドキュメントの最後の例は、中規模または大規模なビューでは期待どおりに機能しますが、小さなビューでも水平メニューが表示されます!!

基本的に、古い Foundation 5 メニューと同じようにメニューを動作させるにはどうすればよいですか?

このマークアップはほとんど機能し、ドリルダウンも少し機能しますが、メニュー項目はまだ水平に並んでいます。

<div class="title-bar" data-responsive-toggle="example-menu" data-hide-for="medium">
  <button class="menu-icon" type="button" data-toggle></button>
  <div class="title-bar-title">Menu</div>
</div>

<div class="top-bar" id="example-menu">
  <div class="top-bar-left">
    <ul class="dropdown menu"  data-responsive-menu="drilldown medium-dropdown" >
      <li class="menu-text">Site Title</li>
      <li>
        <a href="#">One</a>
        <ul class="menu vertical">
          <li><a href="#">One</a></li>
          <li><a href="#">Two</a></li>
          <li><a href="#">Three</a></li>
        </ul>
      </li>
      <li><a href="#">Two</a></li>
      <li><a href="#">Three</a></li>
    </ul>
  </div>
  <div class="top-bar-right">
    <ul class="menu">
      <li><input type="search" placeholder="Search"></li>
      <li><button type="button" class="button">Search</button></li>
    </ul>
  </div>
</div>
4

1 に答える 1

3

dropdownからクラスを削除し、クラスとリスト<ul>を追加して、次のようにします。verticalmedium-horizontal

<ul class="vertical medium-horizontal menu" data-responsive-menu="drilldown medium-dropdown">

更新:レスポンシブ メニューのドロップダウン矢印とサブメニューの折りたたみ方向に関連するバグfoundation-sites 6.2.0は、 のリリースで修正されました。

関連 SO 質問: Foundation 6 data-responsive-menu パラメーター

于 2016-01-29T22:29:18.050 に答える