JavaScript/Effect34 슬라이드 이펙트 첫번째 - 이미지 보여주기 슬라이더 이펙트 이번 슬라이더 이펙트는 img 파일의 스타일을 opacity 1 과 opacity 0 을 이용하여 하나씩 봅니다. 선택 자를 이용하여 slider__wrap, slider__img, slider 을 불러와 slider 의 마지막 이 올경우 다시 첫번째 이미지를 보여주게됩니다. 마지막으로 화면안에 소스보기를 통한 소스를 볼수있습니다. 원본 소스 보기 원본 사이트 보기 2022. 8. 29. 퀴즈 이펙트 여섯 번재 웹디자인 기능사 퀴즈 풀기 웹 디자인 기능사 필기 기출문제를 JS를 이용해서 간단한 퀴즈 프로그램을 만들었습니다. 퀴즈의 답을 입력하고 정답 확인하기 버튼을 누르면 답이 나타나게 됩니다. 원본 소스 보기 원본 사이트 보기 1.js 코드 CSS는 앞서 마크업한 HTML 코드를 디자인및 js동작할때 태그에 추가할 class를 만듭니다. 코드 보기 //문제정보 const quizInfo = [ { answerType: "웹디자인기능사 기출문제 2016년 1회", answerNum: 1, answerAsk: "다음 중 디자인의 조건에 해당하지 않는 것은?", answerChoice: [ "대칭", "점증", "반복", "강조" ], answerResult: "대칭", answerEx: "디자인의 원리 : 균형,.. 2022. 8. 24. 퀴즈이펙트 다섯 번쨰 웹디자인 기능사 퀴즈 풀기 웹 디자인 기능사 필기 기출문제를 JS를 이용해서 간단한 퀴즈 프로그램을 만들었습니다. 퀴즈의 답을 입력하고 마지막에 정답 확인하기 버튼을 누르면 답이 나타나게 됩니다. 원본 소스 보기 원본 사이트 보기 1.js 코드 CSS는 앞서 마크업한 HTML 코드를 디자인및 js동작할때 태그에 추가할 class를 만듭니다. 코드 보기 //문제정보 const quizInfo = [ { answerType: "웹디자인기능사 기출문제 2016년 1회", answerNum: 1, answerAsk: "다음 중 디자인의 조건에 해당하지 않는 것은?", answerChoice: { 1: "대칭", 2: "점증", 3: "반복", 4: "강조" }, answerResult: "1", answerEx.. 2022. 8. 24. 검색 이펙트 세번째 검색 이펙트 html 태그, css 속성, javascript 의 메서드 를 검색하여 찾아볼수있습니다. 원본 사이트 보기 원본 소스 보기 1.HTML 코드 HTML에서 js를 동작하기위한 class이름과 input등을 적절히 사용하여 사용자가 알아보기쉽게 표현해야합니다. 코드 보기 charAt()()를 이용하여 CSS 속성 검색하기 CSS 속성 첫글자 검색하기 a b c d e f g h i j k l m o p q r s t u v w x y z 속성 갯수 : accent-color : 특정 요소에 색상을 지정할 때 사용됩니다. align-content : 콘텐츠 아이템의 상하관계 정렬 상태를 설정합니다. align-items : 콘텐츠 아이템의 내부 상하관계 정렬 상태를 설정합니다. align-sel.. 2022. 8. 22. 검색 이펙트 두번째 검색 이펙트 html 태그, css 속성, javascript 의 메서드 를 검색하여 찾아볼수있습니다. 원본 사이트 보기 원본 소스 보기 1.HTML 코드 HTML에서 js를 동작하기위한 class이름과 input등을 적절히 사용하여 사용자가 알아보기쉽게 표현해야합니다. 코드 보기 indexOf()를 이용하여 CSS 속성 검색하기 CSS 속성 검색하기 검색하기 플렉스, 애니메이션, 백그라운드 기타 등등 유형 별로 검색해보세요! 전체 속성 갯수 : 0 accent-color : 특정 요소에 색상을 지정할 때 사용됩니다. align-content : 콘텐츠 아이템의 상하관계 정렬 상태를 설정합니다. align-items : 콘텐츠 아이템의 내부 상하관계 정렬 상태를 설정합니다. align-self : 개별적.. 2022. 8. 17. 검색 이펙트 첫 번째 검색 이펙트 html 태그, css 속성, javascript 의 메서드 를 검색하여 찾아볼수있습니다. 원본 소스 보기 1.HTML 코드 HTML에서 js를 동작하기위한 class이름과 input등을 적절히 사용하여 사용자가 알아보기쉽게 표현해야합니다. 코드 보기 indexOf()를 이용하여 CSS 속성 검색하기 CSS 속성 검색하기 검색하기 속성 갯수 : 0 accent-color : 특정 요소에 색상을 지정할 때 사용됩니다. align-content : 콘텐츠 아이템의 상하관계 정렬 상태를 설정합니다. align-items : 콘텐츠 아이템의 내부 상하관계 정렬 상태를 설정합니다. align-self : 개별적인 콘텐츠 아이템의 정렬 상태를 설정합니다. all : 요소의 속성을 초기화 또는 상속을 설.. 2022. 8. 16. 이전 1 2 3 4 5 6 다음 728x90 반응형
