1

http://communitychessclub.com/index.php是一个使用永久位置的长网页：基于来自http://blog.yjl.im/2010/01/stick-div-at-top-的代码的固定菜单after-scrolling.html

但是菜单包含指向同一页面中 ID 的链接，并且当单击时，固定滚动菜单会挡住部分 . 例如： http: //communitychessclub.com/#official，您会看到菜单挡住了目标文章文本。请注意，我有，这就是我想要的逻辑语法和位置。

有没有办法修改下面的jquery，使页面向下滚动1”，使菜单出现在目标文章之外？我不在乎菜单是否覆盖了目标ID文章上方的文章。

CSS:
#sticky {margin:0 auto; display:table}
#sticky.stick {position: fixed;  top: 0; margin-left:48px; z-index: 10000; }

JS:

<script>
function sticky_relocate() {
var window_top = $(window).scrollTop();
var div_top = $('#sticky-anchor').offset().top;
if (window_top > div_top)
$('#sticky').addClass('stick')
else
$('#sticky').removeClass('stick');
}

$(function() {
$(window).scroll(sticky_relocate);
sticky_relocate();
});
</script>
4

2 回答 2

1

这段 JavaScript 将起作用。

$(window).scroll((function() {
var a='',  // a buffer to the hash
w = $(window);
return function() {
    var h = location.hash;
    if (h != a) {   // if hash is different from the previous one, which indicates
                        // the hash changed by user, then scroll the window down
    a = h;           // update the buffer
    w.scrollTop(w.scrollTop()-100)
    }
};
})());
于 2012-11-21T05:58:20.347 回答
1

该代码中未提供您想要的内容。

基本上，这个想法是捕获点击事件，获取要移动到的文章的 id，找到该元素的 position().top，然后将窗口移动到该位置 - 一段距离。

$('.js-css-menu a').click(function(e) {
    e.preventDefault();
    $(window).scrollTop($('#' + $(this).prop('href').split('#')[1]).offset().top - 50);
});​

这在控制台中看起来不错。

于 2012-11-21T06:09:21.087 回答