Progress bar animation not working in IE 11
0
Progress bar animation not working in IE
$(".cvss-score").each(function (e) {
var t = new ProgressBar.Circle(this, {
color: s,
easing: "easeInOut",
strokeWidth: "5",
duration: 3500,
text: {
value: "0"
}
});
IE in giving error 'ProgressBar' is undefined
As I checked with old qstns on same it tells to make strokeWidth less than 6, but still its not working.
Thanks in advance.
javascript internet-explorer-11
asked Dec 31 '18 at 9:42
Sukhwinder SodhiSukhwinder Sodhi
2121214
add a comment |
0
Progress bar animation not working in IE
$(".cvss-score").each(function (e) {
var t = new ProgressBar.Circle(this, {
color: s,
easing: "easeInOut",
strokeWidth: "5",
duration: 3500,
text: {
value: "0"
}
});
IE in giving error 'ProgressBar' is undefined
As I checked with old qstns on same it tells to make strokeWidth less than 6, but still its not working.
Thanks in advance.
javascript internet-explorer-11
asked Dec 31 '18 at 9:42
Sukhwinder SodhiSukhwinder Sodhi
2121214
If you specify what library you're using it might help...
– Vitalii Bobrov
Dec 31 '18 at 9:49
I am using kimmobrunfeldt.github.io/progressbar.js
– Sukhwinder Sodhi
Dec 31 '18 at 9:54
The linked page seems to work fine in IE11. How exactly have you loaded the scripts?
– Teemu
Dec 31 '18 at 10:40
Maybe you should try some polyfill
– Rafael Lucini
Dec 31 '18 at 10:51
add a comment |
0
0
0
Progress bar animation not working in IE
$(".cvss-score").each(function (e) {
var t = new ProgressBar.Circle(this, {
color: s,
easing: "easeInOut",
strokeWidth: "5",
duration: 3500,
text: {
value: "0"
}
});
IE in giving error 'ProgressBar' is undefined
As I checked with old qstns on same it tells to make strokeWidth less than 6, but still its not working.
Thanks in advance.
javascript internet-explorer-11
asked Dec 31 '18 at 9:42
Sukhwinder SodhiSukhwinder Sodhi
2121214
Progress bar animation not working in IE
$(".cvss-score").each(function (e) {
var t = new ProgressBar.Circle(this, {
color: s,
easing: "easeInOut",
strokeWidth: "5",
duration: 3500,
text: {
value: "0"
}
});
IE in giving error 'ProgressBar' is undefined
As I checked with old qstns on same it tells to make strokeWidth less than 6, but still its not working.
Thanks in advance.
javascript internet-explorer-11
javascript internet-explorer-11
asked Dec 31 '18 at 9:42
Sukhwinder SodhiSukhwinder Sodhi
2121214
asked Dec 31 '18 at 9:42
Sukhwinder SodhiSukhwinder Sodhi
2121214
asked Dec 31 '18 at 9:42
Sukhwinder SodhiSukhwinder Sodhi
2121214
asked Dec 31 '18 at 9:42
Sukhwinder SodhiSukhwinder Sodhi
2121214
asked Dec 31 '18 at 9:42
Sukhwinder SodhiSukhwinder Sodhi
2121214
2121214
If you specify what library you're using it might help...
– Vitalii Bobrov
Dec 31 '18 at 9:49
I am using kimmobrunfeldt.github.io/progressbar.js
– Sukhwinder Sodhi
Dec 31 '18 at 9:54
The linked page seems to work fine in IE11. How exactly have you loaded the scripts?
– Teemu
Dec 31 '18 at 10:40
Maybe you should try some polyfill
– Rafael Lucini
Dec 31 '18 at 10:51
add a comment |
If you specify what library you're using it might help...
– Vitalii Bobrov
Dec 31 '18 at 9:49
I am using kimmobrunfeldt.github.io/progressbar.js
– Sukhwinder Sodhi
Dec 31 '18 at 9:54
The linked page seems to work fine in IE11. How exactly have you loaded the scripts?
– Teemu
Dec 31 '18 at 10:40
Maybe you should try some polyfill
– Rafael Lucini
Dec 31 '18 at 10:51
If you specify what library you're using it might help...
– Vitalii Bobrov
Dec 31 '18 at 9:49
If you specify what library you're using it might help...
– Vitalii Bobrov
Dec 31 '18 at 9:49
I am using kimmobrunfeldt.github.io/progressbar.js
– Sukhwinder Sodhi
Dec 31 '18 at 9:54
I am using kimmobrunfeldt.github.io/progressbar.js
– Sukhwinder Sodhi
Dec 31 '18 at 9:54
The linked page seems to work fine in IE11. How exactly have you loaded the scripts?
– Teemu
Dec 31 '18 at 10:40
The linked page seems to work fine in IE11. How exactly have you loaded the scripts?
– Teemu
Dec 31 '18 at 10:40
Maybe you should try some polyfill
– Rafael Lucini
Dec 31 '18 at 10:51
Maybe you should try some polyfill
– Rafael Lucini
Dec 31 '18 at 10:51
add a comment |
1 Answer
1
active
oldest
votes
0
Try to make a test with Example below may help to solve your issue.
<!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>Output in Internet Explorer 11:
answered Jan 1 at 2:21
Deepak-MSFTDeepak-MSFT
720116
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53985920%2fprogress-bar-animation-not-working-in-ie-11%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
0
Try to make a test with Example below may help to solve your issue.
<!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>Output in Internet Explorer 11:
answered Jan 1 at 2:21
Deepak-MSFTDeepak-MSFT
720116
add a comment |
0
Try to make a test with Example below may help to solve your issue.
<!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>Output in Internet Explorer 11:
answered Jan 1 at 2:21
Deepak-MSFTDeepak-MSFT
720116
add a comment |
0
0
0
Try to make a test with Example below may help to solve your issue.
<!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>Output in Internet Explorer 11:
answered Jan 1 at 2:21
Deepak-MSFTDeepak-MSFT
720116
Try to make a test with Example below may help to solve your issue.
<!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>Output in Internet Explorer 11:
<!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><!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>answered Jan 1 at 2:21
Deepak-MSFTDeepak-MSFT
720116
answered Jan 1 at 2:21
Deepak-MSFTDeepak-MSFT
720116
answered Jan 1 at 2:21
Deepak-MSFTDeepak-MSFT
720116
answered Jan 1 at 2:21
Deepak-MSFTDeepak-MSFT
720116
720116
add a comment |
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53985920%2fprogress-bar-animation-not-working-in-ie-11%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
If you specify what library you're using it might help...
– Vitalii Bobrov
Dec 31 '18 at 9:49
I am using kimmobrunfeldt.github.io/progressbar.js
– Sukhwinder Sodhi
Dec 31 '18 at 9:54
The linked page seems to work fine in IE11. How exactly have you loaded the scripts?
– Teemu
Dec 31 '18 at 10:40
Maybe you should try some polyfill
– Rafael Lucini
Dec 31 '18 at 10:51