450 Real Shadow — это простой, но эффективный jQuery плагин для создания реалистичных эффектов теней для любого HTML элемента.
С помощью простой функции он работает на любом количестве элементов. Принцип этой функции в том, чтобы менять свойство CSS3 box-shadow в зависимости от положения курсора мыши относительно элемента, для которого строится тень.
Работает на любом браузере, поддерживающим свойство CSS box-shadow.
Как запустить
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
$(selector).realshadow(); или $(selector).realshadow({ followMouse: false, // по умолчанию true pageX: x, // x координата источника света pageY: y // y координата источника света c: { // цвет тени r: 1, // red канал для тени g: 1, // green канал для тени b: 1, // blue канал для тени } }); |
Для определения цвета тени каждому элементу можно использовать атрибут «rel»:
|
1 2 3 4 5 6 |
<span rel="r"></span> <span rel="g"></span> <span rel="b"></span> <span rel="rg"></span> <span rel="gb"></span> <span rel="br"></span> |
и запуск
|
1 |
$('span').realshadow(); |
