Appleのサイトにある横スライドのアニメーションを作りたいです。

プログラミング初心者の学生です。
現在、自作のウェブサイトを作っています。
そして、そのサイトの中にAppleのサイトにある横スライドのアニメーションと同じものを組み込みたいと思い、作り方を調べたのですが作り方が全く分かりませんでした。
どなたか教えてくださるととても助かります。
↓以下のスクショの画像が作りたいアニメーションです。(スクショしたAppleのHPのURLです。　https://www.apple.com/store)

作りたいアニメーションの具体的な動きを以下に示します。
・横スライドを行った際に、1つのボックスごとに止まるようにする
(スライド時に滑らかに動かずに一つの要素ごとに止まるようにしたいということです。)
・以下に示すAppleのサイトのような形でレスポンシブル対応をできるようにする
https://www.apple.com/store
・マウス操作ができるように画面の両端にクリックするとボックスを移動させることができる
ボタンを設置する
・スクロールバーは表示しないようにする

希望としては、上記のスクショのものとできるだけ同じものを作りたいと思っています。
ご指導の程、よろしくお願いします。

AbeTakashi

2022/05/26 13:14

どうやって作るかも分からない、という感じであれば、まずは地道にJavaScriptとCSSの基礎をしっかり学ばれることからじゃないでしょうか？ここで教えられてパッと作れるようなものではないかと思います。やっていくうちに「もしかしてこれを使えばできるのかな？」というタイミングが来ると思いますし、作っていく中で具体的に何が分からないところが出てきたら、ソースコードを含めて具体的な質問をされると良いと思います。