Hi All,
I would like to know is there any way to keep both Main Menu and announcement banner fixed / sticked on top of the screen even when we scroll down in dashboards or boards or issues?
I have two styles, one to fix Main menu and other is to fix Announcement banner.
But when I try to add both, Main Menu is getting disappeared.
Announcement banner:
Main Menu:
Can some one help me how to add both and make Main menu and announcement banner fixed on top of the application always.
Regards,
Satya
Hi,
I think it is not a good idea to change the behavior of system elements. It can cause a lot of problems and bugs in the future, so use it with caution!
However, I found out that this code fixes both elements. Try it out, but in a test instance first!
#header {
position: fixed;
top: 0;
width: 100%;
z-index: 1000;
}
Hope it will help you!
HI,
Thanks for the suggestion.
I tried code and seems like its not working.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Hi,
Sorry, I didn’t immediately understand what you wanted
Try pasting this code into your banner
EXAMPLE BANNER TEXT
<style>
#header {
position: fixed;
top: 0;
width: 100%;
z-index: 3000;
}
#announcement-banner {
position: fixed;
top: 0;
width: 100%;
z-index: 1000;
}
</style>
<script>
function adjustOffsets() {
const header = document.getElementById('header');
const banner = document.getElementById('announcement-banner');
const content = document.getElementById('content');
const headerHeight = header.offsetHeight;
const bannerHeight = banner.offsetHeight;
banner.style.top = `${headerHeight}px`;
content.style.marginTop = `${headerHeight + bannerHeight}px`;
}
window.addEventListener('load', adjustOffsets);
window.addEventListener('resize', adjustOffsets);
</script>
This is more complex code. There is i wrote some code that adjust offsets of header and banner elements.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Hi,
It worked.
Thank you
Regards,
Satya
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
That's great! Have a nice day!
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Can i ask you accept answer if it possible?
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Online forums and learning are now in one easy-to-use experience.
By continuing, you accept the updated Community Terms of Use and acknowledge the Privacy Policy. Your public name, photo, and achievements may be publicly visible and available in search engines.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.