본문 바로가기

iframe

(14)
모바일 기기에서 iframe 없이 youtube 영상 자동재생 유튜브 정책에 의해, 자동 재생(autoplay) 은 묵음(무음, mute) 상태에서만 가능. 기본 세팅은, 썸네일을 클릭했을 때 재생되면서 음원도 들리는 방식. 유튜브 사이트가 아니라, 내 사이트에 유튜브 영상을 embed 하면서, 화면이 열릴 때 바로 재생(play) 가 되게 하려면.. 상기와 같이 iframe 을 사용하면서 autoplay=1&mute=1 이라고 세팅하면 되는데.. PC 에서는 잘 되지만, 모바일 기기에서는 작동하지 않아요. 사실은, iOS 가 들어간 모바일 기기에선 작동하고, Android 가 들어간 모바일 기기에선 작동하지 않는거. 자, 여기서 부터가 오늘 이야기 하려는 내용. 모바일 기기(iOS 와 Android 모두)에서도 작동하게 하려면 YouTubeIframeAPI 를 사..
iframe 안에서 실행하고 화면 전환시, 크롬에서 문제 a.jsp 에 기술된 iframe 을 target 으로 b.jsp 를 실행하고 c.jsp 로 화면전환이 되는 프로세스일 때, 크롬에서는 약간의 문제가 있음.. a.jsp 에 아래와 같이 기술.. ... 첫번째 두번째 ... ... b.jsp 에 아래와 같이 기술.. ... 상기와 같이 세팅된 경우.. IE 에서는 target 을 ifrm 으로 하고 href 를 b.jsp 로 하는 첫번째 링크나 funcA() 를 실행하는 두번째 링크나 동일하게 생각한 대로 작동하는데.. 크롬의 경우.. target 으로 .jsp 를 호출하게 했더니, b.jsp 에 기술된 alert('메시지') 가 아무것도 없는 빈 화면에서 알림으로 뜨고.. funcA() 를 호출하게 했더니, IE 와 마찬가지로 a.jsp 화면이 그대로 ..
iOS 에서 'tel:전화번호' 가 작동하지 않으면? iOS 인데,- 사파리에선 href="tel:전화번호' 가 작동하고- 웹뷰를 가지고 있는 앱에선 작동하지 않음. 이리저리 확인해 보니, https://blog.naver.com/kilmmk/221382693516iframe 안에서 href="tel:전화번호' 가 작동하지 않아서target="_parent" 를 추가하니 정상 작동한다는 얘기는 있지만.. 지금은 iframe 이 아니라 이미지 맵을 사용했던 것.이미지 맵의 area 태그에 target="_parent" 속성을 추가 해도 iframe 관계가 아니다 보니 작동 않음. 그래서, 이미지 맵에서는 작동하지 않는 것으로 최종 진단.이미지를 조각낸 다음, 로 했더니,아이폰에서 전화 앱이 정상적으로 호출됨.
iframe 안에서 iframe 밖의 요소를 활용하는 방법 a.jsp 에는 아래와 같은 내용이 포함되어 있고,... b.jsp 에서 a.jsp 에 있는 idA 의 어떤 요소를 활용하려고 할 때..(물론, 동일 Domain.) top.$('#아이디') 와 같이 사용.
자바스크립트로 이미지 다운로드 여기저기 어렵게 찾았네요.. function downloadImage(imageUrl,fName){ if(/msie|trident/i.test(navigator.userAgent)){ // IE 인지 체크 var _window = window.open(imageUrl, '_blank');// 새창으로 열어서.. _window.document.close(); _window.document.execCommand('SaveAs', true, fName);// 저장하라, false 로 해도 동일 _window.close();// 끝나면 새창 닫음 }else{ var $a = $("").attr("href", imageUrl).attr("download", fName).appendTo("body");// HTML..
다른 도메인의 iframe 밖에서 iframe 사이즈 (특히 height 값) 조정하기 A 에서 B 를 iframe 으로 가져와서 보여 주어야 할 경우.. height 값을 조정하여 iframe 을 리사이즈 할 경우가 있다.그런데, A 와 B 가 서로 같은 도메인 안에 있다면 상관이 없지만 다른 도메인이라면 웹브라우저가 이를 허용하지 않는다. 이럴 때 두가지 해경 방법이 있겠는데.. 1. A 쪽에서 B 를 URLConnection 하고 가져와서 A1 에 담고, A1 을 A 에서 iframe 안에 사용하는 방법 A1 의 내용은 다른 도메인 B 를 담고 있지만, A1 자체는 A 쪽 도메인에 존재하기 때문에 iframe 사이즈를 조정하는데 아무 문제가 없다. 다만 이때, 파라미터 처리를 해야 하는 경우 고민을 해야 한다. 특히 B 에 탭메뉴가 있고 파라미터까지 관련된다면 난해해 진다. A 의 i..
크롬 Chrome 웹브라우저에서 플래시 Flash 를 2개 이상 사용시 정상적으로 보이려면.. iframe 을 사용하는 방법 밖에는 없네요..투명한 플래시를 겹쳐 사용하는 경우, iframe 도 투명하게 세팅하면 됩니다. ~. 그런데, 황당한 것은.. 크롬도 어떤 때는 iframe 없이 한 화면에 여러개의 플래시를 사용해도 멀쩡히 잘 나올 때가 있다는 겁니다.그리고, 어느 순간 또 제대로 안 나오고.. 이거 PC 가 이상한 것인지, 크롬 마이너 업데이트를 통해 코드가 약간씩 바뀌는 것인지.. ㅠ. 기본이 되는 플래시는 a.jsp 에 담고,a.jsp 안에 iframe 코드를 b.jsp, c.jsp 등으로 포함시켜서,b.jsp 나 c.jsp 에는 다시 플래시 코드를 넣고.. 이렇게 하면 2개 이상도 크롬에서 정상적으로 보입니다. ~. 플래시에 링크가 걸리는 경우, top.location.href 을 ..
iframe 안에 정의된 자바스크립트 변수를 iframe 밖에서 jQuery 로 접근하는 방법, contentWindow A.html 안에 아래와 같이 iframe 이 존재하고, B.html 안에는 아래와 같이 자바스크립트 변수가 존재할때.. A.html 안에서 jQuery 를 사용하여 B.html 안에 있는 변수를 가져다 쓰려면 어떻게 해야 할까요..?이런 경우.. contentWindow 라는 넘을 사용합니다.A.html 안에서 $('#iframe1').get(0).contentWindow.var1; 그런데 문제가 있네요.. IE10 에서는 $('...').get(0) 가 작동하지 않으니..이거, jQuery 버전이 달라지면 해결이 되는 것인지 모르겠네요. jQuery 1.5 에선 작동하지 않아요, IE 10 에서.. ㅠ.