Animated Glossy CSS3 Navigation Menu

Kushagra Agarwal

• 26072
• 19
• 1

Two level pure CSS3 navigation menu based on the jQuery powered menu originally created by James Kyle. The second level of this navigation menu is animated using the keyframes property because it was kinda impossible to get the same effect using the transitions property. This will work in all the major browsers except Internet Explorer because of the excessive use of CSS3 properties.

The gloss effects on the menu is achived using linear gradient as the background and the 3D effect is achieved using multiple box-shadow and border. Feel free to check out the code below.

Related:

• CSS Only Solar System Model
• Minions in pure CSS
• Multiple Box Shadows
• Clicking Game
• CSS3 Room