很漂亮的进度条

转载 2013年12月02日 20:25:18
<html xmlns="http://schemas.microsoft.com/intellisense/html-401">
<head>
    <title>一个JS做的相当漂亮的进度条 www.qpsh.com</title>
</head>
<body>   
</body>
<script type="text/jscript">
function DoubleAnimation(target,targetProperty,from,to,Duration)
{
    this.Begin=function anonymous()
    {
        target[targetProperty]=from;
        var starttime=new Date();
        setTimeout(StoryBoard(),1);
        function StoryBoard()
        {
            return function()
            {                 
                var now=new Date();
                var d=now.getTime()-starttime.getTime();
                target[targetProperty]=Math.round(from+(to-from)*d/Duration);
                if(d<Duration)setTimeout(StoryBoard(),10);
            }
        }
    }
    this.setTo=function(val){to=val;}
    this.setFrom=function(val){from=val;}
function ProgressBar(ID)
{
    document.write( "<div id=\""+ID+"\" style=\"position:absolute;top:10%;width:100; left: 108px;\">        <image src=\"http://www.qpsh.com/icon/emptypb.jpg\" style=\"position: absolute;left: 84px; top: 137px;\" />        <div id=\""+ID+"pb\" style=\"position: absolute; left: 86px; top: 137px;z-index:5;overflow:hidden;width:130;\" >            <img src=\"http://www.qpsh.com/icon/iconfullpb.jpg\"/>           <div id=\""+ID+"highlight\" style=\"background:#ffffff;left: -500px; position: absolute; top: -1px;width:100;height:20;filter:Alpha(Opacity=75,FinishOpacity=0,Style=2)\"></div>        </div>        <div style=\"position:absolute;top:83px;width:180px; left: 148px;\">        加载中请稍候......        </div>   </div>");
 
    var story=new DoubleAnimation(document.getElementById(ID+"highlight").style,"left",-100,324,2000)
    var stophandle=setInterval(story.Begin,2000);
    this.set=function(percentage)
    {
        document.getElementById(ID+"pb").style.width=Math.round(percentage*329/100);
    }
}
 
 
 
 
var pb1=new ProgressBar("ok");
var p=0;
function loading()
{
pb1.set(p+=0.3);
if(p<100)
    setTimeout(loading,2);
else
    window.location.href="http://news.qq.com";
     
}
loading();
 
</script>
</html>

很漂亮的XP风格进度条VB代码

  • 2013年05月16日 01:00
  • 42KB
  • 下载

很漂亮的C#进度条

  • 2015年09月04日 21:09
  • 6KB
  • 下载

漂亮的按键。进度条,菜单

/*美化按钮*/ QPushButton{ border:2px solid #8f8f91; border-radius:6px; background-color: qlineargrad...

漂亮的MFC进度条

  • 2016年03月16日 09:18
  • 24KB
  • 下载

Android 自定义漂亮的圆形进度条

这几天对Android中实现画圆弧及圆弧效果中所实现的效果进行了修改,改为进度圆心进度条,效果如图所示   TasksCompletedView.java 代码如下...
  • jdsjlzx
  • jdsjlzx
  • 2015年01月07日 18:03
  • 27180

文件上传 带进度条 非常漂亮!

  • 2012年07月30日 11:41
  • 375KB
  • 下载

Android开发-各种各样好看漂亮的进度条,指示器,加载提示汇总【代码粘过来就可以用】

导读:之前项目中用到一些进度条,找了不少,但是我们产品是个傻X,什么效果都要做成跟ios效果一样的,所有一些本来很好看的进度条也被下了,打算写个demo自己总结一下,留着以后用, 有些是自己写的,有些...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:很漂亮的进度条
举报原因:
原因补充:

(最多只允许输入30个字)