Como llegar div es para cargar al hacer clic no cuando carga la página? [cerrado]

Question

Actualmente estoy haciendo mi construcción de una nueva página web. Utiliza una página y utiliza un menú acordeón jQuery para cargar el contenido. El contenido se divide en seis diferentes divs y toda la carga tan pronto como se accede a la página. Quiero que se cargue cada div cuando se hace clic en el enlace a la misma. Para disminuir el tiempo de carga de la página.

Esto se puede ver en acción en mi trabajo en progreso sitio aquí: http://is.gd/1p1Ys

Dado que no hice el guión jQuery y yo soy muy malo en JavaScript / jQuery no tengo ni idea de qué hacer. Así que me pregunto si alguien aquí me puede ayudar.

Gracias una tonelada,

Ryan

Answer 1

Estoy de acuerdo con las otras respuestas que las pestañas jquery-ui lo hace esta cosa exacta, pero se puede hackear un archivo muy fácilmente accordian.js ... sólo cambiar los hrefs en su navegación para apuntar a archivos html externo que contiene el contenido que desee, es decir, href = "# corriente de vida" => href = "lifestream.html",

y luego en 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

A partir de su descripción, parece que estos divs no se visualizan hasta que se hace clic en el elemento de menú de nivel superior. Si este es el caso, se puede usar jQuery para insertar los divs sub-menú en el DOM cuando se abre.

Puede encontrar un tutorial decente en Javascript Manipulación / DOM en w3schools .

Answer 3

No estoy seguro de que el control de acordeón es lo que está después - echa un vistazo a jQuery pestañas - se puede cargar el contenido a través de Ajax, que les impedirá cargar todos a la vez. Una explicación de cómo hacer esto es aquí

Answer 4

Yo sugeriría mirar pestañas jquery-ui si desea cargar el contenido en forma dinámica. Actualmente no he visto un plugin de acordeón que se encargará de ella, lo que tiene sentido como un acordeón necesita saber la altura del contenido, también si al hacer clic en un panel que había que esperar para el contenido dinámico al parecer desigual. Tabs es el camino mejor y más adecuada para seguir adelante.