从左到右滑动CSS背景

Question

我正在尝试从左侧悬停背景幻灯片，但是当不再悬停时，我不希望它再次向左移动，我希望它向右移动。我按照说明here编写了这个：

#wsite-menus .wsite-menu li a {
background-position: 0 0 !important;
background-size: 200% 100% !important;
background-image: linear-gradient(to right, #1e1e1e 50%, #00b050 50%) !important;
-webkit-transition: background-position 0.4s !important;
-moz-transition: background-position 0.4s !important;
transition: background-position 0.4s !important;
}

#wsite-menus .wsite-menu li a:hover {
background-position: -100% 0 !important;
}

我可以添加什么来使背景向另一个方向滑出？对不起，如果这是一个愚蠢的问题，每个人都知道答案，但我远非CSS专家。提前谢谢！

Answer 1

我会做一些JS，在链接的mouseleave事件上添加一个类。该类将包含一个新的过渡，将图像向右滑动，这将覆盖原始过渡。