<html>

<head>

<title>进度条</title>

<style type="text/css">

.container{

   width:500px;

   height:25px;

 }

#bar{

   background:#95CA0D;

   border:0px solid #6C9C2C;

   float:left;

   height:25px;

   width:%;

   line-height:%;

   margin:0px;

 }

 #total{

    width:%;

    height:27px;

 }

 #outer{

    border:1px solid #6C9C2C;

 }

 .ccc{

    display: inline-block;

 }

 #wid{

    width:547px;

    height:27px;

 }

 #tbox{

    height:27px;

    float:right;

    padding-top:.5px;

 }

</style>

<script type="text/javascript">

  function run(){

        var bar = document.getElementById("bar");

        var total = document.getElementById("total");

        bar.style.width=parseInt(bar.style.width) +  + "%";

        total.innerHTML = bar.style.width;

        if(bar.style.width == "100%"){

          window.clearTimeout(timeout);

          return;

        }

        var timeout=window.setTimeout("run()",);

      }

        window.onload = function(){

           run();

        }

</script> 

</head>

<body>

  <div id="wid" class="container ccc">

  <div  id="outer" class="container ccc">

   <span id="bar" style="width:0%;"></span>

  </div>

  <div id="tbox" class="ccc">

  <div id="total"></div>

  </div>

  </div>

</body>

</html>

html 进度条的更多相关文章

  1. Android -- 真正的 高仿微信 打开网页的进度条效果

    (本博客为原创,http://www.cnblogs.com/linguanh/) 目录: 一,为什么说是真正的高仿? 二,为什么要搞缓慢效果? 三,我的实现思路 四,代码,内含注释 五,使用方法与截 ...

  2. css3圆形百分比进度条的实现原理

    原文地址:css3圆形百分比进度条的实现原理 今天早上起来在查看jquery插件机制的时候,一不小心点进了css3圆形百分比进度条的相关文章,于是一发不可收拾,开始折腾了... 关于圆形圈的实现,想必 ...

  3. 图解CSS3制作圆环形进度条的实例教程

    圆环形进度条制作的基本思想还是画出基本的弧线图形,然后CSS3中我们可以控制其旋转来串联基本图形,制造出部分消失的效果,下面就来带大家学习图解CSS3制作圆环形进度条的实例教程 首先,当有人说你能不能 ...

  4. 超炫的HTML5粒子效果进度条 VS 如何规范而优雅地code

    最近瞎逛的时候发现了一个超炫的粒子进度效果,有多炫呢?请擦亮眼镜!   // _this.ch){ _this.particles.splice(i, 1); } }; this.Particle.p ...

  5. WPF自定义控件第一 - 进度条控件

    本文主要针对WPF新手,高手可以直接忽略,更希望高手们能给出一些更好的实现思路. 前期一个小任务需要实现一个类似含步骤进度条的控件.虽然对于XAML的了解还不是足够深入,还是摸索着做了一个.这篇文章介 ...

  6. python实现一个控制台下的进度条

    今天写练习爬虫感觉很需要个进度条,就随手用函数实现了一个,到了晚上突然感觉到这个东西应该单独写出来以后肯定用用得着. 代码也很简单,我就不细讲了,直接上代码了. 测试代码: instance.py i ...

  7. 【Win 10 应用开发】通过数据绑定更新进度条

    实现 INotifyPropertyChanged 接口可以在属性更改后通知数据的使用者,这个相信大伙儿都知道.于是,有朋友会问:对于要实时显示进度的情况,比如更新进度条,能用这个实现吗? 当然是可以 ...

  8. springMVC+ajax 文件上传 带进度条

    前端代码: <form id= "uploadForm"> <p >指定文件名: <input type="text" name= ...

  9. 【Android】 修复ijkPlayer进行m3u8 hls流播放时seek进度条拖动不准确的问题

    项目中使用的播放器是ijkPlayer,发现播放切片特点的hls流(m3u8格式的视频)拖动seekBar的时候会莫名的跳转或者seek不到准确的位置,发现网友也遇到了同样的问题,ijk的开发者也说明 ...

  10. 简单实用的进度条加载组件loader.js

    本文提供一个简单的方法实现一个流程的进度条加载效果,以便在页面中可以通过它来更好地反馈耗时任务的完成进度.要实现这个功能,首先要考虑怎样实现一个静态的进度条效果,类似下面这样的: 这个倒是比较简单,两 ...

随机推荐

  1. jt项目菜单页面实现

    jt项目菜单页面实现 一. 业务描述: 1) 数据呈现时使用bootstrap中的treeGrid插件(基于jquery实现). bootstrap特点:简洁.直观.强悍.移动设备优先的前端开发框架, ...

  2. CI(CodeIgniter)框架下使用非自带类库实现邮件发送

    在项目开发过程中,需要到了邮件提醒功能.首先想到的是CI自身带不带邮件发送类,查看帖子,发现CI本身自带,然后试着利用CI自身带的类库来实现,经过搜搜很多帖子,不少开发者反馈CI自身的Email类有问 ...

  3. promql查询表达式

    Basics 即时矢量选择器 =:匹配与标签相等的内容!=:不匹配与标签相等的内容=~: 根据正则表达式匹配与标签符合的内容!~:根据正则表达式不匹配与标签符合的内容 示例: http_request ...

  4. bzoj 3262 陌上花开 - CDQ分治 - 树状数组

    Description 有n朵花,每朵花有三个属性:花形(s).颜色(c).气味(m),又三个整数表示.现要对每朵花评级,一朵花的级别是它拥有的美丽能超过的花的数量.定义一朵花A比另一朵花B要美丽,当 ...

  5. aop的使用

    最近考虑需要记录客户对项目的操作日志. 如果在每一个客户都有可能操作的类增加日志对象,改动量太大,同时如果有新的功能增加,又要在新的功能上增加日志操作. 因此考虑后决定采用spring的aop功能. ...

  6. 解决Tax discount configure 报出异常

    If your tax calculation is based on a problematic configuration, the following warnings appear: Warn ...

  7. Python3基础 list enumerate 将列表的每个元素转换成 带索引值的元组

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...

  8. linux内核中的IPIs是什么?

    答: 处理器间中断(Interprocessor Interrupts)

  9. tp框架中的一些疑点知识-3

    rewrite就是伪静态, 伪静态就是 rewirte, 可以把入口地址隐藏掉. 兼容模式就是 普通模式 和 pathinfo模式的 结合, 前面是普通模式 ?s= , 后面的 模块/控制器/操作和参 ...

  10. 连号区间数|2013年蓝桥杯B组题解析第十题-fishers

    连号区间数 小明这些天一直在思考这样一个奇怪而有趣的问题: 在1~N的某个全排列中有多少个连号区间呢?这里所说的连号区间的定义是: 如果区间[L, R] 里的所有元素(即此排列的第L个到第R个元素)递 ...