Я хочу, чтобы тело отображалось при загрузке сайта. Я много чего пробовал, но ничего не вышло. Буду признателен за помощь.
var celyLogin = $(".container");
$(document).ready(function(){
/*! Fades in page on load */
$(".container").css('display', 'none');
$(".container").fadeIn(5000);
});
Пробовал переходить с класса на id, не вышло. Я однажды задал этот вопрос, но у меня возникла еще одна проблема с тем, чтобы не поставить. перед «контейнером». Я не знаю, в чем проблема. Пожалуйста помоги. Вот CSS и HTML:
h1 {
display: block;
color: aliceblue;
text-align: center;
}
body {
background-color: #0c0c0c;
font-family: 'Fira Code', monospace;
}
.container {
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
color: white;
}
.submit {
display: block;
margin: auto;
background-color: black;
color: white;
}
<!DOCTYPE html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Welcome</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body class="container">
<div>
<div>
<h1>WELCOME USER</h1>
<div id="UandP">
<h3>
Username: <input class="username" type="text" name="username">
</h3>
<h3>
Password: <input class="password" type="password" name="password">
</h3>
</div>
<input type="button" class="submit" value="Log In" name="submit" onclick="validate()">
</div>
</div>
</body>
<script scr="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script scr="script.js"></script>
</html>