| Home Page | Lab 1 | Lab 2 | Lab 3 | Lab 5 | Lab 6 | Lab 7 | Lab 8 | Lab 9 | Lab 10 | Lab 11 | Lab 13 |
|
Intro to HTML and CSSIn preparation for Lab 1, we learned about the general structure of HTML and CSS, including things like tags, elements, links, images, CSS rules, CSS selectors, CSS properties, etc. We then applied these things by creating our very first webpages. These oages were to have both images and text in them, along with basic styling. My webpage was about crew; it had pictures of rowers, and various equipment used by rowers, such as the erg, and it also had a general description of what rowing is like. Click on the link to the left called My First Web Page to see it. The link labeled My First Attempt At HTML goes to a page that is just some random things i tried to do while fooling around with the basics. |
|
Intro to JavascriptIn Lab 2, we applied the first few things we knew about Javascript. These were picking out elements in the document object by their ID, class or tag, with commands like "document.getElementById". In one of the two assignments, we had to change the src attribute of an img tag to change a picture on a page when a button is pressed. In the other we again had to use buttons, but instead to apply different styling to the page. |
|
A Multi-page WebsiteIn Lab 3, we had to create a website with multiple pages with the use of a select list to navigate between the different pages on the site. The original site that listed the different prizes in the math department was split up into different parts according to prize names, and then each part was given its own page. We then put an a element in each of the options of our select list. Each option then had an href pointing to one of the pages. This way, clicking an option in the list would send you to the respective page. |
|
Javascript GraphicsIn Lab 5, we learned to use Javascript to make artwork, using a canvas HTML element. We had four excercises to do. The first one was to draw some kind of picture that appears when the page is loaded. The second was to make a program that animated a red square on a black canvas that would move with arrow key presses and would leave a trail of a different color where it had been before. The third excercise was to make an animation on a black canvas that could start and stop when certain buttons were pressed. The fourth excercise was to make a drawing appear wherever the mouse was on a black canvas continuously. |
|
If and Form ElementsIn Lab 6, we revisited the idea of a multi-page website, but in a very different way. We again used the select list to navigate through the different prizes on the site, but this time, instead of having each option load a new page, we had each option show its respective div. We did this using Javascript and giving each option a value. With this, you can see all the different prizes individually, but on one page. In addition to this, we made a fake login form, and we made a simple program that mimicks flipping a coin. |
|
Loopy ArtIn Lab 7, we further applied our knowledge of Javascript and canvases and madea program that randomly generates three different types of abstract art every four seconds. We each created our own type of art by using for loops and Javascript commands to draw different shapes accross the canvas. |
|
Introduction to GimpIn Lab 8, we used a program called GIMP to draw pictures and edit digital photos. We had to make a logo, play with the color filters on a picture to make it a suitable background image, apply different effects to yet another picture, and then we were allowed to make two different pictures of our own, all using GIMP. Then we took these five things, and put them all on one webpage. |
|
HTML FormsIn Lab 9, we were introduced to the topic of Form elements in HTML. We used these by playing with a server that was created by the professor. We each had a username and password, and we had to create four forms to interact with the server. The first one was to login, the second was to post messages to other users, the third was to change your password, and the fourth was to set different profile information. The fifth link is the home page of the whole thing, and exists so one can navigate through all of the pages without gettting logged out. |
|
JQuery AnimationsIn Lab 10, we began to use JQuery. We used it to animate a coin flipping, to make text jump when you mouse over it, to use the slideUp and slideDown functions to show and hide divs on a page, and to make an accordion list. |
|
AJAX and JQueryIn Lab 11, we were introduced to AJAX and being able to load new information without loading an entire new page. We used JQuery to interact with the same server as we did in Lab 9. We could do similar things as in Lab 9, namely logging in and posting, along with viewing our profile information, but without having to load each individual page. |
|
A Bit of MySQL and PHPIn Lab 13, we got a taste of MySQL and PHP. We had to put in MySQL commands to a new server that was created for this lab and answer questions using the information we got. We then had to create a poll on the server, with a list of different possible answers. Once this was done we had to create a webpage that would take peoples' answers. Once this was done we all had to write php to send the answers to be recorded and then print the newly updated results of the poll to the user. |