O primeiro contato, HTML
Voltar
Inserindo página HTML em uma página HTML
... ou, como simular iframe em documentos XHTML Strict.
Esta matéria é uma tradução de: Insert HTML page into another HTML page de autoria de Aleksandar Vacic.
Uma noite destas eu precisei adicionar "ads" do kayak.com na minha página related to traveling. Os "ads" que eu usei são um conjunto de pequenos trechos de código oferecendo funcionalidades que permitem fazer buscas diretamente nos bancos de dados da kayak.com. Uma coisa muito bem concebida.
Lamentavelmente os códigos dos "ads" foram escritos à moda ultrapassada priorizando a renderização em modo kirks, e pior ainda - escritos com uso de tabelas aninhadas e "tag soup" diretamente dentro do documento - uma solução diferente da adotada pelo Google Adsense. Mas, quando as regras de estilo do meu site foram aplicadas ao código dos "ads", aconteceu o desastre.
Felizmente, os "ads" abrem em uma nova janela, então eu simplesmente criei um iframe para renderizar os "ads" na página. Grande solução…não fosse o detalhe que minhas páginas são codificadas em XHTML 1.0 Strict, que não admite iframe. Que beleza.
O caminho correto para se incluir uma página HTML dentro de outra página é através do uso do elemento object. Este é o elemento destinado a inserir objetos externos em uma página bem estruturada. O modo padrão de codificar o elemento object é pelo uso do MIME type e da URL do objeto a inserir. Naturalmente, isto não funciona no IE6 (nem no IE7) e eu tive que sair a procura do valor do infame clsid para text/html.
Depois de tentar por 10 minutos eu não consegui encontrar o valor e então resolvi abrir o RegEdit, fui ao menu de clsid e lá encontrei o que estava procurando. Aí ficou fácil:
Isto funcionou beleza, mas nos IE (6 e 7) apareceu uma borda horrível e barra de rolagem, mesmo sendo a página incluida de dimensões menores que os atributos width e height definidos para o elemento object. Para solucionar o problema eu especifiquei a seguinte regra de estilo na página a incluir:
Com esta técnica, você integra de forma elegante um documento .HTML (ou .ASP, ou .PHP ou qualquer outro) em uma página web.
Esta matéria é uma tradução de: Insert HTML page into another HTML page de autoria de Aleksandar Vacic.
Uma noite destas eu precisei adicionar "ads" do kayak.com na minha página related to traveling. Os "ads" que eu usei são um conjunto de pequenos trechos de código oferecendo funcionalidades que permitem fazer buscas diretamente nos bancos de dados da kayak.com. Uma coisa muito bem concebida.
Lamentavelmente os códigos dos "ads" foram escritos à moda ultrapassada priorizando a renderização em modo kirks, e pior ainda - escritos com uso de tabelas aninhadas e "tag soup" diretamente dentro do documento - uma solução diferente da adotada pelo Google Adsense. Mas, quando as regras de estilo do meu site foram aplicadas ao código dos "ads", aconteceu o desastre.
Felizmente, os "ads" abrem em uma nova janela, então eu simplesmente criei um iframe para renderizar os "ads" na página. Grande solução…não fosse o detalhe que minhas páginas são codificadas em XHTML 1.0 Strict, que não admite iframe. Que beleza.
O caminho correto para se incluir uma página HTML dentro de outra página é através do uso do elemento object. Este é o elemento destinado a inserir objetos externos em uma página bem estruturada. O modo padrão de codificar o elemento object é pelo uso do MIME type e da URL do objeto a inserir. Naturalmente, isto não funciona no IE6 (nem no IE7) e eu tive que sair a procura do valor do infame clsid para text/html.
Depois de tentar por 10 minutos eu não consegui encontrar o valor e então resolvi abrir o RegEdit, fui ao menu de clsid e lá encontrei o que estava procurando. Aí ficou fácil:
<!--[if IE]>
<object classid="clsid:25336920-03F9-11CF-8FD0-00AA00686F13" data="pagina-a-incluir.html">
<p>conteúdo alternativo para tecnologias que não suportam OBJECT</p>
</object>
<![endif]–>
<p>conteúdo alternativo para tecnologias que não suportam OBJECT</p>
<!–[if !IE]> <–>
<object type=”text/html” data=”pagina-a-incluir.html”>
</object>
<!––> <![endif]–>
<object classid="clsid:25336920-03F9-11CF-8FD0-00AA00686F13" data="pagina-a-incluir.html">
<p>conteúdo alternativo para tecnologias que não suportam OBJECT</p>
</object>
<![endif]–>
<p>conteúdo alternativo para tecnologias que não suportam OBJECT</p>
<!–[if !IE]> <–>
<object type=”text/html” data=”pagina-a-incluir.html”>
</object>
<!––> <![endif]–>
Isto funcionou beleza, mas nos IE (6 e 7) apareceu uma borda horrível e barra de rolagem, mesmo sendo a página incluida de dimensões menores que os atributos width e height definidos para o elemento object. Para solucionar o problema eu especifiquei a seguinte regra de estilo na página a incluir:
<body style="border:0;overflow:visible">
Com esta técnica, você integra de forma elegante um documento .HTML (ou .ASP, ou .PHP ou qualquer outro) em uma página web.
Autor/fonte do artigo: Mauricio Samy Silva (http://www.maujor.com/blog/2006/12/21/in...)
Postado 21/05/2009 15:09 por Jeison Frasson
© 2002-2012 Newsmade - Quase todos os direitos reservados.