Este código pode ser utilizado para posicionar uma layer(camada) ou DIV’s com conteúdo dinâmico no local onde está posicionado o ponteiro do mouse. Pode ser empregada para abrir menus de contexto, posicionar sub-resultados, telas de descrição de termos etc.
Requisitos
-JavaScript habilitado no navegador WEB.
-Navegador com habilidade para manipular Layers e DIV’s.
Instruções para o uso:
1- Crie uma DIV em seu documento, como o exemplo abaixo:
<div style="z-index: 101; width: 100%; position: relative; height: 300px;overflow:auto;" id="tst">
<h1>Div de teste.</h1>
</div>
2- Insira na TAG body do documento HTML o seguinte evento:
onclick="posTela(tst);"
3- Crie a função a seguir. Ela receberá como parâmetro o objeto DIV.
function posTela(obj)
{
obj.style.left = window.event.clientX+10;
obj.style.top = window.event.clientY-50;
}
Este script pode ser adaptado para outros objetos dentro de sua aplicação web.
Arquivo de exemplo:
Baixar – Clique com o botão direito e selecione salvar como.
Tiago Larios