基于HTML/CSS/Echarts的会议展览、业务监控、风险预警、数据分析展示等多种展示需求可视化集合 完整代码下载地址：11套烟花代码，多种方式实现的烟花代码 运行效果： index.html
烟花合集 body { background: #000; } .header { width: 1000px; margin: 0 auto; } .header p.p1 { width: 60px; height: 60px; margin: 0 auto; margin-top: 110px; } .header p.p2 { height: 40px; margin: 0 auto; text-align: center; line-height: 40px; margin-top: 10px; font-size: 20px; color: #fec468; } .header p.p3 { margin: 0 auto; text-align: center; line-height: 40px; font-size: 28px; color: #bddde6; } .contain { /*width: 1210px;*/ margin: 0 auto; margin-top: 80px; height: 400px; } .border { width: 400px; height: 370px; background-color: red; float: left; margin: 40px; transform: translate(0%, 0%); border: 1px solid #0E273D; /*background: #444;*/ } .border > div { position: absolute; width: 100%; height: 100%; transition: .5s; } .border:hover > .border-top-bottom { transform: rotateY(0); } .border:hover > .border-left-right { transform: rotateX(0); } .border-top-bottom { border: 1px solid transparent; border-top: 1px solid #57daff; border-bottom: 1px solid #57daff; transform: rotateY(90deg); } .border-left-right { border: 1px solid transparent; border-left: 1px solid #57daff; border-right: 1px solid #57daff; transform: rotateX(90deg); } .border_div { width: 400px; height: 370px; } .border_div_top { width: 400px; height: 300px; background-color: #fff; } .img { width: 100%; height: 100%; } .border_div_bottom { width: 400px; height: 70px; color: #57daff; background-color: #0E273D; line-height: 70px; text-align: center; font-weight: 600; }烟花合集
——by XiongZe 演示
HTML5 Canvas庆祝春节过年放烟花动画代码 HTML5烟花绽放场景动画 HTML5炫酷喜庆全屏烟花动画特效 HTML5点击燃放烟花 HTML5漂亮的3D烟花动画 HTML5烟花粒子特效 jQuery随机点名中奖后放烟花动画特效 css3烟花和霓虹灯文字动画效果 HTML5 Canvas彩色烟花动画特效 jQuery+css3实现鼠标点击烟花播放效果 HTML5 Canvas烟花喷泉动画特效完整代码下载地址：11套烟花代码，多种方式实现的烟花代码