Curso de Programação em Javascript e HTML
204 pág.

Curso de Programação em Javascript e HTML


DisciplinaProgramação I20.719 materiais240.495 seguidores
Pré-visualização40 páginas
SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL 
 </div><br><br>
 <div style=&quot;width: 2200px&quot;>
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL 
 </div><br><br>
 <div style=&quot;width: 2200px&quot;>
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL 
 </div><br><br>
</body>
</html>
Deslocar (scroll) o documento dentro da janela para uma posição absoluta
<html>
<head>
 function scrollWindow(x,y)
 {
 window.scrollTo(x,y)
 }
title></title>
</head>
<body>
 <div style=&quot;width: 2200px&quot;>
<meta name=&quot;autor&quot; content=&quot;Rafael Feitosa&quot;> 115
Curso de Programação em JavaScript e HTML Dinâmico
Desenvolvimento, aplicações e referências de acordo com as normas do W3C
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL 
 </div><br>
 <form style=&quot;text-align:center&quot; action=&quot;javascript:;&quot;>
 Clique para deslocar o documento para a posição (110, 70)<br>
 <input onclick=&quot;scrollWindow(110,70)&quot; type=&quot;button&quot; value=&quot;Fazer
 Scroll&quot;>
 </form><br>
 <div style=&quot;width: 2200px&quot;>
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL 
 </div><br><br>
 <div style=&quot;width: 2200px&quot;>
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL 
 </div><br><br>
 <div style=&quot;width: 2200px&quot;>
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL
 SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL 
 </div><br><br>
</body>
</html>
Pedir uma confirmação
<html>
<head>
<title></title>
</head>
<body>
 resposta=confirm(&quot;Tem a certeza que deseja continuar?&quot;)
 if(resposta==true)
 document.write(&quot;Você respondeu OK (quer continuar.)&quot;)
 else
 document.write(&quot;Você cancelou (não quer continuar.)&quot;)
</body>
</html>
<meta name=&quot;autor&quot; content=&quot;Rafael Feitosa&quot;> 116
Curso de Programação em JavaScript e HTML Dinâmico
Desenvolvimento, aplicações e referências de acordo com as normas do W3C
Pedir informação ao usuário
<html>
<head>
<title></title>
</head>
<body>
 var nome = prompt(&quot;Por favor escreva o seu nome&quot;,&quot;desconhecido&quot;)
 if(nome == null || nome == &quot;&quot;)
 nome=&quot;sem nome&quot;
 document.write(&quot;Olá &quot; + nome)
</body>
</html>
Abrir uma janela
<html>
<head>
 function openWindow() 
 {
 window.open(&quot;pagina.html&quot;)
 }
<title></title>
</head>
<body>
 <a href=&quot;javascript:openWindow()&quot;>Abrir janela</a>
</body>
</html>
<meta name=&quot;autor&quot; content=&quot;Rafael Feitosa&quot;> 117
Curso de Programação em JavaScript e HTML Dinâmico
Desenvolvimento, aplicações e referências de acordo com as normas do W3C
Aumentar ou reduzir as dimensões de uma janela
<html>
<head>
 function resizeWindow(x,y)
 {
 window.resizeBy(x,y)
 }
<title></title>
</head>
<body>
 <a href=&quot;javascript: resizeWindow(40,20)&quot;>
 Aumentar o tamanho da janela</a><br>
 <a href=&quot;javascript: resizeWindow(-40,-20)&quot;>
 Reduzir o tamanho da janela</a><br>
 O opera não consegue executar este exemplo.
</body>
</html>
Dar um determinado tamanho a uma janela
<html>
<head>
 function resizeWindow(x,y)
 {
window.resizeTo(x,y)
 }
<title></title>
</head>
<body>
 <a href=&quot;javascript: resizeWindow(640,440)&quot;>
<meta name=&quot;autor&quot; content=&quot;Rafael Feitosa&quot;> 118
Curso de Programação em JavaScript e HTML Dinâmico
Desenvolvimento, aplicações e referências de acordo com as normas do W3C
 Dar à janela o tamanho 640 x 440</a><br>
 <a href=&quot;javascript: resizeWindow(780,580)&quot;>
 Dar à janela o tamanho 780 x 580</a><br>
 O opera não consegue executar este exemplo.
</body>
</html>
Agendar a execução de uma função
<html>
<head>
 function avisar()
 {
 alert('AVISO MUITO IMPORTANTE!!!\n\nJá passou 3 segundo desde que você
 clicou.')
 }
 function agendar()
 {
 setTimeout(&quot;avisar()&quot;, 3000)
 }
<title></title>
</head>
<body>
 <br><a href=&quot;javascript:agendar()&quot;>Agendar a apresentação de um aviso</a>
</body>
</html>
<meta name=&quot;autor&quot; content=&quot;Rafael Feitosa&quot;> 119
Curso de Programação em JavaScript e HTML Dinâmico
Desenvolvimento, aplicações e referências de acordo com as normas do W3C
Agendar a execução repetida de uma função
<html>
<head>
 var interval
 function avisar()
 {
 var resposta=confirm(&quot;Tem a certeza que quer continuar recebendo estes
 avisos?&quot;)
 if(resposta==false)
 clearInterval(interval)
 }
 function agendar()
 {
 interval=setInterval(&quot;avisar()&quot;,2000)
 }
<title></title>
</head>
<body>
 <br>Clique aqui para <a href=&quot;javascript:agendar()&quot;>
 agendar uma apresentação repetida de um aviso</a>
</body>
</html>
Deslocar uma janela relativamente à posição que ocupa
<html>
<head>
 function moveWindow(x,y)
 {
 top.window.moveBy(x,y)
 }
<meta name=&quot;autor&quot; content=&quot;Rafael Feitosa&quot;> 120
Curso de Programação em JavaScript e HTML Dinâmico
Desenvolvimento, aplicações e referências de acordo com as normas do W3C
<title></title>
</head>
<body>
 <a href=&quot;javascript: moveWindow(20,10)&quot;>
 Deslocar a janela 20 pixels para a direita e 10 pixels para baixo</a><br>
 <a href=&quot;javascript: moveWindow(-20,-10)&quot;>
 Deslocar a janela 20 pixels para a esquerda e 10 pixels para cima</a><br>
 O opera não consegue executar este exemplo.
</body>
</html>
Mover uma janela para uma posição absoluta
<html>
<head>
 function moveWindow(x,y)
 {
 top.window.moveTo(x,y)
 }
<title></title>
</head>
<body>
 <a href=&quot;javascript: moveWindow(0,0)&quot;>
 Mover a janela para o canto superior esquerdo da tela</a><br>
 <a href=&quot;javascript: moveWindow(100,80)&quot;>
 Mover a janela para a posição 100 x 80</a><br>
 O opera não consegue executar este exemplo.
</body>
</html>
Faça um tremor de terra no o seu browser
<html>
<head>
 var xa=ya=0,x,y
 function tremer(i)
 {
 x=Math.floor((Math.random()<0.5) ? -i:i)
 y=Math.floor((Math.random()<0.5) ? -i:i)
 top.window.moveBy(x-xa,y-ya)
 i*=0.95
 if(x!=0||y!=0||xa!=0||ya!=0)
 setTimeout('tremer('+i+')',20)
 else
 top.window.moveBy(-10,-10)
 xa=x
 ya=y
<meta name=&quot;autor&quot; content=&quot;Rafael Feitosa&quot;> 121
Curso de Programação em JavaScript e HTML Dinâmico
Desenvolvimento, aplicações e referências de acordo com as normas do W3C
Carregar mais