Olá pessoal hoje irei ensinar como exibir e ocultar uma div no PHP utilizando jQuery. É um exemplo bem simples que alguns ficam na dúvida é possível ser feito direto em javascript também, porém em jQuery é mais enxuto fica mais fácil aplica-lo.
Primeiro temos que informar o local da biblioteca jQuery no head,
em seguida o script com a ação desejada.
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.acao').click(function(){ /* Quando usuario clica no botão ele executa está ação*/
$('#div-desejada').slideToggle('slow');
});
});
</script>
</head>
<body>
Botão com a Ação de Exibir e Ocultar
<a href="#" name="acao" class="acao" >Exibir / Ocultar</a>
Coloque assim caso queira iniciar com a Div Oculta
<div id="div-desejada" style="display:none;"> conteudo da div </div>
ou
Coloque assim caso queira iniciar com a Div na tela
<div id="div-desejada"> conteudo da div </div>
</body>
<html>
Espero que tenham gostado e até a apróxima.
Obrigado!!!
Aquiles Maior
"unidos para fortalecer"
Primeiro temos que informar o local da biblioteca jQuery no head,
em seguida o script com a ação desejada.
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.acao').click(function(){ /* Quando usuario clica no botão ele executa está ação*/
$('#div-desejada').slideToggle('slow');
});
});
</script>
</head>
<body>
Botão com a Ação de Exibir e Ocultar
<a href="#" name="acao" class="acao" >Exibir / Ocultar</a>
Coloque assim caso queira iniciar com a Div Oculta
<div id="div-desejada" style="display:none;"> conteudo da div </div>
ou
Coloque assim caso queira iniciar com a Div na tela
<div id="div-desejada"> conteudo da div </div>
</body>
<html>
Espero que tenham gostado e até a apróxima.
Obrigado!!!
Aquiles Maior
"unidos para fortalecer"
Comentários
Postar um comentário