Web Uploader 进度条只是灰色情况

最新推荐文章于 2024-05-18 16:19:49 发布

熊 :)

最新推荐文章于 2024-05-18 16:19:49 发布

阅读量301

点赞数

分类专栏： WEB前端

本文链接：https://blog.csdn.net/weixin_42957379/article/details/101374543

版权

WEB前端专栏收录该内容

13 篇文章 0 订阅

订阅专栏

在webuploader.css 添加如下代码

.progress {
   height: 20px;
   margin-bottom: 20px;
   overflow: hidden;
   background-color: #f5f5f5;
   border-radius: 4px;
   -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
   box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
}
.progress.active .progress-bar {
   -webkit-animation: progress-bar-stripes 2s linear infinite;
   animation: progress-bar-stripes 2s linear infinite;
}

.progress-striped .progress-bar {
   background-image: linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);
   background-size: 40px 40px;
}
.progress-bar {
   background-image: -webkit-linear-gradient(top,#428bca 0,#3071a9 100%);
   background-image: linear-gradient(to bottom,#428bca 0,#3071a9 100%);
   background-repeat: repeat-x;
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=’#ff428bca’,endColorstr=’#ff3071a9’,GradientType=0);
}
.progress-bar {
   float: left;
   height: 100%;
   font-size: 12px;
   line-height: 20px;
   color: #fff;
   text-align: center;
   background-color: #428bca;
   box-shadow: inset 0 -1px 0 rgba(0,0,0,0.15);
   transition: width .6s ease;
}