эффект поглощения [требует правки]

257

11 января 2018, 21:10

Как реализовать эффект? Я скроллю в низ и header уезжает в низ, а content на него наезжает!!!

Сайт пример: http://www.refletcommunication.com/en/youth

Я вообще очень плохо пишу код, но копировать и вставлять умею )

Answer 1

Это относится к CSS, а не к JavaScript. Решение установить изображение фоном для элемента body и назначить свойство background-attachment со значением fixed. А элементу который идет следующим за header установить белый цвет фона.

body { 
  background-image: url(http://fillmurray.com/700/500); 
  background-repeat: no-repeat; 
  background-size: cover; 
  background-attachment: fixed; 
} 
header { 
  min-height: 500px; 
} 
main { 
  min-height: 1000px; 
  max-width: 80%; 
  background-color: #fff; 
}