jQuery: Variable not defined within my hover()

Question

I have this code:

$('#services_list > div').hover(function() {

    var serviceHoveredOn = '#' + $(this).attr('id');
    $(serviceHoveredOn + ' .service_expand').stop().animate({'width': '169px'}, 150);

},

function() {

    $(serviceHoveredOn + ' .service_expand').stop().animate({'width': '159px'}, 150);

});

But, serviceHoveredOn is not defined when I hover outside of my div. I searched and found this: jquery: passing variables in hover() function? But I am not sure how I can use toggle() to solve my problem. Thank you.

Joseph Silber · Accepted Answer · 2013-01-31 01:21:23Z

1

You cannot access variables declared in another function.

In your case, you don't even need it. Just use this, and pass it as a context:

$('#services_list > div').hover(function() {
    $('.service_expand', this).stop().animate({'width': '169px'}, 150);
},
function() {
    $('.service_expand', this).stop().animate({'width': '159px'}, 150);
});

answered Jan 31, 2013 at 1:21

Joseph Silber

221k59 gold badges369 silver badges292 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

somebodysomewhere Over a year ago

Amazing, thank you. I didn't know that I could use this like that. Would you mind explaining what that's called so I can look it up?

Joseph Silber Over a year ago

$('.service_expand', this) is equivalent to $(this).find('.service_expand'). It's called "the context". See the jQuery docs.

somebodysomewhere Over a year ago

Ah, I knew about .find but I didn't even think about using it. This way is even simpler though. Much appreciated.

epascarello Over a year ago

better to do $(this).find(".service_expand")...

Joseph Silber Over a year ago

@epascarello - Why? I think the context method might even be more performant. And don't tell me that find is clearer. Once you get used to using the context, it's just as clear.

|

Collectives™ on Stack Overflow

jQuery: Variable not defined within my hover()

1 Answer 1

7 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related