1.Back to top button
// Back To Top
$(‘a.top’).click(function(){
$(document.body).animate({scrollTop : 0},800);
return false;
});
//Create an anchor tag
Back to top
-There’s no need to use a plugin to create a simple scroll to top animation in jQuery. By simply changing the scrollTop value we can change where we want the scrollbar to land finally.
2.Checking if images are loaded
$(‘img’).load(function() {
console.log(‘image load successful’);
});
-Used to check if your images are fully loaded to continue with your scripts.
3.Fix broken images automatically
$(‘img’).error(function(){
$(this).attr(‘src’, ‘img/broken.png’);
});
-Save yourself the trouble of replacing broken image links on our website one by one with this code.
4.Toggle class on hover
$(‘.btn’).hover(function(){
$(this).addClass(‘hover’);
}, function(){
$(this).removeClass(‘hover’);
}
);
-Add a class to your element when the user is hovering and remove the same when the user stops it with this code.
5.Disabling input fields
$(‘input[type=”submit”]‘).attr(“disabled”, true);
-Add the disabled attribute to your input so you can enable it as and when you want with this code.
6.Stop the loading of links
$(‘a.no-link’).click(function(e){
e.preventDefault();
});
-This piece of code will do the trick of preventing a default action.
7.Toggle fade/slide
// Fade
$( “.btn” ).click(function() {
$( “.element” ).fadeToggle(“slow”);
});
// Toggle
$( “.btn” ).click(function() {
$( “.element” ).slideToggle(“slow”);
});
-Make an element to appear on the first click and then disappear on the second using this code.
8.Simple accordion
// Close all Panels
$(‘#accordion’).find(‘.content’).hide();
// Accordion
$(‘#accordion’).find(‘.accordion-header’).click(function(){
var next = $(this).next();
next.slideToggle(‘fast’);
$(‘.content’).not(next).slideUp(‘fast’);
return false;
});
-Simple method for a quick accordion.
9.Make two divs the same height
$(‘.div’).css(‘min-height’, $(‘.main-div’).height());
-Use this code when you want two divs to have the same height no matter what content they have in them.
10.Zebra stripped unordered list
$(‘li:odd’).css(‘background’, ‘#E8E8E8’);
-Create zebra striped unordered lists using this code.
Source: Web Designer Depot
Fonte: http://efytimes.com/e1/fullnews.asp?edid=132981