Workshop de Javascript

Manual prático de Javascript no qual podemos encontrar diversos scripts devariada utilidade comentados e prontos para serem utilizados em suas páginasweb. Aprenda Javascript praticando.
Capítulos do manual
1.- Efeitos rápidos com Javascript
Antes de aprofundarmos na matéria, veremos alguns exemplos de códigos simples de grande utilidade.

2.- Abertura e configuração de popups com Javascript
Este artigo lhe mostrará com detalhes como abrir janelas e configurar sua forma.

3.- Acessso por senha Javascript
Este artigo explica passo a passo como criar um sistema para proteger por senha umas páginas em sua web. Utilizamos Javascript, uma linguagem acessível a todo mundo.

4.- Rollover com Javascript
Aprenda a fazer um efeito de iluminação sobre uma imagem ao passar o mouse por cima. Pelo ponto de vista prático, você mesmo será capaz de fazer em alguns minutos.

5.- Navegador dinâmico Javascript
Mostramos com um exemplo prático como criar uma barra de navegação dinâmica com algumas imagens e Javascript.

6.- Navegador desdobrável
Para aprender em poucos passos a criar um navegador formado por um menu desdobrável. Ao selecionar uma opção do menu iremos a uma página distinta.

7.- Navegador desdobrável com frames
É a continuação da ajuda técnica para criar um menu desdobrável. Neste caso se realiza uma adaptação do script para que possa ser utilizado em um site desenhado com frames.

8.- Texto em movimento na barra de estado
Vemos um simples script para fazer com que se mova um texto pela barra de estado de nosso navegador.

9.- Marcar ou desmarcar todos os checkboxes de um formulário com Javascript
Realizamos uma função de Javascript para que se possa selecionar todos os checkboxes ou caixas de seleção de um formulário de uma só vez, clicando somente um link. Fazemos também a função para desmarcar todos os elementos de uma só vez.

10.- Desabilitar o menu contextual do navegador com Javascript
Um script em Javascript para evitar que funcione o menu contextual do navegador, que sai ao clicar com o botão direito do mouse sobre a página. De modo que não possam ver o código fonte nem acessar a outras opções parecidas.

11.- Relógio em Javascript
Aprendemos a criar um relógio simples mediante Javascript e lhe aplicamos algumas melhoras.

12.- Scripts diferentes para cada navegador
Vemos como incluir de uma maneira simples uma biblioteca de scripts diferentes para cada navegador.

13.- Tamanho dos campos relativo ao navegador
Dependendo do navegador, os campos de texto têm tamanhos diferentes. Com javascript evitamos isso.

14.- Estilos diferentes para cada navegador
Scripts que nos permitem aplicar estilos diferentes aos elementos da página, em um dos casos nos apoiamos na tecnologia CSS para aumentar a potência.

15.- Tabela de cores com Javascript
Uma tabela que mostra as cores puras em todas as definições. Está construída com Javascript adicionando três loops.

16.- Sub-menu em outra janela
Faremos um sub-menu de opções que se mostra em uma janela secundária e uma vez selecionada a opção do sub-menu se transfere para a janela pai.

17.- Degradê de cor Javascript
Script para conseguir um degrade da cor de fundo da página web. Um exemplo é simples e o outro, mais complexo, se adapta a muitos degrades diferentes.

18.- Validar inteiro no campo de formulário
Script para validar um campo de formulário de maneira que saibamos com certeza que dentro do campo existe sempre um número inteiro.

19.- Exemplos de funcionamento da classe String
Realizamos dois scripts em Javascript para ilustrar o funcionamento de alguns métodos e propriedades da classe String.

20.- Exemplo de funcionamento de Date
Exercício realizado para ilustrar o funcionamento da classe Date em Javascript.

21.- Link aleatório Javascript
Criamos um link que nos leva a qualquer URL aleatoriamente, entre várias possibilidades.

22.- Geração de números aleatórios Javascript
Artigo no qual se cria uma função para gerar números aleatórios na linguagem Javascript.

23.- Comprovar se as senhas são iguais
Em um formulário onde foram escritas duas senhas, explicamos como comprovar, utilizando Javascript, que são iguais antes de manda-las ao servidor.

24.- Ex. de trabalho com formulários. Calculadora simples
Veremos um exemplo do trabalho com formulários no qual desenvolveremos uma calculadora simples.

25.- Enviar ao navegador a outra página se não tiver Javascript
Uma técnica pela qual podemos dirigir ao navegador a outra página no caso de que não suporte scripts em Javascript.

26.- Confirmação de envio de formulário
Script em Javascript para que o usuário aceite ou cancele o envio de um formulário quando apertar o botão de enviar.

27.- Javascript para se posicionar em um select
Script em Javascript para se posicionar mediante o clique de teclas do teclado dentro dos elementos de um campo select de formulário.

28.- Inibir um campo texto de formulário com Javascript
Fazer com que um campo de formulário fique desabilitado, ou seja, que não possa clicar encima e mudar seu valor.

29.- Camadas com Internet Explorer 5, 6, Netscape 6, 7 e Opera
O manejo de camadas pode se complicar muito pelas diferentes versões dos navegadores. Vamos aprender a simplificar o uso de camadas com getElementById(), que funciona em IExplorer 5 em diante, Netscape 6 em diante e Opera.

30.- Mostrar e ocultar camadas com IE 5,6 NS 6,7
Explicação e exemplos sobre a maneira de mostrar e ocultar camadas com o método getElementById() de Javascript.

31.- Movimento de Camadas com IE 5,6 NS 6,7
Exemplo de DHTML, com o qual podemos criar um movimento com camadas.

32.- Escritura nas Camadas com IE 5, 6, NS 6, 7
Mecanismo e funções simples para escrever dinamicamente texto em uma camada.

33.- Como iluminar tabelas, células ou filas
Curioso efeito conseguido com Javascript, que nos permite jogar com a transparência de qualquer imagem.

34.- Inibir radio button com Javascript
Workshop de Javascript para desabilitar botões de radio para que, ao clica-los, fique sempre marcada a opção por padrão.

35.- Atualizar dois frames com um só link
Exemplo de controle de frames mediante Javascript no qual,clicando um só link, se atualizam duas páginas distintas contidas em dois frames.

36.- Calcular a idade em Javascript
Realizamos e explicamos uma função que recebe uma data de nascimento e devolve o número de anos desde a data, ou seja, a idade.

37.- Iluminar formulários com CSS e Javascript
Como modificar propriedades de cor de fundo de objetos de um formulário ao passar o mouse por cima.

38.- Autozoom de texto com Javascript
Este é um exemplo de efeito de texto que se pode fazer em DHTML utilizando Javascript. O texto aumenta e reduz seu tamanho automaticamente.

39.- Javascript para evitar que a página se mostre em um frame
Um simples javascript para evitar que nossa página se mostre dentro de um frame e se mostre em todo o espaço da janela.

40.- Elementos de formulário select associados
Como fazer com Javascript que um elemento de formulário select mude suas opções quando mude outro elemento select da página. De modo que cada opção de um select tenha um grupo de opções possíveis para o outro select.

41.- Contar os caracteres escritos em um textarea
Script em Javascript que realiza a conta dos caracteres que foram escritos em um campo de formulário textarea, ao mesmo tempo em que se está escrevendo.

42.- Passo de parâmetros em HTML com client-side Javascript
Trata-se de um simples script Javascript para recolher os parâmetros que chegam a uma página.

43.- Moldura dinâmica em Javascript com texto que muda
Workshop de Javascript em que se realiza uma moldura cujo texto muda em cada impressão da página, com o qual se podem mostrar diferentes mensagens em cada visita.

44.- Criação de gráficos de barras com Javascript
A partir da importação de uma biblioteca apropriada, podemos realizar gráficos de barras. Veremos a biblioteca importar e como manipular o código para conseguir nosso objetivo.

45.- Jogos em Javascript
Com Javascript pode-se criar jogos, e ainda que a linguagem não se presta precisamente a facilitar as coisas, com esforço se pode conseguir um jogo "curioso". Neste artigo, veremos alguns exemplos de jogos.

46.- Cross-Browser. DHTML compatível com todos os navegadores.
Apresentamos um website que oferece interessantes utilidades para o trabalho com HTML Dinâmico de uma maneira simples e compatível com os navegadores mais habituais.

47.- HTML Area. Editor WYSIWYG
Ferramenta que permite criar elementos de formulário onde o usuário pode escrever texto com estilos.

48.- Ocultar um e-mail de um link para evitar o spam
Como ocultar um endereço de correio, que é colocado no mailto de um link, para evitar que seja detectado pelos robôs que buscam endereços em webs para enviar spam.

49.- Função em Javascript para a inserção de datas
Função para a introdução de datas com formato dd/mm/aaaa.

50.- DHTML Calendar
Um script em Javascript muito fácil de utilizar e com um aspecto formidável, que nos servirá para dispor de um calendário para selecionar uma data.

51.- Gerar uma cor aleatória com Javascript
Exemplo de função para gerar uma cor aleatoriamente em formato hexadecimal.

52.- A aprendizagem na Internet
Exemplo de página interativa para a aprendizagem pela internet.

53.- Menu Dinâmico com Javascript
Deve-se apostar num menu bastante dinâmico e flexível, pois ele é o veículo que vai conduzir cada cibernauta pela rede do seu sítio.

54.- Página que muda aleatoriamente a cor de fundo
Como fazer com que uma página mude de cor cada vez que se visita, colocando uma cor aleatória e com o texto que contraste para que se possa ler bem.

55.- Script de recarregamento da página com Javascript
Realizamos um script em uma página, com Javascript, que faz com que se recarregue constantemente e assegura que não se obtém a página sempre desde o cache.

56.- Mudar a cor às células de uma tabela com Javascript
Vemos um par de métodos para alterar a cor de uma célula de uma tabela com javascript.

