hover exit delay

[rjwse@aol.com]

In a recent post I asked about <detail><summary> text </summary> popup </detail> and found out from the forum that although this construct functions, it is not good CSS and it may (or may not) work in all cases. I was so delighted with a popup like this I produced a work-around using hover. Please note I reversed singular and plural: detail is details and summary is summarys.

<style>detail {display: none;}
summarys {display:block;}
summarys:before{ content:"▶ " }
summarys:hover + detail {display: inline-block;}
summarys:hover:before{content:"▼ "}
</style>

<summarys>text</summarys><detail>pops up when you hover; makes room beneath by inserting lines; triangle turns down at hover</detail>

<summarys>text</summarys>If there is text here between end-of-summarys and before detail the popup begins beneath this text.<detail>pops up when you hover; makes room beneath by inserting lines; triangle turns down at hover</detail>

It works really well and I hope this type of CSS is good grammar and acceptable. There is one very bad problem: when you unhover the popup immediately vanishes. Normally this would be okay, except the popup was where I always placed my clickable hypertext links. Does anyone know how to delay the popup in such code?

Best regards, Pop

[rjwse@aol.com]

I have found a partial answer: you can't do transitions from display:none to display:inline-block. It is okay to transition visibility, but that technique forces a blank or filled area on the page. I am still working at it. Anyone?
Best regards, Pop