Ich bin mir nicht sicher, was ich hier falsch mache, aber ich möchte ein Login-Formular in ein modales Fenster laden. Sobald ich die Klasse der Klasse meines modalen Fensters hinzugefügt habe, verschwindet sie und wenn ich auf meine Schaltfläche klicke, passiert nichts. Ich habe die Fade-Klasse in mein modales Fenster eingefügt und das Fenster erscheint für ein paar Sekunden und verschwindet dann. Ich bin mir nicht sicher, was ich falsch mache, aber hier ist der Code, den ich verwende. Jede Hilfe wird immer sehr geschätzt.Twitter Bootstrap Modal lädt und verschwindet schnell
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<link href="css/bootstrap-responsive.css" rel="stylesheet">
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/custom.css" rel="stylesheet">
</head>
<body>
<a href="#myModal" data-toggle="modal">Login</a>
<div class="modal hide fade" id="myModal" aria-hidden="true">
<div class="modal-header">
<h3>The Sports Freak Login</h3>
</div>
<div class="modal-body">
<form>
<label>Email</label>
<input type="email" class="span4">
<br>
<label>Password</label>
<input type="text" class="span4">
<br><br>
<button type="submit" class="btn btn-success">Logn</button>
<button type="reset" class="btn">Clear</button>
</form>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="js/bootstrap.js"></script>
</body>
</html>
Sie sind nur die Bootstrap ansprechbar CSS-Datei geladen, wenn Sie soll auch die regelmäßige Bootstrap-CSS-Datei wird geladen (vor die reaktionsfreudige), dann zuletzt sollten Sie Ihre benutzerdefinierte CSS-Datei laden. Wenn Sie die neueste bootstrap.js-Datei laden, enthält sie auch alle Bootstrap-JavaScript-Elemente, so dass Sie die separate modal.js-Datei nicht laden müssen. –
Ich denke [das tut, was Sie brauchen] (http://jsfiddle.net/serra/bPSFz/)? Einfach die richtige css/js in die richtige Reihenfolge bringen tut den Trick; Der Rest deines HTML sieht OK aus. – Marijn
Marijin Ich habe die Reihenfolge meiner Stylesheets geändert und es hat funktioniert. Vielen Dank! Billy, ich habe den Code in meinem ursprünglichen Post falsch eingefügt. Ich werde es mit dem richtigen Posting bearbeiten. Danke für den Tipp, die boostrap-modal.js zu entfernen. Es hat perfekt funktioniert. –