본문 바로가기

Web/카페24

[반응형 웹] Magnific Popup 팝업이미지가 가려질 때 해결법

반응형


 

 

오류 난 부분 :


‘x’ 닫기 부분이 header 부분 fixed 스타일에 의해 가려짐

 

 

 

 

오류 해결 :


‘x’ 닫기 부분이 header 부분 위로 올라와 보임!

 

 

 

해결 방법 :  style.css 파일 소스내에서


313 번줄 헤더 부분 z-index: 9991 -> z-index: 999 로 낮춰준다

/* HEADER STLYING */
.site-header {
  position: fixed;
  top: 0;
  display: block;
  padding: 33px 0;
  width: 100%;
  background-color: white;
  border-bottom: 2px solid #f3f3f3;
  z-index: 999;
}


1655 번줄 부분에 z-index: 1042; 보다 위에 헤더부분 z-index를 작게 고치면 됨!

/* Magnific Popup CSS */
.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1042;
  overflow: hidden;
  position: fixed;
  background: #0b0b0b;
  opacity: 0.8;
  filter: alpha(opacity=80);
}
 

반응형

위로 가기