New Post has been published on Html Use
New Post has been published on http://www.htmluse.com/shine-js-a-library-for-pretty-shadows/
Shine.js - A library for pretty shadows
Download  Demo
Shine.js is a library for pretty shadows
Features
Dynamic light positions
Customizable shadows
No library dependencies, AMD compatible
Uses text or box shadows based on content
Works in browsers that support textShadow or boxShadow and auto-prefixes if necessary
Get Started
Install using bower: bower install shine or download as zip or fork on GitHub.
Create a Shine.js instance for each DOM element youâd like to shine:
var shine = new Shine(document.getElementById('my-shine-object'));
Change the light position and make sure to redraw:
shine.light.position.x = window.innerWidth * 0.5; shine.light.position.y = window.innerHeight * 0.5; shine.draw(); // make sure to re-draw
Configuration
Each shine instance has a property pointing to an instance of shinejs.Config. One config can be shared amongst multiple shine instances.
When a config value changes, shine.draw() needs to be called to re-draw with the new settings.
Change the shadow of a shine instance:
shine.config.opacity = 0.1; shine.config.blur = 0.2; shine.draw(); // make sure to re-draw
Create a shared shinejs.Config instance:
// all parameters are optional and can be changed later var config = new shinejs.Config( numSteps: 4, opacity: 0.2, shadowRGB: new shinejs.Color(255, 0, 0) ); // pass the config in the constructor var shineA = new Shine(document.getElementById('my-shine-object-a'), config); var shineB = new Shine(document.getElementById('my-shine-object-b'), config); // or assign it to an instance later var shineC = new Shine(document.getElementById('my-shine-object-c')); shineC.config = config; shineC.draw(); // make sure to re-draw
