<script type="text/javascript">
$(function() {
   var $menu = $('#ldd_menu');
   $menu.children('li').each(function() {
     var $this = $(this);
     var $span = $this.children('span');
     $span.data('width', $span.width());
     $this.bind('mouseenter', function() {
       $menu.find('.ldd_submenu').stop(true, true).hide();
       $span.stop().animate({
         'width': '440px'
       }, 300, function() {
         $this.find('.ldd_submenu').slideDown(300);
       });
     }).bind('mouseleave', function() {
       $this.find('.ldd_submenu').stop(true, true).hide();
       $span.stop().animate({
         'width': $span.data('width') + 'px'
       }, 300);
     });
   });
    });
</script>

ul.ldd_menu{margin:0;padding:0;display:block;height:50px;background-color:#0051A1;list-style:none;font-family:"Trebuchet MS",sans-serif;border-top:1px solid #3474C6;border-bottom:1px solid #3474C6;border-left:10px solid #0051A1;-moz-box-shadow:0 3px 4px #007BC2;-webkit-box-shadow:0 3px 4px #007BC2;-box-shadow:0 3px 4px #007BC2}
ul.ldd_menu a{text-decoration:none}
ul.ldd_menu>li{float:left;position:relative}
ul.ldd_menu>li>span{float:left;color:#FFF;background-color:#0051A1;height:50px;line-height:50px;cursor:default;padding:0 20px;text-shadow:0 0 1px #FFF;border-right:1px solid #3474C6;border-left:1px solid #0049A1}
ul.ldd_menu .ldd_submenu{position:absolute;top:50px;width:480px;display:none;opacity:.9;left:0;font-size:10px;background:#0051A1;border-top:1px solid #3474C6;-moz-box-shadow:0 3px 4px #0051A1 inset;-webkit-box-shadow:0 3px 4px #0051A1 inset;-box-shadow:0 3px 4px #0051A1 inset}
a.ldd_subfoot{background-color:#F0F0F0;color:#444;display:block;clear:both;padding:15px 20px;text-transform:uppercase;font-family:Arial,serif;font-size:12px;text-shadow:0 0 1px #FFF;-moz-box-shadow:0 0 2px #777 inset;-webkit-box-shadow:0 0 2px #777 inset;-box-shadow:0 0 2px #777 inset}
ul.ldd_menu ul{list-style:none;float:left;border-left:1px solid #2A6DC3;margin:20px 0 10px 30px;padding:10px}
li.ldd_heading{font-family:Georgia,serif;font-size:13px;font-style:italic;color:#69C3FF;text-shadow:0 0 1px #B03E23;padding:0 0 10px 0}
ul.ldd_menu ul li a{font-family:Arial,serif;font-size:10px;line-height:20px;color:#FFF;padding:1px 3px}
ul.ldd_menu ul li a:hover{-moz-box-shadow:0 0 2px #2A6DC3;-webkit-box-shadow:0 0 2px #2A6DC3;box-shadow:0 0 2px #2A6DC3;background:#007BC2}

<ul id="ldd_menu" class="ldd_menu">
  <li>
    <span>Меню №1</span>
    <div class="ldd_submenu">
      <ul>
        <li class="ldd_heading">Заголовок №1</li>
        <li><a href="#">Ссылка №1</a></li>
        <li><a href="#">Ссылка №2</a></li>
        <li><a href="#">Ссылка №3</a></li>
        <li><a href="#">Ссылка №4</a></li>
        <li><a href="#">Ссылка №5</a></li>
      </ul>
      <ul>
        <li class="ldd_heading">Заголовок №2</li>
        <li><a href="#">Ссылка №1</a></li>
        <li><a href="#">Ссылка №2</a></li>
        <li><a href="#">Ссылка №3</a></li>
        <li><a href="#">Ссылка №4</a></li>
        <li><a href="#">Ссылка №5</a></li>
      </ul>
      <a class="ldd_subfoot" href="#"> + Еще ссылка</a>
    </div>
  </li>
  <li>
    <span>Меню №2</span>
    <div class="ldd_submenu">
      <ul>
        <li class="ldd_heading">Заголовок №1</li>
        <li><a href="#">Ссылка №1</a></li>
        <li><a href="#">Ссылка №2</a></li>
        <li><a href="#">Ссылка №3</a></li>
        <li><a href="#">Ссылка №4</a></li>
        <li><a href="#">Ссылка №5</a></li>
      </ul>
      <ul>
        <li class="ldd_heading">Заголовок №2</li>
        <li><a href="#">Ссылка №1</a></li>
        <li><a href="#">Ссылка №2</a></li>
        <li><a href="#">Ссылка №3</a></li>
        <li><a href="#">Ссылка №4</a></li>
        <li><a href="#">Ссылка №5</a></li>
      </ul>
      <ul>
        <li class="ldd_heading">Заголовок №3</li>
        <li><a href="#">Ссылка №1</a></li>
        <li><a href="#">Ссылка №2</a></li>
        <li><a href="#">Ссылка №3</a></li>
        <li><a href="#">Ссылка №4</a></li>
        <li><a href="#">Ссылка №5</a></li>
      </ul>
      <a class="ldd_subfoot" href="#"> + Еще ссылка</a>
    </div>
  </li>
  <li>
    <span>Меню №3</span>
    <div class="ldd_submenu">
      <ul>
        <li class="ldd_heading">Заголовок №1</li>
        <li><a href="#">Ссылка №1</a></li>
        <li><a href="#">Ссылка №2</a></li>
        <li><a href="#">Ссылка №3</a></li>
        <li><a href="#">Ссылка №4</a></li>
        <li><a href="#">Ссылка №5</a></li>
      </ul>
      <ul>
        <li class="ldd_heading">Заголовок №2</li>
        <li><a href="#">Ссылка №1</a></li>
        <li><a href="#">Ссылка №2</a></li>
        <li><a href="#">Ссылка №3</a></li>
        <li><a href="#">Ссылка №4</a></li>
        <li><a href="#">Ссылка №5</a></li>
      </ul>
      <ul>
        <li class="ldd_heading">Заголовок №3</li>
        <li><a href="#">Ссылка №1</a></li>
        <li><a href="#">Ссылка №2</a></li>
        <li><a href="#">Ссылка №3</a></li>
        <li><a href="#">Ссылка №4</a></li>
        <li><a href="#">Ссылка №5</a></li>
      </ul>
      <a class="ldd_subfoot" href="#"> + Еще ссылка</a>
    </div>
  </li>
</ul>