Волны океана на HTML5 Canvas — Уникальные скрипты и готовые решения для сайта

Крутая реализация вздымающихся волн, которая выполнена средствами HTML5 Canvas

Для начала посмотрите ДЕМО

Моё тестирование в редакторе: КЛИК

Установка:

1#: В самый низ вашего CSS вставьте:

body {
background: -webkit-radial-gradient(circle cover, #cfe6fc, #6eb3f7);
background: radial-gradient(circle cover, #cfe6fc, #6eb3f7);
}

body {

background: -webkit-radial-gradient(circle cover, #cfe6fc, #6eb3f7);

background: radial-gradient(circle cover, #cfe6fc, #6eb3f7);

}

2#: На нужных страницах между <body> и </body> поместите:

<canvas id="mycanvas"></canvas>
<script src="/js/simplex-noise.min.js"></script>
<script src="/js/ocean.js"></script>

Осталось лишь залить два JS файла из прикреплённого архива в папку js

Возможно, Вам будет интересно:

Вращающаяся звёздная система на Tree Canvas и HTML5 Canvas