引导模式不工作

我有一个简单的按钮，使用引导程序的模式，这就像一个弹出div。我无法让它工作。当我点击按钮时，没有任何反应。我使用Firefox。我可能忘记了一些简单的事情，但我找不到问题。引导模式不工作

 <!DOCTYPE html> 
     <html> 
      <head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> 
<script type='text/javascript' src='http://twitter.github.com/bootstrap/1.4.0/bootstrap-modal.js'></script> 
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.4.0/bootstrap.min.css"> 

    </head> 
    <body> 

     <a class="btn" data-controls-modal="my-modal" data-backdrop="static" id='mod'>Launch Modal</a> 

    </body> 
    </html>

来源

2011-12-23 kirby

<div class="modal-backdrop fade in" ></div> 
    <div class="modal hide fade in" id="my-modal" style="display: none;"> 
    <div class="modal-header"> 
     <a class="close" href="#">×</a> 
     <h3>Modal Heading</h3> 
    </div> 
    <div class="modal-body"> 
     <p>One fine body…</p> 
    </div> 
    <div class="modal-footer"> 
     <a class="btn primary" href="#">Primary</a> 
     <a class="btn secondary" href="#">Secondary</a> 
    </div>

你必须把这个代码在你的页面主体是弹出（模式）的HTML代码。用于此代码的较少文件是patterns.less。和我的模式是弹出的ID

希望这适用于你。

来源

2011-12-24 11:06:41

我觉得你不需要div类的模态背景。它显示模式时通过引导JavaScript添加。 – 2012-05-31 09:10:51

是否有可能扩展此答案以显示主要和次要按钮如何连接起来以实际执行某些操作。说，小学应打开页面'foo.html'和中学应打开页面'bar.html' – 2012-06-25 22:10:32

我不是专家，但我认为我们可以使用href链接'foo.html'或任何resp文件或也可以使用JavaScript或jQuery的功能来获得这项工作。 – 2012-07-04 09:56:24

另外，请确保您包含css规则来设计背景元素的风格。例如：

.modal-backdrop { 
    position: fixed; 
    top: 0; 
    right: 0; 
    bottom: 0; 
    left: 0; 
    z-index: 1040; 
    background-color: #000000; 
} 

.modal-backdrop.fade { 
    opacity: 0; 
} 

.modal-backdrop, .modal-backdrop.fade.in { 
    opacity: 0.8; 
    filter: alpha(opacity=80); 
}

来源

2012-05-03 15:06:02 Luis

引导模式不工作

回答

相关问题