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

标签 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;
    }
});
});

最佳答案

$('#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 上。无需再次“找到”它。

关于来自图像标题属性的 Jquery 循环哈希 URL,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7814746/

相关文章:

php - echo Javascript 出现在警报中而不是处理中

javascript - 使用 AngularJS 更新表中值的最佳实践

jquery - 使用jQuery循环插件循环div

jquery - CSS DIV 滚动条最小宽度问题

javascript - jQuery 循环插件 "before"和 "after"回调在初始加载时触发

Jquery - 100% 宽度的幻灯片同时保持高度成比例

php - 使用 jQuery 或 PHP 进行文本比较

javascript - 输入文件类型隐藏

javascript - 在 jquery 对象集合上使用 underscore.js 列表函数

javascript - 在隐藏特定 DIV 和更新 url 之前预加载循环图像