Bugs in Carrousel on Mobil

Topic: Bugs in Carrousel on Mobil

Carlos Ernesto Bernal Hernández pro premium asked 3 years ago

**Expected behavior**Hello Recently I am trying to implement an ecommerce using mdbootstrap and carousel as homepage**Actual behavior**When I navigate on mobil Can`t scroll up or down when tap at the image**Resources (screenshots, code snippets etc.)**

Bartosz Termena staff answered 3 years ago

Dear @Carlos Ernesto Bernal Hernández

Just add a global HammerJS config in app.module.ts file, below is an example of how to do it:

import { HammerGestureConfig, HAMMER_GESTURE_CONFIG } from '@angular/platform-browser';
declare var Hammer: any;

export class MyHammerConfig extends HammerGestureConfig {
  overrides = <any> {
    'pan': { direction: Hammer.DIRECTION_All },
    'swipe': { direction: Hammer.DIRECTION_VERTICAL },

  buildHammer(element: HTMLElement) {
    const mc = new Hammer(element, {
      touchAction: 'auto',
          inputClass: Hammer.SUPPORT_POINTER_EVENTS ? Hammer.PointerEventInput : Hammer.TouchInput,
          recognizers: [
            [Hammer.Swipe, {
              direction: Hammer.DIRECTION_HORIZONTAL
    return mc;

  declarations: [
  imports: [
  providers: [
      useClass: MyHammerConfig

For more information check this out: https://mdbootstrap.com/docs/angular/advanced/mobile/

Hope it helps!

Best Regards, Bartosz.

enter image description here This is the picture when i am testing then i am scrolling with my finger and the screen is sticky at all, dont allow any movement

Este es el codigo que estoy usando Second slide

Este es el codigo que estoy usando Second slide

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue
  • User: Pro
  • Premium support: Yes
  • Technology: MDB Angular
  • MDB Version: 8.1.1
  • Device: IPhone
  • Browser: Safari
  • OS: iOS
  • Provided sample code: No
  • Provided link: No