easeljs实现粒子圆点动态背景分布运动效果代码
代码语言:html
所属分类:粒子
代码描述: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: #191d1e; /* Old browsers */ background: -moz-linear-gradient(0deg, #191d1e 50%, #283139 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, right bottom, color-stop(50%,#191d1e), color-stop(100%,#283139)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(0deg, #191d1e 50%,#283139 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(0deg, #191d1e 50%,#283139 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(0deg, #191d1e 50%,#283139 100%); /* IE10+ */ background: linear-gradient(0deg, #191d1e 50%,#283139 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#191d1e', 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 > <canvas id="projector">Your browser does not support the Canvas element.</canvas> <script type="text/java.........完整代码请登录后点击上方下载按钮下载查看
网友评论0