css - Foundation topbar is_hover false 仅适用于触摸设备

Question

我想要一个在非触摸设备上悬停并在触摸设备上点击的顶部栏。

我是这样实现的:

 <nav class="top-bar show-for-touch" data-topbar role="navigation" data-options="is_hover: false">
        <!-- menu -->
 </nav>
 <nav class="top-bar hide-for-touch" data-topbar role="navigation" data-options="is_hover: true">
        <!-- menu -->
 </nav>

但是，必须有一种更简洁的方法来做到这一点，而无需将整个菜单重复两次，我已经搜索了文档和在线，但没有找到任何东西。

Answer 1

CSS

:hover

将在非触摸设备上作为悬停工作，在触摸设备上仍然作为点击或点击工作......如果我没记错的话