XF 1.5 ToggleTrigger on hover?

[Stuart Wright]

Hello folks,
I have a div area which, when hovering over it, changes some <li> elements it contains from display:none to display:block.
.dap_inline:hover #dap_search_inline > ul > li > ul > li {display: block;}

The height of the div therefore expands as you hover over it and contracts as you over out.
To avoid accidental triggering of the expansion of the div, I want there to be a short (maybe 1s) delay after hovering for the elements to display:block. Is this possible? This is a 'nice to have'.

More important, I want the div to expand smoothly like ToggleTrigger does.

I've tried without success to use the transition-delay and transition min-height css to achieve this.

Any ideas please?

 

[Steve F]

This may give some direction. Notice the CSS transition delay.

https://xenforo.com/community/resources/hide-extra-user-info-with-css-effect.3448/

 

[Stuart Wright]

This may give some direction. Notice the CSS transition delay.

https://xenforo.com/community/resources/hide-extra-user-info-with-css-effect.3448/

Awesome. That helped me find a great solution:
https://www.avforums.com/threads/4k-tv-help-for-around-£1k.1992619/
Mouse over the 'Discussed in this thread' box.
Thank you so much.

 

[Steve F]

Great glad it helped. Only thing is on mobile/touch screen, touching a link, any link, in the box expands it. Wondering if you could add an empty href if it could works as expand and close. You could hide the empty href on desktop with a class.

 

[Stuart Wright]

Great glad it helped. Only thing is on mobile/touch screen, touching a link, any link, in the box expands it. Wondering if you could add an empty href if it could works as expand and close. You could hide the empty href on desktop with a class.

I was wondering how to do that. Need it to expand when you tap any link, though.