Buenas señores, estoy re-modelando mi web y me gustaría mostrar una sección con imágenes que desplieguen un detalle de cada imagen, para que nos entendamos este sería el mark-up.
Código HTML:
Ver original <div class="thumb" id="thumb01">Thumbail
</div> <div class="detail" id="thumb01">Thumbail
</div> <div class="thumb" id="thumb02">Thumbail
</div> <div class="detail" id="thumb02">Thumbail
</div> <div class="thumb" id="thumb03">Thumbail
</div> <div class="detail" id="thumb03">Thumbail
</div>
Entendiendo que el contenido de las clases "detail" estarían ocultas y se mostrarían al hacer click en los "thumb" correspondientes.
El Problema
Todo esto es sencillo, pero al final quedaría una página muy pesada ya que el navegador tendría que cargar todas las clases "detail"
Lo que busco
Me gustaría poder hacer que el navegador sólo cargue los "detail" que yo active a través de su "thumb".
En resumen, sólo cargar el contenido de las capas cuyo display sea "block".
Espero sus respuestas, gracias de antemano!
