Ir para conteúdo

Arquivado

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

iJuunin

Como usar o mouseout

Por , em Javascript

Recommended Posts

iJuunin    4

iJuunin
Postado

Bom pessoal, estou trabalhando com tooltip tipo o do facebook que ao passar o mouse no link do perfil de uma pessoa, ele retorna a pagina do usuario em uma mini modal assima de onde esta o link ... estou conseguindo chamar a função atraves do mousehover, mas agora, pra remover essa mini modal é que ta o problema, quando eu passase o mouse em cima do link era pra abrir, e quando eu tirasse, era pra ele fechar sozinho...alguem pode me da uma ajudinha? o codigo ta abaixo

 

index.php

<!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=utf-8" />
<title></title>
<link href="style.css" media="all" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
function profileTip(id, post, delay) {
	
	if(delay == 1) {
		clearInterval(TipTimer);
	} else {
		TipTimer = setInterval(function(){

			var msgType = 'message';
			var height = 58;
			var left = 20;

		
		$('#profile-tip').show();
		$('#profile-tip').html('<div class="profile-tip-padding"><div class="loader"></div></div>');
	
		var position = $("#"+msgType+post).position();
		var pos = {
			top: (position.top + height) + 'px',
			left: (position.left + left) + 'px'
		};
		
		$('#profile-tip').css(pos);
		$.ajax({
			type: "POST",
			url: "fetch_profile.php",
			data: 'user_id='+id,
			cache: false,
			success: function(html) {	
				$('#profile-tip').html(html);
			},
			error: function() {
				$('#profile-tip').hide();
			}
		});
		clearInterval(TipTimer);
		}, 500);
	}
}
$(document).ready(function() {
$('#profile-tip').mouseleave(function() {
		$('#profile-tip').hide();
	});});
</script>
</head>
<body>
<div class="msg_body" id="message1">
<div class="msg_img">
<img onmouseover="profileTip(1, 1, 0)" onmouseout="profileTip(0, 0, 1);" onclick="profileTip(0, 0, 1);" src="https://fbcdn-sphotos-e-a.akamaihd.net/hphotos-ak-xpf1/v/t1.0-9/13006593_928276600624907_1562762474596855133_n.jpg?oh=b52db7cff5b70d0164e4165266fce254&oe=5804960C&__gda__=1476341606_074c2045a664073ca8826ac753fb99f4" />
</div> 
</div>
<div id="profile-tip"></div></body>
</html>

Fico no aguardo... :)

 

Compartilhar este post

Link para o post
Compartilhar em outros sites

gabrieldarezzo    255

gabrieldarezzo
Postado

Algum erro durante o evento do onmouseout?

 

Deixa o dev console aberto e tenta refazer o teste.

 

Ou enfiar um

console.log('Função onmouseout ativa');

Compartilhar este post

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

  • Conteúdo Similar

    • ILR master
      Abrir url na mesma janela
      Por ILR master
      Pessoal, pergunta bem simples. Abaixo tenho o seguinte código:
       
      <script>
      function alerta()
      {
        if (window.confirm("Você realmente quer sair?")) {
          window.open("sair.html");
      }
      }
      </script>
       
      Funciona perfeitamente, só que está abrindo em outra janela e quero que abra na mesma janela.
       
      Alguém pode me ajudar?
    • Giovanird
      Atualizar pagina PHP que esta dentro de uma div
      Por Giovanird
      Olá a todos!
      Tenho uma pagina que possui uma DIV onde coloquei uma pagina PHP.
      Uso a função setInterval para atualizar a pagina inclusa dentro da DIV.
      O problema é que ao acessar o site , a DIV só me mostra a pagina inclusa somente quando completo o primeiro minuto.
      Preciso que a pagina inclusa já inicie carregada
       
      Meu código JavaScript e a DIV com a pagina PHP
       
      <script> function atualiza(){ var url = 'direita.php'; $.get(url, function(dataReturn) { $('#direita').html(dataReturn); }); } setInterval("atualiza()",60000); </script> <div> <span id="direita"></span> </div>  
    • Thiago Duarte
      Drag and Drop para arrastar imagem
      Por Thiago Duarte
      Oi, gostaria de arrastar imagem e ao soltar formar bloco html, meu bloco de html ficaria com nome, content-1.html, content-2.html, etc
       
      Alguem pode me ajudar?
    • belann
      Upload de arquivos com javascript
      Por belann
      Olá!
       
      Estou fazendo o upload de arquivos com fetch dessa forma
      fetch(url, {
              method: 'POST',
              headers: {'Content-Type': 'multipart/form-data',},
              body: formData 
          }).catch((error) => (console.log("Problemas com o Upload"), error));
       
      estou usando input type=file
      e criando uma const formData = new FormData(); 
      mas não faz e não dá nenhum erro.
      estou fazendo o upload com a url="http://localhost/dashboard/dados".
×

Informação importante

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

  Aceito