css-houdini-noise

0.0.1 • Public • Published

CSS Houdini [Worklet Name]

A CSS Houdini Worklet to show connected nodes.

CSS Houdini [Worklet Name]

Getting started

1. Load the worklet

Using CDN is the easiest way to add the library:

if ('paintWorklet' in CSS) {
  CSS.paintWorklet.addModule('[URL]');
}

Or, download the latest Worklet name and import it to your web page:

if ('paintWorklet' in CSS) {
  CSS.paintWorklet.addModule('[LOCAL_PATH]');
}

You can use the polyfill

To add support for all moder browsers, you can load the worklet with css-paint-polyfill fallback.

<script>
  ;(async function() {
    if (CSS['paintWorklet'] === undefined)
      await import('https://unpkg.com/css-paint-polyfill')

    CSS.paintWorklet.addModule('./[file].js')
  })()
</script>

3. Ready to use it in your CSS!

To use [Worklet Name] worlet you need define some custom properties with values and add the value paint([worklet_name]) on background-image property.

The worklet has default values if you don't define these

.element {
  /* CSS code */
}
property description default value
--workletName

License

MIT License

Copyright (c) 2020 CSS Houdini

Package Sidebar

Install

npm i css-houdini-noise

Weekly Downloads

1

Version

0.0.1

License

MIT

Unpacked Size

2.92 kB

Total Files

3

Last publish

Collaborators

  • nucliweb