CSS Shaders through WebGL
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
samples firefox gradient/transition-function fix Jun 10, 2012
src firefox gradient/transition-function fix Jun 10, 2012
.gitignore initial commit Jun 10, 2012
readme.md add readme Jun 11, 2012


CSS Shaders through WebGL

For more information and demos, please read the introduction here.


To have the script parse all the CSS automatically (very experimental), just call:


To manually add a shader:

CSSshaders.add( element, shaderParameters ); - returns shader element


CSSshaders.add( "#content","url(shaders/flag.vs) url(shaders/grayscale.fs), 20 20, phase 50.0, amplitude 100.0, txf rotateX(45deg), amount 1")

Shader element methods:

  • transition( duration, function); - adds transition with specified duration and function, returns Shader element
  • state( shaderParameters ); - creates CSS state with specified parameters, returns Shader state

Shader state methods:

  • enable() - enable state
  • disable() - disable state
  • toggle() - toggle state