最新の流行は、スクロールすると動くもののようです。
今、私はdivコンテンツの長いページの周りに散らばっている背景画像を含むたくさんの正方形を持っています。私の考えは、下にスクロールすると、これらの背景画像を少しだけ上にスライドさせることです。背景画像の幅は正方形と同じですが、高さは1.5倍です。
簡単な解決策はbackgroundPosition、を電流の一部に設定することですscrollTopが、もっと考えてみると、それほど単純ではありません。
基本的に、divの背景画像は、divがbackground-position: 0 0;折り畳みを超えて隠されているときに表示されます。表示されると、ウィンドウの上端から背景画像の下端divが消えるまで、スクロールに比べて上部の位置が小さくなります。
はテキストコンテンツ内divでfloat編集されるため、位置の値をハードコーディングする方法はありません。
たぶん私は自分でこれを行うことができましたが、いくつかの考慮事項があります。
- 任意の速度で前後にスクロールし、正方形のどの部分
divも覆われていない場所に背景画像を移動しないでください。 - ロード時にページの中央に表示されるDiv。最初はそうでないかどうかは関係ありません
background-position。0 0重要なのは、背景画像が他のすべての画像と同じ速度で移動することです。 - ユーザーがウィンドウサイズを変更するタイミングを調整します。
さて、これはほんの少しの才能なので、驚くべきブラウザの互換性や、これがモバイルで機能することは期待していません（ただし、機能する場合はクールです）。
しかし、私はこれらすべてがどのようにうまくいくかを考えることさえできません。これを達成するための最良の方法は何でしょうか？スクロールスライド機能は非常に人気があるので、これを構築するために利用できる（jQuery）プラグインはありますか？