748
questions
2
votes
0
answers
920
views
Angular 4+ Video Frame Seeking Performance Optimization
I am currently implementing a UI inspired by this: https://dribbble.com/shots/2111528-Ice-Cream-Love-Motion
My current WIP can be tested here: https://datrinh.github.io/DesignHub17/
Important code ...
- 173
1
vote
1
answer
1k
views
hammer.js - need default zoom behaviour + swipe
I want to make it so swiping over an image will take a user to the previous or next image, depending on the direction of the swipe. That part works great, BUT it removes the ability to zoom in on the ...
- 11
2
votes
1
answer
275
views
Hammers.js and table touch events
I have an idea to make some web page suitable for touch devices, and there I have a table with rows and columns. I planned to click on some cell and produce call to different pages or functions. I ...
- 67
12
votes
1
answer
1k
views
Sync directional controls with swipe events
I've built two kinds of functionality in controlling the slider that I've built. One is buttons with directional controls and other is touch/swipe events. How can sync both of them so that when i ...
- 1,111
0
votes
1
answer
2k
views
How to Initialize and Set Options in hammer.js in Angular 2 with TypeScript
I want to use hammer.js in my Angular app. I did successfully install jquery, but I am new to all of this and I don't really know how to proceed with something more complex that requires setting ...
- 538
6
votes
1
answer
7k
views
adding hammerjs to a react js component properly
I try to add hammer js to my reactjs component and my component looks as it follows
import React from 'react';
import _ from 'underscore';
import Hammer from 'hammerjs';
class Slider extends React....
- 9,015
0
votes
2
answers
983
views
Swipe and click events firing at the same time - Hammer.js
I am trying to allow swiping on a parent element and clicking on the child element. Currently the swipe and click is firing when I just want the swipe to fire.
HTML
<div id="slider">
<div ...
- 5,956
3
votes
1
answer
1k
views
Hammer.js recognize pinch and rotate separately
I am trying to use Hammer.js to recognize touch events. I want to do separate things on the pinch and rotate gesture, but once I add both recognizers to my Hammer.Manager, only the rotate gesture is ...
- 33
1
vote
2
answers
4k
views
v-touch not working when scrollable in mobile
I'm using vue-js 2.0 and vue-touch to make swipe possible in mobile.
If I initialize my div as follows:
<v-touch v-on:swipeleft="nextDay" v-on:swiperight="previousDay" class="page-content" :style=...
- 4,449
0
votes
1
answer
893
views
Measure swipe distance
This question has been probably asked many times but I can't actually find the answer nor here nor on Google. Probably I'm searching it with wrong words, so I decided to ask here on StackOverflow.
I'...
- 1,116
0
votes
1
answer
682
views
Detect only swipe events over an overlay div
I am trying to detect left,right swipe events on the screen using hammer.js.
Currently its detecting swipe action over entire screen area since i am passing the main content div class.I've created an ...
0
votes
1
answer
5k
views
How to enable scrolling in Hammer.js
I tried doing the following, but I still couldn't get vertical scrolling to work with the hammer.js element.
mc = new Hammer.Manager(myElement, {
touchAction: 'auto',
recognizers: [
[...
- 3,087
1
vote
0
answers
316
views
Hammer.js how to enable vertical scrolling on mobile
I have a hammer.js swiper element that only allows pan left/right. I have a child element that I used a high z-index for it so that it go over the hammer.js element. I am able to scroll on my laptop, ...
- 3,087
3
votes
3
answers
4k
views
Angular2: HammerJS swipe for md-tab-group
I've implemented HammerJS in my Angular2 webapp and I've also tested the example code out. This code uses an Array of objects and seems to work flawlessly. However, I've been trying to implement the ...
- 2,268
0
votes
1
answer
511
views
Swipe event propagation with nested div doesn't work
Hi I've the following html structure:
<div class="container">
<div class="scroller">
<div id ="goldenPage" class="page active">
&...
- 1
0
votes
1
answer
1k
views
Body vertical swipe to scroll with hammerjs
I would like to mimic touch device scroll behaviour with hammerjs
I can listen to swipe events and stuff and make calculations to animate to position based on velocity but it wont be like it work on ...
- 4,075
0
votes
1
answer
1k
views
How can I suppress "WARN: 'Could not find HammerJS." on each text execution?
When executing tests, each test logs the following:
WARN: 'Could not find HammerJS. Certain Angular Material components may not work correctly.'
From from Angular Material Getting Started Guide:
...
- 9,364
0
votes
2
answers
659
views
hammer.js exhibits pinch lag when changing pinch direction (tested on Android)
I've noticed when using Hammer-time.js for zoom events that there is a noticeable lag in the pinch zoom event if you go from pinch in to pinch out (or vice versa) without taking your fingers off the ...
- 3,055
0
votes
1
answer
842
views
angular2 and typescript error
I am trying to create an angular 2 application and use hammerjs for the touch gestures.
Currently I am trying to combine the quickstarter application from: Angular 2 with the hammerjs application ...
- 379
1
vote
0
answers
126
views
Apply only certain events in a div for Swipe Navigation?
I'm trying to implement swipe navigation for my mobile website. I'm using Angular 2 with hammerjs for the swipe event. I'm trying to figure out a good solution as to how I can add the swipe event.
I ...
- 10.2k
1
vote
1
answer
1k
views
Angular2: hammerjs is not found
I'm trying to integrate Angular's material design and I'm the following the official documentation.
I have installed the compnents and hammerJS using npm:
npm install --save @angular/material
npm ...
- 3,523
1
vote
1
answer
574
views
How do we configure hammerjs pinch in/out speed?
I am using hammerjs pinch in/out on my SVG element. Currently on single pinch out it is zooming out the maximum but I would like to configure the speed so that I can restrict the zoom based on my step ...
- 240
5
votes
3
answers
4k
views
Turn off Hammer JS events in Angular 2 to allow scrolling
I am using Hammer JS for swipeleft and swiperight events, but the user still needs to be able to scroll up and down. I was able to capture the swipeup and swipedown events, but what I really want to ...
- 151
10
votes
2
answers
155
views
Strategy for translating a UX `pan` gesture to set a linear value without an upper bound
I'm trying to set a slider (actually a kitchen timer) using a pan gesture in ionic2 see: http://ionicframework.com/docs/v2/components/#gestures
The slider/timer has an open upper-bound that could be ...
- 4,517
2
votes
2
answers
3k
views
Swipe up/down not working on Ionic 2
How can I use swipe up or swipe down with Ionic 2?
I've tried the Gestures API but it only fires on horizontal swipe.
<ion-card (swipe)="swipePage($event)">
</ion-card>
- 485
0
votes
2
answers
1k
views
How to bind hammer.js to multiple ids
On a page I have several bootstrap carousels, and I want them to be working on swipe. To do that, I use hammer.js. It is not a problem to bind hammer.js to one element, for example:
var swipeElement =...
- 1,433
1
vote
2
answers
334
views
What do I wrap a document.getElementById so as not to throw a TypeError when ID can't be found?
I'm using the Hammer.js library (http://hammerjs.github.io/) to enable touch gestures in a vanilla javascript environment. After including the library, I have a call that works on my gallery pages. ...
- 509
0
votes
2
answers
1k
views
Disable Hammer.js swiping on the slider?
I'm creating a slider with Materialize CSS's code but on tablet and mobile you can swipe left or right to go to the next slide. I would like to disable this.
I tried googling and checking their ...
- 547
2
votes
1
answer
2k
views
Ionic 2 **panup** and **pandown** event are not working
I'm working on Ionic 2 project and I want to implement drag and drop feature. For that, I used bellow event in Ionic 2
<div (press) = "onDragInit(item, $event)"
(panstart)="dragStart($...
- 1,511
2
votes
2
answers
1k
views
How to keep default browser behavior (zoom) on pinch with Hammerjs?
I use Hammerjs for swiping and tapping. However as soon as I start using it on any element
var hammer = new Hammer(document.getElementById("square"));
the default browser's behavior for "pinch" ...
- 579
2
votes
1
answer
759
views
How can I use a HammerJS pinch gesture on iOS without scrolling a page?
I'm using Ember-Gestures which implements Hammer.js in a Cordova app to implement some simple gesture controls.
I'm running into a major problem whereby any gesture that triggers an animation (...
- 801
0
votes
1
answer
481
views
Hammer JS swipe calendar dates
I have hammer js and the jquery-hammer plugin that handles a very simple swipe action.
What should happen is that when I swipe left I have a calendar with a date that goes back with one day and when ...
- 591
2
votes
0
answers
115
views
No tick call when using phonegap + hammerjs + angularjs or zonejs + android
I have an app built in angular2 that works fine in browser and when phonegap-bundled for iOS. It uses hammerjs to handle touch events like pan and pinch.
However, when I bundle it for Android, ...
- 71
2
votes
1
answer
2k
views
How to style an translateX depending on Hammer.js pan?
I want to translateX() an element when the user pans it using Hammer.js. When the user drags the content left, I want to translate the content left. The same for right.
Current code:
var manager = ...
- 3,008
1
vote
0
answers
92
views
Angular-Hammer: Integrate functionality into an already existing Controller
Hello there and thanks for stopping by,
I've been stuck for many hours trying to integrate Hammer.js 2.x into my Angular 1.x application. I took two different approaches:
First, I tried to to it ...
- 300
106
votes
10
answers
87k
views
Angular - 'Could not find HammerJS'
I'm working on a simple angular project where I am trying to import Material Design into my project but some of the components aren't working properly and a console warning says:
Could not find ...
- 8,341
3
votes
1
answer
4k
views
Pinch zoom on PDF.js using Hammer.js
I am trying to use Hammer.js to perform a pinch zoom with my PDF.js, however, it doesn't work, despite much tries. I didn't get any errors when I debug my codes on my mobile as well, but I just still ...
- 31
33
votes
5
answers
12k
views
Vertical scroll is not working with HammerJS and Angular2
I'm having a problem using the HammerJS with Angular2.
I have a carousel (based on the bootstrap carousel with Angular2 event handlers) where I'm listening to the swipe left and swipe right events.
...
- 445
1
vote
0
answers
586
views
Suddenly Getting "Duplicate Identifier" Errors in My Angular2 App [duplicate]
I've been working on an Angular 2 app, and have made steady progress. Then, all of sudden, half way through the day today I got an error when trying to boot up the app. I haven't been working on ...
- 6,209
2
votes
0
answers
418
views
Nested Pan with Hammer.js
I try to have two sorts of pan on my listing :
-One vertical pan on the listing wrapper for init a pull to refresh action
-One horizontal pan on each rows of listing for display delete/edit actions
...
0
votes
0
answers
1k
views
Drag drop and swipe functionality on same element
For an academic project, I am trying to implement a drag drop functionality on a list of some items, which i have achieved using dragula.js
I prepared a demo for same on jsfiddle, which can be found ...
- 1
0
votes
0
answers
137
views
Not scroll when pan left, pan right hammer 2.0.8
I use the pan of hammer 2.0.8 when user touchstart from edges screen to drag open another div as ScreenEdgePanGestureRecognizer IOS. but I can not disable the scroll while dragging my div. Please help ...
- 1
0
votes
1
answer
94
views
Hammer.js setting time using domEevents
I have following code to bind pressup event on dynamically added elements:
$('#grid').hammer({time: 2000, domEvents: true}).on('pressup', 'tr', function (e) {
$(this).addClass('selected');
});
...
- 86
1
vote
2
answers
608
views
Angular material 2 generates errors
I Have read and followed the instructions and suggestions given here and here and still cant stop this errors from popping up. Below is the installation directions that I followed
And these are the ...
- 735
1
vote
0
answers
357
views
angular2-grid + hammerjs: Fire drag events on press
I have an angular 2 web application. I am using angular2-grid for it's drag item features. Sadly, angular2-grid is not touch enabled. Hence, I have integrated HammerJs. I am able to handle angular2-...
- 1,135
0
votes
1
answer
955
views
Angular2, HammerJs, swipeup not working with android
I have a ngFor list of items. Each item has a swipeleft/swiperight directive that displays a delete button. (Think iOS message interactions). When i go to swipeup however, as if to scroll through the ...
- 245
2
votes
1
answer
7k
views
Pinch zoom with PDF.js
I have a mobile app that renderes pdfs with PDF.js. My frameworks are Ionic and Angular.
I can render the pdfs, but I have problems with the zooming. When I use the Ionic zoom, the pdf is blurred. PDF....
- 2,429
1
vote
1
answer
2k
views
Hammertime vertical scroll not working
I am using Hammerjs/Hammertime
to implement a swipe feature on mobile and can't seem to get it to work with vertical scrolling. Works fine when I swipe horizontally. Here is my code:
var ...
- 2,345
7
votes
0
answers
618
views
hammer.js pan limit—how to set boundaries
I currently have this code:
var hammertime = new Hammer(canvasContainer);
var x0, y0;
hammertime.on('panstart', function(ev){
x0=stage.position.x;
y0=stage.position.y;
});
hammertime.on('pan', ...
- 12.5k
5
votes
1
answer
2k
views
rotate on hammer.js bug
I have an issue with rotate on hammer.js. On first touch with two fingers the element immediately rotates through 180 deg. Even the rotate example at http://hammerjs.github.io/ does this strange ...
