include these files
<pre lang="xml"><script src="bootstrap-tooltip.js"></script>
<script src="bootstrap-tooltip-extension.js"></script></pre>
.tooltip.top-left .tooltip-arrow {
bottom: -5px;
left: 5px;
border-width: 5px 5px 0;
border-top-color: black;
}
.tooltip.top-right .tooltip-arrow {
bottom: -5px;
right: 5px;
border-width: 5px 5px 0;
border-top-color: black;
}
.tooltip.bottom-left .tooltip-arrow {
top: -5px;
left: 5px;
border-width: 0 5px 5px;
border-bottom-color: black;
}
.tooltip.bottom-right .tooltip-arrow {
top: -5px;
right: 5px;
border-width: 0 5px 5px;
border-bottom-color: black;
}
<h4 id="top-left" data-toggle="tooltip" data-placement="top-left" data-original-title="Tooltip on top left">Top Left</h4>
<script type="text/javascript">
$('#top-left').tooltip('show');
</script>