Rozwijane menu w Bok

[Kartofelek]

Tak nie rób. Jak chcesz zrobić tak jak w załączonej stronie (czyli menu rozwija się w dół), to lepiej zrób to z klikniem, bo będzie wygodniej.
Ogólnie lepie celuj w kliknięcia, bo któregoś dnia zaczniesz robić menuski dla telefonów i okaże się że nie masz kursora

Zrób mniej więcej tak:

JS - po kliknięciu na A sprawdzam czy tuż za nim jest lista (submenu). Jeżeli jest to do LI w którym jest ten link dodaje klasę show. Dzięki niej pokażę submenu

Kod:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
$('#menu a').on('click', function(e) {
   if ($(this).next('ul').lenght) {  
      e.preventDefault();
      $(this).parent().toggleClass('show');
   }
});
</script>

CSS:

Kod:

li ul {
max-height:0;
overflow:hidden;
-moz-transition:0.5s max-height
-webkit-transition:0.5s max-height
transition:0.5s max-height
}
li.show > ul {
max-height:600px;
}

No i dbaj o kod. czemu do linków A w #menu wrzuciłeś paragrafy?