加载图片未在Google Chrome中显示

时间:2016-02-04 10:37:07

标签: html css google-chrome cross-browser

我需要显示进度条,直到从我的网站上传和显示图像。为此,我选择了进度条from here

我在scripts.js文件中使用了以下代码:



div = $('<div class="loader-fb"/>');
div.appendTo('.selected_album_inner');
&#13;
.loader-fb {
    top: calc(50% - 5px);
    left: calc(50% - 5px);
    position: absolute !important;
}
/* Demo specific styles end */
    
/* Loader with three blocks */
.loader-fb, .loader-fb:before, .loader-fb:after {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 50px;
    background-color: rgba(215,230,240,0.9);
    border: 1px solid rgb(215,230,240);
    z-index: 100000;
    content: ' ';
    margin-left: -5px;
    margin-right: -9px;
}
.loader-fb:before {
    top: -11px;
    left: -100%;
    animation: loading-fb .8s cubic-bezier(.4,.5,.6,1) infinite;
}
.loader-fb {
    animation: loading-fb-main .8s cubic-bezier(.4,.5,.6,1) .2s infinite;
}
.loader-fb:after {
    top: -11px;
    right: -100%;
    margin-top: 50%;
    animation: loading-fb .8s cubic-bezier(.4,.5,.6,1) .4s infinite;
}
@keyframes loading-fb {
    from {
        transform: scaleY(1.4);
        background-color: rgba(55,114,171,0.9);
        border: 1px solid rgb(55,114,171);
    }
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="selected_album_inner">
&#13;
&#13;
&#13;

进度条仅显示在mozilla firefox中,但不显示在chrome中。有什么想法吗?

0 个答案:

没有答案