Hey guys, I just recently purchased this to help with website design (I'm terrible at front-end development and more back-end person myself). I'm looking to build a HTML page using BS4 that will allow me to use as my webpage for mobile apps. I plan on using this with a webview in iOS/Android so I only need to build a single site (mobile/ios/android) would all work from a single webpage (I know it's not idea, but it's a lot easier than developing 3 different sites)
My question is this. I'm looking to build a sidebar navigation system. I want it to be similar to most android apps that I've see where you have the hamburger menu in the top left. The main page on the right. I'd like to have it so when you click on the hamburger menu, you get a menu box of the links you want (This looks easy enough), but I want it to slide out from left to right and take up only part of the screen AND overlap the existing page. I don't want to see the current page 'move' to the right to make room for the menu.
Do any of you guys/gals know if there's anything built into this that can accomplish this or is this going to be some kind of custom coding I'm going to need to do?
What about the one called "Collapsible sidebar left or right"? It looks pretty similar to what you describe, though you'd have to sub in a hamburger for the button. There's a demo here.
I guess I could use that, but that's utilizing BS3 and I wanted to use some of the features of BS4. Guess I could tear it apart and build my own css/js files with the functions it utilizes. Really wanting a bs4 version of something like that.
I mean I could get something fairly close (top-down) or something like that, but the css/js modification to make it go from left-right is a bit over my head at this time. Not saying I couldn't figure it out, but it'd probably take me a week to figure it out myself
The demo looks pretty sweet, so if it were me, I'd set aside a bit of time to dig into it and see how easy it is to adapt to my needs. I'm thinking that it should transition pretty well into BS4, and since for me the functionality would be the tricky part, I'd do my best to make the component do the heavy lifting there, whereas editing the css would be no big deal. But that's just me.
Ok so the first step here is to do the following (from memory as on my phone )
1 - Create a new BS4 design
2 - Drag a nav bar in to your design and in the right hand options panel set the menu to show on left hand side (may need to move/remove brand logo)
3 - one hamburger has been set to left align you can go to this page that the BSS devs have set up on github to get a sexy looking side bar nav that will work how you want to - https://github.com/bootstrapstudio/bootstrap-better-nav/blob/master/README.md
4 - you may need to overwrite some css classes I. Your own css file to make it open from the left
You my friend are a hero. I have it running (from right to left, but it's a start. I'll work on CSS stuff to go from left to right soon! Thank you so much!
