부모 div 위에 떠 다니는 이미지

부모 div 위에 (hover) 이미지를 넣으려고합니다. 나는 약간의 요구 사항이 있지만 www.cssplay.co.uk/menu/magnify.html의 이전 버전을 사용합니다.부모 div 위에 떠 다니는 이미지

이전 사이트에서 이전에 원하는 내용을 달성하는 방법을 찾았습니다.>http://www.keurslagergeertenkristel.be/. 가운데에는 왼쪽에 검은 색/흰색 사진과 분홍색/보르도 색조 및 일부 텍스트가 포함 된 그림이 표시됩니다. 커서를 가져 가면 사진이 확대되어 제대로 볼 수 있습니다 (작은 화면 해상도 문제 일 수도 있지만 지금은 문제가 아님)

동일한 작업을 수행하려고합니다. 다시 새로운 사이트에서 구축하고 있지만 제대로 작동하지 않습니다. 이미지 항상은 상위 div에 있습니다. 여기에서 확인할 수 있습니다 =>http://www.vermeulenklasseslager.be/NEW/.

두 웹 사이트의 이미지 CSS는 동일하므로 부모 div가있는 것 같지만 볼 수는 없습니다. 블록의 총수 : (상위의 div) 상대적 오버플 :

제가 디스플레이를 사용하여, 변형을 많이 시도 Z- 인덱스를 추가하는 추가 된 div 또는 스팬을 추가 숨겨진 자동 ...

UPDATE : 나는 IE11에서의 문제점들을 단지 발견했다. (느릅 나무는 내가 더 적은 이해하게하는 이유, 최초의 웹 사이트는 모든 브라우저에서 작동하기 때문에)

출처

2014-01-13 diedie2

에 즉 10/11 그것은 content div의 border-radius 속성으로 인해 큰 이미지를 자릅니다. 해결 방법은 오버플로를 제거하는 것입니다. 표준 clearfix를 사용하여이 컨테이너를 숨기고 지 웁니다.

#content:before, 
#content:after { 
    content: ""; 
    display: table; 
} 
#content:after { 
    clear: both; 
} 
#content { 
    zoom: 1; 
}

출처

2014-01-13 12:20:32

감사합니다, 오버플로 제거 : 숨겨진 트릭을! 나는 다른 코드가 필요하지 않았다. 게다가, 다른 사이트에서도 경계선 반경을 사용했는데 거기에는 문제가 없었습니다. – diedie2

그의 해결책이 생각 :

위치 : 고정

출처

2014-01-13 10:23:26 user2211216

도움이되었습니다. 비록 그것이 여전히 동일한 코드로 새로운 웹 사이트가 아닌 첫 번째 웹 사이트에서 작동하는지 이해할 수는 없지만. 이제 마우스를 가져 가면 원본 작은 그림이 몇 픽셀 아래로 떨어지고 마우스가 떠날 때 위로 돌아갑니다. 이것이 방지 될 수 있습니까? – diedie2

업데이트 : 첫 번째 게시물 확인 – diedie2

부모 div 위에 떠 다니는 이미지

답변

관련 문제