somebodysomewhere
somebodysomewhere

Reputation: 1146

jQuery: Variable not defined within my hover()

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.

Upvotes: 0

Views: 211

Answers (1)

Joseph Silber
Joseph Silber

Reputation: 219920

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);
});

Upvotes: 1

Related Questions