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
<h1> Sticky menu </h1> <div class="menu"> <a href="#"> Odkaz </a> <a href="#"> Odkaz </a> <a href="#"> Odkaz </a> <a href="#"> Odkaz </a> </div> <div class="content"> <p> Dlouhý obsah </p> </div> <div class="content"> <p> Dlouhý obsah </p> </div> <div class="content"> <p> Dlouhý obsah </p> </div> <div class="content"> <p> Dlouhý obsah </p> </div>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
.menu { position: sticky; position: -webkit-sticky; top: 0; background: #fff; padding: 1em 0; } .menu a { display: inline-block; padding: 1em; background: #8ECCF0; } .content { background: silver; min-height: 50vh; padding: 1em; margin: 1em 0; }
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>