index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Cookies alert popup Tutorial</title>
    <link rel="stylesheet" href="style.css">
</head>
<p><h1><center>day 03</center></h1></p>
<body onload="showModal">
<div id="modalbox">
    <img src="images/cookies.png" class="Cookies=">
    <p>we use Cookies to optimize user experience and content.</p>
    <button type="button" onclick="closeModal()">Accept</button>
    <img src="images/close.png" class="close-icon" onclick="closeModal()">
</div>
<script>
    let modalbox = document.getElementById("modalbox");
    function showModal(){
        setTimeout(() => {
             modalbox.style.display= "block";
        }, 3000);
    }
function closeModal(){
    modalbox.style.display = "none";
}

    
</script>
</body>
</html> 