Question

我的网站上有一个下拉导航菜单，工作正常。但是在移动设备上，当用户点击任何菜单项时，它们会在几分之一秒内显示子菜单，然后自动重定向到父链接。我想要一个第一次点击父链接打开子菜单的功能，第二次点击将用户重定向到父链接。我想要一些如下所述的内容：http://osvaldas.info/drop-down-navigation-responsive-and-touch-friendly

但是，我只想要双击功能。我已经实现了插件但它仍然不适合我：/我的下拉菜单用HTML和CSS编码。

<ul class = "dropdown">
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a>
        <ul class="sub-menu">
           <li><a href="#">Sub Link</a></li>
            <li><a href="#">Sub Link</a></li>
            <li><a href="#">Sub Link</a></li>
        </ul>
    </li>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
</ul>

编辑：这是我的CSS下面。我尝试使用上面链接中的jQuery插件doubleTapToGo.js，但它不起作用。

ul.dropdown,
ul.dropdown li,
ul.dropdown ul {
 list-style: none;
 margin: 0;
 padding: 0;
 font-size:11px;
 position: relative;
 float: left;
}


ul.dropdown li.hover,
ul.dropdown li:hover {
 position: relative;
 cursor: default;
}

ul.dropdown ul {
 visibility: hidden;
 position: absolute;
 top: 100%;
 width: 100%;
}

ul.dropdown ul li {
 float: left;
 border-bottom:1px solid #000; 
 padding-bottom:0px;
 margin-bottom:0px; 
}


ul.dropdown li:hover > ul {
 visibility: visible;
}

下拉菜单会自动重定向到移动设备上的父链接

0 个答案: