Dicas da Rosinh@ 50

Eventos javascript linguagem JavaScript é perfeitamente integrada à linguagem HTML e permite a criação de páginas interativas e diferenciadas.

Começar a usar JavaScript em páginas web não é complicado. Apesar de alguns scripts nessa linguagem serem bastante complexos, com um mínimo de aprendizado você já se torna capaz de realizar efeitos bastante interessantes.

Uma das lições mais importantes sobre JavaScript diz respeito ao que chamamos de eventos. Os eventos são "acionadores" dos scripts, relacionados a ações do usuário ou do navegador. Por exemplo, existe um evento chamado onLoad que ocorre quando uma página é carregada por completo. O evento on Mouseover ocorre quando o usuário passa o mouse sobre um elemento da página, enquanto o evento on Mouseout ocorre quando o mouse sai de cima desse elemento.

Quando um elemento de sua página HTML (que pode ser um link, uma imagem ou uma camada) contém um evento JavaScript, caso o usuário "dispare" o evento designado no código, esse evento chama a função JavaScript que executa a função associada. Um exemplo: se um link possui dentro da tag <a href=""...> um atributo onMouseover="xxx()", isso quer dizer que quando o mouse passar por cima desse link a função JavaScript xxx() será executada,

Quais os principais eventos JavaScript??

É importante saber quais os eventos JavaScript disponíveis e sobre que elementos da linguagem HTML eles podem ser aplicados. Veja a lista abaixo:

onClick: acionado quando clica-se uma vez no elemento. Vale para blocos de conteúdo (DIV), links, imagens e campos de formulário

ondblClick: acionado quando clica-se duas vezes no elemento (semelhante ao duplo clique do Windows). Vale para blocos de conteúdo (DIV), links, imagens e campos de formulário

onMouseover: acionado quando o mouse passa sobre o elemento. Vale para blocos de conteúdo (DIV), links, imagens e campos de formulário

onMouseout: acionado quando o mouse sai de cima de um elemento (o contrário do evento onMouseover). Vale para blocos de conteúdo (DIV), links, imagens e campos de formulário

onLoad: acionado quando a página é carregada por completo. Vale para o corpo da página

onunLoad: acionado quando a página é descarregada do navegador (geralmente esse evento ocorre quando uma nova página é solicitada em seu lugar). Vale para o corpo da página

onFocus: acionado quando o elemento entra em foco. Esse evento acontece, por exemplo, quando uma das janelas do Windows está na frente das demais (diz-se que a janela está no foco). Dentro da página HTML, por exemplo, um campo de formulário está em foco quando o cursor de digitação está piscando dentro dele (diz-se que o campo está em foco). Vale para páginas em geral e campos de formulário

onBlur: é o evento contrário ao onFocus. Ocorre quando um elemento deixa de estar em foco. Por exemplo, nas janelas do Windows que ficam escondidas na barra de ferramentas ou äcinzentadas" (diz-se que a janela está fora de foco). Dentro da página HTML, por exemplo, um campo de formulário está fora de foco quando o cursor de digitação está não piscando dentro dele (por exemplo, quando você acaba de preenchar um campo e parte para preencher o seguinte, o primeiro sai do foco). Vale para páginas em geral e campos de formulário

onChange: acionado quando o valor de um campo de formulário é alterado. Vale para os diversos tipos de campos de formulário
Como acionar os eventos usando links

Os eventos devem ser inseridos dentro das tags HTML para que possam ser disparados. Além disso, a função que eles devem disparar também deve estar corretamente indicada.

Para isso, use a seguinte sintaxe padrão:

Veja abaixo como ficaria na prática a sintaxe acima, passando o mouse sobre o link.

passe ou mouse sobre o link

Existem ainda outros eventos JavaScript, mais complexos. Ficam para outra dica. Aproveite para ir, aos poucos, testando o uso de eventos e tornando sua home page mais sofisticada.

Caso queira a gif "Save as" (Salve)

Click com o botão direito do mouse e " salve as"

Click with the right button of the mouse and "save as"

Dica da Rosinh@ 51

Tenha sua HP web designer Rosinha jardinn