CSS轉換鼠標輸入動畫和鼠標動畫

我無法找出css轉換。我有一個圖像，當用戶懸停在它上面時，標題從左側飛入，但當他們懸停在外時，我希望標題退出右側。這可能嗎？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; 
}

來源

2015-04-06 user2402492

您需要將圖像飛出，然後立即放置在1幀的左側。 – Downgoat

該圖像位於html代碼（）中，而不是css。該div掩蓋鼠標從左邊的圖像。當他們退出時，我希望面具退出到右側。對不起，我猜我不明白你的意思？ – user2402492

這是非常簡單的。我已經爲你FIDDLE LINK。

jsfiddle.net/Anuj_Kumar/2gba05ug/

來源

2015-04-07 11:56:00

謝謝！但我試圖看看我是否可以只用CSS而不是JavaScript。 – user2402492

CSS轉換鼠標輸入動畫和鼠標動畫

回答

相關問題