2024年2月9日发(作者：凌平乐)

30 } 31 } 32 return me; 33 }, 34 _bindEventListener: function(){ 35 var me = this, 36 $nav = me._nav, 37 $main = me._main, 38 $container = me._container, 39 direction = me._dir, 40 position = {x : 0, y : 0}, 41 navWidth = $(), 42 transition = me._transition; 43

44 $('data-'+direction, '0'); 45 $('touchstart', function(e){ 46 var target = (0); 47

48 $('-webkit-transition', 'none'); 49 position.x = X; 50 position.y = Y; 51

52 return false;

53 }).on('touchmove', function(e){ 54 var target = (0), 55 different = X - position.x, 56 distant = parseInt($('data-'+direction)||0, 10); 57

58 //滑动距离太短,则不处理 59 if((different) >= 5){ 60 distant += different; 61 if(direction === 'left'){ 62 //左侧菜单栏 63 if(distant <= 0){ 64 distant = 0; 65 } 66 if(distant >= navWidth){ 67 distant = navWidth;

68 }

69 }else{ 70 //右侧菜单栏 71 if(distant >= 0){ 72 distant = 0; 73 } 74 if(distant <= -navWidth){ 75 distant = -navWidth;

76 } 77 } 78 $main 79 .attr('data-'+direction, distant) 80 .css('-webkit-transform', 'translate(' + distant + 'px,0)'); 81 }

82 position.x = X; 83 position.y = Y;

84 return false; 85 }).on('touchend', function(e){ 86 var distant = parseInt($('data-'+direction), 10); 87 if(direction === 'left'){ 88 distant = distant > navWidth/2 ? navWidth : 0; 89 }else{ 90 distant = distant > -navWidth/2 ? 0 : -navWidth; 91 } 92 $({ 93 '-webkit-transform': 'translate(' + distant + 'px,0)', 94 '-webkit-transition': transition 95 }).attr('data-'+direction, distant); 96 return false; 97 }); 98 return me;

99 }100 };

101 = Drawer;102 })(Zepto, this);View Code初始化代码:1 new Drawer({2 dir: 'right',//菜单位于右边,默认值为左边,根据实际需要设置3 container: $container,//总容器4 nav: $en('.left'),//菜单栏

2024年2月9日发(作者：凌平乐)

30 } 31 } 32 return me; 33 }, 34 _bindEventListener: function(){ 35 var me = this, 36 $nav = me._nav, 37 $main = me._main, 38 $container = me._container, 39 direction = me._dir, 40 position = {x : 0, y : 0}, 41 navWidth = $(), 42 transition = me._transition; 43

44 $('data-'+direction, '0'); 45 $('touchstart', function(e){ 46 var target = (0); 47

48 $('-webkit-transition', 'none'); 49 position.x = X; 50 position.y = Y; 51

52 return false;

53 }).on('touchmove', function(e){ 54 var target = (0), 55 different = X - position.x, 56 distant = parseInt($('data-'+direction)||0, 10); 57

58 //滑动距离太短,则不处理 59 if((different) >= 5){ 60 distant += different; 61 if(direction === 'left'){ 62 //左侧菜单栏 63 if(distant <= 0){ 64 distant = 0; 65 } 66 if(distant >= navWidth){ 67 distant = navWidth;

68 }

69 }else{ 70 //右侧菜单栏 71 if(distant >= 0){ 72 distant = 0; 73 } 74 if(distant <= -navWidth){ 75 distant = -navWidth;

76 } 77 } 78 $main 79 .attr('data-'+direction, distant) 80 .css('-webkit-transform', 'translate(' + distant + 'px,0)'); 81 }

82 position.x = X; 83 position.y = Y;

84 return false; 85 }).on('touchend', function(e){ 86 var distant = parseInt($('data-'+direction), 10); 87 if(direction === 'left'){ 88 distant = distant > navWidth/2 ? navWidth : 0; 89 }else{ 90 distant = distant > -navWidth/2 ? 0 : -navWidth; 91 } 92 $({ 93 '-webkit-transform': 'translate(' + distant + 'px,0)', 94 '-webkit-transition': transition 95 }).attr('data-'+direction, distant); 96 return false; 97 }); 98 return me;

99 }100 };

101 = Drawer;102 })(Zepto, this);View Code初始化代码:1 new Drawer({2 dir: 'right',//菜单位于右边,默认值为左边,根据实际需要设置3 container: $container,//总容器4 nav: $en('.left'),//菜单栏