본문 바로가기

반응형

iframe

아이폰에서 iframe 내용에 스크롤이 되지 않을때. 아이폰으로 모바일웹을 사용하는대 필요에 의해서 iframe 을 넣어서 사용하였다. 그런대 iframe 내용이 길게 되어 스크롤이 되어야하는대 parent 때문인지 스크롤이 되지 않아 밑부분을 볼수가 없다. 안드로이드 폰이나 pc 에서 확인하면 정상적인대... 문제를 해결하고자 구글링을 하다가 다음과 같은 해결책을 발견하였다. Place your s in wrappers with -webkit-overflow-scrolling: touch; iframe 을 감싸고 -webkit-overflow-scrolling: touch; 스타일을 주는것이다. #outside { height: 400px; width: 200px; background: blue; overflow: scroll; } .space { hei.. 더보기
워드프레스를 iframe 으로 불러서 사용시 로그인이 되지 않는 문제 워드프레스를 어떠한 이유로 iframe 으로 불러서 사용하는경우가 있다. 하지만 login 을 하려해도 오류가 발생해서 되지 않는다. Refused to display 'https://www.wordpress.com/wp-login.php' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'. 그럴때 해결방법은 By default WordPress sends an HTTP header to prevent iframe embedding on /wp_admin/ and /wp-login.php: X-Frame-Options: SAMEORIGIN That's a security feature. If you want to remove this header .. 더보기
고도몰에서 추가페이지를 iframe 로 사용시 주의사항 고도몰 작업시 추가 페이지를 사용하는경우가 있다. 어떤경우는 이 추가 페이지를 iframe 으로 내용중에 넣게 되는대 이게 큰 문제 없다 생각했는대 모바일 버전을 보다가 pc버전 보기를 눌렀을때 일부 스마트폰에서 문제가 발생했다. Template_Error #1 cannot find defined template ..... 경로명..... 에러 메세지는 위와 같다. 경로명을 잘 보면 skin 경로가 모바일 skin 경로를 표시하고있다. 모바일에서 pc 버전 보기할때 파라메터값이 ?pc 가 붙는대 이걸 이용해서 ..../proc/추가페이지명.htm&pc 로 해주면 해결된다. pc 버전에서만 사용하던 iframe 이니 끝에 &pc 를 강제로 붙여 두어도 문제 없다. 더보기
jquery 으로 iframe 내용에 접근하기 iframe 내에 있는 항목등을 접근하여 값을 가져온다거나 값을 주어야 할 경우가 있다. 요즘은 jquery 를 많이 사용하다 보니 jquery 로 접근하여 사용하면 편리할거 같은대 iframe 을 selector 로 해도 동작하지 않았다. 찾아보다 다음과 같은 방법으로 접근해보니 정상동작하였다. iframe 은 $('iframe[src="sample.htm"]') 이나 $('iframe[name="iframename"]') 등으로 선택하고 $('iframe[src="sample.htm"]').contents() 으로 iframe 내부에 접근한다. 그다음은 $('iframe[src="sample.htm"]').contents().find("body") 처럼 하면 된다. 나의 경우는 iframe 안에 또 .. 더보기
Jquery fancybox 사용시 iframe type 에서 post 로 값 넘기기 fancybox 사용시 iframe type 으로 사용하면 해당 href 에 있는 주소로 get 방식으로 페이지를 불러온다. 하지만 post 방식으로 값을 넘겨서 페이지를 불러와야할 경우가 발생했는대 구글링을 통해서 방법을 찾을수있었다. 출처는 http://stackoverflow.com/questions/14316054/post-preview-passing-data-with-ajax-and-fancybox 방법은 POST preview with ajax API option REF: http://stackoverflow.com/q/14316054/1055987picssel.com /> Name: Password: Preview NOTE: This DEMO is for Fancybox v2.1.3+ 데모 .. 더보기
jQuery Plugin For Auto Resizing iFrame - iFrame Resizer 아이프레임 리사이즈 아이프레임으로 컨텐츠를 관리할때 아이프레임 사이즈가 수시로 변하기때문에 resize를 해주어야 하는대 구글링을 통해서 쓸만한 jQuery Plugin 을 찾았다. 부모창에는 아이프레임에 들어가는 페이지에는 하단부분에 을 넣어준다. 출처 : http://www.jqueryscript.net/layout/jQuery-Plugin-For-Auto-Resizing-iFrame-iFrame-Resizer.html 더보기
php iframe check 호출되는 페이지가 아이프레임인지 아닌지 확인할 방법이 필요한대 javascript 로는 확인이 가능한대 php 로는 어떻게 해야 하는지 궁리해보니 $_SERVER['HTTP_REFERER'] 이 값을 이용하면 된다. iframe 으로 불려질때 $_SERVER['HTTP_REFERER'] 값이 parent 창에 주소값을 가진다. 이 값이 있다고 iframe 인건 아니지만 $_SERVER['HTTP_REFERER'] 값이 없다면 iframe 이 아닌것은 확인이 된다. 아이프레임으로 호출된게 아니라면 처리하게끔 할때 if($_SERVER['HTTP_REFERER']==""){ // HTTP_REFERER 값이 없다면 직접 주소창에서 접근한것이다. (iframe 아님) header('Location: /pare.. 더보기
jquery 로 opener, iframe 간 객체 접근방법 jquery 로 작업시 팝업이나 프래임에서도 객체들을 사용하고 싶은경우가 있는대 그 방법은 다음과 같다. $("#ID",opener.document).val(); $("#ID",parent.document).val(); 더보기
iframe 투명하게 처리 1. iframe 태그에 allowtransparency="true" iframe 문서의 body 태그에 2. style="background-color:transparent" 적용해준다 이렇게 처리하면 부모창에 배경이미지가 있을때도 iframe 에서 자연스럽게 끊기지 않고 나온다. 더보기

반응형