Luongo Vincenzo - Blog » jQuery Mobile https://history.luongovincenzo.it/websites/my_website/v6/blog Ciò che non conoscete vi potrebbe danneggiare - Kevin Mitnick Mon, 09 Dec 2013 11:04:30 +0000 it-IT hourly 1 http://wordpress.org/?v=3.7.1 [jQuery Mobile] How to delete the border-radius from the tag Flip Switch https://history.luongovincenzo.it/websites/my_website/v6/blog/jquery-mobile-eliminare-il-border-radius-dal-tag-flip-switch/ https://history.luongovincenzo.it/websites/my_website/v6/blog/jquery-mobile-eliminare-il-border-radius-dal-tag-flip-switch/#comments Wed, 25 Sep 2013 13:13:20 +0000 http://www.luongovincenzo.it/blog/?p=77 Salve a tutti,

in questo articolo spiegerò come eliminare il border radius dal tag custom Flip Switch.

La versione che andremo a trattare è l’ultima stabile, ovvero la 1.3.2 .

Le classi che richiedono la personalizzazione sono:

.ui-btn-corner-all
.ui-corner-all
.ui-slider-switch

Per eliminare il border-radious (bombatura o arrotondamento) di questi “oggetti” basta implementare dopo l’inclusione del css di jquery mobile il seguente style:

 
.ui-btn-corner-all,
.ui-corner-all,
.ui-slider-switch {
 
    -webkit-border-top-left-radius: 0px !important;
    -webkit-border-top-right-radius: 0px !important;
    -webkit-border-bottom-right-radius: 0px !important;
    -webkit-border-bottom-left-radius: 0px !important;
 
    -moz-border-radius-topleft: 0px !important;
    -moz-border-radius-topright: 0px !important;
    -moz-border-radius-bottomright: 0px !important;
    -moz-border-radius-bottomleft: 0px !important;
 
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
 
}

Così facendo avrete il vostro flip switch completamente esente dal border radius.

DEMO: http://jsfiddle.net/e26ac/1/

Saluti :D

]]> https://history.luongovincenzo.it/websites/my_website/v6/blog/jquery-mobile-eliminare-il-border-radius-dal-tag-flip-switch/feed/ 2