In einem meiner letzten Blogposts habe ich beschrieben wie man sich ein Panel in jQuery Mobile erstellt. Dies ist nun nicht mehr notwendig. Auf der jQuery Mobile Webseite findet sich nämlich eine neue Version, die 1.3.0 RC1. Diese ist zwar noch als unstable markiert trotzdem lohnt sich schon jetzt ein Blick darauf. Ein weiteres interessantes Features ist neben dem angesprochenem Panel und das Feature "Responsive Tables".
In diesem Post möchte ich erst mal auf das Panel eingehen. Dieses war in den vorherigen Versionen nicht vorhanden. Wollte man trotzdem eine ähnliche Funktion haben, musste man ein Popup dafür nutzen und umschreiben. Das ist mir der neuen Version nun vorbei. Mit ein wenig Quelltext lässt sich dieses Panel nun realisieren.
<div data-role="panel" id="mypanel"> <!-- panel content goes here --> </div>
Das war es schon und das Panel kann befüllt werden. Zum Vergleich einmal den Verweis zum alten Blogpost mit dem viel aufwendigerem Quellext. Es gibt noch weitere Konfigurationsoptionen, z.B. data-display. Damit kann man festlegen, ob sich das Panel drüberlegt (overlay) oder den Content zur Seite schiebt (Push).
Das Panel lässt sich dann einfach per Link oder Button öffnen.
<a href="#mypanel">Open panel</a>Es gibt noch weitere Konfigurationsmöglichkeiten, die der Dokumentation zu entnehmen sind.
Mit diesem Panel lassen sich einfache Navigationen für mobile Webseiten. Daher war es nur logisch das dieses Feature integriert wurde. Sobald die 1.3. als stable-Version verfügbar ist, sieht dieses Panel sicher auf noch mehr mobilen Webseiten.