1

我将 Primefaces 3.2 与 Tomcat 7.0.23 和 JSF 2.0 一起使用,我正在使用该组件。

 <p:carousel id="aCarousel" value="#{BBCarousel.carouselItems}" var="carouselItem"  
              autoPlayInterval="3000"
              rows="4" vertical="true" circular="true" pageLinks="0" headerText="Informations"  >      

    <div class="thumbnail">
      <img src="images/minilogo.png" />
    </div>
    <div class="info">
      <a href="#">#{carouselItem.item_title}</a>
      <span class="cat">Category: #{carouselItem.item_cat}</span>
    </div>
  </p:carousel> 

当轮播到达最后一个轮播项目时,轮播滑动到(向上移动)第一个元素。相反,我希望最后一个项目以“循环方式”连接到第一个项目,没有中断。 .所以我得到了一个连续的滚动效果..我希望我已经清楚了..谢谢!

4

1 回答 1

2

看着 Firebug,我看到轮播主要是一个 div 和一个具有坐标值的隐藏输入。

<div id="slideShow" class="ui-carousel ui-widget ui-widget-content ui-corner-all" style="width: 404px;">
<div class="ui-carousel-header ui-widget-header ui-corner-all">
<div class="ui-carousel-viewport" style="width: 404px; height: 253px;">
<ul style="left: -808px;">
<li class="ui-carousel-item ui-widget-content ui-corner-all photo">
<img id="slideShow:j_idt15" alt="" src="/showcase/images/nature1.jpg;jsessionid=A181FD9A4E1990E40E09B3743EB2EE61">
</li>
<li class="ui-carousel-item ui-widget-content ui-corner-all photo">
<li class="ui-carousel-item ui-widget-content ui-corner-all photo">
<li class="ui-carousel-item ui-widget-content ui-corner-all photo">
</ul>
</div>
<input id="slideShow_first" type="hidden" value="2" name="slideShow_first">
</div>

这些值在 autoPlayInterval 处发生变化,看起来就像调用 jQuery 脚本来移动图像并在执行此操作时执行效果。

我在 Primefaces 文档中没有看到任何暗示可以更改不需要的自动播放效果的内容。如果不修改 Primefaces 代码,我认为这是不可能的。

于 2012-05-03T13:47:04.080 回答