MDBSideNav mobile transition

web
mobile

Topic: MDBSideNav mobile transition

Roman Mzh pro premium asked 3 months ago

Expected behavior

Actual behavior

Resources (screenshots, code snippets etc.)

a code from

https://mdbootstrap.com/docs/react/navigation/sidenav/enter image description here


Konrad Stępień staff answered 3 months ago

Hi @Roman Mzh,

Thank you for reporting the error. He will forward it to the appropriate department. As for the example, it will be repaired.

But if you use the code from here and want the element to be displayed from the very beginning, change its state from true to false. In this code, the item's status is called toggleStateA.

Examples in the above links are live preview with jQuery technology.


Roman Mzh pro premium commented 3 months ago

would be great to read English version of this answer :)


Konrad Stępień staff commented 3 months ago

Hi @Roman Mzh,

I'm sorry for that. Could you now look at my answer now? :)


Roman Mzh pro premium commented 3 months ago

thx, Konrad. My question was not about state, but about behavior on state change. Sorry for wrong description, the correct one is: transform: translateX(0px) property should be set for opened menu, but it doesn`t.


davidkjackson pro premium answered 3 months ago

This s the similar problem that I have reported with this REACT example https://mdbootstrap.com/previews/docs/latest/html/navigation/side-nav-fixed-navbar-fixed.html

If it is full screen and then the screen is reduced in size to cause the sidenav to slide off canvas, the hamburger button requires 2 clicks to bring the sidenav back out. I have reported this behaviour in this ticket . https://mdbootstrap.com/support/react/example-navigation-with-sidebar-requires-the-hamburger-icon-to-be-clicked-twice/

Also, when closing the sidenav menu by clicking in the gray overlay, handleToggleClick is not appearing to be called so the ToggleStateA is not out of sync with the actual sidenav state. I have not been able to determine where the overlay is being controlled..


Konrad Stępień staff commented 3 months ago

Hi @davidkjackson,

I see you report some problems with this template. It is very likely that the source code will change more or less.

Your Regards, Konrad.


Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: Yes
  • Technology: React
  • MDB Version: 4.18.0
  • Device: pc
  • Browser: chrome
  • OS: ubuntu 18.04
  • Provided sample code: No
  • Provided link: Yes