<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Gif图片预览和播放jQuery插件</title>
<!--可无视-->
<link rel="stylesheet" type="text/css" href="css/normalize.css" />
<link rel="stylesheet" type="text/css" href="css/demo.css">
<!--图标样式-->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<!--主要样式-->
<link rel='stylesheet' id='jquery-gif-css' href='css/jquery.gif.css' type='text/css' media='all' />
<!--[if IE]>
<script src="http://libs.useso.com/js/html5shiv/3.7/html5shiv.min.js"></script>
<![endif]-->
</head>
<body>
<div style="margin:50px auto 0 auto;width:820px;">
<img src="img/1.jpg" alt="GIF Loader" data-gif="img/1.gif" class="gif">
<img src="img/2.jpg" alt="GIF Loader" data-gif="img/2.gif" class="gif">
</div>
<script src="js/jquery-2.1.1.min.js"></script>
<script src="js/jquery.gif.min.js"></script>
<script type="text/javascript">
$( document ).ready(function() {
// swap all the gifs on the page.
$('.gif').each(function() {
$(this).gif();
});
});
</script>
</body>
</html>
jQuery实现点击静态图片变gif动态图片预览效果源码.zip
版权申诉
30 浏览量
2022-11-07
23:57:30
上传
评论
收藏 365KB ZIP 举报
jQuery实现点击静态图片变gif动态图片预览效果源码.zip （10个子文件） 
132686915006315208 css 
demo.css 781B jquery.gif.css 626B normalize.css 2KB img 
2.jpg 9KB 1.jpg 10KB
2.gif 154KB 1.gif 167KB
index.html 1KB js jquery.gif.min.js 962B jquery-2.1.1.min.js 82KB资源评论
