서론보기..



아래의 링크에서는 iframe 을 사용한 보다 구체적인 코드를 보여줍니다.
http://hi.baidu.com/qianhh/blog/item/982524cea0d99e33b600c880.html

먼저 iframe 하나를 준비 합니다.

<IFRAME style="DISPLAY: none; LEFT: 0px; POSITION: absolute; TOP: 0px" src="javascript:false;" frameBorder="0" scrolling="no"></IFRAME>

여기서 src 부분을 위와 같이 처리하면 iframe 이 페이지를 로드하기위한 시도를 하지 않는다고 합니다.(https 를 사용하는 경우 이렇게 하지 않으면 오류 메세지가 나온다)- 좋은 팁인듯..

위의 태그를 static  스트링으로 두고 insertAdjacentHTML() 를 사용해 삽입하는 것도 좋음.

그 다음,
iframe.style.top
iframe.style.left
iframe.style.width
iframe.style.height
iframe.style.zIndex
iframe.style.display
의 속성을 조정해 이 아이프레임 위에 div 를 위치시키는 것임.

그러면 windowed 레이어간 z-index 상위인 아이프레임은 위에 나타나게 되고, 아이프레임은 windowless 의 z-index 도 수용하므로 div z-index  가 더 상위라면 아이프레임 위에 보이게 된다....라는 꽁수

아마도 이부분을 jQuery 에서도 구현해 두었을 것 같다는 생각으로 검색해 보니...
이미 플로그인이 마련되어 있었다.

결국,

jQuery 플러그인
http://brandonaaron.net/code 의 bgiframe 을 사용하면 만사 오케이란 소리다.

이 것은 jquery UI 에 external 폴더에도 이미 들어가 있으며 jquery ui 에서 이미 사용되고 있다.
jquery.bgiframe.js 파일을 링크하고

$("#loginDlg").dialog({
   bgiframe: true,
   height: 240,
   modal: true,
   autoOpen:false
});

위 처럼 사용하면 되겠다.

------------- 추가 내용 --------------

위의 방법은 이상하게도 IE6 의 select 컨트롤만 대상으로 만들어진 듯 하다.
Active-x 에서는 원하는 결과대로 나오지 않는다.

js 파일을 까보니 역시나 IE7 이상에서는 iframe 을 생성하지 않는다.
따라서 js 파일을 수정후 강제로 iframe 의 사이즈를 조정해보니 active-x 위에는 올라가기는 하지만 오버레이의 border 가 안보인다....

다른 방법을 찾다가...
http://jquery.malsup.com/block/#element jquery blockUI 란 놈을 찾았다.
테스트 해보니 잘된다.
특정영역에 active-x 가존재하고 그 위에 div 레이어를 올리려면 우선 위의 방법으로 active-x 를 block 시키고 그위에 div 를 올리는 방법을 쓰면 되겠다.

신고

댓글을 달아 주세요

  1. Favicon of http://www.morganjewelers.org/morganjewelers/morgan-jewelers-salt-lake-city.html BlogIcon morgan jewelers salt lake city 2011.05.22 02:11 신고 Address Modify/Delete Reply

    당신에게 자신의 지식에 대한 감사, 감사 내가 새로운 지식을 많이 찾을 수 있습니다. 다시 한번 감사드립니다. 너도 내 사이트를 방문하시기 바랍니다

 $("#accordion").bind('accordionchange', function(event, ui) {
              alert($(this).find("h3").index(ui.newHeader[0]));
               
            });
한참 찾았다...
신고

댓글을 달아 주세요

티스토리 툴바