Demo of Highslide gallery with Ajax URLs

Update: a pure Javascript implementation by setnicka.

Highslide is an excellent JavaScript library for making galleries, but there’s one feature I was really missing in it: Ajax URLs or URLs which change as you browse images on the page. Thankfully developers provided extensive API with the help of which and also Hilde Tindlund’s sample code I was able to assemble this proof-of-concept.

You may as well want to try a dynamic URL such as this (the image is clickable):

Additionally this demo makes use of the jQuery plugin called hashchange, which allowed me to catch a “Back” button event. If a user clicks the browsers “Back” button while Highslide overlay is active, the browser does not return to a previously visited page, but closes Highslide overlay instead.

Ideally I’d want browsers back/forward buttons to perform more intuitively: for example, if you open #flower, then proceed to #mountain and then hit the browsers back button, some sort of a handler should re-open #flower instead of merely closing Highslide. I’ve already tried to implement such behavior, but it didn’t work smoothly, perhaps I just don’t have enough experience yet.

I’m a JavaScript newbie, so please use the code with caution. I think jQuery is unnecessary there, and I also think this feature should be available in Highslide out-of-the-box.

This entry was posted in Programming, Releases and tagged , . Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *