Implement and export as default the function that controls modal windows.
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal"> Launch demo modal </button> <div class="modal fade" id="exampleModal"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="exampleModalLabel">Modal title 1</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body"> ... </div> </div> </div> </div>
- Buttons of modal windows are found using the data-toggle="modal" selector
- The window's ID is stored in the button's data-target attribute
- To make the window pop up, you need to add the show class and set the display style to block in the element with a relevant id in a data-target
- The cross available by the selector data-dismiss="modal" hides the modal window. Clicking it has the opposite effect, the show class is removed, and display is set to none
For full access to the challenge you need a professional subscription.
A professional subscription will give you full access to all Hexlet courses, projects and lifetime access to the theory of lessons learned. You can cancel your subscription at any time.
hours of theory