欢迎来到天天文库
浏览记录
ID:14156389
大小:51.50 KB
页数:29页
时间:2018-07-26
《html canvas实现烟花绽放特效》由会员上传分享,免费在线阅读,更多相关内容在教育资源-天天文库。
1、★精品文档★HTML5Canvas实现烟花绽放特效 本文为大家带来了一款,免费而又安全环保的HTML5Canvas实现的放烟花特效。效果如下:代码如下: XML/HTMLCode<!DOCTYPEHTML <html <head <titleCanvas实现放烟花特效</title <metacharset=“utf-8” <metahttp-equiv=“X-UA-Compatible”co
2、ntent=“IE=edge” <metaname=“viewport”content=“width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no” <styletype=“text/css” html,body{height:100%;margin:0;padding:0}2016全新精品资料-全新公文范文-全程指导写作–独家原创2
3、9/29★精品文档★ ul,li{text-indent:0;text-decoration:none;margin:0;padding:0} img{border:0} body{background-color:#000;color:#999;font:100%/18pxhelvetica,arial,sans-serif} canvas{cursor:crosshair;display:block;left:0;pos
4、ition:absolute;top:0;z-index:20} #headerimg{width:100%;height:20%;} #bgimg{width:100%;height:80%;} #header,#bg{position:fixed;left:0;right:0;z-index:10} #header{top:0} #bg{position:fixed;z-index:1;
5、bottom:0} 2016全新精品资料-全新公文范文-全程指导写作–独家原创29/29★精品文档★audio{position:fixed;display:none;bottom:0;left:0;right:0;width:100%;z-index:5} </style </head <body <divid=“bg” <imgid=“bgimg”src=“http://
6、img.ivsky.com/img/tupian/pre/201508/02/yuzhou_xingkong_yu_yueliang-006.jpg” </div <scriptsrc=“http://cdn.bootcss.com/jquery/2.2.0/jquery.min.js”</script <script $(function(){ varFireworks=function(){&nbs
7、p; varself=this; //产生烟花随机数 varrand=function(rMi,rMa){ //按位取反运算符2016全新精品资料-全新公文范文-全程指导写作–独家原创29/29★精品文档★ return~~((Math.random()*(rMa-rMi+1))+rMi); &nb
8、sp; },hitTest=functio
此文档下载收益归作者所有