So I didn’t have time to type this up Saturday when I really worked on the page. But I learned/worked a good bit on the page Saturday.
I finished up some finishing touches on the CSS. Of course I had to go back at times and debug/rework some things, but most of it was finished by this time.
This led me to get to work on JSON. I made sure I was getting proper responses first by printing to the console first. Then I had to figure out how to access the information in the JSON file. I used the argument to pass the response to the server connection, and this allowed me to play with my JSON. Now let me stop here and mention that I have been writing on paper how I would use the JSON information before all this. I wrote out what I thought would be the best process/logic to accomplish what I needed to. Sure enough, I banged away on each piece one by one. Loops, if/else statements, and more. It felt great considering that I haven’t really used JSON for anything I have ever done personally. But it was all making sense, and I was getting super pumped over it all.
I think my personality is a bit different than the typical developer (or from what I have noticed). When I notice developers get past something, they seem to be really relieved, get a tiny bit excited, then move on. Imagine a crazy person cheering for a football team (“Let’s go! Let’s go! Bring it!)… yea that is how I was after getting through most of the JSON and having things seemingly work out like I wanted to. It was an awesome feeling.
Then I moved on and added some CSS3 transitions to the menu to make it look nice. I had a linear gradient on the background, and it wouldn’t work. So I ended up just adding another color to the background, and that fixed it. Not sure exactly why, but I am going to guess that it has something to do with the property not working with gradients, but it noticed another color as a second option and used it instead to make the transition.
Then I had to make the page functional and presentable in IE8+… yea. Some tips here
the psuedo-element ::after does not work in IE8… just use the psuedo-class :after
nth-child(n) selectors do not work also. I used a work around of :first-child + li + li… how many ever time I needed to for it to match the menu item
move the class modifying the nth-child(n) selector to the last li
I am almost finished I think. I have to add some shadows in .jpg form to the sides and bottom of the page. I haven’t really decided how I want to do that yet, but I have some ideas about using position: relative and just moving pixels to where it needs to be. We shall see.
At the end of the day, I felt really good with what I had done. If anything, I learned so much it was really exciting. I decided to reward myself with some Destiny. Hopefully I will be finished by the beginning of next week.