Javascript 淡出内容区域，但始终保留导航栏/页眉和页脚_Javascript_Jquery_Html_Css_Fade

Javascript 淡出内容区域，但始终保留导航栏/页眉和页脚

javascript jquery html css

Javascript 淡出内容区域，但始终保留导航栏/页眉和页脚,javascript,jquery,html,css,fade,Javascript,Jquery,Html,Css,Fade,我的网页有问题，我刚刚开始学习CSS和HTML，所以如果可能的话，我需要解释我的网页有一个标题，很像Stackoverflow的标题。我将其固定在顶部，并将其用作导航条，以便在页面中进行更改。我想淡出页面上的内容，但导航栏保持原样。我也想对页脚做同样的处理。我不知道如何才能排除这些因素的影响。我有它的工作，但它会褪色整个页面请帮忙 <script type="text/javascript" src="js/jquery.js"></script> <scrip

我的网页有问题，我刚刚开始学习CSS和HTML，所以如果可能的话，我需要解释我的网页有一个标题，很像Stackoverflow的标题。我将其固定在顶部，并将其用作导航条，以便在页面中进行更改。我想淡出页面上的内容，但导航栏保持原样。我也想对页脚做同样的处理。我不知道如何才能排除这些因素的影响。我有它的工作，但它会褪色整个页面

请帮忙

<script type="text/javascript" src="js/jquery.js"></script>

<script type="text/javascript">
$(document).ready(function() {
    $("body").css("display", "none");

    $("body").fadeIn(1100);

    $("a.transition").click(function(event){
        event.preventDefault();
        linkLocation = this.href;
        $("body").fadeOut(1000, redirectPage);      
    });

    function redirectPage() {
        window.location = linkLocation;
    }
});
</script>

使用jQuery方法

HTML:

选择$body时，将选择整个页面，包括页眉和页脚。这是因为页眉和页脚的HTML是body标记的子项。您需要更新选择器，使其仅适用于内容，至少适用于淡出情况。没有看到你的HTML，这是我能回答的。这是我的HTML，我明白你的意思，但我不知道我会如何执行它。谢谢你的密码。如果你看一下@bpettijohn的答案，你会发现你需要做什么，那就是把你的内容包装在一个div中，或者给它类似的类名，或者其他一些属性，你可以用jQuery只选择你想隐藏的元素。我刚刚尝试过，但我不确定我做错了什么。我尝试过包装内容，但我就是无法让它工作。我这里有我的HTML pastebin.com/u61VZFAM。你有没有机会解释一下我是如何做的？我几天前就开始使用CSS和HTML，所以我发现要找出我做错了什么有点困难。看起来你的目标是整个身体$body.fadeout 1000，重定向页面；尝试将目标锁定在要淡出的页面的特定部分。

<body>
<header>My Header</header>
<nav>Click here to make content disappear</nav>
<div>My Content</div>
<footer>My Footer</footer>
</body>

$(document).ready(function(){  
    $("nav").click(function(){
        $("div").fadeOut();
    });  
});