<!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>可爱卡通风格CSS3焦点图图文动画切换特效</title>
<link rel='stylesheet' href='css/font-awesome.min.css'>
<link rel="stylesheet" type="text/css" href="css/normalize.css" />
<link rel="stylesheet" type="text/css" href="css/demo.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body><script src="/demos/googlegg.js"></script>
<div class='ui'>
<div class='ui_inner'>
<div class='ui_fruit'>
<img src='img/treats.png'>
</div>
<div class='ui_basket'>
Basket
<i class='fa fa-shopping-cart'></i>
</div>
<div class='ui_inner__selection'>
<input checked='checked' id='lovely' name='selection' type='radio'>
<label for='lovely'>
<div class='selected l'>Lovely cupcake</div>
<div class='ui_inner__slider'>
<div class='sb'>
<img src='img/starburst2.png'>
</div>
<div class='slide'>
<div class='slide_inner'>
<div class='slide_inner__left'>
<img src='img/cupcake1.png'>
<div class='firework'>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
</div>
</div>
<div class='slide_inner__right'>
<h2>Lovely cupcake</h2>
<h3>$4.99 <span> Pack of 10</span></h3>
<p>Pie cupcake caramels marshmallow ice cream icing. Brownie biscuit candy macaroon dessert ice cream halvah. Cheesecake sweet roll marzipan brownie lollipop gummies.</p>
<input type='text' value='10'>
<input class='hid' id='add' type='checkbox'>
<label for='add'>
<div class='add'>
Add to cart
<div class='firework'>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
</div>
</div>
</label>
</div>
</div>
</div>
</div>
</label>
<input id='super' name='selection' type='radio'>
<label for='super'>
<div class='selected s'>Super cupcake</div>
<div class='ui_inner__slider'>
<div class='sb'>
<img src='img/starburst2.png'>
</div>
<div class='slide'>
<div class='slide_inner'>
<div class='slide_inner__left'>
<img src='img/cupcake2.png'>
<div class='firework'>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
<div class='firework_part'></div>
没有合适的资源?快使用搜索试试~ 我知道了~
资源推荐
资源详情
资源评论
收起资源包目录
可爱卡通风格CSS3焦点图图文动画切换特效.zip (18个子文件)
img
cupcake2.png 83KB
cupcake1.png 87KB
food.png 5KB
starburst2.png 91KB
cupcake4.png 86KB
cupcake3.png 74KB
treats.png 73KB
css
style.css 97KB
bootstrap.min.css 111KB
demo.css 753B
normalize.css 2KB
font-awesome.min.css 21KB
index.html 21KB
fonts
FontAwesome.otf 84KB
fontawesome-webfont.eot 55KB
fontawesome-webfont.woff 64KB
fontawesome-webfont.svg 280KB
fontawesome-webfont.ttf 110KB
共 18 条
- 1
资源评论
码云笔记
- 粉丝: 2w+
- 资源: 5851
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功