Streaming live at 10am (PST)

Recreating Facebook Carousel Effect


#1

Is there a way to create a carousel effect similar to fb newsfeed? Basically I'm trying to mockup a mobile only comp with a few horizontal scrolling sections. I do not want the carousel to snap into place on each frame.

Thanks for your help!


#2

can you show us an example?


#3

Hi @PixelGeek I've attached an image here to illustrate the effect. It's not complicated, but I think I may be describing it poorly. I tried using the slideshow effect, but I do not want the carousel to snap into place on each frame.


Carousel-slider
#4

@PixelGeek Any ideas? Thanks!


#5

@spoulos Do you mean something similar to this?

http://westbrookconsulting.co.ke/aboutus.html

Note: please view on a desktop to get the desired effect.


#6

@AlexManyeki That link doesn't work


#7

@spoulos

See below.

View My Video


#8

Yes, that's pretty much the desired effect... but for mobile. I've searched other topics here on horizontal scrollers and it looks like you have to do some trickery with jquery. More complicated than I expected, ugh.


#9

@spoulos Here is the work around. Flex box becomes your best friend. Check out the link below and go to the page called 'horizontal' . You will get a working example there.

https://preview.webflow.com/preview/jean-split-menu?preview=166be23397f07c4975cfd6174094478e


#10

Duh. Not sure why I didn't try flex box-ing. I got the horz scroll to work on mobile. However, you have to swipe left/right... you cannot "flick" it across.

Thanks for your help!


#11

Welcome @spoulos To get the flick effect, thats where the tutorial on horizontal scrollers comes in.


#12

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.