Erstens werde ich Ihnen das Bootstrap -Bild -Karussell zeigen. Der Effekt ist wie folgt. Wenn Sie der Meinung sind, dass der Effekt ziemlich gut ist, lesen Sie bitte weiter und beziehen Sie sich auf den Implementierungscode.
Ich werde nicht viel Unsinn sagen, ich werde Ihnen den Code einfach veröffentlichen. Der spezifische Code lautet wie folgt:
<! DocType html> <html Lang = "zh-cn"> <head> <meta charset = "utf-8"> <meta http-äquiv = "x-ua-compatible" content = "ie = edge"> <meta name = "adveport" content = "width = toy-widdh, initial-mough, initial-scale = 1" 1 "1"> <; Und jeder andere Inhalt * muss ihnen folgen! -> <title> Bild Carousel_01 </title> <!-bootstrap-> <link href = "../ bootstrap-3.3.5-dist/css/bootstrap.min.css" rel = "styleSheet"> <script Src = "../ Jquery-2.1.1.1.Min.js"> </script src = "../ bootstrap-3.3.5-dist/js/bootstrap.min.js"> </script> </head> <body> <!-Autor: Kyle Time: 2016-02-20 Beschreibung: Carouseldate-Interval = "4000" -Hellzeit/Bild unterstützt die linke und rechte Regie. id = "carousel-example-generic"> <ol> <li data-target = "#carousel-example-generic" data-klide-to = "0"> </li> <li data-target = "#carousel-example-generic" data-Slide-zu = "1"> </li> <li-Data-target = "#"#"#"#"#"#"#"#"#"#"#"#"#"#"#"#carousel-excample "-Daten-" -Daten-"- data-target="#carousel-example-generic" data-slide-to="1"></li><li data-target="#carousel-example-generic" data-slide-to="2"></li><li data-target="#carousel-example-generic" data-slide-to="3"></li></ol><div><div><img src="../img/picture carousel/pic01.jpg" /></div><div><img src="../img/picture carousel/pic02.jpg" /><!--Text to be displayed on the picture--><div><h3>Lenovo Campus Ambassador</h3></div></div><div><img src = "../ img/picture Carousel/pic03.jpg"/> </div> <div> <img src = "../ img/picture Carousel/pic04.jpg"/> </div> <!-Controls-> <a href = "#carousel-exam-gEN" rollen "button" data-slide = " aria-hidden = "true"> </span> <span> vorher </span> </a> <a href = "#carousel-example-generic" rollen = "button" data-slide = "next"> <span aria-hidden = "true"> </span>. CSS -Attributeinstellung ohne menschliche Intervention -> <script> $ (". Carousel"). Carousel ({Intervall: 4000}) </script> </body> </html>Das obige ist der Beispielcode der Bootstrap-basierten Bildkarousel-Effekt-Anzeige basierend auf Bootstrap, die der Editor Ihnen vorgestellt hat. Ich hoffe, es wird Ihnen hilfreich sein. Wenn Sie Fragen haben, hinterlassen Sie mir bitte eine Nachricht und der Editor wird Ihnen rechtzeitig antworten. Vielen Dank für Ihre Unterstützung auf der Wulin.com -Website!