you may be able to cache the images to get what you want here's an untested crack at it, hopefully it will get you close:
<img class='myClass' myAltImage='imgYellow.src' src='images/ Green.gif' /> $(document).ready(function(){ imgGreen = new Image(15,15); imgGreen.src = 'images/Green.gif'; imgYellow = new Image(15,15); imgYellow.src = 'images/Yellow.gif'; //set the default image (if not already done in your html) $('.myClass).attr('src', imgGreen.src); // toggle to yellow on hover and back to green when move the mouse off the element $('.myClass').hover(function(){ $(this).attr('src', $(this).attr('myAltImage') ); },function(){ $(this).attr('src', imgGreen.src); }); }); [EMAIL PROTECTED] wrote: > Hi, > > I have several images on my page, each with class "myClass". I know > when I roll over each image, I want its source to be "over.gif". > However, when I roll out I want the image to be whatever was there > before, and it will be different for each image. How can I construct > mouseover/mouseout handlers to accommodate this? > > Here are the handlers I'll presumably be using > > $('.myClass').mouseover( function(){ $ > (this).attr("src", $(this).attr("src", "over.gif") } ); > $('.myClass').mouseout( function(){ $ > (this).attr("src", $(this).attr("src", ???) } ); > > Thanks, - Dave