Darren Head
Darren Head

Reputation: 67

Hide Menu using jQuery

Im new to jQuery and need a litte help.

I have created a nav menu that I want to completely disappear upwards after "3 seconds" once a user lands on the page. From this an arrow will be in its place hiding the original nav menu.

When a user clicks on the "arrow" the menu will come back into view and stay there for now 20 seconds.

I have some code in this jsFiddle but it doesn't seem to be doing anything. Can anyone help out there?

http://jsfiddle.net/headex/AsjMz/1/

Any info passed on will be much appreciated.

Cheers

Upvotes: 1

Views: 405

Answers (4)

Jeremy Roberts
Jeremy Roberts

Reputation: 821

You had a few errors with your JS. setTimeout requires a function callback, not a string. You also used $(nav) instead of $("#nav")

http://jsfiddle.net/AsjMz/9/

Upvotes: 0

fourcube
fourcube

Reputation: 9

You have to use the correct selectors for your <div/> Elements and supply the MenuOut() Function as an object, not a string.

$(function() {
    setTimeout(MenuOut /*don't supply this parameter as a string*/, 3000); /* 3000 represent 3000 milliseconds, so 3 seconds */
});

function MenuOut() { /* The sample code I put on top */
    $('#nav'/*it's an id (#), here you have to use a string*/).slideUp();
}

Upvotes: 1

bvulaj
bvulaj

Reputation: 5123

Instead of using animate, look at using jQuery's slideUp and slideDown.

You'll want to animate like so: setTimeout("$('#nav').slideUp()", 3000);

Upvotes: 0

Jorge
Jorge

Reputation: 18237

The error in your live example it's that you're passing the name of the function to the setTimeOut function with "" in other words

you have this

  setTimeout("MenuOut", 3000);

Change for this

  setTimeout(MenuOut, 3000);

Here's your live example with that change Demo

Upvotes: 0

Related Questions