Facebook样式的gif动态图片预览和播放插件gifsee.js

 查看演示  website  立即下载

注：本地预览用火狐浏览器，chorme浏览器本地预览报错

gifsee.js使用方法

在页面中引入gifsee.js文件和样式文件gifsee.min.css。

<link rel="stylesheet" href="path/to/gifsee.min.css">
<script src="path/to/gifsee.js"></script>

HTML结构

为需要动态加载的gif图片设置下面的HTML结构。

<img src="frame.png" data-gifsee="example.gif" id="super-cool-gif">

其中，src属性指向的是封面静态图片的地址，data-gifsee属性指向的是gif图片的地址。

初始化插件

在页面DOM元素加载完毕之后，可以通过下面的方法来初始化gifsee.js插件。

var myImage = new gifsee(document.getElementById('super-cool-gif'));

PREVIOUS:
NEXT:
jQuery滑动导航插件
3D方向意识悬停效果