Tigerstipe翻转难题

所以我有一个通过jQuery交替背景颜色的div列表。 这些还具有更改背景颜色的翻转。 问题是，翻转function只允许我在mouseout上将这个类动画回一个背景颜色，但就像我之前说的那样，我有一个交替的背景颜色。 我怎么能在jQuery中处理这个？ 我下面的代码是我尝试使用偶数和奇数的if，else语句，但我不知道正确的语法。

$(document).ready(function() { $('.whycapad_staff:even').css({"background-color":"#eaebeb"}); $('.whycapad_staff').hover(function() { $(this).stop().animate({"background-color":"#5facf8"}, 300); }, function(){ if ($(this = ':even')){ $(this).stop().animate({"background-color":"#eaebeb"}, 300) }; else { $(this).stop().animate({"background-color":"#FFFFFF"}, 300) } }) }) 

Answer 1

只需使用css：

 .whycapad_staff:nth-child(even) { background-color:#eaebeb; } .whycapad_staff:hover { background-color:#5facf8; } 

演示： http ： //jsfiddle.net/maniator/npWnm/

如果你只想使用jQuery，这是一个例子： http ： //jsfiddle.net/maniator/npWnm/5/

 $(function() { //jQuery fallback $('.whycapad_staff').hover(function() { $(this).data('b-color', $(this).css('background-color')); $(this).css('background-color', '#5facf8'); }, function() { $(this).css('background-color', $(this).data('b-color')); }); }); 

---

完全后备： http ： //jsfiddle.net/maniator/npWnm/9/

 $(function() { //jQuery fallback $('.whycapad_staff').each(function(index, item){ if(index%2 == 1){ $(this).css('background-color', '#eaebeb'); } }); $('.whycapad_staff').hover(function() { $(this).data('b-color', $(this).css('background-color')); $(this).css('background-color', '#5facf8'); }, function() { $(this).css('background-color', $(this).data('b-color')); }); });