Carousel: Next image overlaying scrollbar about jetpack

[blobaugh]

@growthdesigner any ideas here? I found some articles on changing the scrollbar with css but nothing in our code doing it. Nor did I find any articles online dealing with this problem.

[GaryJones]

I can reproduce on on Chrome 32, on Win 7 on that gallery page. I can also make it crash Chrome.

It could be the combination of position: fixed and -webkit-transform: translate3d(...) on .jp-carousel-slide. Translate (and presumably translate3d) create their own local coordinate system, and so fixed positioning is relative to that, not the viewport.

Possible references:

http://stackoverflow.com/questions/15194313/webkit-css-transform3d-position-fixed-issue
https://code.google.com/p/chromium/issues/detail?id=20574
http://meyerweb.com/eric/thoughts/2011/09/12/un-fixing-fixed-elements-with-css-transforms/

Those references tend to go with fixed position of a translated parent, but the combination of both styles on the same element might be causing this explosion above the scrollbar.

[blobaugh]

Ping @growthdesigner

[georgestephanis]

Punting from 2.8, will try to include this with 2.9 in a couple weeks.

[richardmtl]

Mentioned here as well: http://wordpress.org/support/topic/jetpack-carousel-hides-browser-scrollbar?replies=6#post-5187506

I was able to reproduce in Safari 7.0.1 and FF 26 on Win7, but not in FF 26 or 27 in OSX.

[jeherve]

Also reported here:
https://wordpress.org/support/topic/carrusel-impossible-to-use-browser-scroll-bar?replies=1&view=all

[kriskarkoski]

If I understand this issue correctly I can see it in Chrome 52 on OS X 10.11.6 now as well on http://en.support.wordpress.com/images/gallery/

[jeherve]

Closing this for now because of the lack of activity on this. We can always reopen in the future if needed.