Site Files

site files

What I did:

To start this unit I went to w3schools to learn how to use JQuery. After that, I made a new random HTML page to start testing some things out and just play around with JQuery in general. Now that I had some experience using JQuery I decided I wanted to change how my side navbar opened and closed for mobile users to use JQuery I also wanted to make the toggle for challenge solutions to work with JQuery too. I also wanted to add a new feature for users that were not on a phone, the ability to click on an image, and be shown a blown-up version so that they could view the image larger. As far as adding a new useful feature goes though I was not able to come up with any ideas. This is due to the fact that I want the site design to not be all that flashy or have animations everywhere. So were the complexity of JQuery is concerned there was nothing all that complicated to add to the site.

What Went Well and Didn't Go Well:

Almost everything went over pretty smoothly, the only that wasn't all that convenient was that I refactored some of the HTML of the pages because I found a better way of doing things.

What I Would Do Differently:

Overall, I don't think there is anything that I would do differently aside from hopefully find some feature to add that is a little more complex to implement.

The Most Valuable Thing I Learned:

How to use JQuery was it. I am far from a master's in it but I learned how to use its a basic function and other operation as well as add plugins (even though I did not need any). I also learned how to make a plugin (but I did not make one).

Learning OutComes:

When you have completed this unit, you should be able to use JavaScript libraries (e.g. JQuery) to create dynamic pages.
- My ability to use JQery is shown in Site Files/Scipts/myJQuery.js. Where I use JQuery the change CSS and make use of an array of JQuery methods.

Indicative Grading Criteria Self Grade

B - As I did not write anything that was all too complicated.

Linking to Personas and Scenarios

• Side Navbar - This will be useful to all users that are using a phone as they will be able to open and close the side navigation bar without it being in the way of the actual content. All code inside nav on mobile region of myJQuery.js line 28
• Challenge Toggle - This allows the user to only view the solution to the challenge when they are ready to see it. But if they want to look quickly for a hint they can do that and then close it again. myJQuery.js starts at line 5
• Enlarge Image - This is helpful to anyone that wants to see the image larger or is having trouble seeing it at its regular size. myJQuery.js starts at line 11

Pros and Cons of JQuery

Pros

• Faster
• Write less code
• Aready tested

Cons

• Not the best way to learn JavaScript
• if you use the CDN the code could change and break your site