javascript - JQuery Cycle 插件 - 主图像下方带有缩略图的寻呼机

Question

我正在开发 jQueryCycle 插件，以获取带有主图像下方缩略图的寻呼机。这是我工作的教程。 http://digitalunion.osu.edu/2011/10/18/jquery-cycle-plugin-a-little-tutorial/

下面是我正在处理的 jQuery 代码

$(document).ready(init);

function init() {
// dynamically add a div to hold the slideshow's pager
$(".bison_images").before('<div class="pager"></div>');

// now to use the cycle plugin
$(".bison_images").cycle({
    pause: 1,
    pager: ".pager",
    pagerAnchorBuilder: imagePager
}); 
 }

  function imagePager(index, slide) {
var slide = jQuery(slide);
var img = slide.children("img").get(0);
return '<a href="#"><img src="' + img.src + '" width="110" height="66" /></a>'; 
 }

在这里，我得到了与上面粘贴的示例链接中所示相同的输出。但我想要主图像下方的寻呼机。我用以下命令尝试过，但没有成功。

 $(".bison_images").after('<div class="pager"></div>');

任何人都可以建议我解决方案。

拉克什

Answer 1

enter code here

检查这个工作...

 $('.bison_images').after('<div class="pager">').cycle({
            fx:     'scrollHorz',
            speed:  'slow',
            timeout: 9000,
            pager:  '.pager',
            pagerAnchorBuilder: function(idx, slide) {
   var slide = jQuery(slide);
   var img = slide.children("img").get(0);
   return '<a href="#"><img src="' + img.src + '" width="110" height="66" /></a>';
}
        });