Put this near the top of the head section


<!-- CAUSE PAGE TO FADE IN ONCE LOADED - 1ST PART -->
<style>
body {
  display: none;
}
</style>
<!-- LOAD JQUERY LIBRARIES -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> <!--Should be first script imported/first script on the page-->
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/smoothness/jquery-ui.css" type="text/css" media="all" />
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js" type="text/javascript"></script>

Put this after the </body> tag


</body>

<!-- CAUSE PAGE TO FADE IN ONCE LOADED -2ND PART -->
<script type="text/javascript">
$(window).load(function() {
  // When the page has loaded
  $("body").fadeIn(2000);
});
</script>

 

Feel free to comment if you can add help to this page or point out issues and solutions you have found. I do not provide support on this site, if you need help with a problem head over to stack overflow.

Comments

Your email address will not be published. Required fields are marked *