侧栏弹出的时候,遮罩的css属性display设置为block显示,侧栏通过css动画transform来想右侧移动了100%的宽度translateX(100%),侧栏收回时,动画恰好与弹出的相反,其实这些动画最后都会翻译为css3动画属性,这些API只是css3动画的封装。为了点击遮罩收回侧栏,遮罩的tap事件也要绑定slideCloseEvent
//浮动球点击 侧栏展开 ballClickEvent: function() { slideUp.call( this ); }, //遮罩点击 侧栏关闭 slideCloseEvent: function() { slideDown.call( this ); } 效果图