|
|
|
一个非常酷的进度条，实现简单。加入精华？
作者:佚名 来源:一亩三分地 点击: 日期:2007-03-22 |
|
<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>
|
|
|
|
【文章评论】
【收藏本文】
【推荐好友】
【打印本文】
【论坛讨论】 |
 相关文章: |
|
|
文章评论:(条) |
|
|
|
|
责任编辑:一分 声明：刊登此文章是为了传递更多信息,文章内容仅供参考,转载请注明出处。 |
|
设为主页
收藏本站
