javascript - jQuery - 隐藏 div，然后单击时显示

Question

所以我有一个 div，我想在单击箭头时从另一个 div 后面滑落 - 然后在单击表单按钮后再次隐藏。我可以编写大部分代码，但是我不明白如何从 View 中隐藏 div，然后使用 slipToggle 将其下拉。

编辑:按照下面的人的建议(谢谢)，事实证明 SlideToggle() 不是我需要的，而是 animate() - 下面的代码似乎不起作用，我添加了一个链接jQuery UI 但仍然什么也没有。

HTML

    <div class="schedule">
        <div class="scheduletop">
            <a href="/"><img src="/images/audit.png"></a>
        </div><!-- .scheduletop -->
        <div class="schedulebottom">
            <?php echo do_shortcode("[contact-form-7 id='61' title='Audit']"); ?>
        </div><!-- .schedulebutton -->
        <div class="thestuff">
            <h3>TEST!</h3>
        <div class="slide">
            CLICK TEST TO SLIDE
        </div><!-- .slide -->
        </div><!-- .thestuff -->
    </div><!-- .schedule -->

jQuery

$(document).ready(function() {
$(".slide").click(function() {
        $(".thestuff").animate({"down": "150px"}, "slow");
    });
});

有什么想法吗？

Answer 1

slideToggle() 不是您在这种情况下应该使用的函数。它只会更改匹配元素的高度，而另一方面 .animate() 方法可以将 div 向所需方向移动，但在动画完成时不会隐藏该元素，所以如果你想实现这一点，你应该使用回调。如果要将一个 div 放置在另一个 div 后面，则应使用 z-index css 属性。