2009-07-06 4 views
0

현재 저는 새 웹 사이트를 만들고 있습니다. 그것은 한 페이지를 사용하고 jQuery accordian 메뉴를 사용하여 내용을로드합니다. 페이지에 액세스하자마자 6 개의 다른 div 및 모든로드에서 분할 된 콘텐츠입니다. 링크를 클릭하면 각 div를로드하려고합니다. 페이지 로딩 시간을 줄이려면.페이지를로드 할 때 div가 클릭 할 때로드되지 않도록하려면 어떻게해야합니까?

현재 진행 사이트에서 내 작품에 대한 조치에서 볼 수 있습니다 : 나는 jQuery를 스크립트를하지 않았고 내가 자바 스크립트/jQuery를에 정말 나쁜 생각 때문에 http://is.gd/1p1Ys

내가 단서가없는 것 할 것. 그래서 여기 누군가가 나를 도울 수 있는지 궁금합니다. 최상위 메뉴 항목을 클릭 할 때까지이 된 div가 표시되지 않습니다처럼

감사 톤,

라이언 당신의 묘사에서

+0

체크 간단한 jQuery를 솔루션 http://jsfiddle.net/UPPnL/1/ –

답변

1

jquery-ui 탭이 정확한 것을 수행한다는 다른 답변에 동의하지만 accordian.js 파일을 매우 쉽게 해킹 할 수 있습니다 ... 내비게이션의 외부 참조를 변경하여 콘텐츠가 들어있는 외부 HTML 파일을 가리 키도록하십시오. 당신이 원하는, 즉 HREF = "#의 라이프"=> HREF = "lifestream.html", accordian.js에서 다음

과 :

$links.click(function() { 
    var link = this, 
    if(!link.href.match(/^#.*/)) { //if the href doesn't start with '#' 
    loadDiv(link.href); 
    } else { 
    doRestOfFunction(); //everything your script is currently doing. 
    } 
}); 

function loadDiv(href) { 
    $.get(href, function(html) { 
    var newDiv = $(html) 
    $(".panels").append(newDiv); 
    newDiv.hide(); 
    doRestOfFunction(); //same as above 
    } 
} 
+0

감사합니다. accordian.js에 어디에 추가해야할까요? 미안 미안하지만 그것이 너무 많이 묻는다. 그러나 나는 과거 10 분 동안 주변에서 열중하고 있었다. 그리고 내가 할 수 있었던 누구나는 주된 페이지에서 모든 div 's 쇼를 만드는 것이어도. 감사. – Ryan

+0

1. 귀하의 페이지에서 모든 div를 제거하십시오. 2. 자신의 .html 파일에 넣습니다. 3. 네비게이션의 href를 lifestream.html 등을 가리 키도록 변경합니다. 4. loadDiv() 및 showDiv()의 두 함수를 만듭니다. 5. loadDiv() => 위와 같이 6. showDiv() => $ links.click() 함수가 현재하고있는 모든 것. 변경 doRestOfFunction() => showDiv() – Daniel

+0

모든 도움을 주셔서 감사하지만 여전히 작동하지 않습니다. = S – Ryan

0

, 그것은 소리. 이 경우 DOM을 열 때 jquery를 사용하여 하위 메뉴 div를 DOM에 삽입 할 수 있습니다.

자바 스크립트/DOM 조작에 대한 자습서는 에서 찾을 수 있습니다.

0

나는 아코디언 컨트롤이 당신이 무엇인지 알지 못합니다. JQuery tabs을 확인하십시오. Ajax를 통해 내용을로드하면 한 번에로드 할 수 없습니다. 이 작업을 수행하는 방법에 대한 설명은 here

0

동적으로 내용을로드하려면 jquery-ui 탭을 참조하십시오. 현재 콘코 니언 플러그인을 보지 못했습니다. 콘코 니언이 컨텐츠의 높이를 알아야 할 필요가 있고, 동적 콘텐트를 기다려야하는 패널을 클릭했을 때 갑자기 나타나게되는 경우도 있습니다. 탭은 앞으로 나아갈 수있는 최선의 최선의 방법입니다.

관련 문제