Download Galleria and upload it to your server.

Call jQuery and then Galleria into your theme’s header.php (order matters, and if you already have a plugin calling jQuery you may need to do some tweaking, check your firebug console if things break):

<script src="/galleria/jquery-1.4.2.js" type="text/javascript"></script>
<script src="/galleria/galleria.js" type="text/javascript"></script>
<script src="/galleria/galleria.history.js" type="text/javascript"></script>


When putting a gallery into your post or page, flip to the HTML editor and change the shortcode to:

[gallery link="file" itemtag="div" icontag="span" captiontag="p"]

For more on the WordPress Gallery, see the codex.

Now in the footer, just before </body>:

<script type="text/javascript">
if (Galleria.IE6 != true) {
// If they're running ie6, don't even both. Otherwise, load theme
Galleria.loadTheme('/megan/galleria/galleria.classic.js');
$('.gallery').galleria({ //These options are personal preference, see Galleria documentation
image_crop: 'height',
transition: 'fade',
thumb_crop: false,
transition_speed: 500,
data_config: function(img) {
// will extract and return image captions from the wordpress gallery source:
return  {
title: $(img).parent().next('strong').html(),
description: $(img).parent().parent().next('p').html()
};
}
});
}

</script>


You can see the 1.2 Demo or download the zip.

Live Demo or download

The end result came from combining two ideas, a smooth scrolling div and a script that injects the large container with information from the thumbnail that you click. The script I used for the basic gallery is “Javascript image gallery using mootools” by Devin R, available here

The other part is the scrolling based on mouse movement. I modified a script from Antonio Lupetti, “Using CSS and Mootools to simulate Flash horizontal navigation effect,” the original is here.

The challenges here involved integrating the structures of HTML, CSS and JavaScript that the two methods used, and making the site accessible for users with no JavaScript and for those on cellphone browsers.  Tested working in FF 2/3, IE 6/7, BlackBerry Mobile, Opera Mini.

I’ve made a simple demo for you to take a look at or download.

Let me know if you have any questions and I’ll do my best to answer them.