jqueryIntroLoader demopage

simpleLoader Animation
exitFx:'slideUp', ease: "easeOutSine", style: 'fluoYellow', delayBefore: 1000, exitTime: 500, onBefore: function() {...}, onAfter: function() {...}

Back to Demos Index

See page code to learn more!

This element was hided bfore animation using "onBefore" option
and it was showed after animation using "onAfter" option

Animation description

simpleLoader Animation
effect:'slideUp', ease: "easeOutSine", style: 'fluoYellow', delayTime: 1000, animationTime: 500, onBefore: function() {...}, onAfter: function() {...} 

$("#element").introLoader({

    $("#element").introLoader({

        animation: {
            name: 'simpleLoader',
            options: {
                exitFx:'slideUp',
                ease: "easeOutSine",
                style: 'fluoYellow',
                delayBefore: 1000, //delay time in milliseconds
                exitTime: 500,
                onBefore: function() {
                    $('#onAfterExample').hide();
                },
                onAfter: function() {
                    $('#onAfterExample').fadeIn();
                }
            }
        },
        spinJs: {
            lines: 10, // The number of lines to draw
            length: 10, // The length of each line
            radius: 30, // The radius of the inner circle
            width: 8, // The line thickness
        }

    });

});