In our previous tutorial, we used the History Web API within a static site to serve smooth page transitions. In this tutorial we’re going to take things to the next level, by applying what we learned in a WordPress website. There’ll be one crucial difference; we’ll leverage SmoothState.js instead of building our own from scratch. SmoothState.js will: Request pages asynchronously (AJAX) and replace the content accordingly. Update URLs and browsing history through the History Web API. We’ll opt for SmoothState.js for a number of reasons: Ease of use: it is an extremely easy to use jQuery plugin, requiring barely any configuration to get it up and running. APIs: SmoothState.js is packed with methods, properties, and hooks which allow us to mould it into many possible situations. Prefetching and caching: these two features allow our page transitions to be much smoother and faster than what we built in the previous tutorial. It’s unopiniated: SmoothState.js does not dictate how we apply the animation–we can lean on CSS, jQuery, Vanilla JavaScript, or an animation library like Velocity.js. Tried and tested: Considering more than a hundred issues have been
Share This

We are using cookies on our website

Please confirm, if you accept our tracking cookies. You can also decline the tracking, so you can continue to visit our website without any data sent to third party services.