2015-04-09 9 views
8

Il mio obiettivo è ottenere un modal bootstrap scorrevole che sia più alto del mio schermo.Bootstrap modal smettere di scorrere su Chrome 41 con mouse scroll/touchpad (ma funziona con i tasti su/giù)

Problema: Su Chrome 41 (ma non 40) in esecuzione sul sistema operativo di Yosemite, il mio modale bootstrap sarebbe interrompere lo scorrimento dopo che si apre se l'altezza dei contenuti è più alto rispetto allo schermo.

Quello che ho cercato è: - Diritto Bootstrap (v.3.3.1) aggiunge automaticamente '.modal-open' per il tag body con la proprietà di 'overflow: hidden;'. Ciò fa sì che il modale sia scorrevole. - Ho regolato le dimensioni della vedova e semplicemente spostando un pixel, il modale è di nuovo scorrevole. - Ho provato ad applicare l'overflow: visibile; e così via sia per il tag del corpo che per il modale stesso ma senza fortuna.

Qualcuno sa qual è questo problema? È un bug introdotto da Chrome 41 su Yosemite? Sto usando Bootstrap 3.3.1 attualmente.

Aggiornamento lo scorrimento con i tasti freccia su/giù funziona bene ma non con lo scorrimento del mouse/touchpad.

+0

dubito che sia operativo correlato. Probabilmente una leggera differenza tra il modo in cui Chrome 40 e 41 interpretano il CSS. Puoi pubblicare il tuo codice? – snowYetis

+0

@snowYetis Accade ogni volta sul modal bootstrap quando il contenuto è più alto dello schermo. Il mio codice è solo un semplice $ ('# selector'). Modal ('show') su un evento click del pulsante. Succede solo su Chrome 41. –

+0

Controlla gli stili modali di bootstrap. Vedi se qualche contiene overflow: nascosto – snowYetis

risposta

13

Ho riscontrato lo stesso problema. Dopo una ricerca rapida ho scoperto che qualcuno lo ha già segnalato su their GitHub e che esiste una correzione effettiva proposta circa sei giorni fa, ma non è stata ancora accettata, il che significa che non è in nessuna versione stabile al momento.

È possibile applicare la correzione proposta nel CSS facilmente:

.modal.in { 
    -webkit-transform: translateZ(0); 
      transform: translateZ(0); 
} 
+0

Questo lo ha risolto per me Linux - chrome –

+0

Questo ha funzionato anche per me su Windows - chrome 44.0.2403. Sembra che questo sia un problema noto con Chrome che gli sviluppatori di bootstrap non correggeranno a causa di altri problemi con translateZ: https://github.com/twbs/bootstrap/issues/16297 –

0

Ho anche questo problema. Win7 Chrome 41 e 42beta & Linux Chrome 41. La mia soluzione temporanea: imposta l'altezza della vista + 1px alla pagina di js per avere la barra di scorrimento sempre attiva.

+0

Ah, capisco. Buono a sapersi che non mi sta succedendo. Eccezionale! La mia soluzione temporanea è quella di avvolgere il cotent all'interno del modale in un div e di impostare l'overflow-y: scorrere in modo che sia scorrevole all'interno del modale. –

Problemi correlati