Popover

Popover

Example Popover

Usage

<div class="slds-p-top_medium" role="group">
    <button type="button" class="slds-button slds-button_neutral" data-container="body" data-toggle="popover" data-placement="left" title="Popover title" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">Tooltip on left</button>
  </div>
  <div class="slds-p-top_medium" role="group">
    <button type="button" class="slds-button slds-button_neutral" data-container="body" data-toggle="popover" data-placement="top" title="Popover title" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">Tooltip on top</button>
  </div>
  <div class="slds-p-top_medium" role="group">
    <button type="button" class="slds-button slds-button_neutral" data-container="body" data-toggle="popover" data-placement="bottom" title="Popover title" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">Tooltip on bottom</button>
  </div>
  <div class="slds-p-top_medium" role="group">
    <button type="button" class="slds-button slds-button_neutral" data-container="body" data-toggle="popover" data-placement="right" title="Popover title" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">Tooltip on right</button>
  </div>

<script>
  $(function () {
    $('[data-toggle="popover"]').popover()
  })
</script>