【问题标题】:Bootstrap Modal CarouselBootstrap 模态轮播
【发布时间】:2015-08-22 20:29:16
【问题描述】:

我正在尝试在我的简单、静态、基于 Bootstrap 的 HTML 页面中实现模式轮播。我正在尝试让this simple code 在我的页面中工作,但我需要更多指导。我将所述代码粘贴到我的页面中,但最终我将轮播嵌入到页面中并且没有隐藏。我缺乏实用的 css/javascript 知识让我很失望,因为我不太了解代码 sn-p 之前的 3 个简单指令。

有人可以通过单击此小提琴中的缩略图向我解释如何使我的模态轮播工作吗? JSFiddle example here.

   <body>
    <!--rows and cols structure -->               
        <div class="row">
            <div class="col-sm-12 col-md-8 col-md-offset-2">
                <!--2nd row-->
                <div class="col-sm-4 col-md-4">          
                        <div class="thumbnail">
                          <img src="/img/image3.jpg" alt="image3 missing">
                          <div class="caption">
                            <h3>Thumbnail label</h3>
                          </div>
                            </div>
                </div>
            </div>
           </div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.11.3.min.js"><\/script>')</script>


    <script src="js/bootstrap.min.js"></script><!--Reference Bootstraop.min before plugins.js but after jquery.js. We alterbootstrap javascript with plugins.js -->
    <script src="js/plugins.js"></script>
    <script src="js/main.js"></script>

</body>

【问题讨论】:

  • 在您的相同代码中,您有一个额外的 接近尾声。因此,基于此的快速问题:您是否在调试器中看到任何 JS 错误?
  • 抱歉,我删除了,我删掉了不必要的代码以确保问题清晰
  • 您的 div 结构似乎不正确!

标签: html twitter-bootstrap carousel bootstrap-modal


【解决方案1】:

如果你还没有看过这个:

https://noreiller.github.io/bootstrap-modal-carousel/modal-carousel.html

这可能会让你更清楚

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2018-10-03
    • 2019-04-03
    • 2014-11-13
    • 2020-03-01
    • 1970-01-01
    • 1970-01-01
    • 2016-12-30
    • 1970-01-01
    相关资源
    最近更新 更多