http://www.buthoney.com

                                                                  【快三购买注册】bootstrap弹窗代码写在哪里-Bootstrap教程

                                                                  如何创建弹出框

                                                                  通过向元素添加 data-toggle="popover" 来创建弹出框。

                                                                  title 属性的内容为弹出框的标题,data-content 属性显示了弹出框的文本内容:

                                                                  <a href="#" data-toggle="popover" title="弹出框标题" data-content="弹出框内容">多次点我</a>

                                                                  注意:弹出框要写在 jQuery 的初始化代码里: 然后在指定的元素上调用 popover() 方法。

                                                                  以下实例可以在文档的任何地方使用弹出框:

                                                                  实例

                                                                  $(document).ready(function(){    $('[data-toggle="popover"]').popover(); });

                                                                  1563332794(1).png

                                                                  指定弹出框的位置

                                                                  默认情况下弹出框显示在元素右侧。

                                                                  可以使用 data-placement 属性来设定弹出框显示的方向: top, bottom, left 或 right:

                                                                  实例

                                                                  <a href="#" title="Header" data-toggle="popover" data-placement="top" data-content="Content">点我</a><a href="#" ,title="Header" data-toggle="popover" data-placement="bottom" data-content="Content">点我</a><a href="#" title="Header" data-toggle="popover" data-placement="left" data-content="Content">点我</a><a href="#" title="Header" data-toggle="popover" data-placement="right" data-content="Content">点我</a>

                                                                  1563332805(1).png

                                                                  相关推荐:《bootstrap入门教程》

                                                                  关闭弹出框

                                                                  默认情况下,弹出框在再次点击指定元素后就会关闭,你可以使用 data-trigger="focus" 属性来设置在鼠标点击元素外部区域来关闭弹出框:

                                                                  实例

                                                                  <a href="#" title(="取消弹出框" data-toggle="popover" data-trigger="focus" data-content="点击文档的其他地方关闭我">点我</a>

                                                                  1563332817(1).png

                                                                  提示:如果你想实现在鼠标移动到元素上显示,移除后消失的效果,可以使用 data-trigger 属性,并设置值为 "hover":

                                                                  实例

                                                                  <a href=]"#" title="Heade[r" data-toggle="popover" data-trigger="ho)ver" data-content="一些内容">鼠标移动到我这</a>
                                                                                  

                                                                  郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。

                                                                  上一篇:李彦宏演示小度音箱全双工免唤醒技术 - 小度音箱,百度,李彦宏
                                                                  下一篇:没有了