My Melody Kawaii

마우스효과 2

자바스크립트 문제 풀이

자바스크립트 문제 풀이 자바스크립트를 사용해서 사진에서 마우스를 움직이면 사진이 바뀌는 효과와 버튼을 누르면 메뉴가 뜨는 문제를 풀이했습니다. 마무리문제 1 풀이 div 에 class로 wrap을 주고 난 후에 이미지 파일을 올려 두었습니다. const로 변수를 선언해서 선택자로 .wrap img를 선택했습니다. addEventListener를 사용해서 mouseover 효과를 준 후 선택자에서 mouse를 선택해서 img안에 src를 불러오고 이미지를 넣어두었습니다. mouseout도 mouseover와 동일하게 코드 진행을 하였습니다. 마무리문제 2 🦋 Javascript Typerscript Node.js 풀이 body에 button과 nav안에 ul,li태그를 사용해서 버튼과 메뉴안에 들어갈 리스..

마우스가 더욱 부드럽게 움직일 수 있게 만들어보자!

마우스 이펙트 효과 두번째 이번 시간에는 GSAP를 사용해서 마우스가 부드럽게 따라다니는 효과를 주도록 하겠습니다. 첫번째 효과에서 마우스의 움직임이 부드럽지 못했는데 이번 효과 에서는 더욱 부드럽게 사용하기 위해서 라이브러리 효과 GSAP를 사용해보도록 하겠습니다. 두번째 효과에서 사용해보자! 데이터저장하기 : 변수 데이터 실행하기 : 함수, 화살표 함수 데이터 불러오기 : for(), forEach() 이벤트 객체 : mousemove,mouseenter,mouseleave 요소 객체 : querySelector 라이브러리 : GSAP: to() HTML Javascript mouseEffect02 마우스 이펙트 -마우스 따라다니기 1 2 3 4 5 6 love what you have. 가진것을 사..