[Webkit-unassigned] [Bug 164949] -webkit-overflow-scrolling: touch completely breaks 3D perspective functionality

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=164949

--- Comment #12 from Jayden Seric <me at jaydenseric.com> ---
(In reply to Jayden Seric from comment #2)
> Sad to see there has been no activity for over a year for such a visually
> disruptive bug without a decent workaround.
> 
> This is the best I could come up with for displaying a scrollable list of
> cards, stacked on an angle. It looks weird though because there is not a
> single perspective origin:
> 
> .container {
>   perspective: 1000px;
>   overflow: auto;
>   -webkit-overflow-scrolling: touch;
> }
> 
> .child {
>   transform: rotateY(45deg);
> }
> 
> @supports (-webkit-overflow-scrolling: touch) {
>   .container {
>     perspective: none;
>   }
>   .child {
>     transform: perspective(1000px) rotateY(45deg);
>   }
> }

-webkit-overflow-scrolling: touch was deprecated in Safari 13 for iPad (but not iPhone):

https://developer.apple.com/documentation/safari_release_notes/safari_13_release_notes#3314667

This means @supports (-webkit-overflow-scrolling: touch) can't be used anymore for a workaround. The perspective for all the scrollable 3d cards on my live websites are now broken on iPad! Not sure the best way to deal with this, some dirty user agent sniffing?

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20191030/816320a6/attachment.htm>