我试图在用户离开菜单悬停后将其延迟 15 秒。我只想使用 css 而不是 Javascript 来做到这一点。可能的?是的,当用户将鼠标悬停在它上面时,当光标静止几秒钟时,菜单就会消失。
尝试过:
ul.dropdown-menu li { transition:
0s background-color;}
ul.dropdown-menu li a:hover {
transition-delay: 15s; }
不起作用。
<div class="collapse navbar-
collapse navbar-ex1-collapse">.
<ul
id="menu" class="menu"><li
id="menu-item-1496"
class="menu-
item menu-item-type-post_type
menu-
item-object-page menu-item-home
current-menu-item page_item
page-
item-19 current_page_item menu-
item-has-children menu-item-
1496
dropdown active"><a
title="Home"
href="https://adsler.c
o.uk/">Home
</a><span class="dropdown-
toggle
shapely-dropdown" data-
toggle="dropdown"><i class="fa
fa-
angle-down" aria-
hidden="true">.
</i>. </span>
<ul role="menu" class="
dropdown-menu">
<li id="menu-item-1502" class="fa
fa-user menu-item menu-item-type-
post_type menu-item-object-page
menu-item-1502"><a title="Create
Adsler Account"
href="https://adsler.co.uk/create-
account/">Create Adsler
Account</a>. </li>
最佳答案
您需要将延迟和动画切换到常规状态,检查this article通过 css 技巧 了解如何实现您想要的结果。
关于javascript - 如何在悬停后仅使用 css 而不是 Javascript 延迟菜单可见性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56220694/