Фіксоване горизонтальне меню CSS

фіксоване

Але тільки ви почали опускати сторінку, то тут автоматично спрацьовує і встановлюється в саму стелю монітора і вже буде на весь екран. Воно підійде під блог чи повноцінний інтернет ресурс. Оскільки зараз багато порталів йдуть з різними фіксаторами та елементами на різноманітні ефекти. Де так горизонтальне меню безумовно підійде на такі майданчики. Але головне, воно буде нести функцію навігацій для користувача, який безумовно помітить його.

Тут спостерігаємо його за промовчанням, як приклад, ви тільки зайшли на сайт.

Це ви оберете куди перейти і вже бачимо, що прозорість зникла.

Приступаємо до встановлення:

На початок основний код, який виставляємо, де хочете його бачити.

Таблиця стилів і ставимо до CSS:

/*main menu*/ #menu < text-transform: uppercase; text-align: center; line-height: 50px; background: #69c;

text-shadow:0 1px 1px black; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; > #menu ul #menu li < display: inline; list-style:none; margin: 5px 10px; >

#menu li a < Padding:5px 10px; color:#fff; text-decoration: none;

-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;

#menu li a:hover < background: #36c; color: #ff0;

-webkit-transition-property: color, background; -webkit-transition-duration: 0.5s, 0.5s; > .default < width:920px; > .fixed < position:fixed; top:-5px; left:0; width:100%; Padding:10px 0;

-moz-box-shadow: 5px 5px20px #333; -webkit-box-shadow: 5px 5px 20px #333; box-shadow: 5px 5px 20px #333; > .transbg < background-color: rgba(60, 130, 190, 0.7)!important; >

Потрібно виставити скрипт, що відповідає за фіксацію і тут також його ставимо вгору сайту в hеаd укладаємо.

Якщо у тебе не конструктор uCoz, тому що там йде бібліотека вже в тілі сайту, вам потрібно поставити на сторінках у де де буде меню.