Question

如何在手机上制作可点击的父下拉列表（手风琴菜单）链接。当我点击父链接时，只有钻取或手风琴菜单切换，不能点击lparent链接。我使用基础zurb 6.

<ul data-accordion-menu class="vertical menu">
      <li><a href="parent.html">should be clickable on mobile</a>
        <ul class="menu vertical">
          <li><a href="#">link 1</a></li>
          <li><a href="#">link 2</a></li>
        </ul>
      </li>
</ul>

Answer 1

我不确定您为什么要这样做，但您可以使用一些JavaScript来实现这一目标。

$(document).on('click', '.is-accordion-submenu-parent', function (e) {
    if (Foundation.MediaQuery.is('small only')) {
        var $submenu = $(this).children('[data-submenu]');
        if ($submenu.length) {
            $submenu.remove();
            location.href = e.target.getAttribute('href');
        }
    }
});

此代码仅针对小屏幕尺寸触发：

if (Foundation.MediaQuery.is('small only'))

它将从DOM中删除子菜单（因为您被重定向到另一个页面，所以无论如何都不需要它）并将您重定向到位于父href属性中的页面。

如何制作可点击的父链接手风琴菜单

2 个答案: