40 lines
783 B
Plaintext
40 lines
783 B
Plaintext
---
|
|
---
|
|
<style>
|
|
a {
|
|
font-size: 1.4rem;
|
|
font-weight: 600;
|
|
padding: 1.3rem;
|
|
}
|
|
a:visited {
|
|
color: dimgrey;
|
|
}
|
|
a:hover {
|
|
color: #333;
|
|
}
|
|
a:link {
|
|
color: #ccc;
|
|
}
|
|
</style>
|
|
<div id="main-menu" class="flx space-around" style="top:0;position: sticky; z-index: 7;">
|
|
<a href="/">Home</a>
|
|
<a href="/about/">About</a>
|
|
<a href="/pricing/">Pricing</a>
|
|
<a href="/blog/">Blog</a>
|
|
</div>
|
|
|
|
<script>
|
|
let links = document.querySelector('#main-menu').children
|
|
for (let link of links) {
|
|
console.log(link);
|
|
|
|
link.addEventListener('mouseover', function(e) {
|
|
e.target.style.boxShadow = "rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px";
|
|
});
|
|
link.addEventListener('mouseout', function(e) {
|
|
e.target.style.boxShadow = "";
|
|
});
|
|
}
|
|
|
|
|
|
</script> |