<!DOCTYPE html>
<!--[if IE 7]>
<html class="ie ie7" lang="zh-CN">
<![endif]-->
<!--[if IE 8]>
<html class="ie ie8" lang="zh-CN">
<![endif]-->
<!--[if !(IE 7) | !(IE 8) ]><!-->
<html lang="zh-CN">
<!--<![endif]-->
<head>
<meta charset="utf-8">
<title>动漫APP含弹幕下载页</title>
<meta name="keywords" content=""/>
<meta name="description" content=""/>
<meta name="renderer" content="webkit"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<link rel="shortcut icon" href="/favicon.ico" />
<meta name="viewport"
content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
<!--[if IE 6]>
<style type="text/css">
div.section img {
behavior: url(js/iepngfix.htc);
}
</style>
<![endif]-->
<!--[if lt IE 9]>
<script src="js/respond.min.js"></script>
<script src="js/html5shiv.min.js"></script>
<![endif]-->
<script src="js/google_ga3.js"></script>
<script src="js/jquery-1.11.1.min.js"></script>
<style type="text/css">
* {
margin:0;
padding:0;
font-family: "PingFang SC","Microsoft Yahei","Helvetica Neue", "Luxi Sans", "DejaVu Sans", Tahoma, "Hiragino Sans GB", sans-serif;
}
html {
height: 100%;
}
body {
margin: 0;
width: 100%;
height: 100%;
background-color: #e2e2e2;
/*background: url(images/bg.jpg) no-repeat center;*/
background: url(images/300hero-bg.jpg) no-repeat center;
}
.dwn-main {
/*background-image: url(images/dot.png);*/
overflow: hidden;
width: 100rem;
height: 55rem;
position: relative;
}
.dwn-download-center {
transition: opacity .5s;
-webkit-transition: opacity .5s;
-moz-transition: opacity .5s;
}
.dwn-dot {
position: absolute;
top: 6rem;
width: 100%;
height: 23rem;
/* background: url(images/dot-light.png) repeat;*/
}
.dwn-body {
position: relative;
height: 35rem;
top: 5rem;
width: 100%;
}
.dwn-body-diamond {
z-index: 5;
position: absolute;
top: 0;
width: 100%;
height: 100%;
}
.dwn-diamond-qr {
transform: rotateY(-130deg);
-ms-transform: rotateY(-130deg);
-moz-transform: rotateY(-130deg);
display: table;
background: url(images/dwn-shu.png) no-repeat center ;
transition: transform .8s;
-webkit-transition: transform .8s;
-ms-transition: transform .8s;
-monz-transition: transform .8s;
margin: 0 auto ;
background-size: contain ;
height: 100%;
width:17rem;
}
.opacity0 {
opacity: 0 !important;
}
.dwn-diamond-qr.qr-normal {
opacity: 1;
transform: rotateY(0deg);
-ms-transform: rotateY(0deg);
-moz-transform: rotateY(0deg);
}
.dwn-diamond-center {
display: table-cell;
vertical-align: middle;
}
.dwn-diamond-code {
height: 10rem;
background: url(images/ma.png) no-repeat center ;
background-size: contain ;
margin-bottom: 1rem;
}
.dwn-body-cartoon {
overflow: visible;
width: 100%;
height: 100%;
top: 0;
position: absolute;
z-index: 3;
}
.dwn-body-cartoon .cartoon-left {
float: left;
width: 50%;
overflow: hidden;
position: relative;
text-align: right;
}
.dwn-body-cartoon .cartoon-right {
float: right;
overflow: hidden;
position: relative;
width: 50%;
}
.dwn-body-cartoon .cartoon-left .cartoon-figure {
margin-right: 4rem;
left: -100%;
}
.dwn-body-cartoon .cartoon-right .cartoon-figure {
left: 100%;
}
.dwn-body-cartoon .cartoon-figure {
position: relative;
height: 45rem;
/* transition: all 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
transform: translateX(0);*/
}
.cartoon-start .cartoon-ball {
opacity: 0;
}
.cartoon-ball {
transition: opacity 1s;
-moz-transition: opacity 1s;
-webkit-transition: opacity 1s;
display: block;
position: absolute;
opacity: 1;
}
.cartoon-ball.ball1 {
right: 28rem;
bottom: 18rem;
}
.cartoon-ball.ball2 {
right: 21rem;
bottom: 28rem;
}
.cartoon-ball.ball3 {
right: 24rem;
bottom: 28rem;
}
.cartoon-ball.ball4 {
right: 29rem;
bottom: 16rem;
}
.cartoon-ball.ball5 {
right: 14rem;
bottom: 19rem;
}
.cartoon-ball.ball6 {
right: 14rem;
bottom: 19rem;
}
.cartoon-ball.ball7 {
right: 13rem;
bottom: 35rem;
}
.cartoon-ball.ball8 {
right: 24rem;
bottom: 35rem;
}
.dwn-diamond-android {
cursor: pointer;
height: 4rem;
transition:none;
background: url(images/andwn.png) no-repeat center;
background-size: contain;
}
.dwn-diamond-android:hover{
background: url(images/andwnh.png) no-repeat center;
background-size: contain;
}
.dwn-diamond-ios {
cursor: pointer;
height: 4rem;
margin-top: 1rem;
background: url(images/ios_dwn.png) no-repeat center;
background-size: contain;
}
.dwn-diamond-ios:hover{
background: url(images/ios_dwnh.png) no-repeat center;
background-size: contain;
}
.dwn-diamond-yyb {
cursor: pointer;
height: 4rem;
margin-top: 1rem;
background: url(images/yyb_dwn.png) no-repeat center;
background-size: contain;
}
.dwn-diamond-yyb:hover{
background: url(images/yyb_dwnh.png) no-repeat center;
background-size: contain;
}
.dwn-body-line {
bottom: 0;
width: 100%;
position: absolute;
}
.dwn-body-line img {
transition: opacity .3s;
width: 40%;
position: absolute;
}
.dwn-body-line .line-left {
top: -4.5rem;
left: -1rem;
width: 45%;
}
.dwn-body-line .line-right {
top: -4.5rem;
right: -1rem;
width: 45%;
}
.dwn-body .dwn-ybg {
width: 100%;
}
.dwn-dm-top{
z-index: 3;
top: 0;
position: absolute;
}
.dwn-dm-bottom{
bottom: 0;
position: fixed;
}
.dwn-dm-top, .dwn-dm-bottom {
overflow: hidden;
width: 100%;
height: 14rem;
box-sizing
大气漂亮的二次元动漫卡通风格手机APP应用下载页面html源码 带文字弹幕.zip （26个子文件） 
大气漂亮的二次元动漫卡通风格手机APP应用下载页面html源码 带文字弹幕 APP下载界面带弹幕 picture 
dwn-line-right.png 13KB 02_01.png 33KB 01_01.png 20KB
02_03.jpg 33KB 02_04.png 34KB
readme.html 3KB 01_04.png 33KB dwn-line-left.png 13KB 02_02.png 3KB 01_03.jpg 2KB 01_02.png 24KB js 
html5shiv.min.js 3KB google_ga3.js 398B jquery-1.11.1.min.js 100KB su.js 6KB readme.html 3KB index.html 17KB images forum andwn.png 5KB dwn-shu.png 15KB yyb_dwnh.png 5KB dot.png 173B dot-light.png 173B ma.png 18KB 300hero-bg.jpg 891KB yyb_dwn.png 5KB andwnh.png 5KB资源评论
