Bootstrap-Template nicht richtig funktioniert

Ich bin derzeit dabei eine Webseite mit Bootstrap. Ich habe dieses template (http://getbootstrap.com/examples/carousel/) und kopiert den Quellcode in mein text-editor. Ich bin mit den source-code auf Xamp mit dem lokalen host sondern das carousel-element nicht angezeigt wird.

Hinweis: Wenn Sie diese Seite über eine Datei://URL, die "weiter" und "zurück" Glyphicon Tasten auf der linken und rechten Seite könnte nicht geladen/angezeigt richtig durch web-browser-Sicherheitseinstellungen Regeln.

Was soll ich bitte tun?

Dies ist der code, den ich in den head-Bereich:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../../favicon.ico">

    <title>Carousel Template for Bootstrap</title>

 <!-- Bootstrap core CSS -->
    <link href="css/bootstrap.min.css" rel="stylesheet">

<!-- Optional theme -->
<link href="css/bootstrap-theme.min.css" rel="stylesheet">

<!-- Latest compiled and minified JavaScript -->
<script src="js/bootstrap.min.js"></script>


    <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
    <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
    <script src="../../assets/js/ie-emulation-modes-warning.js"></script>

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->

    <!-- Custom styles for this template -->
    <link href="carousel.css" rel="stylesheet">
  </head>
Können Sie nach dem code, die Sie aktuell auf Xamp in einer Geige. Dabei könnte es so leicht ist, nicht mit den richtigen links zu bootstrap js und bootstrap css.
Ich bearbeitet meine post und angezeigt der code. Dank

InformationsquelleAutor Robert Buttigieg | 2015-05-27

  1. 1

    Bitte stellen Sie sicher, dass Sie die folgenden richtigen links enthalten in Ihrem code

    <!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>

    Denn, wenn nichts Los ist, um zu zeigen, da die abhängigen Dateien nicht zugänglich sind.

    Ich habe kopiert diese in meinem text-editor. Das Karussell wurde angezeigt, aber der next-und previous-Tasten funktionieren nicht. Wissen Sie, was mache ich falsch pls? Vielen Dank für Eure Hilfe!!

    InformationsquelleAutor Ty T.

  2. 0

    Sollten Sie rufen für $('.carousel').carousel()
    Siehe: http://getbootstrap.com/javascript/#carousel

    Ich habe kopiert den code aus dem link, den Sie gab mir aber den nächsten und vorherigen Kontrollen immer noch nicht funktionieren.
    ok, können Sie Bearbeiten Ihre Frage, indem Sie Ihre Seite den HTML-code? Auf diese Weise können wir erkennen, was falsch läuft mit Ihrem code!

    InformationsquelleAutor Waiyl Karim

  3. 0

    Können Sie einfach importieren bootstrap-glyphicons.css nach Ihrem stylesheet importieren.

    HTML : 

    <!--Your stylesheet -->
<link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css"> 
<!--To Add GlyphIcon -->
<link rel="stylesheet" type="text/css" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css">

    Das war mein problem mit benutzerdefinierten Designs. Sie waren mit den original-bootstrap-link für die glyphicons:

    CSS : bootstrap-theme.min.css

    @font-face {
  font-family: 'Glyphicons Halflings';
  src: url('../fonts/glyphicons-halflings-regular.eot');
  src: url('../fonts/glyphicons-halflings-regular.eot?#iefix')    format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}

    So können Sie alle importieren Sie diese Datei in Ihrem Projekt und verknüpfen oder benutzen Sie einfach meine erste Lösung

    InformationsquelleAutor Mr Rubix

Schreibe einen Kommentar