Message

<!
DOCTYPE html>
<html>
<head>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Syne&display=swap"
rel="stylesheet">
<style>
/* Styling for the popup menu */
.popup {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: white;
z-index: 1;
overflow: auto;
}
.popup-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px;
background-color: #000000;
color: transparent;
font-size: 53px;
font-weight: bold;
font-family: 'Syne', sans-serif;
}
.popup-header button {
background-color: transparent;
border: none;
color: white;
font-size: 20px;
cursor: pointer;
font-size: 35px;
font-weight: bold;
font-family: 'Syne', sans-serif;
}
.popup-content {
padding: 50px;
font-size: 30px;
text-align: center;
:hover red;
}
/* Styling for the menu button */

#menu-btn {
text-align: right;
font-size: 35px;
}
#menu-btn a {
cursor: pointer;
}
/* Styling for the black background when popup is open */

.popup.active {
background-color: black;
opacity: 1;
}
.popup-content a {
text-decoration: none;
}
.jordan:hover {
color: red;
}
.jordan {
color: white;
}
.Yeezy:hover {
color: red;
}
.Yeezy {
color: white;
}
.Sneaker:hover {
color: red;
}
.Sneaker {
color: white;
}
.Cop:hover {
color: red;
}
.Cop {
color: white;
}
.News:hover {
color: red;
}
.News {
color: white;
}
.About:hover {
color: red;
}
.About {
color: white;
}
</style>
</head>
<body>

<div data-mesh-id="comp-l14wd0jwinlineContent-gridContainer" data-testid="mesh-
container-content">
<div id="menu-btn" class="KcpHeO tz5f0K comp-l37591nm wixui-text" data-
testid="richTextElement">
<p class="font_5"><a target="_self" data-popupid="scmeh" role="button" aria-
haspopup="dialog" tabindex="0">MENU</a></p>
</div>
</div>

<div id="popup-menu" class="popup">
<div class="popup-header">
<span>Menu</span>
<a href="https://sneakalize.blogspot.com/p/home.html" style="text-
decoration: none; color: white;"><h2>Sneakalize</h2></a>
<button onclick="closePopup()">CLOSE</button>
</div>
<div class="popup-content">
<ul style="text-align:left;font-family: 'Syne', sans-serif;">
<li><a href="https://sneakalize.blogspot.com/p/jordan_73.html"
class="jordan">Jordan Release Dates</a></li><br>
<li><a href="https://sneakalize.blogspot.com/p/yeezy_3.html"
class="Yeezy">Yeezy Release Dates</a></li><br>
<li><a href="https://sneakalize.blogspot.com/p/footer-comments-
header_3.html" class="Sneaker">Sneaker Release Dates</a></li><br>
<li><a href="https://sneakalize.blogspot.com/p/where-to-cop.html"
class="Cop">Where to Cop</a></li><br>
<li><a href="https://sneakalize.blogspot.com/p/all-news.html"
class="News">ALL NEWS</a></li><br>
<li><a href="https://sneakalize.blogspot.com/p/about.html"
class="About">ABOUT</a></li><br>
<a href="https://www.instagram.com/sneakalize" target="_blank"><img
src="https://cdn.discordapp.com/attachments/1052952755951644702/1082677248701759538
/instagram-icon.png.png" alt="Instagram" height="30"></a>
<a href="https://gr.pinterest.com/kicksculture/" target="_blank"><img
src="https://static.wixstatic.com/media/11062b_9c81fe0a816041068cc7d995e7a01f90~mv2
.png/v1/fill/w_35,h_35,al_c,q_85,usm_0.66_1.00_0.01,enc_auto/
11062b_9c81fe0a816041068cc7d995e7a01f90~mv2.png" alt="Pinterest" height="30"></a>
<a href="https://www.tiktok.com/@sneakalize" target="_blank"><img
src="https://static.wixstatic.com/media/11062b_8e8bb1bfaeb54186ace77d5ab14933ff~mv2
.png/v1/fill/w_35,h_35,al_c,q_85,usm_0.66_1.00_0.01,enc_auto/
11062b_8e8bb1bfaeb54186ace77d5ab14933ff~mv2.png%22%3E" alt="TikTok"
height="30"></a>
</ul>
</div>
</div>
<script>
// Function to open the popup menu
function openPopup() {
document.getElementById("popup-menu").classList.add("active");
document.getElementById("popup-menu").style.display = "block";
}
// Function to close the popup menu

function closePopup() {
document.getElementById("popup-menu").classList.remove("active");
document.getElementById("popup-menu").style.display = "none";
}
// Add event listener to menu button to open popup menu

document.getElementById("menu-btn").addEventListener("click", openPopup);
// Add event listener to menu button to change cursor to pointer on hover
document.getElementById("menu-btn").addEventListener("mouseover", function() {
this.style.cursor = "pointer";
});
// Function to remove cursor pointer when mouse leaves menu button
document.getElementById("menu-btn").addEventListener("mouseout", function() {
this.style.cursor = "auto";
});
// Add event listener to close popup when user clicks outside of it

window.addEventListener("click", function(event) {
if (event.target == document.getElementById("popup-menu")) {
closePopup();
}
});
</script>
</body>
</html>

Message

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Message

Uploaded by

Copyright:

Available Formats

<!

/* Styling for the menu button */

/* Styling for the black background when popup is open */

// Function to close the popup menu

// Add event listener to menu button to open popup menu

// Add event listener to close popup when user clicks outside of it

You might also like