我在试图找出css过渡方面遇到了麻烦。我有一个图像，当用户将鼠标悬停在它上面时，标题从左侧飞入，但当它们悬停时，我希望标题在右侧退出。这可能吗？
这是我的代码：
ul.case-studies-list li div.content{
transform: translateX(-100px);
transform-origin: bottom left;
transition:all 0.2s ease-in-out 0s;
opacity:0;
}
ul.case-studies-list li:hover div.content{
transform-origin: bottom left;
transform: translateX(0px);
opacity: 1;
}