Clear splashscreen after click

[Jerome2606]

Hi,

Thanks for your script, it's simply great ! I want that when user click on splashscreen, it disappears. In this purpose, I load the splashscreen as below:

$.SplashScreen({
        timeToFade: 1000, // in milliseconds (eg: 1000 = 1sec)
        timeOut: 10000   // in milliseconds (eg: 2000 = 2sec)
    });

    //todo: click ne marche pas
    $('#splashscreen').click(function () {
        $('#splashscreen').fade("fast", 0);
    });

this gives that click make splashscreen disappear but after the timeout of 10 seconds, the splashscreen come back and never disappear. This is cause by a toggle fade i think. So how can I clear the timeout manually ? Or how to make that after 10 seconds the fade is to opacity 0 even if current opacity is already 0 ?

Best regards,

[Jerome2606]

My workaround for this: replace jquery.SplashScreen.js line 74:

if (c === totalImages) {
                        setTimeout(function () { return pageLoadCompleted() }, settings.timeOut);
                    }

by

if (c === totalImages) {
                        var element = document.getElementById(settings.id);
                        element.IntervalPageCompleted = setTimeout(function () { return pageLoadCompleted() }, settings.timeOut);
                    }

then in my function for the click, I clear this timeout like that:

$('#splashscreen').click(function () {
        var element = document.getElementById('splashscreen');
        clearTimeout(element.IntervalPageCompleted);
        $('#splashscreen').fadeTo("fast", 0);
    });

I'll try to write a pull request for this: https://github.com/smenonk/SplashScreen/pull/2

[Jerome2606]

I add that after a few test, I modified my call to (splashscreen div is by default display:none;):

if (sessionStorage.splashShowed !== "ok") {
        $('#splashscreen').css('display', 'block');
        $.SplashScreen({
            timeToFade: 1000, // in milliseconds (eg: 1000 = 1sec)
            timeOut: 10000 // in milliseconds (eg: 2000 = 2sec)
        });
        sessionStorage.splashShowed = "ok";
    } else {
        $('#splashscreen').css('opacity', '0');
        $('#splashscreen').css('z-index', '-100');
    }
    $('#splashscreen').unbind('click');
    $('#splashscreen').click(function () {
        var element = document.getElementById('splashscreen');
        clearTimeout(element.IntervalPageCompleted);
        $('#splashscreen').fadeTo("fast", 0);
        $('#splashscreen').css('z-index', '-100');
    });