浮動菜單，滾動時跳轉

Question

頂部浮動菜單在開始滾動時跳轉一點。如何保持它始終固定在頂部？

在某些頁面上，當試圖滾動整個頁面跳轉/閃爍時，只有深灰色頁腳低於屏幕（或瀏覽器窗口被調整大小）。

my website

請幫助:)

Answer 1

在網頁源代碼中的底部是一個JavaScript部分用下面的代碼：

function relocate_persistent_header() { 
    var header_bar = jQuery("#menu-wrapper"); 
    if(header_bar.hasClass("floater-bar")) { 
     header_bar.css("left", ((jQuery(window).width()/2) - header_bar.width()/2) + "px"); 
    }else{ 
     header_bar.css("left", ""); 
    } 
} 

jQuery(document).ready(function($) 
{ 
    var $header_top_pos = $("#menu-wrapper").offset().top + 20; 
    function ozy_check_floating_position() { 
     if ($(window).scrollTop() > $header_top_pos) { 
      $("#menu-wrapper").addClass("floater-bar"); 
     } else { 
      $("#menu-wrapper").removeClass("floater-bar"); 
     } 
     relocate_persistent_header(); 
    } 
    $(window).scroll(function() { ozy_check_floating_position(); }); 

    ozy_check_floating_position(); 
}); 

jQuery(window).resize(function() 
{ 
    relocate_persistent_header(); 
}); 

這是問題的根源。 menu-wrapper總是擁有CSS類floater-bar，並且不需要添加或刪除它。

用Firebug我給menu-wrapper的風格屬性與floater-bar相關聯的所有CSS（以便去除floater-bar沒有任何作用）和‘跳樓’問題就走了。要真正使用此解決方案，刪除：

if ($(window).scrollTop() > $header_top_pos) { 
    $("#menu-wrapper").addClass("floater-bar"); 
} else { 
    $("#menu-wrapper").removeClass("floater-bar"); 
} 

從網站和類floater-bar在實際的HTML代碼添加到menu-wrapper。