Полупрозрачное хедер меню?

Question

[tawiba]

Есть сверстанный макет чет все перепробовал не получаеться сделать чтоб меню было полупрозрачное при прокрутке получилось а вот когда наверху буксую.

wifioblast.ru/test1

Answer 1

[Сергей Горячев]

.header-menu-wrap {
    background: rgba(255, 255, 255, 0.5) !important;
}
.main-section-wrap {
    margin-top: -90px;
}

Вообще не понятно, что на сайте творится :)

Comments

[Сергей Горячев]

.header-menu-wrap {
    background: rgba(255, 255, 255, 0.5) !important;
}
.main-section-wrap {
    margin-top: -90px;
}

Answer 2

[Николай]

Я бы на твоем месте красил псевдоэлемент.

.header-menu-wrap {
  position: relative;
  background-color: transparent;
  z-index: 1;
}
.header-menu-wrap:before {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: white;
  opacity: 0.5;
  content:"";
  z-index: 0;
}

Answer 3

[alex]

Да он и так прозрачный ты просто этого не видишь т.к. body белым цветом залит. Сделай для проверки

#header { background: url(img/furniture.jpg); }
или
body { background: url(img/furniture.jpg); }

и увидишь.

Comments

[tawiba]

ну че, то все равно не догоняю как сделать его полупрозрачным вот когда он вниз съезжает получилось прописать а вверху не получается

[alex]

tawiba: вам Sergey Goryachev написал уже как сделать - background: rgba(255, 255, 255, 0.5) - только вы все равно эту прозрачность не заметите, потому что у вас body белый

[tawiba]

в боди нет беграунда
body {
font-size: 14px;
font-family: "OpenSansRegular";
}

[alex]

tawiba: есть, по умолчанию браузер его белым рисует

[Сергей Горячев]

Alex: ну, воообще, главное это отрицательный маргин, так как элементы все в релативе, но автору пофик, он не слушает)

[tawiba]

ну вот я прошу помощи. чтоб понять где прописать чтоб сделать

[alex]

tawiba: прописать

.header-menu-wrap {
    background: rgba(255, 255, 255, 0.5);
}

тогда твой хедер окрасится в белый цвет с прозрачностью 0.5

Answer 4

[Антон Плашкевич]

opacity: 0.7; поиграйтесь со значением

Comments

[tawiba]

не помогает, когда прокручиваю все ок полупрозрачная а когда наверху заливка

[Антон Плашкевич]

background-color: rgba (color, color, color, opacity); - думаю так будет понятно

[Николай]

Антон Плашкевич: так ты инлайново задаешь в devtolls, а он в стилях. Поэтому у него ничего не меняется.

Answer 5

[tawiba]

не чет не получаеться где то бекграунд левый что ли и за чего в топе не прозрачное =((