使用CSS3加載頁面加載時元素的不透明度

Question

使用CSS 3，當包含元素的頁面已加載時，是否可以將元素的不透明度從0增大爲1？可能延遲1到2秒...

Answer 1

CSS不知道加載事件。你應該看看這個combination of jQuery and CSS3。

或者，既然你是要加入一些JS反正，爲什麼不去animate the whole thing in JS？在我看來，這將爲您提供更好的跨瀏覽器解決方案。

Answer 2

作爲spliter回答

jQuery有用於管理的不透明度的溶液........

例如

$("#mydiv").css({ opacity: 0.5 }); 

上面的代碼可以被用來設置不透明度到50％......（這是jQuery的）

或者

您可以使用.fade （jQuery的）要（）屬性來啓用完整的詳細信息，在頁面加載事件不透明

訪問http://api.jquery.com/category/effects/ ... jQuery是非常容易學習

Answer 3

您可以使用此代碼：

$(function(){ 
        $('#spe').hover(function(){ 

         $(this).css("opacity","0.50"); 
         $(this).animate({top:"80px"},500); 
        },function(){ 
         $(this).css("opacity","0.3"); 
         $(this).animate({top:"126px"},500); 
        }); 
       }); 

或者您可以在動畫方法中使用不透明度。