Browse Source

自定义滚动条(未完成)

zhangxc 5 years ago
parent
commit
5f1ba89283
1 changed files with 23 additions and 4 deletions
  1. 23 4
      src/js/scrollBar.js

+ 23 - 4
src/js/scrollBar.js

@@ -1,9 +1,29 @@
-const e = require("express");
 
 /*
 用途项目:自定义滚动条实现
 */
+ 
 (function(win, doc, $){
+  $.fn.extend({  
+    "preventScroll":function(){  
+        $(this).each(function(){  
+            var _this = this;  
+            if(navigator.userAgent.indexOf('Firefox') >= 0){   //firefox  
+                _this.addEventListener('DOMMouseScroll',function(e){  
+                    _this.scrollTop += e.detail > 0 ? 60 : -60;     
+                    e.preventDefault();  
+                },false);   
+            }else{  
+                console.log('AAAAAAAAAAAAA', _this.scrollTop += e.wheelDelta )
+                _this.onmousewheel = function(e){     
+                    e = e || window.event;     
+                    _this.scrollTop += e.wheelDelta > 0 ? -60 : 60;     
+                    return false;  
+                };  
+            }  
+        })    
+    }  
+  });
   // 定义的滚动条的构造函数
   function CusScrollBar(options) {
     // 函数的调用
@@ -132,8 +152,8 @@ const e = require("express");
     // 监听内容的滚动,同步滑块的位置
     _bindContentScroll: function() {
       var self = this;
-      self.$cont.on('scroll', function(e){
-        // e.stopPropagation()
+      self.$cont.on('scroll', function(){
+        self.$cont.preventScroll()
         var sliderEl = self.$slider && self.$slider[0];
         if (sliderEl) {
           // 设置滑块的位置
@@ -142,7 +162,6 @@ const e = require("express");
       });
       return self;
     },
-
     // 鼠标滚轮事件
     _bindMousewheel: function() {
       var self = this;