Bug 163078
| Summary: | pseudo-element transitions on hover have a delay | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | TylerH <hibbard.tyler> |
| Component: | CSS | Assignee: | Nobody <webkit-unassigned> |
| Status: | NEW | ||
| Severity: | Normal | CC: | hibbard.tyler |
| Priority: | P2 | ||
| Version: | WebKit Nightly Build | ||
| Hardware: | PC | ||
| OS: | Windows 7 | ||
TylerH
When there are two :hover pseudo-classes at play--one for an element's :hover styles and another for a child element's pseudo-element hover styles (see example below)--the transition on the pseudo-element seems to have an erratic delay:
parent:hover {}
parent:hover child::after {}
Removing the initial parent:hover {} styles seem to rectify this issue and cause the pseudo-element's transition to run immediately as expected.
Here's a JSFiddle demo that runs transitions concurrently in Firefox, IE11, even Safari 5.1.7, but has a delay in Chrome:
https://jsfiddle.net/vzpbuk62/3/
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |