Bootstrap輪播無法開始加載，並且隨着懸停而滑動停止

Question

我有這段HT​​ML代碼。 整個部分位於id =“ main-slider”中。 除非我單擊箭頭，否則轉盤不會滑動，然后旋轉就可以了。 我面臨的另一個問題是滑塊是整頁滑塊。 默認情況下，懸停時引導程序停止滑動。 我不希望這種影響發生。 為了解決這兩個問題，我提供了jQuery函數來覆蓋此功能，但是似乎沒有任何效果。 在花了6個小時閱讀並在Github和這個地方嘗試了幾乎所有東西之后，終於決定在這里尋求幫助。

    <section id="main-slider">
    <div class="carousel slide">
      <ol class="carousel-indicators ">
        <li class="active" data-slide-to="0" data-target="#main-slider"></li>
        <li data-slide-to="1" data-target="#main-slider"></li>
        <li data-slide-to="2" data-target="#main-slider"></li>
        <li data-slide-to="3" data-target="#main-slider"></li>
      </ol>
    <div class="carousel-inner">
      <div class="item active" style="background-image: url(images/slider1.jpg)">
        <div class="container">
          <div class="row">
            <div class="col-sm-12">
              <div class="carousel-content centered">
                <div class="center" id="text-position"> <!-- self defined class in css-->
                  <h2></h2>
                    <p></p>
                      <a class="btn btn-md-primary></a>
                </div> <!-- /center -->
              </div> <!-- /carousel-content -->
            </div> <!-- /col-sm -->
          </div> <!-- /row -->
        </div> <!-- /container -->
      </div> <!-- /item active -->
    <!--I have 3 more similar rows-->
    </div> <!-- carousel ends -->

    <script src="js/jquery.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/main.js"></script>
    <script>
    $(function(){
    $('#main-slider.carousel').carousel({
        interval: 2000,
        pause: false
        });
    });
   </script>

Answer 1

您是否嘗試過使用data-方法而不是使用Javascript初始化程序？ 例如

<div class="carousel slide wet-asphalt" data-ride="carousel" data-interval="2000" data-pause="false">

不要忘記刪除您的Javascript初始化程序。