Menu dynamique ou déroulant

Bonjour,

J'ai une longue liste à mettre dans un menu mais je ne voudrais pas qu'elle pparaisse toute entière. L'idéal serait qu'au passage de la souris le menu effectue un écartement pour faire apparaître ma liste (sous-menu).
voici un ex. :

<ul>
<li class="title">Menu 1</li>
<li class="group"><a href="#">Sous-menu 1</a></li>	
<li><a href="#">Lien1</a></li>
<li><a href="#">Lien2</a></li>
<li><a href="#">Lien3</a></li>
<li><a href="#">Lien4</a></li>     
   "       "                  "              "
<li><a href="#">Lien10</a></li>     
<li class="group"><a href="#">Sous-menu2</a></li>		
<li><a href="#">Lien5</a></li>
<li><a href="#">Lien6</a></li>
  "       "                  "              "
<li><a href="#">Lien10</a></li>
<li class="title">Menu 2</li>
<li class="group"><a href="#">LienA</a></li>		
<li class="group"><a href="#">LienB</a></li>		
</ul>

Pouvez-vous m'aider en m'indiquant le procédé à suivre ou un lien vers un article qui pourrait m'être utile (j'avais trouvé un lien pour des menus déroulants mais j'ai perdu l'adresse).
Merci d'avance