Jquery J查询-在页面之间淡入淡出并使用文本预加载页面

Jquery J查询-在页面之间淡入淡出并使用文本预加载页面,jquery,html,css,Jquery,Html,Css,嗨,我刚开始使用JQUERY,遇到了一个问题。我想有一个简单的预加载页面的文本,等待网站加载。我还希望JQUERY在页面之间淡出 我只希望文本出现在页面首次加载时,而不是页面上导航链接之间。我的代码在加载页面时工作,但它也显示导航链接之间的文本 谢谢你的帮助,希望有意义 JQuery $(window).load(function() { $(".loader").delay(2000).fadeOut("slow"); $("body").css("display", "

嗨,我刚开始使用JQUERY,遇到了一个问题。我想有一个简单的预加载页面的文本,等待网站加载。我还希望JQUERY在页面之间淡出

我只希望文本出现在页面首次加载时,而不是页面上导航链接之间。我的代码在加载页面时工作,但它也显示导航链接之间的文本

谢谢你的帮助,希望有意义

JQuery

$(window).load(function() {
$(".loader").delay(2000).fadeOut("slow");       
    $("body").css("display", "none");
    $("body").fadeIn(2000);
});
    $('#link').click(function(){
        $("body").css("display", "none");
        $("body").fadeIn(2000);

});
CSS

HTML


将变量存储为cookie,例如,它将指示页面是否第一次加载。
执行“淡入前检查”功能,如果页面是第一次加载,请执行淡入,否则–什么也不做。

我尝试存储cookie变量,但无法使其正常工作,您是否可以提供帮助。请参见上文。您正在尝试使用$.cookie,这是来自jquery插件的函数。你连接那个插件了吗?
.loader {
position: fixed;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 9999;
background-color: black;
}

#load_text{
    text-align: center;
    color: white;
    left: 0;
    line-height: 200px;
    margin: auto;
    margin-top: -100px;
    position: absolute;
    top: 50%;
    width: 100%;
 }
<body>   
<div class="loader">
    <h1 id = "load_text">THIS IS A BIG HEADING</h1>
</div>

<div class = "jumbotron">
    <div id = "container">
                <a href = "index.html" id = "link" > <h1>LINK</h1></a>
                <a href = "second page.html" id = "link"> <h1>LINK2</h1></a>     
    </div>

</div>
</body>    
    $(document).ready(function() {
                // check cookie
    var visited = $.cookie("visited")

    if (visited == null) {   

        $(".loader").css("display", "inline");
        $(".loader").fadeOut(2000);
        $.cookie('visited', 'yes'); 
        alert($.cookie("visited"));         
    }

$(window).unload(function () {
    // Remove the cookie
    $.cookie("visited", null);
});      


});