(function( $ ){

  $.fn.dropdownMenu = function(speed) {
  
    // there's no need to do $(this) because
    // "this" is already a jquery object

    // $(this) would be the same as $($('#element'));

var menu, menuHeight, menuWidth;
var number=0;

$(this).children("li").children('ul').hide();

$(this).children("li").hover(
  function () {
    menu = $(this).children('ul:eq(0)');
	if(menu.length != 0){
	$(menu).addClass('menu1');
	menuHeight= menu.outerHeight();
	menuWidth= menu.outerWidth();
   $(menu).show();

$(menu).wrap('<span class="menulistwrapper" />');

$('.menu1').css({'position':'absolute','margin-top':0});

$('.menulistwrapper').css({
'position':'absolute',
'display':'block',
//'height':menuHeight,
'width':menuWidth,
'overflow':'hidden'
 });

$(menu).css({'margin-top': -menuHeight});
  $(menu).clearQueue();

 $('.menulistwrapper').animate({
    height: menuHeight}, speed);


 $(menu).animate({
    marginTop: 0
  }, speed);
	}

  }, 
  
  function () {
    $(menu).clearQueue();

   $(menu).animate({
    marginTop: -menuHeight }, speed);
  
     $('.menulistwrapper').animate({
    height: 0}, speed);
  
 $(menu).queue(function () {
 $(this).css({ display: 'none'}); $(this).unwrap();
 $(this).dequeue();
  });

 }
);
	 


  };
})( jQuery );
