Kwicks is a plugin providing sexy sliding panels with an emphasis on navigational interaction. Kwicks was originally a port of a MooTools effect (of the same name), but has since evolved into a highly configurable and versatile UI component. Please check out the examples to see it in action. New in v2.2.1 This is a patch release with no API changes, and is aimed at fixing a rare and sporadic bug that causes styles to not initialize properly. New in v2.2.0 Kwicks v2.2.0 is a substantial update that addresses several feature requests (keep them coming)! New events and a refactor of the existing events. Getting Started Dependencies Source Kwicks is available on GitHub. Markup Kwicks has pretty relaxed markup requirements: A container element with two classes: kwicks and kwicks-horizontal|vertical (depending on the orientation of this instance).A single level of nested "panel" elements. Unordered lists are a good semantic fit for most Kwicks use cases:

Animating Design Elements: 7 Unique & Creative Practices. Jul 15 2009 We saw different methods and techniques that truly speak to the designer’s capabilities and creativity. A great way to distinguish yourself from the crowd is to have a truly unique user interface. Although there are many possibilities, you should carefully plan each project on its own. Not all techniques provide a solution for everything. Some of them are very helpful and easy to implement, but some lack usability and simplicity. There are 7 creative practices featured below, from animated menus to scrollable content to hover effects. 1. . - Koodoz Koodoz has taken a truly unique approach to the top navigation menu. . - Unowhy The Unowhy has an impressive designed menu, when a visitor hovers over the menu item, additional information is displayed automatically in a very elegant way. - LeviKoi.

Advanced docking using jQuery. Some time ago I was doing some proof of concept: how Visual Studio docking functionality can be done with jQuery and unordered lists.

Basically, the main goal was to implement multiple docking and undocking functionality. This tutorial will show you the results of PoC. Download the example View live demo The requirements This is how docking should behave: PHATFUSION (moo.tools/javascript demos) N.Design - CSS Dock Menu. May 08, 2007 270 Comments Tags: Javascript If you are a big Mac fan, you will love this CSS dock menu.

It is using Jquery library and Fisheye component from Interface and some of my icons. It comes with two dock position: top and bottom. This CSS dock menu is perfect to add on to my iTheme. CSS dock menu screenshot Update: I no longer support the questons regard this dock menu. View Demo | Download 1. Download the CSS dock menu zip package. 2. In between the HTML <head> tag, add the following code The first part is the Javascript, second part is CSS stylesheet, and last part is the PNG hack for IE 6. 3. Don’t forget to add the following code to anywhere within the <body> tag: 4. To add menu item to the top dock (note: span tag is after the img tag): <a class="dock-item" href="#"><img src="images/home.png" alt="home" /><span>Home</span></a> To add menu item to the bottom dock (note: span tag is before the img tag): Browser Compatibility Design Process of The Phoenix Illustration Illustrator knowhow.

Guillermo Rauch’s Blog » CSS+Javascript power. Fancy menu. Let me introduce you to Fancy Menu: When it comes to creating the navigation part of your Website, the first thing you might think of is an unordered list that you style as tabs.

Lately, such navbars are everywhere, as many people believe they’ll make their site more Web 2.0-compatible. Personally, I just think they’re semantically better and accessible. In this article I’ll go through the creation of a custom navigation bar with some cute Javascript effects that will certainly impress your friends.