Fóruns sobre PHP, JavaScript, HTML, MySQLi, jQuery, Banco de Dados, CSS


Moderador: web

 
Avatar do usuário
ADMIN
ADMIN
Tópico Autor
Mensagens: 17721
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Barra fixa no topo que só é mostrada ao rolar a página

24-03-2015 07:49

Nesse post mostro um script que usa jQuery para ter uma div fixa no topo do documento toda vez que o documento for rolado.
Rolando o documento, a div é mostrada, e voltando ao topo do documento a div desaparece.

<style> #div { position: absolute; top: 0; left: 0; z-index: 10; background:#eee; padding:5px; border:1px solid #CCCCCC; text-align:center; width:100%; float:left; font-family:verdana; font-size:13px; color:#000; font-weight:bold; display:none; } </style>


<script src="jquery.js"></script> <script> $(document).ready(function() { $(window).scroll(function() { if( $(window).scrollTop() == '0' ) { $("#div").hide(); } else { $("#div").show(); $('#div').animate({top:$(window).scrollTop()+"px" },{queue: false, duration: 100}); } }); $('#fechar').click(function() { $('#div').animate({ top:"+=15px",opacity:0 }, "slow"); }); }); </script>


<div id="div">AO ROLAR MOSTRA ESSA DIV <br /> <div id="fechar">Fechar</div></div>

0
A melhor hospedagem para o seu site HostGator!

Quem está online

Usuários navegando neste fórum: Nenhum usuário registrado