Installation

barba.js supports AMD, CommonJS and Browser global (using UMD).

You can install it using npm:

npm install barba.js --save-dev

or just include the script in your page:

<script src="barba.min.js" type="text/javascript"></script>

barba.js needs to know a little bit about your DOM structure. By default, it uses this markup structure in your pages:

<div id="barba-wrapper">
                    <div class="barba-container">
    ...Put here the content you wish to change between pages...
                    </div>
</div>

Please note, all the selectors (#barba-wrapper, .barba-container) are easily editable - see the Dom API section.

After you've included barba.js in your project it's time to initialize it:

//Please note, the DOM should be ready
Barba.Pjax.start();