Updated Portfolio Project... not boring anymore

Updated Portfolio Project... not boring anymore
0

#1

I didn’t get enough sleep last night, so I was in no shape to focus on Javascript. Instead, I made several updates to my Portfolio Project. I finally got the ScrollSpy navigation to work and background images have been added.

I think it’s a nice upgrade from the original. Let me know what you think :grinning:


#2

NICE!

Now you have to fix that menu bar when in responsive mode.

Enjoy!


#3

The collapsable menu has been fixed. I had misspelled “collapse” when I added that class to the navigation.

Thanks for your feedback!


#4

awesome…teach me master!


#5

Just one question, I’m just a beginner, and I see your portfolio and can’t help but to be amazed, and I was wondering, how much time have you invested in doing this? and how long did it take you to get there?


#6

Wow, thanks! I haven’t done that much and I have a TON to learn.

I’ve been the “IT Manager” for a company that has been in start-up phase for the last 3 years. It has given me the opportunity to learn a little bit here and a little bit there. I’m here at FreeCodeCamp to try to put all the pieces together.

It probably took me 2 days to put together my portfolio project with another couple of days of updates and refinements. Before I did the wireframe design or began building anything, I spend 5 days studying Bootstrap. It was tough to stick with it because I really wanted to start building but I knew the results would be better if I understood the tools. Overall, I’m pleased with it.

Now I need to focus on JavaScript. Also need to learn the backend so I can make my forms work.


#7

The design and background images kick ass! I would suggest adding a shadow on the text, at least on the headers, so they stand out against the background to help readability. I also suggest adding links to your portfolio, even if they are just dummy links, so you get a sense of what will be clicked. (Will it be the image, the text, or the entire div itself?)


#8

Hi Dave,

Thanks for taking a look at my Portfolio Project and for taking the time to give me your thoughts. I took your advice…

Good call on adding a shadow to the headings. I added them to the Portfolio section headings.

I also added a subtle box-shadow to the Portfolio thumbnails when they are hovered over. If this were a “real” site, I would have the thumbnail images open in a modal.

Again, I appreciate your time and your thoughts!


#9

@mkmanges
Glad you took my advice.
Now here’s some more:

1- Add this to your JS script.

$(’.navbar-collapse a’).click(function(){
$(".navbar-collapse").collapse(‘hide’);*
});

a-Now collapse your site and click on the menus…

2- Now add this in between your code:

<span class="icon-bar"></span>
</button>
**<a class="navbar-brand" href="#home">Michael Manges</a>** <--Add this.
</div> <!-- end navbar-header  -->

3-Now play with your portfolio.
4- Enjoy!


#10

I see what you did there. I added the feature but went about it a bit differently. Used code that was similar to the smooth scroll code.

/* Fade in my name/brand when scrolling.  */

	$(window).scroll(function() {
		
		$("#myName").each( function(i) {
			
			if ($(window).scrollTop() > 50) {
				$('#myName').animate({'opacity': '1'}, 200);
			}	
		});	
	});  // end NAME/BRAND FADE IN

This was added to existing jQuery, the $(document).ready(function){ code was farther up the page.

Thanks for the idea… again!