| 523cbe71 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
|
| 7166c650 |
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
|
| 523cbe71 |
<link rel="stylesheet" href="css/myjQModal.css">
|
| 7166c650 |
<style type="text/css">
* {
box-sizing: border-box;
}
.modal-el {
padding: 10em 7.5em;
text-align: center;
}
</style>
|
| 523cbe71 |
</head>
<body>
<div id="background"></div>
|
| 802636fe |
<button data-action="open" data-target="#modal"> open modal! </button>
|
| 7166c650 |
<div class="modal-el" id="modal">
|
| 802636fe |
<button data-action="open" data-target="#modal2"> open modal! </button>
|
| 7166c650 |
This is the first modal!
|
| 802636fe |
</div>
|
| 7166c650 |
<div class="modal-el close-on-click" id="modal2">
|
| 802636fe |
This is the second modal!
</div>
|
| 523cbe71 |
|
| 7166c650 |
<script id="handyModal" data-initialize src="js/handyModal.jquery.js"></script>
|
| 523cbe71 |
</body>
</html>
|