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="live" align="center" > <span class="schovat"> <button class="tlacitko" onclick="prohodit('prvnipanel')"> <i></i><img src="/img/album.gif"> </button> </span> <span class="schovat"> <button class="tlacitko" onclick="prohodit('druhypanel');"> <i></i><img src="/img/koncert.gif"> </button> </span> <span class="schovat"> <button class="tlacitko" onclick="prohodit('tretipanel');"> <i></i><img src="/img/youtube.gif"> </button> </span> <br/><br/><br/> <div id="texty"> <div id="prvnipanel" class="schovat"> <div>Text č. 1, který se bude zobrazovat nebo schovávat ...</div> </div> <div id="druhypanel" class="schovat"> <div> <div>Text č. 2, který se bude zobrazovat nebo schovávat...</div> </div> </div> <div id="tretipanel" class="schovat"> <div> <div>Text č. 3, který se bude zobrazovat nebo schovávat...</div> </div> </div> </div> </div>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
#texty .schovat {display: none} /* když je obsah zobrazený, schováme popisek „Zobrazit“ */ .live .ukazat .zobrazit {display: none}
CSS
Autoformát
CSS reset
Až na konci
function prohodit(element) { el = document.getElementById(element); el.style.display = (el.style.display == "block")?"none":"block"; var schov = document.getElementById("texty").getElementsByClassName("schovat"); for (var x = 0; x < schov.length; x++) { if (schov[x].id != el.id) { schov[x].style.display = "none"; } } }
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>