Do i need Canvas and JS game loop to create this ? or CSS3 can handle it

[aladine]

Hello everyone,

 

i've build this website for my friend a year ago and i thought it would be a good practice if i port it to HTML5, i was going to start coding just like the book i was reading taught me how to animate and interact with "game" elements, so i would need a game loop and other basic games stuff, but then i remember that i read once about CSS3 transition and how it can be used to create a responsive websites, and since this is the only fancy part in my website, i thought that instead of making a good practice, maybe i could learn something new, knowing that i never wrote a CSS sheet from scratch (i always google it and copy it   ) plus i said that using CSS3 to perform animation will consume less CPU usage than JavaScipt game loop  (just a personal thought, am not sure of it).

 

So what do you think ? Build it as a game or learn to do it the other way ? if so, any further information and ressources would be very appreciate it, 

 

thank you very much.

[@99golems]

If you did want to recreate the site in canvas you probably would need a game loop to handle things like animations and tween movement, yes. You'd need event handlers to handle the clicking and buttons as well. Actually it might be fairly complex to design in just canvas. 

 

I think a better solution would to recreate the site in html with 3d css transforms. You could probably get away with not using a game loop of any kind since css has its own abilities to do animations and tween movements.

[aladine]

thank you,

any links or resources to get started ?