Clown Car Technique for Responsive Images

We can use media queries within SVG to serve up the right image. The beauty of the “Clown Car” technique is that all the logic remains in the SVG file. It’s called the “Clown Car” technique since we are including (or stuffing) many images (clowns) into a single image file (car)…

VN:F [1.9.22_1171]
Rating: +3 (from 3 votes)

Anima – CSS animations with a soul

CSS animations have some limits, the main is that you can’t really have full control over them. And it’s near impossible to stop transitions without dirty hacks.Another problem is calculating percents for keyframes. People create animations with time in mind, not percents. You always think of “it should fly and rotate for a half of a second, then stand still for another second and continue flying”, and not 0% start 50% fly 70% stop 90% fly.Anima gives you the ability to use delays and durations normally, even for pure CSS animations. It has two modes: JS and CSS. The first one doesn’t really use CSS transitions or @keyframes. On the contrary, it uses CSS transforms and 3d-transforms together with Javascript to create animation. You have full control over the flow, so you can start, stop, cancel animations and even create event-based stuff. CSS mode allows you to generate pure CSS animations, but it has less control features for now…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)