Icône jQuery Mobile
Nous pouvons utiliser la classe icon pour ajouter des icônes sur les éléments <a> et <button> dans jQuery Mobile et positionner les icônes comme suit :
<a href="#anylink" class="ui-btn ui-icon-refresh ui-btn-icon-left">Actualiser la page</a>Essayez-le
<button class="ui-btn ui-icon-refresh ui-btn-icon-left">Actualiser la page</button> ;Essayer it
Pour ajouter une icône au bouton <input>, vous pouvez utiliser l'attribut data-icon :
<a href =" #anylink" data-icon="refresh">Actualiser la page</a>Essayez-le
Nous pouvons utiliser l'attribut data-icon sur le bouton de navigation Ajouter une icône :
<a href="#anylink" data-icon="refresh">Actualiser la page</a>Essayer it out
Si vous souhaitez ajouter une icône au bouton de liste, vous pouvez utiliser l'attribut data-icon dans <li> :
<li data-icon="refresh"><a href="#">Cliquez-moi</a></li>Essayez-le
Ci-dessous, nous avons répertorié toutes les icônes disponibles fournies par jQuery Mobile :
| valeur | description | icône | instance |
|---|---|---|---|
| action | action | Essayez-le | |
| alerte | Alerte | Essayez-le | |
| audio | Vidéo/Audio/Haut-parleur | Essayez-le | |
| arrow-d-l | Coin inférieur gauche | Essayez-le | |
| arrow-d-r | Coin inférieur droit | Essayez-le | |
| flèche-u-l | Coin supérieur gauche | | Essayez-le |
| flèche-u-r | Coin supérieur droit | Essayez-le, cliquez | |
| flèche-l | Flèche gauche | Essayez-le | |
| flèche-r | Flèche droite | Essayez | |
| flèche- u | Flèche vers le haut | Essayez-le | |
| flèche-d | Flèche vers le bas | | Essayez |
| retour | Retour | Essayez-le | |
| barres | colonne | Essayez-le | |
| balles | Clôture | Essayez-le | |
| Calendrier | Calendrier | Essayez-le | |
| appareil photo | Caméra | Essayez-le | |
| carat -d | vers le bas | Essayez-le | |
| carat-l | Gauche | Essayez-le | |
| carat -r | droite | Essayez-le | |
| carat - u | up | essayez-le | |
| vérifiez | marque de vérification | Essayez-le | |
| horloge | horloge | Essayez-le | |
| cloud | cloud | Essayez-le | |
| commentaire | Commentaire | Essayez-le | |
| supprimer | Supprimer (X) | Essayez | |
| modifier | modifier/crayon | Essayez-le | |
| oeil | oeil | Essayez-le | |
| interdit | Marque de gare | Essayez-le | |
| avant | avant | Essayez-le | |
| équipement | équipement | essayez-le | |
| grille | grille | Essayez-le | |
| coeur | Signe Coeur/Amour | Essayez-le | |
| maison | Maison (Maison) | Essayez-le | |
| info | Informations | Essayez-le | |
| localisation | Localisation/GPS | Essayez-le | |
| verrouillage | cadenas/cadenas | Essayez-le | |
| Courrier/Enveloppe | Essayez-le | ||
| moins | Symbole, signe moins | Essayez-le | |
| navigation | Navigation | Essayez-le | |
| téléphone | Téléphone | Essayez-le | |
| alimentation | Interrupteur (marche/arrêt) | Essayez-le | |
| plus | plus | Essayez-le | |
| recycler | recycler | essayer | |
| actualiser | Actualiser | Essayez-le | |
| recherche | Recherche | Essayez-le | |
| boutique | Boutique, portefeuille, sac à main | Essayez-le | |
| étoile | étoile | essayez-le | |
| tag | Tag | Essayez-le | |
| utilisateur | utilisateur | | Essayez-le |
| vidéo | Appareil photo | Essayez-le |
