Sei sulla pagina 1di 5

LEMBRETES jQUERY

Inicializao jQuery
---- Verifica se o DOM carregou
$(document).ready(function(){
});
ou
$(function(){
});
===========================================================
---- Verifica se todos os elementos da pgina foram carregados
$(window).load(function(){
});
============================================================
Seletor com base no texto de elemento (filtro de conteudo)
$('li:contains("Conteudo")').css();
============================================================
Elementos que no contem conteudo
$('elementos:empty').css();
===========================================================
Seletor que procura um elemento dentro de outro
$('elementoPai:has("elementoFilho")')
===========================================================
---- Selecionando elemento
$('seletor') ou $('seletor1 , seletor2')
===========================================================
---- Acessando/alterando CSS do elemento
$('seletor').css("propriedade","valor");
===========================================================

---- Mais de uma alterao no CSS


$('seletor').css({
'prop-prop': 'val',
prop: 'val',
});
===========================================================
---- Escondendo elemento
$('seletor').hide();
===========================================================
---- Modificando texto do elemento
$('seletor').text("Contedo do texto");
===========================================================
---- Tempo de atraso (delay) para a prxima instruo
$('seletor').delay('2000').css("prop", "val");
===========================================================

---- Encadeando instrues


$('seletor')
.css("prop", "val")
.hide()
.delay('1000')
.fadeIn("slow");
===========================================================
****************** EVENTOS DE NAVEGADOR **********************
---- Alterando valor de um atributo
$(seletor).attr("atributo","valor");
===========================================================
---- Executa uma funo quando h um erro com o elemento do seletor
$('elemento').error(function(){
});

===========================================================
---- mostrar ou alterar largura/altura de elemento
$(seletor).width();
$(seletor).height();
===========================================================
---- Executa evento ao alterar dimenses do navegador
$(window).resize(function(){
});
===========================================================
---- Executa instruo ao rolar a pgina
$(window).scroll(function(){
});
===========================================================
---- Retorna a distncia do topo
$(window).scrollTop(function(){
});
****************** EVENTOS DE MOUSE **********************
---- Retorna a distncia do topo
$(elemento).click(function(){
// dispara um evento ao clicar no elemento
});

$(elemento).dblclick(function(){
// dispara um evento ao dar um clique duplo no elemento
});
$(elemento).focusin(function(){
// dispara um evento ao dar um foco no elemento
});
$(elemento).focusout(function(){
// dispara um evento ao retirar o foco no elemento

});
$(elemento).focus(function(){
// dispara um evento ao dar um foco no elemento
});
$(elemento).blur(function(){
// dispara um evento ao sair do elemento
});
$(elemento).hover(function(){
// dispara um evento ao passar o mouse no elemento
});
$(elemento).mousedown(function(){
// dispara um evento ao apertar o botao do mouse no elemento
});
$(elemento).mouseup(function(){
// dispara um evento ao soltar o botao do mouse no elemento
});
$(elemento).mouseenter(function(){
// dispara um evento ao passar o mouse no elemento, noa funciona em elem
entos filhos
});
$(elemento).mouseout(function(){
// dispara um evento ao retirar o mouse no elemento
});
$(elemento).mouseover(function(){
// dispara um evento ao passar o mouse no elemento, funciona para elemen
tos filhos
});
$(elemento).mouseleave(function(){
// dispara um evento ao passar o mouse no elemento, funciona para elemen
tos filhos
});
---- Retorna a posio do mouse em determinado elemento
$(elemento).mousemove(function(move){
var localx = move.pageX;
var localx = move.pageY;
});
---- Percorre todos os elementos que se identificam com o selector
================================= EVENTOS DE TECLADO ==========================
=========
$(selector).each(function(){

...
});
---- disparado sempre que alguma tecla pressionada, com atraso de uma
$().keypress(function)({
});
---- disparado sempre que alguma tecla pressionada, em tempo real
$(selector).keyup(function(){
});

---- Executar vrios eventos com a mesma instruo


$(seletor).bind('event1 event2 event3', function(){
...
});

---- Executar vrios eventos com instrues distintas


$(seletor).bind({
event1: function,
event2: function,
event3: function(){}
});

Potrebbero piacerti anche