Image Gallery

| 6 Comments | 0 TrackBacks
I've recently been writing an image gallery for my site. It's still in the prototype stage, but I thought I'd let you guys have a sneak peek. As far as I can tell, it works perfectly in FireFox and Opera, IE7 nearly gets it right and IE6 makes a total hash of it (these browsers were all tested in XP SP2). There's still quite a bit of work left for me to do before it becomes production code. I'm really against the idea of putting lots of "if IE, DoThis, else DoSomethingElse" type code in there, so I need to find generic solutions to the IE problems if possible. Comments and suggestions welcome, particularly from those using other browsers and operating systems. EDIT: Made both IE browsers work better without doing anything other than changing the CSS slightly (fixed it to work with IE's overflow: hidden + position: relative bug). IE7's only problem now is that it scrolls too far to the left which means style.offsetLeft is being interpreted differently to the other browsers. IE6 also does this and doesn't like the transparent background behind the arrows (displays as black). As IE6 doesn't support PNGs with alpha channels, I'll try to figure out how to make the background white instead.

No TrackBacks

TrackBack URL:


Suggestion: don't reinvent the wheel. Flickr and Picasa Web Albums already do everything you could possibly want, including features like tagging, comments, friends galleries and RSS feeds.

Except they don't do what I want, which is to learn how to do this kind of thing myself, hence reinventing it!

Interesting. Iain beat me to the point I was going to make. That is, if you're going to build this thing to USE then you should either use Flickr, Picasaweb or a million other services. You could also just install an image gallery plugin for Wordpress, which means it'd integrate nicely with your blog and you wouldn't have to worry about the code. But, you then said that you wanted to do it yourself to learn about it.

OK, if you want to learn how to write something like this that handles all the browsers you want, then you're going to have to hand-code some IE-specific stuff into your site. Everyone else has to because that's just the nature of the beast, hence you're going to have to as well.

To be honest, I think hand-coding this stuff is a bit of a waste of time. Most people these days don't write their own JS code from scratch, but generally us libraries that are available to help them do it. Sure, this means you're not doing it all yourself, but you're still writing the software. I liken it to using Direct3D instead of writing your own rasteriser. So, are you wanting to write the app or the rasteriser? :)

I recommend taking a look at (an extension/add-on for Prototype) and Yahoo! YUI, they're well worth a look and handle the browser nastiness for you. They're tried and proven, and will make your job substantially easier.

I don't know why my previous comment isn't showing up, but hey. You might also want to take a look at this.

Yeah, I've looked at a few JavaScript API's for this sort of thing and some of them look pretty nice, so if I was doing something more complex I'd probably evaluate a few and use one of those. For example, I wouldn't even try to attempt writing blog software from scratch without a framework first as it's way too complex.

As I say above, I just want to know how this stuff works for myself and the best way to know that is to do it from scratch using a real world example, just as I wrote a rasteriser my Archimedes from scratch in ASM back in the day...

Your first comment went into the moderation queue for some reason OJ. Not sure why, but I've approved it now.

I understand totally mate. One of the projects I'm working on is writing a 64-bit ASM compiler... in ASM.

I thought I'd let ya know about them anyway :)

Leave a comment

About this Entry

This page contains a single entry by KeefJudge published on February 27, 2007 5:09 PM.

Burning Ring of Fire was the previous entry in this blog.

Doughnuts: Cake or not? is the next entry in this blog.

Find recent content on the main index or look in the archives to find all content.