Skip to content

How can I move <sphere> down to next page with scroll controls?? #1144

Answered by conor-v
git-SwitchBlade asked this question in Q&A
How can I move <sphere> down to next page with scroll controls?? #1144
@git-SwitchBlade git-SwitchBlade
Nov 13, 2022 · 1 comments · 6 replies
Answered by conor-v Return to top
Discussion options

git-SwitchBlade
Nov 13, 2022

You must be logged in to vote
Answered by conor-v Nov 13, 2022

hey @git-SwitchBlade I don't understand 100% what you mean but if you mean how you take it down the page. then here is the code. You had to turn it off the scroll and a distance was needed on the ScrollControls to visually get something in your sandbox.

result:

code:

import { Scroll, ScrollControls } from "@react-three/drei";
import { Html } from "./components/Html";
import { Circularr } from "./components/Object";

const Scene = () => {
  return (
    <>
      <ScrollControls pages={3} distance={1}>
    
        <Circularr />
       
        <Scroll html>
          <Html />
        </Scroll>
       
      </ScrollControls>
    </>
  );
};

export { Scene };
View full answer

Replies: 1 comment 6 replies

Comment options

conor-v
Nov 13, 2022

You must be logged in to vote
6 replies
@conor-v
Comment options

conor-v Nov 13, 2022

@git-SwitchBlade
Comment options

git-SwitchBlade Nov 13, 2022
Author

@conor-v
Comment options

conor-v Nov 13, 2022

@git-SwitchBlade
Comment options

git-SwitchBlade Nov 14, 2022
Author

@conor-v
Comment options

conor-v Nov 14, 2022

Answer selected by git-SwitchBlade
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Category
Q&A
Labels
None yet
2 participants
@git-SwitchBlade @conor-v