JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<div class="header">
<h1>header</h1>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis fugit laudantium quidem facilis, hic voluptas officia consequatur nesciunt libero vero eum quia reiciendis deleniti doloremque fugiat sit, quam dolorum asperiores.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis fugit laudantium quidem facilis, hic voluptas officia consequatur nesciunt libero vero eum quia reiciendis deleniti doloremque fugiat sit, quam dolorum asperiores.</p>
<button type="button" class="btn btn-secondary ml-5" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">
Tooltip on top
</button>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis fugit laudantium quidem facilis, hic voluptas officia consequatur nesciunt libero vero eum quia reiciendis deleniti doloremque fugiat sit, quam dolorum asperiores.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis fugit laudantium quidem facilis, hic voluptas officia consequatur nesciunt libero vero eum quia reiciendis deleniti doloremque fugiat sit, quam dolorum asperiores.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis fugit laudantium quidem facilis, hic voluptas officia consequatur nesciunt libero vero eum quia reiciendis deleniti doloremque fugiat sit, quam dolorum asperiores.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis fugit laudantium quidem facilis, hic voluptas officia consequatur nesciunt libero vero eum quia reiciendis deleniti doloremque fugiat sit, quam dolorum...
CSS
.header {
position: fixed;
top: 0;
left: 0;
right: 0;
background: #ccc;
}
JavaScript
$(function () {
$('[data-toggle="tooltip"]').tooltip({
trigger: 'hover',
})
})