`
zht1933
  • 浏览: 223452 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

进度条

JavaScriptCSSGoHTML 
阅读更多


<html>
<head>
<style type="text/css">
.graph{
    width:450px;
    border:1px solid #F8B3D0;
    height:25px;
}

#bar{
    display:block;
    background:#FFE7F4;
    float:left;
    height:100%;
    text-align:center;
}
</style>

<script type="text/javascript">
function $(obj){
    return document.getElementById(obj);
}

function go(){
    //判断总数据进度百分比
    //当大于当前进度条宽度时，改变当前进度条宽度

    //设置进度条值
    $("bar").style.width = parseInt($("bar").style.width) + 1 + "%";
    $("bar").innerHTML = $("bar").style.width; //设置进度条显示值

    //判断是否到达进度条总值
    if($("bar").style.width == "100%"){
        window.clearInterval(bar); //结束进度条
    }
}

//每隔50毫秒调用一次
var bar = window.setInterval("go()",50); //开始进度条
</script>
</head>

<body>

<div class="graph"><strong id="bar" style="width:1%;"></strong></div>

</body>
</html>

分享到：
| StAX解析XML
评论
1 楼 xuliuliu 2012-09-25  
为什么宽度为0的时候进度条不走呢
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    渐变进度条 美化进度条

    在UI设计中，进度条是常见的一种用户界面元素，它用于指示某个操作的进度或状态。"渐变进度条 美化进度条"这个主题着重于如何通过使用渐变色彩来提升进度条的视觉效果，使其看起来更加美观且舒适。渐变色的设计不仅...

    DataGridView进度条 DataGridView进度条 C#

    在处理大量数据或者执行耗时操作时，为用户提供一个进度条是非常有用的，可以提高用户体验，显示数据加载或处理的状态。本文将详细介绍如何在C#中为`DataGridView`添加进度条功能。 首先，我们需要引入`ProgressBar...

    80个GIF进度条,漂亮的动态加载进度条

    在网页设计和用户体验领域，动态加载进度条是一个重要的元素，它能够向用户显示数据或内容正在加载的过程，提高用户对系统响应的认知，并提供更舒适的等待体验。标题提到的"80个GIF进度条"是一套丰富的资源集合，...

    C#自定义进度条大全

    在C#编程中，自定义进度条是一种常见且实用的需求，它可以为用户提供视觉反馈，显示应用程序执行任务的进度。本文将深入探讨如何在C#中实现各种自定义进度条，包括圆滑的、多边形的等不同设计样式，并提供相关的控件...

    无尽的进度条3.0

    "无尽的进度条3.0"是一款专为用户界面设计打造的动态进度条效果工具。这个工具可能被开发者或设计师用于创建具有视觉吸引力的、持续不断的加载效果，以提高用户体验。在某些应用中，例如数据加载、上传或下载过程中...

    NC65进度条功能.rar

    在IT行业中，尤其是在软件开发领域，进度条是一个非常常见的用户界面元素，它为用户提供了一种可视化的方式来了解某个任务的执行进度。在这个名为“NC65进度条功能.rar”的压缩包中，我们关注的是如何在NC65环境中...

    易语言更改进度条颜色

    在编程领域，进度条是一种常见的用户界面元素，用于表示任务执行的进度，为用户提供操作反馈。易语言（E语言）是中国本土开发的一种简单易学的编程语言，它以直观的汉字作为关键字，使得非计算机专业人员也能快速...

    WPF实现的圆形进度条

    在Windows Presentation Foundation（WPF）中，开发人员可以利用丰富的图形功能来创建各种自定义控件，其中之一就是圆形进度条。这种控件通常用于显示任务的进度，它以环形的方式展示，既美观又直观。在本文中，我们...

    带有文本的进度条

    在Android开发中，进度条（Progress Bar）是一种常见的UI组件，用于显示某个操作的进度或者加载状态。在标题“带有文本的进度条”中提到的，这种进度条不仅具有显示进度的功能，还能够结合文本内容，提供更丰富的...

    C#winform 自定义控件实现圆形进度条和环形进度条控件

    本项目专注于创建两种特殊的进度条控件：圆形进度条和环形进度条，这些控件适用于展示任务或进程的进度，视觉效果独特，能吸引用户注意力。通过VS2017开发，它们可以直接在WinForm应用中编译并运行，为用户提供实时...

    C#进度条 不假死的进度条

    用两个方法实现进度条，切换，最小化恢复窗口，进度条正常，不假死！请用Microsoft Visual Studio 2008打开，或先执行EXE看看是否是自己需要的！ 注： 下载资源时，看清楚此文档说明，我不是为了积分而放在这里，我...

    QT实现的特色进度条

    QT实现的特色进度条是一种在GUI（图形用户界面）应用中提供反馈的创新方式，它模仿了地铁站的进度灯效果，为用户提供一种视觉上吸引人的进度指示。Qt是一个跨平台的C++库，用于创建桌面、移动以及嵌入式设备上的应用...

    12款进度条脚本demo

    在网页设计和开发中，进度条是一个非常重要的交互元素，它能够给用户反馈操作的状态，如文件上传、数据加载或任务执行的进度。本资源"12款进度条脚本demo"显然是一份集合了多种进度条实现方式的示例集，主要关注CSS...

    Android 电池电量进度条，上下滚动图片的进度条（battery）

    Android SDK 提供了多种类型的进度条，包括HorizontalProgressBar（水平进度条）和CircularProgressBar（圆形进度条）。在这个场景下，我们可以选择自定义一个水平进度条，通过改变其高度来模拟上下滚动的效果。 1....

    C#winform条形方格进度条，横竖进度条

    本文将深入探讨如何实现一个自定义的条形方格进度条，包括横置和竖置两种显示方式，并允许用户自定义底色、进度颜色、是否显示进度值以及字体大小。这个控件是基于GDI+图形接口进行绘制的，具有高度的灵活性和可定制...

    BAT批处理脚本-提示窗口进度条-娱乐进度条.cmd.zip

    标题中的“BAT批处理脚本-提示窗口进度条-娱乐进度条.cmd.zip”指的是一个包含批处理脚本的压缩文件，主要用于在Windows操作系统中展示一个带有进度条的提示窗口。批处理脚本（BAT）是基于DOS或Windows环境下的一种...

    winform竖向进度条

    在Windows Forms（WinForm）开发中，用户界面的构建是至关重要的，而进度条控件是一种常见的元素，用于展示任务的执行进度。在传统的WinForm应用中，进度条通常是水平显示的，但有时为了满足界面设计的需求或者提高...

    c++ MP3播放器进度条创建

    ### C++ MP3播放器进度条创建 #### 知识点概述 本文旨在介绍如何在C++环境下，特别是在Microsoft Visual C++（以下简称VC++）中使用MFC框架创建MP3播放器的进度条。进度条作为一种重要的用户界面元素，不仅能够...

    c# 进度条(进度条具有渐变色）

    在C#编程中，创建一个具有渐变色的自定义进度条可以提升用户界面的美观性和用户体验。渐变色进度条不仅能够展示进度，还能通过颜色的变化为用户提供更直观的反馈。下面我们将深入探讨如何利用C#实现这样一个功能，并...

    Unity+UGUI 圆形进度条

    在UGUI中，开发者可以创建各种复杂的UI元素，包括按钮、文本、图像以及今天的主角——进度条。本教程将详细介绍如何使用Unity和UGUI来创建一个圆形进度条，并探讨其在进度指示和拖拽验证码功能上的应用。 一、UGUI...

Magicbox
Global site tag (gtag.js) - Google Analytics