Como chegar DIV para carregar em clique não quando a página carrega? [fechadas]

Question

Atualmente, estou construindo um fazendo o meu novo site. Ele usa uma página e utiliza um menu acordeão jQuery para carregar o conteúdo. O conteúdo que se separaram em seis diferentes div de e toda a carga assim que a página é acessada. Eu quero que carregar cada div quando o link para ele é clicado. Para diminuir o tempo de carregamento da página.

Você pode ver isso em ação no meu trabalho no local progresso aqui: http://is.gd/1p1Ys

Uma vez que eu não fiz o script jQuery e estou muito ruim em JavaScript / jQuery Eu não tenho a menor idéia do que fazer. Então, eu estou querendo saber se alguém aqui pode me ajudar.

Graças a tonelada,

Ryan

Answer 1

Concordo com as outras respostas que as abas jquery-ui faz esta coisa exata, mas você pode cortar o seu accordian.js arquivo muito facilmente ... apenas alterar as hrefs em sua navegação para apontar para arquivos HTML externos que contém o conteúdo que você quer, ou seja, href = "# lifestream" => href = "lifestream.html",

e, em seguida, em 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

De sua descrição, parece que estas divs não são exibidos até que o item de menu de nível superior é clicado. Se este for o caso, você pode usar jQuery para inserir os divs sub-menu no DOM quando ele é aberto.

Você pode encontrar um tutorial decente sobre Javascript / DOM Manipulação em w3schools .

Answer 3

Eu não tenho certeza o controle acordeão é o que você está depois - confira JQuery guias - você pode carregar o conteúdo via Ajax, que irá impedi-los de carregar tudo de uma vez. Uma explicação de como fazer isso é aqui

Answer 4

Eu sugeriria olhar guias jquery-ui se você quiser carregar o conteúdo de forma dinâmica. Atualmente eu não vi um plugin accordian que vai lidar com isso, o que faz sentido como um necessidades accordian saber a altura do conteúdo, também se quando você clicou em um painel que você tinha que esperar para o conteúdo dinâmico parece jerky. Tabs é a sua melhor e mais adequada forma de avançar.