(© 1997-2008 by Francisco Panizo Beceiro)

Se você quer uma Ajuda Específica para o seu caso, proceda como indicado:
clique Suporte, e envie a sua dúvida (para cadastrados no CLUBE DO HELP DESK)
ou envie sua dúvida para nosso Super Fórum )

O Site para os Amantes da Velocidade

Seção HTML da abcDICAS.com.br

HTML
Dicas de Uso para a Construção de Páginas Web


Linkando e interagindo páginas com frames frames  

No tópico anterior, você aprendeu os principais aspectos sobre o funcionamento dos frames. Agora que você já sabe como montar uma página simples com frames, vamos para o próximo passo: aprender a usar os frames para tornar seu site mais interativo e atraente.

Alguns dos pontos importantes desta lição:

Combinando frames horizontais e verticais

As divisões em frames dentro de uma página podem ser bastante complexas, mais do que simples divisões ao meio ou divisões em menu superior, ou menu lateral, e página principal. Você pode, por exemplo, dividir uma página em dez partes iguais e fazer com que cada uma delas carregue uma parte do conteúdo, de forma que a página seja totalmente interativa.

Para isso, basta saber combinar divisões em colunas com divisões em linhas. No tópico anterior sobre funcionamento dos frames, você aprendeu a fazer uma página frameset, da maneira como se vê abaixo:

<FRAMESET ROWS="50%,*,30%" FRAMEBORDER="1" FRAMESPACING="2">
  <FRAME SRC="pagina1.htm" NAME="superior" NORESIZE SCROLLING="NO">
  <FRAME SRC="pagina2.htm" NAME="central" MARGINWIDTH="2" MARGINHEIGHT="3" NORESIZE SCROLLING="YES">
  <FRAME SRC="pagina3.htm" NAME="inferior" NORESIZE SCROLLING="NO">
</FRAMESET>

Observe que estão sendo feitas apenas divisões em linhas, subdividindo a janela do browser em três seções horizontais. Para que se faça uma combinação de frames na horizontal e vertical, é preciso que algumas das tags <FRAME> sejam substituídas por outros framesets, colocadas "em cascata". Veja um exemplo:

<FRAMESET ROWS="50%,*,30%" FRAMEBORDER="1" FRAMESPACING="3">
  <FRAME SRC="pagina1.htm" NAME="superior" NORESIZE SCROLLING="NO">
  <FRAME SRC="pagina2.htm" NAME="central" MARGINWIDTH="2" MARGINHEIGHT="3" NORESIZE SCROLLING="YES">
  <FRAMESET COLS="50%,50%" FRAMEBORDER="1" FRAMESPACING="3">
    <FRAME SRC="pagina3.htm" NAME="inferioresquerda" NORESIZE SCROLLING="NO">
    <FRAME SRC="pagina4.htm" NAME="inferiordireita" NORESIZE SCROLLING="NO">
  </FRAMESET>
</FRAMESET>

Note que a primeira tag <FRAMESET> divide a página em três linhas de medidas 50%, "indefinido" e 30% respectivamente. Logo abaixo, seguem-se as definições de conteúdo para cada um dos frames (através das tags <FRAME>, como você pode observar). 
Preste atenção especial à quarta linha (marcada em vermelho), onde foi colocado um comando <FRAMESET> ao invés do comando <FRAME>. Isso significa que nesta linha não será simplesmente carregada uma página, mas ao invés disso será feita uma nova divisão (dessa vez em colunas, como indica o atributo COLS).

Continuando a analisar o código, vemos que dentro do segundo frameset está sendo indicada uma divisão em duas colunas de largura 50% e 50%, respectivamente. O conteúdo dessas duas novas divisões é definido pelas duas tags <FRAME> que vêm logo abaixo.

Para finalizar, é necessário fechar todas as tags <FRAMESET> : assim, a primeira tag de fechamento </FRAMESET> aplica-se ao frameset interno (o último que foi definido), enquanto o segundo </FRAMESET> aplica-se ao frameset principal (o primeiro que foi definido).

 

Veja abaixo uma "visualização" de como aparecerá tal frameset no browser de seu visitante:

Frame superior
ocupando 50% da altura da janela do browser
conteúdo mostrado: pagina1.htm
Frame central - conteúdo mostrado: pagina2.htm
ocupando o restante da área vertical do browser
Frame inferior esquerdo
ocupando 30% da altura e 50% da largura da janela
conteúdo mostrado: pagina3.htm
Frame inferior direito
ocupando 30% da altura e 50% da largura da janela
conteúdo mostrado: pagina4.htm



Nomeando as janelas como targets

Quando você define o conteúdo de cada divisão da frameset (através das tags <FRAME>), você precisa definir um nome para cada divisão. Isso é feito através do atributo NAME, e possui um objetivo fundamental: identificar cada frame para que você possa direcionar os links para cada divisão separadamente. São os chamados targets.

A
tag <HREF> (link) possui um atributo TARGET que, quando especificado, indica em que janela será carregada a página requisitada no link. Esse recurso é essencial quando se trabalha com frames.

Existem alguns valores padrão para o atributo TARGET, que tanto podem ser usados em frames como em páginas normais. São eles:

  • _BLANK: o link será carregado em uma nova janela;
  • _SELF: o link será carregado na mesma janela;
  • _PARENT: o link será carregado em um frame acima da janela atual, segundo a hierarquia descrita no frameset;
  • _TOP: como o próprio nome sugere, o link será carregado diretamente na janela do browser, ou seja, no topo da estrutura de divisões definida no frameset;

Além desses nomes padrão, o atributo TARGET também suporta qualquer nome que você defina dentro da tag <FRAME> como sendo o identificador de uma das divisões. Por exemplo, quando você quiser direcionar um link para que este carregue a página em uma divisão de nome="superior", basta você fazer um link do tipo <a href="link.htm" target="superior">. 
É um recurso essencial se você pretende utilizar JavaScript para controlar janelas e frames.

Frames: |Introdução|Interagindo|

PESQUISA ON-LINE:
Vote em nossa Enquete OnLine

Atenção: não temos condição de dar suporte direto para todos os visitantes; use nosso Super Fórum Web Design para poder enviar suas dúvidas. O registro é gratuito!
Para um suporte diferenciado use o nosso Clube do Help Desk.


| Suporte | Cadastro | Consultoria | Quem Somos |