新しいimac proページのアニメーションスタイルとは何ですか？

Question

apple ipac proページで行われるアニメーションを再現するWebページを作成したいと思います。

このタイプのアニメーションとは何ですか？ これはHTML5とCSS3のみを使って行うことができますか？

https://www.apple.com/uk/imac-pro/?afid=p238%7CsQ4bjRw3L-dc_mtid_20925wi539930_pcrid_198758187038_&cid=wwa-uk-kwgo-mac-bran-imac+pro-e-slid--productid-

Answer 1

サイトのトップイメージスプライトのように見えます（あなたも、あなたがスクロールする動画を再生すると似た何かを行うことができます） この参照：https://codepen.io/ollieRogers/pen/lfeLc/

function scrollPlay(){ 
    var frameNumber = window.pageYOffset/playbackConst; 
    vid.currentTime = frameNumber; 
    window.requestAnimationFrame(scrollPlay); 
} 

window.requestAnimationFrame(scrollPlay); 

を私はいくつかを追加する必要がありましたコードの上にコードパッドのリンクを投稿することができます。

残りのサイトの「スタイル」は視差スクロールに似ています： https://ihatetomatoes.net/demos/simple-parallax-scrolling-tutorial/ https://ihatetomatoes.net/demos/parallax-scroll-effect/