Aplicar gradiente no IE8

[Luis Henrique Abeno 1]

Pessoal, boa tarde.

 

Dei uma bela pesquisada na internet e não consegui encontrar nada que resolva o meu problema =/

 

O que acontece é que tenho um texto e gostaria de aplicar um gradiente horizontal. Nos outros navegadores funciona perfeitamente, mas no maledito do IE não.

 

Alguém sabe como pode ser feito para aplicar esse efeito no IE8?

Ou se é possível? =/

 

[]'s

[ricardo_mc 19]

Dá uma olhada nesse link aqui:

http://davidwalsh.name/css-gradients

 

Mas basicamente é preciso usar o código abaixo para os IEs:

 

<!--[if lt IE 10]>
<style>
.gradientElement {
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#063053', endColorstr='#395873');
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#063053', endColorstr='#395873')";
}
</style>
<![endif]-->

[Luis Henrique Abeno 1]

Vlw pela ajuda Ricado!! =)

 

Então, eu até cheguei a aplicar esse filtro, mas ao invés de aplicar para o texto ele aplica na cor de fundo =/

por exemplo:

 

<p class = "gradientElement"> Gradiente Aqui </p>

 

O gradiente é aplicado para o fundo ao invés de aplicar para o texto "Gradiente Aqui

 

Consegui fazer funcionar no Chrome normalmente, olha só....

.menu-gradient {
	background-image: -webkit-gradient(
		linear,	right top, left top, from(rgba(136, 194, 191, 1)),to(rgba(252, 175, 32, 1)),
		color-stop(0.47, #88C2BF),
		color-stop(0.6, #FCAF20),
		color-stop(0.51, #FCAF20)
	);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

[ricardo_mc 19]

Opa, desculpe aí, erro meu. Quando li não me toquei que você se referia a texto, entendi como fundo mesmo.

 

Dá uma olhada aqui:

http://webdesignerwall.com/tutorials/css-gradient-text-effect

[Luis Henrique Abeno 1]

Opa, desculpe aí, erro meu. Quando li não me toquei que você se referia a texto, entendi como fundo mesmo.

 

Dá uma olhada aqui:

http://webdesignerwall.com/tutorials/css-gradient-text-effect

 

Então, utilizei o método proposto nesse site, mas ainda não resolve o meu problema. Não resolve por que eu preciso aplicar um gradiente horizontal e de cores diferentes ao do meu plano de fundo, no site ela diz...

 

"Literally, you can apply this trick on any solid background color (as long your gradient color is the same as your background color)"

 

O que eu preciso:

 

<laranja>Luis <laranja> <azul>Henrique <azul>

 

Que são cores diferentes do meu background.

 

Não sei se não da para fazer do jeito que quero ou se eu que não estou sabendo como fazer =/

[Diéssica 140]

Tente:
:seta: http://css3please.com/
Trabalha muito bem com o filter.

Não entendi o que quis dizer com

<laranja>Luis <laranja> <azul>Henrique <azul>

Já conseguiu fazer essa parte funcionar e só não está funcionando no IE8, certo? Se conseguiu fazer funcionar em outros navegadores, provavelmente conseguirá fazer funcionar no IE8. :)

[Luis Henrique Abeno 1]

Tente:

:seta: http://css3please.com/

Trabalha muito bem com o filter.

 

Não entendi o que quis dizer com

 

 

Já conseguiu fazer essa parte funcionar e só não está funcionando no IE8, certo? Se conseguiu fazer funcionar em outros navegadores, provavelmente conseguirá fazer funcionar no IE8. :)

 

haahahaha esse "<laranja>Luis <laranja> <azul>Henrique <azul>" foi só para tentar ilustar o que eu preciso =)

 

Vou dar uma olhada nesse link e respondo em breve....

 

É, não resolve o meu problema, o gradiente é aplicado ao plano de fundo... =/

A propósito, obrigado Diéssica pela força =)

[André do Vale 76]

Se o link do ricardo_mc não lhe ajudou, eu recomendo então o uso de image replacement (se é que é tão necessário o degradê no texto para IE8+, pois, caso não, recomendo deixar o CSS apenas para os browsers webkit mesmo).

[Luis Henrique Abeno 1]

Bom, não teve jeito, deixei da forma que esta e infelizmente quem utilizar versões do IE8 pra baixo não verá o efeito ='(

Eu até dei um "jeitinho", mas me recuso a fazer essa gambiarra no meu código =/

 

<b class = "cor01"> Tex </b> <b class = "cor02"> to </b>

 

hahahahaaha, que coisa mais linda =)

 

Bom, agradeço a ajuda de todos e se alguém tiver mais alguma sugestão sou todo ouvidos :D

 

[]'s