問題タブ [superscrollorama]

スーパースクロールラマのピン機能を広範囲に使用してスクロールを一時停止し、スクロール位置に基づいて特定の要素をアニメーション化する非常にアニメーション化された Web サイトに取り組んでいます。

問題は、安定性と最適化の 1 つです。もちろん、クライアントは、マウスでスクロール バーをつかんで上下に動かしても、サイトが非常に安定していて不具合がないことを望んでいます。幸いなことに、これが問題を頭の中に浮かび上がらせる唯一の方法ですが、問題は醜いものです。

スクロールバーでページを上下に動かすと、特定の要素が「失われた」または「間違った場所に配置された」。ポジショニングが適切にリセットされていないのではないかと思います。固定された要素の固定が解除されると、次のセクションが固定されるまで画面が白くなります。これは特に、ページを上下に動かしてページの上部で停止するときに確認できます。そこから下にスクロールしてみてください。一部のアニメーションでさえ、最初のオフィス シーンの後のシーンで部分的にしかレンダリングされません。影響を受ける各 img と div の位置を固定解除時に絶対位置にリセットしようとしましたが、役に立ちませんでした。また、それぞれの影響 img と div の初期固定位置を強制しましたが、まだ問題がありました。

処理が多すぎて、ブラウザー/コンピューターがすべてを十分に速くレンダリングできず、実行されていない JavaScript が削除され、アニメーションが部分的にしか完成していない可能性がありますか?

私は Web 開発の世界、特にフロントエンドの世界は初めてです。どんな助けでも本当に感謝しています。

編集:
Superscrollorama コードをすべて破棄し、代わりに Skrollr を使用しました。グリッチが発生することはなくなりました + Skrollr を使用すると、サイトの応答性を高めることが容易になりました。モバイル/タブレットでもある程度機能します。

URL:タレントバイザー

視差効果のあるWordpressテーマに取り組んでいます。詳しく調べてみると、このテーマは scrollorama スクリプトを使用しています。( http://johnpolacek.github.io/scrollorama/ )

最初にテーマをダウンロードしたときは効果がありましたが、このテーマを大幅にカスタマイズする必要があったため、効果が機能しなくなりました。スクロール時に A から B に移動するはずの画像が、A に固定されて動かなくなりました。明らかに、私がやったことでスパナが機能しましたが、これまでスクロールラマを使用したことがないため、何を探すべきかわかりません。

特にスクロールラマの部分で元のテーマコードを調べたところ、すべてが完全に一致しているので、問題を引き起こしている可能性のあるアイデアをすぐに得た人はいますか?

それは単に互換性の問題でしょうか？scrollorama 以外に使用しているのは、追加の画像スライダーhttp://www.menucool.com/responsive-slider.aspxだけです

これは、scrollorama に使用されているすべてのコードである必要があります。

HTML

CSS

私はすべてを試しましたが、スクロールラマをこれで動作させることができないようで、理由がわかりません. コンソールに「Uncaught ReferenceError: scrollorama is not defined」というエラーが表示される

JavaScript:

ライブデモ:

http://matthunzinger.com/

どうもありがとう！

SuperScrollorama トゥイーンを動的にバインド/バインド解除しようとしています。アンバインド時には、トゥイーン要素をデフォルトのスタイルにリセットする必要もあります。私の場合、ブラウザーの幅に基づいて、バインド/バインド解除が必要です。私はこのようなことができると思いました：

もちろん、これは特にエレガントではなく、機能しません。

superscrollorama を使用して Web サイトに取り組んでいましたが、うまくいきませんでした。だから私は練習をすることにしましたが、それでもこの単純なコードは機能しません。上記のファイルにすべてを含めました。greensock の TweenMax.min.js と jquery.superscrollorama.js を使用してファイルを確認するだけです。私は本当にイライラしています.間違いはほんのわずかであることを知っていますが、誰かが私を理解するのを手伝ってくれます. 事前に感謝します。

週末に scrollorama を学ぼうとしました。過去に多くの jquery プラグインを学んで使用しようとしましたが、問題はありませんでした。しかし、これは本当に私を混乱させます。

私は、stackoverflow やスーパースクロールラマのチュートリアルに関する他の Web サイトを検索しましたが、正確な方法を指定しているものはありません。

この目的のために、ここでフィドルを作成しました。

http://jsfiddle.net/4o46jdj7/1/

これが私がやろうとしていることです。赤い div が固定され、#text-1 が上にスクロールしてフェードアウトし、フェードアウトした後、下部のテキストが上にスクロールし、完了したら固定を解除してフッターに移動する必要があります。

これが私が使用しているコードです