ImFe's study

[WEB] <iframe> 태그를 화면에 보이지 않게 하는법 본문

WEB

[WEB] <iframe> 태그를 화면에 보이지 않게 하는법

ImFe 2022. 2. 22. 07:00

보통은

1. width, height값을 0으로 준다

2. display:none;

의 방법을 사용한다.

 

 

1번의 경우 지난번 프로젝트에서 사용한 방법인데(서버에 유저가 입력한 값 저장하기 위해 통신),

통신이 정상적으로 이루어져 값이 저장됐다면 특정 이미지를 화면에 꽉 채우려 했다.
그런데 top:0; left:0값을 줘도 꽉 차지 않고, 공백이 발생했었는데.. 우악스럽게 CSS를 짜서 어찌저찌 넘겼다.

 

 

2번의 경우는(크롬 브라우저 기준) iframe에 속성이 적용되지 않는다.

엄밀히 말하면 적용이 안되는 것이 아니라, 

iframe 표시를 위해 html코드가 생성되는데, 여기에 display:none;을 추가하는것 보단

가리고 싶은 태그에 visibility:hidden 속성을 추가하는것이 훨씬 간단하다.

Comments