需求：

上面是原生滾輪插件的效果圖，現(xiàn)在需要用JS實現(xiàn)一個類似的滾輪插件。

使用過的方法：

模仿滾動我采取的方式是使用overflow:scroll的方式。這樣性能是最好的但是存在以下倆種問題：

1.滑動過后并不會準確的卡在線條中間。

解決方法：當使用一個定時器檢測到滾輪停止?jié)L動了，就進行一次位置計算，不是正確位置，則設計一個動畫，讓其滾動到正確位置。但是動畫效果不理想

2.禁用scroll事件，使用touchstart, touchmove, touchend方法計算滾動速度以及滾動位置

解決方法：監(jiān)測起始位置，結束為止。當touchend事件觸發(fā)的時候接管滾輪滑動，根據手指觸摸距離以及觸摸事件給滾輪設置一個模擬人手指滑動的動畫。但是touchend事件觸發(fā)并不能夠接管默認的滾輪滑動

網上有一個類似的插件LArea，但是性能并不是特別理想。他采取的方式是通過touchstart, touchmove, touchend計算手指滾動的情況，然后使用transform進行頁面元素位置計算。

相關代碼

上圖是我用JS做的滾輪插件，只完成了滾輪一部分，但是每次滾動文本信息都定位在中間還沒有完成。大家可以使用這個代碼快速開始
項目地址：
https://github.com/mrxu0/Whee...