Lake.js: плагин к jQuery для отражения иллюстраций как бы в воде озера04.05.2012 09:57

Хабы: jQuery, Canvas

Стал известен скрипт lake.js — плагин jQuery, который берёт иллюстрацию (элемент ) и помещает её на холст (вставляет элемент ), располагая сразу под нею зеркальное отражение, идущее волнами — будто в воде озера.

Речь идёт не о застывших волнах, а об идущих по воде волнах — их фаза динамически изменяется джаваскриптом. (Понятно, что на Хабрахабре этот эффект не воспроизводим, так что я вставляю статический скриншот.)

Холст имеет ту же ширину, что и обрабатываемая иллюстрация, и вдвое бóльшую высоту.

Вызов плагина выглядит сравнительно просто и самоочевидно:

<script src="jquery.js"></script>
<script src="lake.js"></script>
<script>
$(function() {
   $('#lake-img').lake({
      'speed': 1,
      'scale': 0.5,
      'waves': 10
   });
});
</script>
...

Читать дальше →

© Habrahabr.ru