sidenav breakpoints

  1. MDB Home Page
  2. Support Main Page
  3. MDB jQuery
Topic: sidenav breakpoints

netanel pro asked 6 years ago

how do i change sidenav collapse breakpoint fron 1440px to 1280px

Piotr Glejzer staff answered 6 years ago

Hello, Changing the sn_breakpoint is working, I checked that, but you need to do this with gulp js compile/minify and change breakpoint in dist/sienav.js or if you are using not gulp package you have to change 1440 breakpoint in mdb.min.js. We don't have any option to change breakpoint for now. We will think more about that. Best, Piotr

natenoctel commented 4 years ago

Hi Piotr,

I have found myself on this thread as I am having the same problem. I see that this response was two years ago. Has there been an update on being able to set the breakpoint?

Grzegorz Bujański staff commented 4 years ago

Hi.

Yes, this option has been added. A list of available options can be found here: https://mdbootstrap.com/docs/jquery/navigation/sidenav1/#options

Piotr Glejzer staff answered 6 years ago

Hi,
If you want change breakpoint sindenav collapse you have to do something like that:
You need to go to your mdb.js file.
And you have to change variable:


var SN_BREAKPOINT = 1440;

to

var SN_BREAKPOINT = 1280;

It should be works. If not let me know I will try to help you again!
Best,
Piotr

cdenby pro answered 6 years ago

Is there any particular reason the default SideNav breakpoint isn't set to the xl threshold? If we want different items in the navbar based on whether or not the sidenav is visible, it's a bit of a problem unless we ignore the 1200-1440 range.  

cdenby pro commented 6 years ago

Also - changing the SN_BREAKPOINT (at least in 4.5.12) doesn't actually work. It certainly visibilizes the sideNav properly, but it doesn't take care of the rest of the page. The sidenav appears, but the remainder of the page (in a double nav setup) doesn't shift over.
Write
Create snippet
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
  • User: Pro
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
About author
netanel
Pro User
12Support score
3Questions 0Answers
0Snippets likes 0Snippets