1. 程式人生 > >Shine.js實現動態陰影效果

Shine.js實現動態陰影效果

b2c ava .net fun text 動態 cti element gravity

Shine.js 是一個用於實現美麗陰影的 JS 庫。

特性

1、可動態旋轉光的位置,投影出不同的陰影效果  

2、可定制的陰影,  

3、沒有庫依賴關系,AMD兼容使用基於內容的文本或框陰影  

4、在瀏覽器支持textShadow或boxShadow 會自己主動加入前綴

效果圖例如以下:

技術分享

代碼引用及編寫:

嵌入js文件

<script src="path/to/shine.min.js"></script>

實例化:

var shine = new Shine(document.getElementById(‘my-shine-object‘
));

改變光的位置:

window.addEventListener(‘mousemove‘, function(event) {
  shine.light.position.x = event.clientX;
  shine.light.position.y = event.clientY;
  shine.draw();
}, false);

原文:shine

Shine.js實現動態陰影效果