Show popup without overflow:hidden, page jumping and toggling

togglePopup.js

function togglePopup() {

    var scrollPosition;

    $(document).on("click", '[data-id="show-popup"]', function(e) {
        e.preventDefault();

        var popup = '[data-id="popup"]';

        scrollPosition = $('body').scrollTop() === 0
            ? $('html').scrollTop()
            : $('body').scrollTop();

        $('body').addClass('no-scroll').css('top', -scrollPosition);

        popup.fadeIn();
    });

    $(document).on("click", popup, function (e) {
        e.preventDefault();
        if ($(e.target).is($(e.currentTarget)) || $(e.target).is('[data-id="close-popup"]')) {
            $(this).fadeOut();
            $('body').removeClass('no-scroll').css('top', 'auto');
            $('html, body').scrollTop(scrollPosition);
        }
    });

}

// // CSS class
// .no-scroll {
//     width: 100%;
//     height: 100vh;
//     position: fixed;
//     overflow-y: scroll;
// }