본문 바로가기

mouseenter2

2021-06-16 (65일차) 제이쿼리(jquery)의 본질, 자바스크립트와 제이쿼리 문법차이, 제이쿼리 장점, next, prev, mouseenter, this, dblclick parent, children, find, siblings 자바스크립트 54강~63강 - 기존에 사용하던 javascript의 문법 문제점 : css에서 일괄로 디자인을 처리하던 디자이너들이 이에 대해 불편함을 느낌 ↓ 해결방법 : 제이쿼리를 불러옴 ↓ .prev( ) : 인접 형을 가리킴 .next( ) : 인접 동생을 가리킴 .parent( ) : 부모를 가리킴 .children( ) : 자식을 가리킴 .find( ) : 후손을 가리킴 .siblings( ) : 형제을 가리킴 .mouseenter : 마우스가 닿으면 반응함 .dblclick : 더블클릭시 반응함 - 클릭하면 배경색 변경, 한 번 더 클릭시 배경색 제거 : if, else, hasClass 사용 - 클릭하면 클릭 구간의 좌우 배경색 변경 : next, pr.. 2021. 6. 17.
2021-06-03 (52일차) 자바스크립트 - mouseenter, mouseleave, addClass, removeClass, hasClass, 색상변경버튼, 좌측에서 이미지 들어오는 애니메이션 21강~25강 - alert('내용'); 실행되는지 확인할 때 자주 이용됨 - .mouseover과 .mouseout은 사용 비추천 - .mouseenter 마우스가 닿으면 실행 - .mouseleave 마우스가 닿았다가 떨어지는 순간 실행 - .addClass, .removeClass 클래스 추가, 클래스 제거 사용하는 이유 : 기존까지 배워왔던 방식은 자바스크립트에서 모두 다 해냈지만(css값을 주는 등…) 기존의 방식은 자바스크립트 코드가 길어지기 때문에 실무에서 잘 사용하지 않음 → css에서 class를 이용해 먼저 값을 준 후, 자바스크립트에서 실행시킴 - 실행값에 함수를 합쳐 쓰는 방법 기존에는 함수를 지정하고 실행값에 함수를 넣어줬었다 하지만 함수 지정하지 않고 합쳐 쓸 수 있음 함수 이름.. 2021. 6. 5.

티스토리툴바