Question

I’m wondering if its possible that when a user clicks on a link, to then fade out my entire window (so maybe a div that covers the entire window, fade it to black), and then to load an external URL, like ‘google’.

EG:

User clicks ‘Here’, entire window fades from 0% opacity, to 100% black opacity. Then, loads the link … google.

Any ideas how I would be able to achieve this?

Thanks

Answer 1

Just animate your body, then update the window’s location in the “done animating” callback.

$("body").animate({ opacity: 0, backgroundColor: '#000' }, function() {
  window.location = "http://google.com"
})