How to Add Tooltip in Bootstrap?
Nowdays bootstrap is very famouse framework. If you are macking design using bootstrap then you can easily use tooltip with better design. If you think how to set right side tooltip, or how to set left side tooltip, or how to set top side tooltip and how to set bottom side tooltip then you can set easily. In following example you can i add top side tooltip of button. Mostly we require to add tooltip on icon and button so let's see and if you require to your prject then implement.
Example:
<button class="btn btn-success" rel="tooltip" title="Create new record">Create</button>
<script type="text/javascript">
$(document).ready(function(){
$("[rel=tooltip]").tooltip({ placement: 'top'});
});
</script>
I hope it can help you...
Hardik Savani
I'm a full-stack developer, entrepreneur and owner of ItSolutionstuff.com. I live in India and I love to write tutorials and tips that can help to other artisan. I am a big fan of PHP, Laravel, Angular, Vue, Node, Javascript, JQuery, Codeigniter and Bootstrap from the early stage. I believe in Hardworking and Consistency.
We are Recommending you
- Laravel 9 Bootstrap Auth Scaffolding Tutorial
- How to use Bootstrap Datepicker in Laravel?
- Angular Bootstrap Collapse Example
- How to Use Bootstrap Tooltip in Angular?
- How to use Bootstrap Modal in Angular?
- Bootstrap Maxlength Validation with Count Remaining Characters Example
- JQuery Tooltip Example using JQuery UI Plugin
- AngularJS Tooltip using UI Bootstrap tpls HTML Example
- Bootstrap Datepicker Change Date Format Example
- Bootstrap Colorpicker Example Code
- Bootstrap Timepicker using Datetimepicker JS Example
- How to Use Collapse Example in Bootstrap?
- How to Add Dialog Box in Bootstrap?