Also das Problem, das ich hier habe nennen ist, dass Funktionsrahmen() nicht innerhalb Funktion HideLogin nennen() ich einen Fehler in der Konsole bin immer:Kann nicht Animationsfunktion innerhalb und Onclick Funktion
Can not Lese Eigenschaft 'style' von undefined bei frame (page1.js: 46)
Welche ich sicher sehen kann, dass ich die Funktion in HideLogin definiert habe, in dem ich dann fortfahre, es als Argument zu senden. Die Funktion soll den Sign Up Text mit einem Klick auf die Animation bewegen. Dies funktioniert gut, wenn ich die gesamte Frame-Funktion in HideLogin einfüge. aber aus irgendeinem Grund kann ich mich nicht darauf berufen, wie ich es auch möchte. Wie kann ich Frame innerhalb von HideLogin aufrufen? Danke im Voraus
Javascript
function HideLogin()
{
var login = document.getElementById("login");
var SignUpSheet = document.getElementById("SignUpSheet");
var titlecard = document.getElementById("titlecard");
var signup = document.getElementById("signup");
var pos = 125;
var id = setInterval(frame, 1);
login.style.display = "none";
SignUpSheet.style.display = "block";
titlecard.style.display = "block";
frame(signup, pos, id);
}
function frame(signin, pos, id)
{
if (pos == 0) {
clearInterval(id);
} else {
pos--;
signup.style.top = pos + 'px';
}
}
CSS
#signup /* sign up link */
{
position: absolute;
cursor: pointer;
display: block;
//border: 2px solid white;
background: -webkit-linear-gradient(red, yellow);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
top: 125px;
font-family: papyrus;
font-size: 70px;
color: red;
text-shadow: 2px 2px black;
transition: text-shadow 0.5s ease;
}
#signup:hover
{
background: -webkit-linear-gradient(white, black);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
text-shadow: 4px 4px black;
}
HTML
<!doctype html>
<html>
<head>
<title>The Prime Legion</title>
<link rel="stylesheet" type="text/css" href="page1.css">
<script type="text/javascript" src="page1.js"></script>
</head>
<body>
<div id="logBox">
<div id="login" onclick="HideSignin()">
Log In
</div>
<div id="signup" onclick="HideLogin()">
Sign Up
</div>
</div>
<div id="LogInSheet">
<div id="LoginTitle">
<p><h4>Hello</h4></p>
</div>
</div>
<div id="SignUpSheet">
<div id="SignupTitle">
<p><h4>Welcome</h4></p>
</div>
</div>
<div id="titlecard">
<p><h1>The Prime Legion</h1></p>
</div>
</body>
</html>
Ich habe es herausgefunden. Ich musste der ID eine set interval Funktion zuweisen, damit dies richtig funktioniert. aber Sie waren ein guter Schritt in der Lösung dieses Problems. Danke an Sie und an alle. – chree