来自图像标题属性的Jquery循环哈希URL

时间:2011-10-18 22:53:47

标签: jquery jquery-cycle

我正在使用JQuery Cycle和动态生成的寻呼机导航。我试图找出如何使用图像标题属性中的window.location.hash链接到特定幻灯片。我想到了如何使用这个例子(http://jquery.malsup.com/cycle/perma2.html#home)修改插件直到这一点,但它没有链接。它只会将您送回第一张幻灯片。

我引用了这个stackoverflow支持线程(http://stackoverflow.com/questions/4969752/display-anchor-instead-of-index-in-url-with-jquery-cycle),但他们使用的是现有的寻呼机导航,而不是动态生成的导航。我还是学习Jquery的新手,所以任何指导都值得赞赏!

这是Jquery脚本:

$(function() {
var h, 
    hash = window.location.hash, 
    hashes = {},
    index = 0;

$('#slide img').each(function(i) {
    h = $(this).find('img').attr('title');
    hashes[h] = i;
});

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

$('#slide').cycle({ 
    fx:     'fade', 
    startingSlide: index, // <-- don't forget this!
    speed:  'fast', 
    timeout: 0,
    activePagerClass: 'active',
    pager:  '.timeline', 
    pagerAnchorBuilder: function(idx, slide) { 
        // return selector string for existing anchor 
        return '.timeline li:eq(' + idx + ') a';
    },
    after: function(curr,next,opts) {
        h = $(this).find('img').attr('title');
        window.location.hash = h;
    }
});
});

1 个答案:

答案 0 :(得分:3)

$('#slide img').each(function(i) {
    h = $(this).find('img').attr('title');
    hashes[h] = i;
});

应该是

$('#slide img').each(function(i) {
    h = $(this).attr('title');
    hashes[h] = i;
});

你已经在img-DOM上了。无需再“找到”它。