滾動div，固定，再次滾動

我有一個頁面佈局，其中全寬圖像在頂部，然後在右邊有文本內容。在左邊，有一個小的滾動div與社交鏈接。滾動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從滾動到固定（這已經在我的示例中），然後是第三個觸發器對於底部，我已經知道將它對齊到底部的CSS，只需要js觸發器。

我希望我已經解釋了這一點。

來源

2013-04-09 Jim

請您澄清「對齊到底部」部分嗎？我不確定你希望_hello box_在紅色頁腳到達窗口頂部時停留在哪裏。 – andyb 2013-04-09 12:37:35

當hello框到達底部的紅框（頁腳）http://img41.imageshack.us/img41/3735/demoy.gif我想我需要將左右內容包裝到一個新的div中 - 這個是它應該對應的一個。 – Jim 2013-04-09 14:49:22

實際上，剛剛找到了一個我正在尋找的社交鏈接的例子：http://blog.teamtreehouse.com/building-a-jquery-sticky-sidebar-navigation-menu看看它向下滾動時如何停下來在頁面底部附近？ – Jim 2013-04-09 15:24:16

您可能不需要打擾整個固定/滾動開關。相反，讓javascript限制範圍的上限和下限。如果用戶滾動過去，只需忽略這些數字並改用min/max即可。（您可以通過閱讀頁面上相應元素的位置來獲取最小值/最大值。）

來源

2013-04-09 15:29:48

我不明白0-不是一個真正的程序員。我注意到插件digg digg完成了正確的對齊（見上文），但該插件太重了。 – Jim 2013-04-09 16:34:25

滾動div，固定，再次滾動

回答

相關問題