无法在内部调用动画函数和点击函数

所以我在这里遇到的问题是函数frame((不会在函数HideLogin((内部调用我在控制台中收到错误：

无法读取框架中未定义的属性"样式" (页1.js：46(

我敢肯定，人们可以看到我已经在 HideLogin 中定义了函数，然后我继续将其作为参数发送。该函数应该通过动画点击向上移动注册文本。当我将整个框架函数放在 HideLogin 中时，这工作正常。但由于某种原因，我也无法随心所欲地调用它。如何在隐藏登录中调用框架？提前感谢

爪哇语

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>

将signup.style.top = pos + 'px'更改为signin.style.top = pos + 'px' ;

将参数名称从 signin 更改为 signup 。您正在尝试使用未在 frame 函数中定义的变量signin，变量signin全局变量也不是全局变量。因此，变量signup未定义，因此您会收到错误

"无法读取帧处未定义的属性'样式'">

function frame(signin, pos, id)

自

function frame(signup, pos, id)

function frame(signup, pos, id) 
{
    if (pos == 0) {
    clearInterval(id);
    } else {
        pos--; 
        signup.style.top = pos + 'px'; 
    }
}

相关内容

最新更新

热门标签：