JS動畫庫：Cquence.js

jopen 9年前發布 | 10K 次閱讀 JavaScript開發 Cquence.js

Cquence 是一個非常小的 JavaScript 動畫庫，用于橫幅和廣告的展示。 

var render = combine(     
    sequence( 
       sleep( 100 ),
       linear('frame3', 10000, { left: -900 }, {left: 300 })
    ),
    sequence(
      easeOut('frame1', 2000, { left: -1000 }, { left: 120 }),
      easeIn('frame6', 1000, { opacity: 0 }, { opacity: 1}),
      easeIn('frame7', 1000, { opacity: 0 }, { opacity: 1}),
      combine(
          easeIn('frame6', 1500, { opacity: 1 }, { opacity: 0}),
          easeIn('frame7', 1500, { opacity: 1 }, { opacity: 0}),
          easeIn('frame8', 1500, { opacity: 0 }, { opacity: 1})
      ),
      sleep(1000),
      easeIn('frame8', 1000, { opacity: 1 }, { opacity: 0}),
      easeIn('frame9', 1000, { opacity: 0, left: -300 }, { opacity: 1, left: 10}),
      sleep(1500),
      sequence(
        combine(
            easeIn('frame1', 1500, { left: 120 }, { left: -620 }),
            easeOut('frame9', 2000, { opacity: 1, left: 10 }, { opacity: 0, left: -300 })
        ),
        easeIn('frame2', 1000, { opacity: 0 },{ opacity: 0

        }),
        easeOut('frame10', 1000, { bottom: -260 }, { bottom: 0 })

      )

    ),
    sequence(

    )
);

// launch the animation
renderloop();


項目主頁：http://www.baiduhome.net/lib/view/home/1421469526187

 本文由用戶 jopen 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
 轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！