jQuery Icons
Um ein Symbol zu Ihrer hinzufügen <a> und <button> Elemente in jQuery Mobile, das Symbol - Klasse verwenden und das Symbol positionieren , wie unten dargestellt (die einzige Ausnahme ist Buttons in NavBars, die weiter unten dargestellt):
<a href="#anylink" class="ui-btn ui-icon-refresh ui-btn-icon-left ">Refresh Page</a>
Try it
<button class="ui-btn ui-icon-refresh ui-btn-icon-left ">Refresh Page</button>
Try it
Ein Symbol , um Ihr zu addieren <input> Tasten verwenden , um die data-icon Attribut:
<input type="button" value="Refresh page" data-icon="refresh" >
Try it
Um ein Symbol zu Ihren navbar Schaltflächen hinzufügen, verwenden Sie die Daten-Attribut icon:
<a href="#anylink" data-icon="refresh" >Refresh Page</a>
Try it
So fügen Sie ein Symbol , um Ihre Liste Schaltflächen verwenden , um die Daten-Symbol - Attribut auf <li> :
<li data-icon="refresh" ><a href="#">Click me</a></li>
Try it
Im Folgenden haben wir alle verfügbaren Symbole aufgelistet, die jQuery Mobile bietet:
| Wert | Beschreibung | Symbol | Beispiel |
|---|---|---|---|
| action | Aktion (Pfeil nach rechts aus einer Box) | Versuch es | |
| alert | alert | Versuch es | |
| audio | Audio / Sound / Lautsprecher | Versuch es | |
| arrow-d-l | Pfeil nach unten auf der linken Seite | Versuch es | |
| arrow-d-r | Pfeil nach unten auf der rechten Seite | Versuch es | |
| arrow-u-l | Pfeil nach oben nach links | Versuch es | |
| arrow-u-r | Pfeil nach oben nach rechts | Versuch es | |
| arrow-l | Pfeil nach links | Versuch es | |
| arrow-r | Pfeil nach rechts zeigt | Versuch es | |
| arrow-u | Pfeil nach oben | Versuch es | |
| arrow-d | Pfeil nach unten | Versuch es | |
| back | Zurück (gebogener Pfeil gegen den Uhrzeigersinn nach oben) | Versuch es | |
| bars | Bars (drei horizontale Balken übereinander) | Versuch es | |
| bullets | Bullets (drei horizontale Kugeln übereinander) | Versuch es | |
| calendar | calendar | Versuch es | |
| camera | camera | Versuch es | |
| carat-d | Carat nach unten | Versuch es | |
| carat-l | Carat linksweisend | Versuch es | |
| carat-r | Carat nach rechts zeigt | Versuch es | |
| carat-u | Carat zeigt nach oben | Versuch es | |
| check | Häkchen | Versuch es | |
| clock | clock | Versuch es | |
| cloud | cloud | Versuch es | |
| comment | comment | Versuch es | |
| delete | Löschen (X) | Versuch es | |
| edit | Bearbeiten / Bleistift | Versuch es | |
| eye | eye | Versuch es | |
| forbidden | Verbotene Zeichen | Versuch es | |
| forward | forward | Versuch es | |
| gear | gear | Versuch es | |
| grid | grid | Versuch es | |
| heart | Herz / Love Symbol | Versuch es | |
| home | home | Versuch es | |
| info | Information | Versuch es | |
| location | Lage / GPS | Versuch es | |
| lock | Sperren / Padlock | Versuch es | |
| Post / Brief | Versuch es | ||
| minus | minus | Versuch es | |
| navigation | navigation | Versuch es | |
| phone | Telefon | Versuch es | |
| power | Einschalten / Ausschalten) | Versuch es | |
| plus | plus | Versuch es | |
| recycle | recycle | Versuch es | |
| refresh | refresh | Versuch es | |
| search | search | Versuch es | |
| shop | Shop / Pag / Purse | Versuch es | |
| star | star | Versuch es | |
| tag | tag | Versuch es | |
| user | User / Person | Versuch es | |
| video | Videokamera | Versuch es |