Как я могу задержать исчезновение триггера выпадающего меню? - PullRequest
Новая
       41

Как я могу задержать исчезновение триггера выпадающего меню?

1 голос
/ 08 мая 2019

Я хочу, чтобы при наведении курсора на логотип отображалось раскрывающееся меню, но при его зависании оно сразу исчезает, что делает его чрезвычайно трудным для доступа.(https://imgur.com/6AQIqfC)

Я занимался исследованиями некоторое время, и, похоже, ничего не работает.Все, что я могу найти, просто говорит мне использовать CSS-свойство перехода и задержки перехода, но, похоже, оно не работает 

.dropdown:hover>.dropdown-menu{
    transition: .5s all;
    transition-delay: 5s;
    display: block;
}
    <!-- NAVBAR -->
    <nav class="navbar fixed-top">   
        <div class="nav-logo dropdown">
            <svg>
               LOGO GOES HERE
            </svg>
            <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                <a class="dropdown-item" href="#">Action</a>
                <a class="dropdown-item" href="#">Another action</a>
                <a class="dropdown-item" href="#">Something else here</a>
            </div>
        </div>
    </nav>

Раскрывающееся меню должно оставаться на 5 секунд после выключения, но ничего не делает

1 Ответ

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

На самом деле вы не можете добавить задержку перехода, так как display свойство не анимируется в CSS.

Что вы можете сделать, это добавить простой код JS, чтобы добавить класс при наведении курсора и удаление тайм-аута при наведении мыши.

...