First name Jack.

This post is mostly a note-to-self.

Compare the following pieces of javascript:

var list = ['a','b','c'];
for(x in list) {
   alert(x);
}

var list = ['a','b','c'];
for(var x in list) {
   alert(x);
}

Either works in Firefox. Only the one on the right works in IE. Hint: the difference is in bold.

The IE behaviour encourages you to define your variables and not get lazy. Given that I develop under Firefox and don’t test under IE until late in the day, remembering this one will be a huge time-saver.

Much has been written about the inconsistencies of CSS within the various browsers. A great resource for learning about them is the QuirksMode website. Despite having read a lot of that site, I spent far too much time today trying to debug one.

Its worth mentioning upfront that this is with Firefox 1.5.0.7 on my laptop. Since writing up this post, I have found that Firefox 1.0.x on my desktop does not behave as described here. I’m not sure which is infact ‘correct’.

For a website I’m developing in work, I have a drag-and-drop interface that allows the user to arrange objects represented as <div> elements onscreen. If the user cancels the drag, the <div> is animated returning to its original position. For reasons that are not important, the <div> can return to one of two containing <div> elements. This all works well, apart from the fact that for one of the containers, an object that is returning to it consistently ends up 1 pixel out of position.

I initially assumed this was to do with the Box model issues, but the css for the two containers have identical border declarations. A bit of further digging and I found the only difference was the overflow style - and funnily enough, thats exactly where the problem lies.

To demonstrate, below are two identical <div> elements that contain a child <div> which has position: relative and is offset by 5px on both top: and left:. The sole difference between them is the first has overflow: hidden, and the second overflow: visible. Each of the inner <div>s are armed with the following piece of javascript:

onclick="
   var a=this.parentNode;
   this.innerHTML = 'dx:'+(this.offsetLeft-a.offsetLeft)+
                    ' dy:'+(this.offsetTop-a.offsetTop);
"

When you click on them, the offset between the child and its parent is shown. Remember that the css is identical for these examples in all but overflow.

As you can see, assuming you have clicked away and your are running the right level of the right browser, the offsets are different and its all thanks to the overflow. I have not fully investigated the various fixes for CSS issues such as Strict mode, but I was fortunately able to code a workaround using javascript that dynamically alters the overflow style depending on whether the user is dragging. I admit its not the cleanest solution.

I’ve been wanting a new camera for a while now. My old one, a PowerShot S45, has served me well over the past 4 years, but it had started to show its age.

Having played with Roo’s PowerShot S2 IS, I’ve had its successor, the S3 on my Amazon wishlist for a few months now.

With my Honeymoon fast approaching, I decided last week to go ahead and buy it - it didn’t hurt that Jo said it would be my wedding/birthday/christmas present from her!

It arrived today along with some rechargable batteries and a slightly paltry 16Mb SD card - there are 2x 512Mb SD cards in the post.

I’m not going to do a full review of the camera here - read the one linked to above if you are interested. The only feature I feel the need to really show-off is the Super Macro mode. This enables the camera to focus at 0mm - ie objects touching the lense.

By way of comparison, check out these two photos of a spider who has been living on my window for the past couple months.
The left-hand image was taken with Jo’s new IXUS 60, the right-hand image with my new toy. The crispness of S3’s image is astounding.

   

For some reason, macro photos of spiders seems to be the photo of choice recently.

Roo lived up to his role as Best Man last weekend by organising a Surfing trip to Woolacombe for my Stag weekend.

I have surfed a few times in the last couple years but it was good to have a day of properly organised tuition - thanks to Matt from Nick Thorn’s surf school for that. Thanks also to the guys at Extreme Board Shots for photographing the day in the water.

Whilst not everyone I had hoped could make the weekend, fun was definitely had by all.

The 6 Pieces

At a recent get-together with friends, I found myself playing with a wooden puzzle consisting of 6 pieces that were claimed to be able to come together to form a solid cube.

Lucy, the puzzle’s owner, said she had owned it for years and never successfully solved it. Not to be detered, I spent the whole evening failing to get anywhere with it.

Continuing not be detered, I decided to do the honorable geek thing and write a computer program to solve it.

Herewith how I approached the problem and got started with ruby. (more…)

Little Moo, the print robot of Moo.com has delivered. As previously blogged, I ordered my free sample of moo-cards 10 days ago and they arrived today.

The cards arrived in a nice compact holder with a tear-drop hole in the front. This provides a great way to slide cards out with your thumb. The holder itself was gum-attached to a cool Moo postcard that I’ll be sure to add to my postcard-wall at work.

The problem with ordering 10 cards is that you have to be very selective of the photos you pick. As I mentioned in the last post, the Moo website has a great interface for doing this. I ended up going for a random collection of my photos - but I did pick a couple out that favoured the long and thin shape of the cards.

The cards came with a luggage-tag-esque card for my order; a nice way to include the order number with the delivery. I wonder if I could quote the number to Moo and get the order repeated - assuming it wasn’t one of the free 10-card packs.

One piece of feedback I have for Moo is to be careful in their escaping of characters on the tag. Its amazing how often I find myself called Mr O\’Leary.