ワンページスクロールで作られたおしゃれなHomePage13選!


1.Easy One Page Scroll

See the Pen Easy One Page Scroll by André Cortellini (@AndreCortellini) on CodePen.

2.Header/Footer Parallax Effect

See the Pen Header/Footer Parallax Effect by Hudson Marinho (@hudsonmarinho) on CodePen.

3.Sticky Header CSS Transition

See the Pen Sticky Header CSS Transition by Brady Sammons (@soulrider911) on CodePen.

4. Zoom and Blur background Image

コピペして動きます!

See the Pen Zoom and Blur background Image by Zach Richard (@zrichard) on CodePen.

5.Batman nav.

スクロールするとTopにNavが出てくるおしゃれなデザインですね!コピペして動きます!

See the Pen Batman nav. by Srdjan Pajdic (@MightyShaban) on CodePen.

6.Cool layout with fancy page transitions and off-canvas menu

スクロールするとおしゃれに次の写真が現れます!コピペして動きます!

See the Pen Cool layout with fancy page transitions and off-canvas menu by Nikolay Talanov (@suez) on CodePen.

7.Curved Cut

コピペして動きます!

See the Pen Curved Cut by Hornebom (@Hornebom) on CodePen.

8.Vertical Layout with Navigation

jquery2.0環境で動きました。色合いがおしゃれですね

See the Pen Vertical Layout with Navigation by Ettrics (@ettrics) on CodePen.

9.CSS background change on scroll

BELNDの部分を変えておしゃれなHomePageが作れそうですね!コピペで動きます!

See the Pen CSS background change on scroll by Giana (@giana) on CodePen.

10.Fullscreen drag-slider with parallax

珍しい横スクロール版です!コピペで動きます!

See the Pen Fullscreen drag-slider with parallax by Nikolay Talanov (@suez) on CodePen.

11.Skewed One Page Scroll

斜めに写真が割れて次のページに行きます。コピペで動きます!

See the Pen Skewed One Page Scroll by Nikolay Talanov (@suez) on CodePen.

12.Life timeline

自己紹介ページにうまく使えそうです!コピペで動きます!

See the Pen Life timeline by Nicolas Slatiner (@slatiner) on CodePen.

13.Paral & Lax

流行りのカーテンデザインですね!コピペで動きます!

See the Pen Paral & Lax by Daniel Riemer (@zitrusfrisch) on CodePen.

あわせて読みたい

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です