Inhalt
Eine Zeitleiste ist eine nützliche Methode, um eine Liste von Ereignissen auf einer Webseite anzuzeigen, und eine interaktive Zeitleiste gibt Benutzern die Kontrolle über die Inhaltsansicht. Während es viele Möglichkeiten gibt, eine interaktive Zeitleiste zu erstellen, benötigen viele mehr als HTML. Es gibt jedoch eine sehr einfache HTML-Lösung: Sie können interaktive Bildlaufleisten auf Ihrer Timeline mithilfe des HTML-Attributs "style" erstellen. Auf diese Weise können sich Benutzer frei im Inhalt bewegen.
Schritt 1
Erstellen Sie Ihre HTML-Datei. Öffnen Sie ein neues Dokument in einem Texteditor und erstellen Sie eine einfache HTML-Seite. Fügen Sie diesen Code im Abschnitt "body" des HTML-Codes hinzu:
Der Teiler ("div") ist ein Container für die Liste der Ereignisse in Ihrer Zeitleiste. Der Wert "auto" in "overflow" fügt interaktive Bildlaufleisten hinzu, wenn die Zeitleiste länger oder breiter als der Container ist. Speichern Sie die Seite als "timeline.html".
Schritt 2
Erstellen Sie den Inhalt. Fügen Sie im Leerzeichen zwischen den "div" -Tags die Ereignisse in der Zeitleiste in aufsteigender oder absteigender Reihenfolge hinzu. Fügen Sie jedes Ereignis in einem eigenen, wohlgeformten HTML-Bereich hinzu. Speichern Sie die Seite kontinuierlich, während Sie arbeiten.
Schritt 3
Testen Sie Ihren HTML-Code. Öffnen Sie die Datei "timeline.html" im Webbrowser Ihres Computers. Wenn der Inhalt größer als der Container "div" ist, wird eine interaktive Bildlaufleiste angezeigt. Passen Sie die Werte für "Breite" und "Höhe" des Containers an seinen vertikalen oder horizontalen Hub an.