如何将菜单项放置在轮播顶部的固定位置？

Question

我正在使用带有引导程序的 wt-rotator carousel 插件。我必须在左上角的旋转木马顶部放置一个固定位置的菜单。即使图像淡入淡出，菜单也应保留在那里。有没有办法使用 CSS 来做到这一点？

编辑：添加了下面的代码。 到目前为止，只是下面的这段代码。它是一个 bootstrap jumbotron，里面有一个 wt-rotator carousel。在这个旋转木马上，我必须放一个菜单。

    <div class="jumbotron">
  <div class="container">      
        <div id="banner-container">

            <div class="wt-rotator">
                <div class="c-panel">               
                    <div class="thumbnails">
                        <ul>
                            <li>
                                <a href="images/image1.jpg"></a>
                            </li>
                            <li>
                                <a href="images/image2.jpg"></a>
                            </li>
                            <li>
                                <a href="images/image3.jpg"></a>
                            </li>
                            <li>
                                <a href="images/image4.jpg"></a>
                            </li>
                        </ul>
                    </div>

                    <div class="buttons">
                        <div class="prev-btn"></div>
                        <div class="play-btn"></div>
                        <div class="next-btn"></div>
                    </div>

                </div>
            </div>
        </div>
  </div>

Answer 1

您可以使用绝对位置和 z-index 优于滑块的外部 div，并将该 div 放在滑块的前面。