jCarousel: прокрутить до первого элемента индекс имени класса

Question

Я использую плагин jCarousel.

Что я хочу сделать, когда я нажимаю элемент списка, используемый для навигации по карусели, перейдите к первому указателю этого имени класса. Если я нажимаю на Два в <ul id="bah">, он должен перейти к первому вхождение во имя класса уровня 2 в моем случае будет jcarouselindex = «4»

Я уверен, что это сделать это с помощью этой строки jQuery('#mycarousel').jcarousel('scroll', index + 1);, но я не знаю, как изменить index на первое появление имени класса.

Единственный длинный изгиб, который я могу придумать, это подсчет количества предметов в классе, поэтому в моем случае это было бы 2, а затем в навигации <ul> каждый элемент списка указывал id, поэтому первый <li> будет <li id="1">, второй будет <li id="4"> и т. Д., А затем используйте идентификатор для индекса.

Просто нужно некоторое на самый простой способ сделать эту

jQuery(document).ready(function() { 
    jQuery('#mycarousel').jcarousel({ 
     wrap: 'null', 
     scroll: 1, 
     visible: 4 
    }); 

    // Loop through all images and attach click action 
    jQuery("#bah li").each(function(index, element) 
    { 
     $(element).click(function() 
     { 
      jQuery('#mycarousel').jcarousel('scroll', index + 1); 
     }); 
    }); 
}); 

chghh

<ul id="bah"> 
    <li>One</li> 
    <li>Two</li> 
    <li>Three</li> 
    <li>Four</li> 
</ul> 

<ul id="mycarousel" class="jcarousel-list jcarousel-list-horizontal"> 
    <li jcarouselindex="1" class="jcarousel-item jcarousel-item-horizontal level-1"><img src="test/craft-link.png" alt="" width="194" height="74"></li> 
    <li jcarouselindex="2" class="jcarousel-item jcarousel-item-horizontal level-1"><img src="test/conservation-link.png" alt="" width="194" height="74"></li> 
    <li jcarouselindex="3" class="jcarousel-item jcarousel-item-horizontal level-1"><img src="test/contemporary-link.png" alt="" width="194" height="74"></li> 
    <li jcarouselindex="4" class="jcarousel-item jcarousel-item-horizontal level-2"><img src="test/craft-link.png" alt="" width="194" height="74"></li> 
    <li jcarouselindex="5" class="jcarousel-item jcarousel-item-horizontal level-2"><img src="test/conservation-link.png" alt="" width="194" height="74"></li> 
    <li jcarouselindex="6" class="jcarousel-item jcarousel-item-horizontal level-3"><img src="test/contemporary-link.png" alt="" width="194" height="74"></li> 
    <li jcarouselindex="7" class="jcarousel-item jcarousel-item-horizontal level-3"><img src="test/craft-link.png" alt="" width="194" height="74"></li> 
    <li jcarouselindex="8" class="jcarousel-item jcarousel-item-horizontal level-3"><img src="test/conservation-link.png" alt="" width="194" height="74"></li> 
    <li jcarouselindex="9" class="jcarousel-item jcarousel-item-horizontal level-4"><img src="test/contemporary-link.png" alt="" width="194" height="74"></li> 
    <li jcarouselindex="10" class="jcarousel-item jcarousel-item-horizontal level-5"><img src="test/craft-link.png" alt="" width="194" height="74"></li> 

</ul> 

Answer 1

Вы можете попробовать использовать: GT() селектор ->http://api.jquery.com/gt-selector/

или что-то в этом роде.

Отношения.