2015-08-16 41 views
10

Sto utilizzando l'ultima versione di Flat UI Pro 1.3.2 (http://designmodo.com/flat/) e sembra che ci sia un problema con il plugin jQuery Flatui- radiocheck v0.1.0 e dispositivi iOS.I plug-in Flat UI Radiocheck plug-in/radio non si attivano più con iOS 8.4.1

Si può vedere il problema quando si carica la pagina di configurazione: http://designmodo.github.io/Flat-UI/

Vai alla sezione con le "bottoni radio" e fare clic sui due pulsanti "radio è accesa" e "Radio è spento "per attivare il pulsante di opzione. Questa commutazione (alternando lo stato "visivamente" e lo stato dell'elemento radio nel DOM) funziona bene in tutti i principali browser desktop (IE, FF, Safari (Windows)).

Tuttavia c'è un problema con Safari su iOS (sto eseguendo l'ultima versione di iOS su un iPhone 4s, 8.4.1): facendo clic sui due pulsanti di opzione non si commuta più il loro stato!

Sembra essere correlato a (possibilmente la nuova versione di) Safari mobile su iOS poiché funziona correttamente sui browser desktop.

Qualsiasi idea o aiuto su come eseguire il debug di questo errore è molto apprezzata!

risposta

3

Sto usando Flat UI Free (2.2.2) e ho scoperto lo stesso problema.

Non sono sicuro del motivo per cui si sta verificando, ma sono stato in grado di risolverlo modificando leggermente il plug-in di radiocheck.

All'interno di flat-ui.js in cui la definizione RadioCheck plugin è che ho cambiato:

// Adding 'nohover' class for mobile devices 
var mobile = /mobile|tablet|phone|ip(ad|od)|android|silk|webos/i.test(global.navigator.userAgent); 
if (mobile === true) { 
    $this.parent().hover(function() { 
     $this.addClass('nohover'); 
    }, function() { 
     $this.removeClass('nohover'); 
    }); 
} 

a:

// Adding 'nohover' class for mobile devices 
if (/iPhone|iPod|iPad/i.test(global.navigator.userAgent)) { //fix for ios 
    $this.addClass('nohover'); 
} else { 
    var mobile = /mobile|tablet|phone|ip(ad|od)|android|silk|webos/i.test(global.navigator.userAgent); 
    if (mobile === true) { 
     $this.parent().hover(function() { 
     $this.addClass('nohover'); 
     }, function() { 
     $this.removeClass('nohover'); 
     }); 
    }  
} 

Non faccio uso di caselle di controllo in modo da non so se sarà effettuato da questo cambiamento.

+0

Grazie per questo suggerimento! Hai provato questo con versioni "più vecchie" del browser iOS, ad esempio Safari di verion 8.4? – Sebastian

+1

Ho provato su un iPad con 8.4 e iPhone con 8.4.1 ma non più vecchio di quello. – en2ie