twitter-bootstrap 如何删除或自定义 Bootstrap 轮播中的分页按钮
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/21973298/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to remove or customize the pagination button in Bootstrap carousel
提问by Asme Just
I'd like to remove the default button (or white dot) in Bootstrap carousel. Is it possible to customize them?
我想删除 Bootstrap 轮播中的默认按钮(或白点)。是否可以自定义它们?


回答by Gavin Ching
In terms of hiding, you can use CSS to make it hidden. For example,
在隐藏方面,您可以使用 CSS 将其隐藏。例如,
.carousel-indicators li { visibility: hidden; }
would make all the dots be hidden.
会使所有的点都被隐藏起来。
回答by Dimitri Schultheis
I think the best way to write your own template and add it by template-url param. E.g.:
我认为最好的方法是编写自己的模板并通过 template-url 参数添加它。例如:
<div class="carousel-inner" ng-transclude></div>
<a role="button"
href
class="left carousel-control"
ng-click="prev()"
ng-class="{ disabled: isPrevDisabled() }"
ng-show="slides.length > 1">
<span aria-hidden="true"
class="glyphicon glyphicon-chevron-left"></span>
<span class="sr-only">previous</span>
</a>
<a role="button"
href
class="right carousel-control"
ng-click="next()"
ng-class="{ disabled: isNextDisabled() }"
ng-show="slides.length > 1">
<span aria-hidden="true"
class="glyphicon glyphicon-chevron-right"></span>
<span class="sr-only">next</span>
</a>
回答by valex
Just remove indicatorspart from carousel declaration:
只需indicators从轮播声明中删除部分:
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
<li data-target="#myCarousel" data-slide-to="3"></li>
</ol>
回答by user3526416
The following worked for me
以下对我有用
search for .carousel-indicators liin the css file bootstrap.min.css
change the displaysetting for the carousel-indicators lito none
在 css 文件 bootstrap.min.css 中搜索.carousel-indicators li
将carousel-indicators li的显示设置更改为none
example:
例子:
from this .carousel-indicators li{display:inline-block;}
由此 .carousel-indicators li{display:inline-block;}
to this .carousel-indicators li{display:none;}
对此 .carousel-indicators li{display:none;}
The dots will no longer be displayed.
点将不再显示。
回答by Seth McClaine
1) prevent from switching
1) 防止切换
$('.carousel-indicators li').each(function(){
$(this).carousel('pause');
});
2) remove the active class..
2)删除活动类..
$('.carousel-indicators .active').removeClass('active')

