adashabeta

ProximityEffect demo 2

*mouse required

Z translation + saturation + blur.

 

var t = document.querySelector('#containingelement');
var n = t.removeChild(t.querySelector('*.childelement'));
var fader;

var params = {
    threshold: 60,
    distance:  60,
    attack: 0.6,
    decay:  0.6,
};

for(var i=0; i<5; i++)
{
    for(var j=0; j<5; j++)
    {
        t.appendChild(n.cloneNode());
    }
}

fader = new ProximityEffect(document.querySelectorAll('*.childelement'), params);

fader.addEffect('translateZ', 200,   0);
fader.addEffect('blur',        10,   0);
fader.addEffect('saturate',   100,   0);
fader.addEffect('brightness', 100, 250);

fader.setCenterPoints(); //fix flow issue in some browsers