Re: [css3-animations] scope of keyframes and OM issues

I would like to reinvoke this thread, since IE10 (Consumer Preview build) 
don't support @keyframes rules nested in @media and I don't see anything in 
the spec that says the IE team is wrong on this. In fact, they are right to 
do this, it seems. From an author point of view, however, they are wrong. I 
may want to have different animations based on the media.


If you want to get the result in your browser, there's a test case attached 
to this mail.

PS: Please note that browser are not interoperable on animating font-weight, 
as I did discover with this test case. People interested in looking at this 
issue may find the test case useful.




-----Message d'origine----- 
From: Daniel Glazman
Sent: Thursday, November 24, 2011 9:29 AM
To: www-style
Cc: Anne van Kesteren
Subject: [css3-animations] scope of keyframes and OM issues

(cc:ing AVK for the OM part)

It seems that nothing is told in CSS 3 Animations about the scope
of a @keyframes rule. Limited to a stylesheet or to the whole
document?

1. is the paragraph below animated ?

     <style>
       @keyframes anim1 { from { opacity: 0; }
                          to   { opacity: 1; } }
     </style>
     </style>
       #foo { animation: anim1 2s; }
     </style>
     ...
     <p id="foo">Is this paragraph animated?</p>

2. suppose file foo.css contains

     @keyframes anim1 { from { opacity: 0; }
                        to   { opacity: 1; } }

    is the paragraph below animated ?

     </style>
       @import url(foo.css);
       #foo { animation: anim1 2s; }
     </style>
     ...
     <p id="foo">Is this paragraph animated?</p>

3. can @keyframes be contained inside another at-rule, for instance
    @media? WebKit accepts it, Gecko does not.

AFAICT, both WebKit and Gecko animate the paragraphs, making animations
document-wide. I'm fine with that BUT

a. there should be some prose about it in the spec and unless I missed
    it, there isn't.

b. the nested @-rule case has to be discussed and resolved.

c. I would like to have a new API *for instance* on the document
    giving access to the applicable @keyframes (if two keyframes have
    same name, only last one applies, right?).

    Something like

      partial interface Document {
        readonly attribute CSSRuleList keyframesRuleList;
      }

    Without that, discovering all animations in a document is tricky
    and expensive.

</Daniel>