Q

CSS : 호버 기능이 작동하지 않습니다.

css

2014-09-24 2 views 2 likes

2

CSS를 사용하여 웹 페이지에 이미지를 추가하려고합니다. 문제는 내가 이미지의 오른쪽을 보여주는 호버 기능을 만들었다는 것입니다. 이것은 작동하지만 position : relative 또는 z-index : -1을 추가하면 호버 기능이 작동하지 않습니다. 0보다 지수가 낮은 가져가없는 위치 또는 Z-CSS : 호버 기능이 작동하지 않습니다.

감사

http://jsfiddle.net/L5rvkt2g/

#logo { 
     background: url(http://upload.wikimedia.org/wikipedia/commons/b/b9/1875_CC_double_eagle.jpg); 
     width: 956px; 
     height: 884px; 
     background-position: left; 
     margin: auto; 
     position: relative; 
     z-index: -1; 
    } 

     #logo:hover { 
      background-position: right; 
     }

2014-09-24 Ravi

+0

-1을 사용해야합니까? 정상적인 지수로 유지할 수 없으면 무엇이든지 올릴 필요가 있습니까? – Luke

A

답변

1

문제는 마우스로 z-index: -1;에 관한 것입니다을 복용하지 않고이 문제를 해결 어떠한 방법은이 있나요 마우스를 올리면 작동하지 않습니다. 그것을 제거하면 잘 작동합니다!

2014-09-24 15:19:12

+0

부끄러운 말로 대답. '마우스가 인덱스 0에있다'는 것은 무엇을 의미합니까? – Adam

+0

@ Adam이 나에게 의미가있었습니다. – canon

+0

@Adam이게 더 나은가요? –

0

하위 레이어는 상위 레이어로 덮여 있기 때문에 숨길 수 없습니다.

그냥 버스에 앉아있는 창문이 두 개 있는데, 창 밖에서 손을 흔들기를 원합니다. 하나의 창에는 유리가 있고 다른 창에는 유리가 없으므로 유리를 열지 않고 손을 흔들 수 없습니다. 즉, 상위 레이어가 숨어지기 위해 막혔습니다.

요소를 위와 같이 가져 오십시오.

2014-09-24 15:19:17

0

#logo에서 z-index을 제거해야하며 코드는 매력처럼 작동합니다. 다음은 working fiddle입니다. 이는 img의 index이 0임을 확인하기 위해 실제로 #logo에 마우스를 올려 놓을 수 있습니다.

2014-09-24 15:24:11 Benjamin

관련 문제