2013-11-27 4 views
3

다른 페이지에 HTML 페이지를 오버레이하고 싶습니다. 다음 페이지와 같이 div의 다른 페이지에 대한 링크를 제공하려고 시도했습니다. http://jquerytools.org/demos/overlay/external.html하나의 HTML 페이지를 다른 페이지에 오버레이

그러나 컨트롤은 같은 페이지에 머물지 않고 다른 페이지로 이동합니다. 누구든지 새 HTML 페이지가 기본 웹 페이지 상단에로드되는 예제를 제안 할 수 있습니다 .. 나는 웹을 처음 사용했습니다. 도와주세요!

+0

첫 번째 링크는 귀하가 묻는 것을 어떻게 보여줍니까? 모달 윈도우/라이트 박스를 의미합니까? – JAL

+0

세부 정보를 클릭하면 별도의 HTML 페이지가 기본 페이지 상단에로드됩니다. –

+2

이것은 상당히 큰 작업이며이를 수행하는 방법이 매우 다양합니다. 당신이 가진 구체적인 것은 무엇입니까? .html 파일이어야합니까? iframe을 사용할 수 있습니까? 아약스는? 이 라이트 박스/jquery 플러그인을 사용하고 싶습니까? 당신이 준 juqerytools 링크와 관련하여 어떤 코드를 시도 했습니까? – Nenotlep

답변

0

일반 HTML 만 사용하면 사용자가 원하는 것을 할 수 없습니다. 이론적으로 할 일은 기존 div에 HTML 페이지를로드 한 다음 애니메이션의 종류에 따라 현재 div와 다음 페이지 div 사이를 전환하는 것입니다.

기본 작업을 설명한 후, 나는 당신이 찾고있는 것이 자바 스크립트 html 템플릿 시스템 (핸들 바처럼)이며 템플릿 사이를 전환 할 수 있다고 말합니다. javascript templating을 사용하면 javascript에 대한 좋은 지식이 필요할 것입니다. 페이지를 쉽게 전환 할 수 있도록 js 라우터를 구현해야합니다. 당신이 만드는 것은 SPA (단일 페이지 응용 프로그램)입니다.

단일 페이지 응용 프로그램에 대한 자세한 내용은 "단일 페이지 응용 프로그램 만들기"의 google을 참조하십시오.

1

DEMO

내가 (외부 도메인이 외부 도메인 소유자의 구성에 따라 iframe이/DIV에로드 할 수 없기 때문에 보안 문제 브라우저의) 다른 페이지를로드 할은 iframe을 사용하고, 당신은을 사용할 수 있습니다 div는 같은 도메인에서 페이지를 가져 오는 경우 jquery's load를 사용하여 동일한 작업을 수행하는

$('div#page').load(source,function(e){$(this).fadeIn('slow')}) 

주어진 데모 당신이 css 부품 협정을 조정해야하는 일반/보편적 인 해결책이 아니다 참고 귀하의 페이지로 이동

관련 문제