Question

I want the page to slide up a div (#splash) when it loads OR at any point, the mouse can be clicked to load the slide up. Heres my code which isn’t working

$(document).ready(function() {
    $(".fancybox").fancybox({
         openEffect : 'none',
         closeEffect    : 'none'
    });

    $("#splash").click(function(){
        $("#splash").slideUp(3000,"swing");
    });

    $("#splash").delay(2000).slideUp(3000,"swing");

});

I want it to slide up sorry. The splash is initially the size of the entire page. I want it to slide up on load after delay, or when I click it.

Currently the div only slides up after the 2000 delay, and not when it is clicked

Answer 1

The delay function prevents the slideUp in click to execute. Use setTimeout instead.

$(document).ready(function() {
    $("#splash").click(function(){
        $("#splash").slideUp(3000,"swing");
    });

    //Bad code: 
    //$("#splash").delay(5000).slideUp(3000,"swing");

    //Use setTimeOut 
    setTimeout(function (){$("#splash").slideUp(3000,"swing");} ,5000);

});

Working jsFiddle: http://jsfiddle.net/basarat/QXEVP/