Jiimy publisher hoping to become a developer

hover 이벤트의 3가지 방법

2018-03-29

작성중…
css
  1. markup 상에서 2가지의 이미지를 주고 hover시 opacity:0;

    See the Pen markup에서 2가지 이미지. hover시 opactiy:0 by rudwnok (@rudwnok) on CodePen.

  2. markup 상에서 1가지의 이미지를 주고 hover시 bg:img

    See the Pen markup 상에서 1가지의 이미지를 주고 hover시 bg:img by rudwnok (@rudwnok) on CodePen.

  • 위 두가지의 차이점은 1.번의 경우 css가 좀더 길어지나 markup에서 class로 인해 markup만으로도 오버 이미지안지 판별이 가능하다. = 굳이 사용자에게 오버시 이미지도 같이 보여줄 필요가 없는거 같다.
jquery
  1. markup 상에서 인라인 mouseover, mouseleave 속성
    • 인라인상으로 넣게 되면 사용자에게 이 부분에 이벤트가 들어가는걸 보여줄수있지만. 비 권장사항이다.
  2. script 파일 상에서 mouseove, mouseleave 속성
    • 인라인속성으로 이벤트를 넣는건 비추천이다. css상으로 할수있는건 css로 하자.

상위 글 - git명령어 & node

Content