#src를 이용하여 iframe 안에 표시하는 방법? 채택완료
타이싼
7년 전
조회 2,168
안녕하세요^^
https://www.sureman.com/#src%3Dhttps%253A%252F%252Fwww.sureman.com%252Flist%252Fnotice" target="_blank">https://www.sureman.com/#src%3Dhttps%253A%252F%252Fwww.sureman.com%252Flist%252Fnotice
http://named.com/#src%3Dhttp%253A%252F%252Fnamed.com%252Fbbs%252Fboard.php%253Fbo_table%253Dnotice" target="_blank">http://named.com/#src%3Dhttp%253A%252F%252Fnamed.com%252Fbbs%252Fboard.php%253Fbo_table%253Dnotice
위와 같은 2개의 예제가 있습니다.
기본틀은 그대로 있고 메뉴를 클릭하면 iframe에 내용이 바뀝니다.
사이트 주소는 뒤에 #src url인코딩후 바뀌고요.
혹시 저걸 구현 할수 있는 방법이나 예제소스가 있을까요??
댓글을 작성하려면 로그인이 필요합니다.
답변 1개
채택된 답변
+20 포인트
7년 전
첫번째 사이트 소스보면
</p>
<p>function locationHref(frameSRC) {</p>
<p> var encodeSRC = encodeURIComponent("src=" + encodeURIComponent(frameSRC)); </p>
<p> location.replace(location.href.split("#")[0] + "#" + encodeSRC);</p>
<p> if (navigator.userAgent.indexOf("Firefox") != -1) {</p>
<p> var link = document.createElement("link");</p>
<p> link.type = "image/x-icon";</p>
<p> link.rel = "shortcut icon";</p>
<p> link.href = "/favicon.ico?v=160129"; document.getElementsByTagName("head")[0].appendChild(link);</p>
<p> }</p>
<p> return false;</p>
<p>}
이부분이 처리하는 함수인것 같습니다.
로그인 후 평가할 수 있습니다
답변에 대한 댓글 4개
�
타이싼
7년 전
어떻게 사용을 해야할지 감이 안잡혀서요..
�
미치광이
7년 전
메뉴 링크에
<a href="locationHref('http://www.test.com/about.html');void(0)">메뉴1</a>
이런식으로요
아 함수는
[code]
function locationHref(frameSRC) {
var encodeSRC = encodeURIComponent("src=" + encodeURIComponent(frameSRC));
location.replace(location.href.split("#")[0] + "#" + encodeSRC);
if (navigator.userAgent.indexOf("Firefox") != -1) {
var link = document.createElement("link");
link.type = "image/x-icon";
link.rel = "shortcut icon";
link.href = "/favicon.ico?v=160129"; document.getElementsByTagName("head")[0].appendChild(link);
}
mainFrame.location.href = frameSRC;
return false;
}
[/code]
이렇게 수정해야겠네요.
<a href="locationHref('http://www.test.com/about.html');void(0)">메뉴1</a>
이런식으로요
아 함수는
[code]
function locationHref(frameSRC) {
var encodeSRC = encodeURIComponent("src=" + encodeURIComponent(frameSRC));
location.replace(location.href.split("#")[0] + "#" + encodeSRC);
if (navigator.userAgent.indexOf("Firefox") != -1) {
var link = document.createElement("link");
link.type = "image/x-icon";
link.rel = "shortcut icon";
link.href = "/favicon.ico?v=160129"; document.getElementsByTagName("head")[0].appendChild(link);
}
mainFrame.location.href = frameSRC;
return false;
}
[/code]
이렇게 수정해야겠네요.
�
타이싼
7년 전
프레임 대상이 될 범위는 어떻게 지정 해줘야할까요?
�
미치광이
7년 전
대상이 될 범위라는게 어떤걸 말씀하시는지 잘 모르겠지만
첫 참고사이트 경우는 윗쪽헤더와 오른쪽 사이드바 말고 컨텐츠 영역전체를 프레임으로
잡았네요. 그러니 그렇게 구성을 하신다면 해당 아이프레임에 들어갈페이지는 헤더 사이드바 푸터 다 빼고 기본 컨텐츠 페이지만 구성하시면 될꺼 같아요.
그리고 컨텐츠 길이에따라 아이프레임 높이가 변할 수 있도록 mainFrame에 onLoad이벤트 걸어서 높이 처리해주시면 되고요.
[code]
var $frame = $("#mainFrame");
$frame.on("load", function () {
$("body").scrollTop(0);
var $o = $("#frameWrap", $frame.contents());
$frame.css('height', $o.height() + 100);
});
[/code]
이런식으로요
첫 참고사이트 경우는 윗쪽헤더와 오른쪽 사이드바 말고 컨텐츠 영역전체를 프레임으로
잡았네요. 그러니 그렇게 구성을 하신다면 해당 아이프레임에 들어갈페이지는 헤더 사이드바 푸터 다 빼고 기본 컨텐츠 페이지만 구성하시면 될꺼 같아요.
그리고 컨텐츠 길이에따라 아이프레임 높이가 변할 수 있도록 mainFrame에 onLoad이벤트 걸어서 높이 처리해주시면 되고요.
[code]
var $frame = $("#mainFrame");
$frame.on("load", function () {
$("body").scrollTop(0);
var $o = $("#frameWrap", $frame.contents());
$frame.css('height', $o.height() + 100);
});
[/code]
이런식으로요
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인