JQuery boring selector?

Question

I made this piece of code that makes the effect of hovering on the frame with any image that you add to it: "

    //rollover effect on links 
    $(".simplehover").mouseover(function () {
        $(this).attr("src", $(this).attr("src").replace("-off.", "-on."));
    }).mouseout(function () {
        $(this).attr("src", $(this).attr("src").replace("-on.", "-off."));
    });

<img src="slogan.gif" class="simplehover" />

I am trying to make it work if you add a simplehover class to the surrounding element :. (especially useful for ASP.net asp: a HyperLink tag that automatically generates an IMG tag inside a hyperlink.

<a href="#" class="simplehover"> <img src="slogan.gif" /> </a>

If I change my selector for: $ (". Simplehover img"), it will work, however it no longer works in senario # 1.

I tried this but no luck:

$(".simplehover").mouseover(function () {
if ($(this).has('img')) { $(this) = $(this).children(); }
...

Can anyone figure this out?

Montreal web design

Answer 1

, hover() .

$("a.simplehover img, img.simplehover").hover(function () {
    $(this).attr("src", $(this).attr("src").replace("-off.", "-on."));
}, function() {
    $(this).attr("src", $(this).attr("src").replace("-on.", "-off."));
});

<img src="slogan.gif" class="simplehover" />