Question

我有一个菜单，其中包含所有链接的父项以及处理的子项和子子项：悬停以打开下拉子项。

每个项目（父母和孩子）也有联系。一切都在桌面上正常工作，因为鼠标悬停在父项上，下拉列表打开，我可以选择单击父项链接或鼠标悬停时出现的下拉列表之一。

问题出在平板电脑设备上。在这种情况下，如果我点击父项，那么它只是将我重定向到此菜单项的链接，而不是打开包含子项的下拉列表。

因此，对于平板电脑，我会有一个双击父母（以及子母公司）：首先点击父项打开下拉列表，第二次点击总是在父项上触发它的链接。

提前致谢。

Answer 1

悬停功能仅适用于桌面。对于标签和手机，您必须使用jQuery / Javascript

来使用点击功能

示例：

<style>
    li ul{display:none;}
</style>

<ul class="parent">
    <li>
        <a href="#">Home</a>
        <ul class="child">
            <li>Home1</li>
            <li>Home2</li>
            <li>Home3</li>
        </ul>
    </li>
    <li>
        <a href="#">About</a>
        <ul class="child">
            <li>About1</li>
            <li>About2</li>
            <li>About3</li>
        </ul>
    </li>
</ul>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("ul li").click(function(){
       $(".child").hide();
       $(this).find(".child").show();
    });
});
</script>

下拉菜单与平板电脑上的父级链接问题

1 个答案: