1

Recentemente achei um código que tem o que preciso. Estou desenvolvendo uma página com 3 botões, cada um deles mostra um conteúdo (uma div) quando clicados.

Quando clico no primeiro botão, como a div é exibida logo em baixo, os outros botões também são levados para baixo. Ou seja, eles descem, mas o que eu preciso não é da transição nem descer os botões, só mudar o conteúdo.

Resumo a partir do contexto:

Preciso que nenhum dos botões descam quando o outro for acionado e que essa transição de slide seja substituída por um fade.

Código:

 
$(document).ready(function(){
 
        $(".slidingDiv").hide();
        $(".show_hide").show();
 
    $('.show_hide').click(function(){
    $(".slidingDiv").slideToggle();
        $(".slidingDiv2").hide();
    });
 
});


$(document).ready(function(){
 
        $(".slidingDiv2").hide();
        $(".show_hide2").show();
 
    $('.show_hide2').click(function(){
    $(".slidingDiv2").slideToggle();
    $(".slidingDiv").hide();
    });
 
});
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>


<a href="#" class="show_hide">Teste 1</a>
<div class="slidingDiv">
<center><br><br>
    Um teste inicial
</center>
</div> &nbsp;&nbsp;&nbsp;&nbsp;


<a href="#" class="show_hide2">Teste 2</a>
<div class="slidingDiv2">
    <br><br><center>
        Outro Teste
    </center>
</div>

1 Resposta 1

1

acredito que seja isso que você queira:

https://jsfiddle.net/cm5ko9jf/2/

1
  • Sim. Exatamente. Muito obrigado!
    – MucaP
    28/01/2016 às 19:54

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .