Кросбраузерні тіні css3

за Ніколаєнко Максим · Опубліковано Липень 31, 2013 · Оновлено Серпень 7, 2018

Вже вдруге на своєму блозі звертаюсь до статті сайту www.recens.ru, ресурс завжди пише про важливі та потрібні речі. Сьогодні я хочу представити вам плагін від автора сайту для створення тіней тексту text-shadow в IE7.

Для початку завантажуємо плагін:

Плагін для створення тіні в ІЕ7

Виклик плагіна:

$('.block').textShadow('0 1px #191919'); // без размытия	
$('.block').textShadow('1px 1px 5px #191919'); // с размытием

1 2	$('.block').textShadow('0 1px #191919'); // без размытия $('.block').textShadow('1px 1px 5px #191919'); // с размытием

Перелік параметрів йде так само, як у властивості текст-тінь, з тією лише різницею, що колір тіні має бути останнім параметром.

Плагін досить простий, якщо буде цікаво, почитайте, як він влаштований на сайті автора.

Браузери, які підтримують текст-тінь, виведуть ці приклади за допомогою CSS, a IE буде використовувати вищенаведений плагін.

Для відзнаки браузерів IE від інших можна використовувати CSS хаки. Приклад використання плагіна:

<!--[if IE]><script type="text/javascript" src="text-shadow.jquery.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		$('.block').textShadow('1px 1px #191919');
	})
</script><![endif]-->

<!--[if IE]><script type="text/javascript" src="text-shadow.jquery.js"></script>

$(document).ready(function(){

$('.block').textShadow('1px 1px #191919');

})

</script><![endif]-->

Всі інші браузери сприйматимуть цей текст як звичайний коментар, і лише IE завантажить необхідний плагін.
Детальніше про умовні коментарі для IE можна почитати тут.

Удачі в кросбраузерній верстці сайтів.