Tengo un menú desplegable echo con css y Jquery pero el menú se desplaza hacia abajo y yo quiero q se desplaza asía arriba me pueden ayudar? Este es el código q tengo
css
.menu { float:left; position:absolute; top:90% }
#menu > li { float:left; margin-left:30px; position:relative;clear:both}
#menu > li > a{ display:block; font:17px 'Asap', sans-serif; color:#fff; text-shadow:1px 1px rgba(0,0,0,.5)}
#menu > li > a:hover, #menu > .active > a{ }
.submenu_1{ position:absolute; top:30px; left:-30px; width:110px; background:rgba(51,51,51,0.8); padding:10px 0;}
.submenu_1 li{ position:relative;}
.submenu_1 span{ position: absolute; width:100%; height:100%; top:0; left:0; background:#fff}
.submenu_1 a{ display:block; font:14px 'Asap', sans-serif; line-height:30px; color:#f5dbfb; position:relative; text-align:left}
jquery
$('.submenu_1 span').css({opacity:0})
$('.submenu_1 li').hover(function(){
$(this).find('span').stop().animate({opacity:1})
}, function(){
$(this).find('span').stop().animate({opacity:0})
})
$('ul#menu').superfish({
delay: 600,
animation: {height:'show'},
speed: 600,
autoArrows: false,
dropShadows: false
});
html
<nav class="menu">
<ul id="menu">
<li class="with_ul"><a href="#!/page_Services"><img src="images/menu.png"> menu</a>
<ul class="submenu_1">
<li><span></span><a href="#!/page_About">Dobis eleifend</a></li>
<li><span></span><a href="#!/page_Catalogue">Ut wisi</a></li>
<li><span></span><a href="#!/page_Clients">Sadipscing</a></li>
<li><span></span><a href="#!/page_Contacts">Lorem ipsum</a></li>
</ul>
</li>
</ul>
</nav>
