2016-08-29 4 views
0

что мне не хватает в следующем коде? Почему 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> 

Спасибо

+0

Вы проверили вашу консоль (http://stackoverflow.com/documentation/javascript/185/hello-world/714/using-console-log) на наличие ошибок? –

ответ

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

контейнер должен иметь стиль «позиция» css.

+0

Это был он! Спасибо, я пропустил эту часть. – user2029958

 Смежные вопросы

  • Нет связанных вопросов^_^