<style type="text/css">
   #menuprincipal ul {margin:0px; padding:0px; list-style:none;}
   #menuprincipal ul li {float:left; padding:3px;}
 
   #submenu {display:none; position:fixed;}
   #submenu li a {display:block; _position:absolute; }
   #submenu li {float:none !important;}
</style>

<script type="text/javascript">
   function muestra(id)
      {
         document.getElementById(id).style.display='block';
      }
 
   function oculta(id)
      {
         document.getElementById(id).style.display='none';
      }
</script>

<div id="menuprincipal">
<ul class="menu">
	<li>La bodega</li>
	<li>Valdepenas</li>
	<li onMouseOver="javascript:muestra('submenu');" onMouseOut="javascript:oculta('submenu');">
		Nuestros vinos
		<ul id="submenu" onMouseOut="javascript:oculta('submenu');">
			<li><a href="#">Vinos tintos</a></li>
			<li><a href="#">Vinos blancos</a></li>
			<li><a href="#">Mostos</a></li>
		</ul>
	</li>
	<li>Visitas y Cartas</li>
	<li>Area infantil</li>
	<li>Dominacion de origen</li>
	<li>Contacto</li>
</ul>
</div>

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>

<script type="text/javascript">
$(document).ready(function() {
   // Obtener la posicion del elemento menu(izquierda y arriba)
   var posicion = $('#menu').offset();
   // Poner la misma posicion horizontal.
   $('#submenu').css('left',posicion.left);
   // Poner la misma posicion +20px vertical
   $('#submenu').css('top',posicion.top+20);
});
</script>
 

#submenu {position:fixed;}