전체 글228 2021-08-24 (134일차)wiken.io 블로그 사용법, lodash, 마우스 움직임에 따라 흔들리는 개체 만들기 위켄사용법 1강~3강 자바스크립트와 제이쿼리 기초 102강 유용한 소스코드 17~19강 (필요할 때 보는 용도) - 마우스 움직임에 따라 흔들리는 개체 만들기 to2.kr/c37 에서 YzQzjNJ ... codepen.io jquery와 lodash 가져오기 스크립트 전부 가져오기 클래스에 mousemove-effect-1-el 넣어주기 텍스트라면 최소한 inline-block으로 만들어주기 (transform로 인해 움직이는 원리인데, inline에게는 통하지 않음) data-mousemove-effect1-hor-res="0.1" data-mousemove-effect1-ver-res="0.1" 을 태그 안에 넣어주기 ※ 여기서 hor은 가로, ver은 세로를 나타낸다. (0.1은 마우스가 움직이는.. 2021. 8. 26. 2021-08-23 (133일차) hover시 텍스트 변환, uppercase, impress사용방법 웹코딩 기초 172강 (hover시 텍스트 변경) impress 0강 - hover하면 한글이 영문으로 바뀌는 방법 한글을 없애지 않고 안 보이게 하는 게 tip! See the Pen to2.kr/bOC by minicoding (@minicoding) on CodePen. ※ text-transform:uppercase; : 영문을 모두 대문자로 바꿔주는 기능을 한다. - impress 사용방법 임프레스 스크립트소스 가져오기 스크립트에 impress().init(); 넣어주기 #impress 아이디로 감싸주기 ㄴ 태그 내부에 .step 클래스로 감싸고 data-x와 data-y로 위치지정하기 1 2 3 2021. 8. 26. 2021-08-22 (132일차) 포트폴리오 작업 - 포트폴리오 작업 ㄴ 스킬 부분 수정 ㄴ 어바웃미 부분 수정 2021. 8. 26. 2021-08-21 (131일차) 포트폴리오 작업 - 포트폴리오 작업 필름 일러스트 제작하기 프로세스 로고 버튼 만들기 2021. 8. 22. 2021-08-20 (130일차)포트폴리오 컨펌 - 포트폴리오 개인 컨펌 ㄴ 포트폴리오 = 나 자신을 소개하기 위해 만드는 것 ㄴ> 의미에 맞게 내 자신에 대한 의미를 더 추가할 것! - 컨셉 수정, 내 사진 넣기 2021. 8. 22. 2021-08-19 (129일차) stagger 활용, 텍스트효과 GSAP과 스크롤트리거 26~28강 (stagger 활용) - 한 글자씩 차례대로 올라오는 텍스트효과 : 텍스트를 span태그 두 개로 감싸기 : timeline() 사용하기 See the Pen by minicoding (@minicoding) on CodePen. - 한 글자씩 쳐지는 애니메이션 : css anmation 사용 See the Pen by minicoding (@minicoding) on CodePen. - 커서가 입력되는 텍스트 따라다니게 만들기 See the Pen by minicoding (@minicoding) on CodePen. 2021. 8. 21. 2021-08-18 (128일차) form (폼)형식, GSAP - stagger, fullpage 텍스트 애니메이션 자바스크립트와 제이쿼리 100강~101강 (form) GSAP과 스크롤트리거 25강 FULLPAGE 15강 웹디자인 기능사 8강~10강 (서브메뉴) (따로 정리) 내부의 각 입력요소 - : 여러가지의 유형이 있다. ex) https://www.w3schools.com/tags/tag_input.asp : type에 number을 부여할 시, input창을 클릭하면 숫자키패드가 나온다. * readonly 옵션을 넣으면, 읽기전용 창으로 바뀐다. - : input과 다르게 2줄 이상 쓸 수 있다. : 너비, 높이 조절이 가능하다 ex) - : 기본적으로 아래로 옵션이 내려온다. (내려올 공간이 없으면 저절로 위로 올라온다.) selected : 초기에 선택되어 있게 해주는 옵션 disabled : 선택이 .. 2021. 8. 20. 2021-08-17 (127일차) 이메일 발송 폼(FORM), formspree 사용방법 자바스크립트와 제이쿼리 99강 (이메일 발송 폼) https://codepen.io/jangka44/pen/ZEKNxqZ formspree 사이트 주소 - 이메일 발송폼 만드는 방법 Formspree사이트 회원가입 후, 이메일 인증까지 완료 new form 클릭 form name : 포트폴리오 연락처 project : A NEW Project send emails to : 나의 이메일 주소 ↓ html 코드 복사해서 넣으면 끝 (label부분은 굳이 필요 X) - : ≒편지지 action="받는사람 주소" method="전송방식" (post 주로 사용) - : 한 줄 입력창 (닫는태그 X) type="작성방식" ex) text, email placeholder="초기에 입력되어있을 내용" autofocu.. 2021. 8. 19. 2021-08-16 (126일차) SVG LINE 애니메이션 자바스크립트와 제이쿼리 95강~98강 - SVG LINE 애니메이션 2021. 8. 19. 2021-08-15 (125일차)포폴 디자인 작업 중 - 포트폴리오 사이트 제작 중 2021. 8. 18. 2021-08-14 (124일차)포폴사이트 디자인, 유즈툴컴퍼니 모작 - 포트폴리오 사이트 제작 중 - 유즈툴컴퍼니 모작 이어서 해보기 - wiken.io 블로그 작성 2021. 8. 15. 2021-08-13 (123일차)images downloader, 이미지 저장하는 방법 웹코딩 170강~171강 (부분모작 자료를 저장하는 방법) - 부분모작 자료를 저장하는 방법 chorm images downloader 확장프로그램 다운로드 필요로 하는 해당 사이트에 가서 클릭 doc폴더를 만든 후 사진 넣기 깃허브 리포지터리 생성 Add a README file ■ 체크 settings > pages > master, docx > save 리포지터리 메인화면 Add file > upload files클릭 > doc폴더 끌어다 놓기 > commit changes 여기서 이미지를 링크로 가져다가 쓰기! (느리다는 단점이 있음, but 해결책 다른 주소로 사용하기)(아직 설명x) 2021. 8. 15. 이전 1 ··· 3 4 5 6 7 8 9 ··· 19 다음
