Autorius Tema: Fiksuota meniu  (Skaityta 1111 kartus)

Neprisijungęs Kalnų karalius

  • Naujokas
  • *
  • Įrašai: 104
  • Karma: +0/-0
    • Žiūrėti profilį
Fiksuota meniu
« Įrašytas: 2013-07-19 22:03:51 pm »
Turbūt esate šen bei ten matę fiksuotus meniu. Dažniausiai tai būna viršutinis meniu, labai retai apatinis meniu/copyright, kurie neišnyksta slenkant puslapį ir išsilaiko savo pozicijoje. Tai labai paprastam ir aš jums tai parodysiu. Tiesą sakant bet ką galima padaryti fiksuota pozicija.

Taigi mes darysim trijų dalių web puslapį.

<html>
<head>
<style>
div { display: block; }
div#menu {
 top: 0; left:0;
 position: fixed;
 height: 50px;
}

div#content {
 margin: 50px 0;
}

div#bottom{
 bottom: 0; left:0;
 position: fixed;
 height: 50px;
}
</style>
</head>
<body>
<div id="menu">Menu | Menu | Menu</div>
<div id="content">Turinys, dinaminis turinys, kartoti tekstą kol netilps ekrane.</div>
<div id="bottom">&copy 2013</div>
</body>
</html>

Priklausomai nuo norimos pozicijos, reikia nurodyti top ar bottom reikšmę į 0 kuri atitinkamai reikš kad nuo viršaus arba apačios bus neatitraukta. left - nuo kairės. Kitas blokas einantis po fixed bloko būna užlipęs ant fixed bloko, todėl būtina  patraukti nuo viršaus ir apačios "mechaniniu būdu". Reikia nurodyti margin-top ir/ar margin-bottom reikšmę per tiek kiek yra fixed elementas.
4c61626173212

Manualai.lt Forumas

Fiksuota meniu
« Įrašytas: 2013-07-19 22:03:51 pm »