Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Christopher Paccione
Christopher Paccione
14,831 Points
Posted by Christopher Paccione
Christopher Paccione
14,831 Points

Drop-Up Menu?

I'm looking to create a menu that behaves exactly like the menu for the Ferrari website. http://auto.ferrari.com/en_EN/

It's the menu at the bottom of the slider the pulls-up. I found a tutorial on how to create one with pure CSS, but I need to have the sliding animation.

Can anyone point me in the right direction?

Thanks!

3 Answers

Wendell Pulsipher
Wendell Pulsipher
10,183 Points

you could always use the animate() method.. just select your element that you want to slide up and set the animation parameters: something like this

 $('.element_class').animate({
   height: "200px"
}, 500);

for more info on jQuery animations take a look here: http://api.jquery.com/animate/ keep in mind you'll need to include the jquery library for it to work

also if you ever need more one on one help, feel free to hit me up at https://www.codementor.io/thepulsiphyer

Christopher Paccione
Christopher Paccione
14,831 Points
Christopher Paccione
Christopher Paccione
14,831 Points

Wendell,

Thanks for the help. I decided to use a plugin because I had a deadline for the project. The project required a mega-menu that spanned the entire length of the navigation, and which had to animate up and down, because the nav was place in three different sections on the site.

I'll bookmark your link.

Thanks!

Chris

Wendell Pulsipher
Wendell Pulsipher
10,183 Points
Wendell Pulsipher
Wendell Pulsipher
10,183 Points

anytime Chris. That animate method can be used just as efficiently than having to download a plugin. Of course, either can be used to the same effect, but the animate method uses less code than a plugin does and you can make it work for your purposes just as easily. it's also easier to customize