(usehost) Base de Conhecimentos

Home | Sumário | Favoritos | Contato | Efetuar Login

Pesquisar na base de dados	Pesquisar por categoria
[Pesquisa avançada]

Home > Desenvolvimento > HTML5

HTML 5 Funcionando no Internet Explorer

Detalhes do artigo

Última atualização
15th o June, 2010

Você também pode...

Imprimir

Enviar por E-mail

Comentar

Cadastre-me

Add aos favorito

Salvar em PDF

Opções de usuário (0 votos)

Nenhum usuário votou.

HTML 5 Funcionando no Internet Explorer

Postado em 03 de Junho de 2010, às 20:07

Olá pessoal!

Todo bom desenvolvedor web já conhece pelo menos uma grande novidade que o HTML5 traz para nós. Da mesma forma, todos sabem que o Internet Explorer não reconhece as novas tags do HTML5.

Mas, já existe uma solução em javascript para este problema. Basta acrescentar este código na tag <head> da sua página. O código abaixo deve, obrigatoriamente, vir antes de qualquer script CSS do seu site:

`1`	`<!--[if lt IE 9]>`

`2`	`<script` `src="http://html5shiv.googlecode.com/svn/trunk/html5.js">`

Se preferir, acesse o site do projeto http://code.google.com/p/html5shiv/.

Quero aproveitar o ensejo deste artigo (gastei meu português agora!) para mostrar uma curiosidade sobre o IE, na verdade, é graças a esta peculiaridade que foi possível desenvolver o HTML 5 shiv.

Veja o código abaixo:

01<!DOCTYPE html>
02<html>
03<head>
04  <title>Teste</title>
05  <style>
06  time{
07    font-style:italic;
08  color:#FF0000;
 /* Red Color */
09  }
10  </style>
11</head>
12<body>
13  <time datetime="2010-12-25">Feliz Natal</time>
14</body>
15</html>

Se tentarmos abri-lo no IE, o navegador da Microsoft não vai aplicar os efeitos (CSS) na tag <time>, veja o screenshot abaixo:

Teste com HTML5

Agora veja o código abaixo, ele soluciona o problema do IE não reconhecer a tag <time> utilizando javascript para adicionar a tag ao DOM. Ao fazê-lo, o IE se vê obrigado a renderizar uma tag que não reconhecia com os efeitos definidos no seu código CSS.

01<!DOCTYPE html>
02<html>
03<head>
04  <title>Teste</title>
05  <style>
06  time{
07    font-style:italic;
08  color:#FF0000;
 /* Red Color */
09  }
10  </style>
11   
12  <!-- Acrescente esta linha -->
13  <script>document.createElement('time');</
 script>
14</head>
15<body>
16  <time datetime="2010-12-25">Feliz Natal</time>
17</body>
18</html>

Desta forma podemos trabalhar com HTML5 naturalmente no IE. Veja o resultado no screenshot abaixo:

Teste com HTML5

Até mais pessoal, espero ter ajudado alguém com essa dica.

Comentários

Não hpa comentários de visitantes. Comentar

(usehost) Hospedagem de Sites - Recife - PE (Hosting, E-mail Marketing, Comércio Eletrônico)

HTML 5 Funcionando no Internet Explorer