2013-02-17 8 views
6

CKEditor 4.0.1 non riesce a mettere a fuoco quando si tocca nell'area di testo su iOS 6.1 Safari. Questo accade sia su iphone che su ipad (entrambi con iOS 6.1). Alla fine riesco a focalizzarlo toccandolo più volte. A volte occorrono 5 tocchi, a volte occorrono 10 o 15. Se faccio clic sul pulsante in grassetto, si concentra immediatamente. Qualche idea? C'è un modo per me di catturare manualmente l'evento tap e quindi chiamare qualcosa che focalizzerà l'editor? Sto usando jquery.CKEditor non si concentra su iOS quando si tocca nell'area di testo

+0

Ahh ... Ho appena ispezionato il contenuto iframe e ho trovato che l'altezza è alta solo 1 linea ... in altre parole, l'iframe non copre l'altezza dell'area del contenuto. Per mettere a fuoco, è necessario assicurarsi di toccare nella parte superiore dell'area del contenuto. Mi chiedo se c'è un modo semplice per far sì che l'altezza dell'iframe corrisponda all'altezza dell'area del contenuto. – Redtopia

+0

Immagino che aggiungere html {height: 100%;} al css per l'iframe del ckeditor possa fare il trucco. Ma non sono sicuro di dove avrei apportato quel cambiamento. – Redtopia

+0

Sono riuscito a modificare l'altezza dell'elemento html dal file css dell'area editor e ho verificato che l'altezza dell'iframe occupasse l'altezza dell'area del contenuto. Ma questo non risolve il problema. Impostare il corpo per avere un'altezza minima di 100 px rende più semplice mettere a fuoco l'editor, ma è ovviamente solo una correzione temporanea che non risolve completamente il problema. – Redtopia

risposta

2

L'aggiunta di elementi height:100%; a HTML e BODY in editor-test.css risolverà questo problema. codice finale sarà simile a questo:

html {height:100%;} 
body { 
    font-family: "lucida grande",tahoma,verdana,arial,sans-serif; 
    font-size: 12px; 
    line-height:1.4em; 
    color: #333; 
    height:100%; 
} 
+0

L'effetto collaterale di tale modifica è che l'editor avrà sempre una barra di scorrimento. Questo perché il contenuto di iframe ha un margine, quindi il 100% più il margine sarà sempre più alto del viewport. La mia correzione era aggiungere min-height: 250px (o qualunque sia l'altezza iniziale dell'editor è quando viene visualizzato per la prima volta) nell'elemento body. – Redtopia

+0

Ho impostato l'altezza al 100% ma ancora non funziona per me su iphone. qualche altra soluzione? – Faizan

+0

Lo hai impostato per i tag HTML e BODY? Puoi incollare il tuo codice su jsfiddle e condividerlo qui? – trkaplan

1

So che questa è una vecchia questione, ma mi sono imbattuto contro questo di recente.

Nella cartella ckeditor ho modificato il file contents.css. (stili essa il contenuto del redattore)

Nella sezione body, ho aggiunto:

body 
{ 
    /* [other code is left as found] */ 

    /* Add the line below */ 
    min-height: calc(100% - 40px); 
} 

Questo tiene conto delle diverse altezze personalizzati definiti in config.js e il margin: 20px di dichiarazione (che sembra essere di default).

Problemi correlati