Web Browsers

Scriptaculous + JS optimizations can cause problems


With everyone raving about YSlow I used it to prune a new project I was doing. Well, after the results worked just great with Safari and Firefox I was thoroughly confused why it wasn't working correctly in IE. The problem was that my Script.aculo.us routines weren't working, and more specifically I was getting really weird errors when the page was loading, before any of the routines executed. Some of the errors were very vague, e.g. "'Class' is undefined", and "Effect.toggle is undefined". Well after lots of kicking around I finally tried something - I removed the defer="defer" attributes off the JS calls and it magically started working! Go figure! So, at the end of the day the lesson is that if you are using Script.aculo.us you can't use defer="defer" on your Prototype.js call, otherwise visitors using IE will be greated with a whole bunch of error messages and nothing will work.

Details for iPhone web app development (UPDATED)


Some details have been made available by The University of Washington on how to develop web applications for iPhone - lots of basics in there, like keeping a good separation of HTML and CSS, but also some specifics on e.g. the screen width, some limitations in place, etc. Mandatory reading for anyone doing iPhone apps.

UPDATE: Apparently someone didn't like the info being posted publically, so someone posted a copy of the iPhone details elsewhere.

IE bug - background images, floating blocks


There's a bug in all versions of Internet Explorer, including the latest IE7, whereby if you have a floating block in a block inside another block which has a background image (possibly also background colors), text will disappear. I was hitting this at work where we had two columns created using floating blocks, inside two separate blocks that each had a background image, and just above the columns was a heading - the text within the columns showed up but the heading always disappeared after the images finished loading. While there are some detailed explanations of why this bug happens, nothing quite explained my scenario or had a fix for it. Well, after poking around with it for a while I came up with a nifty fix: I put the heading inside a DIV that was set to 100% and floating to the left, which worked wonderfully!


Subscribe to Web Browsers