Top "Css-animations" questions

CSS animations make it possible to animate transitions from one CSS style configuration to another.

How to make blinking/flashing text with CSS 3

Currently, I have this code: @-webkit-keyframes blinker { from { opacity: 1.0; } to { opacity: 0.0; } } .waitingForConnection { -webkit-animation-name: blinker; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: cubic-bezier(.5, 0, 1, 1); -webkit-animation-duration: 1.7s; } …

html css css-animations opacity
css3 transition animation on load?

Is it possible to use CSS3 transition animation on page load without using Javascript? This is kind of what I …

css webkit css-transitions css-animations
CSS3 Spin Animation

I have reviewed quite a few demos and have no idea why I can't get the CSS3 spin to function. …

css css-animations
Imitating a blink tag with CSS3 animations

I really want to make a piece of text blink the old-school style without using javascript or text-decoration. No transitions, …

html css css-animations blink
Changing :hover to touch/click for mobile devices

I've had a look around but can't quite find what i'm looking for. I currently have a css animation on …

css css-animations
Maintaining the final state at end of a CSS3 animation

I'm running an animation on some elements that are set to opacity: 0; in the CSS. The animation class is applied …

css css-animations
Play multiple CSS animations at the same time

How can I have two CSS animations playing at different speeds? The image should be rotating and growing at the …

css css-animations
Stopping a CSS3 Animation on last frame

I have a 4 part CSS3 animation playing on click - but the last part of the animation is meant to …

css css-animations
Blurry text after using CSS transform: scale(); in Chrome

Seems like there has been a recent update to Google Chrome that causes blurry text after doing a transform: scale(). …

google-chrome css webkit transform css-animations
Changing Background Image with CSS3 Animations

Why this isn't working? What am I doing wrong? CSS @-webkit-keyframes test { 0% { background-image: url('frame-01.png'); } 20% { background-image: url('frame-02.png'); } 40% { …

css background-image css-animations