Obsah
Časová os je užitočný spôsob, ako zobraziť zoznam udalostí na webovej stránke, a interaktívna časová os poskytuje používateľom kontrolu nad zobrazením obsahu. Aj keď existuje veľa spôsobov, ako vytvoriť interaktívnu časovú os, mnohé potrebujú viac ako HTML. Existuje však veľmi jednoduché riešenie HTML: interaktívne posuvné lišty môžete vytvoriť na svojej časovej osi pomocou atribútu HTML „štýl“. Používatelia tak budú môcť voľne pohybovať po obsahu.
Krok 1
Vytvorte svoj súbor HTML. Otvorte nový dokument v textovom editore a vytvorte základnú stránku HTML. Pridajte tento kód do sekcie „body“ kódu HTML:
Oddeľovač („div“) je kontajner na zoznam udalostí na vašej časovej osi. Hodnota „auto“ v poli „pretečenie“ pridáva interaktívne posúvače, keď je časová os dlhšia alebo širšia ako kontajner. Uložte stránku ako „timeline.html“.
Krok 2
Vytvorte obsah. V priestore medzi značkami „div“ pridajte udalosti na časovej osi vzostupne alebo zostupne. Pridajte každú udalosť do svojej dobre formovanej sekcie HTML. Počas práce stránku neustále ukladajte.
Krok 3
Vyskúšajte svoj kód HTML. Vo webovom prehliadači počítača otvorte súbor „timeline.html“. Ak je obsah väčší ako kontajner „div“, uvidíte interaktívny posúvač. Upravte hodnoty „šírky“ a „výšky“ kontajnera tak, aby zodpovedal jeho vertikálnemu alebo horizontálnemu zdvihu.