labs javascript ait #2

Post on 27-Dec-2014

101 Views

Category:

Technology

1 Downloads

Preview:

Click to see full reader

DESCRIPTION

Exercício de Javascript em formato Labs realizado na AIT-PROEG (facebook.com/aitproeg) #2

TRANSCRIPT

LAB’s AIT #2vitor$ /etc/init.d/javascript restart

by @VitorCastro

sexta-feira, 16 de agosto de 13

//OBJETIVO

sexta-feira, 16 de agosto de 13

D.O.M de novo ...

document.write(“texto”) // escreve o texto na página

window.innerWidth ou document.documentElement.clientWidth // largura da resolução da tela

window.innerHeight ou document.documentElement.clientHeight // altura da resolução da tela

sexta-feira, 16 de agosto de 13

Location

window.location // url de página atual

.hostname // nome do host

.pathname // caminho sem o hostname

.port // número de porta

.protocol // protocolo (http ou https)

sexta-feira, 16 de agosto de 13

History

window.history.back() // Voltar a página

sexta-feira, 16 de agosto de 13

Navigator

window.navigator // object Navigator

.userAgent // qual navegador

.appName // nome do navegador

.appVersion // versão do navegador

sexta-feira, 16 de agosto de 13

Timing

window.setInterval(function,intervaloTempo) // executa function em um intervalo em milisegundos

window.setTimeout(function,intervaloTempo) // executa function depois de um intervalo de tempo

window.clearTimeout(referenciaSetTimeOut) // timeout = setTimeout(function,1000) clearTimeout(timeout)

window.clearInterval(referenciaSetInterval) // semelhante ao “window.clearTimeout”

sexta-feira, 16 de agosto de 13

Event onload

window.onload = function(){ code } // quando a janela carregar executa a funçao

sexta-feira, 16 de agosto de 13

Criar element Html

document.createElement(nameTag) // criar element com a tag indicada no parametro

[elementHtml].appendChild(element) // adiciona element no elementHtml

document.createTextNode(“text”) // cria um bloco de texto

[elementHtml].removeChild(elementRemove) // remove o element do “pai”

sexta-feira, 16 de agosto de 13

Missão #2

sexta-feira, 16 de agosto de 13

#RULES

if (google.com.br) return false;

if (facebook.com) return false;

if (gmail.com || hotmail.com || @qualquerEmail) return false;

if (coding) return like;

sexta-feira, 16 de agosto de 13

index.html

<body></body>

sexta-feira, 16 de agosto de 13

//TODO #1

Escrever na página os dados de largura e altura de resolução do vídeo, url e navegador utilizado.

Caso a largura seja maior que 1024 exibir mensagem na página “resolução está ok”

Caso a largura seja menor que 1024 exibir mensagem na página “aumente sua resolução”

sexta-feira, 16 de agosto de 13

//TODO #2

Crie um input type=”submit” com o “id=botao” e “value=Zerar”.

O input deve está contido em uma div “id=nome”.

A div “id=nome” deve está no body

sexta-feira, 16 de agosto de 13

//TODO #3

Depois de 3 segundo da página já carregada executar o TODO #2.

A cada 5 segundos escreva na tela (div id=”timeout”) o tempo restante, dado que o timeout da página é de 1 min.

Se o timeout atingir 1 min deve parar o contador do tempo e escrever na “div id=timeout” que a página expirou

sexta-feira, 16 de agosto de 13

//TODO #4

Se clicado no input “id=botao”, o timeout da página deve retorna para 1 min.

sexta-feira, 16 de agosto de 13

TIMEBOX

45 Minutos para o CODE

5 Minutos para cada participante apresentar o que fez para os demais

sexta-feira, 16 de agosto de 13

sexta-feira, 16 de agosto de 13

top related