<!DOCTYPE HTML>
<html>
<head>
<link href="http://java2s.com/style/bootstrap.min.css" rel="stylesheet">
<script src="http://java2s.com/style/jquery-1.8.0.min.js"></script>
<script src="http://java2s.com/style/bootstrap.min.js"></script>
<!--from w ww . ja v a2s.c o m-->
</head>
<body style='margin: 20px;'>
<script type='text/javascript'>
$(document).ready(function() {
if ($("[rel=popover]").length) {
$("[rel=popover]").popover();
}
});
</script>
<a rel='popover' href="#" class="btn btn-lg btn-danger"
data-toggle="popover" title=""
data-content="And here's some amazing content. It's very engaging. right?"
data-original-title="A Title">Click to toggle popover</a>
<div class="popover fade right in"
style="top: 19px; left: 252px; display: hide;">
<div class="arrow" style=""></div>
<h3 class="popover-title">A Title</h3>
<div class="popover-content">And here's some amazing content.
It's very engaging. right?</div>
</div>
</body>
</html>
<!DOCTYPE HTML>
<html>
<head>
<link href="http://java2s.com/style/bootstrap.min.css" rel="stylesheet">
<script src="http://java2s.com/style/jquery-1.8.0.min.js"></script>
<script src="http://java2s.com/style/bootstrap.min.js"></script>
<!-- ww w . jav a 2s .c om-->
</head>
<body style='margin: 20px;'>
<script type='text/javascript'>
$(document).ready(function() {
if ($("[rel=popover]").length) {
$("[rel=popover]").popover();
}
});
</script>
<a rel='popover' href="#" data-placement="left"
class="btn btn-lg btn-danger" data-toggle="popover" title=""
data-content="And here's some amazing content. It's very engaging. right?"
data-original-title="A Title">Click to toggle popover</a>
<div class="popover fade right in"
style="top: 19px; left: 252px; display: hide;">
<div class="arrow" style=""></div>
<h3 class="popover-title">A Title</h3>
<div class="popover-content">And here's some amazing content.
It's very engaging. right?</div>
</div>
</body>
</html>