Держите боковую панель открытой, если после прокручивания - PullRequest
0 голосов
/ 27 сентября 2019

При прокрутке я хочу открыть «.main-sidebar», и когда прокрутка остановится, она должна закрыть «.main-sidebar».Но если мышь находится над «.main-sidebar», то она должна оставаться открытой.

.sidebar-collapse - это класс тела, чтобы свернуть или развернуть главную боковую панель.

Я был в этом в течение некоторого времени, и я думаю, что мне нужна другая пара глаз, чтобы определить мои ошибки.

// check if the menu is collapsed or not

$('body').on('mousemove', function() {

    var scrollTimer;

    if ($(this).hasClass("sidebar-collapse")) {

        console.log('Check: Menu is collapsed');

        //Scrolling opens menu
        $(window).scroll(function() {
            // detect scrolling and add/remove classes
            var scroll = $(window).scrollTop();
            if (scroll) {
                $("body").addClass("sidebar-collapse");
            } else {
                $("body").removeClass("sidebar-collapse");
            }
            // set and start timer counting for 8 sec
            scrollTimer = setInterval(function() {
                //When time is up addClass back
                $("body").addClass("sidebar-collapse");
            }, 5000);
        });
    } else {

        console.log('Check: Menu Open (missing: .sidebar-collapse)');

        //Stay open if mouse is on menu
        $('.main-sidebar').on('mouseenter', function() {
            if (!$('body').hasClass("sidebar-collapse")) {
                console.log('ON MENU');
                // set and start timer counting for 5 sec
                clearInterval(scrollTimer);
            }
        });
    }
});

1 Ответ

0 голосов
/ 27 сентября 2019

Как насчет добавления / удаления класса на боковой панели при прокрутке окна, а при наведении курсора на боковой панели можно выполнить команду css:

$(window).scroll(function() {
  $('.main-sidebar').addClass("hide", ($(window).scrollTop() > 100));
  setTimeout(function() {
    $('.main-sidebar').removeClass('hide');
  }, 1000);
});

https://jsfiddle.net/jxmL0aer/1/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...