How to set jQuery plugin perfect-scrollbar

Today I had problems with the perfect-scrollbar jQuery plugin. I have to fix it in a WordPress page, whose content has to scroll as a block. It works well with text, but crashes when a "ol", "ul" or "table" HTML tags was added. I am not test with other tags tough.

Those tags was placed under the scrolling text... And even breaks the text so portion under those tags was out of scrollbar at all.

I spend 5 long hours in CSS... and Google... and find nothing. Finally I saw, that the scroll element was a "p" tag. In the manual (at https://github.com/noraesae/perfect-scrollbar/blob/master/README.md#requirements) stay "The requirement below is for perfect-scrollbar <= 0.3.4: there must be the one content element(like div) for the container." So I change "p" to "div". And it runs well! Maybe it would be enough to set "display: block", and it would work with any tag, but I am not test this.

Moral: always use "div" as scrolling container!

This entry was posted in Blog, Hacks. Bookmark the permalink.

Leave a Reply