adzialocha / Angular Swipe
Licence: mit
Simple vertical and horizontal swipe gesture directive for angular js
Programming Languages
javascript 184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Angular Swipe
IwanttoworkatnuveoVocê é pessoa desenvolvedora? Quer trabalhar com Inteligência artificial? Esse repositório é pra você!
Stars: ✭ 76 (-13.64%)
Mutual labels: angularjs
FormioA Form and Data Management Platform for Progressive Web Applications.
Stars: ✭ 1,245 (+1314.77%)
Mutual labels: angularjs
PaperadminA flat admin dashboard using Angular JS 2/4
Stars: ✭ 80 (-9.09%)
Mutual labels: angularjs
Angular Full StackAngular Full Stack project built using Angular, Express, Mongoose and Node. Whole stack in TypeScript.
Stars: ✭ 1,261 (+1332.95%)
Mutual labels: angularjs
Angular2Angular 2 Seed
Stars: ✭ 75 (-14.77%)
Mutual labels: angularjs
Docker Cloud Platform使用Docker构建云平台,Docker云平台系列共三讲,Docker基础、Docker进阶、基于Docker的云平台方案。OpenStack+Docker+RestAPI+OAuth/HMAC+RabbitMQ/ZMQ+OpenResty/HAProxy/Nginx/APIGateway+Bootstrap/AngularJS+Ansible+K8S/Mesos/Marathon构建/探索微服务最佳实践。
Stars: ✭ 86 (-2.27%)
Mutual labels: angularjs
Angularjs HubbubAngular JS HubBub chat application
Stars: ✭ 82 (-6.82%)
Mutual labels: angularjs
React Easy SwipeEasy handler for common swipe operations
Stars: ✭ 85 (-3.41%)
Mutual labels: swipe
OpenbrewsA cross-platform open source app to help you brew beer.
Stars: ✭ 78 (-11.36%)
Mutual labels: angularjs
AbmediaviewMedia view which subclasses UIImageView, and can display & load images, videos, GIFs, and audio and from the web, and has functionality to minimize from fullscreen, as well as show GIF previews for videos.
Stars: ✭ 79 (-10.23%)
Mutual labels: swipe
CodechartaCodeCharta visualizes multiple code metrics using 3D tree maps.
Stars: ✭ 85 (-3.41%)
Mutual labels: angularjs
Angular2 DemoA simple demo for Angular 2
Stars: ✭ 77 (-12.5%)
Mutual labels: angularjs
Angular BoilerplateAn opinionated boilerplate project for AngularJS applications, crafted with best practices in mind.
Stars: ✭ 88 (+0%)
Mutual labels: angularjs
Ionic Tinder UiJust a Tinder UI on Ionic
Stars: ✭ 86 (-2.27%)
Mutual labels: swipe
angular-swipe
Simple vertical/horizontal swipe gesture directives and a swipe service for angular js >= 1.6. Small extension of the existing angular $swipe service.
Install
- Add this line to your bower.json dependencies and run bower install afterwards.
"angular-swipe": "~0.2.1"
- Include the required source file (this path or similar)
<script src="bower_components/dist/angular-swipe.js"></script>
- Inject the
swipe
module into your app.
angular.module('app', ['swipe']);
Usage
Module Name (Dependency)
Directives
- ng-swipe-up
- ng-swipe-down
- ng-swipe-left
- ng-swipe-right
Directive Attributes
ng-swipe-disable-mouse
"This attribute is useful for text that should still be selectable by the mouse and not trigger the swipe action."
Service
Example
<div class="page" ng-controller="AppCtrl">
<div class="container" ng-swipe-up="swipe($event)">
<h1>Swipe me up!</h1>
</div>
</div>
var app = angular.module('app', [ 'swipe' ]);
app.controller('AppCtrl', function AppCtrl($scope) {
$scope.swipe = function($event) {
console.log($event);
};
})
Known issues and workarounds
-
ng-swipe-up and ng-swipe-down uses preventDefault when you start swiping. This prevents clicks from giving focus to input fields. Adding a noPreventDefault
class to these elements will not preventDefault when the swipe start on them and thus allow clicks to work.
-
When embedding a Google map you might want to prevent a swipe event specifically inside the map. You can do that by adding the noStartDrag
class to the Google map HTML element
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at
[email protected].