Dr. Web Weblog » Blog-Archiv » Collection of Web 2.0 Navigation Menus Webdesign Javascript Wallpaper Icons Fonts WordPress Fotografie Photoshop Ein Kommentar? Wir freuen uns immer über Leser, die durch nützliche und konstruktive Beiträge zum Thema eine Diskussion anstoßen oder den Artikel mit weiteren Informationen anreichern. Sponsoren Anzeigen Am Ball bleiben Letzte Kommentare Dieter Petereit bei WebPutty – CSS-Liveeditor zum Selberhosten erleichtert das Seitendesign Martin Helmut Fieber bei WebPutty – CSS-Liveeditor zum Selberhosten erleichtert das Seitendesign WebPutty – CSS-Liveeditor zum Selberhosten erleichtert das Seitendesign - Dr. daniel bei PixEden: Hochwertige Templates, Icons und noch mehr – alles kostenlos Bildschirmfüllendes Bild mit css | collected work bei 100% Hintergrundbild im Browser Cinella bei ZenPhoto – Einfache Galeriesoftware Rubriken E-Mail Google iPhone eBooks Tutorials Usability Flash eCommerce Interviews Drupal Lexikon jQuery Projektmanagement Recht Ressourcen Software Statistiken Links Job Board Noupe Design Magazine Smashing Book #3 Smashing eBooks Kontakt
How to Create a Drop-down Nav Menu With HTML5, CSS3 and JQuery In this tutorial, we’ll take a look and see what we can achieve with HTML5 and CSS3 when it comes to the staple of current web sites: the humble drop-down navigation menu. We’ll also use jQuery to handle the effects and add the finishing touches for us. HTML5 brings to the spec a dedicated <nav> element that should be used as the container for any major navigation structure, such as the main vertical or horizontal site navigation menus, or an in-page table of contents for example. Using CSS3 we can do away with what would have required the use of several background images and possibly an additional wrapping container or two and rely (almost) purely on some of the new style properties, such as rounded corners and drop-shadows for example, that are available to supporting browsers. Step 1. Create a project folder for the files we’ll create somewhere on your machine and call it nav, inside this folder create three new folders; one called js, one called css and one called fallback. Step 3.
Past Issues - UI Design Newsletter 80% of usability is Navigation. That's what the gurus tell us. If you get the navigation right it seems almost guaranteed that users will be able to find what they are looking for on your application or site. (Note that this begs the question of whether they will look for what they can find.) But getting the navigation right is not that easy. First, there is the grouping of the menu elements. There are also decisions about the visual presentation and typography of the menus or navigation system. If you are building an application, there is one more decision: should the menus be static or should they have some selection support. Menus with selection support offer users faster access to frequently used functions. Well designed selection-support menus facilitate learning for new users by offering a staged, guided path to support the discovery of available functions and useful resources.
100+ Excellent jQuery Plugins for Navigation and Menus After the successful publish of our post 100 jQuery Plugins for Image Galleries with Source Files, many people demanded jQuery Plugins that are currently being used for Navigation & Menus, so here is another most useful and important post. Now this time we have collected jQuery Plugins for Navigation and Menus. Hope like the previous post you will also feel it useful and important post. 1. Nice and beautiful jQuery plugin having impressive features like, Full cross-browser compatibility, Fully accessible even when javascript is turned off, as a pure css menu, Search engines optimized, Clear unordered list (LI and UL HTML tags) structure of jQuery menu, Easy to setup and update, Fantastic animation and transition effects, Multiple pre-designed color schemes, Completely customizable styling with CSS, Powered by jQuery, Extremely small – 3kb uncompressed. 2. Urban Gray Accordion Menu is a clean, vertical menu with headers that are activated “mouseover” (200 millisec delay). 3. 4. 5. 6. 7.
stu nicholls | CSS PLaY | a definition list menu Pre 2006 copyright © stu nicholls - CSS play Information This menu is just a definition list with styling. I know that I have advocated not using list for menus, but that was before I had fully investigated the alternatives. I still disagree with the use of unordered lists but I will concede that definition lists are a better way to go. With definition lists you have the option of two different methods of use (maybe three). use the 'dt' for the navigation title and the 'dd' for the navigation links - as my menu aboveuse the 'dt' for the navigation links and the 'dd' to elaborate on each link.use the 'dt' for the navigation links and the 'dd' to elaborate on each link and place further links within the 'dd' text if appropriate. This allows definition lists to be much more flexible than unordered lists and gives more 'layers for styling. Copyright You may use this method on your personal 'non-profit' web site without seeking my permission.
38 jQuery And CSS Drop Down Multi Level Menu Solutions Hello again, it’s time for the comprehensive programming article. Here you’ll find 38 mainly CSS and jQuery dropdown menu or just multi level menus with downloadable files and explanations as well. Mostly they are free. My favorite here is the first pick – Outside the box with a very unique navigation menu (free) and Mega Menu, which is premium. It’s always good to have such reference articles in your bookmarks and when you have to create some really big website with a lot of content and menu sections – just return here. Oh..and little tip – shorten your developing process with already premade menus, which can be easily modified with a little touch of CSS. Table of Contents: Are The Best jQuery Dropdown Menu Solutions Free? But well, also be aware when each code has been created, has it got some updates through time? At least I am doing my designing process like this – What has been your experience? And while you are figuring answers – enjoy this quality article! Wait but before..here is.. 1.
Linkin Tips, une infobulle riche - Creative Juiz, Plugins jQuery À quoi sert-il ? Ce plugin vous permet de personnaliser vos infobulles en les rendant plus sexy !Rien de nouveau a priori.Et bien si, puisqu'en plus elles vont vous permettre d'afficher un lien, qui peut posséder lui-même une infobulle (mais pas stylée celle-là), en partant de l'attribut title d'un élément. Voir la démonstration Par exemple, la deuxième image de la démonstration possède comme title : "Le chocolat qui vous sourit, aller à la page pour pouvoir en apprendre plus sur le chocolat".Tout ce qui se trouve après "aller à la page" sera transformé en lien, et ce qui se trouve après "pour pouvoir" en title de ce lien.Tout ceci est personnalisable dans les paramètres du plugin. L'important est qu'au final, même avec javascript désactivé vos titres gardent un sens ! Utilisation Ce type d'outil est très simple à mettre en place puisqu'il s'agit d'un plugin de la bibliothèque jQuery. Chargez le fichier des styles du plugin. Personnalisation
Créer un menu déroulant “accordéon” avec jQuery Les Styles CSS Pour commencer, nous allons utiliser les styles CSS pour rendre le menu un peu plus sexy. Voici les styles utilisés dans l'exemple : Hop, c'est déjà nettement plus agréable à regarder, pas vrai ? Évidemment, il reste quelques bugs à corriger sous IE6 et consorts, mais ce n'est pas l'objet de ce tutoriel ... débrouillez-vous ;) Et si vous voulez savoir à quoi sert la classe "open", continuez à lire !