Webydo・機能

parallax.hero.word1 parallax.hero.word2 parallax.hero.word3 parallax.hero.word4 parallax.hero.word5

業界最強のビジュアルパララックスエンジン。スクロール位置に応じて、モーションパス、不透明度の変化、3D回転をJavaScriptを一切書かずに設定できます。

アニメーションを始める ->

モーションを、シンプルに。

結果：わずか数秒で映画品質のモーションを実現。

1

要素を選択

ステップ

2

トリガーを設定

ステップ

3

アクションを定義

ステップ

詳細解説

没入型スクロールテリング

ユーザーがスクロールする間、要素を固定表示。長文コンテンツ、製品のお披露目、ストーリーテリングに最適です。

マウスパララックス

レイヤーがマウスの動きに反応することで奥行きを演出。奥にあるレイヤーほど、動きはゆっくりになります。

3D回転＆スキュー

XとYの移動だけではありません。3D空間で要素を回転させ、パンフレットのような折り込み効果を演出します。

60FPS。なめらかな動き。

カクつきのないJavaScript
可能な限り、ネイティブのCSS変数とtransformを使用しています。
軽量
重い外部ライブラリの読み込みは不要です。
モバイル最適化
バッテリーとデータ通信量を節約するため、モバイルでは負荷の高いエフェクトを自動的に無効化します。

Webydoで作成

ファッションサイト

画像が重なりながらスライド

テック製品

製品がパーツごとに分解

ポートフォリオ

テキストマスキング効果

スクロールを止めて、動かそう。

ビジュアル革命に参加しよう。

パララックスエンジンを試す ->