Question

我正在使用Malsup的cycle（）JQuery插件，我试图让它显示图库中的图像，缩略图列表以及每个缩略图下的标题。我的代码如下：

<div id="slideshow">
    <ul>
    <li style="background-image:url(img/jack.jpg);"><a href="#"><img src="img/jack-title.png" alt="Visit Jack"/></a></li>
    <li style="background-image:url(img/jill.jpg);"><a href="#"><img src="img/jill-mysteries.png" alt="Visit Jill"/></a></li>
    <li style="background-image:url(img/jenn.jpg);"><a href="#"><img src="img/jenn-title.png" alt="Visit Jenn"/></a></li>
    </ul>
</div>

<div id="nav"></div>

<script type="text/javascript">
$("#slideshow ul").cycle({
    pager:'#nav',
    pagerAnchorBuilder: function(idx,slide){return '<a href=""><img src="tn_'+idx+'.jp" width="50" height="50"/><br/></a>';
    }
    });
</script>

这一切都很好，除了我似乎无法访问每个循环图像上的ALT属性。我想用它来制作标题（在pagerAnchorBuilder中的linebreak BR之后添加）。任何人都知道怎么做到这一点？

Answer 1

看到这个小提琴：http://jsfiddle.net/bwwcq/（当然没有图像）

有问题的一行是：

var alt = $('img', slide).attr('alt');

喜欢这个插件顺便说一句。

Answer 2

http://jquery.malsup.com/cycle/int2.html

回调每个幻灯片转换支持回调之前和之后。在回调方法的上下文中，此是正在转换的元素。

$(this).attr('alt')

未经测试，但应该完成工作。

Jquery Cycle：骑行画廊，缩略图和字幕？

2 个答案: