CODEWITHSUNDEEP
javascripthtmljquerycssanimation
marlxnw
marlxnw

Reputation: 63

Loading Screen only on first visit during a session?

is there any way to make my loading screen appear only on the first visit during a session?

HTML

<div class="splash-wrapper">
  <h1 class="splash-text">ehshots.</h1>
</div>

CSS

@-webkit-keyframes typing { from { width: 0; } }
@-webkit-keyframes blink-caret { 50% { border-color: #fff; } }

.splash-wrapper{
    height:100vh;
    width:100vw;
    position:absolute;
    left:0;
    top: 0;
    background-color: #000;
    display:flex;
    justify-content: center;
    align-items: center;
    z-index: 999;
}

h1.splash-text {
    color: #fff;
    font: 300% Montserrat;
    border-right: .1em solid black;
    width: 12.5em;
    width: 6.5ch;
    margin: 2em 1em;
    white-space: nowrap;
    overflow: hidden;
    -webkit-animation: typing 1.5s steps(20, end),
    blink-caret .75s step-end infinite alternate;
}

JS

setTimeout(function(){
 jQuery('.splash-wrapper').fadeOut("slow");
},3000);

https://codepen.io/marlxnw/pen/LYeJOEm

At the moment the loading screen comes again and again when I go to the start page.

Upvotes: 2

Views: 294

Answers (1)

Deranged_23
Deranged_23

Reputation: 41

Simpily you can save all users ip in session. When user opens your website check is this ip exist in session or not. If exist, it means it is not his first time in this website. Otherwise write this ip to session

Upvotes: 1

Related Questions