Topic: Navigation container not scrolling

magosine free asked 5 years ago


I've got the composition template of the Advanced Double Navigation with fixed SideNav & fixed Navbar. It scrolls on an IPhone with a touch screen. The side Navigation container scrolls vertically on a desktop using a mouse. But, a tablet or in tablet mode (Windows 10 computer or 2in1 laptop), it will not scroll using one's finger. At times I can almost get it to scroll, but the main page scrolls instead.
Is this a known issue? Is there a fix?

2in1 tablets are very popular, and I need this to work for my application.

-Thank you

Mark


Marta Wierzbicka staff answered 5 years ago


Hi,

now, I see this issue. Before, I haven't seen this, because I don't use a monitor with a touch screen. We will try to reproduce the problem and solve this as soon as possible but for now, we don't have a workaround. Thank you for your patience and help with recognizing an issue.

Best, Marta


Marta Wierzbicka staff answered 5 years ago


Hi,

please, post a short 10-15 second video demonstrating this and attach here a link to this video.

Best, Marta


magosine free commented 5 years ago

Vertical Scroll not working on Side NavBar. Demo Video: https://youtu.be/GVNcF59d1Z0

-Thank you


Marta Wierzbicka staff answered 5 years ago


Hi,

I'm sorry but I still don't know how can I help you. If you still need my help, please be more specific and provide a demo which shows the problem.

Best, Marta


magosine free commented 5 years ago

Marta,

I really do appreciate your assistance.
However, this is demonstrable on your website's vertical scroll bar on the SideNavBar.
Is their a way to post a short 10-15 second video demonstrating this?

Marta Wierzbicka staff answered 5 years ago


Hi,

I don't see the problem with our website on mobile devices like iPad. Please, look at this video shot: http://mdbootstrap.com/img/screens/forum/4.MP4. Could you specifically say how you want us to help you?

Best, Marta


magosine free commented 5 years ago

The issue is not on Apple devices. It works on those. The scroll bar on the NavBar container works on Apple devices like the iPhone and iPad. The scroll bar on the NavBar container DOES NOT work on Windows 10 OS for All in One (ASUS) nor on a 2 in 1 laptop (Lenovo Yoga) when using touch gestures. With the mouse it does. Simply use the Navbar on this website(mdbbootstrap.com) to observe this scrolling problem on an IBM/Windows device either in desktop or tablet mode.

Now, an example of a website that does work would be the Navbar on YouTube. The scroll works with touch gestures on any device. -Thank you


magosine free answered 5 years ago


No need to provide a project. You can use your own MDB website to observe this behavior. On an IPhone your side navigation menu will scroll using your finger; not an issue on that device. However, the side navigation menu on your MDB web site will not scroll using any touch gestures on other devices I have. Even if you try to touch the scroll area, it will not scroll. One device I have is a Lenovo Yoga 2in1 and the other is an ASUS all in one; both with touch screens. The mouse works fine. Now this I have observed on these two different machines both running Windows 10. It does this on Microsoft Edge, Microsoft Explorer 11, and Chrome browsers. Instead of the side menu content container scrolling, the whole page scrolls. ....Now on YouTube, their side navigation responds to these touch gestures on all devices. -Thank you


Marta Wierzbicka staff answered 5 years ago


Hi,

would you provide any link to your project to let me see what is wrong or reproduce the problem by creating a snippet here: https://mdbootstrap.com/snippets/?

Best,

Marta



Please insert min. 20 characters.

FREE CONSULTATION

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

Status

Answered

Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.6.1
  • Device: 2in1 Laptop
  • Browser: Edge & Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No