Fun with CSS3

Last friday I went to the full frontal javascript conference, which was really good. One of the speakers was Seb Lee Delisle who showed us some nice animation effects with particles using canvas.

This got me thinking – I thought that same thing could be achieved in CSS, without any javascript, so I gave it ago. This was the best I could do:

http://scruffian.com/css3fun/ [will only work on the latest version of Safari on Snow Leopard].

It’s pretty similar – a few differences, but close enough. The nice thing about this is that it doesn’t use any images or javascript – it’s just pure CSS!

It’s quite amazing what you can achieve with CSS, of course at the moment this is only in bleeding edge browsers, but hopefully this stuff will be standardised. I also made a couple of other interesting variations:

bubbles | planets


4 responses to “Fun with CSS3”

  1. sebstar55 Avatar
    sebstar55

    I never followed up at the time but I just wanted to say that this is insanely brilliant and it runs perfectly on iOS. Well done!

    Like

  2. Oliver Avatar
    Oliver

    Wow, that’s very impressive. Well done.

    Like

  3. Bryan Green Avatar

    Wow! This will be great once this functionality if built into all browsers. Great proof-of-concept demo and very well executed.

    Like

  4. Bruno Hass Avatar
    Bruno Hass

    Runs very well on chrome too.

    Like

Leave a comment