Как сделать header c полупрозрачным background?

Question

[LOLIK777]

Подскажите, пожалуйста, как сделать чтобы хедер имел полупрозрачный фон вначале и находился поверх картинки в интро, как будто-бы он имеет положение absolute. Но в активном состоянии он становился затемненным и отталкивал блок интро.
До: skrinshoter.ru/s/071118/1RuBfu0H?a
После: skrinshoter.ru/s/071118/QiTpYlex?a

Answer 1

[Eugene Chefranov]

Cделайте класс например, .active и довешивайте его когда необходимо (при прокрутке или открытии меню).

Comments

[LOLIK777]

Я так пробовала. Получается резкое появление этого блока, а мне необходимо плавно.

[Eugene Chefranov]

LOLIK777, добавьте еще transition: all 0.5s; а прозрачность лучше через rgba

[LOLIK777]

если с плавностью еще можно побороться, то сделать так чтобы интро опускалось, а не находилось под меню хэдер в данном варианте не получается.

[Eugene Chefranov]

LOLIK777, добавил пример в первое сообщение