Funktionserweiterungen für Onlinedokumentation

Auswahl an JavaScript-Bibliotheken und anderen Modulen, mit deren Hilfe Sie eine Onlinedokumentation (Online-Hilfe) mit interessanten Zusatzfunktionen aufwerten können – auch dann, wenn das verwendete Redaktionssystem diese Funktionen nicht unterstützt.

Informationen zu den angegebenen Preisklassen finden Sie unter Preisklassen.

Tabellen, Sortier- und Filterfunktionen

Sortable tables

Preisklasse: kostenlos (Artikel + Code)

DataTables

Kann Tabellen mit einer Vielzahl an Interaktionsmöglichkeiten versehen, wie z. B. Paginierung, Suche, Sortierung, responsive Darstellung usw.

Preisklasse: kostenlos (Open Source)

List.js

JavaScript, das HTML-Listen, HTML-Tabellen und andere Objekte durchsuchbar, sortierbar und filterbar macht.

Preisklasse: kostenlos (Open Source)

MixItUp

jQuery-Plugin zum animierten Filtern und Sortieren von Inhalten.

Preisklasse: niedrig

table-dragger

Ermöglicht es, einzelne Tabellenzeilen oder Tabellenspalten an eine andere Position innerhalb einer Tabelle zu ziehen.

Preisklasse: kostenlos (Open Source)

Code samples for responsive HTML table techniques

Artikel mit verschiedenen Codebeispielen für unterschiedliche Ansätze, um Tabellen auf die eine oder andere Weise responsive zu machen.

Preisklasse: kostenlos (Artikel + Code)

Code samples to make table headers and footers sticky while browsing the table

Artikel mit Live-Demo und Codeschnipseln.

Preisklasse: kostenlos (Artikel + Code)

Funktionen für Bilder und Animationen

Image Map Resize

Ermöglicht es den Benutzern, die Größe von Bildern mit Image Maps zu ändern, wobei die Koordinaten der Image Map angepasst werden.

Preisklasse: kostenlos (Open Source)

Image Zoom

jQuery-Plugin zum Hinzufügen verschiedener Zoom-Funktionen zu einem Bild.

Preisklasse: kostenlos (Open Source)

Zooming

Vergrößert ein Bild auf die volle Bildschirmgröße, wenn das Bild angeklickt wird.

Preisklasse: kostenlos (Open Source)

jfMagnify

Erzeugt eine Lupe, die der Betrachter auf einer ganzen Webseite (nicht nur auf einem Bild) bewegen kann. Die Vergrößerungsstufe lässt sich ändern.

Preisklasse: kostenlos (Open Source)

ImageMapster

jQuery-Plugin zum Hinzufügen verschiedener dynamischer Effekte zu Image Maps, wie z. B. automatisches Hervorheben bei Mouseover, schwebende Tooltips und mehr.

Preisklasse: kostenlos (Open Source)

iTyped

Animierter Schreibmaschineneffekt. Kann als einfacher Blickfang dienen.

Preisklasse: kostenlos (Open Source)

Vivify

Vielseitige CSS-Animationsbibliothek.

Preisklasse: kostenlos (Open Source)

How to Play Animated GIFs onClick

Artikel und Codebeispiele dafür, wie sich ein animiertes GIF erst dann starten lässt, wenn es mit der Maus angeklickt wurde.

Preisklasse: kostenlos (Artikel + Code)

SVG Morpheus

Kann ein SVG-Symbol in ein anderes wandeln.

Preisklasse: kostenlos (Open Source)

SVG Artista

Werkzeug zur Erstellung CSS-basierter Animationen von Strichen und Füllungen in SVG-Bildern. Erzeugt herunterladbaren Code.

Preisklasse: kostenlos (Webanwendung)

Vivus Instant

Werkzeug zur Erzeugung von Strichanimationen aus SVG-Bildern. Erzeugt herunterladbaren CSS-Code.

Preisklasse: kostenlos (Webanwendung)

Freezeframe.js

Bibliothek zum Anhalten animierter GIF-Bilder. Sie können dann die Animation bei Maus-Hover, Mausklick oder manuell aktivieren.

Preisklasse: kostenlos (Open Source)

Registerkarten

tabulous.js

iQuery-Plugin zum Hinzufügen von Registerkarten zum Inhalt einer HTML-Seite.

Preisklasse: kostenlos (Open Source)

Easy Responsive Tabs to Accordion

iQuery-Plugin, das Registerkarten in ein Akkordeon umwandelt, wenn die Breite der Anzeige zu klein für die Registerkarten wird.

