CODEWITHSUNDEEP
javascriptjqueryslidetoggle
DRK
DRK

Reputation: 91

How do I make slidetoggle fire shortly after page load?

Let me preface this with the fact that I do not know JS so any help would be much appreciated.

I have a slide toggle that I want to open 3 seconds after the page loads. This is currently what I have for the slide toggle:

$(function(){
  // hide/show header
  $('#close-open-top a').bind('click', function() {
    if($('header:visible').length) {
      $('img', this).attr('src', 'img/open.png');
    } else {
      $('img', this).attr('src', 'img/close.png');
    }
    $('header').slideToggle('slow');

    return false;
  });

Currently it loads closed and when I click the arrow it drops open. I want it to automatically open 3 seconds after the page loads.

Upvotes: 1

Views: 1319

Answers (2)

L. Monty
L. Monty

Reputation: 882

Well, I think i didn't get you totally..but maybe I can help you

to get a delay use setTimeout like:

setTimeout(function(){ $('header').slideToggle('slow');
},3000);

so inside of the function you can put the code to be executed. The second parameter has to be chosem as the milliseconds you want to be waited before the function is called. If you want to do it automatically 3 seconds after Pageload use this:

$(document).ready(function(){
    setTimeout(function(){ $('header').slideToggle('slow');
    },3000);  
});

Upvotes: 1

nnnnnn
nnnnnn

Reputation: 150020

Try the following in your document ready:

$('header').delay(3000).slideToggle('slow');

The .delay() method delays subsequent items in the animation queue (note that you can't use it to delay non-animation methods).

Or if you want all of the code from your click handler to execute (including setting the image src) then the easiest thing is to trigger a click programmatically after a 3-second delay, so add the following to the end of your document ready handler (after the binding of the click handler):

setTimeout(function() { $('#close-open-top a').trigger('click'); }, 3000);

Upvotes: 2

Related Questions