Hello.
I screwed to the div plugin jScrollPane . The jScrollPane block is created, but the scrollbar itself does not appear.
CSS:

 $(function(){ $('#chat').jScrollPane();}); 
  #chat { width: 325px; height: 260px; border: 1px solid #999999; overflow-y: auto;} .chat_box{ outline: none; border-radius: 2px; margin-bottom: 3px; width: 320px; height: 255px;} .scroll{ width: 335px; height: 270px;} 
 <div class="scroll"> <div id="chat"> <div class="chat_box" contenteditable="true"> </div> </div> </div>

    1 answer 1

    Maybe try it?

     $(document).ready(function() { $('#chat').jScrollPane(); });

    And in CSS:

     overflow: auto;

    instead:

     overflow-y: auto;

    UPD:

    You have everything right, but this plugin works only for content wrapped in a <p> .

    Remove all paragraphs <p> from the example and no bars appear.

    You can also try this initialization:

     $(window).load(function) { $("#chat").jScrollPane(); }

    Another initialization option:

     $("#chat").jScrollPane({ autoReinitialise: true })
    • Now I will try - Roman
    • No, it does not fit. There is 1 more script on the page and the scroll will be visible only after it. function changeStyleDiv(){ document.getElementById('thanks').style.display = 'block'; document.getElementById('forms').style.display = 'none'; } function changeStyleDiv(){ document.getElementById('thanks').style.display = 'block'; document.getElementById('forms').style.display = 'none'; } function changeStyleDiv(){ document.getElementById('thanks').style.display = 'block'; document.getElementById('forms').style.display = 'none'; } - Roman
    • But even if this script is removed, then the scrolls are not displayed. - Roman
    • And I understood everything. This plugin works only for what is wrapped in a <p> tag. - igumnov
    • It, on my other page, it works without <p> and on this page, it refuses to show the scroll bar. - Roman