ElasticProgress

ElasticProgress 介绍

这是一款效果非常炫酷的基于TweenMax和SVG的炫酷弹性进度条动画特效。该弹性进度条特效在点击触发按钮之后，按钮会变形为进度条，然后一个滑块在它上面滑动，就像重物滑过绳子的感觉，非常有创意。  

使用

创建要转换为按钮的元素：

<div class="Upload" role="button" aria-label="Upload file"></div>

注意：我们使用的是div元素role="button"而不是button元素，因为根据W3C的建议，button元素应该没有交互元素作为后代。

然后，通过js：

var element=document.querySelector('.Upload');

var progress=new ElasticProgress(element,{ /*options*/ });

// or...

var progress=new ElasticProgress('.Upload',{ /*options*/});

或者，如果您使用jQuery：

$('.Upload').ElasticProgress({/*options*/});

GitHub:https://github.com/codrops/ElasticProgress/

网站描述:基于TweenMax和SVG的炫酷弹性进度条动画特效

ElasticProgress

官方网站：