html5中如何让四张图片分成两行两列

html5中如何让四张图片分成两行两列,第1张

排列。首先要排列四张照片放置到同一个文件夹中并打开电脑中运行html的软件,其次点击界面中的文件编辑栏选择排列点击浮点排列,最后在d出的页面中点击四张图片并将排列行数设定为两行即可。

//代码不支持IE 因为IE对HTML5支持不好$("#file").change(function(event) { var file = $("#file")[0].files[0]PostFile(file,0) })function PostFile(file,i){var name = file.name,//文件名size = file.size,//总大小shardSize = 2 * 1024 * 1024,shardSize = 2 * 1024 * 1024,//以2MB为一个分片shardCount = Math.ceil(size / shardSize) //总片数if(i >= shardCount){return }//计算每一片的起始与结束位置var start = i * shardSize,end = Math.min(size, start + shardSize) //构造一个表单,FormData是HTML5新增的var form = new FormData() form.append("data", file.slice(start,end)) //slice方法用于切出文件的一部分form.append("lastModified", file.lastModified) //slice方法用于切出文件的一部分form.append("name", name) form.append("total", shardCount) //总片数form.append("index", i + 1) //当前是第几片 //Ajax提交$.ajax({url: "/test/AjaxFile",type: "POST",data: form,async: true,//异步processData: false, //很重要,告诉jquery不要对form进行处理contentType: false, //很重要,指定为false才能形成正确的Content-Typesuccess: function(data){if(data){i = data++ var num = Math.ceil(i*100 / shardCount) $("#output").text(num+'%') PostFile(file,i) }}}) }


欢迎分享,转载请注明来源:内存溢出

原文地址: https://www.outofmemory.cn/zaji/7268560.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-03
下一篇 2023-04-03

发表评论

登录后才能评论

评论列表(0条)

保存