javascript - 通过键盘无法工作的滑块动画(javascript和CSS)

javascript - 通过键盘无法工作的滑块动画(javascript和CSS),第1张

我在JS(带角度) CSS中创建一个滑块,用户应该通过键盘控制(左右箭头)。我把它简单化了,你可以在下面看到。

我的代码以这种方式工作:当用户单击右键时,它会在数组的开头添加一个对象并删除最后一个。当我点击左边时,它就是相反的。

slideEffect = function(dir) {
    if (dir == 'left') {
        lastChamp = champs[champs.length-1];
        champs.unshift(lastChamp);
        champs.pop();

    } else {
        firstChamp = champs[0];
        champs.push(firstChamp);
        champs.shift();

    }
}
事情是这样的。当用户按下“向左箭头”但当用户按下右键时出现错误,如下所示:http://brunoornelas.com.br/test/pfc/

有没有人知道如何以最简单的方式解决它并使用Javascript? (我不能使用jquery)。

谢谢!

最佳答案:

1 个答案:

答案 0 :(得分:1)

你的动画正在发挥作用,只是push从头到尾混淆效果。理想的方法是在推动元件之前等待过渡结束。由于我们无法真正访问您的实际代码,因此提供正确的解决方案有点困难,理想的解决方案是添加transitionend侦听器和push。但很快,您可以在幻灯片功能中尝试这一点,您将看到需要做的事情:

firstChamp = champs[0];
champs.shift();
setTimeout(function(){champs.push(firstChamp)},100);
本文经用户投稿或网站收集转载,如有侵权请联系本站。

发表评论

0条回复