A tutorial about creating pull to re-fresh animation by using javascript and SVG.
Westworld Slider is an inspring creative slider created by using SVG and javascript.
An experimental slideshow that shows an animated SVG frame when transitioning between slides. Different shapes can be used for creating a variety of styles. Anime.js is used for the animations.
Some ideas for multi-layered SVG shape overlays that get generated dynamically with adjustable properties for a variety of effects.
A simple morphing page transition effect where an SVG path gets morphed into another while the current page moves up.
Anime.js used for the animations and Charming.js used for some letter effects.
A tutorial about creating SVG line animations of different animals by using Snap.svg
Flubber is a library to provide a best-guess interpolation for any two arbitrary shapes (or collections of shapes) that results in a reasonably smooth animation.
A decorative website background effect where SVG shapes are morphing and transforming on scroll.
The animations are powered by anime.js
An experimental letter animation made with SVG and anime.js based on the Dribbble shot "Shading Letters in Illustrator".
Radial SVG Slider is a simple, responsive slider, with a radial transition effect powered by SVG clipPath and mask elements.
An experimental plugin for animating SVG letters using Segment. The idea is to animate the path strokes of an interesting display font in a creative way.
A tutorial about creating simple modal window with an SVG background animated using Snap.svg and javascript.
jQuery DrawSVG is lightweight, simple to use jQuery plugin to animate SVG paths.
This plugin uses the jQuery built-in animation engine to transition the stroke on every <path> inside the selected <svg> element, using stroke-dasharray and stroke-dashoffset properties.
A simple, responsive carousel with animated SVG paths used as transition effects.
A tutorial about creating full page slider, with animated SVG elements used as transition effects.
