欢迎光临
我们一直在努力

一个非常酷的进度条,实现简单。加入精华?

建站超值云服务器,限时71元/月

<html>
<head>
<style type="text/css">

body {
    background:    000000;
    font:        messagebox;
    font:        message-box;
}

marquee {
    border:        1px solid buttonshadow;
    background:    333333;
    height:        12px;
    font-size:    1px;
    margin:        1px;
    width:        400px;
    -moz-binding:    url("marquee-binding.xml#marquee");
    -moz-box-sizing:    border-box;
    display:        block;
    overflow:        hidden;
}

marquee span {
    height:            8px;
    margin:            1px;
    width:            6px;
    background:        ff9900;
    float:            left;
    font-size:        1px;
}

.progressbarhandle-0 {
    filter:        alpha(opacity=20);
    -moz-opacity:    0.20;
}

.progressbarhandle-1 {
    filter:        alpha(opacity=40);
    -moz-opacity:    0.40;
}

.progressbarhandle-2 {
    filter:        alpha(opacity=60);
    -moz-opacity:    0.6;
}

.progressbarhandle-3 {
    filter:        alpha(opacity=80);
    -moz-opacity:    0.8;
}

.progressbarhandle-4 {
    filter:        alpha(opacity=100);
    -moz-opacity:    1;    
}

.progressbarhandle-5 {
    filter:        alpha(opacity=100);
    -moz-opacity:    1.2;    
}

.progressbarhandle-6 {
    filter:        alpha(opacity=100);
    -moz-opacity:    1.4;    
}

.progressbarhandle-7 {
    filter:        alpha(opacity=100);
    -moz-opacity:    1.8;    
}
.progressbarhandle-8 {
    filter:        alpha(opacity=100);
    -moz-opacity:    2;    
}
.progressbarhandle-9 {
    filter:        alpha(opacity=100);
    -moz-opacity:    2.2;    
}

</style>
</head>
<body>
<center><marquee direction="right" scrollamount="8" scrolldelay="100">
    <span class="progressbarhandle-0"></span>
    <span class="progressbarhandle-1"></span>
    <span class="progressbarhandle-2"></span>
    <span class="progressbarhandle-3"></span>
    <span class="progressbarhandle-4"></span>
    <span class="progressbarhandle-5"></span>
    <span class="progressbarhandle-6"></span>
    <span class="progressbarhandle-7"></span>
    <span class="progressbarhandle-8"></span>
    <span class="progressbarhandle-9"></span>

</marquee>
</center>
</body>
</html>

赞(0)
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com 特别注意:本站所有转载文章言论不代表本站观点! 本站所提供的图片等素材,版权归原作者所有,如需使用,请与原作者联系。未经允许不得转载:IDC资讯中心 » 一个非常酷的进度条,实现简单。加入精华?
分享到: 更多 (0)

相关推荐

  • 暂无文章