Give this sloooooooow crawl a spin:
```
<style>
.ch1 peekaboo {display:none;}
.ch1:hover {background-color:#F5F5F5;border:1px solid gray;}
.ch1:hover peekaboo {display:block;}
.slow {
animation-name: example;
animation-duration: 5s;}
@keyframes example {
0% {height:0px;}
100% {height:150px;}
}
</style>
<$list filter="[tag[Articles]]">
<div class="ch1">
{{!!title}}<br>
<peekaboo class="slow" style="max-height:100px;overflow:auto;">
<$transclude mode="block">
</div>
</div>
</$list>
```
On Thursday, June 29, 2023 at 4:06:56 AM UTC-3 S² wrote:
> Hi Charlie,
> how do I get a delay of eg. 2sec to display the details when hover the
> title?
>
> (didn't succed with transition-delay: 2s;)
>
> Thanks,
> Stefan
>
> Charlie Veniot schrieb am Donnerstag, 29. Juni 2023 um 06:12:50 UTC+2:
>
>> Nothing revolutionary here. Just the result of some goofing around with
>> CSS.
>>
>> Give it a spin at TiddlyWiki.com.
>>
>> ````
>> <style>
>> .ch1 div {display:none;}
>> .ch1:hover {background-color:#F5F5F5;border:1px solid gray;}
>> .ch1:hover div {display:block;}
>> </style>
>>
>> <$list filter="[tag[Articles]]">
>> <div class="ch1">
>> {{!!title}}<br>
>> <div style="max-height:100px;overflow:auto;">
>> <$transclude mode="block">
>> </div>
>> </div>
>> </$list>
>> ```
>>
>
--
You received this message because you are subscribed to the Google Groups
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/50548b7c-61e1-431c-99f2-bb46a5586a3an%40googlegroups.com.
