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 class="platno"> <img src="http://fakeimg.pl/200x130/ff0000/eae0d0/?text=Prvni" id="obrazek1"> <img src="http://fakeimg.pl/200x130/ff0000/eae0d0/?text=Slon" id="obrazek2"> </div> <a href="#" onclick="return zmena('obrazek1',['http://fakeimg.pl/200x130/ff0000/eae0d0/?text=Prvni','http://fakeimg.pl/200x130/00ff00/eae0d0/?text=Druhy','http://fakeimg.pl/200x130/0000ff/eae0d0/?text=Treti']);">Zaměnit spodní</a> <br> <a href="#" onclick="return zmena('obrazek2',['http://fakeimg.pl/200x130/ff0000/eae0d0/?text=Slon','http://fakeimg.pl/200x130/00ff00/eae0d0/?text=Pes','http://fakeimg.pl/200x130/0000ff/eae0d0/?text=Potkan']);">Zaměnit horní</a>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
.platno { position: relative; height: 200px; width: 300px; } #obrazek1 { position: absolute; top: 0; left: 0; } #obrazek2 { position: absolute; top: 65px; left: 100px; }
CSS
Autoformát
CSS reset
Až na konci
function zmena(id, obrazky) { var obrazek = document.getElementById(id); var index = obrazky.indexOf(obrazek.src); index = (index + 1) % obrazky.length; obrazek.src = obrazky[index]; return false; }
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>