bootstrap关闭弹出框的方法-创新互联

这篇文章给大家分享的是有关bootstrap关闭弹出框的方法的内容。小编觉得挺实用的，因此分享给大家做个参考，一起跟随小编过来看看吧。

在河津等地区，都构建了全面的区域性战略布局，加强发展的系统性、市场前瞻性、产品创新能力，以专注、极致的服务理念，为客户提供成都网站制作、成都网站建设 网站设计制作按需制作,公司网站建设,企业网站建设,成都品牌网站建设,成都全网营销,外贸网站制作,河津网站建设费用合理。

bootstrap关闭弹出框的方法：首先向元素添加“data-toggle=“popover””来创建弹出框；然后使用“data-trigger=“focus””属性来设置在鼠标点击元素外部区域来关闭弹出框即可。

bootstrap弹出框

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

• title 属性的内容为弹出框的标题。

• data-content 属性显示了弹出框的文本内容。

• 默认情况下弹出框显示在元素右侧。可以使用 data-placement 属性来设定弹出框显示的方向: 上：top, 下：bottom, 左：left 或 右：right。

bootstrap怎么关闭弹出框？

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

实现“点击并让弹出框消失”的效果需要一些额外的代码

为了更好的跨浏览器和跨平台效果，你必须使用 标签，不能使用 标签，并且，还必须包含 role="button" 和 tabindex 属性。

推荐：《bootstrap教程》

例：

点我

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

鼠标移动到我这

感谢各位的阅读！关于“bootstrap关闭弹出框的方法”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，让大家可以学到更多知识，如果觉得文章不错，可以把它分享出去让更多的人看到吧！

文章标题：bootstrap关闭弹出框的方法-创新互联
分享URL：http://bzwzjz.com/article/jcdip.html