<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>简单易用的类似banner切换效果的图片墙动画效果</title>
<link rel="stylesheet" href="css/lanren.css">
</head>
<body>
<!-- 代码部分begin -->
<div id="wrap" class="wrap">
<div class="photo" id="photo_{{index}}" onclick="turn(this)">
<div class="photo_wrap" >
<div class="side side_front">
<div class="image">
<img src="images/{{img}}" alt="{{alt}}"/>
</div>
<div class="capation">
{{caption}}
</div>
</div>
<div class="side side_back">
<div class="desc">
{{desc}}
</div>
</div>
</div>
</div>
</div>
<script>
var myData = [];
var myDataStr = "1.霍比特人<br>\
<br>\
导演:彼得.杰克逊<br>\
编剧:弗兰.威尔士<br>\
主演:傻逼<br>\
类型:动作<br>\
制片国家:美国<br>\
语言:英语<br>\
上映时间:2015-01-23<br>\
片长:144分钟<br>\
<br>\
<br>\
2.冰雪奇缘<br>\
<br>\
导演:彼得.杰克逊<br>\
编剧:弗兰.威尔士<br>\
主演:傻逼<br>\
类型:动作<br>\
制片国家:美国<br>\
语言:英语<br>\
上映时间:2015-01-23<br>\
片长:144分钟<br>\
<br>\
<br>\
3.速度与激情7<br>\
<br>\
导演:彼得.杰克逊<br>\
编剧:弗兰.威尔士<br>\
主演:傻逼<br>\
类型:动作<br>\
制片国家:美国<br>\
语言:英语<br>\
上映时间:2015-01-23<br>\
片长:144分钟<br>\
<br>\
<br>\
4.一路惊喜<br>\
<br>\
导演:彼得.杰克逊<br>\
编剧:弗兰.威尔士<br>\
主演:傻逼<br>\
类型:动作<br>\
制片国家:美国<br>\
语言:英语<br>\
上映时间:2015-01-23<br>\
片长:144分钟<br>\
<br>\
<br>\
5.三傻大闹宝莱坞<br>\
<br>\
导演:彼得.杰克逊<br>\
编剧:弗兰.威尔士<br>\
主演:傻逼<br>\
类型:动作<br>\
制片国家:美国<br>\
语言:英语<br>\
上映时间:2015-01-23<br>\
片长:144分钟<br>\
<br>\
<br>\
6.甜心先生<br>\
<br>\
导演:彼得.杰克逊<br>\
编剧:弗兰.威尔士<br>\
主演:傻逼<br>\
类型:动作<br>\
制片国家:美国<br>\
语言:英语<br>\
上映时间:2015-01-23<br>\
片长:144分钟<br>\
<br>\
<br>\
7.青春三<br>\
<br>\
导演:彼得.杰克逊<br>\
编剧:弗兰.威尔士<br>\
主演:傻逼<br>\
类型:动作<br>\
制片国家:美国<br>\
语言:英语<br>\
上映时间:2015-01-23<br>\
片长:144分钟<br>\
<br>\
<br>\
8.美女<br>\
<br>\
导演:彼得.杰克逊<br>\
编剧:弗兰.威尔士<br>\
主演:傻逼<br>\
类型:动作<br>\
制片国家:美国<br>\
语言:英语<br>\
上映时间:2015-01-23<br>\
<br>\
<br>\
9.邓紫棋<br>\
<br>\
导演:彼得.杰克逊<br>\
编剧:弗兰.威尔士<br>\
主演:傻逼<br>\
类型:动作<br>\
制片国家:美国<br>\
语言:英语<br>\
上映时间:2015-01-23<br>\
<br>\
<br>\
10.铁塔<br>\
<br>\
导演:彼得.杰克逊<br>\
编剧:弗兰.威尔士<br>\
主演:傻逼<br>\
类型:动作<br>\
制片国家:美国<br>\
语言:英语<br>\
上映时间:2015-01-23<br>\
<br>\
<br>\
11.love<br>\
<br>\
导演:彼得.杰克逊<br>\
编剧:弗兰.威尔士<br>\
主演:傻逼<br>\
类型:动作<br>\
制片国家:美国<br>\
语言:英语<br>\
上映时间:2015-01-23<br>\
"
//定义函数分割myData数据 , myData接收分好组的数据 :以三个连续的<br>\标记为分界
var d = myDataStr.split("<br><br><br>"); //以三个br分出不同大主题
for(var i=0 ;i< d.length;i++){
var c = d[i].split("<br><br>");
myData.push(
{
img:c[0].replace('.',"")+".jpg",
caption:c[0].split('.')[1],
desc:c[1]
}
)
}
</script>
<script src="js/lanren.js"></script>
<!-- 代码部分end -->
</body>
</html>
没有合适的资源?快使用搜索试试~ 我知道了~
简单易用的类似banner切换效果的图片墙动画效果.rar
共16个文件
jpg:12个
js:1个
css:1个
1.该资源内容由用户上传,如若侵权请联系客服进行举报
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
版权申诉
0 下载量 31 浏览量
2024-01-04
01:21:48
上传
评论
收藏 2.03MB RAR 举报
温馨提示
经典的JS特效动画效果,效果实现的全部代码已提供,可供学习借鉴
资源推荐
资源详情
资源评论
收起资源包目录
简单易用的类似banner切换效果的图片墙动画效果.rar (16个子文件)
简单易用的类似banner切换效果的图片墙动画效果
简单易用的类似banner切换效果的图片墙动画效果
index.jpg 18KB
js
lanren.js 5KB
css
lanren.css 2KB
index.html 4KB
images
8美女.jpg 45KB
3速度与激情7.jpg 8KB
1霍比特人.jpg 27KB
4一路惊喜.jpg 67KB
9邓紫棋.jpg 66KB
6甜心先生.jpg 14KB
2冰雪奇缘.jpg 26KB
10铁塔.jpg 29KB
7青春三.jpg 10KB
5三傻大闹宝莱坞.jpg 85KB
11love.jpg 19KB
动画000001.gif 1.64MB
共 16 条
- 1
资源评论
马coder
- 粉丝: 1203
- 资源: 6602
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功