问题: Jquery Cycle - Image + Description rotator /w自定义缩略图

Question

我正在尝试建立一个自定义图像+描述旋转器/w自定义缩略图使用Jquery循环。

有点像这个例子：http://www.malsup.com/jquery/cycle/pager2.html，但使用的是DIV (而不是图像)和来自另一个目录的自定义缩略图。

据我所知，这是我如何使用DIVS构建上面的示例：

$('#slideshow').before('<ul id="nav">').cycle({ 
    fx:     'turnDown', 
    speed:  'fast', 
    timeout: 0, 
    pager:  '#nav', 

    // callback fn that creates a thumbnail to use as pager anchor 

pagerAnchorBuilder: function(idx, slide) {
                        var src = $('img',slide).attr('src');
                        return '<li><a href="#"><img src="' + src + '" width="100" height="50" /></a></li>';
                }
});

我如何解析/修改'src‘，或者只是拉出文件名而不是目录？

这不起作用，但这是我想要做的……

pagerAnchorBuilder: function(idx, slide) {
                        var src = $('img',slide).attr('src');
var thumbdir = 'static/images/thumbs/';
                        return '<li><a href="#"><img src="' thumbdir + src + '" width="100" height="50" /></a></li>';
                }

基本上..。如果$slideshow中大图像的图像源目录是static/ images /full/，我如何使用pagerAnchorBuilder从static/images/thumbs/ (文件名将是相同的)中拉出缩略图？

Answer 1

看看我的代码..。here链接立即生效