Ir para conteúdo

POWERED BY:

Arquivado

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

Ricardo Fressa

Abrir Caixa Quando Passar o mouse em cima do link

Por , em Javascript

Recommended Posts

Ricardo Fressa    0

Ricardo Fressa
Postado

Olá, queria saber como faco para fazer quando um usuario passa o mouse em cima de um link e abre uma "caixa" na mesma pagina?

 

tipo assim no javascript eu consegui fazer, mas fica feio, queria colocar uns efeitos na caixa e talz com jquery ajax..., alguém pode me ajudar?

 

<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>

#divLayer {
position: absolute;
top: 275px;
left: 200px;
border: solid 2px #696969;
width: 40%;
height: 45%;
display: none;
background-color: #EBEBEB;
padding: 10px;

<a href="" onMouseOver="mostraLayer('divLayer');" onMouseOut="escondeLayer('divLayer');">LINK</a>
<div id="divLayer" name="nm_divLayer" class="h1">TESTE</div>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Daniel-DF    0

Daniel-DF
Postado 

<html>

<head>

<style>

#caixa{

position:absolute;

top:0;

left:300px;

text-align: center;

padding: 10 10 10 10;

border: 1px solid #CCCCCC;

width:100px;

height:10px;

display:block;

}

</style>

<script type="text/javascript" src="jquery.js"></script>

<script type="text/javascript">

 

$(document).ready(function() {

 

$('#caixa').hide();

 

$('#aparece').mouseover(function () {

$('#caixa').slideToggle("fast");

});

$('#aparece').mouseout(function () {

$('#caixa').slideToggle("fast");

});

 

});

 

</script>

</head>

<body>

<a href="#" id="aparece">link1</a>

<a href="#" id="">link2</a>

<a href="#" id="">link3</a>

<div id="caixa">conteudo</div>

 

</body>

</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

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

  Aceito