javascript - 在 JCarousel 中获取当前项目的索引-6ren

javascript - 在 JCarousel 中获取当前项目的索引

转载作者：可可西里更新时间：2023-11-01 01:59:29

25

4

我正在尝试获取 JCarousel 中当前项目的索引这样我就可以向用户显示轮播中的当前位置。例如，“13/20”。

我该怎么做？

编辑:

成品 sample :

Carousel Screenshot

最佳答案

我认为你正在寻找的是 carousel.first，它会给你第一个可见元素的索引(还有 carousel.last 来显示最后一个可见元素)。

这是一个使用示例，它基于添加了 carousel.first 变量和 itemLoadCallback 事件的简单轮播示例:

<script type="text/javascript">
$(document).ready(function() {
    $('#mycarousel').jcarousel({
        itemLoadCallback: trigger
    });
});

function trigger(carousel, state)
{
    $("#currentImg").html(carousel.first);  
}

</script>

</head>
<body>
<div id="wrap">
  <h1>jCarousel</h1>
  <h2>Riding carousels with jQuery</h2>

  <h3>Simple carousel</h3>
  <p>
    This is the most simple usage of the carousel with no configuration options.
  </p>

  <ul id="mycarousel" class="jcarousel-skin-tango">
    <li><img src="http://static.flickr.com/66/199481236_dc98b5abb3_s.jpg" width="75" height="75" alt="" /></li>
    <li><img src="http://static.flickr.com/75/199481072_b4a0d09597_s.jpg" width="75" height="75" alt="" /></li>
    <li><img src="http://static.flickr.com/57/199481087_33ae73a8de_s.jpg" width="75" height="75" alt="" /></li>
    <li><img src="http://static.flickr.com/77/199481108_4359e6b971_s.jpg" width="75" height="75" alt="" /></li>
    <li><img src="http://static.flickr.com/58/199481143_3c148d9dd3_s.jpg" width="75" height="75" alt="" /></li>
    <li><img src="http://static.flickr.com/72/199481203_ad4cdcf109_s.jpg" width="75" height="75" alt="" /></li>
    <li><img src="http://static.flickr.com/58/199481218_264ce20da0_s.jpg" width="75" height="75" alt="" /></li>
    <li><img src="http://static.flickr.com/69/199481255_fdfe885f87_s.jpg" width="75" height="75" alt="" /></li>
    <li><img src="http://static.flickr.com/60/199480111_87d4cb3e38_s.jpg" width="75" height="75" alt="" /></li>
    <li><img src="http://static.flickr.com/70/229228324_08223b70fa_s.jpg" width="75" height="75" alt="" /></li>
  </ul>

  Current Photo <span id="currentImg">1</span>

</div>
</body>

关于javascript - 在 JCarousel 中获取当前项目的索引，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/1329054/

25

4

0

文章推荐： ios - iOS 中的 Fragments 和 ViewPager

文章推荐： java - 并行流 Java 8 的 CPU 核心数

首页

博学

6Ren·AI

商城

javascript - 在 JCarousel 中获取当前项目的索引