完美滚动条不起作用

Question

我在以下代码中缺少什么？为什么 Perfect scrollbar 严重崩溃？

它似乎把 myDiv 滚动条和浏览器主滚动条弄乱了...感谢任何帮助。

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
    <meta charset="utf-8" />
    <link href="perfect-scrollbar.min.css" type="text/css" rel="stylesheet">
    <style>
        #myDiv {
            width: 400px;
            height: 400px;
            overflow: auto;
            background-color: #eeeeee;
            margin: auto;
        }
    </style>
</head>

<body>

<div id="myDiv">
    <p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p><p>Test perfect scrollbar</p>
</div>

<script type="text/javascript" src="jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="perfect-scrollbar.jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('#myDiv').perfectScrollbar();
    });
</script>

</body>
</html>

谢谢

Answer 1

将 position:relative 添加到 #myDiv

演示：https://jsfiddle.net/gbfLazpx/243/

CSS:

#myDiv {
  width: 400px;
  height: 400px;
  overflow: auto;
  background-color: #eeeeee;
  margin: auto;
  position: relative;
}

这里检查第一点：https://github.com/noraesae/perfect-scrollbar#requirements

the container must have a 'position' css style.

完美滚动条不起作用

Perfect scrollbar not working

html

javascript

jquery

scrollbar

perfect-scrollbar