使引导弹出框在悬停时出现/消失，而不是单击

javascript jquery twitter-bootstrap

2022-08-30 01:25:13

我正在用Bootstrap的Popover构建一个网站，我不知道如何使popover出现在悬停而不是点击上。

我想做的就是当有人将鼠标悬停在链接上而不是单击它时显示一个弹出框，并在他们离开时弹出框消失。文档说可以使用数据属性或jquery。我宁愿用jquery来做，因为我有多个弹出框。

答案 1

将弹出框的选项设置为悬停而不是 ，这是默认的选项。triggerclick

这可以使用标记中的任一属性来完成：data-*

<a id="popover" data-trigger="hover">Popover</a>

或者使用初始化选项：

$("#popover").popover({ trigger: "hover" });

这是一个演示。

答案 2

我想补充一点，对于可访问性，我认为你应该添加焦点触发器：

即$("#popover").popover({ trigger: "hover focus" });