Question

I finally got pjax working, but I have another question.. How do I add some jquery animation like fadeout/slideup old content and fadein/slidedown new content?

By default pjax just changes the content without any good looking effects..

Any help would be much appreciated.

Best Regards

Answer 1

Basically, you have a bunch of events to latch on to and do as you like. Here’s a basic fadeIn and fadeOut version using the pjax:start and pjax:end as triggers.

$(document)
  .on('pjax:start', function() { $('#main').fadeOut(200); })
  .on('pjax:end',   function() { $('#main').fadeIn(200); })

Obviously you would swap #main for the container element you’re swapping content in and out of.