Building modals from scratch is tough. With Bootstrap, you just need HTML data attributes to wire them up to buttons!

The JavaScript Bundle

To use Modals, you must also include the JS bundle in your HTML:

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>

The Trigger Button

<!-- Button trigger modal -->
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal">
  Launch demo modal
</button>

Check the Live Demo to click the button and see a perfectly animated, fully-accessible modal pop up with pure Bootstrap magic!