4

Tengo dos enlaces uno se llama enlaces y el otro información. Mi pregunta es, como puedo hacer mediante jquery que cuando pincho en enlaces aparezca un div y que cuando pinche en información el div de enlaces desaparezca y aparezca el div información.

El codigo html es el siguiente

<section class="botones">
    <div class="bloque_btn">
        <div class="btn btn_izq">
            <a href="#">enlaces</a>
        </div>
        <div class="btn btn_drch">
            <a href="#">información</a>
        </div>
    </div>
</section>
<section>
    <div id="bloque_enlaces"></div>
    <div id="bloque_info"></div>
</section>

1
  • Probaste utilizar alguna libreria o complemento tabs o acordeon ejemplo bootstrap son faciles de usar y no necesitas reinventar la rueda el 21 abr. 2017 a las 13:19

1 respuesta 1

5

Puedes hacerlo de esta manera:

$( document ).ready(function() {
    $( ".btn_izq" ).click(function() {
        $('#bloque_enlaces').show(); 
        $('#bloque_info').hide(); 
    });

    $( ".btn_drch" ).click(function() {
        $('#bloque_info').show(); 
        $('#bloque_enlaces').hide(); 
    });
});

Esto cuando clickeas una de las clases, hace que muestre un div y el otro lo oculte :D

4
  • Te dejo estas dos documentaciones para que puedas avanzar sin tanto estancamiento. api.jquery.com/click y w3schools.com/jquery/tryit.asp?filename=tryjquery_hide_show te ayudaran a entender como funciona jquery. Y que bueno que te haya podido ayudar :D el 21 abr. 2017 a las 13:16
  • lo siento, empece ayer en este foro....puedo cambiarlo en algun sitio?
    – HaileyThc
    el 21 abr. 2017 a las 13:36
  • Fue equivocación tuya? jajajajajaja no importa entonces c: el 21 abr. 2017 a las 13:59
  • @HaileyThc si fuiste tú quien votó en contra, acabo de editar la publicación, así que podrías remover ese voto en contra. Sino, igual puedes votar a favor por esta y cualquier respuesta que consideres que te ayuda :)
    – user227
    el 12 may. 2017 a las 15:30

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.