Archive for April, 2007

Preloading multiple images in javascript

I needed to preload a set of images for a nav. menu using javascript. I googled “javascript preload” and found a few sites with examples. I followed the examples and adapted the code to my problem… it didn’t work.

You’ll find many sites that have examples for how to preload a set of images in javascript, such as this one, this one, this one, etc… They all basically have the same code, which as far as I can tell doesn’t work because they all have the same simple mistake.

Here’s my code after following the examples from these sites:

function preloadMenuImages()
{
pl =
new Image();
imgurl =
new Array();
imgurl[0] =
"images/nav_products_highlight.jpg";
imgurl[1] =
"images/nav_services_highlight.jpg";
imgurl[2] =
"images/nav_location_highlight.jpg";
imgurl[3] =
"images/nav_about_highlight.jpg";
imgurl[4] =
"images/nav_contact_highlight.jpg";

var i=0;
for(i=0; i<5; i++)
{
pl.src = imgurl[i];
}
}

I tested with IE7 and after the browser executes this code, the only image preloaded is the one referred to by imgurl[4], the last element in the array. I loaded the page with IE6 and Firefox 2, and it was obvious that the preload function didn’t work in these browsers either.

It seems that simply assigning to the src member doesn’t load the image. You actually have to create an Image object then assign to the src member. So the correct code is:

function preloadMenuImages()
{
imgurl =
new Array();
imgurl[0] =
"images/nav_products_highlight.jpg";
imgurl[1] =
"images/nav_services_highlight.jpg";
imgurl[2] =
"images/nav_location_highlight.jpg";
imgurl[3] =
"images/nav_about_highlight.jpg";
imgurl[4] =
"images/nav_contact_highlight.jpg";

var i=0;
for(i=0; i<5; i++)
{
pl =
new Image();
pl.src = imgurl[i];
}
}

Simple enough.

Of course it’s simple after you find the bug. I spent about an hour trying to figure out why my original code wasn’t working; never thinking that there could be a mistake in the code I found online.

My adventures in web design

I’ve tended to avoid web design and web development work like the plague. I’ve done web stuff on and off since the early days of geocities; remember, back when everyone had a web page or fansite of some sort? There was even a web design class at my high school where students made sites and put them up on geocities. Then of course the geocities fad went away and, fast forward a few years, we now have myspace filling the void.

Anyways, there is a sense of satisfaction from building a website, but in the early days I never had much of an interest in it and if I needed something done, I’d just hack it out in Frontpage. In more recent times I’ve been put off by the annoyances encountered when supporting multiple browsers. Learning a language or a technique was one thing, but all too often web design work felt like learning hacks to get things to work in a certain browser (typically IE6). And of course, I still didn’t really have much interest in it because of all the game development stuff which always seemed much cooler.

However, there’s no denying that outside of a few specific fields (e.g. video games) in the computer programming world, most programming jobs now require some form of web development work and, more often than not, the projects being worked on are web-based services. So being the pragmatic person I am, I decided to invest some time in learning some web stuff over the past two months. I’ve spend a ton of time learning XHTML (well, ok, learning XHTML takes like 5 minutes) and CSS (via. web, book, and class at NYU), which is very interesting and so cool now that I realize that you can do more with it than just do the hover effect on hyperlinks. I’ve also spent some time on PHP, which is fairly simple to pick up for anyone that has some computer programming experience and while not the prettiest language, it is very useful and seems to do a great job of addressing web-specific issues. I’ve also spent some time on ASP.NET (which seemed natural for me, as I’m familiar with C# and the .NET Framework), but haven’t really done anything practical as yet. I’ll also be putting in some time with Javascript soon. Almost all my time for the rest of this month will be web development work, as I have 3 paid projects and 1 personal project (I’ll talk about this next month) that needs to be completed in early May.

So am I in love with web development now and given up on game development? No way! Game development is still #1 (the Zerospace solution is open and sitting patiently in my task bar), but web design and development is very interesting. I love the workout I’m getting in Photoshop (somehow or other, I think I’m becoming a competent graphic designer). I love styling in CSS and not having to fight with tables (bad Frontpage memories) is wonderful. And some of the stuff that can be done in Javascript seem to rival Flash (check this out). I’ll probably try to learn Flash and a bit of Actionscript next month, but I’m not too sure about that as yet. My one negative comment about doing web design is that browser inconsistencies still exist (from what I can tell, primarily with CSS support). IE7 seems fairly good when it comes to CSS standards compliance, but IE6 isn’t dead and probably won’t die anytime soon.

I was going to rant a bit about the rise of web applications and the decline of desktop application, but I’ll save that for another day.

RTF to HTML converter 1.01

Stupid me, I didn’t anchor the label at the bottom-right correctly causing the label to overlap the text areas when the app window was resized. New version is up.

Rtf2Html Version 1.01
(Requires .NET Framework 2.0)