我在Magento主页上使用Bootsrap轮播示例代码。问题是鼠标图标变为" aero working"将我自己的Bootstrap轮播代码添加到主页后,每4秒钟生成一次图标。主页上还有其他内置的Bootstrap轮播,但身份不同,他们没有这个问题。如何解决此问题而不禁用自动滚动?
更新:噪音的来源是另一个试图连接到云端的软件。
.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 {
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);
border-radius: 0;
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 {
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;
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&text=First+Slide" class="img-responsive">
</div>
<div class="item">
<img src="http://placehold.it/234x279/e91e63/000000&text=Second+Slide" class="img-responsive">
</div>
<div class="item">
<img src="http://placehold.it/234x279/9c27b0/000000&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>
&#13;
答案 0 :(得分:0)
可能不是最好的,但您可以尝试在旋转木马上添加CSS指针效果:
#carousel-pager {
cursor: pointer;
}