Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
This script can be used to achieve a SVG-Animation-Effect similar to the one on It takes all paths in an SVG-Element, hides them and draws them into the page. The method is explained in An example can be found at htt…
//inspired by
function drawSVGPaths() {
'use strict';
//grab all PATHs from an SVG-Element
var paths = $('.svganimate path');
//for each PATH..
$.each( paths, function() {
//get the total length
var totalLength = this.getTotalLength();
//set PATHs to invisible
'stroke-dashoffset': totalLength,
'stroke-dasharray': totalLength + ' ' + totalLength
'stroke-dashoffset': 0
}, 1200);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.