我们能否以与模态相同的方式使弹出窗口被解雇,即.当用户点击它们之外的某个地方时,让它们关闭？
不幸的是我不能只使用真正的模态而不是弹出模式,因为模态意味着位置:固定并且不再是弹出模式.:(
我试图在引导程序弹出窗口中显示HTML,但不知何故它不起作用.我在这里找到了一些答案,但它对我不起作用.如果我做错了,请告诉我.
<script>
$(function(){
$('[rel=popover]').popover({
html : true,
content: function() {
return $('#popover_content_wrapper').html();
}
});
});
</script>
<li href="#" id="example" rel="popover" data-content="" data-original-title="A Title">
popover
</li>
<div id="popover_content_wrapper" style="display: none">
<div>This is your div content</div>
</div>
我正在使用Bootstrap 3设计一个页面.我试图placement: right在输入元素上使用popover .新的Bootstrap确保如果你使用form-control你基本上有一个全宽输入元素.
HTML代码看起来像这样:
<div class="row">
<div class="col-md-6">
<label for="name">Name:</label>
<input id="name" class="form-control" type="text"
data-toggle="popover" data-trigger="hover"
data-content="My popover content.My popover content.My popover content.My popover content." />
</div>
</div>
在我看来,弹出窗口宽度太低,因为它们不是div中剩下的任何宽度.我想在左侧输入表格,在右侧输入一个宽的弹出窗口.
大多数情况下,我正在寻找一个解决方案,我不必覆盖Bootstrap.
随附的JsFiddle.第二个输入选项.没有使用jsfiddle很多,所以不知道,但尝试增加输出框的大小来查看结果,在较小的屏幕上甚至看不到它. http://jsfiddle.net/Rqx8T/
我使用Twitter的引导的酥料饼这里.现在,当我在滚动的酥料饼的文本酥料饼的出现从只是文字<a>的data-content属性.我想知道是否有任何东西放在<div>弹出窗口内.潜在地,我想在那里使用php和mysql,但如果我能得到div工作,我想我可以弄清楚剩下的.我尝试将数据内容设置为divID,但它没有用.
HTML:
<a class='danger'
data-placement='above'
rel='popover'
data-content='#PopupDiv'
href='#'>Click</a>
我正在一个bootstrap站点上工作,在从2.0更新到bootstrap 2.2之后,除了popover之外一切正常.
弹出窗口仍然很好,但它们并没有显示在所有其他元素之上.
<div> // this sits on top of the popover. this did not happen before cleaning up scripts.
<div> //popover shows on top of this
<div> //popover shows on top of this
//link here with popover in it.
</div>
</div>
</div>
任何人都知道为什么弹出窗口的行为发生了变化,或者我如何解决它？谢谢.
我正在使用twitter boostrap的popover来创建一个显示用户信息的悬停卡,我在这里触发mouseover检查jsfiddle上的popover.我想在它徘徊时保持这个popover活着.
<a href="#" id="example" class="btn btn-danger" rel="popover" >hover for popover</a>
$('#example').popover({
html : true,
trigger : 'manual',
content : function() {
return '<div class="box"></div>';
}
});
$(document).on('mouseover', '#example', function(){
$('#example').popover('show');
});
$(document).on('mouseleave', '#example', function(){
$('#example').popover('hide');
});
你可以想到facebook悬停卡的工作.我想以同样的方式.我怎样才能做到这一点？
<div class="container">
<div class="row" style="padding-top: 240px;">
<a href="#" class="btn btn-large btn-primary" rel="popover"
data-content="<form><input type="text"/></form>"
data-placement="top" data-original-title="Fill in form">Open form</a>
</div>
</div>
我猜我会将表单内容存储在javascript函数中...
javascript jquery popover twitter-bootstrap twitter-bootstrap-3
我可以很容易地使用bootstrap使弹出窗口出现,我也可以使用标准的jQuery验证插件或jQuery验证引擎进行验证,但我无法弄清楚如何将其中一个提供给另一个.
我认为我需要的是一些钩子,当它想要显示通知时由验证器调用,给它一个将消息和目标元素传递给弹出窗口的闭包.这似乎是一种依赖注入.
理论上一切都很好,但我无法弄清楚钩子的位置,或者即使在任一验证引擎中都存在.他们似乎都有责任负责显示通知,包括各种精心设置的放置,包装器,样式选项,当我所有人都是错误类型(我不一定需要消息文本)和它相关的元素至.我找到了整个表单的钩子,而不是单独的通知.
我更喜欢使用类来定义规则的验证系统,因为它们与动态创建的表单很好地配合.
任何人都有解决方案或更好的主意？
我已经远远地搜索了互联网,而我发现这个stackoverflow帖子很有见地是否有可能根据屏幕宽度改变Bootstrap popovers的位置？,它仍然没有回答我的问题,可能是由于我理解位置/偏移的麻烦.
这就是我想要做的.我希望Twitter Bootstap Popover位置正确,除非热点popover将定位在视口之外,然后我希望它定位为LEFT.我正在制作一个有热点的iPad网络应用程序,当你按下热点时,会出现信息,但是当水平滚动被锁定时我不希望它出现在视口之外.
我在想它会是这样的:
$('.infopoint').popover({
trigger:'hover',
animation: false,
placement: wheretoplace
});
function wheretoplace(){
var myLeft = $(this).offset.left;
if (myLeft<500) return 'left';
return 'right';
}
思考？谢谢!
JS:
$(function(){
$("#example").popover({
placement: 'bottom',
html: 'true',
title : '<span class="text-info"><strong>title</strong></span> <button type="button" id="close" class="close">×</button>',
content : 'test'
})
$('html').click(function() {
$('#close').popover('hide');
});
});
HTML:
<button type="button" id="example" class="btn btn-primary" ></button>
我写的你的代码不显示你的弹出窗口.
有谁遇到过这个问题？