좋아, 그래서 우리는 우리가 그만 뒀던 곳에서 데리러 갈거야.
올바른 색상을 클릭 할 때와 잘못된 색상을 클릭 할 때 일부 동작이 추가 될 것입니다.
그럼 잘못된 색상을 선택하는 것으로 시작합시다.
우리가하고 싶은 것은 배경색과 일치하도록 페이드 아웃하는 것입니다.
따라서 실제로는 매우 간단합니다.
배경이 똑같다는 도트 스타일을 작성하는 것입니다. 그런 다음 Cs에서 설정 한 색상과 일치해야합니다.
그래서 우리는 그것을 붙여 넣고 저장합니다.
그것을 시험해 봅시다.
틀린 것을 클릭합시다.
페이드 아웃을 볼 수 있습니다. 오른쪽 버튼을 클릭하면 경고가 표시됩니다.
OK. 그래서 나는 새롭게 할 것이다.
이것이 바로 우리가 시작하려고하는 것입니다.
그리고 우리가 일어나고 싶은 또 다른 일은 우리가 디스플레이를 원한다는 것입니다. 그래서 여기서 바로 볼 수 있습니다.
디스플레이가 있으므로 색상 중 하나를 클릭하면 다시 시도됩니다.
그리고 만약 내가 여기와 같이 맞으면 색깔이 바뀌는 것과 같은 다른 것에 집중할 것입니다.
일단 우리가 그 첫 번째 부분을 얻습니다.
이 단락을 추가하거나 범위를 실제로 추가하고 올바른 메시지를 표시하도록합시다.
그래서 우리는 HMO로 돌아가서 다른 div를 추가 할 것입니다. 그리고 실제로 우리는 결국 여기에 갈 3,4 가지의 다른 조각을 가지고 있습니다.
지금은 div에 들어가는 작은 스팬 일 것입니다.
그래서 제가 언급했듯이 더 많은 것이 될 것입니다.
지금은 페이지를 새로 고침하면서 메시지가 없다는 것을 알기 시작할 때 비어있는 빈 공간 일 것입니다.
그래서 우리는 여기에 갈 것입니다. 저는 빈 칸을 가지고 있으며, 그것을 아이디로 알려줍니다. 우리는 단지 메시지라고 부를 것입니다.
그런 식으로 우리는 Javascript 대신 그것을 선택할 수 있습니다.
자 이제 자바 스크립트로 가서 선택해 봅시다.
이제 우리는 팜 메시지 표시를 문서와 같다고 부를 것이고 쿼리 선택기 쿼리 선택기를 수행하고 그 메시지를 호출 할 것입니다.
ID가 필요합니다.
그래서 토르에게 호가 필요합니다.
그리고 나서 사용자가 잘못 추측하면됩니다.
우리가해야 할 일은 메시지 디스플레이 도트 텍스트 내용 쓰기를 다시 시도하는 것입니다.
우리가 새로 고침하고 잘못된 것을 클릭하면 정말보기가 어렵습니다.
그래서 배경 색상이나 텍스트 색상을 변경해야합니다.
우리가 여기서 할 수 있습니다.
우리는 모든 스팬의 색상이 흰색이어야하며 신선해야한다고 말합니다.
이제 나는 틀린 것을 클릭했다.
다시 시도하라고 알려줍니다.
승인.
그리고 우리는 내가 올바른 것을 얻을 때까지 그것을 계속 얻습니다.
그리고 우리는 여전히이 경고를 받는다.
올바른 메시지를 얻으려면 메시지 디스플레이에 표시 할 내용을 변경하십시오.
올바른 것으로 변경하고 싶습니다.
따라서 텍스트 내용이 정확하다는 메시지가 표시됩니다.
그냥 그렇게.
그리고 지금 우리가 이것을 시도한다면 우리는 그것을 잘못하고 다시 시도하십시오.
우리는 그것을 올바르게 받아들이고 정확하다고 말해줍니다.
승인.
그래서 우리는 지금 우리가 옳고 그른지를 확인하고 뭔가를 표시하고있는 기본 논리를 가지고 있습니다.
다음으로 우리가 할 수있는 것은 올바른 답을 얻을 때 모든 사각형이 그 답을 맞추기 위해 색깔을 바꾸는 기능을 추가하는 것입니다.
그래서 여기 당신은 그들이 모두 변화 학위를 오른쪽 대답을 클릭하십시오.
그리고 나서 우리는이 H1의 배경을 또한 할 수 있습니다.
그래서 우리는이 일을하기 위해 그렇게해야합니다.
실제로 코드를 좀 더 체계적으로 관리하기 위해 실제로는 별도의 함수를 작성하려고합니다.
색상을 변경하면 색상 문자열을 단일 인수로 취한 다음 여기에서 모든 사각형을 반복해야 각 색상이 주어진 색상과 일치하도록 변경해야합니다.
그래서 우리가 이미했던 모든 사각형을 반복하기 위해서는 VAR I가 0 인 4 개의 문제가 컬러 도트의 길이보다 작거나 그 길이에 더하기 색을 더한 것입니다.
그리고 나서 내부는 우리가 각 색상을 바꿀 필요가있는 곳입니다.
그것은 단지 색입니다.
스타일이 까다로운 배경은 색상과 동일합니다. 기술적으로 제공 한 코드는 모든 사각형을 색상과 일치하도록 바꿉니다.
그래서이 색을 포함하여 올바른 색상입니다.
그것을 덮어 쓰고 이미있는 것과 동일한 색으로 바꿀 것입니다.
이를 수정하기위한 코드를 추가 할 수 있습니다.하지만이 함수를 호출하여이 함수를 색상이라고 바꾸고 우리가 작성한 변수 인 올바른 색상을 전달해야합니다.이 색상은 스타일이 적용된 배경입니다. 클릭했습니다.
그리고 우리는 이것을하고 있습니다.
그들이 그것을 정확하게 추측하면.
따라서 저장하고 새로 고침하면 오류가 있는지 확인하십시오.
아니.
이제는 빠릅니다.
잘못된.
올바른 것을 클릭하면 문제가 생깁니다. 우리가 배경에 스타일을 적용하는 색상에 대해 이야기 할 때 정의되지 않은 속성 배경을 설정할 수 없다고 알려줍니다.
물론 우리는 여기에 문제가 있습니다. 왜냐하면 저는 이것을 우리의 색상 배열에 적용하고 있기 때문에 이것이 우리의 색상이되어서는 안됩니다.
이것은 우리의 색상 배열입니다.
그것은 우리가 바꾸려고하는 사각형 인 사각형 배열에 있어야합니다.
내가 뭘하고 있었는지 색 배열은 문자열뿐입니다.
그래서 사각형이 길어지면 이제는 좋을 것입니다. 그리고 그들은 모두 그처럼 고른 색으로 바뀝니다.
괜찮아.
다음은 배열에서 임의의 색상을 가져온 다음 해당 배열에서 임의의 색상을 선택하는 데 초점을 맞추어 보겠습니다.
그래서 저는이 배열에서 임의의 요소를 선택하는 데 도움이되도록 자동으로 색상을 지정하는 대신 임의의 색상을 선택하는 두 번째 작업부터 시작하겠습니다.
나는 실제로 기능을 만들 예정입니다.
그리고 제가하는 일은 코드를 정리하는 것입니다.하지만 우리가 새로운 게임을 시작할 때마다 새로운 색상을 선택해야하기 때문에 실제로 그 기능을 나중에 사용하게 될 것입니다.
그래서 우리는 그 일을하기 위해 몇 번 전화해야 할 것입니다.
나는 아직 존재하지 않는 함수를 호출함으로써 시작할 것입니다.
그래서 나는 pick의 색깔이 같다고 말하고 이름을 지어 보겠습니다.
색상을 선택한 다음 선택 색상을 정의해야합니다.
그래서 나는 여기에 내려와 그냥 기능 선택에 대한 하단에 지금하십시오.
이 함수의 색상은 두 가지 작업을 수행해야합니다.
하나는 임의의 숫자를 선택합니다.
그래서이 배열의 마지막 인덱스까지 0 또는 1 또는 2와 같은 것입니다.
그런 다음이 배열의 색상에 액세스하고 해당 색상을 반환하려면 해당 숫자를 사용해야합니다.
그래서 우리는 임의의 숫자를 선택하는 것으로 시작하겠습니다.
그리고 우리가 javascript에서 무작위 수를 선택하는 방법은 무작위로 수학을 사용하고 무작위로 수학을 선택하면 0과 1 사이의 숫자를 선택하며 하나는 포함하지 않습니다.
그래서 무작위가 아닌 수학을 보여 드리겠습니다. 그리고 그것은 길고 긴 십진수입니다.
예를 들어 Dayrell을 모방하기 위해 0과 6 사이의 숫자를 생성하려면 무작위로 수학을 수행 한 다음 곱합니다.
우리의 경우 우리가 6 센트 만했다면 실제로 9 점 9 점 9 점을 얻지 못할 것입니다.
그 번호를 하나에서 위로 이동하여 6을 알려주려면 6을 곱한 다음 끝에 하나를 더할 수 있습니다.
이제 우리는 6 포인트 90만큼 높아지고 정수를 얻을 수 있습니다.
우리는 그 다음 소수점을자를 필요가 있습니다. 그래서 우리는 또 다른 방법 인 수학 최상층을 사용할 수 있습니다. 그리고 그것은 수학에서 반환 된 것이 모두 1을 곱하여 무작위로 곱하고, 소수점 이후의 모든 것을 제거하는 것입니다.
그리고 그것은 우리에게 1과 6 사이의 난수를줍니다.
알 수 있듯이 1 ~ 6 사이의 숫자는 꼭 필요하지는 않습니다.
이 배열에는 결국 세 개의 항목 만있을 수 있습니다.
쉬운 모드로 가면 3 가지 색상 만 보입니다.
그래서 그것은 세 개가 있고 여섯 개는 가질 수 있습니다.
그래서 우리는 배열의 길이를 사용하여 우리의 색상을 생성 할 것입니다. 그래서 수학적으로 무작위로 생각할 것입니다. 우리는 0과 1 사이의 숫자를 생성 한 다음 배열의 길이로 곱합니다. 그것이 포괄적이지 않다는 것을 기억하기 때문에 OK.
배열의 길이가 가장 높은 인덱스보다 하나 더 길더라도.
그래서 길이는 6입니다.
그러나 우리가 원하는 가장 높은 숫자는 5입니다.
난수는 0과 1 사이에 있기 때문에.
그러나 우리가 좋은 모습을 보이지는 않습니다.
그래서 우리는 그것을 생성 할 것입니다. 그리고 나서 우리는 남은 소수점을 잘라 버릴 그 모든 것의 바닥을 계산할 것입니다.
다음으로해야 할 일은 변수에 저장 한 다음 해당 변수를 사용하여 해당 인덱스에있는 배열의 요소에 액세스하는 것입니다.
그래서 우리는 리턴 컬러를 무작위로 말할 것입니다.
그래서 이것은 3과 같은 임의의 숫자를 고른 다음 3의 색상을 반환합니다.
괜찮아.
그럼 이것을 시험해 봅시다.
색상을 선택했습니다.
우리는 여기에 꼭대기에서 픽업 컬러를 부르고 있습니다.
그래서 내가 새롭게하면 우리는 이것을 바꿀 것을 기대해야하며 새로 고침 할 때 바뀌는 것입니다.
6 개 밖에 없기 때문에 때때로 같은 것을 얻는 것을 볼 수 있습니다.하지만 그들은 거의 변하지 않습니다.하지만 거의 언제나 바뀝니다.
이제 우리의 빠른 로직이 같은 방식으로 작동하는지 확인해 봅시다.
그래서이 버튼을 클릭하면 제로 (zero)의 제로 그린과 모두 파란색이됩니다.
그럼 붉은 시안을 클릭 해 봅시다.
좋은.