由模態背景覆蓋的自舉模型

-1

我有簡單的html頁面來顯示引導模態，但是當我啓動模型時 - 它被模態背景覆蓋，我檢查了myModal - 1040的z-索引和模態背景是1030 檢查了計算器的所有職位，但他們沒有解決我的問題請幫助由模態背景覆蓋的自舉模型

<html> 
<head> 
    <link href="" rel="stylesheet"> 
    <link href="Content/bootstrap.min.css" rel="stylesheet"> 
    <script src="Scripts/jquery-1.10.2.min.js"></script> 
    <script src="Scripts/bootstrap.min.js"></script> 
</head> 
<body> 




    <a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a> 

    <div id="myModal" class="modal hide fade in" aria-hidden="true"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal">X</button> 
      <h3 id="myModalLabel">Log in</h3> 
     </div> 
     <div class="modal-body"> 
      <form class="modal-form" id="loginform"> 
       <input type="text" name="username" placeholder="login" id="username"> 
       <input type="text" name="password" placeholder="password" id="userpassword"> 
      </form> 
     </div> 
     <div class="modal-footer"> 
      <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> 
      <button class="btn btn-success">Login</button> 
     </div> 
    </div> 

</body> 
</html>

來源

2015-12-26 Ira Dev

「檢查了所有文章在stackoverflow」不，你沒有，因爲這是平坦的不可能的。如果你列出*爲什麼/如何*你做的每個帖子檢查沒有幫助，你的問題會好得多;事實上，這種說法只是噪音。 –

其實我複製了很多來自不同網站的模態對話框代碼，這些網站在他們的網站上工作。但不適合我。我玩了一段時間，並得到它的工作。謝謝 –

你忘記了一些東西，它們是：

的<div class="modal-dialog">
的<div class="modal-content">

還增加了一些不必要的事情是：

的hide類的<div id="myModal" class="modal fade in" aria-hidden="true">
的in類的<div id="myModal" class="modal fade in" aria-hidden="true">

你工作的代碼看起來就像這樣：

<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a> 

<div id="myModal" class="modal fade in" aria-hidden="true"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal">X</button> 
     <h3 id="myModalLabel">Log in</h3> 
     </div> 
     <div class="modal-body"> 
     <form class="modal-form" id="loginform"> 
      <input type="text" name="username" placeholder="login" id="username"> 
      <input type="text" name="password" placeholder="password" id="userpassword"> 
     </form> 
     </div> 
     <div class="modal-footer"> 
     <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> 
     <button class="btn btn-success">Login</button> 
     </div> 
    </div> 
    </div> 
</div>

這裏有一個JsFiddle顯示它在工作環境。

要了解的一切模式，請this

希望這有助於！

來源

2015-12-26 02:10:56 Simplicity

非常感謝你，我意識到我的錯誤，並使它的工作，這就是你建議 –

@IdeDev沒有問題，請不要忘記標記你認爲最有用和正確的答案作爲「答案」幫助他人快速找到類似問題的解決方案。 – Simplicity

從你的語氣中取出hide類。

JSFdiddle

<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a> 

<div id="myModal" class="modal fade in" aria-hidden="true"> 
    <div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal">X</button> 
    <h3 id="myModalLabel">Log in</h3> 
    </div> 
    <div class="modal-body"> 
    <form class="modal-form" id="loginform"> 
     <input type="text" name="username" placeholder="login" id="username"> 
     <input type="text" name="password" placeholder="password" id="userpassword"> 
    </form> 
    </div> 
    <div class="modal-footer"> 
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> 
    <button class="btn btn-success">Login</button> 
    </div> 
</div>

來源

2015-12-26 02:08:15

謝謝。它現在的作品現在 –

由模態背景覆蓋的自舉模型

回答

相關問題