jquery - Create rollover image buttons | make rollover image buttons from single function using jquery

//make a duplicate image of each jpg or png and add "_over" behind the filename. Inside the img tag, put class name as "button" png button, and "jpgBtn" for normal jpg buttons

$(document).ready(function() {

if (!$.browser.msie || ($.browser.msie && $.browser.version > 6)) { //if not ie6 png buttons
//png button
$("img.button").hover(
function () {
ori = $(this).attr("src").split(".png");
src = ori[0];
$(this).attr("src",src + "_over.png");
},
function () {
$(this).attr("src",src + ".png");
}
);
}

//jpg button
$("img.jpgBtn").hover(
function () {
ori = $(this).attr("src").split(".jpg");
src = ori[0];
$(this).attr("src",src + "_over.jpg");
},
function () {
$(this).attr("src",src + ".jpg");
}
);

});

jquery - Inserting jquery framework to your html | google host jquery

A simple line of code so that you don't need to host your jquery framework. Let google do that for you :)

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>