2008-11-15 7 views
1

Juste remarqué que le style du menu de navigation sur windows.com est exactement ce dont j'ai besoin pour mon site web. Je me demande comment créer ce genre de liste déroulante qui a plusieurs colonnes. Lorsque la souris survole sur chaque élément, la colonne donne un aperçu de cet élément. Je vous remercie.ASP.NET Créer un style de menu nav comme windows.com

Répondre

2

Le menu est en fait un DIV qui s'affiche au-dessus de l'autre contenu lorsque vous passez la souris sur l'élément de menu. Au fur et à mesure que vous passez la souris sur les éléments du menu, il appelle un javascript pour changer l'image qui s'affiche sur le côté droit. Voir la source dans votre navigateur Web et recherchez le menu du produit. Si vous avez Firefox avec Firebug ou le plugin développeur Web, vous devriez être capable de regarder le javascript qui gère le changement d'image.

0

Whoa. Quand ont-ils fait ça?

Microsoft a utilisé une bibliothèque native AJAX pour cela. Je ne sais pas si c'est la bibliothèque ASP.Net AJAX ou quelque chose d'interne qu'ils ont construit à dessein.

Tvanfosson en a assez bien résumé la majeure partie. Le premier menu est un tag <ul>, avec chaque élément <li> enfant contenant une balise imbriquée <span>. Cette balise sera celle utilisée pour identifier l'élément de menu de niveau supérieur sur lequel votre souris survole.

Effectuez une recherche dans le code source et vous trouverez:

<!-- BEGIN: Products Menu --> 

C'est le meilleur exemple de l'effet que vous êtes après. Comme précédemment répondu, c'est un élément qui contient une autre liste non ordonnée. Chaque listitem contient un lien dont l'événement mouseover modifie l'image et le texte qui apparaissent séparément. Vous pouvez voir cette zone si vous recherchez

<div id="PageWrapper" class="HomePage"> 

Quelques bonnes ressources pour commencer serait:

0

Le système menuing Microsoft ne semble pas être un système de menu qui mienne à mon goût ... à comment il rend (ou vraiment, comment il ne rend pas) dans FireFox.

+0

Vous voulez dire comment il apparaît derrière les choses Silverlight? –

+0

Oui, et il perd également par intermittence les options de menu (Accueil, Produits, Acheter ...) pour moi avec FF 3.0.4. –

0

Le menu microsoft.com ne fonctionne pas non plus sur Chrome ou Safari, mais je doute que Microsoft s'en soucie.

Questions connexes