EventosO evento pode ser forçado a acontecer:

$(‘#item’).trigger(‘click’);

EventosO evento hover

Diferente dos eventos ‘focus’ e ‘blur’, o ‘hover’ ocorre em 2 momentos diferentes:

1- quando o ponteiro do mouse se posiciona acima do elemento

2- quando o ponteiro do mouse deixa de se posicionar acima do elemento.

Logo, temos uma forma especial de tratar esse tipo de evento, enviando 2 conjuntos de métodos: um para quando o mouse estiver acima e outro quando sair do elemento marcado.

EventosAplicando o evento hover:

$(‘#menu > li’).hover( function() { $(this).css('background-color', '#ccc'); }, function() { $(this).css('background-color', '#fff'); });

EventosNa primeira função temos o funcionamento do primeiro evento, ou seja, mouse se posiciona acima de um elemento ( ‘#menu > li’ ).

A segunda função se aplica quando o mouse deixa de apontar esse elemento.

Problema do hoverCom a crescente demanda de aparelhos com tecnologias de touch screen, o evento hover começa a deixar de acontecer em alguns casos.

Por exemplo: uma tela de celular baseada em toque não gera um evento ‘hover’, pois a indicação com dedo ou caneta indicaria um evento ‘click’.

Efeitos e AnimaçõesFormas básicas de animação:

$(‘#item’).show(‘slow’);$(‘#item’).hide(‘fast’);$(‘#item’).show(2000);$(‘#item’).toggle(‘medium’);

Efeitos e AnimaçõesUtilizamos slow, medium e fast para tempos padrões de animação.

Quanto utilizamos números para o tempo de animação, denimos ele em ms. Ou seja: 2000ms = 2 segundos.

O método ‘toggle’ verica alterna a visibilidade do elemento (alterna entre show e hide a partir de seu estado).

Efeitos e AnimaçõesMais formas básicas de animação:

$(‘#item’).slideUp();$(‘#item’).slideDown();$(‘#item’).fadeIn();$(‘#item’).fadeOut();

Efeitos e AnimaçõesEm slideUp() fazemos o elemento desaparecer com uma varredura vertical de baixo para cima.

Efeitos e AnimaçõesEm slideDown() fazemos o elemento aparecer com uma varredura vertical de cima para baixo.

Efeitos e AnimaçõesEm fadeIn() fazemos o elemento aparecer com um efeito de dissolução.

Efeitos e AnimaçõesEm fadeOut() fazemos o elemento desaparecer com um efeito de dissolução.

Efeitos e AnimaçõesAnimação avançada

$("#item").animate({ width: "70%", opacity: 0.4, marginLeft: "30px", fontSize: "30px", borderWidth: "10px"}, 1500 );

Efeitos e AnimaçõesNo método animate() passamos uma série de propriedades CSS que vamos alterar e em seguida o tempo de duração dessa duração.