Scrolling emergency notification bar
.traction-emergency-notification {
position: sticky;
top: 0; /* Adjust this value as needed */
z-index: 1000; /* Ensures it stays above other content */
}
document.addEventListener("DOMContentLoaded", function() {
var notificationBar = document.querySelector(".traction-emergency-notification");
var pageHeader = document.getElementById("page-header");
var headerHeight = pageHeader.offsetHeight;
// Set initial position to just below the header
notificationBar.style.top = headerHeight + "px";
notificationBar.style.position = "absolute";
// Adjust the notification bar position on scroll
window.addEventListener("scroll", function() {
if (window.scrollY >= headerHeight) {
// Fix notification bar to the top of the viewport when header is scrolled past
notificationBar.style.position = "fixed";
notificationBar.style.top = "0";
} else {
// Place notification bar just below the header when scrolled back to top
notificationBar.style.position = "absolute";
notificationBar.style.top = headerHeight + "px";
}
});
});