"슬라이더이펙트 07" : 이미지 슬라이드((버튼, 닷메뉴, 플레이 버튼, 정지 버튼, 자동 플레이)
🎞 슬라이드 이펙트 - 이미지 슬라이드((버튼, 닷메뉴, 플레이 버튼, 정지 버튼, 자동 플레이) 📌 prev와 next 버튼을 이용하여 슬라이드를 좌우로 움직이는 동시에 밑에 닷메뉴도 이동하는데 무한으로 작동하는 슬라이드를 만들어봅시다! 📌 플레이하면 자동으로 플레이 되고 정지버튼을 통해 정지도 가능한 것이 특징합니다. 슬라이드 이펙트 - 이미지 슬라이드((버튼, 닷메뉴, 플레이 버튼, 정지 버튼, 자동 플레이) 효과 완성⭐️ 움직이는 슬라이드가 궁금하다면?💡 원본 소스보기 CSS 소스보기 HTML 코드 보기를 펼쳐 봐주세요 :) 헤더 부분은 이전 것과 동일하여 메인부분만 넣었습니다! 코드 보기 이미지1 이미지2 이미지3 이미지4 이미지5 prev next CSS 부분적인 CSS입니다. 전체적인 CSS..
2022. 10. 21.
"패럴랙스 이펙트 04" : 숫자, 사진, 글 다 움직이는 효과
🔮 패럴랙스 이펙트 - 숫자, 사진, 글 다 움직이는 효과 📌 이번 이펙트는 밑으로 스크롤하면 숫자, 사진, 글이 다 나타나는 효과입니다. ➰ HTML 컨텐츠, 컨텐츠 순번, 제목, 이미지, 설명 등의 구조를 짜줍니다. Javascript parallax sliderEffect04 패럴랙스 이펙트 - 숫자, 사진, 글 다 움직이는 효과 1 2 3 4 5 6 7 01 section1 오늘 할 수 있는 일에 전력을 다하라. 그러면 내일에는 한걸음 더 진보한다. 02 section2 게으르지 않음은 영원한 삶의 집이요, 게으름은 죽음의 집이다. 03 section3 우리는 행복하기 때문에 웃는게 아니라, 웃기 때문에 행복하다. 04 section4 인생은 가까이서 보면 비극, 멀리서 보면 희극이다. 05 se..
2022. 9. 19.
"퀴즈이펙트" Quiz 06 : 객관식(여러문제) 확인하기 : 슬라이드 형식
Quiz 06. 자바스크립트를 활용하여 웹디자인기능사 필기 2013년도 5회차 문제를 통해 객관식 여러문제 확인하기를 슬라이드 형식으로 만들어봅시다! 사이트 실제 보기 원본 소스보기 코드 참고 // 문제 정보 const quizInfo = [ { answerType: "웹디자인 기능사 2013년 05회", answerNum: "1", answerAsk: "디자인 형태의 개념에서 조화(harmony)를 이루는 법칙과 거리가 먼 것은?", answerChoice: [ "균형", "대비", "통일", "색상" ], answerResult: "색상", answerEx: "조화를 이루는 법칙은 균형, 대비, 통일, 유사, 균일, 강약, 변화가 있습니다." }, { answerType: "웹디자인 기능사 2013년..
2022. 8. 24.
