Question

我有一个项目列表，其中一个项目有class=selected，每n秒将class=selected更改为下一个项目。

如何激活jCarousel滚动并始终显示class=selected的项目？

Answer 1

在jcarousel上设置自动滚动不是很容易吗？

您可以在此处找到相关信息：http://sorgalla.com/projects/jcarousel/

property：“auto”
指定定期自动滚动内容的秒数。如果设置为0（默认值），则关闭自动滚动。

您无需额外编码即可将班级更改为“已选择”

Answer 2

您可以使用jcarousel scroll这样的方法：

var link = $("#linkIWantToScrollTo");

var scrollTo = link.parent().attr("jcarouselindex");
var animateScrolling = true;

// Using jcarousel instance from the element where you applied jcarousel, scroll it...
$("#menu").jcarousel('scroll', scrollTo - 1, animateScrolling, function(scrolled) {
        if (scrolled) {
            console.log('The carousel has been scrolled');
        } else {
            console.log('The carousel has not been scrolled');
        }
 });

注意：有必要使用scrollTo - 1，因为index is 0 based。否则你会得到不希望的结果！：）

link是这样的锚<a>：

<li class="jcarousel-item jcarousel-item-horizontal jcarousel-item-8 jcarousel-item-8-horizontal" style="float: left; list-style: none outside none;" jcarouselindex="14">
<a id="linkIWantToScrollTo" title="Educação de Pacientes e Familiares" href="#">
</li>

使用上面的代码jcarousel将滚动到位置14。这在我的一个项目中现在很有用。位置14不在视线范围内，应用滚动方法可以提供出色的用户体验，因为该项目即将出现。

jCarousel显示选择了类的项目

2 个答案: