Basic question about $(this) and > , and ! or .not
To start:
$('#menu > li').mouseenter(function () {
var $this = $(this);
tabOpen($this);
}
});
I'm assuming that when the mouse hovers on any menu item, that $('#menu > li').mouseenter(function () determines which menu item or li object it was that fired the event. That object becomes $(this) and is assigned to the var $this, which is then passed to the tabOpen() function.
function tabOpen($this) {
$('a', $this).stop(true, true).animate({
'top': '15px'
// 'bottom': '-15px'
}, 300);
$('i', $this).stop(true, true).animate({
'top': '150px'
}, 400);
}
Here, the li object is passed to $('a', $this).stop(true, true).animate({ and from this, the identity of 'a' and 'i' are determined, and animated.
So, $this equals the li that is being manipulated, Right?
So, if this li has a class assigned to it, like class="done", how can I test for that and exclude that li from being acted on?
I've tried doing if(!$this.hasClass('done'), and $this.not('.done'), but I'm just guessing base on what I think would work, But, I'm missing some understanding here.
Can someone straighten me out?