1. // Text on the path var s = Snap("#svg");
2. // Setting the background var bg = s.rect(50, 50, 200, 200, 10).attr({fill: "#ccc"});
3. var t = s.text(150, 150, "Test Text").attr({ font: "30px Helvetica, sans-serif", textAnchor: "middle", fill: "#ddd" });
4. // Lets create a mask
5. var t2 = t.use().attr({ stroke: "#000", strokeWidth: 10, strokeLinecap: "round", strokeLinejoin: "round" });
6. var mask = s.mask();
7. // Background rect: mask.add(s.rect(0, 0, "100%", "100%").attr({fill: "#fff"}));
8. // and our ring mask.add(t2);
9. bg.attr({ mask: mask });
10. //Now, let’s animate:
11. t2.animate({strokeWidth: 4}, 5e3, mina.bounce);