Ir para conteúdo

Arquivado

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

Gerciley

hide(); show(); evento do mause

Por , em Javascript

Recommended Posts

Gerciley    14

Gerciley
Postado

Galera, modelo simples de código Jquery não quer funcionar de jeito nenhum!

$(document).ready(function(e) {
    $(".descMiniVideo").hide();
});

$(".control").mouseover(function(){
    $(".descMiniVideo").show(2000);
    })
    
$(".control").mouseout(function(){
    $(".descMiniVideo").hide(2000);
    })

html....

<div class="itemVideo">
    <a  class="control" href="#">
         <div class="descMiniVideo">
         <span>Título do Vídeo</span>
         </div>
         <img alt="Título do Vídeo" src="miniaturas/hqdefault.jpg"/>
    </a>
</div>

ao entrar com o mouse sobre a imagem a div descMiniVideo que está sobrepondo a imagem deve aparecer com o título do vídeo, ao sair deve desaparecer!

Compartilhar este post

Link para o post
Compartilhar em outros sites

gabrieldarezzo    255

gabrieldarezzo
Postado

Tenta entender individualmente oq cada um desses caras fazem. (e olhar o console do dev-tools)

De forma resumida esse carinha aqui, avisa..."Ei só vamos começar a brincar quando o 'document' estiver 'ready',

Ou seja faz sentido você 'jogar' tudo que é de jQuery dentro dele....

$(document).ready(function() {
  //Here 
});

Exemplo:

<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title></title>
</head>
<body>

<div class="itemVideo">
    <a  class="control" href="#">
         <div class="descMiniVideo">
         <span>Título do Vídeo</span>
         </div>
         <img alt="Título do Vídeo" src="https://www.wired.com/wp-content/uploads/2015/09/google-logo-1200x630.jpg" style="width: 400px" />
		 
		 
    </a>
</div>
	
	
	<script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script>
	<script type="text/javascript">
		$(document).ready(function() {
			//Esconde
			$(".descMiniVideo").hide();
		 
		 
			$( ".control" ).bind( "mouseover", function() {
				$(".descMiniVideo").show(2000);
			});
			
			$( ".control" ).bind( "mouseout", function() {
				$(".descMiniVideo").hide(2000);
			});
		});
	
	
	</script>


</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Gerciley    14

Gerciley
Postado

Gabriel, obrigado pela resposta,

eu já havia feito dessa maneira.. mas ele fica num loop.. exibindo e aparecendo direto....

$(document).ready(function(e) {
	$("#headFix").stop().animate({opacity:0 }, 0);
	$(".descMiniVideo").hide();
	
	//exibe
	$(".control").mouseover(function(){
		$(".descMiniVideo").show("fast");
		})
		
	//oculta
	$(".control").mouseout(function(){
		$(".descMiniVideo").hide("fast");
		})
});

Compartilhar este post

Link para o post
Compartilhar em outros sites

sampaioops    1

sampaioops
Postado

tente usar essa logica, alterando da sua forma...

    function onMenu(){
        document.getElementById('dropdown').style.display = "block";
    }
    function outMenu(){
        document.getElementById('dropdown').style.display = "none";
    }

html:

<html>
<head>

    <title>Menu</title>       

</head>
    <body>

<div style="float: left" id="menu" onMouseOver="onMenu()" onMouseOut="outMenu()"><a> Mais opções</a>
        <div id="dropdown" style="display: none;"> 
             <a href="#">BLABLA</a><BR /> 
             <a href="#">BLABLA</a> 
      </div> 
   </div> 

    </body>
</html>

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