DevSnippets » Sliding Door

jQuery tabs made easy

tdomf_661f8 — Thu, 25 Jun 2009 20:33:11 +0000

Most of the jQuery based tabs out there have a lot of functionalities to fulfill everything you need, but they ended up being quite large, bloated and complex. This small jQuery-dependant code creates an easy and lightweight tabs widget.

(mb)buttons Just great buttons

pupunzi — Wed, 29 Apr 2009 04:08:50 +0000

Build your own custom buttons easily just with CSS using the sliding doors technique!

Bulletproof CSS Sliding Doors Menus

tdomf_661f8 — Sat, 04 Apr 2009 18:16:31 +0000

The most robust and flexible CSS Menus ever made with CSS Sliding Doors technique. Completely cross-browser and no-hacks. Tested on all browser, even IE6.

Uber Round Color Tabs

ddrive — Mon, 03 Nov 2008 18:53:57 +0000

Uber Round Color Tabs is a solid colored CSS menu with tabs that are well rounded on each side. Thanks to two transparent gifs used to create the corners, the tabs can be customized to any desired color using CSS color values alone.

Animated horizontal tabs

ddrive — Tue, 26 Aug 2008 19:31:00 +0000

These sliding doors based blue tinted tabs “jump up” when selected, such as when the mouse rolls over each one. This is accomplished using a combination of relative positioning and padding on each tab. The selected tab is first stretched vertically by giving it a thick bottom padding, then plucked out thanks to the CSS “top” property value that’s smaller than the normal tabs’. The result are tabs that animate without any scripting.

CSS Sliding Door using only 1 image

kailoon — Wed, 13 Aug 2008 18:21:53 +0000

I found that it is not user friendly and also need more CSS coding. Besides, it is increasing the processing time and bandwidth in loading a site.

Simple Tabbing System

tdomf_661f8 — Wed, 13 Aug 2008 18:17:44 +0000

Today, we are going to learn how to create simple tabbing system. It is a very common technique nowadays. Especially for those magazine site, news or blogs that contain a lot of sections or contents.