CODEWITHSUNDEEP
c#javascriptjqueryhtmlrazor
βӔḺṪẶⱫŌŔ
βӔḺṪẶⱫŌŔ

Reputation: 1296

Waiting for DIV to stop moving before proceeding to another page

I have a jQuery function on my page that animates a div (slides it up) when the user clicks on a Link. But I want the browser to go to the linked page only after the DIV has finished sliding up. Can we do this?

Does anyone have any references/articles/tutorials?

Thank you

Upvotes: 1

Views: 144

Answers (3)

Tr1stan
Tr1stan

Reputation: 2775

You should have a javascript redirect in the callback of the slideUp method.

Example:

$('#divId').click(function() {
  $(this).slideUp('slow', function() {
    window.location = 'urlhere'; //relative url
  });
});

Or if the url is outside of the site, you replace the window.location with this:

 window.location = 'http://domainhere.com/urlhere'; //absolute url

Upvotes: 3

Abe Petrillo
Abe Petrillo

Reputation: 2447

Depends on how you've done the sliding, I personally would create a function:

if you follow the jQuery documentation 

$('#clickme').click(function() {
  $('#book').animate({
    opacity: 0.25,
    left: '+=50',
    height: 'toggle'
  }, 5000, function() {
    // Animation complete.
    window.location = 'http://example.com'
  });
});

If you provide code or more detail and can be more specific

Upvotes: 1

Nathan
Nathan

Reputation: 6216

There is usually a callback function that is called when the animation or effect completes. See this page - and click on view source for an example

Upvotes: 1

Related Questions