問題タブ [parallax]

これは非常に漠然とした質問ですが、どこから始めればよいかわかりません。誰かが私に何か考えを与えてくれたら、あなたは素晴らしいと思います.

Web サイトのホームページにパララックス効果を適用したいのですが、この効果を作成する方法がわかりません。私が望む効果は、http://davegamache.com/chase-happiness/とhttp://themetrust.com/demos/hero/ で作成されています。どちらも、下にスクロールすると画像とテキストが異なる速度で移動してフェードアウトするのと同様の原理を使用します。

基本的に私の質問は、これを作成するためにどこから始めるべきか、または効果を生み出すダウンロードを誰か知っているかということです.

助けてくれてありがとう

次のコードがあります。

(注: ObjScrollASoda は缶の jquery オブジェクトです)

これは、Trufa によって作成された問題を複製するフィドルです: http://jsfiddle.net/VcvJe/1/

青いセクションには、視差のような効果を生み出すページで「スクロール」する青い缶があります。ここに問題があります。ユーザーがページをスクロールしているときにcssを設定しているだけなので、Chrome（および他のWebkitブラウザー）でのみちらつき効果（望ましくない）が表示されることがあります。そして、Firefoxでは起こらないことに気付きました。この「ちらつき」効果を回避する方法を知っている人はいますか??

これは何が起こっているかをよりよく説明するビデオです: http://www.youtube.com/watch?v=SqDmOx6XY-M

（私の英語でごめんなさい）

ページ上：[リンクが削除されました] https://github.com/richardshepherd/Parallax-Scrolling/プラグインを使用しています。スクロールがギザギザでびくびくする理由はありますか？どうすればこの問題を解決できますか？

私は視差効果について多くのことを調べたり読んだりしてきましたが、最初の視差サイトを作成しようとしています。私の主な関心事の 1 つは、iPad で動作させることです。パララックスは iPad ではうまく機能しないと結論付けるのに十分なほど読んで見ました。

現在、すべての Parallax サイトの中で、iPad で正常に動作しているように見える 2 つを見つけましたが、それらが機能するために何が違うのか、まだわかりません。何かアイデアはありますか?

基本的に私が知りたいのは、視差サイト間の違いは何ですか. canvas タグを使用しているものもあれば、上と左の値を調整しているだけのように見えるものもあれば、画像を置き換えているように見えるものもあります。また、iPad に適した Parallax サイトの最適なアプローチは何ですか。

iPad で問題なく動作することがわかった 2 つのサイトは次のとおりです。

http://www.nike.com/jumpman23/aj2012/

https://victoriabeckham.landrover.com/INT

ありがとう。

将来のプロジェクトのために Parallax Web サイトを作成するテストを行っていますが、Chrome と Safari の画像に問題があります。

Firefox では、画像はサイトの上部を越えて上にスクロールしますが、Chrome と Safari でスクロールすると、画像がブラウザーの上部に触れるとすぐに消えます。

私のテストでは、黄色と茶色のスライドの両方に画像が含まれています (スライド 1 と 5)。

http://antonybearpark.co.uk/Parallax/

内訳はこちら...

• ラッパー (位置: 相対; オーバーフロー: 非表示; )
  • セクションコンテナ (位置:絶対)
    • 複数の子セクション

マウスホイール イベント リスナーをアタッチし、「section-container」の「トップ」位置を (イージングで) アニメーション化します。この位置が変化すると、各セクションの「background-position」は、「section-container」の「top」プロパティの位置に基づいて垂直方向に移動します (setTimeout() によって継続的に更新されます)。

「背景位置」の変更を除いて、すべてが正常に機能し、画像に少しジッターがあります。「background-attachment」が「fixed」に設定されている場合、これは起こりません...しかし、私はそれを望んでいません。

誰でもこれを説明できますか? 私は継続的にhttps://victoriabeckham.landrover.com/サイトを参照していますが、効率的に運用するために彼らが何を異なって行っているのか理解できません。

CSS "-webkit-overflow-scrolling：touch"を使用しているときに、iOSでリアルタイムのscrollLeftの位置を取得できません。

これがデモンストレーションするフィドルです：http： //jsfiddle.net/WaMUq/

デスクトップでスクロールしているときに、スクロール中にリアルタイムのscrollLeftデータを取得していますが、iOSでは、勢いのあるスクロールが停止するまで待ってから、scrollLeftデータを送信します。

どうすればこれを回避できますか？このデータをリアルタイムで取得して、とりわけ微妙な視差効果を作成しようとしています。Stellar.jsとScrollability.jsを試しましたが、どちらもスクロールが停止するまで待つという同じ問題が発生します。

開発中のサイトに基本的な視差効果を導入しました。Chrome、Firefox、IE9でスムーズに動作します。しかし、IE7とIE8では本当にぎくしゃくしています。私ははるかに複雑なサイトを見てきましたが、私が得ている「ぎくしゃくした」ようなものは見当たりません。スキャンラインテクスチャが上にある2つの画像のみを使用しています。

これを引き起こしている可能性のあるアイデアはありますか？

助けてくれてありがとう。

このチュートリアル デモの画像が上部に触れるとすぐに消える理由を知りたい人もいます。デモのスライド 3 をゆっくりスクロールします。

http://webdesigntutsplus.s3.amazonaws.com/tuts/338_parallax/src/index.html

私はそれを理解することができませんでした。チュートリアルはこちら: http://webdesign.tutsplus.com/tutorials/complete-websites/create-a-parallax-scrolling-website-using-stellar-js/

cocos2d + box2d を使って ios で忍者ジャンプのようなゲームをエンドレススクロールで開発しようとしています! (視差スクロールは必要ありません) エンドレススクロールのベストプラクティスは何ですか?

1 : レイヤーの移動 (つまり、レイヤー位置の変更) 2 : カメラの移動 3 : 単一レイヤーで視差スクロールを使用 (つまり、同じ速度で 1 つの視差レイヤーのみを使用)

または他のより良いアプローチ？