Кроcсбраузерные тени 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'); // с размытием

Перечисление параметров идёт так же, как в свойстве text-shadow, с той лишь разницей, что цвет тени должен быть последним параметром.

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

Браузеры, которые поддерживают text-shadow, выведут эти примеры с помощью CSS, а 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 можно почитать здесь.

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