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.
click me
click me
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.
