목록으로

css 질문 채택완료

bonobono 8년 전 조회 3,351

크롬기준입니다

#div {width: 200px;height: 200px;background: red;opacity: 0;transition: 1s}

#div:hover {opacity: 1}

위처럼 마크업시 #div에 마우스를 올리면 #div가 서서히 보이고 떠나면 서서히 사라집니다.

그런데 페이지를 방문하거나 새로고침시에 마우스를 hover 하지 않아도 빨간상자가 보였다가 서서히 사라집니다. 어찌보면 당연한 동작이겠지만.. 제가원하는건 아닙니다

눈치채셨겠지만 hover하면 서서히 나타나고 떠나면 서서히 사라지는 기능은 유지하면서 새로고침하여도 아에 안보였으면 합니다. 도움부탁드립니다

#css3

댓글을 작성하려면 로그인이 필요합니다.

정렬:

딸기케익

8년 전

#div {

opacity: 0;

}

#div:hover {

opacity:1;

-webkit-transition: all 1s ease-in-out;

-moz-transition: all 1s ease-in-out;

-o-transition: all 1s ease-in-out;

transition: all 1s ease-in-out;

}

로그인 후 평가할 수 있습니다

bonobono

8년 전

이렇게하면 마우스가 떠나면 서서히 사라지지 않고 바로사라집니다.

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.