SideNav no Touch Operation

Topic: SideNav no Touch Operation

webmaster2 priority asked 5 years ago

I cannot swipe the sidenav off of the screen on mobile. When viewing on a desktop I am getting the following console error:
Uncaught TypeError: this.$dragTarget.hammer is not a function
at SideNav.bindTouchEvents (sidenav.js:45)
at SideNav.init (sidenav.js:36)
at new SideNav (sidenav.js:28)
at HTMLAnchorElement.<anonymous> (sidenav.js:361)
at Function.each (ScriptResource.axd?d=4bMApOb58R6igmkUEZ0eXtdJHB870e4MFbamy4biz87JTagEazUCN8i4d2hQPDNzuR__g3UyoIbsXXd76aCW1N11ssf7DPvicShZybtw7VI4a9-6hNT4d61ZzgwTyt0FiGlUGQti26m0v2O1TX9uZkD4fw3c3eqSu54RCcAqzBR5_kiS2lyTD4MhCjqf-OFL0&t=45b53253:2)
at e.fn.init.each (ScriptResource.axd?d=4bMApOb58R6igmkUEZ0eXtdJHB870e4MFbamy4biz87JTagEazUCN8i4d2hQPDNzuR__g3UyoIbsXXd76aCW1N11ssf7DPvicShZybtw7VI4a9-6hNT4d61ZzgwTyt0FiGlUGQti26m0v2O1TX9uZkD4fw3c3eqSu54RCcAqzBR5_kiS2lyTD4MhCjqf-OFL0&t=45b53253:2)
at e.fn.init.$.fn.sideNav (sidenav.js:360)
at sidenav:246

The code in error is:

this.$dragTarget.hammer({

prevent_default:false

}).bind('pan', this.panEventHandler.bind(this)).bind('panend', this.panendEventHandler.bind(this));

In the bindTouchEvents function of sidenav.js

I am using MDB pro with the lite versions of .css and .js

Add comment

Jakub Mandra staff answered 5 years ago

0 0 Best answer

Hi,

Have you been working on that?
Because I cannot see those errors on NBB Development, also SideNav works on mobile...

How can we reproduce the problem?

webmaster2 priority commented 5 years ago

Yes I did end up getting rid of the hammer error by using mdb instead of mdb-lite. However you cannot swipe the sidenav away off the screen.

Jakub Mandra staff commented 5 years ago

I tested your NBB Development on Xiaomi with Android 7.1.2 and Chrome - worked well.
Side nav collapse onTouch/onClick on the overlay.

What device do you use to test?

webmaster2 priority commented 5 years ago

The sidenav width will cover small device screens. I want the user to be able to close the sidenav by swiping left on the sidenav itself. version is 4.7.1 pro

Jakub Mandra staff commented 5 years ago

Here you can find all the options which are provided with SideNav https://mdbootstrap.com/docs/jquery/navigation/sidenav/

I'll reach out to our JQ team with SideNav swipe feature request.

Jakub Mandra staff commented 5 years ago

Maybe this solution will be interesting for you https://mdbootstrap.com/snippets/jquery/piotr-glejzer/120704

webmaster2 priority commented 5 years ago

No we really need a solution to swipe the sidenav left off the screen.

Jakub Mandra staff commented 5 years ago

OK, it is scheduled on our task board. Keep an eye on our changelog https://mdbootstrap.com/docs/jquery/changelog/

Add comment

Write

Create snippet

FREE CONSULTATION

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

Status

Opened

Specification of the issue

ForumUser: Priority
Premium support: Yes
Technology: MDB jQuery
MDB Version: 4.5.12
Device: Phone
Browser: chrome
OS: Android
Provided sample code: No
Provided link: Yes

webmaster2

5Support score
1Questions 0Answers 0Snippets