使用jQuery移动到unorder列表中的下一个元素

我有一个图像列表，我想要使用next/previous按钮循环浏览。但我在做这件事情时遇到了麻烦。到目前为止，我已经设法继续恢复到第一张图片，无论我点击下一个链接时的图像。使用jQuery移动到unorder列表中的下一个元素

对列表中的HTML是..

<div class="wrapper"> 

<div class="slider-container"> 
    <ul class="wineslider"> 
     <li> 
      <img src="assets/img/shop/redwine/bottle.png" alt="1"> 
      <div class="info"> 
       <p>I am wine information 1 </p> 
      </div> 
     </li> 
     <li> 
      <img src="assets/img/shop/redwine/bottle.png" alt="2"> 
      <div class="info"> 
       <p>I am wine information 2</p> 
      </div> 
     </li> 
     <li> 
      <img src="assets/img/shop/redwine/bottle.png" alt="3"> 
      <div class="info"> 
       <p>I am wine information 3</p> 
      </div> 
     </li> 
..... 

<a href="#" class="previous">Previous</a> 
    <a href="#" class="next">Next</a> 

</div> 

</div>

jQuery的我一直在摆弄周围是

这个幻灯片图像，如果他们点击 - 该位似乎工作没关系。

$(document).ready(function() { 
$('.wineslider li').bind({ 
    click: function() { 
     $('.wineslider li').stop().animate({'width':'60px'},600); 
     $(this).stop().animate({'width':'420px'},600); // Width of slideout box 
     $('.info').css('display','block'); 
    }, 
}); 

// Find number of slides 
var count = $('li').length; 
//alert(count); 

// Set current slide number 
var curr = 1; 
ert(curr); 



});

下一按钮

var active = 0; // starts at zero 
var list = $('ul.wineslider'); 
$("a.next").click(function(event){ 


event.preventDefault();   // cancel click through 
var currentElement = $('.wineslider li'); 
var i = $(currentElement).index(); 

currentElement = currentElement.next(); 
scrollTo(currentElement); 
$('.wineslider li').stop().animate({'width':'60px'},600); 
$(currentElement).stop().animate({'width':'420px'},600); // Width of slideout box 
$('.info').css('display','block'); 

});

由于事先：d

来源

2012-08-13 Simon

变种currentElement是选择一个里，但没有指定其利。做一些事情，比如为活动的li添加“selected”类。然后你可以做当前elem = $（'。selected'）

来源

2012-08-13 21:52:06

这里的问题是currentElement是一个jQuery对象，它包含所有li的集合。这不是当前选定的具体li。

在这种情况下，您可能需要为当前的li元素添加一个类或其他类，以便像这样获得更好的处理效果。

currentElement = $('.wineslider li.current'); 
nextElement = currentElement.next();

来源

2012-08-13 21:53:29

使用jQuery移动到unorder列表中的下一个元素

回答

相关问题