jquery - 滑动菜单，同步滑动内容jquery

Question

您好，我用 jquery 构建了一个简单的下拉菜单，可以在 http://testsiteproject.bugs3.com/

当我点击顶部的灰色按钮时，我的问题出现了，我还希望黑色按钮跟随菜单向下移动，而不是在 div 已经向下滑动之后出现。有办法实现吗？

<div id="topMenu">
<div id="top-top"></div>
<a href='javascript:slideMenuUp();'>
<div id="top-bottom"></div>
</a>
</div>

我说它应该向下滑动“topMenu”，其中包括“top-top”和“top-bottom”。但它只会“从上到下”滑动。

function slideMenu(){
    if ($("#topMenu").is(":hidden")) {
        $("#topMenu").slideDown("slow");
    } else {
        $("#topMenu").hide();
    }
}

Answer 1

如果您尝试将整个 #topMenu div 定位在屏幕之外(顶部值为负)，然后在 top 属性而不是 slideDown 上设置动画会怎样。

我的意思的快速模型:

fiddle :
http://jsfiddle.net/vLeyF/

JS:

$("#topMenu").animate({top: 0}, "slow");

然后从这里你可以动画回到你之前拥有的任何 top 属性等。但是，看看 Spokey 的回答，你可能仍然需要做那部分(switch #top-bottom 从 position:absolute 到 position:relative。