Collapsed Navigation in Full Window

I would like the following to happen when the hamburger icon (collapse) is clicked.

A background area is displayed over the entire window size (100% in height and width), in which the navigation is displayed as .nav or .navbar so that the menu items are below each other and centered in height.

I can’t get it to work somehow. Has anyone here maybe already implemented something like this or can send me the code? That would be really great.

Here is a example.

Thank you for your help.

Regards, Reto