- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时,我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
我正在从 Bootstrap 应用模态,但它没有正确关闭。当我点击右上角的关闭按钮时,它崩溃了,当我点击模态上的其他任何地方时,它正常关闭。我尝试了很多次,但这个问题一直存在。
html,
body {
height: 100%;
}
body {
padding-top: 20px;
background: #f9e0b5 ;
background-size:100%;
background-repeat: repeat-y;
}
.pro{
background:linear-gradient(white, #e7d5b5);
margin:10px 40px 0px;
height:250px;
border-radius:30px;
box-shadow:5px 5px 5px black;
cursor:pointer;
}
#pro4{
position:relative;
left:370px;
}
.pro-caption{
font-size:17px;
font-weight:bold;
font-family:"Comic Sans MS", cursive, sans-serif;
color:#6b412b;
background:linear-gradient(white, #f5e5d7);
}
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<!-- row starts-->
<div class="row">
<div class="col-md-3 pro" data-toggle="modal" data-target="#modal1">
<!--modal1-->
<div class="modal fade" id="modal1" role="dialog">
<div class="modal-dialog">
<!--modal1 content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 class="modal-title"> Fresh Milk:Bru Gold Coffee Machine</h3>
</div>
<div class="modal-body">
<img class="image-responsive" src="images/products/Fresh-Milk-Bru-Gold-Coffee-Machine.png" height="270px">
<h4><u><b>Key Features:</b></u></h4>
</div>
</div>
</div></div>
<figure><img class="image-responsive" src="images/products/Fresh-Milk-Bru-Gold-Coffee-Machine.png" height="270px"></figure>
<figcaption class="pro-caption"> Fresh Milk:Bru Gold Coffee Machine</figcaption>
</div>
</div>
最佳答案
如您所见,您已将 data-target 属性设置为 modal1 div,因此您需要有单独的 div,即 <div id="modal1"></div>
您可以在哪里放置您评论过的内容。
<div class="col-md-3 pro" data-toggle="modal" data-target="#modal1"></div>
基本上,您已将您的内容放置在切换弹出窗口的类中,您需要将其取出并将其放置在 <div id="modal1"></div>
中。 , 其余的都很好。
请尝试以下代码。希望对您有所帮助。
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<!-- row starts-->
<style>
html,
body {
height: 100%;
}
body {
padding-top: 20px; /* Required padding for .navbar-fixed-top. Remove if using .navbar-static-top. Change if height of navigation changes. */
background: #f9e0b5 /*#f9cf86*/ ;
background-size:100%;
background-repeat: repeat-y;
}
.pro{
background:linear-gradient(white, #e7d5b5);
margin:10px 40px 0px;
height:250px;
border-radius:30px;
box-shadow:5px 5px 5px black;
cursor:pointer;
}
#pro4{
position:relative;
left:370px;
}
.pro-caption{
font-size:17px;
font-weight:bold;
font-family:"Comic Sans MS", cursive, sans-serif;
color:#6b412b;
background:linear-gradient(white, #f5e5d7);
}
</style>
</head>
<body>
<div class="row">
<div class="col-md-3 pro" data-toggle="modal" data-target="#modal1"></div>
<div id="modal1" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 class="modal-title"> Fresh Milk:Bru Gold Coffee Machine</h3>
</div>
<div class="modal-body">
<img class="image-responsive" src="images/products/Fresh-Milk-Bru-Gold-Coffee-Machine.png" height="270px">
<h4><u><b>Key Features:</b></u></h4>
</div>
</div>
</div>
</div>
</div>
<figure><img class="image-responsive" src="images/products/Fresh-Milk-Bru-Gold-Coffee-Machine.png" height="270px"></figure>
<figcaption class="pro-caption"> Fresh Milk:Bru Gold Coffee Machine</figcaption>
<!--modal over-->`
</body>
</html>
关于html - 我正在从 Bootstrap 应用模态,但它没有正确关闭,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40779247/
我为我的一些问题设置了标签。当搜索 labels="ab"时,我得到了相关的标签,但我似乎找不到询问标签的正确语法!="ab"。如何查询不等于ab的? 最佳答案 != 对我有用,尽管它只显示带有标签的
我最近使用 Visual Studio 2013 Express 配置了 GITHUB 和 Demo GITHub 帐户,即用于练习目的。 Good News is that : I have con
我有一个用于播放和暂停的切换按钮。 这是代码: export default (props) => { let [soundState, setSoundState] = useState({ s
一个 XML 文件被发布到我的 spring mvc 正在响应的 URL。 在 .NET 中,我可以这样做: request.Form[0] request.Form["abc"] 或 request
我们的监控脚本遇到问题。 程序流程为 客户将文件(.csv 格式)ftp/sftp 到“源”目录 Bash 脚本将完成的 .csv 文件重命名为 .aaa 文件 另一个 Bash 脚本将“.aaa”文
如果我开始一个线程: new Thread(() -> { while (running) { try { Thread.sl
我正在制作一个看起来像真正的书的 PDF 阅读器。 我在 ScrollView 中有一个 UIImageView 作为书的背景(想象一本打开的书,有空页)。 UIImageView 的层有 2 个子层
创建 Accordion - 在幻灯片上 - 正在滑动的元素下方的元素似乎向下移动了 px,然后又向上移动,从而产生了颤动效果。 $(document).ready(function() { //Pr
我有一个非常奇怪的问题,但只有在运行 Ubuntu 时才会出现(在 CentOS 上一切正常)。我用 Perl 编写了一个脚本并使用了 Mail::IMAPClient模块。 当我运行以下命令时: p
我知道我可以检查 UITextView 是否正在使用 textViewDidBeginEditing: 进行编辑,但我想检查它是否正在使用 if 语句进行编辑? 最佳答案 使用方法isFirstRes
我正在制作一个简单的点击器类型的游戏。问题是,我的 JPanel 忽略了我设置为每秒更新的 Swing 计时器,而是每毫秒更新一次,即使我删除了计时器也是如此。除了计时器的监听器之外,不会在任何地方调
我有以下代码,应该通过组织列表对每个组织进行 td,对每个组织调用 toString 方法,并将结果打印到控制台和名为 Debug1.tab 的文件。 try { StreamWriter p
我有以下代码用于将文件从 url 下载到 sdcard 。此代码适用于小文件,但当文件大时,我下载的文件大小为 0。任何帮助将不胜感激。 Java 代码 setContentView(R.layout
我有一个必须使用 tomcat 部署的 Angular 项目。 Angular 文件在 dist/project-ui/ 中构建文件夹。我复制了 project-ui文件夹到 webapps tomc
我有一堆切换按钮,下面有标签。如果按钮的标签变得太长,那么下一行的第一个按钮将卡在该标签上。 这是我的代码: https://jsfiddle.net/Android272/c150305z/ 我查了
具有特殊字符的 InnerHTML 正在 trim 数据。 elem.innerHTML = displayedObjects.name; 这里的 displayedObjects.name 包含一个
我已经成功地设置了我的证书和 key ,并使用了在这里找到的 mysql 文档: http://dev.mysql.com/doc/refman/5.1/en/replication-solution
在为游戏制作动画和更新计时器时,我读到任何与 GUI 相关的 Activity 都应该在 EDT 上运行,包括重新绘制屏幕。我正在使用单个 ScheduledExecutorService 来更新和绘
这个问题在这里已经有了答案: 关闭 10 年前。 Possible Duplicate: Large numbers erroneously rounded in Javascript 我正在使用
我已经为 .NET RyuJit 安装了新的 Jit 编译器,并按照安装文档中的说明在 regedit 的 .NetFramework 中设置了 AltJit=* 键。 http://blogs.ms
我是一名优秀的程序员,十分优秀!