Question

的jQuery

$(document).ready(function() {  
var offset = $(".menu").offset();  

    $(window).scroll(function () {  
        var scrollTop = $(window).scrollTop();  

        if (offset.top < scrollTop) {
            $(".menu").css({
                position: "fixed"
            });  
        }
        else {
            $(".menu").css({
                position: "absolute"
            });  
        }
    });  
});

CSS

.menu {
  position: absolute;
  top: 0px;
  right: 0px;
}

正如您想象的那样，向下滚动时我的菜单始终保持在最顶层。但这里有一个问题。我的菜单绝对定位，因为它位于一个大的相对容器div内。但是，如果我希望菜单保持在最顶层，我必须将定位更改为固定，这一切都正常，但菜单现在在大容器div之外移位了！有没有办法让我的菜单始终保持在最佳状态，但保留其绝对值？我真的想要一个地方的菜单，这意味着顶部：0和右边的容器边界也是0！

没有任何东西移动到中央容器之外，顶部总是0。

小提琴链接：http://jsfiddle.net/t6nue/2/

Answer 1

您需要删除逗号：

if (offset.top < scrollTop) {
   $(".menu").css({
      position: "fixed"//, //here no need to use comma
   });

Answer 2

我解决了跳转菜单按钮的问题：

的jQuery

$(document).ready(function() {  
var offset = $(".menu").offset();  

    $(window).scroll(function () {  
        var scrollTop = $(window).scrollTop();  

        if (offset.top < scrollTop) {
           $(".menu").css({
                top: scrollTop - "8"
            });  
        }
        else {
            $(".menu").css({
                top: "0px"
            });  
        }
    });  
});

注意我用jQuery变量声明了最高位置：top: scrollTop - "8"

问题解决了:)）

一个绝对位置保持在顶部的菜单

2 个答案: