Why does only one of these @-webkit-keyframes declarations fail?

Posted by Alex Ford on Stack Overflow See other posts from Stack Overflow or by Alex Ford
Published on 2011-02-14T20:51:14Z Indexed on 2011/02/14 23:25 UTC
Read the original article Hit count: 188

Filed under:

animation

|

webkit

|

css3

|

opacity

I have two -webkit-keyframes declarations (see below). blink2 works fine. blink does nothing. What's the deal? Is there a limit to the number of keyframes that can be declared?

@-webkit-keyframes blink {
    0% {
        opacity:1;
    }
    40% {
        opacity:1;
    }
    50% {
        opacity:.5;
    }
    90% {
        opacity:1;
    }
    99% {
        opacity:1;
    }
}

@-webkit-keyframes blink2 {
    0% {
        opacity:1;
    }
    50% {
        opacity:.25;
    }
    100% {
        opacity:1;
    }
}

© Stack Overflow or respective owner

Related posts about animation

jerky animation using Core Animation

as seen on Stack Overflow - Search for 'Stack Overflow'
In my iPhone app, I am trying to get some red and white stripes that are scrolling across the screen to animate smoothly when the speed of the stripes gets high. In my app the user starts the animation and changes the scrolling speed by a finger swipe and changes the width of the stripes by a two… >>> More
Trigerring other animation after first ending Animation (Objetive-C)

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi, I have a simple animation which simply modify the position of a button: [UIView beginAnimation:nil context:nil]; [UIView setAnimationsDuration:3.0]; [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut]; mybutton.frame = CGREctMake(20, 233, 280, 46); [UIView commitAnimations]; I want to… >>> More
how to import mesh animation from cinema4d into blender ?

as seen on Super User - Search for 'Super User'
I need to import a mesh animation from Cinema4D into Blender. I tried to do that using Collada.The Collada 1.3 importer doesn't seem to do anything, the Collada 1.4 importer seems to work, but the animation didn't get imported into Blender. After reading this post, I tried modifying the animation… >>> More
Making a ViewFlipper like the Home Screen using MotionEvent.ACTION_MOVE

as seen on Stack Overflow - Search for 'Stack Overflow'
Ok I have a ViewFlipper with three LinearLayouts nested inside it. It defaults to showing the first one. This code: // Assumptions in my Activity class: // oldTouchValue is a float // vf is my view flipper @Override public boolean onTouchEvent(MotionEvent touchEvent) { switch (touchEvent.getAction())… >>> More
How to Animate Text and Objects in PowerPoint 2010

as seen on How to geek - Search for 'How to geek'
Are you looking for an eye catching way to keep your audience interested in your PowerPoint presentations? Today we’ll take a look at how to add animation effects to objects in PowerPoint 2010. Select the object you wish to animate and then click the More button in the Animation group of the Animation… >>> More

Related posts about webkit

Twitter Bootstrap styling conflicts with plug-ins like jqGrid and other third part libraries

as seen on Geeks with Blogs - Search for 'Geeks with Blogs'
Issues:The concern is that the Twitter Bootstrap framework is that some of their css selectors are simply too generic and have incompatibility issues and conflicts with most third party plug-ins and css libraries, like jQuery-UI and jqGrid.My most pressing concern is only with the generic selector… >>> More
How do I know all the events (especially webkit only) supported by webkit/chrome/safari

as seen on Stack Overflow - Search for 'Stack Overflow'
I just cannot find a reference doc for webkit/chrome/safari >>> More
Does webkit-scrollbar work with webkit-transition?

as seen on Stack Overflow - Search for 'Stack Overflow'
I want a custom webkit-scrollbar to animate a different background color for the hover state. The code below changes the color on hover but doesn't animate anything. It works on a div so I suspect webkit-scrollbar doesn't play nice with transitions. ::-webkit-scrollbar-thumb { background-color:… >>> More
Print.css issue in Webkit

as seen on Stack Overflow - Search for 'Stack Overflow'
The page in question is featured here: http://www.allwebcafe.com/news/news-article.php?id=78 For some reason, when a user attempts to print any article of this type from a Webkit-based browser (I've confirmed this in both Safari and Chrome), the pages are all blank. On the flip side, everything behaves… >>> More
Why Chrome does not show CSS3 ::-webkit-scrollbar scrollbar for iframe?

as seen on Stack Overflow - Search for 'Stack Overflow'
Why Chrome does not show CSS3 ::-webkit-scrollbar scrollbar for iframe? Demo http://jsfiddle.net/laukstein/C9s3P/ <iframe scrolling="yes" style="overflow-x:hidden; overflow-y:scroll; width:150px; height:50px;" src="http://en.wikipedia.org/wiki/Web_browser"></iframe> CSS ::-webkit-scrollbar{ … >>> More