使用CSS在幻燈片中淡出照片

我有一個網站，並在主頁上有圖片幻燈片。在刪除照片之前，我會在其後面寫下下一張照片，然後將其刪除。我想知道如何在刪除照片之前添加淡化效果。我的網站是：guyzyl.org，所以你可以看看我在說什麼。另外我不知道如何使用Jquery，所以請不要提供該解決方案。謝謝你的幫助。蓋伊Z.使用CSS在幻燈片中淡出照片

來源

2012-05-20 guyzyl

我想你不應該放棄jQuery的，但不嘗試它。看到這個網站上的例子，它很容易實現和支持跨瀏覽器（因爲德里克的不包括IE的短暫的冒險，對他們不感到羞恥）http://www.mkyong.com/jquery/jquery-fadein-fadeout -de-fadeto-example/ – peroija

.photo{ 
    -webkit-transition: opacity .5s ease-in-out; /*Webkit*/ 
    -moz-transition: opacity .5s ease-in-out; /*Firefox*/ 
    -o-transition: opacity .5s ease-in-out; /*Opera*/ 
    transition: opacity .5s ease-in-out; /*CSS3 Standard*/ 
    opacity: 1; 
} 
.photo.fade{ 
    opacity: 0; 
} 

document.querySelector(".photo").classList.add("fade");

見演示：http://jsfiddle.net/DerekL/jzLZZ/

來源

2012-05-20 19:52:41

但我希望它在刪除之前淡入淡出，而不是在寫入時，所以可以在使用javascript刪除它之前編輯照片樣式？ – guyzyl

@guyzyl - 查看演示是否符合您的預期。 –

你在IE中測試過嗎？似乎不工作的7,8或9 – peroija

使用CSS在幻燈片中淡出照片

回答

相關問題