2009-07-06 13 views
0

Ich baue gerade eine neue Website. Es verwendet eine Seite und verwendet ein jQuery-Menü, um den Inhalt zu laden. Der Inhalt teilt sich in sechs verschiedene Divs auf und alle werden geladen, sobald auf die Seite zugegriffen wird. Ich möchte, dass jedes div geladen wird, wenn auf den Link geklickt wird. So verringern Sie die Ladezeit der Seite.Wie bekomme ich div's, um beim Laden geladen zu werden, nicht wenn die Seite geladen wird?

können Sie diese sehen in Aktion auf meine unfertige Website hier: http://is.gd/1p1Ys

Da ich nicht die jQuery-Skript gemacht hat, und ich bin wirklich schlecht JavaScript/jQuery Ich habe keine Ahnung, was machen. Ich frage mich also, ob mir hier jemand helfen kann.

Dank einer Tonne,

Ryan

+0

Check einfache jQuery Lösungen http://jsfiddle.net/UPPnL/1/ –

Antwort

1

Ich stimme den anderen Antworten zu, dass jquery-ui tabs genau das tut, aber Sie können Ihre accordian.js-Datei ziemlich leicht hacken ... ändern Sie einfach die hrefs in Ihrer Navigation auf externe HTML-Dateien, die den Inhalt enthalten Sie wollen, dh href = "# Lebensstrom" => href = "lifestream.html",

und dann in 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

Danke, weißt du, wo du das in accusian.js hinzufügen kannst? Es tut mir leid, wenn es zu viel verlangt ist, aber ich habe die letzten 10 Minuten herumgetüftelt und alles, was ich geschafft habe, ist, die Show aller Divs auf der Hauptseite zu machen. Vielen Dank. – Ryan

+0

1. Entfernen Sie alle Divs von Ihrer Seite. 2. setze sie in ihre eigenen .html Dateien 3. ändere die hrefs im nav auf lifestream.html etc. 4. erstelle zwei Funktionen -> loadDiv() und showDiv() 5. loadDiv() => wie oben 6. showDiv() => alles, was Ihre $ links.click() Funktion gerade macht. 7. ändern doRestOfFunction() => showDiv() – Daniel

+0

Danke für die Hilfe, aber immer noch nicht funktioniert = S – Ryan

0

Aus Ihrer Beschreibung, es klingt wie diese divs nicht angezeigt werden, bis der Menüpunkt der obersten Ebene angeklickt wird. Wenn dies der Fall ist, können Sie jquery verwenden, um die Untermenüs divs beim Öffnen in das DOM einzufügen.

Sie können eine anständige Anleitung zur Javascript/DOM-Manipulation unter w3schools finden.

0

Ich bin mir nicht sicher, ob die Akkordeonsteuerung das ist, wonach Sie suchen - check out JQuery tabs - Sie können den Inhalt über Ajax laden, was verhindert, dass alle gleichzeitig geladen werden. Eine Erklärung, wie dies zu tun ist, ist here

0

Ich würde empfehlen, Blick auf jquery-Ui Tabs, wenn Sie den Inhalt dynamisch laden möchten. Zur Zeit habe ich noch kein Akkordeon-Plugin gesehen, das Sinn macht, da ein Akkordeon die Höhe des Inhalts kennen muss. Auch wenn man auf einen Bereich geklickt hat, musste man auf dynamischen Inhalt warten. Tabs sind die beste und am besten geeignete Methode, um voranzukommen.

Verwandte Themen