Библиотека shine.js. Делаем динамические тени.
Всем привет! Вам когда-нибудь нужно было делать тени для текста или блока? Если вы занимаетесь версткой, то, думаю, да. Сегодня я расскажу про сервис, который может немного облегчить выбор нужной вам тени - shine.js.
Это не просто сервис, но еще и библиотека.
Перейдите по ссылке:
bigspaceship.github.io/shine.js/
Чтобы скачать данную библиотеку, опуститесь ниже и используйте Bower
bower install shine
Или просто скачайте zip архив.
Подключите скрипт:
<script src="path/to/shine.min.js"></script>
Инстциируйте shine.js
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);
Особенности:
- Динамическая позиция света
- Настриваемые тени
- Нет зависимости от библиотек, AMD совместим
- Используются тени для текста или для блока, исходя из контента
- Работает в браузерах, поддерживающих textShadow или boxShadow, автоматически дописываются префиксы, если нужно
Вот такая простая, но полезная библиотека shine.js. Устанавливайте и пользуйтесь на здоровье! Спасибо за внимание и удачи!
-
Создано 24.08.2014 20:11:01
-
Михаил Русаков
Комментарии (0):
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.