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

【问题标题】：JQuery Cycle plugin- pager with thumbnails below the main imagesJQuery Cycle 插件 - 主图像下方带有缩略图的寻呼机
【发布时间】：2013-03-21 23:19:16
【问题描述】：

我正在开发 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>');

谁能给我建议解决方案。

拉克什

【问题讨论】：

标签： javascript jquery html css jquery-cycle

【解决方案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>';
}
        });

【讨论】：