SwapIt! updated for jQuery 1.1

Quiet little post. I’ve fixed several bugs in SwapIt! and updated it to support jQuery 1.1. You can find it here.

SwapIt! is a jQuery plugin that allows you to swap out image. You can use it for rollovers and background images.

jQuery: My new plugin swapit!!!!

So I’m still trying to get over the bug hump from the last post, but while I’m waiting to work that problem out, I went ahead with my new plugin swapit.

Swapit makes swapping images and background images easy and it works like any other plugin. Below is the code:

$.fn.swapit = function(a)
{
return this.each(function()
{
var i = (new Image).src = a;
var i2;
var c;
// bind the mouseover and mouseout event to swap the images
if($(this).get(0).tagName.toUpperCase() == “IMG”)
{
i2 = $(this).attr(“src”);

$(this).mouseover(function(i2)
{
$(this).attr(“src”, i2);
}).mouseout(function()
{
$(this).attr(“src”, a);
});
}else{
i2 = $(this).css(“background-image”);
$(this).mouseover(function()
{
c = “url(” + a + “)”;
$(this).css({“background-image”:c});
}).mouseout(function(){
$(this).css({“background-image”:i2});
});
}
});
}

The following shows how to use it with a div and an img tag:

$(function(){
$(“#test”).swapit(“b-aboutus-over.jpg”);
$(“.over”).swapit(“b-contactus-over.jpg”)
});

<div id=”test” style=”background-image:url(b-aboutus.jpg);”></div>
<img src=”b-contactus.jpg” class=”over”>Like always, tell me what I’m doing wrong or how I can improve the plugin. I’ll be posting it to jQuery.com and getjuqery.org sometime tonight.