angular-ui / angular-ui/ui-scroll

Plugin acts weirdly when list items feature CSS transition

Open
#41 0 comments 1 reaction 0 assignees View on GitHub
Dominant language
JavaScript
Stars
326
Forks
104
PR merge metrics
No merged PRs in 30d

Description

I ran into a weird issue where the list to be scrolled started to _jump_ around crazily when new data was loaded (See here: https://github.com/parklab/refinery-platform/issues/852) and I figured out that this was caused by the following styling on list items:

```
li {
transition: height 0.2s ease;
}
```

It makes sense in a way as JS probably relies on the immediate application of the adjusted height of the first pseudo list item. A simple fix would be to disable transitions on that pseudo list item via JS since element styles can't be overwritten by CSS.

**CSS Fix:**

```
li {
transition: all 0.2s ease;
}
li:first-child {
transition: none !important;
}
```

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.