Zobrazit, Skrýt text-HTML
Ahoj, potřebuju poradit...Kam a jak mám nacpat tenhle kod?
<style>
/* schování tlačítka */
.js .live .schovat div {display: none}
/* nastylování „ikony“ plus nebo mínus */
.live button span:before {content: "+"; display: inline-block; margin-right: .5em; padding: 0 .4em; border-radius: 3px; background: #fff; color: #000}
/* ikona minus bude mít pomlčku */
.live button span.skryt:before {content: "–"}
/* když je obsah schovaný, schováme popisek „Skrýt“ */
.live .schovat .skryt {display: none}
/* když je obsah zobrazený, schováme popisek „Zobrazit“ */
.live .ukazat .zobrazit {display: none}
</style>
<script>
function prohodit(element, prvniTrida, druhaTrida) {
element.className = element.className == prvniTrida ? druhaTrida : prvniTrida;
}
</script>
<div class="schovat">
<button onclick="prohodit(this.parentNode, 'schovat', 'ukazat')"><i></i><span class="zobrazit">Zobrazit</span><span class="skryt">Skrýt</span></button>
<div>Text ke skrytí.</div>
</div>
Protože mi to nějak nefunguje nevím przdroj kodu: zobrazit-skryt
Děkuju moc :)
CSS pises primo do kodu HTML nebo do souboru .CSS?
Do souboru
A mas k nemu dobre napsanou cestu?
Jestli ho mas v souboru, proc pouzivas i <style> v HTML?
Bylo to přibalené k tomu kódu. Jsem začátečnék takže ještě přesně nevím co a jak.
Jak se presne jmenuje ten soubor ".css" a jak mas k nemu nasanou cestu v HTML ?
main.css
<link rel="stylesheet" href="main.css">
Dobre
Takze toto dej do <head>
Ujisti se ze je "main.css" ve stejne slozce jak tvuj index.html, né pod v slozce!
Vymaz z html cely blog <style></style> ten tam nema co delat, kdyz kere kaskady z .css
To samé pro JS
Také do <head>
Mám.
Co mám dělat dál?
Pokud jsi všechno udělal správně, tak už nic.
nevím kam nacpat ty části toho kódu.
<style>
/* schování tlačítka */
.js .live .schovat div {display: none}
/* nastylování „ikony“ plus nebo mínus */
.live button span:before {content: "+"; display: inline-block; margin-right: .5em; padding: 0 .4em; border-radius: 3px; background: #fff; color: #000}
/* ikona minus bude mít pomlčku */
.live button span.skryt:before {content: "–"}
/* když je obsah schovaný, schováme popisek „Skrýt“ */
.live .schovat .skryt {display: none}
/* když je obsah zobrazený, schováme popisek „Zobrazit“ */
.live .ukazat .zobrazit {display: none}
</style>
<script>
function prohodit(element, prvniTrida, druhaTrida) {
element.className = element.className == prvniTrida ? druhaTrida : prvniTrida;
}
</script>
<div class="schovat">
<button onclick="prohodit(this.parentNode, 'schovat', 'ukazat')"><i></i><span class="zobrazit">Zobrazit</span><span class="skryt">Skrýt</span></button>
<div>Text ke skrytí.</div>
</div>
Už sem na to příšel :)
Tak se snama podel