GUIA DE jQUERY
mouseenter() --> entra el mouse a un objeto
mouseleave() --> mouse sale de un objeto
fadeTo('fast', 0.5)--> desvanece la opacidad del objeto a 0.5 puede ir hasta 1
.click() --> captura el click
:nth-child(1)--> seleccionar un elemento de una lista, ejemplo el 1
fadeIn('slow') --> hacer aparecer un objeto
fadeOut('slow') -->desaparecer un objeto
slideToggle('slow') -->deslizar y mostrar y deslizar y ocultar un objeto
.append('Texto para agregar') --> agregar contenido
.after('algo de texto') -->elementos despues de una etiqueta
.before('algo de texto') -->elementos antes de una etiqueta
.empty('') -->borra toda la etiqueta y su contenido
.remove('') --> borra solo el item seleccionado sintasis $('p').remove()
$('#texto').addClass('resaltar') --> aadir clase
$('#texto').removeClass('resaltar') --> remover clase
.toggleClass --> aade una clase si no existe o la elimina si ya existe
('div').height('200px') --> cambiar alto de un elemento
('div').width('200px') --> cambiar ancho de un elemento
('div').css('border-radius', '10px') --> agregar estilo css a un objeto
('p').html('Magia de jQuery en accin!') --> cambiar el contenido de una objeto
('div').html() --> recupera el contenido del objeto seleccionado
('input:checkbox:checked').val() --> recupera el valor
('input[name=checkListItem]').val() -->recupera el valo de un campo de entrada
$(document).on('evento', 'selector', function(){}) --> cuando el dom esta cargado
.hover() --> cambiar cuando paso el mouse por encima
.dblclick() --> captura el doble clickn
.addClass('active') -->activar una clase cuando el mouse para por encima de un menu
.removeClass('active') --> quitar el efecto cuando el mouse sale de la clase
.focus(function(){}) --> colocar focus a los elementos de un formulario
.keydown() --> cuando se presiona una tecla
.animate() --> animar un evento
.length -->largo de un cadena
.confirm("mensajes") --> ventana de confirmacion
.prompt("preguntas?") --> hacerle preguntas al usuario
.substring(3,7) --> cuantas letras se muestran en pantalla
______________________________________________________________
Ejemplo de agregar contenido al presionar un boton
$(document).ready(function(){
$('#boton').click(function(){
var Agregar = $('input[name=checkListItem]').val();
$('.lista').append('"+ Agregar +"')
});
});
_____________________________________________________________
$(document).ready(function(){
$('#boton').click(function(){
var Agregar = $('input[name=checkListItem]').val();
$('.lista').append('"+ Agregar +"')
});
$(document).on('click', '.item', function(){
$(this).remove();
});
});
________________________________________________________________
$(document).ready(function(){
$('div').hover(
function(){
$(this).addClass('active');
},
function(){
$(this).removeClass('active');
}
);
});
_______________________________________________________________
$(document).ready(function(){
$('img').animate({top:'+=100px'}, 1000);
});
Top Related