Summary; this is about preloading images to allow seamless browsing without pageloads.
A couple of years back I spent some time applying the tricasa preloading hack in the default theme. As you can see it was quite messy and a bit broken, but served me well for quite some time.
Nowadays we've got jQuery and HTML5, allowing us to accomplish some seriously robust preloading; keeping browser, URL and ajax-fields in sync.
Add this short snippet to your image.php to preload one image ahead:
`
<script type="text/javascript">
// <!-- <![CDATA[
/*Image preloading for ZenPhoto default theme. Just add to your image.php.
Ulf Benjaminsson 2011-07-30 */
jQuery(document).ready(function($) {
var $nextlink = $('.imgnext > a:first-child');
var nextURL = ($nextlink) ? $nextlink.attr('href') : '';
if(nextURL == ''){return;}
$.get(nextURL, function(data, textStatus) {
if(textStatus !== "success"){return;}
if(console){
var n = nextURL.length;
console.log('Preloaded: '+nextURL.substring(n, n-17));
}
$nextlink.click(function(e) {
e.preventDefault();
if(history && (typeof history.pushState == 'function')){
history.pushState({}, "", nextURL);
}
document.open();
document.write(data);
document.close();
})
});
});
// ]]> -->
</script>
`
Pastebin for sane formating: http://pastebin.com/LT9ieJXB
Live demo here.
As you can see I simply load the next page as soon as the current one is done (thus, not imposing any extra wait for the user). When the user clicks "Next Image" I cancel her request and use JavaScript to replace the current HTML with the preloaded page. Thanks to HTML 5 and pushState we're able to update the browser URL bar too!
Brilliant in it's simplicity.
I've only tested in Chrome and IE9. IE9 obviously doesn't support the HTML5-exclusive history.pushState, but I vastly prefer that over messing with hashbangs (fragment identifiers).