Question

我有一个简单的滑块设置，大约有10张图片。

我希望能够让用户点击滑块中的一个图像，结果图像显示在滑块下方。

滑块仍然位于新放置的图像上方。

我不想要灯箱或模态窗口，我希望图像显示在滑块下方的页面上。

我想知道如何在JavaScript或CSS或Bootstrap中执行此操作？

我无法在谷歌上找到任何关于此的内容，所以我感谢您提供的任何帮助。

Answer 1

由于这是一个相当含糊的问题，我的答案相当含糊。这涉及到使用jQuery，并且会在每次单击时将滑块中的项插入div中。请随意澄清任何可以帮助我提供更好答案的细节。

$(document).ready(function() {

  $("#slider li").click(function() {
    var html = $(this).html();
    $("#page-beneath-slider").append(html);
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="slider">
  <ul>
    <li><img src="http://placehold.it/100x100" /></li>
    <li><img src="http://placehold.it/100x100" /></li>
  </ul>
</div>
<h2>Stuff beneath the slider</h2>
<div id="page-beneath-slider"></div>

单击时使图像出现在另一个图像下方

1 个答案: