twitter-bootstrap - divs - como hacer un slider con bootstrap 4

Cómo eliminar o personalizar el botón de paginación en el carrusel Bootstrap

Question

Me gustaría eliminar el botón predeterminado (o punto blanco) en el carrusel de Bootstrap. ¿Es posible personalizarlos?

Answer 1

1) evitar el cambio

$(''.carousel-indicators li'').each(function(){
    $(this).carousel(''pause'');
});

2) eliminar la clase activa ..

$(''.carousel-indicators .active'').removeClass(''active'')

Answer 2

En términos de ocultación, puede usar CSS para ocultarlo. Por ejemplo,

.carousel-indicators li { visibility: hidden; }

haría que todos los puntos estuvieran ocultos.

Answer 3

Lo siguiente funcionó para mí

1. buscar .carousel-indicators li en el archivo css bootstrap.min.css

2. cambie la configuración de visualización para los indicadores de carrusel li none

ejemplo:

de este .carousel-indicators li{display:inline-block;}

a este .carousel-indicators li{display:none;}

Los puntos ya no se mostrarán.

Answer 4

Creo que la mejor manera de escribir tu propia plantilla y agregarla por template-url param. P.ej:

<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>

Answer 5

Simplemente elimine indicators de la declaración del carrusel:

<!-- 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>