如何使文本移动到JQuery幻灯片下方

Question

我正在制作一个JQuery切换/幻灯片类型菜单，并且当JQuery向下滑动时，希望下面的文本移动。

由于这是我的新手，我的代码可能会很凌乱。 我为此提前表示歉意，但是它几乎可以按我需要的方式工作。

请在此处查看运行中的代码

Answer 1

只需将文本放在自己的div

<div id="textId">
    <!-- text elements here -->
</div>

然后使用以下css

#textId {
    float: left;
    position: relative; 
    clear: both;
}

Answer 2

在菜单下方添加您周围的内容。

然后使用以下CSS将类添加到div：

clear: both;

编辑：恰好在#sliderright div之后和开始刑事指控元素之前，放置一个

<div style="clear:both;"></div>

Answer 3

之所以发生这种情况，是因为您要浮动两个滑块，使它们脱离正常的文档流。 您可以对下面的内容执行此操作：

<article>
    <h2>Lorem Ipsum</h2>
    <h3>Vestibulum tortor quam</h3>
    <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante.  </p>
</article>

然后使用CSS阻止它浮动：

article{
    clear: both;
}

Answer 4

关闭<ul>元素时遇到问题，请重新打开它：

这个：

<ul>
    <li>Possession or use of Firearm without Licence Permit</li>
    <li>Unregistered Firearm</li>
    <li>Not keep Firearm Safe</li>
    <li>Discharge Firearm</li>
<ul>

应该：

<ul>
    <li>Possession or use of Firearm without Licence Permit</li>
    <li>Unregistered Firearm</li>
    <li>Not keep Firearm Safe</li>
    <li>Discharge Firearm</li>
</ul>

然后清除div浮点数：

这是一个工作示例。