I am stuck on some things on the portfolio page project.
I don’t understand the jquery function used to create the navbutton highlight, while scrolling to the about, contact and portfolio sections of my page. Please see the free code camp example portfolio page they give you to see what I’m talking about.
I might of done it wrong in setup but my page doesn’t scale for different devices. How can I make sure it remains the same for other devices?
For jquery, first put the bootstrap link in settings at the bottom. Bootstrap.js needs jquery to work. For navbar, I would just say keep trying. Look at bootstrap’s example and documentation to make it work. For the scaling, you have to use the bootstrap grid. Again, you have to look at Bootstrap’s documentation on their grid system and make sure that you are following their directions on how to set up the classes for each div.
Maybe that is where I’m confused. I thought I added it in the settings on the code pen. I didn’t think it had to be added to the code after adding it to the settings.
Also for the grid does that mean I have to add “.col-xs-* or md, lg” to all my divs to get it to work right? I am unclear about it. Also do I have to add media queries? If I do where do those go? In the CSS settings on code pen or the CSS code section on code pen? The documentation also talks about Less files. What is that? Where are those and how do I access them? I read the documentation and it just confuses me more.
For the Navbar problem. I look at this documentation: http://scrollmagic.io/docs/. but how would I add this plugin? I am not sure about all that. Or if am I just over doing it all and there’s a simpler better way?
Overall the documentation makes everything more confusing to me. I get it’s a usual practice but as I am just starting out I don’t know how to utilize and interpret the information properly.
The documentation can tell me 5x3 = 15 all day long but I feel like it doesn’t tell me why it equals that or how I can make it equal that. Now that’s not to say that it isn’t accomplishing this, I believe it’s my error all the way. I just don’t understand how to interpret the documentation and utilize it. Maybe I missed something or I am just not sharp enough to understand it.
… i dont use bootstrap yet but had read a bit on it … but dont think you should have row col and container in one class in one div … think it should be <div class container > <div class row><div class col></div></div></div> Nearly sure div col is to be used inside a div with a class of row …
If you are uncomfortable with documentation (documentation kills me) google creating a webpage with bootstrap and watch a video … I use videos all the time for learning and find i learn much better.
Now my advice for making web pages … first off if you are new to making web pages dont make the whole page and try and fix things at the end … this is way to difficult of a way to do things … yet so many people … not just you … do it this way
Start with one thing eg nav bar … get this to work eg by work i mean it should go from full screen to mobile size screen the way you want it too … so on full screen it will have all the buttons like home, portfolio contact and as you resize your page smaller it hits a point where it changes to a drop down menu type … generally this happens at the large mobile size screen width.
Creating a web page this way means you only have to focus on one thing and if you have a problem its easier to sort out than having a whole page done and then trying to fix everything … and usually mistakes further down are linked to earlier mistakes.
I always do my page this way … section by section … so when i add a section if there is a problem i know it worked fine before i added the section so problem has to be in section im working on.
Thanks for the insight and advice. I already forked my portfolio page and was going through it trying to dissect it and maybe fix any code mistakes. I will definitely redo my divs to break it up the correct way. Your advice is super helpful. I will defintiely utilize it in this new fork. Thanks again!
I agree with everything JohnL3 said. And also, don’t feel stupid if you’re stuck on something, everyone goes through a lot of frustrations while learning how to code. I’ve seen weeks stuck on one problem, and I eventually find a solution or move on to something else and go back and try again. If the docs don’t help look up other resources or take a course to get a better understanding of what you need to learn.
