小編給大家分享一下JavaScript中實現煙花綻放動畫效果的方法，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

成都創新互聯專注于企業成都營銷網站建設、網站重做改版、蘆淞網站定制設計、自適應品牌網站建設、HTML5建站、商城系統網站開發、集團公司官網建設、成都外貿網站制作、高端網站制作、響應式網頁設計等建站業務，價格優惠性價比高，為蘆淞等各大城市提供網站開發制作服務。

      先編寫一個煙花綻放的動畫效果。

      放煙花時，一個煙花可分為兩個階段：（1）煙花上升到空中；（2）煙花炸開成碎片，炸開的碎片慢慢消散。

      為此抽象出兩個對象類：Firework和Particle。其中，Firework用于表示一個煙花對象，Particle用于表示一個煙花炸開后的各碎片。

      Firework對象類定義6個屬性：表示煙花上升軌跡中各點的坐標（x,y）、煙花弧狀軌跡的偏轉角度angle、上升階段水平和垂直方向的位移改變量xSpeed和ySpeed、煙花的色彩色相hue。

      坐標屬性值y的初始值取畫布的高度，表示煙花從地面上升到空中，其余各屬性的初始值采用隨機數確定。具體定義如下：

  function Firework()

  {

   this.x = canvas.width/4*(1+3*Math.random());

   this.y = canvas.height - 15;

   this.angle = Math.random() * Math.PI / 4 - Math.PI / 6;

   this.xSpeed = Math.sin(this.angle) *(6+Math.random()*7);

   this.ySpeed = -Math.cos(this.angle) *(6+Math.random()*7);

   this.hue = Math.floor(Math.random() * 360);

  }

網頁標題：JavaScript中實現煙花綻放動畫效果的方法-創新互聯
轉載來源：http://www.yijiale78.com/article8/doccop.html

成都網站建設公司_創新互聯，為您提供全網營銷推廣、靜態網站、小程序開發、手機網站建設、商城網站、網站改版

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