Twitter Bootstrap 2.3.2 模型不停留在屏幕上
Twitter Bootstrap 2.3.2 Model not staying on screen
这些都是我链接的Javascript文件:
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
<script src="bootstrap/docs/assets/js/jquery.js"></script>
<script src="bootstrap/docs/assets/js/bootstrap.js"></script>
<script src="bootstrap/docs/assets/js/bootstrap-transition.js"></script>
<script src="bootstrap/docs/assets/js/bootstrap-dropdown.js"></script>
<script src="bootstrap/docs/assets/js/bootstrap-button.js"></script>
<script src="bootstrap/docs/assets/js/bootstrap-collapse.js"></script>
<script src="bootstrap/docs/assets/js/bootstrap-carousel.js"></script>
<script src="bootstrap/docs/assets/js/bootstrap-typeahead.js"></script>
<script src="bootstrap/docs/assets/js/bootstrap-affix.js"></script>
<script src="bootstrap/docs/assets/js/bootstrap.min.js"></script>
<script src="bootstrap/docs/assets/js/holder/holder.js"></script>
<script src="bootstrap/docs/assets/js/google-code-prettify/prettify.js"></script>
<script src="bootstrap/assets/js/application.js"></script>
这些是我链接的所有CSS文件:
<link href="css/bootstrap.min.css" rel="stylesheet" media="all" />
<link href="css/bootstrap.css" rel="stylesheet" media="all" />
<link href="css/style.css" rel="stylesheet" media="all" />
这是我的模型:
<!-- Button to trigger modal -->
<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>
<!-- Modal -->
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel">Modal header</h3>
</div>
<div class="modal-body">
<p>One fine body…</p>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
<button class="btn btn-primary">Save changes</button>
</div>
</div>
我遇到的问题是,当我单击按钮启动模型时,它只会在我的屏幕上弹出 1 秒钟,然后它就会消失。由于某种原因,它没有停留在屏幕上。
嘿,
它对我来说工作正常。杰斯菲德尔演示
此外,您只需要添加bootstrap.css
或bootstrap.min.css
中的任何一个。
实际上bootstrap.min.css
只是bootstrap.css
的压缩版本。
您不需要添加所有 JavaScript 文件。
一个基本的例子:
<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css" rel="stylesheet" media="all" />
<script src="http://getbootstrap.com/2.3.2/assets/js/jquery.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-modal.js"></script>
<!-- Button to trigger modal -->
<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>
<!-- Modal -->
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel">Modal header</h3>
</div>
<div class="modal-body">
<p>One fine body…</p>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
<button class="btn btn-primary">Save changes</button>
</div>
</div>
要测试它,只需将上面的代码复制到文本编辑器中并将其另存为**.html
,然后在某个浏览器上打开它
我发现了我的问题。我需要删除
<script src="bootstrap/docs/assets/js/bootstrap.min.js"></script>
猜猜你不能包括bootstrap.min.js
相关文章:
- 当带有渲染器的DOM元素不在屏幕顶部时,移动了场景的坐标
- 如何知道元素在屏幕上是否可见.如果没有,请滚动页面
- 如何在屏幕外或项目的中心视口中跟随YUI驱动的动画
- 当元素在屏幕中占60%时,WOW.js启动动画
- 用angular js在屏幕上点击播放和暂停html5视频
- Firefox,如何提交表单触发文件下载,但停留在网页上
- Jssor滑块停留在第一个图像上,直到我单击它
- 在屏幕中间打开一个弹出窗口
- 我有一个用幻灯片制作的网页,但幻灯片会在屏幕上移动
- 仅在屏幕媒体上运行javascript/jquery,而不是打印
- 如何使移动的精灵集中在屏幕上
- 如何将弹出窗口居中显示在屏幕上
- HTML/JS 如何输入文本并使其显示在屏幕上
- 在屏幕上显示选择选项图像
- 在屏幕中央显示图像 CSS jQuery
- 在浏览器关闭时,单击确认对话框中的“停留在页面上”,执行一个方法
- 可以'在html中,没有任何东西可以停留在图片上方
- 如何在D3中添加一个强制拖动事件,并使节点停留在我离开它的地方
- 要在屏幕上打印的JavaScript
- 如何使图像无论屏幕高度/宽度如何都停留在屏幕底部