Javascript jqueryslidetoggle—；跳伞

我有一个问题。 有一个jQuery“moretext”动画div（slideToggle）和显示的文本跳转。我不知道为什么。谁能帮帮我吗

HTML:

---

只需从span:

.slide-button span {
  display: block;
  font-family: "Playfair Display";
  font-size: 20px;
  font-weight: 400;
  color: #da3c2b;
  width: 90%;
  margin: 0;
}

---

您可以按照Jacob Gray的建议删除

float:left

，但也可以尝试添加

overflow:hidden到类
。滑动按钮。隐藏

例如：


$（文档）.ready（函数（）{
$（'.hidden'）.hide（）；
$（'.slide按钮'）。单击（函数（）{
$（'.hidden'）.slideToggle（'slow'）；
});
});
。滑动按钮{
显示：块；
宽度：94.230769%；
-webkit盒阴影：0 0 3pxRGBA（166、166、166、0.5）；
盒影：0.03倍rgba（166、166、166、0.5）；
背景色：#f7f7f7；
背景：-webkit线性梯度（180度，#F7F7F70%，#F2100%）；
背景：线性梯度（180度，#F7F7F70%，#F2100%）；
-webkit边界半径：3px；
边界半径：3px；
光标：指针；
填充：25px 0 30px；
位置：相对位置；
边缘底部：30px；
最小高度：57px；
溢出：隐藏；
}
.滑动按钮跨距{
显示：块；
字体系列：“Playfair显示”；
字体大小：20px；
字体大小：400；
颜色：#da3c2b；
浮动：左；
宽度：90%；
保证金：0；
}
.滑动按钮：在{
位置：绝对位置；
内容：''；
背景：url（../imgs/arrow.png）不重复；
显示：内联块；
宽度：20px；
高度：20px；
顶部：40px；
右：30px；
}
.滑动按钮：悬停{
背景色：#f7f7f7；
背景：-webkit线性梯度（0度，#F7F7F70%，#F2100%）；
背景：线性梯度（0度，#F7F7F70%，#F2100%）；
}
.滑动按钮。隐藏{
宽度：100%；
显示：块；
位置：相对位置；
溢出：隐藏；
}
.滑动按钮.隐藏的p{
填充：25px 0 40px 0；
}

更多
内容跳跃

呵呵，我是雅各布·格雷：P无论如何，回答得不错：）看来我累了：P
$(document).ready(function () {
    $('.hidden').hide();
    $('.slide-button').click(function () {
        $('.hidden').slideToggle('slow');
    });
});

.slide-button span {
  display: block;
  font-family: "Playfair Display";
  font-size: 20px;
  font-weight: 400;
  color: #da3c2b;
  width: 90%;
  margin: 0;
}