테스트 사이트 - 개발 중인 베타 버전입니다

다음지도 검색처럼 레이어 띄우고 IFRAME 불러오는 예제 채택완료

PIREE 9년 전 조회 6,785

안녕하세요.

제가 JQUERY 복잡한건 약해서 종종 어려움을 겪네요.

 

제가 하려는건 다음주소 검색처럼

버튼을 누르면 레이어가 뜨고 http://sir.kr/cm_free/1370306">http://sir.kr/cm_free/1370306 <<== 이것 지도를 클릭하여 지역을 선택하는기능을 만들려고 합니다.

 

버튼을 누르면 레이어가 뜨고 http://sir.kr/cm_free/1370306">http://sir.kr/cm_free/1370306 <<== 이것 지도를 선택하는 페이지를 AJAX나 IFRAME으로 띄워서 선택하게 하려고 합니다.

다음 우편번호 검색과 비슷해요.

 

다음 우편번호 검색 소스는 복잡하고 다음 서버의 소스를 연동하여 제가 파악하기가 어렵더군요. 

 

 

제가 찾는 버튼을 누르면 레이어가 뜨고 그 레이어 안에 IFRAME이나 AJAX로 페이지를 불러올수 있는 예제 아는것이 있으면 부탁드립니다.

이거 해결해 주시는 분께 서울에 계시면 커피샵에서 커피한잔 대접해 드리겠습니다.

꼭좀 부탁드려요~~^^

 

 

매너좋은 고갱님이 요청하신거라 깔끔하게 잘 만들고 싶네요.

읽어주셔서 감사합니다.

댓글을 작성하려면 로그인이 필요합니다.

답변 3개

채택된 답변
+20 포인트
9년 전

</p><p><!doctype html></p><p><html></p><p><head></p><p>    <script src="<a href="<a href="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" target="_blank" rel="noopener noreferrer">https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js</a>"><a href="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" target="_blank" rel="noopener noreferrer">https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js</a></a>"></script></p><p> </p><p>    <link rel="stylesheet" href="<a href="<a href="http://www.jacklmoore.com/colorbox/example3/colorbox.css" target="_blank" rel="noopener noreferrer">http://www.jacklmoore.com/colorbox/example3/colorbox.css</a>"><a href="http://www.jacklmoore.com/colorbox/example3/colorbox.css" target="_blank" rel="noopener noreferrer">http://www.jacklmoore.com/colorbox/example3/colorbox.css</a></a>"></p><p>    <script src="<a href="<a href="http://www.jacklmoore.com/colorbox/jquery.colorbox.js" target="_blank" rel="noopener noreferrer">http://www.jacklmoore.com/colorbox/jquery.colorbox.js</a>"><a href="http://www.jacklmoore.com/colorbox/jquery.colorbox.js" target="_blank" rel="noopener noreferrer">http://www.jacklmoore.com/colorbox/jquery.colorbox.js</a></a>"></script></p><p> </p><p>    <script></p><p>    $(document).ready(function(){</p><p> </p><p>        //$(".ajax").colorbox();</p><p> </p><p>        $(".iframe").colorbox({</p><p>            /*  <a href="<a href="http://www.jacklmoore.com/colorbox/" target="_blank" rel="noopener noreferrer">http://www.jacklmoore.com/colorbox/</a>"><a href="http://www.jacklmoore.com/colorbox/" target="_blank" rel="noopener noreferrer">http://www.jacklmoore.com/colorbox/</a></a></p><p>                이용가능옵션은, Settings 섹션 참조</p><p>            */</p><p>            iframe:true, width:"80%", height:"80%",</p><p>            title:'다음지도'</p><p>        });</p><p> </p><p>    });</p><p>    </script></p><p></head></p><p><body></p><p> </p><p><!--<p><a class="ajax" href="<a href="<a href="http://map.daum.net/" target="_blank" rel="noopener noreferrer">http://map.daum.net/</a>"><a href="http://map.daum.net/" target="_blank" rel="noopener noreferrer">http://map.daum.net/</a></a>" title="타이틀">AJAX</a></p>--></p><p><!--<p><a class="iframe" href="<a href="<a href="http://map.daum.net/" target="_blank" rel="noopener noreferrer">http://map.daum.net/</a>"><a href="http://map.daum.net/" target="_blank" rel="noopener noreferrer">http://map.daum.net/</a></a>">IFRAME방식 다음지도검색</a></p>--></p><p><p><button class="iframe" href="<a href="<a href="http://map.daum.net/" target="_blank" rel="noopener noreferrer">http://map.daum.net/</a>"><a href="http://map.daum.net/" target="_blank" rel="noopener noreferrer">http://map.daum.net/</a></a>?param1=value1&param2=value2">IFRAME방식 다음지도검색</button></p></p><p> </p><p></body></p><p></html></p><p>

 

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

jquery lightbox로 검색해 보시면 플러그인 많이 나올 겁니다.

다른 분이 쓰신 것처럼 colorbox도 있고 fancybox 등등... 

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

Rido
9년 전

아 머리속에서 수많은 말들이 지나갔지만....

글로쓰려니 힘드네요 (이넘의 글재주란..)

 

다음분이 자세히 .... 후다닥..

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

R
Rido
9년 전
http://api.jquery.com/jquery.ajax/

iframe보다는 ajaax를 권해드립니다.

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인