Archive 126

Javascript를 이용한 사이트 만들기! - 마우스 효과 사이트 만들기02

- 자 오늘도 마우스 효과를 사용해서 페이지를 만들어 보겠습니다. - 오늘 할 것은 마우스 포인터를 동그라미 2개로 만들고 하나는 천천히 따라오게 해주는 것입니다. - 코드를 먼저 보겠습니다. Javascript Mouse Effect01 마우스 이펙트 - 마우스 따라다니기 1 2 3 4 5 Insanity is doing the same thing over and over again and expecting different results. 늘 같은 길을 가면서 다른 결과를 바라는 것은 어리석은 짓이다. im.kebab00@gmail.com - 일단 HTML의 구조를 보면 마우스 커서를 대신할 2개의 div태그가 보입니다. - 그 두개의 div태그에 mouse__cursor, mouse__cursor2..

Archive/Javascript 2023.03.21

Javascript를 이용한 사이트 만들기! - 마우스 효과 사이트 만들기01

- 자 오늘은 마우스 효과를 사용해서 페이지를 만들어 보겠습니다. - 동그란 원이 마우스 커서를 대신하는 효과인 것이죠~ Javascript Mouse Effect01 마우스 이펙트 - 마우스 따라다니기 1 2 3 4 5 Traveling is making new memories . 여행은 새로운 추억을 쌓는 것이다. clientX : px clientY : px offsetX : px offsetY : px pageX : px pageY : px screenX : px screenY : px im.kebab00@gmail.com - 자 이것이 위에 있는 페이지의 코드입니다. - 눈에 띄는 것은 마우스를 움직일 때마다 마우스의 좌표를 알려주는 것이고 커서를 특정 단어 위에 올려두었을 때 커서에 효과가 있..

Archive/Javascript 2023.03.20

사이트를 만들어 봅시다. - TextType(01)

-오늘은 위에 있는 예시처럼 슬라이드 형식의 페이지를 만들어 보겠습니다. - 구조는 6개의 박스에 텍스트가 있는 형식입니다. - 나중에 각 박스를 클릭하게 된다면 해당 내용에 관련된 페이지로 넘어가게 해줄 수도 있습니다. - 일단 코드를 보시죠 NOTICE 식물을 키울 때 유의할 점 적절한 환경 조성 각 식물은 자신만의 적절한 환경을 필요로 합니다. 적절한 온도, 습도, 빛 등을 제공해주어야 합니다. 예를 들어, 대부분의 화분 식물들은 밝은 곳에서 자라는 것을 좋아합니다. 더보기 적절한 수분 공급 대부분의 식물들은 적절한 양의 물을 필요로 합니다. 물 주기는 각 식물마다 다르며, 너무 많이 물을 주거나 적게 물을 주는 것은 식물의 건강에 영향을 미칠 수 있습니다. 더보기 적절한 토양 선택 적절한 토양을 ..

Archive/HTML 2023.03.19

Javascript를 이용한 사이트 만들기! - 퀴즈 효과 사이트 만들기04

- 오늘은 객관식 문제를 풀 수 있는 사이트를 만들어 보겠습니다. - 바로 코드로 넘어가 보도록하죠 Quiz 주관식 확인하기(여러문제) 유형 1 2 3 4 정답입니다! 틀렸습니다! 정답 확인하기 im.kebab00@gmail.com - 먼저 HTML부분에 달라진 부분이 있습니다. 바로 ,,태그들을 이용해서 선택할 상자들을 만들어 주었습니다. - 태그의 type에 button,checkbox등의 속성을 넣으면 원하는 방식으로 데이터를 입력받을 수 있습니다. - 그리고 id는 다르게 했지만 name은 같은 값을 주어 4개 중에 하나만 선택이 가능하도록 만들어 주었습니다. - value는 눌렀을 때 입력되는 데이터를 JavaScript 등의 스크립트에서 수집하거나 서버로 전송하는 등의 작업에 사용됩니다. - ..

Archive/Javascript 2023.03.18

Javascript를 공부해 봅시다! - 번외편. 오답노트를 해보자(3)

- 오늘도 금요일입니다. - 어김없이 있는 오답노트의 날 - 같이 보시죠 01. 결괏값을 작성하시오. { (function(){ console.log("함수가 실행되었습니다."); })(); } - 정답 : 함수가 실행되었습니다 02. 결괏값을 작성하시오. { function func(str = "함수가 실행되었습니다."){ document.write(str); } func(); } - 정답 : 함수가 실행되었습니다 03. 결괏값을 작성하시오. { let sum = 0; for(var i=1; i num2) return num1 else return num2 } console.log(func(10, 23) + func(40, 50)) } - 정답 : 73

Archive/Javascript 2023.03.17

23. 03. 16 목요일.

Chanter01. 코딩일기 - 오늘은 오전에 함수를 했다. - 예전에 배웠던 선언적 함수, 익명함수, 매개변수 함수, 리턴 값 함수와 더불어 객체생성자 함수와 프로토타입함수, 객체리터널함수를 배웠다. - 객체 생성자 함수는 조금 어려운데 프로토 타입함수와 객체리터널 함수에 대해서 살짝 말해보자면 프로토 타입 함수는 편의를 위해서 객체안에 넣어 두었던 함수를 다시 밖으로 가져왔는데 원래 안에 있던 객체의 데이터들을 계속 사용할 수 있게 된 함수들이다. 그렇게 한 이유는 하나의 객체 안에 있으면 모든 함수가 다 실행되기 될 때 불필요한 리소스 낭비가 생기기 때문에 그 것을 방지해주기 위한 방편이다. - 객체 리터널 함수는 위의 프로토타입 함수에서 나온 함수들을 묶어서 하나의 객체로 만들어 준 것이다. 이렇..

Archive/일상 2023.03.16