Javascript 制作一个div，单击它可以上下移动

我有以下代码

<h1>Heading</h1>
<div>Content to be displayed</div>

标题
要显示的内容

---

现在，单击h1，整体应该向上移动，再次单击h1，两者都应该向下移动。如何实现这一点。我使用jquery切换功能上下移动div，但我也希望h1向上移动。

一个div中的两个元素是什么，并使该div上下移动

<div>
  <h1>Heading</h1>
  <div>Content to be displayed</div>
</div>

标题
要显示的内容

首先，最容易设置容器元素的动画

您可以使用jQuery来包装它们

var container = $('h1, div').wrapAll('<div />').parent();

然后您可以攻击该

容器的单击处理程序

container.toggle(
function() {
   $(this).animate({ top: '-=20px' }, 500);
},
function() {
   $(this).animate({ top: '+=20px' }, 500);
});

.
考虑到您标记为正确的答案，与错误可能在您这边大致相同。幸好你把它修好了！
container.toggle(
function() {
   $(this).animate({ top: '-=20px' }, 500);
},
function() {
   $(this).animate({ top: '+=20px' }, 500);
});