knock4293693

여기서 문제가 있나요 ?

뭐가 문제일까요 ㅠㅠ

이제는 그냥 값이 출력이 되는거도 없네요 ㅋㅋㅋ

그리고 계속 fadeIn fadeOut를 정상적으로 작성했음에도 불구하고 계속 그냥 딱딱하게 넘어가는데 이건 왜 그럴까요 ㅠ

뭐가 문제죠 ㅠㅠ

4분 50초 쯤에 시작하기 버튼을 눌러 넘어가는게 안되요 ! 뭐가 문제인지를 모르겠어요 ㅠ

start.js
const main = document.querySelector("#main");
const qna = document.querySelector("#qna");

function begin(){
&nbsp; main.style.WebkitAnimation = "fadeOut 1s";
&nbsp; main.style.animation = "fadeOut 1s";
&nbsp; qna.style.WebkitAnimation = "fadeIn 1s";
&nbsp; qna.style.animation = "fadeIn 1s";
&nbsp; //main.style.display = "none";
&nbsp; //qna.style.display = "block";
}

index.html
<!DOCTYPE html>
<html lang="ko" dir="ltr">

<head>
&nbsp; <meta charset="utf-8">
&nbsp; <meta name="viewport" content="width=device-width, initial-scale=1">

&nbsp; <title></title>
&nbsp; <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
&nbsp; <link rel="preconnect" href="https://fonts.gstatic.com">
&nbsp; <link href="https://fonts.googleapis.com/css2?family=Nanum+Pen+Script&display=swap" rel="stylesheet">
&nbsp; <link rel="stylesheet" href="./css/default.css">
&nbsp; <link rel="stylesheet" href="./css/main.css">
&nbsp; <link rel="stylesheet" href="./css/qna.css">
&nbsp; <link rel="stylesheet" href="/css/animation.css">
</head>

<body>
&nbsp; <div class="container">
&nbsp; &nbsp; <section id="main" class="mx-auto my-5 py-5 px-3">
&nbsp; &nbsp; &nbsp; <h1>십이로 알아보는 연애유형</h1>
&nbsp; &nbsp; &nbsp; <div class="col-lg-6 col-md-8 col-sm-10 col-12 mx-auto">
&nbsp; &nbsp; &nbsp; &nbsp; <img src="./img/main.png" alt="mainImage" class="img-fluid">
&nbsp; &nbsp; &nbsp; </div>
&nbsp; &nbsp; &nbsp; 
&nbsp; &nbsp; &nbsp; &nbsp; 나만의 MBTI 사이트입니다! 
&nbsp; &nbsp; &nbsp; &nbsp; 시작하기 버튼을 누르면 시작합니다.
&nbsp; &nbsp; &nbsp; 
&nbsp; &nbsp; &nbsp; <button type="button" class="btn btn-outline-danger mt-3" onclick="js:begin()">시작하기</button>
&nbsp; &nbsp; </section>
&nbsp; &nbsp; <section id="qna">
&nbsp; &nbsp; &nbsp; test!
&nbsp; &nbsp; &nbsp; <div class="status mx-auto mt-5">
&nbsp; &nbsp; &nbsp; &nbsp; <div class="statusBar">
&nbsp; &nbsp; &nbsp; &nbsp; </div>
&nbsp; &nbsp; &nbsp; </div>
&nbsp; &nbsp; &nbsp; <div class="qBox my-5 py-3 mx-auto">

&nbsp; &nbsp; &nbsp; </div>
&nbsp; &nbsp; &nbsp; <div class="answerBox">

&nbsp; &nbsp; &nbsp; </div>
&nbsp; &nbsp; </section>
&nbsp; &nbsp; <section id="result">

&nbsp; &nbsp; </section>
&nbsp; &nbsp; <script src="./js/data.js" charset="utf-8"></script>
&nbsp; &nbsp; <script src="./js/start.js" charset="utf-8"></script>
&nbsp; </div>
</body>

</html>

knock4293693

投稿