Preisklasse: kostenlos (Open Source)

Fixieren von Elementen

Auto Fix Anything

Fixiert die Position eines beliebigen Containerelements. Erkennt automatisch, wann die Position fixiert/aufgelöst werden muss.

Preisklasse: kostenlos (Open Source)

Sticky Sidebar

Sorgt dafür, dass Elemente in einer Sidebar so lange sichtbar bleiben wie gewünscht.

Preisklasse: kostenlos (Open Source)

Headroom.js

Lässt den Seiten-Header beim Scrollen nach unten aus dem Blickfeld verschwinden und beim Scrollen nach oben wieder hineingleiten.

Preisklasse: kostenlos (Open Source)

Funktionen für Bildlauf und Seitenübergang

Scrolling back to the top of a page

Sammlung von JavaScripts, die eine Schaltfläche zum Zurückblättern nach oben anzeigen, wenn der Benutzer auf einer Seite nach unten gescrollt hat.

AnimateScroll

Blättert zu einem beliebigen Teil einer Seite mit verschiedenen Bremseffekten.

Preisklasse: kostenlos (Open Source)

Tiny Scrollbar

Kann verwendet werden, um Inhalte innerhalb eines Bereichs einer Webseite scrollbar zu machen.

Preisklasse: kostenlos (Open Source)

jScrollPane

Konvertiert die Standard-Scrollbars eines Browsers (bei Elementen mit Overflow-Eigenschaft) in eine HTML-Struktur, die mit CSS gestaltet werden kann.

Preisklasse: kostenlos (Open Source)

Animsition

Erzeugt CSS-animierte Seitenübergänge.

Preisklasse: kostenlos (Open Source)

Animated Transition Effects

Kleine Bibliothek mit Seitenübergangseffekten.

Preisklasse: kostenlos (Artikel + Code)

Barba.js

Erzeugt eine Reihe von Seitenübergängen. Erstellt insbesondere einen Übergang zwischen Webseiten, der wie ein Schieberegler mit einer Vor- und einer Zurück-Schaltfläche funktioniert.

Preisklasse: kostenlos (Open Source)

Zusammenklappbare Elemente

jQuery collapser

Preisklasse: kostenlos (Open Source)

:Nutshell

Erzeugt expandierbare Erklärungen in einem Hilfe-Topic. Diese Erklärungen können grundsätzlich alles enthalten, was HTML enthalten kann.

Preisklasse: kostenlos (Open Source)

Inhaltsverzeichnisse und Navigationsbäume

jquery.toc

Erzeugt ein statisches Inhaltsverzeichnis aus dem Inhalt einer Seite.

Preisklasse: kostenlos (Open Source)

Tocify

Erzeugt ein Inhaltsverzeichnis auf der Grundlage der Überschriften einer Seite. Kann mit Bootstrap oder jQueryUI gestaltet werden.

Preisklasse: kostenlos (Open Source)

Tocbot

Erzeugt ein Inhaltsverzeichnis auf der Grundlage der Überschriftenstruktur eines HTML-Dokuments. Keine Abhängigkeiten von anderen Bibliotheken, wie z. B. jQuery.

Preisklasse: kostenlos (Open Source)

pagemap

Fügt ein kleines Sticky-Bild einer Webseite in der oberen rechten Ecke als Navigationshilfe ein.

Preisklasse: kostenlos (Open Source)

Lösungen für eine Sticky-Scroll-Spy-Navigation auf einer Web-Seite

mmenu

Preisklasse: niedrig

Responsive sidebar navigation

Preisklasse: kostenlos (Freeware)

Pushy

Preisklasse: kostenlos (Open Source)

FlexNav

Preisklasse: kostenlos (Open Source)

Sidr

Preisklasse: kostenlos (Open Source)

SmartMenus

Preisklasse: kostenlos (Open Source)

Fixed Nav

Responsives, festes und touch-freundliches Menü sowie animierter Bildlauf für Single-Page-Websites.

Preisklasse: kostenlos (Open Source)

Anchorific

Erzeugt automatisch ein synchronisiertes Menü für einseitige Websites.

Preisklasse: kostenlos (Open Source)

okayNav

Einfaches Menü, das eine „Mehr“-Schaltfläche anzeigt, wenn nicht genügend Platz für alle Einträge vorhanden ist.

Preisklasse: kostenlos (Open Source)

Toolbar.js

jQuery-Plugin, das Tooltip-artig eingeblendete Symbolleisten erstellt.

Preisklasse: kostenlos (Open Source)

Syntax-Highlighting für Quellcode-Beispiele

Prism

