[jQuery Plugin] dragScroll.js- 幫頁面上可捲動的區塊套上 drag/swipe 效果

分享:

當我們頁面上出現可捲動區域,尤其是橫向捲動時,在電腦上會因為滾輪預設不會左右捲動的關係而變得很難操作,為了處理這個我們就可以在上面套上 drag 的事件方便使用者可以直接拖曳後使用,這時就可以考慮 dragScroll.js 這隻套件。

使用上就是直接套用就好:

$('.drag').dragScroll();

 

可以加上 direction 指定只能橫向或縱向捲動:

$('.drag').dragscroll({
  direction: 'scrollTop' //or scrollLeft
});

 

事件觸發時的處理:

$('.drag').dragScroll({
  onStart: function($this) {
    console.log($this);
  },
  onMove: function($this) {
    console.log($this);
  },
  onEnd: function($this) {
    console.log($this);
  }
});

 

 

 

課程推薦

和我們交流

加入我們的社群,裡面會有一些技術的內容、有趣的技術梗,以及職缺的分享,歡迎和我們一起討論。