修改jquery循环插件以使用图像标题而不是数字

时间:2012-12-14 00:46:13

标签: javascript jquery jquery-cycle

关注this excellent tutorial我非常接近,但他使用h2标记的内容而不是动态创建的内容。我想改用图像标题。我认为这样的事情会起作用,但事实并非如此。

$(document).ready(function () {
//Create an array of titles
var titles = $('#slideshow img.item').map(function() { 
    return $(this).prop('title'); 
});

    $('#pause').click(function() { $('#slideshow').cycle('pause'); return false });
    $('#play').click(function() { $('#slideshow').cycle('resume'); return false; });

    $('#slideshow').before('<ul id="nav-slide"></ul>').cycle({
        fx: 'fade', 
        speed: 'slow', 
        timeout: 6000, 
        pager: '#nav-slide',
        pagerAnchorBuilder: function (index) {  //Build the pager
            return '<li><a href="#">' + titles[index] + '</a></li>';
        },
        updateActivePagerLink: function(pager, currSlideIndex) {
            $(pager).find('li').removeClass('active').filter('li:eq('+currSlideIndex+')').addClass('active');
        }
    });

});

任何人都知道如何获取title的内容而不是块/内联元素?

1 个答案:

答案 0 :(得分:1)

title不是孩子,而是图片的属性

var titles = $('#slideshow img.item').map(function() { 
    return $(this).prop('title'); 
});

DEMO