1

全幅の画像が上部にあり、右側にテキスト コンテンツがあるページ レイアウトがあります。左側には、ソーシャル リンクを含む小さなスクロール div があります。

これは次のようなものです: http://blog.teamtreehouse.com/building-a-jquery-sticky-sidebar-navigation-menu (ソーシャル リンクはスクロールし、固定され、別の div からスクロールします)。

以下に例を示しますが、以下のパズルの最後のピースはありません: http://jsfiddle.net/nwFrg/

            function sticky_relocate() {
          var window_top = jQuery(window).scrollTop();
          var div_top = jQuery('#e-c-r-top').offset().top ;
          if (window_top > div_top)
            jQuery('.socialbar-left').addClass('fixedsocialbar')
          else
            jQuery('.socialbar-left').removeClass('fixedsocialbar');
          }
        // If you have jQuery directly, use the following line, instead
         jQuery(function() {
        // If you have jQuery via Google AJAX Libraries
        // google.setOnLoadCallback(function() {
          jQuery(window).scroll(sticky_relocate);
          sticky_relocate();
          });

赤いフッターに到達したら、「ハロー ボックス」を停止して、そこにとどまり、下に揃えます (その人が再び上にスクロールするまで、すべてが逆になります。

誰かがjsを使ってスクロールから固定（すでに私の例にある）に移動し、次に下の3番目のトリガーに移動するのを手伝ってくれるなら、私はそれを下に揃えるcssをすでに知っています.jsトリガーが必要です.

これでOKだと説明できたと思います。

4

1 に答える 1

0

おそらく、固定/スクロール スイッチ全体を気にする必要はありません。代わりに、javascript で範囲の上限と下限を制限してください。ユーザーがいずれかの端を超えてスクロールした場合は、それらの数値を無視して、代わりに最小/最大を使用してください。(ページ上の適切な要素の位置を読み取ることで、最小/最大を取得できます。)

于 2013-04-09T15:29:48.287 に答える