When you need to toggle the odd or even class names to stripe your table rows, or any similar functionality, you can skip using a counter and checking if its divisible evenly and instead use the Ruby on Rails helper called cycle. It cycles through whatever values are in the supplied argument list each time its called, so it can also be used in other situations. Here is an example for marking your table rows with odd and even classes:

cycle('odd', 'even')

I recently found this nice and simple Firefox plugin called View Source Chart, created by Jennifer Madden. It is used via the right-click menu, and displays a nicely formatted, color coded, and indented view of the source of the web page. Elements are also individually boxed in various containers, like for paragraphs, making it easy to find your way around the source code. You can also collapse these containers with a simple mouse click.

Last week I completed the creation of an online yearbook for our son. We homeschool him and create a portfolio or yearbook each year sampling his work and the progress he’s made. This year I decided to create the yearbook online, saving paper and storage space, and allowing us to share his work with family and friends.

I created the site statically using a combination of CSS, Javascript, HTML, and Flash. You can view the site here. I thought I would share in this post, the libraries I used and what issues I had ensuring it worked cross-browser.

Technologies/Libraries Used

First, on most pages I have a photo that is rotated with a Polaroid type effect applied to it (see photo below). I could have done this in an image editor, but choose in this case (for a low-trafficked site) to use Javascript. I used the Instant.js javascript library to accomplish this effect. It’s very easy to use and I had very few problems with it (see below).

Second, to create the photo galleries used mainly in the Art and Field Trip sections (and in the World War II Day example below), I used the PostcardViewer from Airtight Interactive. Once again, I found this very easy to use. I already use Google Picassa to manage my photos, and PostcardViewer can be downloaded as a Picassa template.

Note: I highly recommend you try Picassa if you aren’t using it already.

Read More »

I don’t usually post much about laying out web pages, but this tip was one I just couldn’t pass on . I can’t wait until the next time I have to layout a web page to use this. The tip is to use a background image, which is a grid. You apply it as the background, and then use it to position all your elements. Take a look over at Smiley Cat, which provides a background image and an example.

After further thought and consideration, I retract my statement that HTML should never be sent back to an AJAX request. There was a reason I made that statement, however I can’t fill you in on it yet (hint: I have to wait for a future software release). But, even with that reason, I have no issue with using HTML in an AJAX response. I wrongly applied a wise and fully correct architectural principle, which I will elaborate on in a future post, to the AJAX situation.

Hopefully at some point in the future, I can go into more detail on why I first wrongly concluded that this should never be done. Until then, rest assured, I will use whatever format fits the circumstance (JSON, HTML, XML).