- From: Tab Atkins Jr. <jackalmage@gmail.com>
- Date: Wed, 30 Sep 2015 11:42:48 -0700
- To: Xidorn Quan <quanxunzhen@gmail.com>
- Cc: George Triantafyllakos <gtrianta@gmail.com>, www-style list <www-style@w3.org>
On Wed, Sep 30, 2015 at 7:01 AM, Xidorn Quan <quanxunzhen@gmail.com> wrote:
> Your usecase has already been covered by CSS animation.
>
> So, for your specific case, you can do this:
>
> @keyframes show-a-while {
> 0% { visibility: visible; }
> 100% { visibility: hidden; }
> }
> .visible {
> animation: show-a-while 1s step-end;
> visibility: hidden;
> }
>
> Note that you need to use script to remove the class anyway, since CSS
> can never change the content of the HTML document.
Yup, what Xidorn said. CSS *cannot* modify the original page; it
can't change what classes an element has, etc. It just dictates how
to transform the DOM into a visual representation.
But yeah, animations can be used to address your use-case and similar
ones. An animation's timeline starts when the property applying it is
first applied, so you can make something visible/invisible with any of
the appropriate properties (display, visibility, opacity, etc) at
whatever time you wish.
~TJ
Received on Wednesday, 30 September 2015 18:43:35 UTC