Horizontal list with vertical content scroll

[napcat]

Hello,

I need to create a news feed. The news will be rendered in a horizontal list. That list must have drag/swipe functionality, so the user can navigate between the news. The news content don't have a fixed height, so the content should be vertically scrollable.

I made a simple mock where you can see the wanted interaction.

Is it possible to achieve something like this with the pre built css of this framework? If not, what should I use?

[mcasimir]

Hi @napcat, sure, look at http://mobileangularui.com/demo/#/swipe to see an example that allows you both scroll up and down and detects swipe left/right without conflics.

You should bind a function to navigate on swipe.

If you feel that swipe is not enough, you can try the $drag service instead. Although it may be a little more complicate to setup cause you don't have a directive for that, it would allow you to easily create a reveal effect on the next news or section.

See http://mobileangularui.com/docs/module:mobile-angular-ui.gestures/module:drag/ for help.