Advanced Search

Return to Snippet

Revision: 39280
at January 16, 2011 02:49 by Some0ne
Initial Code 
//FadeOut
$('#hideButton').click(function() {
$('#disclaimer').fadeOut();
});

//Toggle
$('#toggleButton').click(function() {
$('#disclaimer').toggle('slow');
});

//Slide
$('#toggleButton').click(function() {
$('#disclaimer').slideToggle('slow');
});

$('#disclaimer').slideToggle('slow', function() {
alert('The slide has finished sliding!')
});


$('#disclaimer').slideUp('slow', function() {
$('#hideButton').fadeOut();
});

//Hover effects
$('#celebs tr').mouseover(function() {
$(this).addClass('zebraHover');
});
$('#celebs tr').mouseout(function() {
$(this).removeClass('zebraHover');
});
// ^ Same as
$('#celebs tbody tr').hover(function() {
$(this).addClass('zebraHover');
}, function() {
$(this).removeClass('zebraHover');
});

//Toggle class
$('#celebs tbody tr').click(function() {
$(this).toggleClass('zebraHover');
});


//Spoiler alert
Who lost their recording contract today?
<span class='spoiler'>The Zaxntines!</span>

$('.spoiler').hide();
$('<span class="revealer">Tell me!</span>').insertBefore('.spoiler');
$('.revealer').click(function() {
$(this).hide();
$(this).next().fadeIn();
});

//Animate
$('#navigation li').hover(function() {
$(this).animate({paddingLeft: '+=15px'}, 200);
}, function() {
$(this).animate({paddingLeft: '-=15px'}, 200);
});
//-----or
$('#disclaimer').animate({
opacity: 'hide',
height: 'hide'
}, 'slow');

//Transition (easing)
$('p:first').toggle(function() {
$(this).animate({'height':'+=150px'}, 1000, 'linear');
}, function() {
$(this).animate({'height':'-=150px'}, 1000, 'swing');
});

//Chaining actions
$('p:first').hide().slideDown('slow').fadeOut(); //.delay(2000) to pause
Initial URL 

                                

                                                            

                                    

                                        

                                        Initial Description
                                        

                                    

                                    

                                

                                                            

                                    

                                        

                                        Initial Title
                                        

                                    

                                    
jQuery animations

                                

                                                            

                                    

                                        

                                        Initial Tags
                                        

                                    

                                    

                                

                                                            

                                    

                                        

                                        Initial Language
                                        

                                    

                                    
jQuery