怎么鼠标放置在菜单栏时在鼠标位置显示事先隐藏的列表(自动调整隐藏菜单的高度)

$(function() {
           $("#showMore").hide();
         $("#more").mouseover(function(){
            $("#showMore").show();
            var h = $("#showMore").height();
               var x = $("#more").offset().top;
               var y = $("#show").height();
               if ((h + x)> y) {
                   $("#showMore").css("top",(x - h - 24));
               }  else {
                   $("#showMore").css("top",x - 69);
               }
        });
        $("#more").mouseout(function(){
            $("#showMore").hide();
        });

<div id="show">

<div id="showFirst">
       <li ><button>xxxx</button></li>
       <li ><button id="more">更多</button></li>
   </div>
   <div id="showMore">
          <li><button>XXXX</button></li> 
         <li><button>XXXX</button></li> 
   </div>

</div>