简单易用的进度条 基于HTML5实现

原创 2016年05月30日 10:59:38
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<style>
	.jdtbox {
		padding: 10px 0;
	}
	
	.jdt_dbg {
		background: #fce5e5;
		width: 196px;
		height: 18px;
		border-radius: 10px;
		-webkit-border-radius: 10px;
		overflow: hidden;
		border-top: 1px solid #f9d1d1;
	}
	
	.jdt_mbg {
		background: #f12938;
		height: 18px;
		width: 75%;
		height: 20px;
	}
</style>

<script type="text/javascript">
	$(function() {
		$(".jdt_mbg").animate({
			width : "50%",
		}, 1000);
	});
</script>
<body>

	<form action="http://192.168.1.106:8080/app/img/multiUpload" method="post" enctype="multipart/form-data" name="upload_form">
		<label>选择图片文件</label> 
		<input name="imgFile" type="file" multiple="multiple" accept="image/gif, image/jpeg" /> 
		<input name="upload" type="submit" value="上传" />
	</form>

	<div class="jdtbox">
		<div class="jdt_dbg">
			<div class="jdt_mbg" style="width: ${investDetail.percent*100"></div>
		</div>
	</div>
</body>
</html>

html5 ajax文件上传的进度条实现

html5 ajax文件上传的进度条实现 html5_2.html #parent{width:550px; height:10px; border:2px s...

HTML5状态标签和进度标签

状态标签(实时状态显示:气压,气温) 进度标签(任务过程:安装,加载) value表示当前值 min表示最小值 max表示最大值 low表示最小警戒值 high表示最大警戒值 ...

JAVA学习笔记(1)_____模拟线程通信之生产者消费者问题

生产者在一个循环中不断生产gongxi数据

java文件下载工具类

/** * Desc:下载工具类 * @date 2014-6-26 */ public class DownLoadUtil { /** * Desc:根据文件头判断请求来自的浏览器,...

基于html5的动态进度条简单案例

  • 2015年07月13日 17:07
  • 59KB
  • 下载

用html5和jquery实现圆形进度条

  • 2017年07月30日 16:21
  • 38KB
  • 下载

HTML5利用FormData对象实现显示进度条的文件上传【转】

来自: 这篇文章是我翻译的外文,非本人原创  网上看到很多博客都有转载这篇文章  不过转载的都是英文  所以我就决定翻译一下  (翻译和格式化也耗费了一番心血 (~﹃~)~zZ)  英文能力有限,...

HTML5利用FormData对象实现显示进度条的文件上传【译】

这篇文章是我翻译的外文,非本人原创 网上看到很多博客都有转载这篇文章 不过转载的都是英文 所以我就决定翻译一下 (翻译和格式化也耗费了一番心血 (~﹃~)~zZ) 英文能力有限,大家凑合看吧...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:简单易用的进度条 基于HTML5实现
举报原因:
原因补充:

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