2011-09-28 63 views
1

在頁眉和頁腳之間的頁眉和頁腳之間的頁眉和頁腳右側的網頁上,我有以下相當簡單的java腳本功能,使橫幅看起來像當用戶滾動網頁時,會在頁眉和頁腳之間浮動。DIV在頁眉和頁腳之間浮動

$(window).scroll(function() 
    {  
     if ($(window).scrollTop() > headerHeight)    
      $(".banner").css("position", "fixed");       
     else    
      $(".banner").css("position", "relative"); 
    } 

我希望橫幅在用戶滾動瀏覽器窗口時自動滾動/浮動/移動。代碼工作正常:它使橫幅浮動/移動並停止橫幅浮動/移動標題。但是我需要添加一個條件:由於存在頁腳,所以在到達網頁結束之前,橫幅必須停止浮動。此代碼現在會在用戶到達頁面底部時使橫幅在頁腳上移動/浮動。

任何人都可以幫助我把這個條件包含在if塊中作爲條件嗎?

回答

1

我會建議你使用stickyfloat jquery插件!

演示:http://jsbin.com/eqihef
http://plugins.jquery.com/project/stickyfloat

這是一個偉大的小插件,它爲您提供了大量的控制。

+0

這正是我所期待的。謝謝。讓我嘗試。 – zak

+0

這可能也有幫助:http://net.tutsplus.com/tutorials/javascript-ajax/spotlight-constrained-stickies-with-jquer/ – GDW

1

您可能只需在包含標題底部和頁腳頂部的容器中包含橫幅,然後在其範圍內啓用滾動。