jquery效果

<div class="ToolItem"
     onmouseover="javascript:this.className='ToolItemOver';"
     onclick = "sendDoctmark(this);"
     onmouseout="javascript:this.className='ToolItem';"
     >
     <div class="ToolItemImage">
      <img src="<c:url value="/images/send.png"></c:url>" />
     </div>
     <div class="ToolItemText">
      医嘱发送
     </div>
          
  </div>
  <div id="buttonmenu" class="MenuItem"  style="display:none;border: solid 1px;background-color:#FFFFFF;width:100px;height:150px;position: absolute;z-index:2;">
        <div onclick="sendDoctmarkAjax(1)" style="line-height:23px;padding-left:10px;">发送本组</div>
        <div onclick="sendDoctmarkAjax(2)" style="line-height:23px;padding-left:10px;">全部发送</div>
        <div onclick="sendDoctmarkAjax(3)" style="line-height:23px;padding-left:10px;">发送长嘱</div>
        <div onclick="sendDoctmarkAjax(4)" style="line-height:23px;padding-left:10px;">发送临嘱</div>
        <div onclick="sendDoctmarkAjax(5)" style="line-height:23px;padding-left:10px;">发送中医医嘱</div>
        <div onclick="sendDoctmarkAjax(6)" style="line-height:23px;padding-left:10px;">发送出院带药</div>
        <iframe class="MaskIframe" frameborder="0" style="HEIGHT:100%"></iframe>
  </div>

 

function sendDoctmark(sender){
 var s = $(sender);
 var position = s.position();
    var t = position.top;
    var l = position.left;
    var height = s.height();
    $('#buttonmenu').show().css({left:l,top:(t+height)});
    $('#buttonmenu > div').bind({
     mouseover:function(){$(this).css({background:"gray"});},
     mouseout:function(){$(this).css({background:"#ffffff"});}
    });  
    $('#buttonmenu').mouseleave(function(){$(this).hide();});
}

----------------------------------------------------------------------效果图如下