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


Moderador: web

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

Posicionar div centralizada na tela mesmo com a tela rolada

13-09-2013 16:59

Esse script permite manter a div sempre centralizada na tela "verticalmente e horizontalmente" usando o jQuery.

<style> #conteudo{display:none;width:200px;height:200px;border:1px solid #cccccc;} </style>


<script src="jquery.js"></script>   <script> $(document).ready(function() {   $('.div').click(function() {   var offset = $(document).scrollTop(); var alturaJanela = (screen.height/2)-$('#conteudo').height(); var distanciaEsquerda = ($(document).width()/2)-($('#conteudo').width()/2);   $('#conteudo').css({ position: 'absolute', top: (offset)+(alturaJanela)+'px', left: distanciaEsquerda });   $('#conteudo').show(); });   }); </script>


<a href="javascript://" class="div">mostra</a>   <div id="conteudo" class="center">abcd <a href="javascript://" onclick="$(this).parent().hide()">Fecha</a></div>   <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />   <a href="javascript://" class="div">mostra</a>

0
A melhor hospedagem para o seu site HostGator!

Quem está online

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