Thread: Loading Screen

Results 1 to 6 of 6
  1. #1 Loading Screen 
    Registered Member
    Join Date
    Aug 2013
    Posts
    32
    Thanks given
    1
    Thanks received
    0
    Rep Power
    11
    Hey,


    Here is a tut for adding a loading screen for your landing page or whatsoever.


    Step 1:

    Add the below code just under the <body> tag

    Code:
    <div class="loader"></div>
    Step 2:

    Add the below class somewhere in your css file

    Code:
    .loader {
    	position: fixed;
    	left: 0px;
    	top: 0px;
    	width: 100%;
    	height: 100%;
    	z-index: 9999;
    	background: url('url of your loader') 50% 50% no-repeat rgb(249,249,249);
    }

    Step 3:

    Now add this just above the </head> tag

    Code:
    		<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript">
    $(window).load(function() {
    	$(".loader").fadeOut("slow");
    })

    Done!

    Hope this helped you.
    Reply With Quote  
     

  2. #2  
    ZzzzZzzzzZzzzzZzzz
    Shoutout's Avatar
    Join Date
    Sep 2014
    Posts
    260
    Thanks given
    19
    Thanks received
    8
    Rep Power
    11
    Demo?
    Reply With Quote  
     

  3. #3  
    Registered Member
    Join Date
    Sep 2014
    Age
    21
    Posts
    92
    Thanks given
    46
    Thanks received
    8
    Rep Power
    12
    How would i make it dissapear after a few seconds instead of fading out?
    Reply With Quote  
     

  4. #4  
    Web Designer, PC Build Pro

    Join Date
    May 2013
    Posts
    298
    Thanks given
    31
    Thanks received
    27
    Rep Power
    37
    For the lazy this is pretty cool too. [Only registered and activated users can see links. ]
    Reply With Quote  
     

  5. Thankful user:


  6. #5  
    Registered Member
    Join Date
    Sep 2014
    Age
    21
    Posts
    92
    Thanks given
    46
    Thanks received
    8
    Rep Power
    12
    Quote Originally Posted by TotalTurmoil View Post
    For the lazy this is pretty cool too. [Only registered and activated users can see links. ]
    Thanks
    Reply With Quote  
     

  7. #6  
    GravityScape & SimpliCity Developer.

    RSWSkiller's Avatar
    Join Date
    Dec 2013
    Age
    22
    Posts
    754
    Thanks given
    175
    Thanks received
    63
    Rep Power
    97
    Quote Originally Posted by TotalTurmoil View Post
    For the lazy this is pretty cool too. [Only registered and activated users can see links. ]
    Thanks.
    Reply With Quote  
     


Thread Information
Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Similar Threads

  1. My client loading screen - PI/Galkon
    By Project Fail in forum Show-off
    Replies: 14
    Last Post: 01-23-2011, 04:46 AM
  2. Runescapes New Loading Screen
    By Insane in forum Show-off
    Replies: 17
    Last Post: 10-06-2010, 11:58 AM
  3. [pi] error with loading screen
    By rexz0rd in forum Help
    Replies: 1
    Last Post: 07-30-2010, 02:48 PM
  4. Messed up Loading screen...
    By araychi in forum Help
    Replies: 3
    Last Post: 03-16-2009, 10:40 AM
  5. Replies: 2
    Last Post: 10-28-2008, 04:17 PM
Posting Permissions
  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •