JQuery 淡入效果答案

【问题标题】：JQuery Fade In EffectJQuery 淡入效果
【发布时间】：2012-09-21 04:27:15
【问题描述】：

所以基本上我在左侧有一个导航栏。当用户单击一个选项时，它应该淡入与其关联的内容。当用户单击另一个选项时，它应该淡出当前内容并淡入下一个内容。我知道如何处理这方面的逻辑，但由于某种原因，淡入淡出不起作用。这是我的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');
        }
    });
});

当我点击导航栏上的酒店链接时，内容刚刚出现，没有任何褪色。我的代码有什么问题？

【问题讨论】：

顺便说一句，你不需要.show()，$('#Hotel').fadeIn('slow'); 就足够了。
gowtam 答案对你有用。

标签： jquery html fadein fadeout

【解决方案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() 函数并像这样编辑

【讨论】：

@Gautam3164 天哪……如此明显，但我完全错过了。谢谢

【解决方案2】：

不要调用 show()。 http://api.jquery.com/fadeIn/

【讨论】：