I have a popup form that loads when the page first loads in the browser. User requires to complete the form, click submit and the form then closes. At the moment, if the page is refreshed, the popup form opens again. I would like the popup form to remain closed even if the the page is refreshed. This form is for a demonstration only (educational), it doesn’t require validation nor does the data need to be sent anywhere.
Thanks in advance.
I am not sure where to look or what I should be looking for in terms of code required to achieve this.
This is my HTML & JS code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
<link rel="stylesheet" href="style.css">
<title>Document</title>
</head>
<body>
<div id="loginPopup">
<form>
<input type="text" placeholder="Username">
<input type="password" placeholder="Password">
<input id="button" type="submit" value="Log In">
</form>
</div>
<script src="app1.js"></script>
</body>
</html>
$(function() {
$('#loginPopup').hide();
$('#loginPopup').show(2000);
});
$('#button').click(function(event) {
event.preventDefault();
$('#loginPopup').css('display', 'none');
})