0

Estou fazendo um submenu e quando passo o mouse numa opção mostra uma div com diversas opções, daí fiz um mouseout na classe dessa div para esconder ela mas a questão é que ela some mesmo navegando dentro dela.

Segue o código para quem poder ajudar:

$("#marcas_menu").mouseover(function(){
  $('.marcas').css({'display':'block'});
})

$(".marcas").mouseout(function(){
  $('.marcas').css({'display':'none'});
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>


    <div class="marcas">	
    <div class="femininos">
		  <div class="border_tab"><h4>Femininos</h4></div>			
			<div>
				<ul>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
			</ul>	
			<a href="#">Ver Todos</a>	
			</div>					
		</div>

		<div class="masculinos">
		<div class="border_tab"><h4>Masculinos</h4></div>
					<div>
				<ul>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
			</ul>	
			<a href="#">Ver Todos</a>
			</div>	
		</div>

		<div class="infantis">
		<div class="border_tab"><h4>Infantis</h4></div>
					<div>
				<ul>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
				<li>Lorem lpsum</li>
			</ul>
			<a href="#">Ver Todos</a>	
			</div>		
		</div>

		<div class="imagem_aqui"></div>
		
	</div> <!-- fim marcas -->

inserir a descrição da imagem aqui

2
  • Se #marcas está fora de #marcas_menu então quando mexe o rato para ficar em cima de #marcas já não está em #marcas_menu e por isso fecha. Uma solução simples é colocar o html de #marcas dentro de #marcas_menu
    – Isac
    Commented 5/08/2017 às 21:29
  • no caso #marcas_menu esta na LI marcas ainda estou tentando algo :) Commented 5/08/2017 às 22:01

1 Resposta 1

1

Troque o mouseout por mouseleave.

O mouseout é acionado quando o cursor sai de qualquer elemento-filho ou do próprio elemento. Já o mouseleave só é acionado quando o cursor sai do elemento todo.

1
  • deu certo! obrigado! Commented 6/08/2017 às 4:19

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .