UI with Bootstrap

Tooltips

by Hifni Nazeer

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<div class="row">
  <div class="col-md-6">
    <a href="#" data-toggle="tooltip" data-animation="true" title="Some tooltip text!">Hover over me</a>
  </div>

  <div class="cold-md-6">
    <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>
  </div>
</div>

JavaScript

$(document).ready(function() {
  alert('Hello');

  $(function() {
    $('[data-toggle="popover"]').popover()
  });

});