Angular-Touch库用法示例
本文实例讲述了Angular-Touch库用法。分享给大家供大家参考，具体如下：
Angular-touch库用的不多，网上的例子也不多。写个触屏滑动的事件。
先在页面上弄个div
<divid="content"align="center"ng-app="imageApp"image-controller=""> <pstyle="position:absolute;width:100%;margin-top:30px;z-index:-1;"> <imgid="show"src="assets/image/logo.jpg"/> </p> </div>
引入两个库
<scripttype="text/javascript"src="js/angular/1.4.6/angular.min.js"></script> <scripttype="text/javascript"src="js/angular/1.4.6/angular-touch.min.js"></script>
注册事件
try{
angular.module('imageApp',['ngTouch'])
.directive('imageController',['$swipe',function($swipe){
return{
restrict:'EA',
link:function(scope,ele,attrs,ctrl){
varstartX,startY,locked=false;
$swipe.bind(ele,{
'start':function(coords){
startX=coords.x;
startY=coords.y;
},
'move':function(coords){
vardelta=coords.x-startX;
if(delta<-300&&!locked){
console.log('trunright');
}elseif(delta>300&&!locked){
console.log('trunleft');
}
},
'end':function(coords){
},
'cancel':function(coords){
}
});
}
}
}
]);
}catch(e){
console.error(e);
}
更多关于AngularJS相关内容感兴趣的读者可查看本站专题：《AngularJS入门与进阶教程》及《AngularJSMVC架构总结》
希望本文所述对大家AngularJS程序设计有所帮助。
热门推荐
10 小红书平安祝福语简短
11 生日祝福语大全女孩简短
12 收生日红包祝福语 简短
13 领证幽默祝福语简短
14 法考面试祝福语简短
15 老哥出门祝福语简短语
16 送灯祝福语简短独特
17 幼儿狗年祝福语大全简短
18 好听的元旦简短祝福语