關於實現自定義滾輪，首先要對整個布局進行了解：
1、 1.需要顯示的層級 和 2.需要被滾動層級 的關系：
1--層級1具有 溢出隱藏 屬性，目的是為了隱藏 層級2 多出的部分。
2--由於在層級1的包裹之下層級2溢出隱藏部分可以通過控制層級1的scrollTop進行滾動。
2、 滾動條的位置：
1--如果你后面是通過控制層級2的top值進行滾動，那么滾動條可直接相對於層級1進行絕對定位。
2--如果你是通過控制層級1的scrollTop進行滾動，那么滾動條就需要在外面多加一層包裹層，目的就是讓滾動條不隨着層級1往上滾。
這里我用的方法是2--2。
下面進入邏輯關系：
1、首先肯定要從滾動條下手：
1--計算滾動條的高度，這里有一點需要注意，層級1的高度與滾動條的總高度是一樣的，通過相似比例計算：
滾動條總高度 ：滾動條高度 = 層級2 ：層級1
=>滾動條高度 = 滾動條總高度 /（層級2 / 層級1）
2--計算鼠標拖動滾動條時的坐標位置，首先要讓鼠標無論點擊滾動條哪一個位置，都變成點擊滾動條的頂點坐標：
通過獲取 瀏覽器的Y軸坐標 - 滾動條被點擊的Y軸坐標 得到
3--實現滾動條拖動的公式：
四要素，1-拖動時瀏覽器的Y軸坐標，2-點擊時滾動條的Y軸坐標，3-瀏覽器scrollTop的值，4-當前容器的top值。
公式：1 - 2 + 3 - 4
解：
1 - 2 => 計算滾動條頂點坐標
1 - 2 + 3 => 為了避免瀏覽器Y軸坐標受滾動條數值的影響，必須加上瀏覽器scrollTop的值
1 - 2 + 3 - 4 => 為了避免滾動條受容器的位置影響，必須先清除容器的top值，也就是假設他們全都在同一個Y軸頂點上
4--限制滾動條的拖動范圍：
太簡單就不解釋了。
5--計算滾動條的當前頂點值與頂點可移動的極限值的比：
計算他們的比例純粹是為了控制 層級2 與 層級1。這是一個0-1的動態比值
2、所有東西都准備好了，剩下就是控制 層級2 與 層級1：
1--首先獲取它們兩個層級的高度，然后計算出層級2頂點可移動的極限值。
頂點可移動極限值：層級2 - 層級1。
2--控制 層級1 的scrollTop，滾動的距離與滾動條相呼應：
頂點可移動極限值 * 滾動條滾動的比值
3--完成。