I'm doing a submenu and when I move the mouse in an option it shows a div
with several options, so I made a mouseout
in the class of that div
to hide it but the question is that it even surfing inside it.
Follow the code for who can help:
$("#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><divclass="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 -->