进度栏动画在IE 11中不起作用

时间:2018-12-31 09:42:30

标签: javascript internet-explorer-11

进度条动画在IE中不起作用

$(".cvss-score").each(function (e) {
       var t = new ProgressBar.Circle(this, {
       color: s,
       easing: "easeInOut",
       strokeWidth: "5",
       duration: 3500,
       text: {
              value: "0"
             }
});

IE中给出错误“ ProgressBar”的消息未定义

当我检查旧的qstns时,它告诉我将strokeWidth小于6,但仍然无法正常工作。

谢谢。

1 个答案:

答案 0 :(得分:0)

尝试使用下面的示例进行测试可能会帮助您解决问题。

<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>ProgressBar.js - Minimal Example</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <style>
            .progress {
                height: 300px;
            }
            .progress > svg {
                height: 100%;
                display: block;
            }
        </style>
    </head>
    <body>
        <div class="progress" id="progress"></div>

        <!-- These are probably out dated so you might want to use newest versions -->
        <script src="https://cdn.rawgit.com/kimmobrunfeldt/progressbar.js/0.5.6/dist/progressbar.js"></script>

        <script>
	window.onload = function onLoad() {
    var circle = new ProgressBar.Circle('#progress', {
        color: '#FCB03C',
	strokeWidth: 4,
  	trailWidth: 1,
        duration: 3000,
        easing: 'easeInOut',
	text: {
              value: "0"
             }
    });
  
    circle.animate(1);
};
	</script>
    </body>
</html>

Internet Explorer 11中的输出:

enter image description here