# hover

unu

리액트를 하면서 오랜만에 css를 했다.스타일링은 니꼬쌤이 클론 해보라고 보내준 behance의 웹디자인을 따라했다.따라하던 중 '아.. 이거 js로 따로 해야하나?' 싶었던 것이 아래 기능이었다.기능은 두가지 였는데1\. 각 메뉴에 hover하면 border-left

roghabo

hover 할 때 색을 바꿔야 할 때가 종종 생긴다.코드로 직접 구현한 도형은 css에서 적용하면 되지만 이미지로 받은 경우에는 다른 색의 이미지로 바꾸어 주어야 한다.onMouseOver, onMouseOut 함수를 사용하면 구현할 수 있다.Ex)

celline1637

hove와 opacity

chaton

Magical한 기능! state를 알아보자

leehangeul

airbnb를 만든 화면이다. 주된 컨텐츠 우측 상단 login_box 만들기 가운데 각 menubar의 title hover 작동 menubar의 hover 기능 && 클릭시 달력 동작 등 나머지 html 작업(사진 간격 등) 내가 완벽하게 하지 못한 작업

nooroong

모바일(터치 디바이스)에서는 마우스 커서가 없기 때문에 hover 효과를 줄 수 없다.PC에서처럼 css에 hover 효과를 넣게 되면 해당 요소를 두번 터치해야 원하는 동작을 얻을 수 있다. (한번 터치하면 hover 효과만 적용되고 동작하지 않음)특히 반응형 작업을

zhyun1220

이벤트 객체 모든 이벤트의 정보를 event 객체로 제공 속성 type target pageX, pageY screenX,screenY button : 눌러진 마우스 버튼 메소드 preventDefault() stopPropagation()

aepee

:가상 클래스 선택자

zhyun1220

박스의 크기 박스 너비 = 내용물(content)너비+왼쪽 패딩+오른쪽 패딩+왼쪽 CSS테두리 테두리 스타일(모양), 색상,두께,둥근 테두리 지정 가능 => 모서리별 다른 스타일,두께 가능 border스타일 지정해야 다른 속성 사용 가능 각 변 별로

sji7532

이전에 토요일만 수강하는 학원에서는 JS MDN을 사용하여 하기처럼 Mouse가 해당 이미지나 로고 등 선택한것에 mouserenter 했을때 색상을 변환하고 mouseleave 했을때 원래대로 돌아오도록 구현했었다. 하지만 아래에서 설명한것처럼 css의 hover를

aerirang647

:hovercss 의사 클래스는 사용자가 포인팅 장치를 사용해 상호작용 중인 요소를 뜻한다.쉽게는 사용자의 커서(마우스의 포인터)가 요소에 올라가 있을 때 적용된다.hover를 사용할 때 중요한 것은 다른 링크 의사 클래스가 덮어 쓸 수 있다는 것이다.:hover 의사