TweenMax+easeljs实现等离子粒子动画效果代码
代码语言:html
所属分类:粒子
代码描述:TweenMax+easeljs实现等离子粒子动画效果代码
代码标签: TweenMax easeljs 等离子 粒子 动画
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
html, body{
width:100%;
height:100%;
padding:0px;
margin:0px;
overflow: hidden;
background: #ff00b3;
background: -moz-linear-gradient(0deg, #ff00b3 50%, #283139 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right bottom, color-stop(50%,#ff00b3), color-stop(100%,#283139)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(0deg, #ff00b3 50%,#283139 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(0deg, #ff00b3 50%,#283139 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(0deg, #ff00b3 50%,#283139 100%); /* IE10+ */
background: linear-gradient(0deg, #ff00b3 50%,#283139 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff00b3', endColorstr='#283139',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
background-attachment: fixed
}
#projector {
position: absolute;
top: 0px;
left: 0px;
width:100%;
height:100%;
}
.center-div {
width:580px;
height:374px;
position:absolute;
left:50%;
top:50%;
margin-left: -290px;
margin-top: -187px;
}
#preloaderDiv
{
position:absolute;
left:50%;
top:50%;
margin-left: -27px;
margin-top: -27px;
}
#logo{
opacity:0;
filter: alpha(opacity=0);
}
#date2014
{
position:absolute;
padding-left: 210px;
padding-top:15px;
opacity:0;
top:303px;
left:0;
filter: alpha(opacity=0);
}
</style>
</head>
<body>
<!-- partial:index.partial.html -->
<canvas id="projector"></canvas>
<!-- partial -->
<scri.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0