slimScroll is a small jQuery plugin that transforms any div into a scrollable area. slimScroll doesn't occupy any visual space as it only appears on a user initiated mouse-over.
npm install react-jquery-slimscrollScrollableDiv.jsx:
jsx
import $ from "jquery";
import SlimScroll from "react-jquery-slimscroll";
import React, { useEffect } from 'react';
SlimScroll($); // initialize only once. (inside index.jsx or App.jsx preferred)
const ScrollableDiv = ({ html }) => {
useEffect(() => {
$(".scrollable-div").slimScroll({
height: "50px",
size: "5px",
});
return () => {
$(".scrollable-div").slimScroll({ destroy: true });
}
});
return (
)
}
export default ScrollableDiv;
``