Wasnt sure if this is the right place to post, but here goes anyway.

You will need either IE5+, Opera 8, Firefox or a recent version of Mozilla to view this tutorial. Safari should work too, but I am guessing on that, so it would be good if someone can let me know if it is working ok on that browser. You will also need to be in 1024 * 768 mode or higher to view the tutorial. This baby runs on a couple of kb of code to start off with and that in itself may surprise you.

Over 8000 words in length and 37 pages long, this tutorial walks you through from the basics of ajax to building an ajax powered fading image gallery web application. That is part 1, part 2 of this tutorial will follow in a few weeks time and will expand upon part 1.

Hopefully what you may learn is some of the following:

Import different file types including images and media using XMLHttpRequest

How to speed up ajax powered applications

Learn to not open new window instances to keep resource usage minimal

How to dynamically load JavaScript on demand

How to call events from XML files

How to use namespaces to mix and match XML and XHTML

Keep standards and accessibility features intact

Build a Fading Image Gallery

Also provided are two interfaces, the one you are about to view and the fading image gallery, along with all examples used in the tutorial as downloadable file.

The tutorial is available for viewing from here:

View Ajax Tutorial


Very interesting tutorial. I far as it running on Safari, I tested it on 2.0
(no longer have 1.x as I am running Tiger) and it does not work at all. Just a blank page.

Which is odd as most of the Ajax apps that I have been looking, like Prototype (part of Ruby on Rails), and OpenLaszlo 3.0.2, render perfectly on Safari, as well as other browsers that use the Mozilla/5.0 (Macintosh; U; PPC Mac OS X; en) AppleWebKit/412 (KHTML, Gecko) rendering engine.

Interestingly the tutorial ran rather poorly on Firefox 1.06 for OS X. It even crashed Firefox twice around page 35.

Then I ran it on Camino, another Mozilla browser that is based on an upgraded Gecko rendering engine, and it ran great. Super fast and everything worked perfectly.

Anyway, nice work. I've been trying to get up to speed on my Javascript/DHTML stuff. I'm more familiar with server side scripting like PHP/Ruby & Python, but two of my websites have Flash slideshows that have crossfades. And even though are valid XHTML/CSS, I'd still like to figure out how I could replace them with equivalent Javascript based slideshows.

Markus Arike

thanks for the safari info! my guess is that it may be the importing of js that may be crashing it. I will see if i can find someone to test some stuff on that browser.

The image gallery itself should not crash it though if that is the case since i am not importing js


FF seems to run ok for me and a few others that i have asked to test it. Ill check my markup though on those last couple of pages just in case there is a html markup error thats causing some intermittent FF problems.

Once again thanks...

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.