SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Zealot
    Join Date
    Feb 2009
    Posts
    152
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Execute Function on Current Item

    I have this code which removes a class from an item on mouse out.

    Code:
    function mouseOut8( ) {
    $('.bar8')
    .removeClass("barover");
    }
    I would like to change this so that the class is removed from the item I have just moused out of instead of specifying the exact item. This is so I can use this function for multiple items. I tried replacing the '.bar8' with 'this' but it didn't work.

    Thanks.

  2. #2
    SitePoint Wizard bronze trophy
    Join Date
    Jul 2008
    Posts
    5,757
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    $(this).removeClass("barover");

    really should work.

    If it doesn't, give use the details of how you registered this function as an event handler for the mouseout event.

  3. #3
    SitePoint Addict Zarin Denatrose's Avatar
    Join Date
    Jan 2009
    Location
    Surrey BC, Canada
    Posts
    309
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I think a1anm may have used $('this'), passing this as a string to be searched as a css selector, not a javascript object.
    The problem with just going $(this).removeClass("barover"); though is that it's going to apply to everything the mouse touches. What strikes me as troublesome is this:
    I would like to change this so that the class is removed from the item I have just moused out of instead of specifying the exact item.
    What you should do is use the class as a general selector for the elements affected, then target the specific element when needed. Furthermore, for a full hover effect, you can make use of the jquery hover class. There's an example below, the first function is mouseover, the second is mouseout.

    Code:
    $('.bar').hover(
    function(e){$(e.target).addClass('barover')},
    function(e){$(e.target).removeClass('barover')}
    );


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •