JQuery淡入效果

Question

所以基本上我有一个导航栏在左边。当用户点击一个选项时，它应该淡入与之相关的内容。当用户点击另一个选项时，它应该淡出当前内容并淡入下一个选项。我知道如何照顾逻辑，但由于某种原因，淡入淡出不起作用。这里是我的html

<div id="Hotel" class="Information" style="display:none;"> 
    <p>test</p> 
    <p>test</p> 
    <p>test</p> 
    <p>test</p> 
    <p>test</p> 
</div> 

这里是我的jQuery：

$(document).ready(function(e) { 
    $("ul.navigation > li").click(function(e) { 
     $sel = $(this).val(); 
     if($sel == 0) 
      $("#schedule").show(); 
     else if($sel == 1) { 
      $('#Hotel').show(); 
      $('#Hotel').fadeIn('slow'); 
     } 
    }); 
}); 

当我点击导航栏上的酒店链接，内容只是似乎没有任何衰落。我的代码有什么问题？

Answer 1

尝试这样

$(document).ready(function(e) { 
$("ul.navigation > li").click(function(e) { 
    $sel = $(this).val(); 
    if($sel == 0) 
     $("#schedule").show(); 
    else if($sel == 1) { 
     $('#Hotel').fadeIn('slow'); 
    } 
    }); 
}); 

从你的代码中删除Show（）函数和编辑这样

Answer 2

不要调用show（）。 http://api.jquery.com/fadeIn/