[jQuery] Re: removeClass() fires before anything else in a series of functions when I need it to fire last.
er, jeez I'm sorry - i don't know how to format code on Google Groups :
(
On Jan 5, 2:21 pm, Kinsbane kinsb...@gmail.com wrote:
So, there's a main column of content and to the left of the main
column is an A element that is absolutely positioned.
I have an announcement system that when there's an active
announcement, a box is rendered above the main column, pushing the
main column down. However, the A element that is absolutely positioned
stays where it is.
I added code to check for an active announcement and add a class to
the A element so it'll keep it positioned alongside the left-border of
the main column.
When a user closes the announcement box, it fades out, and the main
column moves back up to fill the space - but the positioned A element
does not follow. I then added code to the function I had to fade out
the box and save a cookie to show the user had closed the active
announcement box which removed the active-announcement class I had PHP
add to the A element.
The problem is, even though the removeClass() function is last in the
series of functions, it fires first - the positioned A element moves
up to where it should be BEFORE the active announcement box fades out.
How can I change this so that the positioned A element has its class
removed after the other two things have taken place?
Here's the jQuery code I have:
[code]
$(#close-notice).click(function(){
$(#notice).fadeOut(800);
createCookie('t3d_notice',
't3dnotice_?= $announcement['id']; ?
', 365);
$(#notice-tab).removeClass('active-notice');
}
);
[/code]
[jQuery] Re: removeClass() fires before anything else in a series of functions when I need it to fire last.
Hi!
This is due to that the fadeOut function is asynchronous (and that's a
good thing, otherwise the entire browser would freeze while
animating). To solve your problem you could use a callback. That's a
second parameter to the fadeOut method as a anonymous function
http://docs.jquery.com/Effects/fadeOut
$(#notice).fadeOut(800, function(){
$(#notice-tab).removeClass('active-notice');
});
The method will now remove the active-notice class afterwards.
/ Johan
On Jan 5, 11:25 pm, Kinsbane kinsb...@gmail.com wrote:
er, jeez I'm sorry - i don't know how to format code on Google Groups :
(
On Jan 5, 2:21 pm, Kinsbane kinsb...@gmail.com wrote:
So, there's a main column of content and to the left of the main
column is an A element that is absolutely positioned.
I have an announcement system that when there's an active
announcement, a box is rendered above the main column, pushing the
main column down. However, the A element that is absolutely positioned
stays where it is.
I added code to check for an active announcement and add a class to
the A element so it'll keep it positioned alongside the left-border of
the main column.
When a user closes the announcement box, it fades out, and the main
column moves back up to fill the space - but the positioned A element
does not follow. I then added code to the function I had to fade out
the box and save a cookie to show the user had closed the active
announcement box which removed the active-announcement class I had PHP
add to the A element.
The problem is, even though the removeClass() function is last in the
series of functions, it fires first - the positioned A element moves
up to where it should be BEFORE the active announcement box fades out.
How can I change this so that the positioned A element has its class
removed after the other two things have taken place?
Here's the jQuery code I have:
[code]
$(#close-notice).click(function(){
$(#notice).fadeOut(800);
createCookie('t3d_notice',
't3dnotice_?= $announcement['id']; ?
', 365);
$(#notice-tab).removeClass('active-notice');
}
);
[/code]
