這篇文章給大家分享的是有關HTML5和Canvas怎么實現煙花綻放特效的內容。小編覺得挺實用的，因此分享給大家做個參考，一起跟隨小編過來看看吧。

創新互聯公司2013年至今，是專業互聯網技術服務公司，擁有項目網站設計制作、成都做網站網站策劃，項目實施與項目整合能力。我們以讓每一個夢想脫穎而出為使命，1280元樺甸做網站,已為上家服務,為樺甸各地企業和個人服務,聯系電話:028-86922220

效果如下：

undefinedundefinedundefined

代碼如下：

XML/HTML Code復制內容到剪貼板

  
  
    
      
   
      
      
      
  html,body{height:100%;margin:0;padding:0}   
  ul,li{text-indent:0;text-decoration:none;margin:0;padding:0}   
  img{border:0}   
  body{background-color:#000;color:#999;font:100%/18px helvetica, arial, sans-serif}   
  canvas{cursor:crosshair;display:block;left:0;position:absolute;top:0;z-index:20}   
  #header img{width:100%; height:20%;}   
  #bg img{width:100%; height:80%;}   
  #header,#bg{position:fixed;left:0;right:0;z-index:10}   
  #header{top:0}   
  #bg{position:fixed;z-index:1;bottom:0}   
  audio{position:fixed;display:none;bottom:0;left:0;right:0;width:100%;z-index:5}