Как сделать кроссбраузерную тень text-shadow для ie9 и ie8?

Вопрос-ответ HTML/CSS
1

Использовать фильтры, например:
filter: progid:DXImageTransform.Microsoft.Shadow(color=#0000FF,direction=45);
или
filter:Shadow(Color=#666666,Direction=135,Strength=5);
Тень будет другой для ИЕ, отличатся. Но хотя бы какой-то эффект тени чтобы был.
В итоге - не помогает, если прописать это для класса сразу после кода тени. И если для этого класса, где тень применяется прописывать в отдельно подключаемом css-файле для IE-9 - не помогает также.
Нашла еще здесь фильтры
https://msdn.microsoft.com/en-us/library/ms532995(v=vs.85).aspx - Glow

filter:
    progid:DXImageTransform.Microsoft.MotionBlur(strength=13, direction=310)
    progid:DXImageTransform.Microsoft.Blur(pixelradius=2)
    progid:DXImageTransform.Microsoft.Wheel(duration=3);

или здесь https://msdn.microsoft.com/en-us/library/ms532985(v=vs.85).aspx - Drop Shadow
Не помогает ни один вариант из этого. Или я что-то неправильно делаю. Или как этими фильтрами пользоваться?
Пример текста с тенью здесь - http://jsfiddle.net/ga12op2v/

Или для IE9 и ниже никто не делает поддержку тени для текста?

2

http://css3pie.com/
Обрати внимание как подключать - пишешь путь в css , но относительно index.html(index.php)

3

Но оно только для border-radius и box-shadow работает, а не для тени текста. У меня файл PIE.htc есть в верстке.

4

Тогда есть такая статья или такой плагин jQuery

5

я так подозреваю, что для всех веток ИЕ уже никто не чего не поддерживает.
тень на тексте через костыли - выхлопа 0!
Как-то мне сказали: - те кто сидят в ИЕ уже давно привыкли к квадратному дизайну!!
главное что бы работало- вид приближенный.

тоже самое и для градиента на тексте - не заморачивайся

6

Спасибо, но у меня что-то не работает этот плагин. Либо чего неправильно делаю:

   <script src="jquery-1.7.1.min.js"></script>
   <script type="text/javascript" src="jquery.textshadow.js"></script>
   <script type="text/javascript">
   $(.headertext).textShadow({
    color:   "#000",
    xoffset: "5px",
    yoffset: "5px",
    radius:  "5px",
    opacity: "50"
});
</script>
<!--[if lt IE 9]>
         <script src="respond.min.js"></script>
    <![endif]-->

И там к нему в описании говорится, что он только с 5 по 8 версию. То есть в 9 работать не будет. Но у меня и в 8 не работает.

7

У тебя селектор jQuery без кавычек $('.headertext')
Еще можно сделать через псевдоэлемент http://codepen.io/anon/pen/aoHyi
У меня самого плагин не заводится, но нашел решение через фильтр в css

.headertext{
	color: orange;
	font-size: 24px;
	filter:progid:DXImageTransform.Microsoft.Shadow(color='#666666',direction='45');
	zoom: 1;
}

Ты не писала zoom, без него не работает :sunglasses:
А вообще сами виндосы не поддерживают свой продукт, вот посмотри на ссылки на гитхабе https://github.com/heygrady/textshadow где описывается поддержка этих браузеров - ссылки уже битые, они сами уже забили, так что к черту ИЕ8

8

“Еще можно сделать через псевдоэлемент http://codepen.io/anon/pen/aoHyi” -так ИЕ8 не поддерживает псевдоэлементы…
“Ты не писала zoom, без него не работает” - у меня и с zoom не работает… У тебя работает?
“так что к черту ИЕ8” - на оф. странице майкрософта тоже теней нигде нет в дизайне…

9

В у меня в IE7 есть тени, так что в IE8 точно есть решение
Псевдоэлемент поддерживается частично