Bug 187235 - Glitch during animation
Summary: Glitch during animation
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: Safari 11
Hardware: All macOS 10.13
: P2 Normal
Assignee: Nobody
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2018-07-01 12:00 PDT by Roland Soos
Modified: 2018-07-02 17:05 PDT (History)
3 users (show)

See Also:


Attachments
Screen recording of the glitch (15.02 MB, video/quicktime)
2018-07-01 12:00 PDT, Roland Soos
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Roland Soos 2018-07-01 12:00:17 PDT
Created attachment 344055 [details]
Screen recording of the glitch

Steps to reproduce:
1. Open https://smartslider3.com/full-screen-divi-slider/
2. Switch slides on the right side of the slider with the circled images.

Screen recording attached to the bug.

Happens in:
- Safari Version 11.1.1 (13605.2.8)
- Safari Release 59 (Safari 12.0, WebKit 13606.1.21)

Works fine in
- Chrome
- Firefox
- Edge, IE 11
Comment 1 Simon Fraser (smfr) 2018-07-02 11:09:59 PDT
This looks like a z-ordering layer intersection issue. Do any of the transforms you're using have 3D components?
Comment 2 Roland Soos 2018-07-02 12:13:12 PDT
(In reply to Simon Fraser (smfr) from comment #1)
> This looks like a z-ordering layer intersection issue. Do any of the
> transforms you're using have 3D components?


Yes, I have.
Leafs: Y 20 -> 0, Rotation Y 5deg -> 0deg
Comment 3 Simon Fraser (smfr) 2018-07-02 17:05:39 PDT
So this is a result of the intersection of 3d-transformed layers, which the CSS spec does not correctly deal with yet.