Nová ukázka
Reset
Načíst z URL
Uložit a získat odkaz
Vztahuje se k…
Nevyplňujte
Napiště „nejsem robot“
▶
Přepnout zobrazení
Výsledek
<div id=stranka> <div id=hlavicka> <img src=i/100> </div> <div id=vlevo> <p>#<p>#<p>#<p>#<p>#<p>#<p>#<p># </div> <div id=vpravo> <div id=menu> kuk </div> </div> </div> <script> window.onscroll = function() {posun()} </script>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
body { margin: 0; } img { vertical-align: middle; } p { margin: 8em 0; } #stranka { width: 960px; margin: auto; overflow: auto; } #vlevo { background: #fcc; width: 720px; float: left; } #vpravo { width: 240px; float: left; position: relative; } #menu { background: #cfc; min-height: 10em; width: 100%; position: absolute; top: 0; left: 0; }
CSS
Autoformát
CSS reset
Až na konci
function posun() { var co = document.getElementById('menu'); var odrolovano = document.documentElement.scrollTop + document.body.scrollTop; var vyskahlavicky = document.getElementById('hlavicka').offsetHeight; if (odrolovano > vyskahlavicky) { co.style.top=odrolovano-vyskahlavicky+'px'; } else { co.style.top='0'; } }
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>