Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Célio A.

Abrir janela ao passar o mouse

Recommended Posts

Ola pessoal!

 

Tenho um código que exibe uma lista de atletas do BD. Tenho implementado tooltip para exibir algumas informaçoes do atleta ao passar o mouse em cima do nome do atleta.

 

Quero implementar algo mais elaborado, exibir uma janela que permita interagir com o usuario, pretendo colocar links para redes sociais e foto de perfil.

 

Resumindo, seria algo semelhante ao forum Imaster, quando coloca o mouse em cima do nome do usuario abre uma janela com informaçoes do usuarrio.

 

A questão é que não faço ideia de como é feito, gostaria de dicas de como começar, o que devo pesquisar etc.

 

Grato.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Seria algo semelhante a isto? :D

<html>
	<head>
		<title> Janela Flutuante </title>
		<script>
			function mostraLayer(obj){
				var div = document.getElementById(obj).style;
				div.display = "block";
			}

			function escondeLayer(obj){
				var div = document.getElementById(obj).style;
				div.display = "none";
			}
		</script>
		<style>
			#divLayer{
				position: absolute;
				top: 25px;
				left: 100px;
				border: solid 1px #696969;
				width: 50%;
				height: 50%;
				display: none;
				background-color: #D3D3D3;
				padding: 10px;
			}
		</style>
	</head>

	<body name="nm_body">
		<div>
			<a href="http://forum.imasters.com.br/" onMouseOver="mostraLayer('divLayer');" onMouseOut="escondeLayer('divLayer');">Nosso forum!</a>
		<div>
		<div id="divLayer" name="nm_divLayer">
			Seria isso?
		</div>
	</body>
</html>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Bem... Isso é o que eu tenho (com uma implementação diferente), uma janela flutuante que exibe as informaçoes do atleta.

 

O que pretendo implementar é uma janela onde eu possa interagir, ou seja ir com o muse dentro dela e clicar em algum link.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.