jQuery Cycle with anchors and thumbnails -
i'm using jquery cycle plugin build slideshow main image wrapped in anchor , has thumbnail navigation. have same code demo page of jquery cycle. once wrapped images in link thumbnails broke. have tried dropping "slide.src" $('#slideshow img).attr('src')
still comes undefined.
$('#slideshow').before('<ul id="slideshow-nav">').cycle({ fx: 'fade', speed: 'slow', timeout: 0, pager: '#slideshow-nav', pageranchorbuilder: function(idx, slide){ return '<li class="thumbnail"><a href="#"><img class="rounded" src="' + slide.src + '" width="137" height="129" /></a><span class="highlight"></span><span class="gloss"></span></li>'; } });
and html this.
<div id="slideshow"> <a href="#"><img src="images/gyro.jpg" alt="gyro"></a> <a href="#"><img src="images/gyro.jpg" alt="gyro"></a> <a href="#"><img src="images/gyro.jpg" alt="gyro"></a> <a href="#"><img src="images/gyro.jpg" alt="gyro"></a> </div>
you need supply valid html fragment $.before()
. @ moment have no closing </ul>
tag. cleanest way self-close tag:
$('#slideshow').before('<ul id="slideshow-nav" />').cycle({ ...
if you're using firebug or developer tools in webkit browser can see elements jquery finding writing console.log($("#slideshow-nav"));
or console.log($(slide));
in callback function.
Comments
Post a Comment