This was a little experiment to get a useful base of cross-browser code that does some interactive stuff in Javascript. It is simple but handles mouseover, button highlight, and just has a nice, basic feel. The only issue is in Opera the text is at top of the buttons, but didn't have any nerves left for that one. At first I tried using :hover and :focus which brought me to the conclusion that this really isn't standard between the browsers so used onmouseover and onmouseout to deal with it. Also worked out a number of quirks that various browsers had, e.g. I removed the ugly dotted focus line in Firefox on the buttons, they left it there in Firefox 3 as well I noticed, I replaced it with a gradient background for the focussed button. So this code looks decent in Firefox 2/3, Internet Explorer 7 (probably 6 too), Opera 9.5 (in fact only after I upgraded from 8 did it show the background on the buttons), and Safari. The bad boy of the group is Opera, but since opera gets embedded in quite a number of devices these days (e.g. Philips TVs), you don't want to leave it out completely. You can view this example online here. Of course next step when implementing this is to make it read from a database or XML file, I just wanted to get the browser-compatibility as accurate as possible first.

This code uses the setInterval method to call a showQuote() function every 7 seconds, check out the online example.

This code runs in Explorer, Firefox, Opera and Safari, simple code that enables you to attach Javascript functions to button clicks, etc.

If you have various translations of your website, a quick way to implement this is to have an .ini file with all the translations in it and read it out. This code shows you how to also use constants within the ini file.

This CSS script give you absolute pixel-exact control of where to place text in a left and right area of a wide div, e.g. a header or footer. I was not able to get it to align automatically, e.g. left/center/right, so you have to know your font size and your text and position things exactly, but at least you have control, checked in Firefox and Explorer.

You can do a lot more with filters, e.g. dynamically change them in ActionScript but here is the syntax for a basic shadow filter on a text.

Check out this example here. This shows you the basics of using styles in flex, I did all of this with the FlexBuilder in design mode, very easy to use, when you are in a CSS file just click on design. The alpha transparency is wonderfully easy and the background picture leaves behind all the problems you have with page backgrounds in HTML/CSS, namely, it constantly resizes it, etc.

This is another example of access filesystem this time with ActionScript. Did an expanding window in this example, but there are some scrolling issues on this window I need to work out, couldn't find a scrollable=false in the application element. To try this example, download adobe air and then you can install this application.

This shows you the basics of getting access to files and directories with AIR using FileSystemTree and FileSystemDataGrid. Would be interesting to see how these work in Linux and Mac. To try this example, download adobe air and then you can install this application.

Here's how to get started with windows in an AIR application.