Karussell in HTML nicht funktioniert

Ich weiß nicht, warum dieser Code nicht ... funktioniert, da ich ein Anfänger bin ich nicht, was ist falsch mit diesem, Vielen Dank im Voraus für jeden, der michKarussell in HTML nicht funktioniert

<!DOCTYPE html> 
    <html> 
    <head> 
     <title>Jothidhal</title> 
     <meta charset = "utf-8"> 
     <meta name = "viewport" content = "width = device-width" , initial-scale = 1> 
     <link rel = "stylesheet" type = "text/css" href = "css/bootstrap.min.css"> 
     <link rel = "stylesheet" type = "text/css" href = "additional.css"> 
     <link href="https://fonts.googleapis.com/css?family=Arsenal:700" rel="stylesheet"> 
    </head> 
    <body> 
     <div class = "container-fluid"> 
     <div id = "My_Carousel" class = "carousel-slide" data-ride = "carousel"> 
      <ol class = "carousel-indicators"> 
      <li data-target = "#My_Carousel" data-slide-to = "0" class = "active"> </li> 
      <li data-target = "#My_Carousel" data-slide-to = "1" > </li> 
      <li data-target = "#My_Carousel" data-slide-to = "2" > </li> 
      </ol> 
      <div class = "carousel-inner" role ="listbox"> 
      <div class = "item"><img src = "images/images 1.jpg" alt = "Durairaj" width = "100%" height = "400px"</div> 
      <div class = "item"><img src = "images/images 2.jpg" alt = "Durairaj" width = "100%" height = "400px"</div> 
      <div class = "item"><img src = "images/images 3.jpg" alt = "Durairaj" width = "100%" height = "400px"</div> 
      <div class = "item"><img src = "images/images 4.jpg" alt = "Durairaj" width = "100%" height = "400px"</div> 
      <div class = "item"><img src = "images/images 5.jpg" alt = "Durairaj" width = "100%" height = "400px"</div> 
      <div class = "item"><img src = "images/images 6.jpg" alt = "Durairaj" width = "100%" height = "400px"</div> 
      </div> 
      <a class = "left-carousel-control" href = "#My_Carousel" role= "button" data-slide = "prev"> 
      <span class = "glyphicon glyphicon-chevron-left"></span> 
      <span class = "sr-only">Previous</span> 
      </a> 
     </div> 
     </div> 
     <script type = "text/javascript" src = "js/bootstrap.min.js"></script> 
     <script type = "text/javascript" src = "js/jquery.js"></script> 
    </body> 
    </html>

hilft herausfinden konnte

Quelle

2017-02-10 Durairaj Saro

Es hilft bei der Beschreibung, was passiert, anstatt nur es funktioniert nicht :) –

Was sind Fehler, die Sie haben? –

Eigentlich Sir, bekomme nicht die Ausgabe, keines der Bilder werden angezeigt, bin verwirrt! –

Ihre img Tags sind nicht geschlossen! mit Ihrer Kopie & Paste

<div class = "item"><img src = "images/images 6.jpg" alt = "Durairaj" width = "100%" height = "400px"</div>

Sollte

<div class = "item"><img src = "images/images 6.jpg" alt = "Durairaj" width = "100%" height = "400px"></div>

Quelle

2017-02-10 08:03:54

Danke Herr, aber auch nach dem Schließen der IMG-Tag, bekomme ich nicht die Ausgabe .. –

Nun, zuerst einmal sollte es einen Platz zwischen Karussell und Folie ('class = "Karussell-Folie" '). Dann entfernen Sie Höhe und Breite von Ihrem 'img' und legen Sie das in CSS. Bilder unterstützen nur int-Werte wie "height =" 400 "". –

Sie haben einige Fehler gemacht werden. Dies sollte Ihr html sein:

ändern carousel-slide zu carousel slide
active Klasse Ihren ersten Folie
Korrekte Karussell Kontrolle statt Ihrer falschen hinzufügen. Schließen Sie Ihre img Tags
Die Klassen für die Steuerung sollte left carousel-control und nicht left-carousel-control

sein Wenn Sie 3 Indikatoren haben, müssen Sie nur 3 Rutschen haben sollte

<div class="container-fluid"> 
    <div id="My_Carousel" class="carousel slide" data-ride="carousel"> 
     <ol class="carousel-indicators"> 
      <li data-target="#My_Carousel" data-slide-to="0" class="active"> </li> 
      <li data-target="#My_Carousel" data-slide-to="1" > </li> 
      <li data-target="#My_Carousel" data-slide-to="2" > </li> 
     </ol> 

     <div class = "carousel-inner" role ="listbox"> 
      <div class = "item active"><img src = "images/images 1.jpg" alt = "Durairaj" /></div> 
      <div class = "item"><img src = "images/images 2.jpg" alt = "Durairaj" /></div> 
      <div class = "item"><img src = "images/images 3.jpg" alt = "Durairaj" /></div> 
     </div> 
     <a class="left carousel-control" href="#My_Carousel" role="button" data-slide="prev"> 
      <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> 
      <span class="sr-only">Previous</span> 
     </a> 
     <a class="right carousel-control" href="#My_Carousel" role="button" data-slide="next"> 
      <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> 
      <span class="sr-only">Next</span> 
     </a> 
    </div> 
</div>

prüfen diese W3Schools tut und überprüfen diese fiddle

Wenn Sie Paste Code kopieren, tun Sie es zumindest richtig ..

Quelle

2017-02-10 09:03:48 Yuri

Karussell in HTML nicht funktioniert

Antwort

Verwandte Themen