Bootstrap 3.3.7 + Vue Popover test
by jgabrielsen
HTML
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-1.1.1.pack.js"></script>
<span id="samplePopover" data-toggle="popover" title="Sample Popover">This text gives me something to hover over.</span>
<div id="popover-test" class="hide">
This is a test
</div>
<p
id="example"
data-toggle="popover"
data-placement="bottom"
data-trigger="hover"
>
Show Popover
</p>
SCSS
#samplePopover {
cursor: pointer;
}
p {
margin: 2em;
float: left;
}
JavaScript
$('#samplePopover').popover({
html : true,
placement : bottom,
trigger : hover,
content : "The Popover Cometh"
});
// enable popovers
$('#example').popover({
content : "The Popover Cometh"
});