Design / Dev Feed #41
A weekly collection of design and development goodies - issue #41, featuring Elastic Progress, SVG Modal Window, 6 Practical Examples For Building Parallax Websites, Pt.js, bLazy.js and more.
Elastic Progress by Lucas Bebber via Codrops
An elastic SVG progress loader based on the Dribbble shot "Download" by xjw and implemented with SVG and TweenMax.
SVG Modal Window via CodyHouse
A simple modal window with an animated SVG background.
Pt.js by William Ngan
Pt is an experiment of visual forms in code and a study of Point, Form, and Space. It is experimental and fun, and this demo page shows various interactive sketches, usually done in short form (50-70 lines of code).
6 Practical Examples For Building Parallax Websites via Tutorialzine
bLazy is a lightweight lazy loading image script. It lets you lazy load and multi-serve your images so you can save bandwidth and server requests.
* We have now embedded pens via CodePen so you can explore them on this page. Click the relevant link/button to view HTML, CSS, JS codes or click 'Edit on CODEPEN' link to go to the CodePen site.
CSS Background Change On Scroll by Georgiana Blantin
See the Pen CSS background change on scroll by Giana (@giana) on CodePen.
SVG Lava Lamp by Chris Gannon
See the Pen SVG Lava Lamp by Chris Gannon (@chrisgannon) on CodePen.
Inspired by a dribbble shot by Sara Farnsworth
CSS Border Transitions By Georgiana Blantin
See the Pen CSS Border transitions by Giana (@giana) on CodePen.
Interactive Wallet by Andy Tran
See the Pen Day 23 - Interactive Wallet by Andy Tran (@andytran) on CodePen.
Tinder-like Card Swipe Interaction by Nikolay Talanov
See the Pen Tinder-like Card Swipe Interaction by Nikolay Talanov (@suez) on CodePen.
Inspired by a dribbble shot by Claudio Bosco