배경에 캡션 호버 효과를 적용하는 방법은 무엇입니까?

저는 현재 텍스트 위에 호버 효과를 추가하려는 웹 사이트의 배경 작업을하고 있습니다. CSS 스타일 시트에 배경 이미지가 있고 마우스를 움직이는 데 어려움을 겪고있는 문제를 발견했습니다.배경에 캡션 호버 효과를 적용하는 방법은 무엇입니까?

this 및 this one과 같은 호버 효과에 대한 좋은 자료를 발견했습니다. github에있는 것은 꽤 멋지지만 j 쿼리에 대해 잘 알지 못하기 때문에 기본 쿼리를 계속 사용하겠습니다.

여기 CSS의 내 배경 코드입니다. 질문은 어떻게 여기에서 호버를 구현합니까?

.wrapper:hover 
{ 
    /* whatever styles you want */ 
}

는 지금까지 내가 아는 한, 당신이 몸에 의사 선택을 넣을 수 없습니다 :

body { 
min-width: 800px; 
margin: 0px 0px 0px 0px; 
border-left: 50px solid #000000; 
background: #FF7F66 url('images/landscape1.jpg') no-repeat center center fixed; 
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover; 
background-size: cover; 
color: #666666; 
font: 10px Verdana; 
}

출처

2013-10-11 Brian Lam

'body : hover {/ * styles * /}'를 시도해 보셨습니까? – Oriol

http://ricostacruz.com/jquery.transit/와 비슷한 것을 만들 수 있습니다. –

@Oriol 아니요, 실제로 어떻게 시작해야할지 모르겠습니다. 텍스트로 가져 오는 것과 같은 방법입니까? –

은 단순히 CSS는 사이비 선택기를 사용합니다. 다음과 비슷한 래퍼를 사용해야합니다 : http://jsfiddle.net/wyehq/

출처

2013-10-11 22:48:16

Chris에게 감사합니다. –

물론 몸에 의사 선택기를 사용할 수도 있습니다. 왜 안돼? – Oriol

: hover psuedo 클래스를 Chrome에서 본문과 함께 사용할 수 없었습니다. 아마도 지원되지 않을 수 있습니다. –

배경에 캡션 호버 효과를 적용하는 방법은 무엇입니까?

답변

관련 문제