Class 5 - prototype.js and event observers

Things are getting a little more abstract with the introduction of prototypes. It is a case of learning by example and for this exercise, focusing on event observers, which seem to be very powerful.

I decided to finish what I started in class before trying the Ajax approach. After some trial and error, I got the product info boxes to overlay the product image boxes by finding the corresponding element id, adding classes to show and hide, and using setStyle to give the product info box an absolute position. Here is the latest version:

Class 4 - in class assignment - billing form

In this assignment we are using Javascript to code a checkbox behavior that will copy data entered in the billing address into the shipping address. If the box is unchecked, the shipping address should be cleared.

I was having problems lining up my input fields, but adding float left solved it. Using the "clear" class on my line breaks also made positioning the input fields a lot easier.

Class 3 - in class assignment

We are building personal web pages to be included in a larger web application. Mine is still under construction, but you can see it here.

Note: I need to code widths and heights in CSS for my images so the page will load faster.

quick post

This week I've looked at the html or xhtml source behind some of the websites I've visited (mostly news I'm afraid). I've seen lots of examples of div class and div id, as well as tables. There are some ugly tables out there, but I did see a nice looking example with a dotted border on an internal application at work.

By the end of class on Saturday, Larry and I were trying to figure out how to center our divs within divs. We learned that margin:0, auto doesn't work if you are floating left. You have to add margin:0, auto to the element that you want to center. For IE though, you have to add text-align: center on the containing element. Having said all of this, I'm going to see how Amos did it, but it's late and my dog still wants to play.

Good luck everyone!