添加效果以显示和隐藏单击功能

时间:2013-06-04 16:32:38

标签: jquery

我想在以下显示/隐藏功能中添加淡入/淡出效果我是否需要在.hide(...)内添加另一个功能?

或者我需要在.fadeIn(1000)之后添加.hide()吗?

我也不介意使用切换效果,但无论我尝试过什么,我都无法使其发挥作用。

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

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

2 个答案:

答案 0 :(得分:1)

.fadeIn和.fadeOut直接显示和隐藏但具有淡入淡出效果。所以只需使用.fadeIn和.fadeOut:

http://api.jquery.com/fadeIn/(通过将匹配的元素淡化为不透明来显示它们。) http://api.jquery.com/fadeOut/(通过将匹配的元素淡化为透明来隐藏它们。)

答案 1 :(得分:0)

尝试这种方式: -

   $('#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
      });
    });