kobitoDevelopment · July 13, 2022 07:06
diff --git a/html b/html
 <div class="hoge"></div>
diff --git a/JavaScript b/JavaScript
 const hoge = document.querySelector(".hoge");
 let speed = 0;
 let rotation = 0;
 window.addEventListener("wheel", function (event) {
  speed += event.deltaY * 0.02;
 });

 function rot() {
  speed *= 0.93; // requestAnimationFrameの呼び出しで+される数値を小さくし続ける
  rotation += speed;
  hoge.style.transform = `translateX(${rotation}px)`;
  requestAnimationFrame(rot);
 }

 rot();
diff --git a/scss b/scss
 .hoge {
  width: 200px;
  height: 200px;
  background-color: green;
 }
	const hoge = document.querySelector(".hoge");
	let speed = 0;
	let rotation = 0;
	window.addEventListener("wheel", function (event) {
	speed += event.deltaY * 0.02;
	});

	function rot() {
	speed *= 0.93; // requestAnimationFrameの呼び出しで+される数値を小さくし続ける
	rotation += speed;
	hoge.style.transform = `translateX(${rotation}px)`;
	requestAnimationFrame(rot);
	}

	rot();
No results found