Welcome screen before website loads (Click to enter) [Splash Screen]

Question

How would I create a welcome screen on my website? For example, I have an image and a link that says \"ENTER\" when the user clicks enter the website appears. How would I do

Answer 1

I am using flexbox and session storage to hide and show the splash screen.

The best part is in is in pure CSS and Javascript. You can use Jquery to animate stuff. I am setting a variable SplashShown in session storage to avoid displaying splash on page reload however if user open it in new browser window then splash will appear.

 
    
    
      
      
      
      
      
    
    

      
      
 

        
Your Awesome contents


           

     

      
      


         
             

              

               
My Awesome App

             
         
      
      
      
    

See the Pen Splash Screen in Pure java script and Session Storage by Hitesh Sahu (@hiteshsahu) on CodePen.