Bem vindo ao PROJECT-HTML
Aprenda mais sobre:
HTML, CSS, JavaScript, webmaster, Imagens, banners, wallpapers, videos aula, windows, utilitários para site/blogs, Jogos, animes e muito mais.
Basta se registrar!



 
InícioProject HTMLGaleriaFAQRegistrar-seConectar-se
Buscar
 
 

Resultados por:
 
Rechercher Busca avançada
Conectar-se
Nome de usuário:
Senha:
Conexão automática: 
:: Esqueci minha senha
Votação
Qual seu navegador favorito?
 FireFox
 Chrome
 Internet Explorer
 safari
 Netscape
 Opera
 Avant
Exibir resultados
Quem está conectado
1 usuário online :: Nenhum usuário registrado, Nenhum Invisível e 1 Visitante

Nenhum

O recorde de usuários online foi de 36 em 3/4/2016, 3:36 am
Últimos assuntos
» TAG´s (comandos)
4/8/2014, 10:15 am por robson

» Comandos básico de HTML - body (corpo da home page)
16/7/2014, 10:10 am por robson

» Apresentações aqui
15/7/2014, 4:14 pm por robson

» Como colocar "posts recomendados" no sou blog sou site.
24/3/2014, 8:05 pm por Otome

» Arquivo de ajuda sobre PHP, help para iniciantes e experientes
24/3/2014, 8:03 pm por Otome

» Imagens Exercício-6
22/3/2014, 5:19 pm por SY64

» Alinhamento de imagens
22/3/2014, 4:43 pm por SY64

» Link´s Exercicios-5
22/3/2014, 12:43 pm por SY64

» Criar um site passo a passo
1/8/2013, 4:41 pm por marlonsouzajs


Compartilhe | 
 

 Objeto Frame

Ver o tópico anterior Ver o tópico seguinte Ir em baixo 
AutorMensagem
Diego
Admin
Admin
avatar

Masculino
Número de Mensagens : 321
Idade : 25
Localização : Aqui no PROJECT-HTML
Pontos : 5407
Reputação : 24
Data de inscrição : 04/07/2008

MensagemAssunto: Objeto Frame   10/12/2008, 3:17 pm

O JavaScript permite a interação do código com os quadros de uma página de frames. Para testar está interação é preciso antes de tudo criar uma página de frames. Vamos criar uma página simples apenas com o texto página um no centro da tela.

Código:

<html>
<body>
<div align="center">Página um</div>
</body>
</html>

Salve está página com o nome de pagina1.html.

Vamos modificar o texto e salvar como pagina2.html.

Código:

<html>
<body>
<div align="center">Página dois</div>
</body>
</html>

Para completar nossa página com frames vamos criar uma página chamada index.html.

Código:

<html>
<body>
<frameset rows="50%, 50%" frameborder="1">
<frame name="superior" src="pagina1.html">
<frame name="inferior" src="pagina2.html">
</body>
</html>


Note que até agora criamos só mente páginas com códigos HTML. Este nosso frame estará ocupando 50% da nossa tela:
[Você precisa estar registrado e conectado para ver esta imagem.]

Para retirar uma página de um quadro e coloca-la na página principal você deve utilizar o objeto window. Este código que mostrarei agora faz exatamente isto.

Abra a pagina1.html e adicione o código JavaScript:

Código:

<html>
<head></head>
<script type="text/javascript">
function principal ()
{
if (window.top != window.self)
 {
 window.top.location="pagina1.html"
 }
}

</script>
<body>
<div align="center">
Página um
</div>
<a href="javascript: principal ()">Tira do quadro</a>
</body>
</html>

Em seguida criamos um link <a href="javascript: principal ()">Tira do quadro</a> com o nome Tira do quadro este link irá acessar a nossa função principal, ou seja, javascript: principal () que criamos em javascript:

<script type="text/javascript">
function principal ()
{
if (window.top != window.self)
{
window.top.location="pagina1.html"
}
}

</script>


Para testar salve a página e abra a página index.html.

[Você precisa estar registrado e conectado para ver esta imagem.]

Ao clicar no link só mente a pagina1.html será exibida:

[Você precisa estar registrado e conectado para ver esta imagem.]

No exemplo acima o script foi adicionado através de um link para fazer isto basta inserir a palavra javascript: e o nome da função que você quer chamar, que no exemplo acima foi principal.

No exemplo a seguir o código JavaScript muda o conteúdo dos dois quadros da página. Repare que o nome atribuído no quadro HTML é utilizado no código, vamos modificar o código da pagina2.html.

Código:

<html>
<head>
<script type="text/javascript">
function mudaURL ()
{
parent.superior.location.href="http://www.projecthtml.tk/";
parent.inferior.location.href="http://www.alldownfull.tk/";
}
</script>
</head>
<body>
<div align="center">
Página dois
</div>
<a href="javascript: mudaURL ()">Recarregue os quadros</a>
</body>
</html>

Com está função estaremos mudando pagina1.html para o site [Você precisa estar registrado e conectado para ver este link.] e pagina2.html para o site [Você precisa estar registrado e conectado para ver este link.]

[Você precisa estar registrado e conectado para ver esta imagem.]

Clique no link Recarregue os quadros.

[Você precisa estar registrado e conectado para ver esta imagem.]

_________________
Quem pode faz, não copia!
[Você precisa estar registrado e conectado para ver esta imagem.]
s2 Diego e Barbara s2
Informações do meu PC:
Processador:Intel Core i5 760 @ 2.80GHz 8Mb cache
Placa mãe: ASUSTeK Computer INC. P7P55D-Deluxe
Memoria Ram: 4.0GB Único -Channel DDR3 @ 668MHz * 2 = 1333Mhz (9-9-9-24)
Placa de video: 512 MB GeForce 8400 GS (XFX Pine Group)
HD: 160GB SAMSUNG SAMSUNG HD161HJ (SATA)
Audio: SoundMAX Integrated Digital Audio
Sistema operativo: MS Windows 7 Ultimate 64-bit
Voltar ao Topo Ir em baixo
Ver perfil do usuário http://www.projecthtml.tk
 
Objeto Frame
Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo 
Página 1 de 1
 Tópicos similares
-
» High Res Frame Brushes
» Aprenda como criar um objeto em outra room/sala/tela
» objeto seguir o clik do mouse
» Engine Poder ao Pegar Objeto (by Giosepe Luiz)
» Mudar imagem ao passar o Mouse porém tem que mudar a imagem do Frame

Permissão deste fórum:Você não pode responder aos tópicos neste fórum
 :: Conhecendo um pouco de Javascript :: Interação com o HTML-
Ir para: