添加效果來顯示和隱藏點擊功能

Question

我想添加淡入/淡出效果到以下顯示/隱藏功能我是否需要在.hide(...)內添加另一個功能？

或者我需要在.hide()之後加.fadeIn(1000)？

我也不介意使用切換效果，但無論我嘗試過，我無法使它工作。

$('#editPROFILE').click(function() { 
     $("#B_Profile").hide(); 
     $('#E_Profile').show();   
    }); 

    $('#viewPROFILE').click(function() { 
     $("#E_Profile").hide(); 
     $('#V_Profile').show();   
    }); 

Answer 1

試試這個方法： -

$('#editPROFILE').click(function() { 
     $("#B_Profile").fadeOut(1000,function(){ 
     $('#E_Profile').fadeIn(1000); // fade in after B has faded out 
     }); 
    }); 

    $('#viewPROFILE').click(function() { 

     $("#E_Profile").fadeOut(1000,function(){ 
     $('#V_Profile').fadeIn(1000); // fade in after E has faded out 
     }); 
    }); 

Answer 2

.fadeIn和.fadeOut直接顯示和隱藏，但具有淡入淡出效果。因此，只要使用.fadeIn和.fadeOut：

http://api.jquery.com/fadeIn/（它們褪色不透明顯示匹配的元素。） http://api.jquery.com/fadeOut/（隱藏他們褪色透明匹配的元素。）