Categories

Accordion (1) AfterEffects (1) Application (2) Automobile (1) Banking (1) Chrome (1) Cinema4D (2) Coding (2) Corel Draw (1) CSS (4) CSS3 (11) Design (2) Dropdown (1) Film (1) Finance (1) FinTech (1) Gateways (1) HTML (4) HTML5 (4) JavaScript (7) KDE (2) Layout (1) Login (1) LungoJs (1) Menu (3) Menubar (2) Movies (1) Navigation (2) Open Source (4) Panel (1) Payment (1) Photo Gallery (1) Photoshop (2) PHP (3) Production (1) Rekonq (2) Sony Vegas Pro (1) Startups (1) Taskware (1) Technology (1) Ticker (1) Validation (1) Website (3) XHTML (1)
Showing posts with label Menu. Show all posts
Showing posts with label Menu. Show all posts

Tuesday, February 14, 2012

Menu - A new way!!


Website menus has always been lists modified with a lot of CSS. We have seen vertical menus, horizontal menus, dropdown menus, etc. So this time I planned on something different. I made a circular menu where the sub menus appear as bearings around the main circle. This menu can be extended on all sides to include more sub menus. Check out the code. It will surely be interesting I hope!!

Download files:

Note: The code has been optimized for Mozilla. Add the -webkit- and -o- commands for running it on Chrome, Safari or Opera.

Monday, January 2, 2012

4 exciting forms of navigation

This is a collection of the four easiest and most used navigations used in todays world. The collection contains a horizontal navigation bar, a windows like menubar, a vertical menubar, and a tabular grid containing items. The menus has been styled with bright colours and varying transparencies.
The HTML markup of most of the menus is as simple as an unordered list. In the tabular grid, it has been arranged in a simple table. All the effects of a menu has been given using the CSS. So all the focus in this example should be on the CSS instead of the HTML markup. The markup can be changed anytime. I've used a few CSS3 transitions in here, to highlight the menu items on hover. The code for them has been written with only the -webkit- vendor prefix, so it will run fine in chrome and safari but not in opera and mozilla. You can add the vendor prefixes for them though!

Download source:

Friday, December 2, 2011

Windows like menubar using only CSS3

This menu has been created using CSS3 and HTML5. Its really simple and needs to be customized as per the needs. No JavaScript in whatsoever form has been used. This menu can be easily customized by editing the CSS file. One can change the font-size, the colors, the opacity and the fade in and fade out effects of the menu. With the use of the "transform" and "transition" tags of CSS, effects have become really simple. You can even put in animations by using the "keyframes" tag. May be I'll show it in a modified version later.
With the use of the '>' operator now you can make anything appear or disappear whenever you want. Various realtime appications can be noted down as Tooltips, Notifications, Menus, Tabs and much more.

Download link: