SEOLHEE

슬라이드이펙트란? 웹 사이트나 애플리케이션에서 이미지나 콘텐츠를 슬라이딩하여 화면에 전환하는 효과를 의미합니다. 슬라이드 이펙트는 다양한 형태로 표현될 수 있으며, 주로 이미지 갤러리, 배너, 광고 등에서 사용됩니다. 슬라이드 이펙트는 사용자가 웹 페이지를 더욱 동적으로 느끼게 하고, 시각적인 흥미를 유발하여 사용자 경험을 향상시키는 효과를 가지고 있습니다. 또한, 슬라이드 이펙트는 화면 전환 시 부드러운 애니메이션을 제공하여 사용자가 불편함을 느끼지 않도록 도와줍니다. 주로 사용되는 슬라이드 이펙트에는 수평 슬라이드, 수직 슬라이드, 페이드 인/아웃, 카드 슬라이드, 돌리기, 점진적 슬라이드 등이 있습니다. 이러한 슬라이드 이펙트는 CSS와 JavaScript를 사용하여 구현할 수 있으며, 라이브러리나..

슬라이드이펙트란? 웹 사이트나 애플리케이션에서 이미지나 콘텐츠를 슬라이딩하여 화면에 전환하는 효과를 의미합니다. 슬라이드 이펙트는 다양한 형태로 표현될 수 있으며, 주로 이미지 갤러리, 배너, 광고 등에서 사용됩니다. 슬라이드 이펙트는 사용자가 웹 페이지를 더욱 동적으로 느끼게 하고, 시각적인 흥미를 유발하여 사용자 경험을 향상시키는 효과를 가지고 있습니다. 또한, 슬라이드 이펙트는 화면 전환 시 부드러운 애니메이션을 제공하여 사용자가 불편함을 느끼지 않도록 도와줍니다. 주로 사용되는 슬라이드 이펙트에는 수평 슬라이드, 수직 슬라이드, 페이드 인/아웃, 카드 슬라이드, 돌리기, 점진적 슬라이드 등이 있습니다. 이러한 슬라이드 이펙트는 CSS와 JavaScript를 사용하여 구현할 수 있으며, 라이브러리나..

슬라이드이펙트란? 웹 사이트나 애플리케이션에서 이미지나 콘텐츠를 슬라이딩하여 화면에 전환하는 효과를 의미합니다. 슬라이드 이펙트는 다양한 형태로 표현될 수 있으며, 주로 이미지 갤러리, 배너, 광고 등에서 사용됩니다. 슬라이드 이펙트는 사용자가 웹 페이지를 더욱 동적으로 느끼게 하고, 시각적인 흥미를 유발하여 사용자 경험을 향상시키는 효과를 가지고 있습니다. 또한, 슬라이드 이펙트는 화면 전환 시 부드러운 애니메이션을 제공하여 사용자가 불편함을 느끼지 않도록 도와줍니다. 주로 사용되는 슬라이드 이펙트에는 수평 슬라이드, 수직 슬라이드, 페이드 인/아웃, 카드 슬라이드, 돌리기, 점진적 슬라이드 등이 있습니다. 이러한 슬라이드 이펙트는 CSS와 JavaScript를 사용하여 구현할 수 있으며, 라이브러리나..

슬라이드이펙트란? 웹 사이트나 애플리케이션에서 이미지나 콘텐츠를 슬라이딩하여 화면에 전환하는 효과를 의미합니다. 슬라이드 이펙트는 다양한 형태로 표현될 수 있으며, 주로 이미지 갤러리, 배너, 광고 등에서 사용됩니다. 슬라이드 이펙트는 사용자가 웹 페이지를 더욱 동적으로 느끼게 하고, 시각적인 흥미를 유발하여 사용자 경험을 향상시키는 효과를 가지고 있습니다. 또한, 슬라이드 이펙트는 화면 전환 시 부드러운 애니메이션을 제공하여 사용자가 불편함을 느끼지 않도록 도와줍니다. 주로 사용되는 슬라이드 이펙트에는 수평 슬라이드, 수직 슬라이드, 페이드 인/아웃, 카드 슬라이드, 돌리기, 점진적 슬라이드 등이 있습니다. 이러한 슬라이드 이펙트는 CSS와 JavaScript를 사용하여 구현할 수 있으며, 라이브러리나..

슬라이드이펙트란? 웹 사이트나 애플리케이션에서 이미지나 콘텐츠를 슬라이딩하여 화면에 전환하는 효과를 의미합니다. 슬라이드 이펙트는 다양한 형태로 표현될 수 있으며, 주로 이미지 갤러리, 배너, 광고 등에서 사용됩니다. 슬라이드 이펙트는 사용자가 웹 페이지를 더욱 동적으로 느끼게 하고, 시각적인 흥미를 유발하여 사용자 경험을 향상시키는 효과를 가지고 있습니다. 또한, 슬라이드 이펙트는 화면 전환 시 부드러운 애니메이션을 제공하여 사용자가 불편함을 느끼지 않도록 도와줍니다. 주로 사용되는 슬라이드 이펙트에는 수평 슬라이드, 수직 슬라이드, 페이드 인/아웃, 카드 슬라이드, 돌리기, 점진적 슬라이드 등이 있습니다. 이러한 슬라이드 이펙트는 CSS와 JavaScript를 사용하여 구현할 수 있으며, 라이브러리나..

자바스크립트 퀴즈(Quiz) 사이트 만들기 이번에 만들어 본 퀴즈 사이트는 CBT 유형입니다. 전에 올린 퀴즈 사이트(7-1)에서 조금 보충한 내용들을 정리해보겠습니다. 퀴즈 사이트 추가 코드 💛기능사 시험 화이팅💛 정보처리기능사 2005년 2회 정보처리기능사 2005년 4회 정보처리기능사 2005년 5회 정보처리기능사 2006년 1회 정보처리기능사 2006년 2회 정보처리기능사 2006년 3회 정보처리기능사 2006년 5회 정보처리기능사 2007년 1회 정보처리기능사 2007년 2회 정보처리기능사 2007년 4회 정보처리기능사 2007년 5회 정보처리기능사 2008년 1회 정보처리기능사 2008년 2회 정보처리기능사 2008년 4회 정보처리기능사 2008년 5회 정보처리기능사 2009년 1회 정보처리기..

자바스크립트 퀴즈(Quiz) 사이트 만들기 이번에 만들어 본 퀴즈 사이트는 CBT 유형입니다. 전에 올린 퀴즈 사이트(7)에서 조금 보충한 내용들을 정리해보겠습니다. 시작하기 버튼을 눌러보세요! 퀴즈 사이트 추가 코드 💛기능사 시험 화이팅💛 정보처리기능사 2005년 2회 정보처리기능사 2005년 4회 정보처리기능사 2005년 5회 정보처리기능사 2006년 1회 정보처리기능사 2006년 2회 정보처리기능사 2006년 3회 정보처리기능사 2006년 5회 정보처리기능사 2007년 1회 정보처리기능사 2007년 2회 정보처리기능사 2007년 5회 정보처리기능사 2008년 1회 정보처리기능사 2008년 2회 정보처리기능사 2008년 4회 정보처리기능사 2008년 5회 정보처리기능사 2009년 1회 정보처리기능사 ..

자바스크립트 퀴즈(Quiz) 사이트 만들기 이번에 만들어 본 퀴즈 사이트는 CBT 유형입니다. 퀴즈 사이트 코드 Quiz CBT 유형 1 2 3 4 5 5-1 6 7 WD 2020년 1회 정보처리기능사 기출문제 59분 10초 제출하기 수험자 : 천설희 전체 문제수 : 60문항 남은 문제수 : 59문항 주석 부분! 중간에 주석처리가 되어있는 부분은 전에 썼던 퀴즈 이펙트(5)에서 했던 것처럼 스크립트 부분에서 반목문을 통해 문제의 수만큼 반복시켜 줄 부분이거나 계속 바뀌는 데이터로 스크립트를 통해 처리할 부분입니다. script 코드 이번에는 JSON 파일에서 문제와 보기를 가져오고 랜덤으로 섞어서 퀴즈를 만들어 보겠습니다. //선택자 const cbtQuiz = document.querySelector(..

자바스크립트 마무리 문제 (1) 이미지에 마우스 포인터를 올려 놓았을 때, 다른 이미지로 바뀌었다가 마우스 포인터를 다른 곳으로 이동하면 다시 원래 이미지로 바뀌는 소스를 작성해 보세요. 길라잡이 img 태그에는 id나 class가 없습니다. 태그 이름을 사용하거나 2개 이상의 선택지를 연결한 후 이미지를 가져와서 변수에 저장합니다. 마우스 포인터를 이미지의 위에 올려놓을 때는 mouseover 이벤트가, 마우스 포인터를 다른 곳으로 이동할 때는 mouseout 이벤트가 발생합니다. 이벤트가 발생했을 때 이미지의 src 속성값을 바꿉니다. 코드 우리집 강아지 귀여워 ocument.querySelector(".container .img")를 사용하여 HTML 문서의 이미지 요소를 선택합니다. 이 요소는 클..

자바스크립트 문자열 자바스크립트에서는 간단한 테스트를 처리하기 위해 문자열 유형을 자주 사용합니다. 이번 글에서는 자바스크립트에서 문자열을 다루는 방법에 대해 살펴보겠습니다. 원시 유형과 객체 단순히 값만 가지고 있을 경우에는 '원시 유형'이고 프로퍼티와 메서드를 가지고 있을 때는 '객체'라고 합니다. 그런데 사실 자바스크립트에서는 원시 유형이어도 프로퍼티와 메서드를 사용할 수 있습니다. 문자열을 만들 때 다음의 소스처럼 간단히 변수에 문자열을 할당한 후 length라는 프로퍼티를 사용하면, str 변수에 length라는 프로퍼티를 정의하지 않았는데도 length라는 프로퍼티를 사용할 수 있습니다. let str = "hello" str.length // 5 자바스크립트에서는 number와 boolean..