Jak zobrazit a skrýt text po kliknutí na tlačítko „Více textu“?

autor: Led 19 2019 Scripty Všechny návody 0 komentářů

HTML kód (script)

Máte na webových stránkách příliš mnoho textu, a potřebujete text zobrazit / skrýt po kliknutí na text např. „Více info„? Čtěte dále …

 

V případě, že máte na webu velké množství textu a chtěli byste tento text elegantně skrýt a po kliknutí na tlačítko např. Více opět zobrazit, postup je následující:

Potřebný kód (script) je:

<script type="text/javascript">
function toggle(obj) {
var obj=document.getElementById(obj);
if (obj.style.display == "block") obj.style.display = "none";
else obj.style.display = "block";
}
</script>
<a href="javascript: void(0);" onClick="toggle('q1')">
CLICKABLE TEXT HERE
</a>
<div id="q1" style="display:none;">
TEXT WHAT U WILL SEE WHEN CLICKED HERE
</div>
view raw show-hide-text.js hosted with ❤ by GitHub

1. Výše uvedený kód (script) je třeba upravit a vložit na Vaše webové stránky. Kód vložte na požadované místo na webu pomocí tlačítka „+“ a „HTML„.

 

2. V html kódu na řádku číslo 10 můžete změnit text na který se kliká. Můžete to přepsat na např. „Víc textu„.

3. V html kódu na řádku číslo 13 můžete upravit text, který se zobrazí po kliknutí na text z řádku číslo 10.

4. Změny publikujte. Výsledek uvidíte jen v publikované verzi webu.

  

Ukážka tlačítka zobraziť viac textu:

Ukážka tlačítka: "Zobraziť viac" KLIKNITE SEM

TIP: Přidejte si web aktuální den a svátek pro CZ nebo SK. Více v návodu Script pro CZ / SK svátek

TIP: Přidejte si do pravého horního rohu ikony sociálních sítí FB a Instagram. Více v návodu Jak přidat ikony soc. sítí (FB a Instagram) do horní části na webu ve Webnode.

Další super návody

Svatební web zdarma

Svatební web zdarma

od Čvc 18 2023

Co je svatební web? Co je svatební stránka? Proč si svatební web vytvořit? Co patří na svatební web? Kolik svatební web stojí? Svatební šablony Jak vytvořit svatební web?Co je svatební web? Co je svatební stránka?V dnešní digitální době se už ani svatba neobejde bez...

On-page SEO nastavení

On-page SEO nastavení

od Čvn 4 2023

On-page SEO nastaveníPár slov na začátekNa téma SEO optimalizace jsme psali také v článcích Jak přidat stránku do vyhledávače Google? a Jak přidat www stránku do katalogu firem Moje Firma od Google?Vítejte v desáté, předposlední části našeho seriálu Tvorba webových...

Nastavení webových stránek

Nastavení webových stránek

od Kvě 30 2023

Nastavení webových stránekPár slov na začátekVítejte v deváté části našeho seriálu Tvorba webových stránek – kompletní návod. Pomalu, ale jistě se blížíme ke konci. V této části se dočtete vše o nastaveních webových stránek vytvořených ve Webnodu. Jak zakoupit doménu?...

Jak přidat článek na web?

Jak přidat článek na web?

od Kvě 23 2023

Jak přidat článek na web?Pár slov na začátekVítejte v osmé části našeho seriálu Tvorba webových stránek – kompletní návod. V této části se zaměříme na články. Přidat nový článek, přejmenovat stávající článek, přidat k článku kategorii či vložit na webové stránky výpis...

Líbil se ti tento návod? Pošli ho přátelům 🙂

Vytvořit web zdarma
Viliam
Follow me
Latest posts by Viliam (see all)
0 0 hlasy
Article Rating
Odebírat
Upozornit na
guest


0 Comments
Nejstarší
Nejnovější Most Voted
Inline Feedbacks
Zobrazit všechny komentáře