Labs by Florian Welcome to my laboratory. Because of what this is, not everything is going to work. Some things are just proofs of concept, others are geared towards a specific browser. But rest assured that everything is made with love ♡ Jump in Contact me
CSS animated zoetrope Old school frame by frame vintage cartoon Thanks to CSS3 we now have the possibility to do step-by-step keyframe animation. We're gonna use this to make an old school cartoon, twelve… view demo github
Movies AJAX streaming, caching & database to combine multiple APIs Piratebay offers a vast collection of torrents, and RottenTomatoes a huge database of movies. Let's shake it all. We're gonna try to offer the… view demo github
Infinite tiled canvas Dynamically generated map of drawable canvas tiles You've probably heard of webcanvas.com — well after the websocket last week, we're gonna build an infinite canvas. Combine the two and you… view demo github
NodeJS websocket multiplayer game POC of multiple connection handling by HTML5 websocket Websockets are the new standard for bidirectional communication. Think instantaneous sync between apps and servers, between different users. It'… view demo github
Long-polling AJAX chat Public instantaneous chat based on the long-polling pull method Building a chat is super easy thanks to the capacity that AJAX requests have to remain on hold for a few minutes. This is called long-polling.… view demo github
Pull-up page transition — a la medium Transitionned navigation between articles & automatic next Everyone fantasizes on medium.com's gorgeous layout. Let's dive in and make our own articles browser with full screen pictures and awesome… view demo github
CSS flat preloaders Collection of pure-CSS preloaders — never use tiny weird gifs again However much you try, at some point you'll be working on a web project that takes time to load. Whether it is a big-data library or a multi-netw… view demo github
Flat shadow buttons Collection of trendy buttons with font-icons, flat shadow & ghost style These are trendy, flat, fashionable, hipster, thin and phat, with an ever-lasting isometric shadow. Meet the flat… view demo github
Ghost buttons Collection of pure-CSS animated buttons, ghost style & fancy These days, you see them everywhere with their thin fancy border and neatly centered padded text. These ghost buttons often lack the… view demo github
Animated SVG graph Dynamic data display through pure-SVG animations We live in the big-data era. And we need to visualize it properly. So sure you have d3.js for the real stuff. But what if you just want a… view demo github