登录主页后才淡入淡出？

Question

I'm trying to build a transition between my login page and the main page of the site.我正在尝试在我的登录页面和网站主页之间建立一个过渡。 However, I end up fading in the main page on each call within the site.但是，我最终会在站点内的每次调用中淡出主页。 I understand why but I can't figure out how I can set the effect only to happen when calling the main page after the login screen.我明白为什么，但我不知道如何设置只有在登录屏幕后调用主页时才会发生的效果。

 <head> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script> <script src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body> <script> $("body").hide(); $("body").fadeIn(10000); </script> <div> Hello World!</div> </body> </html>

I'm trying to build a transition between my login page and the main page of the site.我正在尝试在我的登录页面和网站主页之间建立一个过渡。 However, I end up fading in the main page on each call within the site.但是，我最终会在站点内的每次调用中淡出主页。 I understand why but I can't figure out how I can set the effect only to happen when calling the main page after the login screen.我明白为什么，但我不知道如何设置只有在登录屏幕后调用主页时才会发生的效果。

Main Page:主页：

<head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
    <script src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>

<body>
    <script>
        $("body").hide();
        $("body").fadeIn(1000);
    </script>
    <div> Hello World!</div>

</body>

</html>

Login Page:登录页面：

<!DOCTYPE html>
<html lang="de">

<head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
    <script src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>

<body>
    <div class="btn float-right login_btn" id="loginbutton">Login</div>
    <script type="text/javascript">
        document.getElementById("loginbutton").onclick = function () {
            location.href = "./pages/mainpage.html";
        };
    </script>

</body>

</html>

Answer 1

<script type="text/javascript">
    $(document).ready(function () {
    if(document.referrer == "http://localhost:65434/Home/Login")
    {
            $("body").hide();
            $("body").fadeIn(1000);
    }    
    });
</script>

登录主页后才淡入淡出？

问题描述

1 个解决方案

解决方案1
1 已采纳 2020-01-22 10:32:38

登录主页后才淡入淡出？

问题描述

1 个解决方案

解决方案1 1 已采纳 2020-01-22 10:32:38

解决方案1
1 已采纳 2020-01-22 10:32:38