如何在Internet Explorer 9、10中为Twitter Bootstrap 3进度条添加动画：
如何在Internet Explorer 9、10中为Twitter Bootstrap 3进度条添加动画：
提问于 2013-10-23 07:54:01
如何让Twitter Bootstrap 3进度条在Internet Explorer 9、10中以动画形式显示进度：
在Mozilla或Chrome中显示时，我可以看到进度指示器正在移动和剥离动画，但在IE中看不到
下面是进度条的div：
<div class="progress progress-striped active" style="width:100px">
<div id="myprogress"
class="progress-bar progress-bar-success"
role="progressbar"
aria-valuenow="40"
aria-valuemin="0"
aria-valuemax="100"
style="width: 0%">
</div>
</div>我使用默认的jQuery文件上传UI来显示进度：
<script type="text/javascript"
src="/Content/bootstrap/js/jquery.fileupload.js"></script>
<script type="text/javascript"
src="/Content/bootstrap/js/jquery.fileupload-ui.js"></script>回答 3
Stack Overflow用户
发布于 2013-10-23 15:48:27
进度条中的剥离动画在IE上不可用
从
动画
将.active添加到.progress-striped以从右到左设置条纹动画。并非所有版本的IE都提供。
更新
Bootstrap 3.0.3 -在IE9及更低版本中不可用。
Stack Overflow用户
发布于 2013-10-23 16:10:26
如果浏览器为IE lte 9，则使用jQuery动画方法。
示例：
jQuery('#myprogress').animate({width:'1%'});类似地，增加宽度百分比以显示增量。
并为动画条带添加以下特定于IE的css文件选择器。
如果不存在，则创建一个新的CSS文件ie.css或任何合适的文件。
添加此选择器：
.progress-striped .progress-bar {
background-image: url("an-animated-stripped-image.gif");
background-repeat: repeat-x;
}Stack Overflow用户
发布于 2014-03-25 15:08:54
这是Minddust https://github.com/minddust/bootstrap-progressbar到Github存储库的链接
一个bootstrap jquery插件，它扩展了基本的twitter-bootstrap进度条。它提供了通过将Javascript与先前存在的css过渡相结合来为进度条添加动画的能力。此外，您还可以在栏中显示当前进度信息或通过回调获取该值。
根据您的方便，您可以在任何事件中使用它。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/19530361
复制相关文章
相似问题
腾讯云开发者
