Javascript 更改显示时居中按钮的动画方向（持续时间）

我有一个包含一些段落的div，我想通过.show（）按需显示这些段落。在该div中，还有另一个div，包含一个按钮。该div将文本对齐设置为中心，以便我的按钮位于段落中所有文本的中间。

使用show（1000）时，文本会从上到下设置动画，这正是我想要的。然而，按钮并没有遵循这种行为，而是从左侧滑入

$（'.showme'）.show（1000）
.wrapper{
文本对齐：居中；
}
.按钮{
位置：绝对位置；
}
.showme{
显示：无；
宽度：400px；
}


文本


更多文本

你好
如果要将按钮立即设置到中间位置，则应将该按钮定位。

编辑：

如果希望保留div.wrapper样式而不进行更改，但可以删除
position:absolute从按钮，您可以尝试使用
$（'.showme'）。向下滑动（1000）-

如果您想保持div.wrapper样式不变，并创建自己的动画，则应使用自己的样式
.addClass（“nameClass”）
，而不要使用
.show（）
用此代码替换CSS文件

 .wrapper {
    position: relative;
}
.button {
  position: absolute;
  left: 50%;
  right: 50%;
  transform: translateX(-50%);
}

.showme {
  display: none;
  width: 400px;
}

这就成功了。您不需要所有其他HTML。

或者你可以这样做：
这将在第一个动画完成后在文本下的按钮中淡出。但是如果你用css动画解决这个问题会更好

只是添加了一个边框，向您展示如何对齐。
有没有不更改Div逻辑的方法？（我更新了我的问题）但是当你在段落中添加长文本时，按钮的动画与文本相同，你会看到文本也是从左到右的动画。这是因为showme包装器的宽度从0px变为400px@SvenEngling我更新了问题，我认为slideDown就是你想要的。哦，slideDown实际上很有效。我知道这个函数，但我不知道它还设置display属性，所以我在slideDown（）之前尝试了show（），这当然不起作用。下次我可能应该更仔细地阅读文档。当我使用小提琴时，整个div从左向右滑动。更糟糕的是：D@SvenEngling它已经做到了，你没有注意到，因为它周围没有边界，我把所有的东西都放在中间。默认情况下，设置动画时，
show
函数会执行此操作。如果你想要一个不同的动画，你应该看看动画功能或只是淡入淡出你想要的。如果不居中，看起来一切都像你想要的那样工作，但它仍然从左上到右下动画。正如我所说的，您应该弄清楚您想要使用@SvenEngling的动画，最好是避免使用jquery动画和css。现在Css基本上可以做任何事情，但要想更好地掌握它需要更多的时间。我会看看我是否能真正了解Css。现在，我遵循乔·科克的答案，使用幻灯片向下而不是显示，这正是我所需要的。非常感谢。
 .wrapper {
    position: relative;
}
.button {
  position: absolute;
  left: 50%;
  right: 50%;
  transform: translateX(-50%);
}

.showme {
  display: none;
  width: 400px;
}

.wrapper {
    text-align: center;
}

.showme {
  display: none;
  width: 400px;
  border: 1px solid black;
  text-align: center;
}