748
questions
0
votes
0
answers
96
views
Different behaviour between stackblitz and local project
Hello everyone thanks for your read.
My project is on stackblitz : https://stackblitz.com/edit/ionic-angular-v5-m8xt8c?file=package.json
Very simple, just a press button that increases button progress ...
- 29
2
votes
1
answer
3k
views
HammerJs Gesture with Angular 9
I have a project with ionic/ anuglar 6 and hammerJs which rocks but I have decided to update to anuglar9.1.6 and ionic 5.0.0.
The problem is that my gesture doesn't work anymore ! my press and pressup ...
- 29
0
votes
1
answer
63
views
How to create a page-jump when linking a page from another page
I have a few sections on my webpage which become active as I scroll or click the specific link on the side navbar. I want to jump to a certain section when I visit this page from another page without ...
1
vote
0
answers
213
views
Ionic + HammerJS - Scroll left right using pan
I have an ionic app with a canvas (inside ion-content) and it is wider than screen, so I am using HammerJS to scroll on touch pan.
For scroll to the right (drag screen to the left) it is working:
...
0
votes
1
answer
438
views
Swiping from top to bottom on mobile doesn't work (hammer js)
I am using hammerjs in my angular app. I have on the main page carousel of images, which I can swipe on left and on right. Also I have a fixed header, when I click on my hamburger button, menu is ...
- 305
3
votes
1
answer
377
views
Difference between panend and pancancel in Hammer.js?
I can't find the difference anywhere in the documentation between panend and pancancel handlers for pan events in Hammer.js documentation - what is the difference between the two?
I imagine swiping ...
- 3,488
1
vote
2
answers
2k
views
Importing JS libraries to Vue.js
I'm trying to use hammer.js on my project, however I'm having trouble importing it. I have installed the library through npm by npm i hammerjs. Imported it on my main.js file as import 'hammerjs' and ...
0
votes
1
answer
733
views
HammerJS stopped working after updating to Angular 9
I've recently updated my web app from Angular 8 to Angular 9. I noticed that HammerJS is not working properly anymore. After a few search on Google, I rapidly found out I needed to add HammerModule as ...
- 549
1
vote
1
answer
120
views
My Hammer.js code does not work with IF condition
I am using jQuery and Hammer.js to modify the style properties of my website when I "tap" on the screen on the smartphone.
I have 3 elements : img#icone-bijagos, p#texte-bijagos and a#lien-bijagos. ...
- 11
1
vote
1
answer
1k
views
Angular material mat-slider not working properly with Hammer.js
I was stuck on this for a while so sharing this (as actively encouraged on SO) in case others are facing the same problem.
The problem
In Angular when a custom Hammer.js config is created to prevent ...
- 1,297
0
votes
1
answer
995
views
(swipeLeft) doesn't work with hammerjs - what's wrong?
i want my Mobile-App (using Ionic) to navigate to the next page when being swiped, but neither the device recognises my touch, nor does the web page on localhost.
Since the terminal doesn't show me ...
- 1
3
votes
2
answers
2k
views
How to keep vertical scrolling and zooming and detect horizontal and diagonal panning/swiping with Hammer.js in Angular 9?
What I want
… is to detect panning (or swiping) using Hammer.js in Angular 9.
It should should work like this:
horizontal panning should be detected
diagonal panning with certain degrees should be ...
- 2,766
0
votes
1
answer
856
views
Angular 8: HammerJs swipeRight and swipeLeft not working inside overflow:auto
I'm making an application that run on a mobile phone. I would like to be able to use the swipe events inside a scrollable container. Right now, if I use (swipeRight)="" or (swipeLeft)="" the events ...
4
votes
2
answers
3k
views
How to lazy load HammerJS in Angular 9 project?
I use HammerJS in my Angular project for a few gestures like panleft and panrigth in lazy load component. When I build app, lazy load component is in separate bundle, but hammer.js stay in ...
7
votes
3
answers
8k
views
Angular 9 never calls HammerGestureConfig.buildHammer
After update to Angular 9 it does not work to use Hammer.js anymore. We have extended the Angular HammerGestureConfig like the following.:
import {HammerGestureConfig} from '@angular/platform-browser'...
- 6,737
14
votes
1
answer
4k
views
App won't recognize swipes using Hammer.JS and HammerGestureConfig in Angular 9
I can't recognize swipes in my Angular app using Hammer.JS. It's setup like this:
"@angular/core": "~9.0.0-next.6",
"hammerjs": "^2.0.8",
"zone.js": "~0.10.2"
app.module.ts is looking like this:
...
- 2,766
0
votes
2
answers
1k
views
hammer.js swipe right next page
I want to swipe right for next page and swipe right for previous page, I searched long time for ways to do, nothing seems to work
hammer.js seems the most promising
hammertime.get('swipe').set({ ...
- 41
3
votes
1
answer
3k
views
HammerJs: enable vertical scroll with horizontal swipe
I've got an angular 7 website, and I want to add horizontal swipe to one component, and vertical swipe to another (the components are in the same module). I'm using hammerjs for that.
By default, ...
- 34.3k
3
votes
2
answers
2k
views
HammerJS swipe not working on elements with overflow css property
EDIT: The snippet works fine when embedded in the question, but not when edited; which made me realize it had to do with underlying containers that can scroll... I tested this on my phone and hammer ...
- 9,083
-1
votes
3
answers
2k
views
Not able to install npm install react-native-gesture-handler
I am trying to use React Native Navigation 5. I have added all the dependency but when i am adding
npm install react-native-gesture-handler it is giving the below error:
npm ERR! code ENOENT
...
- 2,911
4
votes
0
answers
753
views
How to create an iOS style dragging using HammerJS and CSS?
I'm trying to create an iOS 'style' modal sheet that that will popup and then the users can drag it down and the modal sheet will follow the users touch gesture and then it will disappear OFF the ...
- 193
0
votes
1
answer
747
views
angular detect doubleclick or tap events
I have a workflow to use doubleclick in computer and touch in mobile.
both events will fire same function.
I'm using (tap) and (dblclick) but both events works in every device.
Is it a way to do it ...
- 3,668
3
votes
0
answers
206
views
JavaScript compression error while compressing JSDOM with JSMin
My project is developed with TypeScript for frontend.
Mocha - for unit test
JSDOM - for DOM mocking
Hammer.js - for touch UX
Grunt, JSMin, etc.
The project file structure is something like this:
...
- 716
15
votes
1
answer
8k
views
Angular: when update from 8 to 9 - hammerjs + @angular/platform-browser stopped working
I'm using hammerjs for detecting swipe on a small Angular 8 app.
I followed this article - https://medium.com/angular-in-depth/gestures-in-an-angular-application-dde71804c0d0 - and I'm using hammerjs ...
- 2,018
0
votes
1
answer
93
views
Using Hammer.js on WeChat minigame
I've tried to use Hammer.js for touch UX on WeChat minigame.
I searched for a while but could not find any similar question or answer.
First, I just tried to use Hammer.js in the normal way.
After ...
- 716
1
vote
1
answer
8k
views
Capture swipe event on entire screen with Hammer and Angular 8
I'm trying to capture swipe gestures on the entire screen of my application. The idea is to have these dispatch actions that other services can listen to, in this case a router for navigation purposes....
- 9,083
3
votes
0
answers
587
views
iOS 13 has broke part of an app using cdk-virtual-scroll-viewport and hammerjs
After updating to iOS 13.x my Angular Apps Swipe gesture is no longer working properly to show side menu items. After updating it fails to to lock the cdk-virtual-scroll-viewport leading to undesired ...
- 39
0
votes
1
answer
260
views
Hammerjs tap and swipedown
How to implement drag-down to trigger an event in angular material using hammerjs?
Like below image on gray bar just above facebook button the dragdown event needs to be done.
2
votes
0
answers
192
views
Pinch from every point with Hammerjs
Currently, I'm working with hammer.js with the following example:
https://bl.ocks.org/redgeoff/fe2e55fe710f341c335ba445569d1783
With this example, it's only possible to pinch from the middle. If I ...
- 61
0
votes
1
answer
1k
views
hammer.js, prevent "tap" from firing on "doubletap"
I have the following setup
function hammerIt(elm) {
hammertime = new Hammer(elm, {});
hammertime.on('tap doubletap pan pinch panstart panend pinchend swipe swipeleft swiperight swipedown ...
- 93
0
votes
1
answer
531
views
panstart and panmove is not working on Android devices in Firefox browser
I am working on the Angular7 project and I am using hammerjs version 2.0.1. I have a map which I need to pan on mobile devices. I checked on android devices. it works fine on chrome browser but on ...
0
votes
2
answers
424
views
How to use Hammer.js plugin with JavaScript?
I'm using hammer.js plugin library with JavaScript but it throws me error that target.addEventListener is not a function in hammer.js file. I tried to look online but couldn't find anything that works ...
1
vote
1
answer
244
views
how to keep both browser zoom and hammer js swipe events in angular7
In my application Iadded hammer.js swipeleft and swiperight events to the image tag.It works fine but It disables the browser scroll.After spending lot of time I found that the culprit is hammerjs....
- 1,436
0
votes
0
answers
1k
views
Hammerjs with Angular 7 cannot find Hammer
I ran the command npm install --save hammerjs and also put import 'hammerjs'; inside my main.ts.
However when I write for instance
var test = document.getElementById('test');
var hammer = new Hammer(...
- 331
1
vote
1
answer
2k
views
How to simulate a swipe on click?
I am currently trying to develop an app with some card swipe actions (similar to the way Tinder works).
I found a boilerplate which works pretty well in my current code :
https://www.cssscript.com/...
3
votes
0
answers
175
views
Drag and Drop in Hammer.js?
I'm working on a Tinder-remake. Just for a bit of practice.
I want to use Hammer.js with the Drag an Drop API but i can't figure out how to let it work. The recognizer works fine but when i'm ...
1
vote
2
answers
2k
views
How to disable HammerJS (Tap) gesture for disabled Elements
What I'm trying to do:
using the (tap) gesture in templates
do not fire the (tap) event if the element is 'disabled'
this would bring the (tap) event inline with the built-in angular (click) event. ...
- 1,126
0
votes
1
answer
583
views
Swipe Event not propagating in Chrome Mobile Emulator and Chrome Mobile Android
I want to have a sidebar in stenciljs which is a webcomponent, which has another component inside of it. The sidebar should close when I swipe left on anywhere in it. In Chrome desktop view it works ...
0
votes
0
answers
252
views
simple Hammer.js example works on iPhone 6 (iOS 12.4.1) but not on iPhone 7+ (iOS 13.1.2)
This simple Hammer.js example, which detects swipeleft and swiperight events
https://codepen.io/mindmodel/pen/yLLYGKr
var mc = new Hammer(myElement);
// listen to events...
mc.on("...
- 872
4
votes
0
answers
397
views
Pan events in ios 13 aren't behaving as expected
I'm trying to fix a bug that appears only on iOS13 with a horizontally scrolling image gallery. We're using Hammer.js, and users are able to swipe left (to get the next image) properly, but they aren'...
- 41
2
votes
0
answers
403
views
hammerjs swipe feature not working on iOS13 when diagonally swiping
Since upgrade to ios13 swiping stop working properly at least it doesn't work how I want it to work.
When swiping from bottom left to top right swiping right event doesn't get fired. Is there any ...
- 1,083
0
votes
1
answer
261
views
Refs return as null
I have an array of 'selected cards' stored in a 'selectedCards' state, which updates depending on whether the user has referenced the 'Card' ID or not (using a checkbox).
When the component mounts, a ...
2
votes
1
answer
466
views
IOS 13 not raising panend events when changing panning direction
I have a custom image slider using Hammer.js events.
I use the following to create my 'hammer' object:
const hammerPan = new Hammer(domElement,
{
// lock vertical scrolling when ...
- 145k
0
votes
1
answer
454
views
Code iOS scrollbars to workaround Bootstrap 4 Carousel Bug: Click/Tap causes additional unwanted swipes
The issue & environment
Running Bootstrap 4 from CDN and there is currently a known bug affecting the Carousel on iOS devices for which a fix github #28558 is devised, but still pending i.e. NOT ...
- 107
0
votes
1
answer
415
views
Angular Material tooltip bug workaround with HammerJS
I recently discovered a few bugs relating to touch scrolling issues from mat-tooltips in my application. This behavior is outlined here: GitHub Issue. There is a workaround solution posted in the ...
- 1,130
2
votes
1
answer
754
views
Performing a fast swipe causes button to not react to first click
I am building an angular application, with a responsive navigation using the angular navbar. To let the navigation feel really smooth i use hammer to enable swiping right to show, and swiping left to ...
- 396
1
vote
3
answers
2k
views
Why hammer.js swiping does not work for iPhone
I couldn't find a more direct way to ask people who are familiar with hammer.js so i'm posting here.
So i've been working on a web app with 8thwall using hammer.js for swiping/scrolling. i've been ...
user2395639
1
vote
1
answer
779
views
CSS width transition not fast enough and causes jittery UI when joined with translateX
The Code
Code at CodeSandBox -- Demo
There is a lot of code in that above codesandbox, so I'll try to paste the relevant parts here:
Based on the series of drag / pan gesture's total X-direction ...
- 64.7k
2
votes
0
answers
423
views
Cannot scroll on Ionic4 application with Hammer events
I have a big problem with Ionic4 and HammerJS... for my ion-list I have many ion-item elements with (tap) and press events. Because scrolling not works if I´m using HammerJS, I have the following CSS ...
- 1,482
0
votes
1
answer
3k
views
How to use Hammer.js for swiping?
So i've got hammer.js swipe to work on my div. the swipe region looks like this
https://i.sstatic.net/x1a82.jpg
so basically, i want the orange area to be able to swipe left/right and when it ...
user2395639