这篇文章给大家分享的是有关bootstrap关闭弹出框的方法的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。
创新互联公司从2013年创立,先为凌源等服务建站,凌源等地企业,进行企业商务咨询服务。为凌源企业网站制作PC+手机+微官网三网同步一站式服务解决您的所有建站问题。
bootstrap关闭弹出框的方法:首先向元素添加“data-toggle=“popover””来创建弹出框;然后使用“data-trigger=“focus””属性来设置在鼠标点击元素外部区域来关闭弹出框即可。
bootstrap弹出框
通过向元素添加 data-toggle=“popover” 来创建弹出框。
title 属性的内容为弹出框的标题。
data-content 属性显示了弹出框的文本内容。
默认情况下弹出框显示在元素右侧。可以使用 data-placement 属性来设定弹出框显示的方向: 上:top, 下:bottom, 左:left 或 右:right。
bootstrap怎么关闭弹出框?
默认情况下,弹出框在再次点击指定元素后就会关闭,可以使用 data-trigger=“focus” 属性来设置在鼠标点击元素外部区域来关闭弹出框。
实现“点击并让弹出框消失”的效果需要一些额外的代码
为了更好的跨浏览器和跨平台效果,你必须使用 标签,不能使用
推荐:《bootstrap教程》
例:
点我
如果你想实现在鼠标移动到元素上显示,移除后消失的效果,可以使用 data-trigger 属性,并设置值为 "hover":
鼠标移动到我这
感谢各位的阅读!关于“bootstrap关闭弹出框的方法”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!