1

スクロール時に画像(背景ではなく画像のみ)を特定の場所に移動する特定の方法を実行しようとしています。つまり、ページをロードすると、ページがロードされ、ページの左側に画像がスライドし、スクロールすると、ページのスクロールを開始すると、画像が中央または下部、または必要な場所にスライドします。そして、画像は一連のテキストまたは情報によってそこにとどまります。私は次のような多くのことを試しました:

stop().animate({"top":(window.scrollY)

その特定の場所にスクロールするときにその場所にとどまることができません。下にスクロールし続けると、スクロールしても画像が下にスクロールし続け、特定のポイントの後に画像を停止する方法がわかりません。

それから私はこれを試しました:

    if($(window).scrollTop() + $(window).height() == $(document).height()) {
 var a = $(window).height() - 100;
 $('#scrolling').animate({

しかし、私はそれを機能させることができません。一番上にスクロールしても一番上に戻りません。

画像を中央または上部、さらには側面に浮かせて、下にスクロールするときにその場所に移動する方法について何か考えはありますか? 私は正しい道を進んでいますか、それともこれについて完全に間違っていますか? ここで何かが欠けているように感じますが、それが何であるかわかりません。

アニメーション プロトコルを使用して HMTL5 でこれを行うことができると思っていましたが、それを達成できるとは思いません。また、CSS3 が堅牢であることはわかっていますが、非常に不安定であることもわかっているため、JQuery または JavaScript が適していると思います。部分的に機能させることはできますが、完全には機能させることはできません。何かご意見は?

このサイトを検索しましたが、探しているものが見つかりません。これらは私が見つけた類似のサイトです:ウィンドウ上の特定の位置へのアニメーションスクロール画像とこれ:要素を偽の位置にする方法:固定されているため、特定のスクロール高さまで固定されてから接続しますか?

しかし、スポットに移動するには画像が必要です。これらのリンクは正しい方向に進んでいますか? 私が提供したサンプルコードはどこかにありますか?

4

1 に答える 1

0

Skrollerを見てください。これは、特定のアクションを定義できる JS ライブラリ (jQuery 依存ではありませんが、require js が必要です) です。基本的に、いくつかのデータ要素を div に追加します。これは、(スクロールの) どのピクセルでアニメーション化を開始する必要があるか、いつ停止するか、およびそのスクロール中に何をするか (たとえば、画面の中央に移動する) を示します。

上にスクロールするとうまくいきます(私たちのプロジェクトで使用しました)

于 2014-04-25T09:52:32.400 に答える