長押しボタンを作ってみた【マルチブラウザ対応】 - Qiita

conic-gradient.js内で使われているπとかτとかが、Edgeだとダメみたいです。 なので、πをpai、τをtau、εをepsilonに書き換えました。 これで動きました。 で、css部分を確認してみると、 background-imageとしてjs内で動的に作成したsvgを設定しているみたいです。 svgデータの準備 polyfillの処理でcssに設定されているconic-gradientをbackground-imageに変換しているぽいのですが、 これを連続でリアルタイムに変換する方法がわからないので、あらかじめ、svgのデータを準備して、それをレンダリングする方法を考えました。 また、そのために必要なsvgデータを準備しました。 svg.js 20個のsvgデータ保持しているjsです。色は黒のみ。window.SMART_UIというグローバル変数に格納してあります。