1

I have already created a splash screen using jquery's fadeOut option. It is working fine but the problem is the screen is loading every time I click to go to next page. I need splash screen only at startup. I think I need to use session or something but I am not able to find the solution. I am using following script.

 $(document).ready(function () {
 $("#splashscreen").click(function () {
    $("#splashscreen").fadeOut(2000); 
 });
 });
Vadim Kotov
  • 8,084
  • 8
  • 48
  • 62
get_coding
  • 27
  • 1
  • 9

4 Answers4

5

This should work:

$(document).ready(function () {
    if( $.cookie('splashscreen') == null ) { // Here you are checking if cookie is existing if not you are showing a splash screen and set a cookie
        $("#splashscreen").fadeIn();
        $.cookie("splashscreen", 1, { expires : 10 }); // cookie is valid for 10 days
    }
    $("#splashscreen").click(function () {
        $("#splashscreen").fadeOut(2000); 
    });
});
MozzieMD
  • 355
  • 2
  • 12
Tomasz
  • 4,847
  • 2
  • 32
  • 41
0

You can set cookie and check for it when page refreshes. I suggest you to use library like this:

https://github.com/js-cookie/js-cookie

DominikD
  • 56
  • 2
0

One option is to handle this in PHP, but you also can use the local storage in JS. Here is a related Topic: How to set session variable in jquery?

Community
  • 1
  • 1
jar3d
  • 105
  • 9
0

Yes, you can use a session for this. on the first line of your code add <?php session_start();

Now, later in your code, you can do:

if(!$_SESSION['splash'])
{
    $_SESSION['splash'] = true;

    //echo your splash code here
}
Roboroads
  • 1,602
  • 1
  • 13
  • 24