Skip to content

Commit

Permalink
Footer is enhanced
Browse files Browse the repository at this point in the history
  • Loading branch information
AnshDwivedi03 committed Oct 4, 2024
1 parent b3fdfa6 commit 0dd853a
Showing 1 changed file with 44 additions and 0 deletions.
44 changes: 44 additions & 0 deletions serv.html
Original file line number Diff line number Diff line change
Expand Up @@ -89,6 +89,50 @@ <h2>Special Occasions</h2>
</main>
<footer>
<p>&copy; 2024 CabRental. All rights reserved.</p>
<style>
/* Styling the footer */
footer {
background-color: #ee6d6d;
color: white;
text-align: center;
padding: 5px;
display: flex; /* Flexbox */
justify-content: center; /* Center horizontally */
align-items: center;
position: center;
bottom: 0;
width: 100%;
font-size: 14px;
height: 30px;
line-height: 30px;
transform: translateY(100%); /* Initially hidden */
transition: transform 0.8s cubic-bezier(0.25, 0.8, 0.25, 1); /* Smooth animation */
}


body {
margin: 0;
padding-bottom: 80px; /* Space for the footer */
}
</style>
<script>
let lastScrollTop = 0;
const footer = document.querySelector("footer");

window.addEventListener("scroll", function() {
let currentScroll = window.pageYOffset || document.documentElement.scrollTop;

if (currentScroll > lastScrollTop) {
// Scrolling down - footer should appear smoothly
footer.style.transform = "translateY(0)";
} else {
// Scrolling up - hide the footer smoothly
footer.style.transform = "translateY(100%)";
}

lastScrollTop = currentScroll <= 0 ? 0 : currentScroll;
});
</script>
</footer>
</body>
</html>

0 comments on commit 0dd853a

Please sign in to comment.