[jQuery] Easy img Roll-overs: Plug-in writing help please?
I'm a pretty new. So I have some understanding of the language. I'm a
designer primarily (which explains the uncode-ness). I'm betting
someone's already written a plug-in like this but I wanted to get some
experience writing a plug-in myself & make my life a bit easier and
faster.
Anyways, I've ported an old javascript function (originally a
christian heilman script) to jquery that i'd use to install rollovers
rather easily and unobtrusively. I've got it to work here:(http://
www.chrisjlee.net/project/premierenergy/).
I'm kind of at lost of how the plugin writing works. The following is
my attempt at it:
------
jQuery.fn.mouseOverImg = function(class) {
$(this).addClass(class); // set a class to roll over images
var imgs = $("img").filter(class); // find classes to bind
rollovers
var parentimg = imgs.parent ();
imgs.each(function() {
var url = $(target).attr('src');
var ftype = url.substring(url.lastIndexOf('.'),
url.length); // find the file type
var fname = url.substring(0, url.lastIndexOf('.')); // find
the file name
var output = fname + '_on' + ftype; // output becomes
img_on.gif
if(output) {
$(this)
.hover(function() {
$(this).attr('src', output);
},
function() {
$(this).attr('src', url);
});
}
});
}
------
I've loaded it into the website currently and it doesn't recognize
that function. at least thats what firebug says. Any ideas?