Problem with ion-scroll on-scroll


my app need to select time like this:

I have 2 ion-scroll here: left one for hours, right one for minutes.
how ever, when the user scrolls and stops, it may looks like this:

So, I want to align the numbers to grid center automaticly when the scroll completed.

I find this in doc:

on-scroll: Called whenever the user scrolls.

However, that’s not what I want, I want the callback to be triggered only when the scroll completed.

There is a “on-scroll-complete” attr for ion-content, but no such attr for ion-scroll.

How can I achieve what I want? Any advice?


Do you mind putting together a codepen? Seems like it could be a css issue


Thanks mhartington, again.
Maybe I was not clear to describe this issue.
The colors are just background image there.
And the hours and minutes are just vertical list in ion-scroll.
So user can scroll and stop any where, just like in the 2nd screenshot.
What I want to do is:
when user stops scrolling, adjust the position of numbers, to align to the line in background image.
It’s a javascript problem, not css.
if there’s a on-scroll-complete attr here, so I can do what I want in it.