Как задержать видимость меню после наведения, используя только CSS, а не Javascript - PullRequest
0 голосов
/ 20 мая 2019

Я пытаюсь задержать зависание меню на 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>

1 Ответ

0 голосов
/ 20 мая 2019

Вам нужно перевести задержку и анимацию в обычное состояние, отметьте эту статью по трюкам css о том, как достичь желаемого результата.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...