I've been working on multiple computers for some time now, and there's one problem that keeps cropping up now and then, and sometimes when going from development to production, or when a folder changes name... Whatever.

The problem I'm talking about is relative/absolute paths in non-server-side processed files. For example, creating an AJAX loading image from a JavaScript file. What path should you use? /images/file.gif will point to the root, and file.gif will look in the current directory. The script doesn't always know the path relative to the current document, and it won't (easily) know what directory the images are in from the docroot. So what to do in this case?

What I've thought about doing today is creating the image in the server-side code, styling it to be invisible with CSS, and then using JavaScript to show/hide the image when I need it. Some basic jQuery-style psuedo-code follows.

var loader = $('img#loader_image').clone();
$('div#visible_loader').append(loader);

Does anyone have a better method for this type of thing? If so, get me on Twitter, at least until I enable comments on my blog.