Plugins/Modules / Support System (depraced!) > The Apple.com navigation menu created using only CSS3 - Free

The Apple.com navigation menu created using only CSS3 - Free


Date: 9 July 2011 | Posted by: Src
The Apple.com navigation menu created using only CSS3 - Free


Demo:
http://9.bb/286885/1944-demo-apple-menu


Source URL:
http://www.marcofolio.net/css/the_apple.com_navigation_menu_created_using_only_css3.html


A while ago (I think it was around the release of the iPad), the Apple.com website got a new navigation menu on the top of the page. This menu bar was a lot darker than the previous, grey version, but looks just as great. One thing which I noticed about the navigation, is that the buttons are created out of images. That's the moment I thought we could do better, using some nifty CSS3 techniques. So today, I present you the Apple.com navigation menu created using only CSS3.

Since this demo heavily relies on CSS3, make sure you view it using a CSS3 compatible browser. The Webkit browsers (Safari and Chrome) display the effect the best, followed by the latest version of Firefox. Opera and IE don't display everything correct, but the menu seems to be working.
Demo Apple.com CSS3 menu Download Apple.com CSS3 menu

The menu on the Apple.com website also updated their search suggestion, which hasn't been implemented in this demo (yet), but I might create that later. For now, let's check out all the CSS3 you'll need to be able to create this fancy looking navigation menu.
See full article