codetree / feedback

A central hub for user feedback for Codetree
https://codetree.com
20 stars 15 forks source link

Slow scrolling in modals on Safari #192

Closed TimonVS closed 8 years ago

TimonVS commented 8 years ago

I noticed that scrolling a modal window is really slow in Safari, and in Chrome it causes another issue:

The modal backdrop scrolls away.

A simple fix is to use position: fixed for .modal-backdrop instead of position: absolute. This will fix the slowness for Safari and the scrolling issue for Chrome.

derrickreimer commented 8 years ago

Upgraded Bootstrap modal, looks like these issues were taken care of by latest changes :+1:

TimonVS commented 8 years ago

@djreimer the issue seems to be resolved for Chrome, but scrolling is still extremely slow in Safari :/.

TimonVS commented 8 years ago

@djreimer could you reopen this issue? It's really frustrating to use Codetree in Safari this way.

TimonVS commented 8 years ago

An easy (but dirty) fix would be to add transform: translate3d(0, 0, 0); to .model-dialog to force GPU rendering.

derrickreimer commented 8 years ago

Thanks for sharing a hack! I'll give that a try 👍

derrickreimer commented 8 years ago

@TimonVS can you give it another try? I deployed the GPU rendering fix you suggested. Seems fine on my machine (comparable to Chrome). I'm running Safari Version 9.1 (11601.5.17.1).

TimonVS commented 8 years ago

@djreimer Still the same problem, and that's because the rule you added (transform: translate3d(0, 0, 0);) gets overridden.

https://i.imgur.com/eJFfFw2.png.

Adding !important solves the problem.

derrickreimer commented 8 years ago

Fixed the specificity problem.