如何在 jquery 循环插件中删除寻呼机的数字答案

【问题标题】：How do i remove the numbers for the pager in the jquery cycle plugin如何在 jquery 循环插件中删除寻呼机的数字
【发布时间】：2011-08-23 17:20:34
【问题描述】：

我正在尝试从使用 jquery 循环插件时生成的寻呼机中删除数字。这些数字似乎只显示在 IE 中，但我仍然需要删除它们。我的代码是：

<div class="feature_span" style="background-color:#000000; background-image: url(images/banner-one.jpg); background-position:top center; background-repeat:repeat-x;" ></div>
<div class="feature_span" style="background-color:#000000; background-image: url(images/banner-two.jpg); background-position:top center; background-repeat:repeat-x;" ></div>
<div class="feature_span" style="background-color:#000000; background-image: url(images/banner-one.jpg); background-position:top center; background-repeat:repeat-x;" ></div>
<div class="feature_span" style="background-color:#000000; background-image: url(images/banner-two.jpg); background-position:top center; background-repeat:repeat-x;" ></div>

</div><!--End Homepage Slider-->

<div class="feature_nav"></div>

和

<script>
     // start slideshow 
    $('#homepage_slider').cycle({ 
        timeout:  7000, 
      //  before:   onBefore ,
        next:   '.feature_next',
        prev:   '.feature_prev',
        pager:  '.feature_nav'
    });
</script>

我确信有一种我缺少的简单方法。有人可以帮忙吗？

【问题讨论】：

你的问题很难理解。如果您期望得到适当的回应，澄清它会有所帮助。

标签： jquery css xhtml cycle

【解决方案1】：

此处提供了一些文档：http://jquery.malsup.com/cycle/pager2.html

$('#homepage_slider').cycle({ 
    timeout:  7000, 
  //  before:   onBefore ,
    next:   '.feature_next',
    prev:   '.feature_prev',
    pager:  '.feature_nav',
    pagerAnchorBuilder: function(idx, slide) { 
        return foo;  //Where foo is whatever contents you want in each pager anchor.
    } 
});

【讨论】：

【解决方案2】：

如果您不想要寻呼机，请从您的代码中删除它。 ~~pager: '.feature_nav'~~

【讨论】：

【解决方案3】：

这是我的代码，运行良好。

HTML

<div id="slider" class="pics">
        <img src="images/beach1.jpg" width="200" height="200" />
        <img src="images/beach2.jpg" width="200" height="200" />
        <img src="images/beach3.jpg" width="200" height="200" />
        <img src="images/beach4.jpg" width="200" height="200" />
        <img src="images/beach5.jpg" width="200" height="200" />
        <img src="images/beach6.jpg" width="200" height="200" />
        <img src="images/beach7.jpg" width="200" height="200" />
        <img src="images/beach8.jpg" width="200" height="200" />
    </div>
<ol class="pager"></ol>

$('#slider').cycle({
                 fx: 'fade', 
         pager:  '.pager',     
            // callback fn that creates a thumbnail to use as pager anchor 
            pagerAnchorBuilder: function(idx, slide) { 
                            return '<a href="#"></a>'; //what you want ti return like '<li></li>'
            }

    });

输出：可以看到

<ol class="pager">
  <a href="#" class=""></a>
  <a href="#" class="activeSlide"></a>
</ol>

作为pager的输出，可以为pager类添加css样式。

【讨论】：