How does this gallery change the URL, and seem to reload every time, when it is still a single slider?

Question

I'm working with a client who is looking to create a gallery like this one used by Dazed and Confused magazine - http://www.dazeddigital.com/fashion/gallery/23093/8/the-dazed-alternative-gift-guide

What I'm confused by is that you can see that the number in the URL changes in line with the number of the slide (and changes to /related/ at the end) - how is this done? I'm aware of adding "#1, #2, etc" at the end of the URL but this seems different - as if each slide has a unique URL that can be easily accessed.

I'm trying to see if it is possible in WordPress but I'm keen to try and understand how it works already "in the wild."

Answer 1

That's a very typical jQuery slider. The best thing to learn how it works is to view the page source and use the developer tools in Firefox (or Firebug ) or Chrome or Safari or IE to see how the Javascript works.

Dump the page source into an .html file on your desktop and play around with the code.

There's maybe a hundred slider plugins for WordPress: https://www.google.com/search?q=wordpress+slider+plugin

Answer 2

Not 100% sure this is what is happening but I would think so, all of those different urls redirect to the same page. And that page is checking on load the url and if it matches any of the data attributes on the gallery it displays the gallery starting on that slide. It is also using more data attributes to change the contents of the aside