使用 javascript 获取 GIF 图的帧数，如果帧数过大，则不让传到服务器

这里是使用一个插件： github地址为： https://github.com/buzzfeed/libgif-js

下面是获取的代码:

<!DOCTYPE html>

<html>

	<head>

		<meta charset="utf-8">

		<title></title>

		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

		<style type="text/css">

			*{

				padding: 0;

				margin: 0;

				box-sizing: border-box;

			}

		</style>

	</head>

	<body>

		<input type="file" name="file" id="file" value="" />

	</body>

	<script type="text/javascript" src="js/libgif.js"></script>

	<script type="text/javascript">

		document.getElementById("file").onchange = function(e){

            var filse = this.files;

			sendFile(filse[0]);

        }

		function sendFile(file){

			var reader =new FileReader();

			reader.readAsDataURL(file);

			reader.onload=function(e){

				var div = document.createElement("div");

				var img = document.createElement("img");

				div.appendChild(img);

				img.src = this.result;

				img.onload = function(){

					var rub = new SuperGif({ gif: img} );

					rub.load(function(){

						console.log(rub.get_length());

					});

				}

			}

		}

	</script>

</html>

　　

js获取 gif 的帧数的更多相关文章

  1. js获取文本的行数

    <div class="txt" style="line-height:30px">我是文字<br>我是文字<br>我是文字 ...

  2. js日期的写法，获取girdviw的行数、提示信息、验证数量信息

    //制订日期(js日期的写法) var myDate = new Date(); var theDate = myDate.toLocaleDateString();  //获取今天的日期 //获取控 ...

  3. C#获取gif帧数

    C#获取gif帧数 /// <summary> /// 获取gif帧数 /// </summary> /// <param name="gifBytes&quo ...

  4. js获取字符串字节数方法小结

    js获取字符串字节数的方法.分享给大家供大家参考.具体如下: 大家都知道,获取字符串的长度可用length来获取,那么获取这段字符串的字节数呢? 英文字母肯定lenght和字节数都一样:都是1而中文l ...

  5. 腾讯云图片鉴黄集成到C# SQL Server 怎么在分页获取数据的同时获取到总记录数 sqlserver 操作数据表语句模板 .NET MVC后台发送post请求 百度api查询多个地址的经纬度的问题 try{}里有一个 return 语句，那么紧跟在这个 try 后的 finally {}里的 code 会 不会被执行，什么时候被执行，在 return 前还是后? js获取某个日期

    腾讯云图片鉴黄集成到C#   官方文档:https://cloud.tencent.com/document/product/641/12422 请求官方API及签名的生成代码如下: public c ...

  6. 【2017-06-29】在登录页面自动返回上次请求页面、Js获取table中的行数与列数

    一.在登录页面自动返回上次请求页面 Request.UrlReferrer比如 if (Request.UrlReferrer != null) { //如果能获取来路地址 Response.Redi ...

  7. js获取当前系统时间

    Js获取当前日期时间及其它操作var myDate = new Date();myDate.getYear(); //获取当前年份(2位)myDate.getFullYear(); //获取完整的年份 ...

  8. Js获取当前日期时间及其它操作

    Js获取当前日期时间及其它操作var myDate = new Date();myDate.getYear(); //获取当前年份(2位)myDate.getFullYear(); //获取完整的年份 ...

  9. android获取textview的行数

    最近项目需求,需要获取Textview的行数,通过行数与TextView的maxLines进行比较来确定是否显示TextView下方的展开按钮是否显示,废话少说直接上代码,mTextView.getL ...

随机推荐

  1. hiveserver2启动成功但无法通过beeline连接

    可能是配置的问题. 我将hive.metastore.uris从配置文件中注释掉之后解决了hiveserver2启动成功但无法通过beeline连接的问题. [root@node03 conf]# v ...

  2. [原创]基于Zynq AXI-GPIO Standalone & Linux 例程

    基于Zynq AXI-GPIO Standalone & Linux 例程 待添加完善中

  3. LCA最近公共祖先

    不会 准备研究一波!!! #include<bits/stdc++.h> ; using namespace std; vector<int> g[maxn]; ][maxn] ...

  4. React(v16.8.4)生命周期详解

    当前版本v16.8.4 装载过程(组件第一次在DOM树中渲染的过程): constructor(常用) -> getInitialState(v16.0已废弃) -> getDefault ...

  5. 我的 FPGA 学习历程（03）—— 使用 Quaruts 自带仿真工具

    在上一篇中详细的介绍了怎样创建原理图工程,这篇同样使用原理图工程新建一个多路选择器,目的是学习使用图形输入的仿真工具输入仿真激励. 新建工程,并绘制以下的原理图. 编译项目,会多出一个警告: Crit ...

  6. Urozero Autumn 2016. NCPC 2016

    A. Artwork 倒过来并查集维护即可. #include<cstdio> #include<algorithm> using namespace std; const i ...

  7. js 类数组对象arguments

    function Add() { for (var i = 0; i < arguments.length; i++) { console.log(arguments[i]); } } Add( ...

  8. node环境配置

    1.进入node的官网https://nodejs.org/en/download/ 2.选择自己需要的安装包 3.下载之后,直接安装http://www.runoob.com/nodejs/node ...

  9. 归并排序&&归并排序求逆序对

    归并排序 归并排序(MERGE-SORT)是建立在归并操作上的一种有效的排序算法,该算法是采用分治法(Divide and Conquer)的一个非常典型的应用.将已有序的子序列合并,得到完全有序的序 ...

  10. __x__(35)0908第五天__ 层级 z-index

    如果三个 div 全部设置 position: absolute; 绝对定位,且未设置 z-index,  则从代码结构上    下面的元素 会盖住 上面的元素. z-index 层级: 通过 z-i ...