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

Reply via email to