Forum Discussion

CoenRemmelts's avatar
CoenRemmelts
Community Member
2 months ago

Sidebar behavior (hide in fullscreen)

Hi, 

I'm working on a project where I'd like to have the sidebar collapse/hide when Fullscreen mode for the course is activated and I can't seem to find a way to make this happen. 

I hope someone has a clever solution for this.

Thanks!
Coen

  • Nedim's avatar
    Nedim
    Community Member

    I don't believe there is a default SL setting to achieve this. Try this JavaScript solution to hide the sidebar when entering full screen.

    const sidebar = document.getElementById('sidebar');
    const fullScreen = document.getElementById('full-screen-toggle');
    
    fullScreen.addEventListener('click', () => {
        sidebar.style.display = fullScreen.getAttribute('aria-label') === "Enter full-screen (Ctrl+Alt+F)" ? 'none' : 'block';
    });