Package Exports

liquify-js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (liquify-js) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Liquify js

Web-GL filter for rasterize and liquify HTML elements

Demo

📦 Install

Install with npm.

npm install liquify-js

Include JavaScript file.

<script type="text/javascript" src="node_modules/liquify-js/dist/liquify.js"></script>

💧 Usage

Add liquify attribute to an HTMLElement.

<div liquify>Liquified</div>

Options frequency, degree and amplitude can be configured using attributes.

<div liquify
     liquify.frequency="0.5"
     liquify.degree="55"
     liquify.amplitude="0.5">Liquified</div>

Options can be configured dynamically using the Liquify property of the HTMLElement.

const element = window.document.querySelector("[liquify]");
element.Liquify.frequency = 0.5;
element.Liquify.degree = 55;
element.Liquify.amplitude = 0.5;

😻 Demo

Try the WebGL filter on an HTMLElement by visiting the GitHub Pages.

🎓 License

This project is licensed under the MIT License.