Page Loading Transitions

You can show Interactive loaders to your Visitors while the Pages of you Website loads in the background & then Reveal your Pages with CSS3 Transitions. Page Transition options are applied on the <body> Tags.

Code Example

<body class="page-transition" data-loader="2" data-animation-in="fadeIn" data-speed-in="1500" data-animation-out="fadeOut" data-speed-out="800">

Settings

Private Content

You must be logged in with your Envato Account for Free in order to view this Content.

Login with Envato

Custom Loader for Page Transitions

You can use a Custom Loader for the Page Transitions using the data-loader-html Attribute set to the tag.

<body class="page-transition" data-loader-html="<img src='images/loader.gif' alt='Loading...'>">