Come caricare i div al clic e non al caricamento della pagina?[Chiuso]

Question

Attualmente sto costruendo e realizzando il mio nuovo sito web.Utilizza una pagina e utilizza un menu a soffietto jQuery per caricare il contenuto.Il contenuto è suddiviso in sei div diversi e tutti vengono caricati non appena si accede alla pagina.Voglio che carichi ogni div quando si fa clic sul collegamento ad esso.Per diminuire il tempo di caricamento della pagina.

Puoi vederlo in azione sul mio sito work in progress qui: http://is.gd/1p1Ys

Dal momento che non ho creato lo script jQuery e sono davvero pessimo con JavaScript/jQuery, non ho la più pallida idea di cosa fare.Quindi mi chiedo se qualcuno qui può aiutarmi.

Grazie mille,

Ryan

Answer 1

Sono d'accordo con le altre risposte sul fatto che le schede jquery-ui fanno esattamente questa cosa, ma puoi hackerare il tuo file accordian.js abbastanza facilmente ...basta cambiare gli href nella navigazione in modo che puntino a file html esterni contenenti il ​​contenuto desiderato, ad es.href="#lifestream" => href="lifestream.html",

e poi 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
  }
}

Answer 2

Dalla tua descrizione, sembra che questi div non vengono visualizzati fino a quando la voce di menu di primo livello viene cliccato. Se questo è il caso, è possibile utilizzare jQuery per inserire i div sottomenu nel DOM quando è aperto.

È possibile trovare un tutorial decente su Javascript / DOM manipolazione a w3schools .

Answer 3

Non sono sicuro che il controllo fisarmonica è che cosa siete dopo - Vai JQuery schede - è possibile caricare il contenuto tramite Ajax che impedirà di caricarli tutti in una volta. Una spiegazione di come fare questo è qui

Answer 4

Vorrei suggerire guardando schede jquery-ui se si desidera caricare il contenuto in modo dinamico. Attualmente non ho visto un plugin fisarmonica che consente di gestire, il che ha senso come fisarmonica ha bisogno di conoscere l'altezza del contenuto, anche se quando si fa clic su un pannello si doveva aspettare per il contenuto dinamico sembrerebbe a scatti. Tabs è il tuo modo migliore e più appropriato per andare avanti.