Autor Zpráva
The Anonym
Profil *
Ahoj, zaujíma ma či sa dá docieliť takého alebo aspoň podobného efektu iba s CSS ako je napr. na www.hokejovysvet.sk/, http://minutky.sk/ a na iných stránkach.

Menu je posunuté od vrchu stránky a má normálnu pozíciu, keď sa ale scrolluje dole a menu dosaihen vrchol okna tak sa zmení pozícia na position: fixed; Ako toho docieliť?
Taps
Profil
The Anonym:
viz http://jecas.cz/fixni-menu
CZghost
Profil
Taps:
Díky :)
The Anonym
Profil *
Stále mi to nefunguje.

CSS:

.nav {
list-style: none; padding: 0; margin: 0; text-align: center
}

    .nav li {display: inline}

.nav a {text-decoration: none; border-bottom: 0; background: #fff; padding: 5px; display: inline-block; width: 100px; line-height: 40px}
 .fixni-menu {position: fixed; left: 0; top: 0; width: 100%; background: #8ECCF0; text-align: center;}    

HTML a JS:

<script>
    var menu = document.getElementById('fixni-menu');
    window.onscroll = function () {
      menu.className = (
        document.documentElement.scrollTop + document.body.scrollTop > menu.parentNode.offsetTop
        && document.documentElement.clientHeight > menu.offsetHeight
      ) ? "fixni-menu" : "";
    }
  </script>
<div id="fixni-menu">
    <nav class="nav">
      <li><a href="#">Odkaz</a></li>
      <li><a href="#">Odkaz</a></li>
      <li><a href="#">Odkaz</a></li>
      <li><a href="#">Odkaz</a></li>
      <li><a href="#">Odkaz</a></li>
    </nav>
  </div>    
       
juriad
Profil
Script přesuň až pod <div> s fixním menu. V době, kde provádí totiž ještě id fixni-menu neexistuje.
Taps
Profil
The Anonym:
Mně to funguje
http://kod.djpw.cz/yeeb-
http://kod.djpw.cz/yeeb
juriad
Profil
Taps:
Funguje ti to protože zadáváš JavaScript zvlášť a nevědomky tak využíváš vymakanosti systému kod.djpw.cz.
CZghost
Profil
juriad:
Ono je nejlepší, když takové skripty se přesouvají až na konec stránky před ukončovací tag </body>. Potom se nemusí řešit, že něco nefunguje.
The Anonym
Profil *
Super, funguje! Vďaka

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: