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

Moderador: web

 

Abrir a div proxima do ponteiro do mouse(quase pronto)

04-06-2007 20:54

Pessoal, tenho este codigo que faz exibir minha div:
function div(opcao){ var div = document.getElementById( 'div' ); var verifica_div = opcao.substring(0,6); if(verifica_div== "abrir"){ div_div.style.display = "block"; }else{ div_div_div.style.display = "none"; } }

Ate ai tudo bem, o problema é o seguinte, o link que tem o js pra chamar esta funcao que por vez faz exibir a div, esta no final da pagina, assim quando se tem muito conteudo na pagina, e clico no link para exibir a div, ela aparecer num local fixo la em cima, que expecifiquei no CSS da div.

Minha necessidade é que ao clicar no link a div seja exibida ou no centro da pagina nao importanto em que altura da pagina esta, se eu estiver la no final ele exibi la no meio do final ficando visivel para mim e nao la no topo que ja nao esta visivel.

Ou entao que seja exibida proxima do ponteiro do mouse.

Alguem pode me ajudar nisso por favor?
0
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17230
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Abrir a div proxima do ponteiro do mouse(quase pronto)

04-06-2007 21:08

Tenta com as seguintes especificações para o CSS da div:

position:absolute;
left:50%;
top:50%;
0
Criar site grátis Wix
Hospedagem de sites Hostgator
Tem um script legal em HTML, CSS, PHP, HTML, JavaScript, jQuery? Poste e compartilhe com os usuários do fórum
:rock:
 

Abrir a div proxima do ponteiro do mouse(quase pronto)

04-06-2007 23:46

Sim, mas desta forma ele vai abrir com 50% la do topo, mas como disse o botao fica la no final da pagina, entao eu vou ter que rolar a pagina la no final ai quando eu clicar ele vai abrir a div la em cima e como a rolagem ta la em baixo nao vai mostrar a div, ai terei de rolar para cima a tela sacou?.
0
 

Abrir a div proxima do ponteiro do mouse(quase pronto)  #resolvido

05-06-2007 10:29

Pesquisando achei este aqui:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Untitled Document</title> <script language="javascript"> function Layer() { document.getElementById("mais").style.left = event.x; document.getElementById("mais").style.top = event.y; if (document.getElementById("mais").style.visibility == 'visible') { document.getElementById("mais").style.visibility = 'hidden'; } else { document.getElementById("mais").style.visibility = 'visible'; } } </script> </head> <body> <div id="mais" style="cursor: pointer; position:absolute; width:10px; height:10px; z-index:1; visibility: hidden; overflow: visible; left: 400px; top: 400px; background-color: #F0F8FF; layer-background-color: #F0F8FF; border: 1px none #000000;">teste</div> <a href="#" onmouseover="Layer()" onmouseout="Layer()">Mais</a> </body> </html>

Mas o problema dele é que só roda no IE e no FF da a mensagem:
Erro: event is not defined
Arquivo-fonte: teste.html
Linha: 9
0
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17230
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Abrir a div proxima do ponteiro do mouse(quase pronto)

05-06-2007 10:40

Consegui montar um exemplo.

Testei no IE e FF com resolução 1024x768.

<!-- ACIONANDO O EVENTO //--> <input type="button" id="botao" value="mostra" onClick="ativa(event)"> <script> // início da função function ativa(event){ // objeto da função var div = document.getElementById('div') // quando estiver none if (div.style.display == 'none') { // passa a distância para o objeto ( top ) document.getElementById("div").style.top=(document.body.scrollTop)+(screen.height/2)-100; // passa a distância para o objeto ( left ) document.getElementById("div").style.left=(document.body.scrollLeft)+(screen.width/2)-100; // alternâcia entre mostrar e não mostrar div.style.display = 'block'; } else { div.style.display = 'none'; } // fim da alternância } // fim da função </script> <!-- OBJETO //--> <div id='div' class='div' style='display:none;position:absolute;'> conteúdo </div>

0
Criar site grátis Wix
Hospedagem de sites Hostgator
Tem um script legal em HTML, CSS, PHP, HTML, JavaScript, jQuery? Poste e compartilhe com os usuários do fórum
:rock:
 
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17230
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Abrir a div proxima do ponteiro do mouse(quase pronto)

05-06-2007 23:09

Blz :)
0
Criar site grátis Wix
Hospedagem de sites Hostgator
Tem um script legal em HTML, CSS, PHP, HTML, JavaScript, jQuery? Poste e compartilhe com os usuários do fórum
:rock:

Quem está online

Usuários navegando neste fórum: Google Adsense [Bot]