JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/snap.svg/0.4.1/snap.svg-min.js"></script>
<svg id="stuff" height="800"></svg>
JavaScript
var s = Snap('#stuff');
function rectAnim(tgt){
tgt.animate({
width: 800,
x: 50
}, 1000, mina.easeinout, function(){
this.animate({
width: 200,
x: 0
}, 1000, mina.easeinout, function(){
this.animate({
width: 900,
x: 50
}, 1000, mina.easeinout, rectAnim(tgt));
});
});
}
for(var i = 0; i < 7; i++){
var obj = s.rect(0, 41 * i, 200, 40);
obj.node.setAttribute('id', 'strap' + i);
(function( myobj ) {
setTimeout(function(){
rectAnim(myobj);
}, 200 * i);
})( obj )
}