Primero, te mostraré el carrusel de la imagen Bootstrap. El efecto es el siguiente. Si cree que el efecto es bastante bueno, continúe leyendo y consulte el código de implementación.
No diré muchas tonterías, solo te publicaré el código. El código específico es el siguiente:
<! DocType html> <html lang = "zh-cn"> <head> <meta charset = "utf-8"> <meta http-equiv = "x-ua compatible" content = "ie = edge"> <meta name = "viewport" content = "width = dispositivo-width, inicial-scale = 1" <<r!-el 3 meta * Mets * viewport "debe colocar primero * * cualquier otro contenido * debe * seguirlos! -> <title> Picture Carousel_01 </title> <!-Bootstrap-> <link href = "../ bootstrap-3.3.5-dist/css/bootstrap.min.css" rel = "stylesheet"> <script src = "../ js/jQuery-2.1.4.min.js"> </script <script <script <script <script <script src = "../ bootstrap-3.3.5-dist/js/bootstrap.min.js"> </script> </head> <body> <!-Autor: Kyle Time: 2016-02-20 Descripción: Carouseldate-Interval = "4000" tiempo de espera/admite las teclas de dirección izquierda y derecha del teclado a la dirección de la dirección de la caro para la imagen-Dive> <DIV> <DIV> DIVHIV id="carousel-example-generic"><ol><li data-target="#carousel-example-generic" data-slide-to="0"></li><li data-target="#carousel-example-generic" data-slide-to="1"></li><li data-target="#carousel-example-generic" data-slide-to="0"></li><li data-Target = "#Carousel-Example-Generic" data-slide-to = "1"> </li> <li data-Target = "#Carousel-exame-Generic" Data-Slide-To src = "../ img/picture Carousel/pic01.jpg"/> </div> <div> <img src = "../ img/picture Carousel/pic02.jpg"/> <!-Texto que se mostrará en la imagen-> <div> <h3> Lenovo Vbassador del campus </h3> </iv> </div> <im> <IMGG src = "../ img/picture Carousel/pic03.jpg"/> </div> <div> <img src = "../ img/picture Carousel/pic04.jpg"/> </div> <!-Controls-> <a href = "#Carousel-Expleample-Genérico" rol = "Booth" Data-Slide = "Prev" aria-hidden = "true"> </span> <span> anterior </span> </a> <a href = "#Carousel-Example-Generic" rol = "Button" data-slide = "next"> <span aria-hidden = "true"> </span> <span> next </span> </a> </div> </div> <!-Establece el intervalo de tiempo, a través de javaStcript, esto puede ser iniciado, esto puede ser iniciado, esto puede ser iniciado, esto puede ser iniciado, esto puede ser iniciado, esto puede ser iniciado, esto puede ser iniciado, esto puede ser iniciado, esto puede ser iniciado, esto puede ser iniciado, esto puede ser inicial, esto puede ser iniciado, esto puede ser inicial, esto puede ser iniciado, esto puede ser inicial, esto puede ser inicial, esto puede ser inicial, esto puede ser inicial, esto puede ser inicial, esto puede ser inicial, esto puede ser inicial. Configuración de atributos CSS sin intervención humana -> <script> $ (". Carousel"). Carousel ({Interval: 4000}) </script> </body> </html>Lo anterior es el código de muestra de la pantalla de efecto de carrusel de imagen basada en Bootstrap basada en Bootstrap que el editor le presentó. Espero que te sea útil. Si tiene alguna pregunta, déjame un mensaje y el editor le responderá a tiempo. ¡Muchas gracias por su apoyo al sitio web de Wulin.com!