After my latest CSS3 experiment without images (Internet Explorer Pure CSS Logo), a friend suggested to create an animated 3D Super Mario Icon based on the 3D Retro Mario GIF image by Cezkid.
Well, this is the result of two weeks of work – an animated 3D Super Mario Icon built completely in CSS3 without images.
A still from Safari 5 with perspective and grids. Hover over the live demo to see this.
Demo
Demo: Pure CSS animated 3D Super Mario Icon
Best viewed with Safari 5 & Chrome 9.
Chrome prior Version 9 renders in 2D only due to an older Webkit engine.
Opera 10.6, Firefox 3.6 and IE9 are not supported.
Background
Please note that the source code is still a mess. You better not have a look at it ;-)
It’s based on top of my CSS 4D Framework I created therefor and will be released in the next few weeks (when it’s out of alpha).
tbc.
Renders on my iPad.
That’s very cool. I wonder if when browsers start supporting this more if this will become the new animated gifs…
Thanks! Hopefully it’s neither a flash nor an animated GIF replacement ;-)
Oh very nice post! It renders finely on my iPad, too ;)
great job
i like it!!
it looks the same on chrome & safari for me…????
Awesome! I really like it, it’s too bad that it only runs 100% on Safari, not all of my friends use Safari, but it’s a great job, congrats!
The safari version works on my Chrome (Win XP), the Chrom Dev Veiosn looks ‘dirty’.
Which chrome version? It “works (somehow) in Chrome 7, but it looks scrumbled ;-)
Very nice. How long did it take to create?
Really cool application of CSS. It’s amazing what CSS can do.
Hi Andreas!
I am new in the blogg world, start blogging late mars this year, and I have choosen your theme the first cordobo green park theme, and I love it :). Now I am going to moove my blog to an real domain and webbhotel, now it´s just for free.
This first cordobo is so lovely, so i want to use it in this second blogg. But I wonder if there is posibility to change size of the titel of the pages. This smal row of sides that one can have under the blog titel.
Regarding the titel Marianns LCHF mat & bak titel, is it possible to get it more centred (in the middle)?
I will appreciate if you have time to ansver me.
My oldest son is helping me this afternoon to moove my blog. I am 50 yers and not so technical…
Love and many thanks
Mariann Anderson