仿微信语音播放 svg

决定优化语音播放的动效，网上找了一圈没有满意的，最后自己用微信程序包中的 svg 来改。

svg 如下：

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
    <path d="M10.24 11.616l-4.224 4.192 4.224 4.192c1.088-1.056 1.76-2.56 1.76-4.192s-0.672-3.136-1.76-4.192z"></path>
    <path d="M15.199 6.721l-1.791 1.76c1.856 1.888 3.008 4.48 3.008 7.328s-1.152 5.44-3.008 7.328l1.791 1.76c2.336-2.304 3.809-5.536 3.809-9.088s-1.473-6.784-3.809-9.088z">
        <animate attributeName="opacity" values="0;0;1;1" begin="0" dur="1" keyTimes="0;.333;.334;1" repeatCount="indefinite"/>
    </path>
    <path d="M20.129 1.793l-1.762 1.76c3.104 3.168 5.025 7.488 5.025 12.256s-1.921 9.088-5.025 12.256l1.762 1.76c3.648-3.616 5.887-8.544 5.887-14.016s-2.239-10.432-5.887-14.016z">
        <animate attributeName="opacity" values="0;0;1;1" begin="0" dur="1" keyTimes="0;.666;.667;1" repeatCount="indefinite"/>
    </path>
</svg>

效果如下：