CSS3 波浪简单模拟我是波浪，我有起伏，有大波与小波（坏笑中.）_html/css_WEB-ITnose

我是波浪，我有起伏，我有大波与小波（坏笑中...）

　　最近改版网站，一般也不会去写动画，但是有些网站还是需要的，故拿出一个较简单的动画出来分享，很简单很简单。

原理简单阐述

　　其实很简单，使用一张美工做好了的2400px宽度的3个不同起伏的波浪，然后自己合成为一张【精灵图片】（有助于一起加速加载和同时加载）

有了素材就好办了，使用一个容器把3个div背景的波浪堆在一起，然后使用css3的偏移进行移动，当然左右和上下都要，然后慢慢调整为一个适合的时间和延迟。

废话不多说，先上演示地址：http://sandbox.runjs.cn/show/akodn0vt

波浪动画CSS

波浪动画HTML

    
  
 
我是波浪，我有起伏，我有大波与小波（坏笑中...）
 
 
 
 
 
 
 
 
 
 

好咯，代码附送完毕。