使用Javascript在鼠标悬停的列表项间移动

好了，伙计们，我试着复制这个效果： 基本上，我有一个ul，有10个绝对定位的列表项。由于最后一个列表项始终位于顶部，因此我知道我将在其上悬停，并希望将lis的其余部分向右或向左移动，这取决于它们是奇数还是偶数。我正试图实现这样的检测：

function reshuffleCards(e) {
  if (e.target.nodeName === 'LI') {
    if (e.target == e.target.parentNode.children[9]) {
      e.target.className = 'active';
    } else {
      var oddItems = document.querySelectorAll('ul li:nth-child(odd)');
      oddItems.style.webkitTransform = 'translateY(-100px)';  
    }
  }
}

我想这并不是解决这个问题的最优雅的方法，所以任何意见和建议都是受欢迎的

以下是指向我的笔的链接：

---

我会用css完成所有的转换，比如：

$('#perspective').on('mousemove', function(e) {
   var x = e.pageX,
       w = $(this).outerWidth(),
       lis = $(this).children('li'),
       child = Math.floor(x/w * lis.size()/2);

   lis.removeClass('active');
   $(this).children('li:nth(' + child + ')').addClass('active');
})

---

甚至更多-使用鼠标悬停键刷卡：

为什么要将

鼠标悬停键

侦听器附加到文档？为什么不列出项目？为什么要复制它？该项目在Github上是开源的……我想是为了实践