Preisklasse: kostenlos (Open Source)

highlight.js

Preisklasse: kostenlos (Open Source)

SyntaxHighlighter

Preisklasse: kostenlos (Open Source)

code-prettify

Preisklasse: kostenlos (Open Source)

Diverse spezielle Anwendungen

Responsive elements

Ermöglicht die Anpassung jedes Elements an die Größe der Fläche, die es einnimmt.

Preisklasse: kostenlos (Open Source)

keyscss

Stylesheet für die Darstellung von Tasten. Hervorragend geeignet, um z. B. Tastenkombinationen zu dokumentieren.

Preisklasse: kostenlos (Open Source)

Rough Notation

Erstellt animierte handgezeichnete Anmerkungen auf Webseiten, wie Unterstreichungen, Kästen, Hervorhebungen usw.

Preisklasse: kostenlos (Open Source)

8 Horizontal Rules and Dividers Enhanced with CSS

Artikel mit Codebeispielen für gestaltete horizontale Linien.

Preisklasse: kostenlos (Artikel + Code)

validate.js

Schlanke Bibliothek zur Formularvalidierung.

Preisklasse: kostenlos (Open Source)

Hovercard

jQuery-Plugin, mit dem Sie Informationen in schwebenden Popup-Fenstern anzeigen können.

Preisklasse: keine Preise veröffentlicht

WeasyPrint

Erzeugt PDF aus HTML. Kann mit CSS formatiert werden.

Preisklasse: kostenlos (Open Source)

Articulate.js

jQuery-Plugin, das Abschnitte einer Webseite unter Verwendung der Web Speech API vorliest.

Preisklasse: kostenlos (Open Source)

share-this

Wenn ein Benutzer einen Text auf einer Seite auswählt, erscheint ein Popup-Fenster. Der Benutzer kann dann den ausgewählten Text per E-Mail oder über soziale Netzwerke weitergeben oder eine Notiz zu dem ausgewählten Text erstellen.

Preisklasse: kostenlos (Open Source)

10 Unique Animated Underline Text Effects with CSS

Diverse Codeschnipsel.

Preisklasse: kostenlos (Artikel + Code)

Styling Links with Real Underlines

Codeschnipsel für die anspruchsvolle Gestaltung von Links.

Preisklasse: kostenlos (Artikel + Code)

HTML Lists with Style

Verschiedene Codeschnipsel für anspruchsvolle Listenstile.

Preisklasse: kostenlos (Artikel + Code)

CSS Line Hover Styles for Links

Sammlung dezenter, ausschließlich mit CSS erstellten Hover-Animationen für Links.

Preisklasse: kostenlos (Artikel + Code)

darkmode.js

Ergänzt eine Option zum Umschalten zwischen einem dunklen Modus (Nachtmodus) und dem normalen Modus einer HTML-Seite.

Preisklasse: kostenlos (Open Source)

clipboard.js

Kopiert den Text eines bestimmten HTML-Elements in die Zwischenablage. Kann z. B. verwendet werden, um das Kopieren von dokumentierten Codebeispielen zu erleichtern.

Preisklasse: kostenlos (Open Source)

Fluid Typography

Kleines Tool, das Ihnen hilft, CSS-Code zu erstellen, um Text an die aktuelle Fenstergröße anzupassen.

Preisklasse: kostenlos (Webanwendung)

Haben Sie von diesem Guide profitiert?
Vielleicht unterstützten Sie im Gegenzug dessen weitere Pflege und erwerben die PDF-Version (ca. 150 Seiten, €9,90) oder eines meiner Bücher?

Danke!

Order the Technical Documentation Tool and Web Guide

Diese Seite wurde zuletzt aktualisiert: 06/2023
Möchten Sie von wichtigen Updates erfahren? Folgen Sie mir auf LinkedIn.

Lust auf mehr? Siehe weitere Tools und Webseiten zum Thema Technische Dokumentation.

Rechtliche Hinweise:
Diese Seite enthält möglicherweise bezahlte, als solche gekennzeichnete Werbeanzeigen. Die verlinkten Webseiten und deren Herausgeber stehen ansonsten in keiner geschäftlichen Beziehung zu indoition Ingenieurbüro für Technische Kommunikation Marc Achtelig und geben nicht dessen Meinung wieder. Copyright verlinkter Inhalte bei deren jeweiligen Rechteinhabern. Beachten Sie die auf den verlinkten Seiten angegebenen Lizenzbedingungen! Mögliche Angaben zu Preisen und Lizenzen auf dieser Seite dienen lediglich der Vorabinformationen und sind ohne Gewähr.