如何在啓動傳送帶滑動過程中阻止鼠標加載圖標？

Question

我在我的Magento主頁中使用Bootsrap輪播示例代碼。問題是，在將我自己的Bootstrap輪播代碼添加到主頁後，鼠標圖標每4秒就會變爲「aero working」圖標。主頁上還有其他內置的Bootstrap輪播，但ID不同，它們沒有這個問題。如何解決這個問題而不禁用自動滾動？

更新：噪聲的來源來自另一個試圖連接到雲的軟件。

.carousel-inner.vertical { 
 
    height: 279px; /*Note: set specific height here if not, there will be some issues with IE browser*/ 
 
} 
 

 
#carousel-pager .carousel-control.left { 
 
\t position: absolute; 
 
    width: 10%; 
 
} 
 
#carousel-pager .carousel-control.right { 
 
    position: absolute; 
 
    width: 10%; 
 
} 
 
.carousel-indicators { 
 
    position: absolute; 
 
    right: 0; 
 
    bottom: 10px; 
 
    left: 0; 
 
    z-index: 15; 
 
    display: -webkit-box; 
 
    display: -webkit-flex; 
 
    display: -ms-flexbox; 
 
    display: flex; 
 
    -webkit-box-pack: center; 
 
    -webkit-justify-content: center; 
 
    -ms-flex-pack: center; 
 
    justify-content: center; 
 
    padding-left: 0; 
 
    margin-right: 15%; 
 
    margin-left: 15%; 
 
    list-style: none; 
 
} 
 
.carousel-indicators li { 
 
    position: relative; 
 
    -webkit-box-flex: 1; 
 
    -webkit-flex: 1 0 auto; 
 
    -ms-flex: 1 0 auto; 
 
    flex: 1 0 auto; 
 
    max-width: 30px; 
 
    height: 3px; 
 
    margin-right: 3px; 
 
    margin-left: 3px; 
 
    text-indent: -999px; 
 
    cursor: pointer; 
 
    background-color: rgba(255,255,255,.5); 
 
\t border-radius: 0; 
 
\t border: none; 
 

 
} 
 

 
.carousel-indicators li::after { 
 
    position: absolute; 
 
    bottom: -10px; 
 
    left: 0; 
 
    display: inline-block; 
 
    width: 100%; 
 
    height: 10px; 
 
    content: ""; 
 
} 
 

 
.carousel-indicators li::before { 
 
    position: absolute; 
 
    top: -10px; 
 
    left: 0; 
 
    display: inline-block; 
 
    width: 100%; 
 
    height: 10px; 
 
    content: ""; 
 
} 
 

 
.carousel-indicators .active { 
 
\t margin: 1px; 
 
    position: relative; 
 
    -webkit-box-flex: 1; 
 
    -webkit-flex: 1 0 auto; 
 
    -ms-flex: 1 0 auto; 
 
    flex: 1 0 auto; 
 
    max-width: 30px; 
 
    height: 3px; 
 
    margin-right: 3px; 
 
    margin-left: 3px; 
 
    text-indent: -999px; 
 
    cursor: pointer; 
 
\t background-color: rgba(255,255,255,.9); 
 
}

  <div id="carousel-pager" class="carousel slide " data-ride="carousel" data-interval="5000"> 
 

 
       <div class="carousel-inner"> 
 
        <div class="active item"> 
 
         <img src="http://placehold.it/234x279/f44336/000000&amp;text=First+Slide" class="img-responsive"> 
 
        </div> 
 
        <div class="item"> 
 
         <img src="http://placehold.it/234x279/e91e63/000000&amp;text=Second+Slide" class="img-responsive"> 
 
        </div> 
 
        <div class="item"> 
 
         <img src="http://placehold.it/234x279/9c27b0/000000&amp;text=Third+Slide" class="img-responsive"> 
 
        </div> 
 
       </div> 
 

 
    <ol class="carousel-indicators"> 
 
    <li data-target="#carousel-pager" data-slide-to="0" class="active"></li> 
 
    <li data-target="#carousel-pager" data-slide-to="1"></li> 
 
    <li data-target="#carousel-pager" data-slide-to="2"></li> 
 
    </ol> 
 

 
</div>

Answer 1

可能不是最好的，但你可以嘗試添加CSS指針影響到轉盤：

#carousel-pager { 
    cursor: pointer; 
}