2013-07-03 2 views
0

웹 사이트를 운영합니다. 내 고객이 로그인하면 사이트 디자인에 대한 5 가지 아이디어 (레이아웃, 색상 등)를 볼 수 있습니다.비대화 형 iframe 또는 이와 유사한 솔루션

이제는 나에게 5 개의 인쇄 화면을 보여주고 저에게 업로드했습니다. 각 img는 다른 under-construction 웹 사이트에 연결됩니다.

내가 원하는 것은 변경할 때마다 수동으로 인쇄 화면을 변경할 필요가 없기 때문입니다.

iFrame 솔루션을 사용해 보았지만 대화 형입니다.

가장 좋은 방법은 무엇입니까?


편집 :

내가 (해결 방법) 솔루션,하지만 크롬에 대한 있습니다.

<a target="_parent" href="http://url.com"> 
<div> 
<iframe id="iframe" src="http://url.com" width="300px" height="300"></iframe> 
</div> 
</a> 

일부 CSS는 축소 및 웹 사이트 축소판처럼 보이게합니다 :

#iframe{ 
zoom: 4.0; 
-moz-transform: scale(0.25); 
-moz-transform-origin: 0 0; 
-o-transform: scale(0.25); 
-o-transform-origin: 0 0; 
-webkit-transform: scale(0.25); 
-webkit-transform-origin: 0 0; 
} 

크롬 = 크기가 완벽, iframe 대응의 브라우저 내 HREF (너무 많은 로직을 열어 안에 당신이 링크를 클릭하면 .. .), iframe 안쪽을 클릭해도 링크에는 나타나지 않습니다. 아무 일도 일어나지 않습니다.

FF 크롬

당신은 전체 페이지를 커버 사업부 - 컨테이너를 삽입 할 수

+0

사이트의 모든 5 개의 이미지를 한 번에 나열합니까? –

+0

네, 그렇지만 꼭 필요한 것은 아닙니다. –

답변

-1

큰 4 회, 그래서 사용자가 아무 것도 클릭 할 수 없습니다 IE = 썸네일보다 4 배 더 작은 = 썸네일, 그러나 div에.

<div style="position:fixed;width:100%;height:100%;"></div> 

전체 코드는 다음과 같습니다

<html> 
    <body> 
     <div style="position:fixed;width:100%;height:100%;"></div> 
     <iframe src="http://www.http://stackoverflow.com" width="100%" height="300" ></iframe> 
    </body> 
</html> 

편집 : 당신이이해야 할 시도 할 수 있습니다 :

<div id="myiframes"> 
     <div style="position: relative; width: 300px; height: 300px; display: inline-block;"></div> 
     <iframe src="http://www.w3schools.com" width="300px" height="300" style="margin-left:-300px;"></iframe> 
     <div style="position: relative; width: 300px; height: 300px;display:inline-block;"></div> 
     <iframe src="http://www.w3schools.com" width="300px" height="300" style="margin-left:-300px;"></iframe> 
</div> 

는 기본적으로 사업부를 넘어 각 iframe을 이동, 마진을 추가하여 -300px; 각 iframe에 필요에 따라 변경하십시오

+0

문제는 페이지의 나머지 부분을 대화 형으로하고 싶습니다. 나는 iframe 만 div로 처리하려고했지만 행운은 없었습니다. –

+0

@ pp_1 도움이 되었기를 바랍니다. 응답 코드에 일부 코드를 추가했습니다. – isset

+0

작동하지 않습니다. iframe은 어떤 이유로 더 중요합니다. Div onclick = 일부 JS도 작동하지 않습니다. –

관련 문제