• 카테고리

    질문 & 답변
  • 세부 분야

    웹 개발

  • 해결 여부

    미해결

canvas에서 스크롤 값을 이용하려면 어떻게 해야하나요?

22.03.24 01:25 작성 조회수 756

0

만약 canvas에서 스크롤 값에 따라 무언가를 움직이거나 나타나게 하려면 어떻게 해야하나요??

답변 1

답변을 작성해보세요.

0

스크롤 이벤트는 독립적이기 때문에, 일반 html 엘리먼트를 컨트롤 하든 canvas에서 하든 똑같습니다.
그치만 canvas는 그림을 그리는 방식이 전혀 다르기 때문에, 사용법을 따로 공부하셔야 하는거지요~
일반 html 엘리먼트에서는 CSS의 값을 조정한다고 하면, canvas에서는 해당 드로잉 메서드의 좌표 부분에 그 값을 넣어주는 식입니다.
context.fillRect(0, 0, 500, 500);
예를 들어 이 코드는 500 크기의 정사각형을 0, 0 위치에 그려주는 것인데, 이런 부분에 스크롤을 통해 계산된 값을 넣어주는 식으로 그려주는 거지요.

캔버스 사용법 자체를 공부하고 싶으시면 아래 링크를 참고해보세요~ 제가 예전에 유튜브 라이브로 진행한 캔버스 기초 강의입니다.
https://www.youtube.com/watch?v=JFQOgt5DMBY&list=PLe9WXHRkq9p2Yl0z2zskv-FhP5sinISTc