<!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 w w . j a va2 s . c om-->
</head>
<body style='margin: 20px;'>
<script type='text/javascript'>
$(document).ready(function() {
if ($("[rel=tooltip]").length) {
$("[rel=tooltip]").tooltip();
}
});
</script>
<a href="#" rel="tooltip" title="A nice tooltip">test</a>
</body>
</html>
We can use the following statements to control the alignment of a tooltip.
<!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 w w.j a v a2s . c om-->
</head>
<body style='margin: 20px;'>
<script type='text/javascript'>
$(document).ready(function() {
if ($("[rel=tooltip]").length) {
$("[rel=tooltip]").tooltip();
}
});
</script>
<a href="#" rel="tooltip" data-placement="top" title="A nice tooltip">test</a>
</body>
</html>