57.- Pop-ups DHTML – OpenPopups
Sistema Javascript para criar pop-ups DHTML, por meio de camadas, que não se podem bloquear pelos sistemas de bloqueio de pop-ups.

58.- Validar a extensão de um arquivo a subir com Javascript
Apresentamos um script Javascript para realizar a validação da extensão de um arquivo antes de realizar um upload.

59.- Detectar a resolução da tela do usuário com Javascript
Fazemos um script javascript para detectar a resolução da tela do visitante e fazer coisas diferentes em função da definição que tiver.

60.- Esconder a URL de um link na barra de estado
Como fazer um Javascript para evitar que se mostre a URL na barra de estado do navegador (status bar) ao passar o mouse por cima de um link.

61.- Como integrar conteúdo RSS em minha página?
Um código muito simples para poder ter conteúdo RSS em sua página web.

62.- Fazer com que um iframe se ajuste à altura de uma janela com Javascript
Vamos definir dinamicamente com Javascript o tamanho de um iframe para que se ajuste ao espaço disponível na janela do navegador.

63.- É vantajoso o uso de ParseInt para validar números?
A utilização do parseInt para validar números em muitos casos não é a solução mais efetiva, devido a que permite a presença de letras e/ou espaços, e o resultado poderia não ser o esperado.

64.- Efeito para desabilitar/habilitar o fundo da Página
Neste artigo explico como criar um efeito para fazer com que se mostre uma janela emergente e que o fundo da página fique desativado.

65.- Validar número de checkbox marcados com Javascript
Um script em Javascript para validar campos de verificação de formulários, para se assegurar que foi marcado um número máximo de checkbox.

66.- Evitar que um textarea supere um número de caracteres permitidos
Fazemos um script Javascript para controlar que um textarea de um formulário tenha mais caracteres dos que os permitidos. Ou seja, que se permita escrever em um textarea até que se alcance uma longitude do texto dada.

67.- Javascript não intrusivo
Behaviour, é uma imprescindível biblioteca que nos permite programar com javascript de maneira mais simples.

68.- Controle de introdução de caracteres de um campo de texto com Javascript
Podemos impedir com Javascript que os caracteres que o usuário tecle em um campo de texto de um formulário apareçam.

69.- Listagem de diferentes Framework Javascript
Os Framework Javascript e Ajax mais conhecidos, utilizados para webs 2.0.

70.- Script para detecção de suporte a Ajax, Cookies e ActiveX
Uns scripts do lado do cliente para saber se seu navegador é compatível com Ajax, Cookies e ActiveX.

71.- Leitor RSS com Javascript
Como ler mediante Javascript um feed RSS para publicar os títulos em seu site. Leitor RSS Javascript.

72.- Funções para validação alfanumérica de strings em Javascript
Uma série de funções de string para validar se um string tem ou não números e caracteres, maiúsculas e minúsculas.

73.- Script para informar da segurança de uma senha, com Javascript
Queremos informar ao usuário, quando escreve uma senha, sobre o grau de segurança da senha. Para fazer isso, vejamos este simples script Javascript.

74.- Editor de texto WYSIWYG Javascript: TinyMCE
Editor HTML WYSIWYG, para integrar em formulários web, baseado em Javascript de Moxiecode Systems AB.

75.- Apresentação de Modernizr
Modernizr é uma biblioteca Javascript que nos permite conhecer a compatibilidade do navegador com tecnologias HTML5 e CSS3, para fazer websites que se adaptam a cada browser.

76.- Aplicações para Google Chrome
Desenvolvendo aplicações em seu navegador preferido Google Chrome graças às novas APIs de Google.

77.- Mocha, um novo sabor em testes unitários de Javascript
Mocha Framework de Javascript maduro e que está crescendo no âmbito de testes unitários.

78.- QUnit para nosso código Javascript
QUnit chegou para ser parte do código Javascript de nossos projetos, graças a sua grande simplicidade.

79.- Sistemas de layouts em Javascript
O que são os sistemas de layouts e como podem facilitar a vida dos programadores em Javascript. Exemplos de bibliotecas que implementam os layouts.


Downloads
Archivo de descarga 606.28 KB Manual prático de Javascript . Manual prático de Javascript no qual podemos encontrar diversos scripts devariada utilidade comentados e prontos para serem utilizados em suas páginasweb. Aprenda Javascript praticando.


Manual traduzido em espanhol
Está disponível em Desarrolloweb.com:Taller de Javascript

Comentarios
Envie seus comentários ou opiniões sobre este manual.
Comentar o manual

Comentários do manual
Foram enviados 3 comentários à manual
1 comentário não revisado
2 comentários revisados:
Download
Por: lyan
25/5/10
Não há como fazer o download desse manual?
Link para Download!
Por: vitorlelis
27/5/10
Ae galera do CriarWeb põe o link de download ae! vlw msm!

Abrass

Usuários :    login / registro

Neste manual
Manuais relacionados