关闭画布导航滚动问题

时间:2015-05-21 21:49:42

标签: javascript jquery navigation

我用帆布导航做了这个,一切都运行正常,除非导航关闭时它一直到顶部,我希望它留在它打开的地方。当它打开时,它给身体一个滚动位置的边距,关闭后它给出margin: 0。帮助任何人。这是使其更清晰的小提琴:http://jsfiddle.net/eyd7n9tk/

修改

关键是应该禁用滚动,但在导航打开时可见。遵循以下步骤:

  • 在网站上随处打开导航
  • 导航打开,页面停留在同一位置,不会跳转到任何地方
  • 导航打开时禁用滚动
  • 关闭导航,启用滚动功能,页面仍在同一位置,无需跳跃。

2 个答案:

答案 0 :(得分:0)

删除行

var scrl = $(this).scrollTop();

你将留在开放的地方

答案 1 :(得分:0)

如果有人需要它,我想出来,只需要几个更多的变量来存储滚动位置和嵌套对象。这是最后的小提琴:http://jsfiddle.net/eyd7n9tk/3/

var navigation = {};

function toggleNav() {
    navigation.scrl = $('body').scrollTop();
    if ($('#inner-wrap').hasClass('opened')) {
        $('#inner-wrap').removeClass('opened');
        $('#close-nav').hide();
        $('body').removeClass('no-scroll');
        $('body').css('top', '0').scrollTop(here);
    } else {
        $('#nav').show();
        $('#inner-wrap').addClass('opened');
        $('#close-nav').show();
        $('body').css('top', - navigation.scrl + 'px').addClass('no-scroll');
    }
}

function openNav() {
    $('#nav').show();
    $('#inner-wrap').addClass('opened');
    $('#close-nav').show();
    $('body').css('top', - navigation.scrl + 'px').addClass('no-scroll');
    alert(navigation.scrl);
}

function closeNav() {
    $('#inner-wrap').removeClass('opened');
    $('#close-nav').hide();
    $('body').removeClass('no-scroll');
    $('body').css('top', '0').scrollTop(navigation.scrl);
    alert(navigation.scrl);
}

$('#toggle-nav').click(function () {
    toggleNav();
});

$("#close-nav").click(function(){
    closeNav();
});