Fotiman
msg:4483564 | 3:01 pm on Aug 10, 2012 (gmt 0) |
setTimeout will run in a different scope, where "this" is not the same as "this" within the mousover callback function. You just need to create a closure to get around it. You can do that by changing your callback like so:
$(document).ready(function () {
var navTimeout;
$('.mainNav-expand').mouseover(function() {
var that = this;
navTimeout = setTimeout(function() {
$('.mainNavContent').hide();
$(that).children('.mainNavContent').show();
alert("menu test");
}, 500);
}).mouseleave(function() {
clearTimeout(myTimeout);
});
$("#mainNav-bar").mouseout(function() {
$('.mainNavContent').hide();
});
$(".mainNav-close").click(function() {
$('.mainNavContent').hide();
});
});
|
|
[jsfiddle.net...]
|
rwilson
msg:4483671 | 8:23 pm on Aug 10, 2012 (gmt 0) |
Thanks! so I tried to take that concept and apply to the hoverIntent Jquery plugin because, setTimeout doesn't seem to be what I'm looking for. I think I'm close but it isn't working yet.
[jsfiddle.net...]
$(document).ready(function () {
$(".mainNav-expand").hoverIntent(showNav,hideNav);
var that = this;
$("#mainNav-bar").mouseout(function() {
$('.mainNavContent').hide();
});
$(".mainNav-close").click(function() {
$('.mainNavContent').hide();
});
});
function showNav() {
$(that).children('.mainNavContent').show();
alert("menutest");
}
function hideNav() {
$(that).children('.mainNavContent').hide();
alert("menutest");
}
|
Fotiman
msg:4483677 | 8:43 pm on Aug 10, 2012 (gmt 0) |
that is undefined within your showNav function. In that function, this refers to the current element, so in there you DO want this instead of that
|
rwilson
msg:4483686 | 9:13 pm on Aug 10, 2012 (gmt 0) |
Oops... Perfect! Thanks again!
|
|
