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="slider"> <figure> <img src="http://demosthenes.info/assets/images/austin-fireworks.jpg" alt=""> <img src="http://demosthenes.info/assets/images/taj-mahal.jpg" alt=""> <img src="http://demosthenes.info/assets/images/ibiza.jpg" alt=""> <img src="http://demosthenes.info/assets/images/ankor-wat.jpg" alt=""> <img src="http://demosthenes.info/assets/images/austin-fireworks.jpg" alt=""> </figure> </div>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
@keyframes slidy { 0% { left: 0%; } 20% { left: 0%; } 25% { left: -100%; } 45% { left: -100%; } 50% { left: -200%; } 70% { left: -200%; } 75% { left: -300%; } 95% { left: -300%; } 100% { left: -400%; } } body { margin: 0; } div#slider { overflow: hidden; } div#slider figure img { width: 20%; float: left; } div#slider figure { position: relative; width: 500%; margin: 0; left: 0; text-align: left; font-size: 0; animation: 30s slidy infinite; }
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>