kra*_*r65 8 html javascript css popover twitter-bootstrap
我正在尝试使用Bootstrap popover.所以我将示例中的确切代码复制到我的网站中,遗憾的是这不起作用.我粘贴了下面的完整代码并在这里创建了一个jsfiddle.
我尝试将它放在一个引导容器中,并且在行和列中,但似乎没有任何效果.
有人如何让这个小提琴起作用？欢迎所有提示!
<!DOCTYPE html>
<html lang="en">
<head>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.min.js"></script>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
</head>
<body>
<button type="button" class="btn btn-lg btn-danger" data-toggle="popover" title="Popover title" data-content="And here's some amazing content. It's very engaging. Right?">Click to toggle popover</button>
</body>
</html>
Seb*_*lor 26
你忘了这个:http: //getbootstrap.com/javascript/#opt-in-functionality
出于性能原因,Tooltip和Popover data-apis是选择加入的,这意味着您必须自己初始化它们.
初始化页面上所有工具提示的一种方法是通过数据切换属性选择它们:
$(function () {
$('[data-toggle="popover"]').popover()
})
<a tabindex="0" class="btn btn-lg btn-danger" role="button" data-toggle="popover" data-trigger="focus" title="Dismissible popover" data-content="And here's some amazing content. It's very engaging. Right?" id="example">Dismissible popover</a>
这个方法是必须的
$('#example').popover('show');