javascript - Jquery Effect Onunload - Stack Overflow

admin管理员组

文章数量:1346676

I would like to use the jquery slideUp effect when the user navigates away from the page just to make the page look cool as it closes.

I assume that I should use the onunload event but how can I delay the page closing long enough for the effect to run to pletion.

One of the options that came to mind is effectively hijacking the page closing function, storing it in some variable and then executing it once I had run my effect but I have no idea how I would do that.

Any suggestions or alternative ideas are more than wele

I would like to use the jquery slideUp effect when the user navigates away from the page just to make the page look cool as it closes.

I assume that I should use the onunload event but how can I delay the page closing long enough for the effect to run to pletion.

One of the options that came to mind is effectively hijacking the page closing function, storing it in some variable and then executing it once I had run my effect but I have no idea how I would do that.

Any suggestions or alternative ideas are more than wele

• javascript
• jquery
• effect
• onunload

Share Improve this question Follow asked Jun 17, 2009 at 12:27 jcuenodjcuenod 58.5k1515 gold badges6969 silver badges103103 bronze badges

Add a ment  | 

7 Answers 7

Sorted by: Reset to default 4

what you're looking for is the onbeforeunload event.
just a warning though... it should be really quick... or your visitors are probably going to hate it no matter how cool it looks

as to preventing the page from navigating away before the animation is done, that's a bigger problem... any animation is going to rely on setTimeout/setInterval and the page won't wait for those to plete before leaving.

Doing anything but closing the window when the users ask to is breaking a contract with the user. The browser window is not yours, it's the users, and no matter how cool the effect, it will inevitably annoy most of your users.

The onbeforeunload event is very restricted in what it can do. It must return a string, which is then used to prompt the user for a confirmation about leaving the page. It won't work for cool animations.

As far as I know, the only way to stop a user from leaving a page is the onbeforeunload event, which isn't cancelable. Instead, you return a string from that method, the browser prompts the user with a Yes/No dialog, life goes on. 276660 has more info about this.

I don't think you're going to have much luck with this one.

why not, instead of making a "cool" effect when a user simple want to go away from your website (even if the user closes the browser/tab the unload event will be fired) and annoying the simple user with that ... preventing him/her to return again...

...do that "cool" effect when a user reaches your website for the first time? as a normal intro effect?

I did that as a simple idea, you can see it here: http://www.balexandre./jmfc

I would agree 100% with Jonathan Fingland's answer, and add this.

In IE, (I'm not sure what versions support this, I know IE6 did) you can use some propriety meta tags to achieve fades etc when leaving the page. However, this is limited in browsers (IE only), so you're stuck for cross browser use.

You may find loading new content via AJAX would give you better control of effects and transitions, as well as reducing the annoyance factor to the user which can result from trying to hijack the browser actions in such a manner.

I would look at using a form of slider as mentioned above (see for instance http://webdesignledger./tutorials/13-super-useful-jquery-content-slider-scripts-and-tutorials), or simply loading content panes in response to user clicks.

The only way I've found for delaying the window to close, is using an alert. If this is an acceptable promise for your case, it will really delay the window destruction in memory, and allow your page timers to execute (of course, if user does not close the alert popup earlier than your animations finalize).

I recently used this approach so i could call a flex method through FABridge (which would otherwise be destroyed before the flex method call finishes). I'd like to hear your ments on this.

本文标签： javascriptJquery Effect OnunloadStack Overflow