【问题标题】: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>
      

      JS

      $('#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样式。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2010-11-25
        • 2014-10-26
        • 2011-07-23
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多