Georg
Georg

Reputation: 498

How to deactivate Bootstrap's scrollspy for mobile viewports?

I'm using the Bootstrap affix side-navigation as used in the Bootstrap documentation. As you can see there, the scrollspy doesn't make any sense when the viewport is smaller than 768px and the page is switching to mobile view. Hence, I want to deactivate the scrollspy as soon as the page switches to mobile viewe. Keep in mind that the fix should only apply on the sidebar-navigation – not on navbars. Ideas, anyone?

Upvotes: 0

Views: 1245

Answers (1)

David Taiaroa
David Taiaroa

Reputation: 25475

The fix is easy enough. Use media queries and define position:static; for your sidebar-nav div for mobile views, eg

    @media (max-width: 767px){

   .sidenav.affix {         /* change sidenav selector to match your layout */   

    position: static;    /* removes the affix behaviour */
    width: auto;         /* customise as required */
    top: 0;               /* customise as required */
    }  
    }

Upvotes: 2

Related Questions