3

I am trying to use the Framer API to implement a horizontal Scroll Component https://www.framer.com/api/scroll/ According to the documentation there is a direction property that can be used to set the direction of the scrolling.

Here's the simple code I have :

     <Scroll height={600} width={200} direction="horizontal">
      <Frame size={300} top={0} bottom={0} left={0}>Hello World!</Frame>
      <Frame size={300} top={0} bottom={0} left={300}>Hello World!</Frame>
    </Scroll>

I notice this code(after inspecting in browser) stacks the frames vertically and so the horizontal scrolling only works for the first frame. I did try setting the css for each frame with position:absolute which positions the frames horizontal to each other... but then the Scroll component doesn't scroll - it just bounces back to the beginning every time I try to scroll)

Has anyone ever gotten this to work? Would appreciate the help big time!

Alex P
  • 407
  • 6
  • 15

1 Answers1

0

Using framer and 'ghost' div, you can create a horizontal slider, which will work with vertical scrolling. Here is the solution: https://codesandbox.io/s/5crke

Andrew Kruglik
  • 182
  • 1
  • 11