Soporte » Guías – Resolución de problemas » Mostrar contenido de la pestaña al clicar

  • David

    (@dvdmrnjcbssn)


    Hola, tengo unas pestañas con un icono en cada pestaña.

    Me interesaría que el contenido de cada pestaña estuviera oculto al cargarse la página y que al darle al icono, se visualice el contenido.

    Con el siguiente script consigo ocultarlo, pero no sé cómo hacer para que cuando lo dé a la pestaña, se visualice:

    <script>
    
    jQuery(document).ready(function($) {
    
    var delay = 100; setTimeout(function() {
    $('.e-n-tabs-content').css('display', 'none'); }, delay);
    
    });
    
    </script>

    ¿Cómo puedo hacer que se visualice el contenido?

    La página con la que necesito ayuda: [accede para ver el enlace]

Viendo 1 respuesta (de un total de 1)
  • Buenas noches @dvdmrnjcbssn!

    Hay mil formas de hacerlo, depende no únicamente de JavaScript sino también de la jerarquía del HTML que hayas programado para esas Tabs.

    De todas formas, por apuntarte en una dirección sin hacerte el código, empezaría por tener las tabs y su contenido dentro de un mismo «tab-wrapper», así tendrías una jerarquía «wrapper>tab» y «wrapper>tab-content». Así, de esta forma, necesitas ocultar todos los contenidos de las pestañas (.tab-content{display:none}) y, posteriormente, añadir un evento a cada pestaña para que, al clickar, puedas añadir una clase «por ejemplo .active». Así puedes aplicar un .tab-content.active{display:block} y ya se mostraría el contenido.

    Es una forma simple, luego se puede añadi muchísimas más cosas pero espero haberte arrojado algo de luz.

Viendo 1 respuesta (de un total de 1)
  • Debes estar registrado para responder a este debate.