Este foro ya no está activo, así que no puedes publicar nuevas preguntas ni responder a las preguntas existentes.

No funcionan flechas de desplazamiento en un carrusel de Bootstrap

29 de abril de 2015

Tengo un problema con un carousel de bootstrap. Las imagenes se ven correctamente. Se puede cambiar de una imagen a otra utilizando los circulos inferiores, pero no funcionan las flechas laterales que desplazan a la imagen anterior o la siguiente.

Tengo incluidas las llamadas a bootstrap.ccs, bootstrap.js y jquery.js. Estas librerías funcionan, ya que el resto de la web que las utilizan funciona correctamente. He probado con distinstan versiones de bootstrap.js y jquery.js, con idéntico resultado. Gracias


Respuestas

#1

Si te fijas por ejemplo en el carrusel de la página oficial de Bootstrap verás lo siguiente:

<a class="right carousel-control" href="#carousel-example-generic" role="button"
   data-slide="next">
    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
</a>

Las flechas se crean con la fuente de iconos Glyphicon, así que es posible que no hayas incluido el CSS de la fuente o que el archivo con la fuente esté en un sitio que tu navegador no puede encontrar.

@javiereguiluz

29 abril 2015, 11:23
#2

Buenas, tengo exactamente el mismo problema. En mi caso agregué las flechas y sus fuentes como menciona Javier. De hecho, estas se visualizan en pantalla, pero al hacer click en cualquiera de ella no me pasa de foto en foto.

Todo lo demás me funciona perfecto, puedo cambiar las fotos con los puntos de abajo, solo no funcionan las flechas. Capaz puedan ayudarme. Saludos y gracias !!

@santi_nun

3 mayo 2015, 14:42
#3

El div del carousel debe tener un id y ese id debe coincidir con los links de las flechitas.

Supongamos que el div que tiene la clase carousel se llama myCarousel, el codigo de las flechitas deberian ser asi:

<a class="left carousel-control" href="#myCarousel" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left"></span>
        <span class="sr-only">Previous</span>
    </a>
    <a class="right carousel-control" href="#myCarousel" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right"></span>
        <span class="sr-only">Next</span>
    </a>

Hay que notar que las href de los link apuntan al ID del div con clase carousel

@PCorezzola

5 junio 2017, 17:20