코딩 html 좀 도와주세요 ㅠㅠ
-
게시물 수정 , 삭제는 로그인 필요
학교 과제로 코딩을 진행해야 하는데요. 아래 주어진 도미노 코딩(?) 소스에서 내용만 조금 바꿔서 완성하면 되거든요. 바로 이 링크를 타고 들어가면 있는 ( http://www.gianlucamonaco.com/e/domino/) 거예요! 여기 들어가서 페이지 소스 보기 통해서 코딩된 거 복사해다가 코딩 프로그램에 일단 아무것도 안 바꾸고 저장만 한 다음에 다시 저장한 거 크롬으로 열어봤거든요. ㅠㅠ 근데 저 링크 들어가면 나오는 것처럼 안 되고 그냥 글자들이 아무 효과, 색깔도 없이 나오기만 해서 당황스러워요. 저 아무것도 안 건드렸거든요... 문제가 뭘까요?
또 이 코딩에서 도미노로 넘어지는 단어들 바꾸는 법, 색상 바꾸는 법까지 알려 주시면 감사하겠습니다! 내공 걸고 꼭 채택할게요! 혹시 몰라 아래에 저 링크 들어가서 페이지 소스 보기 하면 나오는 코딩 긁어서 둘게요.
<html>
<head>
<meta charset="utf-8">
<title>Effetto domino</title>
<!-- FAVICON -->
<link rel="shortcut icon" type="image/png" href="img/favicon.png"/>
<!-- CSS -->
<link rel="stylesheet" type="text/css" href="style.css">
<!-- META FOR SHARING -->
<meta property="og:url" content="http://www.gianlucamonaco.com/browser-poetry/effetto-domino" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Effetto domino" />
<meta property="og:description" content="Browser poetry." />
<meta property="og:image" content="http://www.gianlucamonaco.com/browser-poetry/effetto-domino/preview.png" />
<link href="https://fonts.googleapis.com/css?family=Oswald:700" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<div class="container">
<h1 class="effetto t-0">L'effetto</h1>
<h1 class="domino t-1">Domino</h1>
<h1 class="effetto t-2">L'effetto</h1>
<h1 class="domino t-3">Domino</h1>
<h1 class="effetto t-4">L'effetto</h1>
<h1 class="domino t-5">Domino</h1>
<h1 class="effetto t-6">L'effetto</h1>
<h1 class="domino t-7">Domino</h1>
<h1 class="effetto t-8">L'effetto</h1>
<h1 class="domino t-9">Domino</h1>
<h1 class="effetto t-10">L'effetto</h1>
<h1 class="domino t-11">Domino</h1>
<h1 class="effetto t-12">L'effetto</h1>
<h1 class="domino t-13">Domino</h1>
<h1 class="effetto t-14">L'effetto</h1>
<h1 class="domino t-15">Domino</h1>
<h1 class="effetto t-16">L'effetto</h1>
<h1 class="domino t-17">Domino</h1>
<h1 class="effetto t-18">L'effetto</h1>
<h1 class="domino t-19">Domino</h1>
<h1 class="effetto t-20">L'effetto</h1>
<h1 class="domino t-21">Domino</h1>
<h1 class="effetto t-22">L'effetto</h1>
<h1 class="domino t-23">Domino</h1>
<script>
$(document).ready(function() {
$("h1").each(function() {
var thisClass = $(this).attr("class");
if ( $(this).hasClass("domino") ) {
var thisPosition = thisClass.replace('domino t-', '');
} else if ( $(this).hasClass("effetto") ) {
var thisPosition = thisClass.replace('effetto t-', '');
}
$(this).css({
left: (thisPosition * 70) - 40 + "vh",
});
if (thisPosition == 0) {
$(this).css({
animationDelay: "22s"
});
} else if (thisPosition > 15) {
$(this).css({
animation: "none"
});
} else {
$(this).css({
animationDelay: (thisPosition * 2 - 2) + "s"
});
}
});
});
</script>
</body>
</html>
학교 과제로 코딩을 진행해야 하는데요. 아래 주어진 도미노 코딩(?) 소스에서 내용만 조금 바꿔서 완성하면 되거든요. 바로 이 링크를 타고 들어가면 있는 ( http://www.gianlucamonaco.com/e/domino/) 거예요! 여기 들어가서 페이지 소스 보기 통해서 코딩된 거 복사해다가 코딩 프로그램에 일단 아무것도 안 바꾸고 저장만 한 다음에 다시 저장한 거 크롬으로 열어봤거든요. ㅠㅠ 근데 저 링크 들어가면 나오는 것처럼 안 되고 그냥 글자들이 아무 효과, 색깔도 없이 나오기만 해서 당황스러워요. 저 아무것도 안 건드렸거든요... 문제가 뭘까요?
또 이 코딩에서 도미노로 넘어지는 단어들 바꾸는 법, 색상 바꾸는 법까지 알려 주시면 감사하겠습니다! 내공 걸고 꼭 채택할게요! 혹시 몰라 아래에 저 링크 들어가서 페이지 소스 보기 하면 나오는 코딩 긁어서 둘게요.
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>Effetto domino</title> | |
| <!-- FAVICON --> | |
| <link rel="shortcut icon" type="image/png" href="img/favicon.png"/> | |
| <!-- CSS --> | |
| <link rel="stylesheet" type="text/css" href="style.css"> | |
| <!-- META FOR SHARING --> | |
| <meta property="og:url" content="http://www.gianlucamonaco.com/browser-poetry/effetto-domino" /> | |
| <meta property="og:type" content="website" /> | |
| <meta property="og:title" content="Effetto domino" /> | |
| <meta property="og:description" content="Browser poetry." /> | |
| <meta property="og:image" content="http://www.gianlucamonaco.com/browser-poetry/effetto-domino/preview.png" /> | |
| <link href="https://fonts.googleapis.com/css?family=Oswald:700" rel="stylesheet"> | |
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <h1 class="effetto t-0">L'effetto</h1> | |
| <h1 class="domino t-1">Domino</h1> | |
| <h1 class="effetto t-2">L'effetto</h1> | |
| <h1 class="domino t-3">Domino</h1> | |
| <h1 class="effetto t-4">L'effetto</h1> | |
| <h1 class="domino t-5">Domino</h1> | |
| <h1 class="effetto t-6">L'effetto</h1> | |
| <h1 class="domino t-7">Domino</h1> | |
| <h1 class="effetto t-8">L'effetto</h1> | |
| <h1 class="domino t-9">Domino</h1> | |
| <h1 class="effetto t-10">L'effetto</h1> | |
| <h1 class="domino t-11">Domino</h1> | |
| <h1 class="effetto t-12">L'effetto</h1> | |
| <h1 class="domino t-13">Domino</h1> | |
| <h1 class="effetto t-14">L'effetto</h1> | |
| <h1 class="domino t-15">Domino</h1> | |
| <h1 class="effetto t-16">L'effetto</h1> | |
| <h1 class="domino t-17">Domino</h1> | |
| <h1 class="effetto t-18">L'effetto</h1> | |
| <h1 class="domino t-19">Domino</h1> | |
| <h1 class="effetto t-20">L'effetto</h1> | |
| <h1 class="domino t-21">Domino</h1> | |
| <h1 class="effetto t-22">L'effetto</h1> | |
| <h1 class="domino t-23">Domino</h1> | |
| <script> | |
| $(document).ready(function() { | |
| $("h1").each(function() { | |
| var thisClass = $(this).attr("class"); | |
| if ( $(this).hasClass("domino") ) { | |
| var thisPosition = thisClass.replace('domino t-', ''); | |
| } else if ( $(this).hasClass("effetto") ) { | |
| var thisPosition = thisClass.replace('effetto t-', ''); | |
| } | |
| $(this).css({ | |
| left: (thisPosition * 70) - 40 + "vh", | |
| }); | |
| if (thisPosition == 0) { | |
| $(this).css({ | |
| animationDelay: "22s" | |
| }); | |
| } else if (thisPosition > 15) { | |
| $(this).css({ | |
| animation: "none" | |
| }); | |
| } else { | |
| $(this).css({ | |
| animationDelay: (thisPosition * 2 - 2) + "s" | |
| }); | |
| } | |
| }); | |
| }); | |
| </script> | |
| </body> | |
| </html> |
#코딩 html #코딩 자율학습 html + css + 자바스크립트 #생활 코딩 html #이메일 html 코딩 #html 코딩 사이트 #html 코딩 프로그램 #html 코딩 밈 #아이패드 html 코딩 #메모장 html 코딩 #ai html 코딩
