Senior Project Update 3

Since I am in web design class I decided after learning some basic java to put a little more focus into jQuery so that I can use it in my websites.

 Having your code hosted from a server like google makes an overall much faster loading time for your jQuery contrary to you hosting it yourself.

This is what most jQuery code will start with. The .ready will wait until the page is done loading so that the code doesn't start prior.

Another thing jQuery can do in animate things. With this code above when the button is clicked the div's dimensions and positions are changed as well as its opacity.

This is someone else's code they use to create a smooth scrolling effect on websites. This is something that I can really learn from because have single page scrolling sites with smooth scrolling in my opinion the best way to have them. Using jQuery to do this is far easier than trying to do it with CSS and HTML alone.

Senior Project Update 2

 The most recent thing I have been learning is jQuery. This is essentially javascript but is formatted a bit different to simplify the coding to make it more compact and simple when scripting HTML.

1

You can either insert the code directly into the html document or you can have it link to a javascript page by using the <script> tags like the main.js file in my first image. In order to most effectively use jQuery you need to link it to a library (first line of code in image 1). This is very important in using jQuery because this holds all the pre-written functions that jQuery can use.

2

If your document was not linked to a library you would need to write out code like it is in image 2. Typing the entirety of document.getElementsByClassName every time you were referencing a class in your document would consume a large amount of time. With the library connecting the document.getElementsByClassName can be instead used with a $.

3

                                                                                                                                                                    There are many effects that jQuery can add that you cannot do as easily with only CSS. Things like .hide and .fadeIn (Image 4) are pretty self explanatory. The .hide will cause the element to be hidden and .fadeIn causes it to slowly fade in. This is all done do to the function that executes when the page is first loaded (function main). Another function in image 4 is the one that is paired with .on('click') so that the function activates when the element is clicked. .slideToggle eases what is appearing into view so that it is not instant. .toggleClass will toggle a CSS class on or off. .text changes the current text to new text.

4

Senior Project Update 1

The thing I decided I wanted to learn was Javascript. I do not know much about it and I am going to be majoring in computer science so this will also be a good start for me for next year. So far I have been following tutorials on codeacademy.com. It has taught me some ver basic java skills. I now know about things like variables, creating random numbers,

Setting a variable

Creating a random number

Function

strings, functions, arrays, and how I can implement them all together. I have also learned about doing things like asking a question and returning it as true or false to make complicated

This variable has multiple strings in it and it is setup like an array