Question

I’m trying to get jQuery Cycle to use unique names from each slide to be able to link to each slide directly. I found this on malsups site: http://jquery.malsup.com/cycle/perma2.html

Tried to incorporate it in my demo but to no avail, not sure what I’m doing wrong?
DEMO: http://jsbin.com/uviram/1

Even though I go to http://jsbin.com/uviram/1#slide2 it still leads me to http://jsbin.com/uviram/1#slide1..

$(function() {

    var h, 
        hash = window.location.hash, 
        hashes = {},
        index = 0;

    $('.slideshow slide').each(function(i) {
        h = $(this).data('hash');
        hashes[h] = i;
    });

    if (hash)
        index = hashes[hash.substring(1)] || index;

    $('.slideshow').cycle({
        fx: 'scrollHorz',
        timeout: 0,
        prev: $('.prev'),
        next: $('.next'),
        after: function(curr,next,opts) {
            h = $(this).data('hash');
            window.location.hash = h;
        }
    });
});

Answer 1

I’ve updated your jsbin demo so it works now. There were three problems:

• Firstly, I changed $('.slideshow slide') to $('.slideshow
.slide') to correctly select the slides.

• Secondly, I put the startingSlide option into the cycle call.

• Lastly, I put in a hashchange listener so that if the user changes
  the hash without reloading the page, it will cycle to the correct
  slide.

Take a look at your updated demo to see it working:

http://jsbin.com/uviram/6#slide4