drop right menu

Je suis à la recherche d'un menu déroulant, pas de menu déroulant. Sur la base de liste des listes, ex htmldrop right menu

<ul> 
<li> item1 
<li> fold1 <ul><li> fold1it1 <li> fold1it2 </ul> 
<li> item2 
<li> fold2 <ul><li> fold2it1 <li> fold2it2 </ul> 
</ul>

Lorsque vous mousover fold1, il se développerait à droite à droite (drop droite)

item1 
fold1 fold1it1 fold1it2 fold2it3 
item2 
fold2

Je cherche vraiment simple à comprendre par exemple css, ou un certain type de plugin jquery Merci

Source

2009-11-12 undef

Vous voudrez peut-être regarder fgmenu du Groupe des filaments. Fonctionne avec les thèmes de l'interface utilisateur jQuery, en particulier les menus déroulants. Il apparaît également que future work sur les menus de l'interface utilisateur jQuery sera basé sur ce travail.

Source

2009-11-12 22:46:43 tvanfosson

Merci, mais ce n'est pas ce que je cherche, il tombe vers le bas (à droite puis vers le bas, toujours vers le bas, je veux juste droite). – undef

Je pense que j'ai tout compris, je vais prendre encore des suggestions

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html><head> 
<style type="text/css"> 
.dropRight { 
    border: 1px solid red; 
    display:block; 
} 

.dropRight ul, .dropRight li { 
    margin:0 0 0 0; 
    padding:0 0 0 0; 
} 

.dropRight ul li:hover , .dropRight ul li a:hover { 
    background: #dddddd; 
} 
.dropRight ul { 
    list-style-type: none; 
    display: inline-block; 
} 

/* sub lists hidden by default */ 
.dropRight ul ul { 
    visibility: hidden; 
    display: none; 
} 

/* show the sub lists (children) */ 
.dropRight ul li:hover >ul { 
    visibility: visible; 
    background:yellow; 
    display: inline-block; 
} 

/* sub list items drop right, not down */ 
.dropRight ul ul li { 
    position: relative; 
    float: left; 
} 

</style> 
</head><body> 
<div class="dropRight"> 
<ul> 
<li> item1 
<li> <a href="#">fold1</a> 
    <ul> 
    <li> fold1it1 
    <li> fold1it2 
    <li> <a href="#">fold1it3</a> 
    </ul> 
<li> item2 
<li> <a href="#">fold2</a> 
    <ul> 
    <li> fold2it1 
    <li> fold2it2 
    <li> <span title="The Impossible Fold">fold2it3fold1</span> 
    <ul> 
    <li> fold2it3fold1it1 
    <li> fold2it3fold1it2 
    </ul> 
    <li> <a href="#" title="messed up">fold2it3fold2</span> 
    <ul> 
    <li> fold2it3fold2it1 
    <li> fold2it3fold2it2 
    </ul> 
    </ul> 
</ul> 
</div> 
</body></html>

Source

2009-11-13 01:32:02 undef

drop right menu

Répondre

Questions connexes