Necesito crear una palanca que anime hacia arriba y no hacia abajo, en otras palabras, al revés de la palanca "normal". Quizás lo más simple es que la palanca debería deslizarse hacia arriba sobre el elemento del menú (es un menú) para hacerse visible en lugar de deslizarse hacia abajo como lo haría la barra deslizante normal, etc. Estoy casi allí con esto:

var opened = false;
$("#coltab li").click(function(){
    if(opened){
        $(this).children('ul').animate({"top": "+=300px"});
    } else {
        $(this).children('ul').animate({"top": "-=300px"});
    }
    $(this).children('ul').children().slideToggle('slow');
    $(this).children('ul').toggle();
    opened = opened ? false : true;
});

PERO si "alterna" un elemento ENTONCES otro elemento, el segundo elemento (desliza hacia abajo) cae 300px NO desliza hacia arriba (aumenta) 300px. Un buen ejemplo (odio el sitio) de lo que quiero lograr eshttp://market.weogeo.com/#/home y las "pestañas" en la parte inferior.

Mi código HTML está usando

<ul id="#coltab">
<li>Item 1
<ul>
<li>This bit needs to toggle up</li>
</ul>
</li>
<li>Item 2
<ul>
<li>This bit needs to toggle up</li>
</ul>
</li>
etc ...
</ul>

En el lado de CSS

ul#coltab { position: relative' blah; blah; }

y

ul#coltab  ul { display: none; position: absolute; blah; blah; }

¿Algunas ideas?

Sería bueno que cada "clic" cerrara el botón anterior antes de abrir el botón "clic".