TechBlog bei SYNTAXYS

Das Seitensteuerungs-Plugin erzeugt eine Touch-Drag-Navigation zwischen den einzelnen HTML-Seiten. Fügen Sie einfach dieses Plugin Ihrer Seite hinzu und verknüpfen die Dokumente miteinander über gewöhnliche HTML-Anker.

Die verlinkten Seiten werden vorab geladen und in Browsern, die Touch-Events unterstützen, kann man sich per Wischen zwischen den Seiten bewegen, während Desktop-Anwender mit Maus oder Tastatur navigieren können. Wie alle Navigationsobjekte in jQuery Mobile, erzeugt dieses Plugin Beziehungen in der Browser-Historie, so daß Bookmarks und die Verwendung des Zurück-Buttons wie erwartet funktionieren.

Funktionsweise

• Die Dateien jquery.mobile.pagination.css und jquery.mobile.pagination.js müssen in den jeweiligen Seiten referenziert sein.
• Der folgende HTML-Code kann irgendwo in jedem Dokument platziert werden, das per Fingerwisch ziehbar sein soll. Die Links sollten auf die jeweils vorhergehenden und nachfolgenden Seiten verweisen.

<ul data-role="pagination">
	<li class="ui-pagination-prev"><a href="2.html">Zurück</a></li>
	<li class="ui-pagination-next"><a href="4.html">Vorwärts</a></li>
</ul>

Download bei Github

Der Code ist Open Source Software, so wie über die MIT oder GPL lizenziert und daher zur freien Verwendung verfügbar – genauso wie jQuery Mobile selbst. Die Bibliothek ist bei Github zu bekommen:

• https://github.com/filamentgroup/jqm-pagination
• Demo des Plugins beim Hersteller