Comment faire un plugin personnalisé jQuery scrollbar

Je pensais faire de la coutume de la barre de défilement plugin jQuery, il existe de nombreux plug-ins disponibles pour elle, mais je veux faire mon propre, le problème est que je ne reçois pas le concept comment dois-je déplacer un contenu en déplaçant les autres élément div (barre de défilement) et aussi comment dois-je déplacer le contenu en utilisant la roue de la souris??

Merci de m'aider à comprendre cela.

Grâce

source d'informationauteur Dheeraj Agrawal

  1. 0

    Faire de la coutume de la barre de défilement sans jQuery-UI .

    HTML:- 

        <div class="parent">
            <div class="scrollbar"></div>
            <div class="scrollable">
                 <p>Lorem ipsum dolor sit amet,
                 consectetur adipiscing elit. Cras non nunc eget sapien molestie mollis. 
                 Proin vestibulum vehicula varius. Duis a nunc ac risus facilisis consectetur.</p> 
           </div>
   </div>

    css:-

    .parent{
    position:relative;
       margin:50px;
      overflow:hidden;
    height:200px;
    width:180px;
    background:#ddd;
}
.scrollable{
      overflow-y:scroll;
    position:absolute;
      padding:0 17px 0 0;
    width: 180px;
      height:100%;
}
.scrollbar{

    position:absolute;
    overflow:auto;
    top:0px;
    right:0px;
    z-index:2;
    background:#444;
    width:7px;
    border-radius:5px;
}

    Javascript:-

      var $scrollable = $('.scrollable');
  var $scrollbar  = $('.scrollbar');
  $scrollable.outerHeight(true);
  var H   = $scrollable.outerHeight(true);
  var sH  = $scrollable[0].scrollHeight;
  var  sbH = H*H/sH;



$('.scrollbar').height(sbH);

$scrollable.on("scroll", function(){

    $scrollbar.css({top: $scrollable.scrollTop()/H*sbH });
});