http://www.photonstorm.com/archives/2759/the-reality-of-html5-game-development-and-making-money-from-it

http://www.melonjs.org/

http://www.andismith.com/blog/2011/11/25-dev-tool-secrets/

Looks like some new interesting things. Looks Firefox now supports touch events.

After a search I ran across a few fixes for this. Here’s a link to one

http://code.google.com/p/jquery-ui-for-ipad-and-iphone/

This seemed to work well, though it had the problem of also nixing touch scrolling in my project. Since all of the mouse events were now rewired Mobile Safari was not getting the events it needed to scroll with a swipe.

Looking under issues on the Google Project site I found a few people had asked about this. The author had posted a fix which seemed to work well.

For more information read more on their web page: LESS.org

Download the JQuery library from Jquery.com. They archive different versions and provide a compressed (or minified) version and an un-compressed version. You can download the latest compressed version from the JQuery home page and it will work with all of the examples. Move this file into the directory where you will be working.

You can obviously place the jquery js file anywhere, as long as you provide the correct path to the file in your HTML document.

JQuery is very easy to use. Follow these steps:

1. Import the JQuery js file with the script tag
2. Set up another script tag for your own javascript.

For example:

<script type="text/javascript" src='jquery-1.4.4.min.js'></script>
<script type="text/javascript">
   // your own JS here
</script>

At this point you can use JQuery in your scripts. Notice, your scripts come second.

Many times you will want to wait for your document to load before applying your own JS. This important, because executing JS before the elements it acts on are loaded will cause your scripts to fail. JQuery provides the ready() event to easily work around this.

To set up the ready event use the following:

<script type="text/javascript" src='jquery-1.4.4.min.js'></script>
<script type="text/javascript">
$(document).ready(function(){
   // Scripts here execute after the page has loaded.
});
</script>

Smokescreen seems to take an SWF and convert into an SVG file and ad some javascript, so the end results are compatible with iPhone and and iPad.

http://smokescreen.us/

Thanks to Karaminder for pointing me to this.

http://www.subprint.com/blog/demystifying-the-dom-ready-event-method/

The method provided by the Publish settings in Flash and Insert > Media > Flash in Dreamweaver work just fine, but they leave you with a huge Javascript mess in your HTML page. SWFObject provides a clean and organized system that works well and provides a few extra perks.

You can download SWFObject here: http://code.google.com/p/swfobject/

SWFObject is contained in a single small Javascript file. I have been using the latest version (at the time I wrote this it was 2.2) and it seems to work well.

You can write the code for yourself following the documentation on the site listed above. Or use the code generator here: http://www.bobbyvandersluis.com/swfobject/generator/index.html

I had some trouble getting Flash to display 100% width and height. But this was sorted after a short Google search. Turns out the following styles are required:

html, body {
 background-color: #616264;
 margin:0;
 height:100%;
 overflow: hidden;
}
#flashcontent {
 height:100%;
}

Note, without overflow:hidden you end up seeing the scroll bars and the page scrolls about 5px. This was very confusing, you would figure that 100% height would make everything the size of the browser rather than a little larger?