Nedrullningsmeny 30 + Användbara skript för att förbättra rubriknavigering

Rullgardinsmenyn (även kallad rullgardinsmeny) är en viktig del i de flesta webbdesign. Det spelar en viktig roll i skapandet av en effektiv och användarvänlig webbplats. Det är en bra lösning att trimma ner lång meny som överväger skärmutrymmet och får dem att visas i en mer organiserad kategori-underkategori mönster.

I denna artikel vill vi visa dig några av de bästa rullgardinsmenyskript vi kommer att veta. Dessa rullgardinsmenyer varierar från CSS endast, CSS & Javascripts och meny som kommer att fungera med ditt nuvarande Javascript-bibliotek som jQuery, MooTools och Prototyp. Hela listan efter hopp.

Här är några relaterade artiklar vi ansåg att du kanske är intresserad av:

Bygga HTML-tabeller
Startpaket för webbdesigners
CSS Tab-baserade navigeringsskript

CSS (endast)

Om du är orolig för att Javascript är avaktiverat på klientens webbläsare, kommer den här css-only rullgardinsmenyn inte att misslyckas.

CSS Drop-Down Meny Framework. Titel säger allt. Det är en ram som släpptes under GNU General Public License. Korsa webbläsarkompatibel, lätt och lätt omformbar för att efterlikna många befintliga menyer där du kan. Till exempel Flickr, Adobe och MTV.com.

Enbart CSS-rullgardinsmenyn

CSS Express Drop-Down Menyer. Hjälp dig att skapa en snabb (uttrycklig) CSS-rullgardinsmeny utan några av de begränsningar som finns i några andra "ren" CSS-menyer.

CSS + Javascripts

Med hjälp av Javascript, rullgardinsmenyn är mer interaktiva eller åtminstone får de lite subtil animering som förbättrar användarupplevelsen. CSS å andra sidan, se till att utseendet är lätt cuztomizable.

Alla nivåer Navigationsmeny (v2.2). CSS / HTML listbaserad meny med stöd för oändliga nivåer av undermenyer. Den är lätt och lätt att implementera.

Drop Down Tabs (5 stilar). Drop Down-flikar är en horisontell CSS-flikmeny som stöder en nedrullningsmeny på andra nivå för varje flik. Kommer i 5 olika stilar.

Chrome CSS Drop Down-menyn. Chrome-menyn är en CSS- och JavaScript-hybridmeny. Det är lätt att konfigurera och sökmotorvänliga. Huvud menyraden består av en CSS-lista, medan nedrullningsmenyerna helt enkelt är vanliga DIV-taggar på sidan.

jQuerys

Om du har implementerat jQuery Javascript-bibliotek på din webbplats, här är några riktigt coola jQuery-baserade nedrullningsmenyer du borde veta.

Glatt navigeringsmeny . Smidig navigationsmeny är en CSS-baserad meny med flera nivåer, som drivs med jQuery, vilket gör webbplatsnavigering till en smidig affär. Här är en annan liknande - jQuery Multi Level CSS Menu.

Super. Superfish är ett förstärkt plugin för suckerfish-stil meny jQuery som tar en existerande ren CSS-rullgardinsmeny (så det bryts graciöst utan JavaScript). [Demo | Ladda ner]

Mega Drop-Down Menu. En rullgardinsmeny som rymmer mer än bara en ny länk. Det gör också grupplänkar och gör nagivation mycket enklare! [Demo]

MooTools

JavaScript-rullgardinsmeny med Mootools. Lätt, diskret sätt att skapa en rullgardinsmeny med Mootools 1.2. [Demo | Ladda ner]

UvumiTools Dropdown Menu. Enkel multi-level meny byggd från en HTML unorderd lista, med Mootools Javascript Framework.

Unobstrusive Mootool Drop Down Menu

härmar

Designa Digg Header. Steg för steg handledning om hur man bygger en rullgardinsmeny som verkligen ser ut som Diggs. [Demo | Ladda ner]

Blandat.

izzyMenu. Skapa professionella CSS-menyer för din webbplats online, utan att skriva en enda kod eller använd bara några av de färdiga.

PureCSS-menyn. Gratis CSS Drop Down Menygenerator