jQuery Mobile come rimuovere il cerchio rotondo grigio icona

Question

costruisco il mio primo PhoneGap Jquery Appl Im cambiare la mia icona utilizzando questa classe

icona

.ui-icon-myapp-email { 
    background-image: url("app-icon-email.png"); 
} 

Questa usanza è per una visualizzazione elenco, e cerco di rimuovere il sfondo grigio rotondo carico anche la mia immagine è un po 'grande per la forma stavo giocando con il .ui-icon, ma non funziona Cant trovare la classe

voglio solo la mia immagine freccia personalizzato a schermo intero su uno sfondo bianco non elencare senza forma circolare a forma di cerchio Forse c'è un attributo o tramite css per rendere questo grazie

Answer 1

Questo dovrebbe funzionare.

.ui-icon-myapp-email { 
    background:transparent; /* or none */ 
    background-image: url("app-icon-email.png"); 
    /* The following border radius rules will override the circle around your icon */ 
    -moz-border-radius: 0px; 
    -webkit-border-radius:0px; 
    border-radius:0px; 
} 
/* To fix the size issue override the .ui-icon height */ 
.ui-icon{ 
    width:14px; 
    height:20px; 
} 

Answer 2

Sovrascrive il colore del disco dell'icona su bianco.

.ui-icon, 
.ui-icon-searchfield:after { 
    background: #fff /*{global-icon-color}*/; 
    background: rgba(255,255,255,1) /*{global-icon-disc}*/; 
    background-image: url(images/icons-18-white.png) /*{global-icon-set}*/; 
    background-repeat: no-repeat; 
    -moz-border-radius: 9px; 
    -webkit-border-radius: 9px; 
    border-radius: 9px; 
} 

dimensioni Icona è specificato in ui-icon classe che il valore predefinito è 18px.

.ui-icon { 
    width: 19px; 
    height: 19px; 
} 

Answer 3

in ritardo alla festa qui, ma una risposta semplice è quello di aggiungere

background-color: transparent; 
box-shadow: none; 

al tuo nome classe personalizzata, in modo da:

.ui-icon-myapp-email { 
    background-color: transparent; 
    box-shadow: none; 
} 

è tutto ciò che serve.

Answer 4

Con JQuery Mobile 1.3, ora tutto ciò che dovete fare è aggiungere la classe "ui-nodisc-icon", non c'è bisogno di scherzare con il CSS.

da JQuery Website:

"Se non è necessario il cerchio scuro dietro le icone, è sufficiente aggiungere il -NoDisc-icon ui per l'elemento o il suo contenitore per rimuovere l'icona di fondo."

Answer 5

Per quelli di voi che cercano solo un'icona per il pulsante - ho trovato questo articolo molto utile! Ho seguito le sezioni "Reimposta il tema del pulsante" e "Solo icone" per ottenere l'effetto di cui avevo bisogno.

http://appcropolis.com/blog/advanced-customization-jquery-mobile-buttons/

Answer 6

Se si utilizza jQuery v 1.4.0 + allora avete solo bisogno di aggiungere la classe .ui-nodisc-icon al vostro elemento link per rimuovere quel cerchio fastidioso. Non è necessario modificare alcun css o scrivere alcun override.

Answer 7

ho risolto questo problema, utilizzando:

background-color:transparent; 

se si desidera aggiungere colore sfondo si può usare:

background: url(yourimage.png) repeat;