Need help about jQuery transition effect on page exit

Need help about jQuery transition effect on page exit

Hello,

To set JQuery  transition effects on page exit, you can simply use CSS for style and JavaScript. Set the CSS to display: none as shown.

body { display: none; }

This stops all the visual elements contained in the body from loading, initially “hiding” everything. To prevent a visitor’s page having JavaScript disabled from failing to load, add the display:none CSS property using jQuery. If visitors have JavaScript disabled, they will still be able to see the body content.

<script type="text/javascript">

    $(document).ready(function() {

        $("body").css("display", "none");

    });

</script>

Now we can add some fade-in effects and give a time instance when the fade-in takes place.

<script type="text/javascript">

$(document).ready(function() {

    $("body").css("display", "none");

 $("body").fadeIn(2000);

 $("a.transition").click(function(event){

        event.preventDefault();

        linkLocation = this.href;

        $("body").fadeOut(1000, redirectPage);    

    });

    function redirectPage() {

        window.location = linkLocation;

    }

});

</script>

Thank you.