comanch777

Что именно у Вас не получилось?

Создаете header, который будет в себе содержать:

• Слайдер
  
• Навигацию
  

Слайдер будет во весь header 100% на 100%. В слайдере лежат слайды(100% на 100%), которые мы и меняем. Если не умеете писать слайдер, то берите готовое решение.
Вот разметка, которая нужна для плагина:

<div class="siema">
  <div>Hi, I'm slide 1</div>
  <div>Hi, I'm slide 2</div>
  <div>Hi, I'm slide 3</div>
  <div>Hi, I'm slide 4</div>
</div>

Навигация будет position: absolute и прижата к верху top: 0.

ps или слайдер absolute, а nav static. Как для Вас удобнее... Сути не меняет.

Получаем разметку:

<header>
    <section class="slider">
        <div class="slider__slide">  <!-- тут текст и картинка-->  </div>
        <div class="slider__slide">  <!-- тут текст и картинка-->  </div>
        <div class="slider__slide">  <!-- тут текст и картинка-->  </div>
        ....
    </section>
    
    <nav> <!--  тут меню  --> </nav>
</header>

Стили:

header{
    position: relative;
    width: 100%;
    height: 100vh;
}
.slider{
    width: 100%;
    height: 100%;
}
.slider__slide{
    width: 100%;
    height: 100%;
    background: url() cover;
    .....
}


nav{
    position: absolute;
    top: 0;
}

ps что-то такое, если на коленках - https://jsfiddle.net/vg3nb7e0/1/