溢出：自动滚动条在浏览器中无法正常运行，在移动设备上根本无法运行

Question

在设置高度并溢出的div中滚动时，我遇到了一个奇怪的问题：自动启用。当我在计算机（而非移动设备）的浏览器中调试项目时，滚动条将按预期方式显示，但仅在单击并拖动该条时滚动，而不是在尝试使用鼠标滚轮滚动时滚动。然后，当我在移动设备上调试时，我根本无法滚动div（它的行为就像我将溢出设置为隐藏一样）。同一应用程序中的其他地方设置几乎完全相同，可以很好地工作，对于这个特定示例，我想不出什么独特之处。我尝试将z索引添加到div中，但没有任何改变。

这是我的html / css设置的简化版本：

<div id="NextWorkout">
    <div data-role="modalview" data-modal="false" data-close="ReturnToDashboard" id="NextWorkoutPanel" class="popuppanel resultpanel">
        <a onclick="CloseNextWorkout()">
            <span id="NextWorkoutPanelClose" class="panelclose fa fa-close"></span>
        </a>
        <div id="NextWorkoutContent">
            <p>Next Workout</p>
            <div id="NextWorkoutInfo"></div>
        </div>
    </div>
</div>

<style>


.popuppanel.resultpanel {
    background-color: #e6e6e6;
    position: relative;
    font-size: 28px;
    z-index: 50;
    text-align: center;
    width: 320px;
    height: 525px;
}

.panelclose {
    font-size: 20px;
    position: absolute;
    top: 0;
    right: 0;
    padding: 5px 10px;
    z-index: 100;
}

#NextWorkoutInfo {
    height: 400px;
    overflow: auto;
}
</style>

是否有人在这个问题之前/是否知道是什么原因造成的？

谢谢！

编辑：容器类中只有一个带有onclick的标记。整个过程都在kendo移动模式窗口内，这实际上可能是相关的。我碰到的唯一一次是在模式窗口中。我试图创建一个代码笔来重新创建问题，但是当我仅创建一个干净的模式+容器+内部div时，就不会出现相同的问题。我假设它与整个应用程序上下文中的模式有关，并且希望其他人也遇到了相同的问题。我将代码示例更新为更深入。