jquery在删除div后失去滚动能力

我创建了一个脚本，在jquery中附加一个lightbox，然后单击将其删除

我只在谷歌浏览器上观察到一种奇怪的行为。 如果我在lightbox关闭时用鼠标滚轮滚动，那么在我无法滚动我的主div（我滚动我的网站的div，而不是主体）之后。我需要单击我的div以再次滚动它。 如果我在灯箱关闭时不触摸鼠标滚轮，那么之后一切正常，我可以正常滚动我的div。。。。 我还观察到预加载div的这种行为。 最后，当我删除一个z索引大于主可滚动div的div（滚动时）时，这个bug总是出现

我的可滚动div和lightbox的css：

#inner-container {
    position: relative;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    z-index: 4;
    height: 100%;
    width: 100%;
}
.light-box-container {
    position: fixed;
    display: table;
    overflow: hidden;
    vertical-align: baseline;
    z-index: 9999;
    width: 100%;
    min-width: 320px;
    height: 100%;
    margin: 0;
    opacity: 0;
    background: rgba(0,0,0,0.8);
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
}

$(document).on('click touchend', function(e) {
    var $this = e.target;
    if ( $this.className == 'light-box-container light-box-anim' || $this.className == 'light-box-inner light-box-inner-anim' || $this.className == 'icon-remove') {
        $(lightboxImage).removeClass(lightboxAnimIn);
        $(lightboxInner).removeClass(lightboxAnimIn);
        setTimeout(function() {
            $(lightboxContainer).removeClass(lightboxAnim);
        }, 300);
        setTimeout(function() {
            $(lightboxContainer).remove();
            lightboxId++;
        }, 700);
    }
})

关闭灯箱的脚本：

#inner-container {
    position: relative;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    z-index: 4;
    height: 100%;
    width: 100%;
}
.light-box-container {
    position: fixed;
    display: table;
    overflow: hidden;
    vertical-align: baseline;
    z-index: 9999;
    width: 100%;
    min-width: 320px;
    height: 100%;
    margin: 0;
    opacity: 0;
    background: rgba(0,0,0,0.8);
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
}

$(document).on('click touchend', function(e) {
    var $this = e.target;
    if ( $this.className == 'light-box-container light-box-anim' || $this.className == 'light-box-inner light-box-inner-anim' || $this.className == 'icon-remove') {
        $(lightboxImage).removeClass(lightboxAnimIn);
        $(lightboxInner).removeClass(lightboxAnimIn);
        setTimeout(function() {
            $(lightboxContainer).removeClass(lightboxAnim);
        }, 300);
        setTimeout(function() {
            $(lightboxContainer).remove();
            lightboxId++;
        }, 700);
    }
})

我不知道这是谷歌浏览器的错误，还是因为我的脚本。 我真的不知道怎么解决它。

---

我试图触发单击或聚焦我的可滚动div，但它不起作用。

给我一把小提琴，可能需要在lightbox打开时设置overflow none…在此处创建DemoFIDLE:但它在这把小提琴中起作用…我发现了问题。它来自一个平滑的滚动插件。。。